/*! Custom Branding CSS - TMX TGE */

/* Page Background */
body{
  background-color:#FAFAFA!important;
}

/* Top Bar (dark header strip) */
.header,
.header-main,
.nk-header{
  background-color:#17354B!important;
  border-color:#17354B!important;
  color:#FFFFFF!important;
}

/* Navbar (menu row) */
.navbar,
.navbar-default,
.navbar-nav{
  background-color:#FFFFFF!important;
  border-color:#FFFFFF!important;
  color:#000000!important;
}

/* Navbar link hover */
.navbar a:hover,
.navbar-nav a:hover,
.navbar-menu a:hover,
.navbar-page a:hover{
  color:#555555!important;
}

/* --- Fixed header layout --- */
.topbar-wrap{position:static!important;}

.topbar{
  position:fixed!important;
  top:0;left:0;right:0;
  z-index:1100;
  height:92px;            /* adjust if your topbar height differs */
}

.navbar{
  position:fixed!important;
  top:92px;               /* must equal .topbar height */
  left:0;right:0;
  z-index:1099;
  background:#fff;
  overflow:visible!important;  /* allow dropdowns to escape */
}

/* Offset page so content isn't hidden under fixed bars */
.page-content{
  padding-top:192px;      /* topbar(92) + navbar(~100). Tweak if needed */
}

/* Buttons */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active{
  background-color:#FCC517!important;
  border-color:#FCC517!important;
  color:#000000!important;
}

/* Dashboard Logo */
.topbar-logo img{
  height:80px!important;
  max-height:none!important;
}

/* Auth Page Logo */
.page-ath-logo-img{
  height:132px!important;
  max-height:none!important;
  width:auto!important;
}

/* Make the "Sign in" heading smaller */
.page-ath-heading {
  font-size: 34px !important;   /* adjust to your preference */
  font-weight: 600;             /* keep it bold but smaller */
}

/* Misc */
.user-account-dashboard .content-area .card-full-height{
  text-align:center;
}

/* ----------------------------- */
/* Language switcher in navbar   */
/* ----------------------------- */

.navbar .nav-lang{
  position:relative;
  margin-left:16px;
}

/* Toggle as horizontal pill */
.navbar .nav-lang > a,
.navbar .nav-lang > button,
.navbar .nav-lang .btn{
  display:inline-flex!important;
  align-items:center;
  gap:8px;                       /* space between EN and caret */
  padding:8px 16px!important;    /* horizontal oval */
  line-height:1.2!important;
  border-radius:9999px!important;
  border:1px solid rgba(23,53,75,.30)!important;
  background:#fff!important;
}

/* If theme forces a circular class, still keep pill */
.navbar .nav-lang > a[class*="circle"],
.navbar .nav-lang > button[class*="circle"],
.navbar .nav-lang .btn[class*="circle"]{
  border-radius:9999px!important;
}

/* Dropdown should open downward from the pill */
.navbar .nav-lang .dropdown-content{
  position:absolute;
  top:calc(100% + 10px)!important;  /* below toggle with a small gap */
  bottom:auto!important;
  right:0;                          /* align right edge with the pill */
  min-width:160px;
  padding:8px 0!important;          /* inner padding of menu box */
  border-radius:12px;
  background:#fff;
  box-shadow:0 12px 32px rgba(17,24,39,0.18);
  z-index:1205;
}

/* Dropdown arrow reoriented for downward menu */
.navbar .nav-lang .dropdown-content:before,
.navbar .nav-lang .dropdown-content:after{
  content:"";
  position:absolute;
  left:auto;right:20px;
  top:-8px;bottom:auto;
  border:8px solid transparent;
}
.navbar .nav-lang .dropdown-content:after{
  border-bottom-color:#fff!important;   /* arrow color matches menu bg */
}

/* Menu items: padding + hover */
.navbar .nav-lang .dropdown-content a,
.navbar .nav-lang .dropdown-content .dropdown-item,
.navbar .nav-lang .dropdown-content li > a{
  display:block;
  padding:10px 14px;
  font-size:14px;
  line-height:1.2;
  color:#41546e;
  white-space:nowrap;
}
.navbar .nav-lang .dropdown-content a:hover,
.navbar .nav-lang .dropdown-content .dropdown-item:hover,
.navbar .nav-lang .dropdown-content li > a:hover{
  background:#f5f7fb;
  color:#17354B;
}
