/* assets/css/layout.css
   Estrutura: barra lateral, área de conteúdo e grade. */

.sidebar-toggle{
  width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  background:var(--surface-glass);border:1px solid var(--border-strong);
  border-radius:var(--r-sm);color:var(--text-secondary);cursor:pointer;
  font-size:17px;font-weight:700;box-shadow:var(--shadow-sm);
}
.sidebar-toggle:hover{background:var(--surface-glass-hover);color:var(--gold);border-color:var(--gold-border)}
.sidebar-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.theme-toggle{
  display:flex;align-items:center;gap:6px;
  background:var(--surface-glass);
  border:1px solid var(--border-strong);
  border-radius:var(--r-full);
  padding:6px 14px;cursor:pointer;
  font-size:12px;font-weight:600;color:var(--text-secondary);
}
.theme-toggle:hover{
  background:var(--surface-glass-hover);
  color:var(--text);border-color:var(--gold-border);
}
.theme-toggle .t-icon{font-size:14px}

/* ═══════════════════════════════════════════════
   MAIN
═══════════════════════════════════════════════ */
#main{flex:1;overflow:auto;display:flex;flex-direction:column;background:var(--bg)}
.page{display:none;padding:var(--sp-6)}
.page.active{display:block}
.page-title{font-size:22px;font-weight:700;margin-bottom:2px;letter-spacing:-.3px}
.page-sub{color:var(--text-secondary);font-size:13px;margin-bottom:var(--sp-6)}

/* ═══════════════════════════════════════════════
   CARDS