/* === Palette Variables === */
:root{
  --primary-color:#2563eb;      /* buttons, links, focus */
  --primary-dark:#1e4ed8;       /* hover/border */
  --text-dark:#2c3f4c;          /* page base */
  --text-light:#718593;         /* secondary text */
  --bg-light:#f5f7f8;           /* light surfaces */
  --border-color:#d0d7de;       /* dividers/lines */
  --border-color-dark:#3b4b58;  /* optional dark dividers */
}

.ui.inverted.segment,
.ui.primary.inverted.segment{
  background:#2c3f4c;
  color:rgba(255,255,255,.9);
}

hr,.ui.divider{border-color:var(--border-color) !important;}

:focus-visible{
  outline:2px solid #93c5fd;
  outline-offset:2px;
}

#home-logo .ui.mini.image{
  height:80px;
  width:auto;
}

#topleft_menu.ui.menu{
  min-height:100px !important;
}

#topleft_menu.ui.menu span.left.item{
  display:flex !important;
  align-items:center !important;
  gap:1rem;
  height:100px !important;
}

#topleft_menu.ui.menu div.right.menu.item{
  display:flex !important;
  align-items:center !important;
  height:100px !important;
}

#topleft_menu.ui.menu > .item{
  height:100px !important;
}

#topleft_menu.ui.menu div.right.menu.item .item,
#topleft_menu.ui.menu div.right.menu.item a,
#topleft_menu.ui.menu div.right.menu.item .button{
  font-size:18px !important;
}

.ui.button.style_button{
  background:var(--primary-color) !important;
  color:#fff !important;
  border:1px solid var(--primary-dark) !important;
  box-shadow:none !important;
}
.ui.button.style_button:hover{
  background:var(--primary-dark) !important;
  color:#fff !important;
}

#site-wide-competition-search .ui.input>input{
  border:1px solid var(--border-color) !important;
  background:#fff !important;
  color:var(--text-dark) !important;
}
#site-wide-competition-search .ui.input>input:focus{
  border-color:var(--primary-color) !important;
  outline:2px solid #93c5fd;
  outline-offset:1px;
}

@media (max-width:768px){
  #home-logo .ui.mini.image{height:60px;}
  #topleft_menu.ui.menu{min-height:80px !important;}
  #topleft_menu.ui.menu span.left.item,
  #topleft_menu.ui.menu div.right.menu.item,
  #topleft_menu.ui.menu > .item{
    height:80px !important;
  }
}

@media (max-width:480px){
  #home-logo .ui.mini.image{height:40px;}
  #topleft_menu.ui.menu{min-height:60px !important;}
  #topleft_menu.ui.menu span.left.item,
  #topleft_menu.ui.menu div.right.menu.item,
  #topleft_menu.ui.menu > .item{
    height:60px !important;
  }
}