/* =========================================================
   PHASE 13: SITE-WIDE NAV + THEME + MOBILE HERO STABILIZER
   Applies after earlier phase CSS. Desktop hero remains intact.
   ========================================================= */

/* Hide the red announcement strip site-wide. The admission CTA now lives in page content, not above the navbar. */
.u-announcement{display:none!important;visibility:hidden!important;height:0!important;min-height:0!important;padding:0!important;border:0!important;overflow:hidden!important;}

:root{
  --u-bg:#05080f;
  --u-bg-2:#07111d;
  --u-surface:rgba(14,22,38,.84);
  --u-surface-solid:#111827;
  --u-text:#fff8e9;
  --u-muted:#b9af9a;
  --u-border:rgba(230,199,102,.18);
  --u-border-strong:rgba(230,199,102,.34);
  --u-gold:#e6c766;
  --u-gold-2:#f5dc96;
  --u-maroon:#6e0e1b;
}

html[data-theme="light"]{
  --ink:#f7f3ea;
  --navy:#fffaf0;
  --navy-2:#f4ead6;
  --cream:#1d2430;
  --white:#111827;
  --muted:#5b6472;
  --surface-1:rgba(255,255,255,.82);
  --surface-2:rgba(255,255,255,.94);
  --glass:rgba(0,0,0,.035);
  --glass-2:rgba(0,0,0,.06);
  --border:rgba(117,86,20,.18);
  --border-2:rgba(117,86,20,.30);
  --u-bg:#f7f3ea;
  --u-bg-2:#fffaf0;
  --u-surface:rgba(255,255,255,.90);
  --u-surface-solid:#ffffff;
  --u-text:#111827;
  --u-muted:#4b5563;
  --u-border:rgba(100,72,16,.18);
  --u-border-strong:rgba(100,72,16,.34);
}

html[data-theme="light"] body{
  background:
    radial-gradient(ellipse 900px 560px at 0% 0%, rgba(230,199,102,.25), transparent 55%),
    radial-gradient(ellipse 700px 480px at 100% 0%, rgba(110,14,27,.10), transparent 55%),
    linear-gradient(180deg,#fffaf0 0%,#f7f3ea 100%)!important;
  color:var(--u-text)!important;
}
html[data-theme="light"] p,
html[data-theme="light"] small,
html[data-theme="light"] .muted{color:var(--u-muted)!important;}
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] h6{color:#111827!important;}
html[data-theme="light"] .card,
html[data-theme="light"] .glass,
html[data-theme="light"] .panel,
html[data-theme="light"] .featureCard,
html[data-theme="light"] .p8-card,
html[data-theme="light"] .phaseCard,
html[data-theme="light"] .galleryCard,
html[data-theme="light"] .eventCard,
html[data-theme="light"] .diary-card,
html[data-theme="light"] .noticeCard,
html[data-theme="light"] .mat-card,
html[data-theme="light"] .yt-card{
  background:rgba(255,255,255,.86)!important;
  border-color:rgba(117,86,20,.18)!important;
  color:#111827!important;
  box-shadow:0 16px 48px rgba(17,24,39,.10)!important;
}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:#ffffff!important;
  color:#111827!important;
  border-color:rgba(117,86,20,.22)!important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{color:#6b7280!important;}

/* Professional shared navbar */
.siteNav, header.nav{
  top:0!important;
  z-index:3000!important;
  height:64px!important;
  background:rgba(5,8,15,.92)!important;
  border-bottom:1px solid rgba(230,199,102,.18)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.24)!important;
}
html[data-theme="light"] .siteNav,
html[data-theme="light"] header.nav{
  background:rgba(255,250,240,.94)!important;
  border-bottom-color:rgba(117,86,20,.20)!important;
  box-shadow:0 10px 30px rgba(17,24,39,.08)!important;
}
.navInner,.navbar{
  width:min(1320px, calc(100vw - 28px))!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin-inline:auto!important;
}
.brand,.navbar .brand{
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  flex:0 0 auto!important;
  margin-right:8px!important;
}
.brand img,.brandMark img{
  width:42px!important;
  height:42px!important;
  object-fit:contain!important;
  border-radius:13px!important;
  background:rgba(9,15,28,.70)!important;
  border:1px solid rgba(230,199,102,.22)!important;
}
html[data-theme="light"] .brand img,
html[data-theme="light"] .brandMark img{background:#fff!important;border-color:rgba(117,86,20,.18)!important;}
.brandText{
  color:var(--u-text)!important;
  font-weight:900!important;
  letter-spacing:.065em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.desktopMenu{
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:4px!important;
  min-width:0!important;
}
.desktopMenu a,.moreBtn{
  color:rgba(250,239,214,.78)!important;
  border-radius:12px!important;
  min-height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
}
.desktopMenu a:hover,.desktopMenu a[aria-current="page"],.moreBtn:hover{
  color:var(--u-gold-2)!important;
  background:rgba(230,199,102,.10)!important;
}
html[data-theme="light"] .desktopMenu a,
html[data-theme="light"] .moreBtn{color:#374151!important;}
html[data-theme="light"] .desktopMenu a:hover,
html[data-theme="light"] .desktopMenu a[aria-current="page"],
html[data-theme="light"] .moreBtn:hover{color:#6e4a06!important;background:rgba(117,86,20,.08)!important;}
.navActions{
  margin-left:8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex:0 0 auto!important;
}
.notice-bell,.header-bell,.themeToggle,.menuBtn{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  border:1px solid rgba(230,199,102,.18)!important;
  background:rgba(255,255,255,.055)!important;
  color:var(--u-gold-2)!important;
  box-shadow:none!important;
}
.themeToggle{font-size:17px!important;line-height:1!important;}
.menuBtn{font-size:25px!important;font-weight:900!important;}
html[data-theme="light"] .notice-bell,
html[data-theme="light"] .header-bell,
html[data-theme="light"] .themeToggle,
html[data-theme="light"] .menuBtn{
  background:#fff!important;
  color:#6e4a06!important;
  border-color:rgba(117,86,20,.20)!important;
}
.applyBtn{
  min-height:46px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  padding:0 19px!important;
  background:linear-gradient(135deg,#f5dc96,#e6c766,#c8a03c)!important;
  color:#160b00!important;
  font-weight:950!important;
  letter-spacing:.01em!important;
  white-space:nowrap!important;
  box-shadow:0 12px 34px rgba(200,160,60,.20)!important;
}
.mobileDrawer{
  z-index:3100!important;
  background:linear-gradient(180deg,rgba(8,12,22,.98),rgba(12,18,32,.98))!important;
}
html[data-theme="light"] .mobileDrawer{background:linear-gradient(180deg,#fffaf0,#ffffff)!important;color:#111827!important;}
html[data-theme="light"] .drawerLinks a{color:#111827!important;border-color:rgba(117,86,20,.18)!important;background:rgba(117,86,20,.05)!important;}

/* Mobile navbar: logo left, bell/theme/menu right. No red strip, no crowded CTA. */
@media (max-width:860px){
  .siteNav,header.nav{height:66px!important;}
  .navInner,.navbar{width:calc(100vw - 18px)!important;gap:8px!important;}
  .desktopMenu{display:none!important;}
  .brand{margin-right:auto!important;}
  .brandText{display:none!important;}
  .brand img,.brandMark img{width:44px!important;height:44px!important;}
  .navActions{margin-left:auto!important;gap:7px!important;}
  .applyBtn{display:none!important;}
  .notice-bell,.header-bell,.themeToggle,.menuBtn{width:44px!important;height:44px!important;min-width:44px!important;border-radius:13px!important;}
  .menuBtn{display:inline-flex!important;order:4!important;}
  .themeToggle{order:3!important;}
  .notice-bell,.header-bell{order:2!important;}
}
@media (max-width:380px){
  .navInner,.navbar{width:calc(100vw - 12px)!important;gap:5px!important;}
  .brand img,.brandMark img{width:40px!important;height:40px!important;}
  .notice-bell,.header-bell,.themeToggle,.menuBtn{width:40px!important;height:40px!important;min-width:40px!important;border-radius:12px!important;}
}

/* FINAL mobile homepage hero: one clean full-image hero. No split hero, no double image stack. */
@media (max-width:760px){
  body{padding-top:0!important;}
  .hp-hero{
    height:calc(100svh - 66px)!important;
    min-height:610px!important;
    max-height:760px!important;
    margin-top:0!important;
    background:#05080f!important;
  }
  .hp-hero__media,
  #heroMedia{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    background:#05080f!important;
  }
  .heroSlide{display:none!important;opacity:0!important;visibility:hidden!important;}
  .heroFallback{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 18%!important;
    filter:saturate(.96) contrast(1.04) brightness(.78)!important;
    transform:none!important;
  }
  .hp-hero__media img,
  .hp-hero__media video,
  .heroSlideMedia{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 18%!important;
    transform:none!important;
  }
  .hp-hero__media::after{display:none!important;}
  .hp-hero__shade{
    position:absolute!important;
    inset:0!important;
    background:
      linear-gradient(180deg,rgba(5,8,15,.05) 0%,rgba(5,8,15,.10) 34%,rgba(5,8,15,.66) 66%,rgba(5,8,15,.96) 100%),
      linear-gradient(90deg,rgba(5,8,15,.58),rgba(5,8,15,.12))!important;
  }
  .heroGoldOrb{display:none!important;}
  .hp-hero__content{
    left:14px!important;
    right:14px!important;
    bottom:72px!important;
    max-width:none!important;
    padding:16px 14px 15px!important;
    border-radius:20px!important;
    background:linear-gradient(135deg,rgba(5,8,15,.78),rgba(5,8,15,.48))!important;
    border:1px solid rgba(230,199,102,.18)!important;
    box-shadow:0 20px 50px rgba(0,0,0,.38)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
  }
  .hp-hero__kicker{font-size:9.5px!important;letter-spacing:.16em!important;margin-bottom:8px!important;}
  .hp-hero__title{font-size:clamp(32px,10vw,44px)!important;line-height:.96!important;max-width:12ch!important;margin-bottom:10px!important;color:#fff!important;}
  .hp-hero__sub{display:block!important;font-size:13px!important;line-height:1.45!important;color:rgba(250,239,214,.78)!important;margin-bottom:13px!important;max-width:36ch!important;}
  .hp-hero__actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;}
  .hp-btn-gold,.hp-btn-ghost{min-height:43px!important;border-radius:14px!important;padding:0 10px!important;font-size:12px!important;justify-content:center!important;}
  .hp-hero__ticker{bottom:12px!important;width:calc(100vw - 24px)!important;min-height:40px!important;padding:8px 10px!important;border-radius:13px!important;background:rgba(5,8,15,.78)!important;}
}
@media (max-width:430px){
  .hp-hero{min-height:590px!important;height:calc(100svh - 66px)!important;}
  .hp-hero__content{bottom:68px!important;padding:14px 12px!important;}
  .hp-hero__title{font-size:clamp(30px,9.5vw,38px)!important;}
  .hp-hero__sub{font-size:12px!important;}
  .hp-hero__actions{grid-template-columns:1fr!important;}
}
@media (max-height:680px) and (max-width:760px){
  .hp-hero{height:640px!important;min-height:640px!important;}
}

/* Admin chat message area stability */
.chatShell,.chatPanel,.chatBox{min-width:0!important;}
.chatMsgs{overflow:auto!important;}
.chatComposer{display:grid!important;grid-template-columns:minmax(160px,280px) minmax(220px,1fr) auto!important;gap:10px!important;align-items:center!important;}
.chatComposer input[type="file"],.chatComposer textarea,.chatComposer input[type="text"]{min-width:0!important;width:100%!important;}
@media (max-width:720px){.chatComposer{grid-template-columns:1fr!important}.chatComposer button{width:100%!important}}
