/*
 * TSA Yazılım V176
 * Fixed header + dedicated header/footer logo variants.
 * This file is deliberately isolated from the V158/V171 theme rules so the
 * homepage widget layout and prior responsive revisions remain unchanged.
 */
:root{
  --tsa-topbar-fixed-height:38px;
  --tsa-header-fixed-height:96px;
  --tsa-fixed-shell-height:calc(var(--tsa-topbar-fixed-height) + var(--tsa-header-fixed-height));
}

/* Keep both navigation rows visible and stable while scrolling. */
body.app-shell{
  padding-top:var(--tsa-fixed-shell-height)!important;
}
html{
  scroll-padding-top:calc(var(--tsa-fixed-shell-height) + 18px);
}
.topbar{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:1002!important;
  min-height:var(--tsa-topbar-fixed-height)!important;
  box-shadow:none!important;
}
.topbar .container{
  height:var(--tsa-topbar-fixed-height)!important;
}
.header{
  position:fixed!important;
  top:var(--tsa-topbar-fixed-height)!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  z-index:1001!important;
  background:rgba(255,255,255,.98)!important;
  border-bottom:1px solid rgba(6,26,47,.10)!important;
  box-shadow:0 10px 32px rgba(6,26,47,.10)!important;
  backdrop-filter:saturate(150%) blur(16px)!important;
  -webkit-backdrop-filter:saturate(150%) blur(16px)!important;
}
.header .container.header-inner,
.header-inner{
  height:var(--tsa-header-fixed-height)!important;
  min-height:var(--tsa-header-fixed-height)!important;
  max-height:var(--tsa-header-fixed-height)!important;
  overflow:visible!important;
}

/* Header: navy/gold logo, readable and proportional on a white background. */
.header .brand.has-logo,
.header .brand[data-logo-active="1"],
.header .brand:has(.brand-image:not([hidden])){
  flex:0 1 360px!important;
  width:min(360px,31vw)!important;
  min-width:250px!important;
  max-width:360px!important;
  overflow:visible!important;
}
.header .brand.has-logo .brand-image,
.header .brand[data-logo-active="1"] .brand-image,
.header .brand:has(.brand-image:not([hidden])) .brand-image{
  width:100%!important;
  max-width:360px!important;
  height:72px!important;
  max-height:72px!important;
  object-fit:contain!important;
  object-position:left center!important;
  transform:none!important;
  filter:none!important;
  opacity:1!important;
  visibility:visible!important;
}
.header .brand-image[data-brand-logo="header"]{
  content:url('/assets/images/tsa-yazilim-logo-header.png');
}
.header .nav{
  margin-left:auto!important;
}

/* Footer: dedicated white/gold logo for the dark navy background. */
.footer .brand.has-logo,
.footer .brand[data-logo-active="1"],
.footer .brand:has(.brand-image:not([hidden])){
  width:100%!important;
  max-width:390px!important;
  min-width:0!important;
  justify-content:flex-start!important;
  overflow:visible!important;
}
.footer .brand.has-logo .brand-image,
.footer .brand[data-logo-active="1"] .brand-image,
.footer .brand:has(.brand-image:not([hidden])) .brand-image{
  width:min(100%,390px)!important;
  max-width:390px!important;
  height:auto!important;
  max-height:84px!important;
  object-fit:contain!important;
  object-position:left center!important;
  transform:none!important;
  filter:drop-shadow(0 5px 14px rgba(0,0,0,.22))!important;
  opacity:1!important;
  visibility:visible!important;
}
.footer .brand-image[data-brand-logo="footer"]{
  content:url('/assets/images/tsa-yazilim-logo-footer.png');
}

/* Mobile drawer uses the navy/gold header variant and never overflows. */
.mobile-panel .brand-image[data-brand-logo="mobile"]{
  content:url('/assets/images/tsa-yazilim-logo-header.png');
  width:min(230px,64vw)!important;
  max-width:230px!important;
  height:auto!important;
  max-height:58px!important;
  object-fit:contain!important;
  object-position:left center!important;
  transform:none!important;
  filter:none!important;
}

@media (max-width:1220px){
  :root{
    --tsa-header-fixed-height:86px;
  }
  .header .brand.has-logo,
  .header .brand[data-logo-active="1"],
  .header .brand:has(.brand-image:not([hidden])){
    flex-basis:330px!important;
    width:min(330px,58vw)!important;
    min-width:220px!important;
    max-width:330px!important;
  }
  .header .brand.has-logo .brand-image,
  .header .brand[data-logo-active="1"] .brand-image,
  .header .brand:has(.brand-image:not([hidden])) .brand-image{
    max-width:330px!important;
    height:66px!important;
    max-height:66px!important;
  }
}

@media (max-width:820px){
  :root{
    --tsa-topbar-fixed-height:34px;
    --tsa-header-fixed-height:76px;
  }
  .topbar .container{
    height:var(--tsa-topbar-fixed-height)!important;
  }
  .header .container.header-inner,
  .header-inner{
    padding-left:max(14px,env(safe-area-inset-left))!important;
    padding-right:max(14px,env(safe-area-inset-right))!important;
  }
  .header .brand.has-logo,
  .header .brand[data-logo-active="1"],
  .header .brand:has(.brand-image:not([hidden])){
    flex:0 1 auto!important;
    width:min(270px,70vw)!important;
    min-width:0!important;
    max-width:270px!important;
  }
  .header .brand.has-logo .brand-image,
  .header .brand[data-logo-active="1"] .brand-image,
  .header .brand:has(.brand-image:not([hidden])) .brand-image{
    width:100%!important;
    max-width:270px!important;
    height:56px!important;
    max-height:56px!important;
  }
  .footer .brand.has-logo .brand-image,
  .footer .brand[data-logo-active="1"] .brand-image,
  .footer .brand:has(.brand-image:not([hidden])) .brand-image{
    width:min(100%,320px)!important;
    max-width:320px!important;
    max-height:72px!important;
  }
}

@media (max-width:480px){
  :root{
    --tsa-topbar-fixed-height:32px;
    --tsa-header-fixed-height:70px;
  }
  .topbar{font-size:.68rem!important}
  .header .brand.has-logo,
  .header .brand[data-logo-active="1"],
  .header .brand:has(.brand-image:not([hidden])){
    width:min(225px,68vw)!important;
    max-width:225px!important;
  }
  .header .brand.has-logo .brand-image,
  .header .brand[data-logo-active="1"] .brand-image,
  .header .brand:has(.brand-image:not([hidden])) .brand-image{
    max-width:225px!important;
    height:50px!important;
    max-height:50px!important;
  }
  .mobile-panel .brand-image[data-brand-logo="mobile"]{
    width:min(205px,60vw)!important;
    max-width:205px!important;
    max-height:52px!important;
  }
}

/* Admin bar or logged-in preview must not be covered by the public header. */
body.admin-bar .topbar{top:32px!important}
body.admin-bar .header{top:calc(32px + var(--tsa-topbar-fixed-height))!important}
body.admin-bar.app-shell{padding-top:calc(32px + var(--tsa-fixed-shell-height))!important}