@import url("/brand/palette.css?v=20261002-palette-1");

/* Shared brand marks remain legible in light and dark themes. */
.site-brand-logo{display:block!important;width:216px!important;max-width:100%!important;height:auto!important;object-fit:contain!important}
.brand-mark{width:42px;height:42px;flex:none;border-radius:13px}
.admin-brand-heading{display:flex;align-items:center;gap:12px}.admin-brand-heading h1{margin:0}.admin-brand-heading .eyebrow{margin:0 0 4px}
@media(max-width:600px){.site-brand-logo{width:180px!important}.brand-mark{width:36px;height:36px}}

.admin-brand-heading img{flex:none;width:40px;height:40px}.recovery-entry{display:block;margin:14px 0;color:inherit;text-decoration:underline}

/* Brand colors shared by desktop and mobile. */
:focus-visible { outline-color: var(--wx-focus); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--wx-primary); }

/* Keep the header logo as tall as the desktop navigation buttons. */
.header > .container { display:flex;align-items:center;gap:24px;padding-inline:8px; }
.header .logo { flex:none;align-items:center;width:auto;height:55px;padding:0;transform:none; }
.header .logo .site-brand-logo { width:auto!important;max-width:none!important;height:55px!important; }
.header .nav { order:3;flex:none;margin-left:0; }
.header .search { order:2;flex:1 1 auto;min-width:0;width:auto;max-width:500px;height:auto;margin:0 auto;padding:0; }
.header .search-form { display:flex;width:100%; }
.header .search-input { min-width:0;width:0; }
.header .search-btn { flex:none; }
/* Align the header and full-width panels with the content cards. */
.container .managed-category-nav, .container .managed-banners { margin-inline:8px; }
@media(min-width:768px) and (max-width:991px) {
  .header > .container { gap:12px; }
  .header .search-btn { width:60px; }
}
@media(max-width:991px) {
  .header > .container { gap:10px;padding:0 50px 0 5px; }
  .header .logo { height:48px; }
  .header .logo .site-brand-logo { height:36px!important; }
  .header .search { max-width:none;margin:0; }
  .header .nav { right:5px; }

}

@media(max-width:767px) {
  .container .managed-category-nav, .container .managed-banners { margin-inline:5px; }
}

/* Give phone searches a full row without changing the desktop header. */
@media(max-width:480px) {
  .header, .header.fixed { height:94px; }
  .header > .container { height:94px;flex-wrap:wrap;align-content:flex-start;gap:0 10px;padding:0 5px 10px; }
  .header .search { flex:0 0 100%;height:36px; }
  .header .search-input, .header .search-btn { height:36px;font-size:16px; }
  .header .nav { top:96px;max-height:calc(100vh - 106px);max-height:calc(100dvh - 106px); }
  .header + .container { margin-top:100px; }
  .container [data-managed-category] { scroll-margin-top:100px; }
}
/* A shared manual preference also applies to public pages and member dialogs. */
.site-theme-toggle { position:fixed; z-index:998; right:max(14px,env(safe-area-inset-right)); bottom:calc(max(14px,env(safe-area-inset-bottom)) + 52px); width:44px; min-height:44px; padding:4px; border:1px solid var(--wx-line); border-radius:8px; background:var(--wx-primary); color:var(--wx-on-primary); font-family:inherit; font-size:12px; line-height:1.4; box-shadow:0 2px 9px #0003; cursor:pointer; }
.site-theme-toggle:focus-visible { outline:3px solid var(--wx-focus); outline-offset:2px; }

/* Keep the three floating controls in separate touch targets. */
.suspend { right:max(14px,env(safe-area-inset-right)); bottom:max(14px,env(safe-area-inset-bottom)); margin:0; padding:0; }
.suspend li { width:44px; height:44px; margin:0; line-height:44px; }
