/**
 * Akşam Okulu vitrin token'ları — Web Arayüz önizleme scope'u.
 * Kaynak: aksamokulu_v01/app/globals.css (:root semantik katman)
 * Scope: .mup-wa-vitrin (vitrin) + .mup-panel (role) + ops modül kartları
 */

.mup-wa-vitrin,
.mup-vitrin,
.mup-panel,
:is(.mup-wrap, .mup-kadro, .mup-program, .mup-kategori) {
  /* Statik palet */
  --ao-night-950: #0a0e1a;
  --ao-night-900: #101625;
  --ao-night-800: #161e33;
  --ao-night-700: #1e2842;
  --ao-night-600: #2a3654;
  --ao-night-500: #3d4a6b;
  --ao-night-400: #5c6b8f;
  --ao-night-300: #8b97b5;
  --ao-night-200: #b8c1d6;
  --ao-warm-white: #f5f3ee;
  --ao-amber-300: #ffd584;
  --ao-amber-400: #f5b94e;
  --ao-amber-500: #e09f2d;
  --ao-amber-900: #4a3208;
  --ao-coral-400: #f86a57;
  --ao-success-400: #4ade80;

  /* Semantik yüzeyler */
  --ao-canvas: var(--ao-night-950);
  --ao-surface: var(--ao-night-900);
  --ao-bg-subtle: var(--ao-night-800);
  --ao-bg-muted: var(--ao-night-700);

  /* Kenarlıklar */
  --ao-border-subtle: color-mix(in srgb, var(--ao-night-600) 60%, transparent);
  --ao-border-default: var(--ao-night-600);
  --ao-border-strong: var(--ao-night-500);

  /* Metin */
  --ao-text-primary: var(--ao-warm-white);
  --ao-text-secondary: var(--ao-night-200);
  --ao-text-body: var(--ao-night-200);
  --ao-text-muted: var(--ao-night-200);
  --ao-fg-muted: var(--ao-night-200);
  --ao-text-on-brand: var(--ao-amber-900);
  --ao-text-on-amber: var(--ao-amber-900);

  /* Marka — amber */
  --ao-brand: var(--ao-amber-400);
  --ao-brand-hover: var(--ao-amber-300);
  --ao-brand-pressed: var(--ao-amber-500);
  --ao-brand-subtle: color-mix(in srgb, var(--ao-amber-400) 15%, transparent);
  --ao-text-accent: var(--ao-warm-white);

  /* Canlılık */
  --ao-live: var(--ao-coral-400);

  /* Durum */
  --ao-ok: var(--ao-success-400);
  --ao-ok-subtle: color-mix(in srgb, var(--ao-success-400) 15%, transparent);
  --ao-danger: #f87171;
  --ao-warn: #facc15;
  --ao-warn-subtle: color-mix(in srgb, var(--ao-warn) 15%, transparent);
  --ao-on-inverse: var(--ao-night-950);

  /* Tipografi */
  --ao-font-display: "Gabarito", system-ui, sans-serif;
  --ao-font-body: "Instrument Sans", system-ui, sans-serif;
  --ao-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --ao-font-logo: "Saira Extra Condensed", "Arial Narrow", Arial, sans-serif;

  /* Radius */
  --ao-radius-sm: 0.5rem;
  --ao-radius-md: 0.75rem;
  --ao-radius-lg: 1rem;
  --ao-radius-full: 999px;

  /* Motion */
  --ao-duration-fast: 150ms;
  --ao-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  /* Touch targets — WCAG 2.5.5 / PSI mobile */
  --ao-touch-min: 3rem;
  --ao-touch-gap: 0.5rem;

  /* Kategori accent — config/site.ts + globals.css @theme (Faz 2.12b) */
  --ao-cat-tech-300: #86abf4;
  --ao-cat-tech-400: #5b8def;
  --ao-cat-tech-500: #3f6fd1;
  --ao-cat-well-300: #85d3bc;
  --ao-cat-well-400: #5fbfa3;
  --ao-cat-well-500: #46a188;
  --ao-cat-art-300: #d49bef;
  --ao-cat-art-400: #c176e8;
  --ao-cat-art-500: #a657ce;
  --ao-cat-life-300: #eba987;
  --ao-cat-life-400: #e08b5f;
  --ao-cat-life-500: #c46f42;
  --ao-cat-aile-300: #f9a8d4;
  --ao-cat-aile-400: #f472b6;
  --ao-cat-aile-500: #db2777;
  --ao-cat-campus-300: #7dd3fc;
  --ao-cat-campus-400: #38bdf8;
  --ao-cat-campus-500: #0ea5e9;
  --ao-cat-corporate-300: #a5b4fc;
  --ao-cat-corporate-400: #6366f1;
  --ao-cat-corporate-500: #4f46e5;
  --ao-cat-accent: var(--ao-cat-tech-400);

  /* Legacy modül alias — kadro/program/kategori BEM sınıfları */
  --cat-aile: var(--ao-cat-aile-400);
  --cat-tech: var(--ao-cat-tech-400);
  --cat-campus: var(--ao-cat-campus-400);
  --cat-art: var(--ao-cat-art-400);
  --cat-corporate: var(--ao-cat-corporate-400);
  --cat-well: var(--ao-cat-well-400);
  --cat-life: var(--ao-cat-life-400);
}

/* Vitrin önizleme + public front-end yüzeyi */
.mup-wa-vitrin,
.mup-vitrin {
  background: var(--ao-canvas);
  color: var(--ao-text-primary);
  font-family: var(--ao-font-body);
  line-height: 1.5;
}

.mup-wa-vitrin ::selection,
.mup-vitrin ::selection {
  background: color-mix(in srgb, var(--ao-amber-400) 28%, transparent);
  color: var(--ao-text-primary);
}

/* Kategori accent map — data-ao-cat */
[data-ao-cat="aile"] {
  --ao-cat-accent: var(--ao-cat-aile-400);
}

[data-ao-cat="tech"] {
  --ao-cat-accent: var(--ao-cat-tech-400);
}

[data-ao-cat="campus"] {
  --ao-cat-accent: var(--ao-cat-campus-400);
}

[data-ao-cat="art"] {
  --ao-cat-accent: var(--ao-cat-art-400);
}

[data-ao-cat="corporate"] {
  --ao-cat-accent: var(--ao-cat-corporate-400);
}

[data-ao-cat="well"] {
  --ao-cat-accent: var(--ao-cat-well-400);
}

[data-ao-cat="life"] {
  --ao-cat-accent: var(--ao-cat-life-400);
}

/* Yaşam Kültürü v2 — site.ts catLifeAccent: amber override */
[data-cat-life="amber"] {
  --ao-cat-life-300: var(--ao-amber-300);
  --ao-cat-life-400: var(--ao-amber-400);
  --ao-cat-life-500: var(--ao-amber-500);
}

[data-cat-life="amber"][data-ao-cat="life"] {
  --ao-cat-accent: var(--ao-amber-400);
}
