/* ============================================
   COLETTE SHELL — v1.0.0
   Single source of truth for shared CSS across all pages.
   Loaded by every page via <link rel="stylesheet" href="/preview/_shell/shell.css">
   ============================================ */

/* 1. ANTI-BLACK-SCREEN — orphan body.page-id-XXX rule (sans child selector) hides whole body.
   Reset body display/opacity/visibility on every known page-id that has bug. */
body.page-id-37290,body.page-id-37291,body.page-id-37292,body.page-id-37293,
body.page-id-37295,body.page-id-37346,body.page-id-37347,body.page-id-37349,
body.page-id-37351,body.page-id-37352,body.page-id-37353,body.page-id-37355,
body.page-id-37457,body.page-id-37459,body.page-id-37461,body.page-id-37465,
body.page-id-37471,body.page-id-37534{
  display:block!important;opacity:1!important;visibility:visible!important;
  background:#0a0a0a!important;color:#edece8!important
}
body.page-id-37290 *,body.page-id-37291 *,body.page-id-37292 *,body.page-id-37293 *,
body.page-id-37295 *,body.page-id-37346 *,body.page-id-37347 *,body.page-id-37349 *,
body.page-id-37351 *,body.page-id-37352 *,body.page-id-37353 *,body.page-id-37355 *,
body.page-id-37457 *,body.page-id-37459 *,body.page-id-37461 *,body.page-id-37465 *,
body.page-id-37471 *,body.page-id-37534 *{
  opacity:1!important;visibility:visible!important
}

/* 2. NAV OVERFLOW FIX — dropdown needs overflow:visible on every parent */
#colette-topnav,header,#primary-nav,.navbar-links,#nav-links,.dropdown{overflow:visible!important}

/* 2b. NAV LAYOUT — force flex row + horizontal alignment on #colette-topnav itself
   (some legacy pages have CSS that breaks this; inline style alone isn't enough) */
html body #colette-topnav{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:nowrap!important;
  gap:16px!important
}
html body #colette-topnav > *{flex-shrink:0!important}
html body #colette-topnav > div{display:flex!important;flex-direction:row!important;align-items:center!important}
.dropdown{position:relative!important}
.dropdown-menu{z-index:9999999!important;position:absolute!important;overflow:visible!important}
.dropdown.colette-open .dropdown-menu{display:block!important;visibility:visible!important;opacity:1!important}
.dropdown-menu a{display:block!important;color:#edece8!important;padding:10px 16px!important;font-size:14px!important;text-decoration:none!important;white-space:nowrap!important}
.dropdown-menu a:hover{color:#e1ad42!important;background:rgba(225,173,66,0.1)!important}

/* 3. NAV LAYOUT — navbar-links pushed to RIGHT on desktop */
@media(min-width:900px){
  html body #colette-topnav>div.navbar-links,
  html body #colette-topnav .navbar-links,
  html body #colette-topnav #nav-links{
    display:flex!important;align-items:center!important;gap:24px!important;margin-left:auto!important
  }
  html body #colette-topnav #hamburger,html body #hamburger{display:none!important}
}

/* 4. MOBILE BURGER — visible <900px, navbar-links hidden */
@media(max-width:899px){
  html body .navbar-links,html body #nav-links{display:none!important}
  html body #hamburger{
    display:flex!important;flex-direction:column;justify-content:center;align-items:center;
    padding:10px;min-width:44px;min-height:44px;cursor:pointer;background:transparent;border:0
  }
  html body #hamburger>span{display:block;width:22px;height:2px;background:#edece8;margin:3px 0}
}

/* 5. MOBILE OVERLAY — same look as injected and existing */
html body #colette-mobile-overlay-injected,html body #mobile-overlay{
  display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;
  background:#0a0a0a;z-index:99999;flex-direction:column;justify-content:center;align-items:center
}
html body #colette-mobile-overlay-injected.open,html body #mobile-overlay.open{display:flex!important}
html body #colette-mobile-overlay-injected .close-btn,html body #mobile-overlay button[aria-label="Close"]{
  position:absolute;top:16px;right:20px;background:transparent;border:0;color:#edece8;font-size:36px;cursor:pointer
}
html body #colette-mobile-overlay-injected a,html body #mobile-overlay nav a{
  color:#edece8;text-decoration:none;padding:8px 16px;font-size:16px;letter-spacing:2px;
  text-transform:uppercase;font-family:Poppins,sans-serif
}
html body #colette-mobile-overlay-injected a:hover,html body #colette-mobile-overlay-injected a:active,
html body #mobile-overlay nav a:hover{color:#e1ad42}

/* 6. HOVER STATE — gold accent across nav links */
.navbar-links a:hover,.dropdown:hover>a,.lang-selector a:hover,#nav-links a:hover{color:#e1ad42!important}

/* 7. ANTI-HORIZONTAL-OVERFLOW — prevent any rogue child from creating scroll */
html,body{overflow-x:hidden!important}

/* 8. HIDE GENERATEPRESS THEME CHROME — sibling navs that duplicate the Colette nav
   Covers static cached pages where snippet 79 wp_head injection doesn't fire.
   Restricted to body.wp-child-theme-colette-theme so it only affects Colette pages. */
body.wp-child-theme-colette-theme #masthead,
body.wp-child-theme-colette-theme .site-header,
body.wp-child-theme-colette-theme .main-navigation,
body.wp-child-theme-colette-theme #site-navigation,
body.wp-child-theme-colette-theme #mobile-menu-control-wrapper,
body.wp-child-theme-colette-theme .mobile-menu-control-wrapper,
body.wp-child-theme-colette-theme .entry-header,
body.wp-child-theme-colette-theme #right-sidebar,
body.wp-child-theme-colette-theme .widget-area,
body.wp-child-theme-colette-theme .site-footer,
body.wp-child-theme-colette-theme #footer-widgets{display:none!important}
body.wp-child-theme-colette-theme #page,
body.wp-child-theme-colette-theme .site,
body.wp-child-theme-colette-theme .site-content,
body.wp-child-theme-colette-theme .container,
body.wp-child-theme-colette-theme .grid-container{max-width:100%!important;padding:0!important;margin:0!important}
body.wp-child-theme-colette-theme .inside-article,
body.wp-child-theme-colette-theme article.post,
body.wp-child-theme-colette-theme article.page,
body.wp-child-theme-colette-theme .entry-content{padding:0!important;margin:0!important;max-width:100%!important}
body.wp-child-theme-colette-theme .content-area{width:100%!important;max-width:100%!important}
body.wp-child-theme-colette-theme{margin:0!important;padding:0!important}
