/*
 * Design tokens – crimson red + soft pink + maroon footer (light) and deep maroon-black (dark).
 * theme.js sets <html data-theme>. Older "navy" names map onto the red/maroon palette so every component follows.
 * The admin can retune the red from Website content → Footer, social & colour (sets --primary at runtime).
 */
:root {
  --primary: #c8102e;
  --primary-600: #a50d25;
  --primary-700: #7f0a1c;
  --primary-soft: #fdecee;
  --primary-soft-2: #f9d5da;
  --pink-grad-1: #fde4e7;
  --pink-grad-2: #f6b9c2;

  --navy: #c8102e;          /* legacy alias → brand red */
  --navy-600: #a50d25;
  --navy-soft: #fdecee;
  --on-navy: #ffffff;
  --heading: #1a1416;
  --maroon: #25090d;
  --maroon-2: #3a0f15;

  --bg: #faf6f6;
  --bg-2: #f5ecee;
  --card: #ffffff;
  --surface-2: #fbf6f6;
  --border: #f0e3e5;
  --border-strong: #e4d3d6;

  --text: #1a1416;
  --text-2: #4a3f42;
  --muted: #7d7073;

  --success: #16a34a;
  --success-soft: #e7f7ed;
  --warning: #d97706;
  --warning-soft: #fef3e2;
  --danger: #dc2626;
  --danger-soft: #fdeaea;
  --info: #2563eb;
  --info-soft: #e9f0fe;
  --violet: #7c3aed;
  --violet-soft: #f1ebfe;
  --gray-soft: #f2eced;
  --note-warn-text: #8a5300;
  --note-info-text: #1e40af;
  --whatsapp: #22c55e;

  --header-bg: rgba(253, 236, 238, .96);
  --track: #f3e3e6;
  --switch-off: #e6d6d9;
  --bar: #f9d5da;
  --tip-bg: #25090d;
  --tip-text: #ffffff;
  --toast-bg: #25090d;
  --ink: #25090d;
  --footer-bg: #25090d;
  --promo-1: #e23a50;
  --promo-2: #a50d25;
  --overlay: rgba(30, 8, 12, .5);
  --deleted-bg: #f2eced;

  --radius-lg: 18px;
  --radius: 14px;
  --radius-sm: 10px;
  --radius-xs: 8px;
  --pill: 999px;

  --shadow-sm: 0 1px 2px rgba(60, 10, 20, .05);
  --shadow: 0 6px 20px rgba(140, 20, 40, .08);
  --shadow-lg: 0 20px 50px rgba(60, 10, 20, .18);
  --shadow-red: 0 8px 20px rgba(200, 16, 46, .28);

  --font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sidebar-w: 248px;
  --panel-w: 340px;
  --topbar-h: 68px;
}

:root[data-theme="dark"] {
  --primary: #e23a50;
  --primary-600: #c8102e;
  --primary-700: #ff8a99;
  --primary-soft: #3a1219;
  --primary-soft-2: #4d1822;
  --pink-grad-1: #3a1219;
  --pink-grad-2: #6b1f2c;

  --navy: #ff6b7e;
  --navy-600: #ff8a99;
  --navy-soft: #2e1016;
  --on-navy: #140a0c;
  --heading: #f6eef0;
  --maroon: #0e0507;
  --maroon-2: #1e0b0f;

  --bg: #140a0c;
  --bg-2: #22121a;
  --card: #1e1114;
  --surface-2: #24151a;
  --border: #33202a;
  --border-strong: #452b35;

  --text: #f6eef0;
  --text-2: #d6c6ca;
  --muted: #a8949a;

  --success: #34c56c;
  --success-soft: #12301f;
  --warning: #f0a33a;
  --warning-soft: #33250f;
  --danger: #f26363;
  --danger-soft: #3a1a1a;
  --info: #6b9cff;
  --info-soft: #172443;
  --violet: #a78bfa;
  --violet-soft: #271d40;
  --gray-soft: #2a1a20;
  --note-warn-text: #f6c77d;
  --note-info-text: #a9c4ff;

  --header-bg: rgba(30, 11, 15, .95);
  --track: #33202a;
  --switch-off: #452b35;
  --bar: #4d1822;
  --tip-bg: #f6eef0;
  --tip-text: #140a0c;
  --toast-bg: #2e1016;
  --ink: #0e0507;
  --footer-bg: #0e0507;
  --overlay: rgba(0, 0, 0, .6);
  --deleted-bg: #2a1a20;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --shadow: 0 4px 18px rgba(0, 0, 0, .35);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, .55);
  --shadow-red: 0 8px 20px rgba(0, 0, 0, .4);
}