/* ============================================================================
   THEME PACKS — selected automatically by pick_design.py, never by hand.
   Ship with motion-ui.css; activate with one attribute on <html data-theme="...">
   Each pack only overrides tokens; all structure/motion comes from motion-ui.css.
   ========================================================================== */

/* 1 ── fintech-glass ─ dense money/data apps: prices, ledgers, risk, portfolios
        glass surfaces, tabular numerals, teal→violet accent, tight radii        */
[data-theme="fintech-glass"] {
  --m-bg: #070a12; --m-bg-2: #0b1020;
  --m-surface: rgba(255,255,255,.05); --m-surface-2: rgba(255,255,255,.085);
  --m-border: rgba(148,177,255,.16);
  --m-text: #eaf0ff; --m-muted: #8f9dbb;
  --m-indigo: #5b8cff; --m-cyan: #2ee6c5; --m-pink: #a78bfa; --m-amber: #ffd166;
  --m-grad: linear-gradient(120deg, #5b8cff, #2ee6c5 60%, #a78bfa);
  --m-r-sm: 8px; --m-r: 12px; --m-r-lg: 16px;
  --m-ease: cubic-bezier(.2, .9, .25, 1); --m-base: 220ms;
  --m-font-display: "Segoe UI", system-ui, sans-serif;
}

/* 2 ── ops-console ─ monitoring, diagnostics, infrastructure, back-office jobs
        near-black canvas, mono numerics, status colours, almost no decoration   */
[data-theme="ops-console"] {
  --m-bg: #08090b; --m-bg-2: #0e1013;
  --m-surface: rgba(255,255,255,.035); --m-surface-2: rgba(255,255,255,.07);
  --m-border: rgba(255,255,255,.09);
  --m-text: #e6e8ec; --m-muted: #8b9099;
  --m-indigo: #6ea8fe; --m-cyan: #37d3a0; --m-pink: #e06c75; --m-amber: #f0b429;
  --m-grad: linear-gradient(120deg, #6ea8fe, #37d3a0 70%);
  --m-r-sm: 6px; --m-r: 10px; --m-r-lg: 12px;
  --m-ease: cubic-bezier(.3, .8, .3, 1); --m-base: 180ms; --m-slow: 420ms;
  --m-font-display: ui-monospace, "Cascadia Mono", "Consolas", monospace;
}

/* 3 ── editorial-gallery ─ catalogues, collections, art, models, fashion
        warm paper canvas, oversized display type, generous whitespace          */
[data-theme="editorial-gallery"] {
  --m-bg: #100e0c; --m-bg-2: #16130f;
  --m-surface: rgba(255,246,232,.055); --m-surface-2: rgba(255,246,232,.09);
  --m-border: rgba(232,214,188,.18);
  --m-text: #f4ece0; --m-muted: #b3a58f;
  --m-indigo: #e0b354; --m-cyan: #c9866b; --m-pink: #d96b8a; --m-amber: #e0b354;
  --m-grad: linear-gradient(120deg, #e0b354, #c9866b 65%, #d96b8a);
  --m-r-sm: 2px; --m-r: 4px; --m-r-lg: 6px;
  --m-ease: cubic-bezier(.16, 1, .3, 1); --m-base: 340ms; --m-slow: 800ms;
  --m-font-display: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
}

/* 4 ── hospitality-warm ─ hotels, guest houses, restaurants, bookings, travel
        sand/terracotta, big rounded cards, photography-first, calm motion      */
[data-theme="hospitality-warm"] {
  --m-bg: #0f0c0a; --m-bg-2: #171310;
  --m-surface: rgba(255,237,224,.06); --m-surface-2: rgba(255,237,224,.10);
  --m-border: rgba(255,210,180,.2);
  --m-text: #fdf3ea; --m-muted: #c2a894;
  --m-indigo: #ff8a5c; --m-cyan: #ffc48a; --m-pink: #ff9f9f; --m-amber: #ffc48a;
  --m-grad: linear-gradient(120deg, #ff8a5c, #ffc48a 60%, #ff9f9f);
  --m-r-sm: 14px; --m-r: 22px; --m-r-lg: 30px;
  --m-ease: cubic-bezier(.25, 1, .3, 1); --m-base: 320ms; --m-slow: 700ms;
  --m-font-display: "Segoe UI", "Trebuchet MS", system-ui, sans-serif;
}

/* 5 ── playful-progress ─ habit/learning/workout trackers, gamified tools
        bright saturated accents, chunky shapes, springy motion, progress rings */
[data-theme="playful-progress"] {
  --m-bg: #0b0a14; --m-bg-2: #131029;
  --m-surface: rgba(255,255,255,.06); --m-surface-2: rgba(255,255,255,.11);
  --m-border: rgba(255,255,255,.14);
  --m-text: #f2f0ff; --m-muted: #a49dd0;
  --m-indigo: #8b5cf6; --m-cyan: #35e0d0; --m-pink: #ff6bb5; --m-amber: #ffd23f;
  --m-grad: linear-gradient(120deg, #8b5cf6, #35e0d0 50%, #ff6bb5);
  --m-r-sm: 12px; --m-r: 20px; --m-r-lg: 28px;
  --m-ease: cubic-bezier(.34, 1.56, .64, 1); --m-base: 300ms; --m-slow: 640ms;
  --m-font-display: "Segoe UI", "Nunito", system-ui, sans-serif;
}

/* 6 ── utility-clean ─ notes, tasks, calculators, misc internal tools (default)
        neutral graphite, one accent, low chrome, fastest motion                  */
[data-theme="utility-clean"] {
  --m-bg: #0b0c0e; --m-bg-2: #121418;
  --m-surface: rgba(255,255,255,.045); --m-surface-2: rgba(255,255,255,.08);
  --m-border: rgba(255,255,255,.10);
  --m-text: #e8eaee; --m-muted: #9298a2;
  --m-indigo: #7c8cff; --m-cyan: #63d8ff; --m-pink: #b8a1ff; --m-amber: #ffce6b;
  --m-grad: linear-gradient(120deg, #7c8cff, #63d8ff 70%);
  --m-r-sm: 8px; --m-r: 12px; --m-r-lg: 16px;
  --m-ease: cubic-bezier(.22, 1, .36, 1); --m-base: 200ms; --m-slow: 480ms;
  --m-font-display: "Segoe UI", system-ui, sans-serif;
}

/* light mode for any theme that opts in (--m-scheme: light) */
[data-theme][data-scheme="paper"] {
  --m-bg: #f7f5f1; --m-bg-2: #efece6;
  --m-surface: rgba(255,255,255,.72); --m-surface-2: rgba(255,255,255,.92);
  --m-border: rgba(20,18,14,.12);
  --m-text: #17140f; --m-muted: #6a6357;
  --m-shadow: 0 1px 1px rgba(0,0,0,.04), 0 10px 30px -18px rgba(0,0,0,.35);
  --m-shadow-hi: 0 2px 2px rgba(0,0,0,.05), 0 22px 60px -26px rgba(0,0,0,.4);
}

/* display type hook so themes actually change the typographic voice */
.m-title, .m-kpi__value, h1, h2 { font-family: var(--m-font-display, inherit); }
