/* ============================================================
   YATES CENTRAL — app-shell layout (v1.0.0-alpha)
   CONSUMES the Enterprise Design System. Load order:
   tokens.css → enterprise.css → brand-yates-industries.css → THIS
   This file adds only app-shell LAYOUT — no raw brand colors.
   ============================================================ */

body { display: flex; min-height: 100vh; }

/* ---------- Sidebar ---------- */
.yc-sidebar {
  width: var(--sidebar-w); flex: none; background: var(--surface-panel);
  border-right: 1px solid var(--surface-border); position: fixed; inset: 0 auto 0 0;
  overflow-y: auto; z-index: var(--z-nav); padding-bottom: var(--space-8);
}
.yc-brand { padding: var(--space-5) var(--space-5) var(--space-4); border-bottom: 1px solid var(--surface-border); }
.yc-brand h1 { font-size: var(--fs-md); margin: 0; letter-spacing: .5px; color: var(--text-strong); }
.yc-brand h1 b { color: var(--brand-accent); }
.yc-brand span { display:block; font-size: var(--fs-xs); color: var(--text-faint); text-transform: uppercase; letter-spacing: 1.5px; margin-top: 2px; }
.yc-group { padding: var(--space-4) var(--space-5) var(--space-1); font-size: 10px; text-transform: uppercase; letter-spacing: 1.4px; color: var(--text-faint); }
.yc-nav a { display:flex; align-items:center; gap: var(--space-2); padding: var(--space-2) var(--space-5); color: var(--text-dim); text-decoration:none; font-size: var(--fs-sm); border-left: 3px solid transparent; cursor:pointer; }
.yc-nav a:hover { background: var(--surface-panel-2); color: var(--text-strong); }
.yc-nav a.is-active { background: var(--surface-panel-2); color: var(--text-strong); border-left-color: var(--brand-accent); }
.yc-nav .sub { padding-left: var(--space-8); font-size: var(--fs-sm); }

/* ---------- Main ---------- */
.yc-main { flex: 1; margin-left: var(--sidebar-w); min-width: 0; }
.yc-topbar { position: sticky; top: 0; z-index: var(--z-sticky); background: color-mix(in srgb, var(--surface-bg) 92%, transparent); backdrop-filter: blur(6px); border-bottom: 1px solid var(--surface-border); display:flex; align-items:center; justify-content:space-between; padding: var(--space-4) var(--space-6); }
.yc-topbar h2 { margin:0; font-size: var(--fs-xl); }
.yc-topbar .sub { color: var(--text-faint); font-size: var(--fs-xs); }
.yc-tools { display:flex; align-items:center; gap: var(--space-3); }
.yc-search { width: 260px; max-width: 40vw; }
.yc-content { padding: var(--space-6); }

/* ---------- View switching ---------- */
.yc-view { display:none; }
.yc-view.is-active { display:block; }

/* ---------- App / company cards ---------- */
.yc-cards { display:grid; grid-template-columns: repeat(auto-fill, minmax(260px,1fr)); gap: var(--space-4); }
.yc-appcard { display:flex; flex-direction:column; gap: var(--space-2); }
.yc-appcard .yc-meta { font-size: var(--fs-xs); color: var(--text-faint); display:grid; grid-template-columns: auto 1fr; gap: 2px var(--space-3); }
.yc-appcard .yc-meta b { color: var(--text-dim); font-weight: var(--fw-semibold); }
.yc-appcard .yc-actions { margin-top: auto; display:flex; gap: var(--space-2); padding-top: var(--space-2); }
.yc-launch { font-size: var(--fs-sm); }

.yc-companycard h4 { display:flex; align-items:center; gap: var(--space-2); }
.yc-swatch { width: 14px; height:14px; border-radius: 4px; display:inline-block; border:1px solid var(--surface-border); }

/* ---------- Executive home ---------- */
.yc-hero { background: var(--surface-panel); border:1px solid var(--surface-border); border-left: 4px solid var(--brand-accent); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-6); margin-bottom: var(--space-5); }
.yc-hero h3 { margin: 0 0 2px; }
.yc-hero .date { color: var(--text-faint); font-size: var(--fs-xs); margin-bottom: var(--space-3); }
.yc-three { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--space-4); }
.yc-three h5 { margin:0 0 var(--space-1); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 1px; color: var(--text-dim); }
.yc-three ol { margin:0; padding-left: var(--space-5); font-size: var(--fs-sm); }

/* ---------- Knowledge list ---------- */
.yc-klist .yi-list li { display:flex; gap: var(--space-3); align-items:baseline; }
.yc-klist code { font-size: var(--fs-xs); color: var(--text-faint); margin-left:auto; }
.yc-kcat { font-size: var(--fs-xs); color: var(--brand-primary); font-weight: var(--fw-semibold); min-width: 120px; }

/* ---------- misc ---------- */
.yc-note { background: var(--color-warning-bg); border:1px dashed color-mix(in srgb, var(--color-warning) 45%, transparent); color: var(--color-warning); padding: var(--space-2) var(--space-4); border-radius: var(--radius-sm); font-size: var(--fs-xs); margin-bottom: var(--space-5); }
.yc-menu-toggle { display:none; }

@media (max-width: 860px) {
  .yc-sidebar { transform: translateX(-100%); transition: transform var(--dur-base) var(--ease-standard); }
  .yc-sidebar.is-open { transform:none; }
  .yc-main { margin-left: 0; }
  .yc-menu-toggle { display:inline-flex; }
  .yc-three { grid-template-columns: 1fr; }
  .yc-search { display:none; }
}