/* Design-site uplift (2026-10-16): softer, warmer controls on top of the original drawing-set look.
   Rounded pills instead of hairline boxes, one warm oak accent for the primary action, soft shadows on panels.
   Loaded after the Next build CSS on every page (index, sheets, schedules, model). */
:root {
  --u-accent: #b98b55;          /* warm oak / brass: the one primary action per screen */
  --u-accent-hi: #c99c64;
  --u-accent-ink: #1b1610;
  --u-surface: #fbf8f2;         /* lifted paper for cards and panels */
  --u-tint: color-mix(in srgb, var(--navy) 6%, transparent);
  --u-tint-hi: color-mix(in srgb, var(--navy) 11%, transparent);
  --u-line: color-mix(in srgb, var(--navy) 12%, transparent);
  --u-shadow-sm: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .07);
  --u-shadow: 0 14px 34px -12px rgba(16, 24, 40, .28);
  --u-glass: rgba(22, 30, 45, .76);
  --u-glass-ink: #f4efe6;
}

/* ---- site navigation: pills, not full-width boxes */
aside nav { gap: 3px; padding: 10px 10px 12px; }
aside nav a { border: 0 !important; border-radius: 10px; padding: 9px 12px !important; transition: background-color .15s, color .15s, box-shadow .15s; }
aside nav a:hover { background: var(--u-tint); }
aside nav a.bg-navy { box-shadow: var(--u-shadow-sm); }
aside nav a span:first-child { opacity: .55; }
aside nav a.bg-navy span:first-child { opacity: .7; }
@media (max-width: 1023px) {
  aside nav { padding: 8px 12px 10px; gap: 6px; scrollbar-width: none; }
  aside nav::-webkit-scrollbar { display: none; }
  aside nav a { min-width: 0 !important; flex: none; align-items: center; border-radius: 999px; padding: 7px 15px !important; background: var(--u-tint); }
  aside nav a span:first-child { display: none; }
}
/* the build's utilities live in a cascade layer, so unlayered rules here win: restate the active page explicitly */
aside nav a.bg-navy, aside nav a.bg-navy:hover { background: var(--navy); color: var(--paper); }

/* ---- buttons and links styled as buttons */
a.border.bg-navy.text-paper { border-radius: 999px; padding: 10px 20px !important; border-color: transparent !important; box-shadow: var(--u-shadow-sm); transition: background-color .15s, transform .15s; }
a.border.bg-navy.text-paper:hover { background: color-mix(in srgb, var(--navy) 88%, white); }
a.border[class*="border-navy/40"] { border-color: transparent !important; border-radius: 999px; padding: 10px 20px !important; background: var(--u-tint); transition: background-color .15s; }
a.border[class*="border-navy/40"]:hover { background: var(--u-tint-hi); }

/* ---- panels and cards */
div.border.bg-paper[class*="border-navy/25"] { border-color: var(--u-line) !important; border-radius: 18px; overflow: hidden; background: var(--u-surface); box-shadow: var(--u-shadow); }
div.border[class*="border-navy/20"].px-3 { border-color: var(--u-line) !important; border-radius: 14px; }
div.overflow-x-auto.border[class*="border-navy/20"] { border-color: var(--u-line) !important; border-radius: 14px; background: var(--u-surface); box-shadow: var(--u-shadow-sm); }

/* ---- drawing set: sheet list and viewer controls */
aside button.flex.w-full { border-radius: 8px; padding: 6px 8px !important; transition: background-color .12s; }
aside button.flex.w-full.bg-navy { box-shadow: var(--u-shadow-sm); }
button.label[class*="px-2"][class*="py-1"] { border-radius: 999px; padding: 6px 12px !important; background: var(--u-tint); transition: background-color .15s; }
button.label[class*="px-2"][class*="py-1"]:hover { background: var(--u-tint-hi); }
