/* =====================================================================
   R10.26.0 — FULL-WIDTH SITE CHROME / STABLE R10.24 CONTENT LAYOUT
   The announcement bar and main header are true viewport-width bands.
   Page sections remain on the proven R10.24 geometry; only the chrome
   breaks out to the viewport edge.
   ===================================================================== */
:root{
  --r10260-header-glass:rgba(255,252,248,.86);
  --r10260-header-line:rgba(49,45,39,.09);
  --r10260-header-shadow:0 12px 32px rgba(39,31,25,.075);
}

html{overflow-x:hidden}

/* Full-bleed announcement bar, independent of any body/site max-width. */
body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .announcement-bar{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  border-left:0!important;
  border-right:0!important;
  border-radius:0!important;
  box-sizing:border-box!important;
  min-height:42px!important;
  padding-left:clamp(18px,4vw,72px)!important;
  padding-right:clamp(18px,4vw,72px)!important;
}

/* The whole header is the glass surface now — not a floating narrow card. */
body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  border-radius:0!important;
  box-sizing:border-box!important;
  background:linear-gradient(135deg,rgba(255,255,255,.90),rgba(255,249,243,.78))!important;
  -webkit-backdrop-filter:blur(22px) saturate(155%)!important;
  backdrop-filter:blur(22px) saturate(155%)!important;
  border-left:0!important;
  border-right:0!important;
  border-top:0!important;
  border-bottom:1px solid var(--r10260-header-line)!important;
  box-shadow:var(--r10260-header-shadow)!important;
  overflow:visible!important;
}

/* Keep controls comfortably centred, but let the header use modern wide screens. */
body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header .site-header-inner{
  width:min(1720px,calc(100% - 48px))!important;
  max-width:1720px!important;
  margin:0 auto!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Full-width Kente signature rule under the complete header. */
body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header::before{
  left:0!important;
  right:0!important;
  width:100%!important;
}

@media (min-width:1500px){
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header .site-header-inner{
    width:min(1720px,calc(100% - 72px))!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
}

@media (min-width:1261px){
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header .site-header-inner{
    min-height:78px!important;
  }
}

/* Tablet still receives the edge-to-edge header band; navigation can collapse
   according to the existing responsive logic without changing page geometry. */
@media (max-width:1260px) and (min-width:701px){
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header .site-header-inner{
    width:calc(100% - 32px)!important;
    max-width:none!important;
  }
}

/* R10.24 already owns the mobile header composition. Keep it full-bleed and
   only remove any later contained-card look that older desktop layers can add. */
@media (max-width:700px){
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .announcement-bar{
    width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header{
    width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:calc(50% - 50vw)!important;
  }
  body:not(.admin-app-body):not(.staff-auth-body):not(.install-body) > .theme-site-header .site-header-inner{
    width:100%!important;
    max-width:none!important;
  }
}