/* Link — thèmes type éditeurs : One Light · Dracula · Monokai */

@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Outfit:wght@500;600;700;800&display=swap");

:root {
  --link-font-headings: "Outfit", system-ui, sans-serif;
  --link-font-body: "Figtree", system-ui, sans-serif;
}

sonic-theme {
  --sc-font-family-base: var(--link-font-body) !important;
  --sc-font-family-headings: var(--link-font-headings) !important;
  --sc-headings-font-family: var(--link-font-headings) !important;
  --sc-headings-font-weight: 700 !important;
  --sc-btn-font-family: var(--link-font-body) !important;
  --sc-btn-font-weight: 600 !important;

  --sc-rounded: 0.45rem !important;
  --sc-btn-rounded-intensity: 1.5 !important;
  --sc-input-rounded-intensity: 1.25 !important;
  --sc-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.06) !important;
  --sc-shadow: 0 2px 6px -1px rgb(0 0 0 / 0.08), 0 1px 3px -1px rgb(0 0 0 / 0.06) !important;
  --sc-shadow-lg: 0 8px 16px -4px rgb(0 0 0 / 0.1), 0 2px 6px -2px rgb(0 0 0 / 0.06) !important;
  --sc-shadow-xl: 0 16px 24px -6px rgb(0 0 0 / 0.12), 0 4px 8px -4px rgb(0 0 0 / 0.06) !important;
  --sc-shadow-2xl: 0 20px 40px -12px rgb(0 0 0 / 0.18) !important;

  --sc-input-border-color: transparent !important;
  --sc-border-color: transparent !important;
}

/* —— One Light —— */
html[data-link-theme="light"] sonic-theme,
sonic-theme[data-link-theme="light"],
sonic-theme:not([data-link-theme]) {
  --sc-base: #fafafa !important;
  --sc-base-50: #f0f0f0 !important;
  --sc-base-100: #e5e5e6 !important;
  --sc-base-200: #d0d0d2 !important;
  --sc-base-300: #a0a1a7 !important;
  --sc-base-400: #696c77 !important;
  --sc-base-500: #4b4d55 !important;
  --sc-base-600: #383a42 !important;
  --sc-base-700: #2c2e34 !important;
  --sc-base-800: #232429 !important;
  --sc-base-900: #1b1c20 !important;
  --sc-base-content: #383a42 !important;

  /* Cyan One Light (accent éditeur, sans vert primary) */
  --sc-primary: #0184bc !important;
  --sc-primary-content: #fafafa !important;
  --sc-info: #383a42 !important;
  --sc-info-content: #fafafa !important;
  --sc-success: #50a14f !important;
  --sc-success-content: #fafafa !important;
  --sc-warning: #c18401 !important;
  --sc-warning-content: #fafafa !important;
  --sc-danger: #e45649 !important;
  --sc-danger-content: #fafafa !important;
  --sc-contrast: #383a42 !important;
  --sc-contrast-content: #fafafa !important;

  --sc-input-bg: #ffffff !important;
}

/* —— Dracula —— https://draculatheme.com/contribute */
html[data-link-theme="dark"] sonic-theme,
sonic-theme[data-link-theme="dark"] {
  --sc-base: #282a36 !important;
  --sc-base-50: #21222c !important;
  --sc-base-100: #343746 !important;
  --sc-base-200: #44475a !important;
  --sc-base-300: #6272a4 !important;
  --sc-base-400: #7b83a8 !important;
  --sc-base-500: #9ea4bf !important;
  --sc-base-600: #c5c8d9 !important;
  --sc-base-700: #e6e6ee !important;
  --sc-base-800: #f0f0f5 !important;
  --sc-base-900: #f8f8f2 !important;
  --sc-base-content: #f8f8f2 !important;

  /* Purple Dracula (accent UI) */
  --sc-primary: #bd93f9 !important;
  --sc-primary-content: #282a36 !important;
  --sc-info: #8be9fd !important;
  --sc-info-content: #282a36 !important;
  --sc-success: #50fa7b !important;
  --sc-success-content: #282a36 !important;
  --sc-warning: #ffb86c !important;
  --sc-warning-content: #282a36 !important;
  --sc-danger: #ff5555 !important;
  --sc-danger-content: #282a36 !important;
  --sc-contrast: #f8f8f2 !important;
  --sc-contrast-content: #282a36 !important;

  --sc-input-bg: #343746 !important;
}

/* —— Monokai —— */
html[data-link-theme="volt"] sonic-theme,
sonic-theme[data-link-theme="volt"] {
  --sc-base: #272822 !important;
  --sc-base-50: #1e1f1c !important;
  --sc-base-100: #3e3d32 !important;
  --sc-base-200: #49483e !important;
  --sc-base-300: #75715e !important;
  --sc-base-400: #908e7c !important;
  --sc-base-500: #a8a58c !important;
  --sc-base-600: #cfcfc2 !important;
  --sc-base-700: #e6e6d8 !important;
  --sc-base-800: #f2f0e4 !important;
  --sc-base-900: #f8f8f2 !important;
  --sc-base-content: #f8f8f2 !important;

  --sc-primary: #a6e22e !important;
  --sc-primary-content: #272822 !important;
  --sc-info: #66d9ef !important;
  --sc-info-content: #272822 !important;
  --sc-success: #a6e22e !important;
  --sc-success-content: #272822 !important;
  --sc-warning: #e6db74 !important;
  --sc-warning-content: #272822 !important;
  --sc-danger: #f92672 !important;
  --sc-danger-content: #f8f8f2 !important;
  --sc-contrast: #f8f8f2 !important;
  --sc-contrast-content: #272822 !important;

  --sc-input-bg: #3e3d32 !important;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--sc-base-50, #f0f0f0);
}

html[data-link-theme="dark"],
html[data-link-theme="volt"] {
  color-scheme: dark;
}

html[data-link-theme="light"] {
  color-scheme: light;
}