/* layout.css — shell, topbar, nav, auth, responsive (targets existing partial classes) */

/* centered max-width container (used by topbar inner + page shell) */
.gs-content{max-width:var(--content-max);margin:0 auto;width:100%}

/* topbar */
.gs-topbar{background:#fff;border-bottom:1px solid var(--line);height:var(--topbar);position:sticky;top:0;z-index:1030}
.gs-topbar .gs-content{display:flex;align-items:center;justify-content:space-between;height:100%;padding:0 clamp(14px,3vw,26px)}
.gs-logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:17px;letter-spacing:-.01em;color:var(--ink)}
.gs-ghost{width:24px;height:24px}
.gs-word{font-weight:300;color:var(--muted)}
.gs-word strong{font-weight:800;color:var(--ink)}
.gs-nav{display:flex;gap:24px;align-items:center}
.gs-nav .nav-link{color:var(--muted);font-weight:600;height:var(--topbar);display:flex;align-items:center;gap:7px;
  border-bottom:2px solid transparent;border-radius:0;padding:0}
.gs-nav .nav-link .bi{font-size:15px}
.gs-nav .nav-link.active{color:var(--accent);border-bottom-color:var(--accent)}
.gs-nav .nav-link:hover{color:var(--ink)}
.gs-account{display:flex;align-items:center;gap:14px}
.gs-bell{position:relative;color:var(--muted)}
.gs-bell:hover{color:var(--ink-2)}
.gs-bell .badge{position:absolute;top:-4px;right:-6px;font-size:9px}
.gs-avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#0f7a45);display:inline-block}

/* page shell: optional sidebar + main */
.gs-content.gs-shell{display:flex;gap:0;padding:22px clamp(14px,3vw,26px) 80px}
.gs-main{flex:1;min-width:0}
.gs-sidebar{width:var(--sidebar);flex:none}
.gs-sidebar:empty{display:none}
.gs-main h1{font-size:clamp(21px,3vw,26px);font-weight:800;letter-spacing:-.02em;margin:2px 0 0}

/* auth pages */
.gs-auth{min-height:100vh;display:grid;place-items:center;background:var(--bg);padding:24px}
.gs-auth-card{width:100%;max-width:420px;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--sh-1);padding:24px}
.gs-bg{background:var(--bg)}

/* chart + table areas */
.gs-chart{min-height:220px}
.gs-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* mobile: burger in, desktop nav out, zero h-scroll */
.gs-hamburger{display:none}
.gs-off{display:none!important}
@media(max-width:991.98px){
  .gs-nav-desktop{display:none!important}
  .gs-hamburger{display:inline-flex!important}
}