/* ============================================================
   shared-ui :: adult.css
   Adult-tier color tokens. Imports base.css for geometry.
   Default (no class) = dark, since 9 of 14 adult apps are dark.
   Add class="theme-light" on a wrapper/<body> for the light palette.
   Token values derived from the discovery audit (mode of each
   cluster across the audited apps).
   ============================================================ */

@import url('base.css');

/* ---- Dark palette (default + .theme-dark) — from the 9 dark adult apps ---- */
:root,
.theme-dark {
  --sui-bg: #0f1117;
  --sui-bg-card: #1a1d27;
  --sui-bg-elevated: #242836;
  --sui-text: #e8eaf0;
  --sui-text-muted: #9ca3af;
  --sui-accent: #6c8cff;
  --sui-border: #2a2d3a;
  --sui-hover: #242836;
  --sui-error: #f87171;
  --sui-success: #34d399;
  --sui-warning: #fbbf24;

  --sui-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --sui-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);
  --sui-shadow-lg: 0 12px 32px rgba(0, 0, 0, .5);
}

/* ---- Light palette (.theme-light) — from API Tracker, the pilot app ---- */
.theme-light {
  --sui-bg: #f8f9fa;
  --sui-bg-card: #ffffff;
  --sui-bg-elevated: #eef2ff;
  --sui-text: #1a1a2e;
  --sui-text-muted: #6b7280;
  --sui-accent: #4f46e5;
  --sui-border: #e5e7eb;
  --sui-hover: #eef2ff;
  --sui-error: #ef4444;
  --sui-success: #10b981;
  --sui-warning: #f59e0b;

  --sui-shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);
  --sui-shadow-md: 0 4px 16px rgba(0, 0, 0, .12);
  --sui-shadow-lg: 0 8px 32px rgba(0, 0, 0, .12);
}

/* ============================================================
   Wire base geometry classes to adult colors
   ============================================================ */
body {
  background: var(--sui-bg);
  color: var(--sui-text);
}

.sui-card {
  box-shadow: var(--sui-shadow-sm);
}

.sui-modal {
  box-shadow: var(--sui-shadow-lg);
}

.sui-modal-overlay {
  background: rgba(0, 0, 0, .6);
}

/* ---- Button intents ---- */
.sui-btn-primary {
  background: var(--sui-accent);
  color: #fff;
}
.sui-btn-primary:hover:not(:disabled) {
  filter: brightness(1.1);
}

.sui-btn-secondary {
  background: var(--sui-bg-elevated);
  color: var(--sui-text);
  border-color: var(--sui-border);
}
.sui-btn-secondary:hover:not(:disabled) {
  background: var(--sui-hover);
}

.sui-btn-danger {
  background: var(--sui-error);
  color: #fff;
}
.sui-btn-danger:hover:not(:disabled) {
  filter: brightness(1.1);
}

.sui-btn-success {
  background: var(--sui-success);
  color: #fff;
}
.sui-btn-success:hover:not(:disabled) {
  filter: brightness(1.1);
}

/* ---- Table ---- */
.sui-table th {
  background: var(--sui-bg-elevated);
  color: var(--sui-text-muted);
}
.sui-table tbody tr:hover {
  background: var(--sui-hover);
}

/* ---- PIN pad ---- */
.sui-pin-key:hover {
  background: var(--sui-hover);
  border-color: var(--sui-accent);
  color: var(--sui-accent);
}

/* ---- Chip ---- */
.sui-chip {
  background: var(--sui-bg-elevated);
  color: var(--sui-text-muted);
}
