/*
 * Everything Dancing design tokens.
 * Keep this file loaded before theme and plugin CSS so every surface can share
 * the same colour, radius, shadow, and compatibility variables.
 */

:root,
html[data-ed-palette="pulse"] {
  color-scheme: light;

  --ed-font-sans: "Inter", Arial, sans-serif;

  /* Everything Dancing brand palette. */
  --ed-ink: #0d062a;
  --ed-violet: #7524db;
  --ed-pink: #ed2790;
  --ed-teal-brand: #18748f;
  --ed-orange: #ff8a00;
  --ed-white: #fcfcfc;
  --ed-violet-soft: #f3edff;
  --ed-pink-soft: #fff0f7;
  --ed-teal-soft-brand: #e9f7fa;
  --ed-gradient-primary:
    linear-gradient(135deg, #7524db 0%, #b827b5 48%, #ed2790 100%);
  --ed-gradient-motion:
    linear-gradient(90deg, #18748f 0%, #7524db 50%, #ed2790 100%);

  --ed-bg: #fcfcfc;
  --ed-bg-soft: #f3edff;
  --ed-bg-warm: #fff0f7;
  --ed-bg-deep: #e9f7fa;

  --ed-surface: #ffffff;
  --ed-surface-soft: #fcfcfc;
  --ed-surface-muted: #f3edff;
  --ed-surface-raised: #ffffff;
  --ed-sheet: #ffffff;
  --ed-sheet-raised: #ffffff;

  --ed-text: #0d062a;
  --ed-text-main: #0d062a;
  --ed-text-soft: #5a506e;
  --ed-text-muted: #82758f;
  --ed-muted: #5a506e;

  --ed-border: #e7def0;
  --ed-border-strong: color-mix(in srgb, #e7def0 78%, #0d062a);

  --ed-accent: #7524db;
  --ed-accent-hover: color-mix(in srgb, #7524db 84%, #000000);
  --ed-accent-dark: color-mix(in srgb, #7524db 74%, #000000);
  --ed-accent-soft: rgba(117, 36, 219, 0.10);
  --ed-accent-glow: rgba(117, 36, 219, 0.22);
  --ed-secondary: #ed2790;
  --ed-secondary-dark: color-mix(in srgb, #ed2790 82%, #000000);
  --ed-teal: #18748f;
  --ed-teal-soft: #e9f7fa;
  --ed-teal-dark: color-mix(in srgb, #18748f 78%, #000000);
  --ed-warning: #ff8a00;
  --ed-success: #18748f;
  --ed-danger: #ed2790;
  --ed-info: #18748f;
  --ed-social: #ed2790;

  --ed-radius-sm: 10px;
  --ed-radius-md: 14px;
  --ed-radius-lg: 20px;
  --ed-radius-xl: 28px;
  --ed-radius-pill: 999px;

  --ed-shadow-sm: 0 8px 24px rgba(13, 6, 42, 0.055);
  --ed-shadow-soft: 0 14px 36px rgba(13, 6, 42, 0.08);
  --ed-shadow-elevated: 0 24px 64px rgba(13, 6, 42, 0.12);
  --ed-shadow-glow: 0 18px 54px rgba(117, 36, 219, 0.18);
  --ed-focus-ring: 0 0 0 3px rgba(117, 36, 219, 0.22);

  /* Legacy ED aliases. */
  --ed-primary: var(--ed-accent);
  --ed-primary-dark: var(--ed-accent-hover);
  --ed-bg-light: var(--ed-bg);
  --ed-surface-light: var(--ed-surface);
  --ed-text-light: var(--ed-text);
  --ed-muted-light: var(--ed-muted);
  --ed-border-light: var(--ed-border);
  --ed-primary-live: var(--ed-primary);
  --ed-secondary-live: var(--ed-secondary);
  --ed-accent-live: var(--ed-accent);
  --ed-warning-live: var(--ed-warning);
  --ed-social-live: var(--ed-social);

  --ed-primary-rgb: 117 36 219;
  --ed-secondary-rgb: 237 39 144;
  --ed-accent-rgb: 117 36 219;
  --ed-teal-rgb: 24 116 143;
  --ed-warning-rgb: 255 138 0;
  --ed-success-rgb: 24 116 143;
  --ed-danger-rgb: 237 39 144;
  --ed-info-rgb: 24 116 143;
  --ed-bg-light-rgb: 252 252 252;
  --ed-primary-dark-rgb: 117 36 219;
  --ed-secondary-dark-rgb: 237 39 144;
  --ed-accent-dark-rgb: 117 36 219;
  --ed-teal-dark-rgb: 24 116 143;

  --ed-color-ink: var(--ed-text);
  --ed-color-muted: var(--ed-muted);
  --ed-color-soft: var(--ed-bg-soft);
  --ed-color-surface: var(--ed-bg);
  --ed-color-surface-strong: var(--ed-surface);
  --ed-color-line: var(--ed-border);
  --ed-color-line-strong: var(--ed-border-strong);
  --ed-color-primary: var(--ed-primary);
  --ed-color-primary-strong: var(--ed-accent-hover);
  --ed-color-primary-soft: var(--ed-accent-soft);
  --ed-color-accent: var(--ed-secondary);
  --ed-color-accent-strong: var(--ed-secondary-dark);
  --ed-color-teal: var(--ed-teal);
  --ed-color-teal-soft: var(--ed-teal-soft);
  --ed-color-white: #ffffff;
  --ed-color-on-primary: #ffffff;
  --ed-color-header-bg: #fcfcfc;
  --ed-color-panel-bg: var(--ed-surface-raised);
  --ed-color-drawer-bg:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(252, 252, 252, 0.99));
  --ed-color-body-bg:
    linear-gradient(180deg, #fcfcfc 0%, #f3edff 52%, #ffffff 100%);
  --ed-color-selection-bg: rgba(117, 36, 219, 0.22);
  --ed-color-overlay: rgba(13, 6, 42, 0.42);
  --ed-color-shadow-rgb: 13, 6, 42;
  --ed-color-primary-rgb: 117, 36, 219;
  --ed-color-accent-rgb: 237, 39, 144;
  --ed-color-teal-rgb: 24, 116, 143;

  /* W2D/plugin compatibility aliases. */
  --w2d-ui-font: var(--ed-font-sans);
  --w2d-ui-ink: var(--ed-color-ink);
  --w2d-ui-muted: var(--ed-color-muted);
  --w2d-ui-surface: var(--ed-color-surface);
  --w2d-ui-surface-strong: var(--ed-color-surface-strong);
  --w2d-ui-line: var(--ed-color-line);
  --w2d-ui-line-strong: var(--ed-color-line-strong);
  --w2d-ui-primary: var(--ed-color-primary);
  --w2d-ui-primary-strong: var(--ed-color-primary-strong);
  --w2d-ui-primary-soft: var(--ed-color-primary-soft);
  --w2d-ui-accent: var(--ed-color-accent);
  --w2d-ui-teal: var(--ed-color-teal);
  --w2d-ui-teal-soft: var(--ed-color-teal-soft);
  --w2d-ui-radius-sm: var(--ed-radius-sm);
  --w2d-ui-radius-md: var(--ed-radius-md);
  --w2d-ui-radius-lg: var(--ed-radius-lg);
  --w2d-ui-radius-pill: var(--ed-radius-pill);
  --w2d-ui-shadow-soft: var(--ed-shadow-soft);
  --w2d-ui-shadow-elevated: var(--ed-shadow-elevated);
  --w2d-ui-focus: var(--ed-focus-ring);
}

html[data-ed-theme="dark"],
html[data-ed-theme="dark"][data-ed-palette="pulse"],
html[data-ed-theme="dark"][data-ed-palette="premium"],
html[data-theme="dark"],
[data-theme="dark"],
body.dark,
body.dark-mode,
body.ed-dark-mode,
.dark {
  color-scheme: dark;

  --ed-bg: #0d062a;
  --ed-bg-soft: #120c2d;
  --ed-bg-warm: #171036;
  --ed-bg-deep: #070318;

  --ed-surface: #171036;
  --ed-surface-soft: #120c2d;
  --ed-surface-muted: #1d1540;
  --ed-surface-raised: #21164a;
  --ed-sheet: #171036;
  --ed-sheet-raised: #21164a;

  --ed-text: #fcfcfc;
  --ed-text-main: #fcfcfc;
  --ed-text-soft: #eee8f7;
  --ed-text-muted: #c9bfd8;
  --ed-muted: #d7cfe4;

  --ed-border: #40345f;
  --ed-border-strong: #655780;

  --ed-accent: #8f5cff;
  --ed-accent-hover: #a77aff;
  --ed-accent-dark: #7524db;
  --ed-accent-soft: rgba(143, 92, 255, 0.18);
  --ed-accent-glow: rgba(143, 92, 255, 0.26);
  --ed-secondary: #ff4aa9;
  --ed-secondary-dark: #ed2790;
  --ed-teal: #35a6c5;
  --ed-teal-soft: rgba(53, 166, 197, 0.18);
  --ed-teal-dark: #18748f;
  --ed-warning: #ff8a00;
  --ed-success: #35a6c5;
  --ed-danger: #ff4aa9;
  --ed-info: #35a6c5;
  --ed-social: #ff4aa9;

  --ed-bg-dark: var(--ed-bg);
  --ed-bg-dark-deep: var(--ed-bg-deep);
  --ed-surface-dark: var(--ed-surface);
  --ed-surface-dark-soft: var(--ed-surface-soft);
  --ed-surface-dark-raised: var(--ed-surface-raised);
  --ed-sheet-dark: var(--ed-sheet);
  --ed-sheet-dark-raised: var(--ed-sheet-raised);
  --ed-text-dark: var(--ed-text);
  --ed-muted-dark: var(--ed-muted);
  --ed-border-dark: var(--ed-border);
  --ed-border-dark-strong: var(--ed-border-strong);
  --ed-primary-dark: var(--ed-accent);
  --ed-secondary-dark: var(--ed-secondary);
  --ed-accent-dark: var(--ed-accent);
  --ed-warning-dark: var(--ed-warning);
  --ed-social-dark: var(--ed-social);
  --ed-primary-live: var(--ed-accent);
  --ed-secondary-live: var(--ed-secondary);
  --ed-accent-live: var(--ed-accent);
  --ed-warning-live: var(--ed-warning);
  --ed-social-live: var(--ed-social);

  --ed-primary-rgb: 143 92 255;
  --ed-secondary-rgb: 255 74 169;
  --ed-accent-rgb: 143 92 255;
  --ed-teal-rgb: 53 166 197;
  --ed-warning-rgb: 255 138 0;
  --ed-success-rgb: 53 166 197;
  --ed-danger-rgb: 255 74 169;
  --ed-info-rgb: 53 166 197;
  --ed-bg-dark-rgb: 13 6 42;
  --ed-surface-dark-rgb: 23 16 54;
  --ed-primary-dark-rgb: 143 92 255;
  --ed-secondary-dark-rgb: 255 74 169;
  --ed-accent-dark-rgb: 143 92 255;
  --ed-teal-dark-rgb: 53 166 197;
  --ed-sheet-dark-rgb: 23 16 54;
  --ed-border-dark-rgb: 64 52 95;
  --ed-border-dark-strong-rgb: 101 87 128;

  --ed-color-ink: var(--ed-text);
  --ed-color-muted: var(--ed-muted);
  --ed-color-soft: var(--ed-bg);
  --ed-color-surface: var(--ed-surface);
  --ed-color-surface-strong: var(--ed-surface);
  --ed-color-line: var(--ed-border);
  --ed-color-line-strong: var(--ed-border-strong);
  --ed-color-primary: var(--ed-accent);
  --ed-color-primary-strong: var(--ed-accent-hover);
  --ed-color-primary-soft: var(--ed-accent-soft);
  --ed-color-accent: var(--ed-secondary);
  --ed-color-accent-strong: var(--ed-secondary);
  --ed-color-teal: var(--ed-teal);
  --ed-color-teal-soft: var(--ed-teal-soft);
  --ed-color-on-primary: #ffffff;
  --ed-color-header-bg: #0d062a;
  --ed-color-panel-bg: var(--ed-surface-raised);
  --ed-color-drawer-bg: #171036;
  --ed-color-body-bg: #0d062a;
  --ed-color-selection-bg: rgba(143, 92, 255, 0.30);
  --ed-color-overlay: rgba(13, 6, 42, 0.62);
  --ed-color-shadow-rgb: 0, 0, 0;
  --ed-color-primary-rgb: 143, 92, 255;
  --ed-color-accent-rgb: 255, 74, 169;
  --ed-color-teal-rgb: 53, 166, 197;

  --ed-shadow-sm: 0 10px 28px rgba(0, 0, 0, 0.24);
  --ed-shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.30);
  --ed-shadow-elevated: 0 28px 70px rgba(0, 0, 0, 0.42);
  --ed-shadow-glow: 0 0 42px rgba(143, 92, 255, 0.18);
  --ed-focus-ring: 0 0 0 4px rgba(143, 92, 255, 0.24);
}

html,
body {
  min-height: 100%;
  background: var(--ed-color-body-bg);
  color: var(--ed-text);
}

body:not(.wp-admin) :where(#page, .site, .site-main, .site-content, .entry-content, .wp-site-blocks) {
  color: inherit;
}

body:not(.wp-admin) :where(.ed-card, .w2d-card, .ed-panel, .w2d-panel, .ed-sheet, .w2d-sheet) {
  border: 1px solid var(--ed-border);
  border-radius: var(--ed-radius-lg);
  background: var(--ed-surface-raised);
  color: var(--ed-text);
  box-shadow: var(--ed-shadow-soft);
}

body:not(.wp-admin) :where(.ed-muted, .w2d-muted, .ed-help, .w2d-help) {
  color: var(--ed-muted);
}

body:not(.wp-admin) :where(.ed-btn, .w2d-btn, .button, button, input[type="button"], input[type="submit"]) {
  border-radius: var(--ed-radius-pill);
}