/**
 * PawCare — Design Tokens
 * Palette: data-theme="companion" | "garden" | "warm" | "playful"
 * Color scheme: data-color-scheme="dark" (default) | "light"
 */
:root {
  /* ── Typography ── */
  --pet-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --pet-font-heading: "Inter", system-ui, sans-serif;
  --pet-font-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", monospace;

  /* ── Radii ── */
  --pet-radius-sm: 0.375rem;
  --pet-radius: 0.5rem;
  --pet-radius-lg: 0.75rem;
  --pet-radius-pill: 999px;
}

/* ── Companion palette (trust + warmth) ── */
:root,
[data-theme="companion"] {
  --pet-primary: #2a7f8e;
  --pet-primary-hover: #236b78;
  --pet-primary-light: #d4eef3;
  --pet-primary-muted: rgba(42, 127, 142, 0.18);
  --pet-primary-focus: rgba(42, 127, 142, 0.28);
  --pet-primary-shadow: rgba(42, 127, 142, 0.28);

  --pet-accent: #e8933a;
  --pet-secondary: #5a7d6a;

  --pet-success: #3b9b6e;
  --pet-info: #4a9bc4;
  --pet-warning: #e8a13c;
  --pet-danger: #d45b52;

  --pet-on-primary: #ffffff;
  --pet-footer-link-hover: #e8933a;

  --pet-chart-1: #2a7f8e;
  --pet-chart-2: #e8933a;
  --pet-chart-3: #3b9b6e;
  --pet-chart-4: #d45b52;
  --pet-chart-5: #5a7d6a;

  --pet-structural: #1a3d4a;
}

/* ── Garden palette (nature + wellness) ── */
[data-theme="garden"] {
  --pet-primary: #3d8b6e;
  --pet-primary-hover: #32755c;
  --pet-primary-light: #d8f0e4;
  --pet-primary-muted: rgba(61, 139, 110, 0.2);
  --pet-primary-focus: rgba(61, 139, 110, 0.28);
  --pet-primary-shadow: rgba(61, 139, 110, 0.3);

  --pet-accent: #e8a45c;
  --pet-secondary: #7a6b5d;

  --pet-success: #4a9b72;
  --pet-info: #5a9fc4;
  --pet-warning: #e8b04a;
  --pet-danger: #d45b52;

  --pet-on-primary: #ffffff;
  --pet-footer-link-hover: #e8a45c;

  --pet-chart-1: #3d8b6e;
  --pet-chart-2: #e8a45c;
  --pet-chart-3: #5a9fc4;
  --pet-chart-4: #d45b52;
  --pet-chart-5: #7a6b5d;

  --pet-structural: #2a4a3a;
}

/* ── Warm palette (hogar + terracota) ── */
[data-theme="warm"] {
  --pet-primary: #c67b5c;
  --pet-primary-hover: #b0684c;
  --pet-primary-light: #f5e6dc;
  --pet-primary-muted: rgba(198, 123, 92, 0.2);
  --pet-primary-focus: rgba(198, 123, 92, 0.28);
  --pet-primary-shadow: rgba(198, 123, 92, 0.3);

  --pet-accent: #e8b87a;
  --pet-secondary: #8b7355;

  --pet-success: #6b9b5a;
  --pet-info: #7a9bb8;
  --pet-warning: #e8a85c;
  --pet-danger: #c45c4a;

  --pet-on-primary: #ffffff;
  --pet-footer-link-hover: #e8b87a;

  --pet-chart-1: #c67b5c;
  --pet-chart-2: #e8b87a;
  --pet-chart-3: #6b9b5a;
  --pet-chart-4: #c45c4a;
  --pet-chart-5: #8b7355;

  --pet-structural: #4a3228;
}

/* ── Playful palette (coral + azul cielo) ── */
[data-theme="playful"] {
  --pet-primary: #e07a5f;
  --pet-primary-hover: #c96850;
  --pet-primary-light: #fde8e2;
  --pet-primary-muted: rgba(224, 122, 95, 0.2);
  --pet-primary-focus: rgba(224, 122, 95, 0.28);
  --pet-primary-shadow: rgba(224, 122, 95, 0.3);

  --pet-accent: #5ba4cf;
  --pet-secondary: #8b8ba8;

  --pet-success: #5cb88a;
  --pet-info: #5ba4cf;
  --pet-warning: #f0b45a;
  --pet-danger: #e05a5a;

  --pet-on-primary: #ffffff;
  --pet-footer-link-hover: #5ba4cf;

  --pet-chart-1: #e07a5f;
  --pet-chart-2: #5ba4cf;
  --pet-chart-3: #5cb88a;
  --pet-chart-4: #e05a5a;
  --pet-chart-5: #8b8ba8;

  --pet-structural: #3d4f6f;
}

/* ── Dark scheme (default) ── */
:root,
[data-color-scheme="dark"] {
  --pet-bg: #101820;
  --pet-surface: #1a2830;
  --pet-surface-alt: #223540;
  --pet-text: #f0f4f6;
  --pet-text-muted: #9ab0bc;
  --pet-text-subtle: #7d96a4;
  --pet-heading: #f7fafb;
  --pet-border: #2e4552;
  --pet-border-light: #243844;
  --pet-disabled: #5c7a86;
  --pet-code-bg: #152830;

  --pet-dark: var(--pet-structural);
  --pet-navbar: var(--pet-structural);
  --pet-on-dark: #f7fafb;
  --pet-footer-text: rgba(247, 250, 251, 0.82);
  --pet-footer-text-muted: rgba(247, 250, 251, 0.5);

  --pet-shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.35);
  --pet-shadow-md: 0 8px 28px rgba(0, 0, 0, 0.45);
  --pet-shadow-card: 0 4px 16px rgba(0, 0, 0, 0.3);

  --pet-sidebar-hover: rgba(255, 255, 255, 0.06);
  --pet-sidebar-active: rgba(42, 127, 142, 0.22);

  --bs-body-bg: var(--pet-bg);
  --bs-body-color: var(--pet-text);
  --bs-secondary-color: var(--pet-text-muted);
  --bs-tertiary-color: var(--pet-text-subtle);
  --bs-border-color: var(--pet-border);
  --bs-emphasis-color: var(--pet-heading);
  --bs-heading-color: var(--pet-heading);

  --color-primary: var(--pet-primary);
  --color-accent: var(--pet-accent);
  --color-dark: var(--pet-dark);
  --color-light-bg: var(--pet-bg);
  --color-text-main: var(--pet-text);
}

[data-color-scheme="dark"][data-theme="garden"] {
  --pet-sidebar-active: rgba(61, 139, 110, 0.22);
}

[data-color-scheme="dark"][data-theme="warm"] {
  --pet-sidebar-active: rgba(198, 123, 92, 0.22);
}

[data-color-scheme="dark"][data-theme="playful"] {
  --pet-sidebar-active: rgba(224, 122, 95, 0.22);
}

/* ── Light scheme ── */
[data-color-scheme="light"] {
  --pet-bg: #f7f5f0;
  --pet-surface: #ffffff;
  --pet-surface-alt: #f4f7f8;
  --pet-text: #223540;
  --pet-text-muted: #566a78;
  --pet-text-subtle: #465a68;
  --pet-heading: #1a3d4a;
  --pet-border: #d8e0e4;
  --pet-border-light: #e9eef0;
  --pet-disabled: #9aa8b0;
  --pet-code-bg: #eef3f5;

  --pet-dark: var(--pet-structural);
  --pet-navbar: var(--pet-structural);
  --pet-on-dark: #f7fafb;
  --pet-footer-text: rgba(247, 250, 251, 0.82);
  --pet-footer-text-muted: rgba(247, 250, 251, 0.5);

  --pet-shadow-sm: 0 2px 10px rgba(16, 24, 32, 0.06);
  --pet-shadow-md: 0 8px 24px rgba(42, 127, 142, 0.14);
  --pet-shadow-card: 0 2px 12px rgba(16, 24, 32, 0.08);

  --pet-sidebar-hover: rgba(255, 255, 255, 0.08);
  --pet-sidebar-active: rgba(42, 127, 142, 0.18);

  --bs-body-bg: var(--pet-bg);
  --bs-body-color: var(--pet-text);
  --bs-secondary-color: var(--pet-text-muted);
  --bs-tertiary-color: var(--pet-text-subtle);
  --bs-border-color: var(--pet-border);
  --bs-emphasis-color: var(--pet-heading);
  --bs-heading-color: var(--pet-heading);
}

[data-color-scheme="light"][data-theme="garden"] {
  --pet-primary-muted: rgba(61, 139, 110, 0.12);
  --pet-sidebar-active: rgba(61, 139, 110, 0.16);
}

[data-color-scheme="light"][data-theme="warm"] {
  --pet-primary-muted: rgba(198, 123, 92, 0.12);
  --pet-sidebar-active: rgba(198, 123, 92, 0.16);
}

[data-color-scheme="light"][data-theme="playful"] {
  --pet-primary-muted: rgba(224, 122, 95, 0.12);
  --pet-sidebar-active: rgba(224, 122, 95, 0.16);
}

/* Bootstrap semantic mapping (both schemes) */
:root,
[data-theme="companion"],
[data-theme="garden"],
[data-theme="warm"],
[data-theme="playful"] {
  --bs-primary: var(--pet-primary);
  --bs-secondary: var(--pet-secondary);
  --bs-success: var(--pet-success);
  --bs-info: var(--pet-info);
  --bs-warning: var(--pet-warning);
  --bs-danger: var(--pet-danger);
  --bs-light: var(--pet-surface-alt);
  --bs-dark: var(--pet-structural);
  --bs-link-color: var(--pet-primary);
  --bs-link-hover-color: var(--pet-primary-hover);
}