/**
 * PCM Electronics — sistema cromático digital v1
 * Maestros sRGB, roles semánticos y campos cromáticos.
 */

:root {
  color-scheme: light;

  /* Paleta corporativa maestra. */
  --pcm-color-ink: #111144;
  --pcm-color-royal: #223382;
  --pcm-color-paper: #f4f1ec;
  --pcm-color-soft-blue: #9bacd8;
  --pcm-color-active-orange: #f98513;
  --pcm-color-warm-neutral: #dad1c8;

  /* Colores funcionales: apoyan estados, no sustituyen la marca. */
  --pcm-color-success: #116947;
  --pcm-color-success-soft: #d9e1d8;
  --pcm-color-danger: #b42318;
  --pcm-color-danger-soft: #ecd8d3;
  --pcm-color-info-soft: #dbdadf;
  --pcm-color-warning-soft: #f5dec5;

  /* Comercio. El rojo de oferta no representa error. */
  --pcm-color-sale-price: #9b1b30;
  --pcm-color-previous-price: #5d6070;

  /* Superficies. */
  --pcm-surface-canvas: var(--pcm-color-paper);
  --pcm-surface-primary: var(--pcm-color-paper);
  --pcm-surface-muted: var(--pcm-color-warm-neutral);
  --pcm-surface-brand: var(--pcm-color-royal);
  --pcm-surface-inverse: var(--pcm-color-ink);
  --pcm-surface-accent: var(--pcm-color-active-orange);

  /* Texto y enlaces sobre superficies claras. */
  --pcm-text-primary: var(--pcm-color-ink);
  --pcm-text-secondary: var(--pcm-color-royal);
  --pcm-text-inverse: var(--pcm-color-paper);
  --pcm-text-on-accent: var(--pcm-color-ink);
  --pcm-text-price: var(--pcm-color-ink);
  --pcm-text-sale-price: var(--pcm-color-sale-price);
  --pcm-text-previous-price: var(--pcm-color-previous-price);
  --pcm-link: var(--pcm-color-royal);
  --pcm-link-hover: var(--pcm-color-ink);

  /* Bordes y foco. El borde sutil no delimita controles interactivos. */
  --pcm-border-subtle: var(--pcm-color-warm-neutral);
  --pcm-border-control: var(--pcm-color-royal);
  --pcm-focus-on-light: var(--pcm-color-royal);
  --pcm-focus-on-dark: var(--pcm-color-active-orange);

  /* Acciones. */
  --pcm-action-primary-bg: var(--pcm-color-royal);
  --pcm-action-primary-text: var(--pcm-color-paper);
  --pcm-action-primary-hover-bg: var(--pcm-color-ink);
  --pcm-action-accent-bg: var(--pcm-color-active-orange);
  --pcm-action-accent-text: var(--pcm-color-ink);

  /* Estados. */
  --pcm-status-success: var(--pcm-color-success);
  --pcm-status-success-bg: var(--pcm-color-success-soft);
  --pcm-status-danger: var(--pcm-color-danger);
  --pcm-status-danger-bg: var(--pcm-color-danger-soft);
  --pcm-status-warning: var(--pcm-color-ink);
  --pcm-status-warning-bg: var(--pcm-color-warning-soft);
  --pcm-status-info: var(--pcm-color-royal);
  --pcm-status-info-bg: var(--pcm-color-info-soft);

  /* Campos de marca. Nunca colocar texto sin comprobar su zona concreta. */
  --pcm-gradient-structural: linear-gradient(
    112deg,
    var(--pcm-color-ink) 0%,
    var(--pcm-color-royal) 58%,
    var(--pcm-color-soft-blue) 100%
  );
  --pcm-gradient-energy: linear-gradient(
    104deg,
    var(--pcm-color-royal) 0%,
    var(--pcm-color-soft-blue) 52%,
    var(--pcm-color-active-orange) 100%
  );
  --pcm-gradient-warm-field: linear-gradient(
    128deg,
    var(--pcm-color-paper) 0%,
    var(--pcm-color-warm-neutral) 62%,
    var(--pcm-color-active-orange) 135%
  );

  --pcm-shadow-color: rgb(17 17 68 / 0.14);

  /* Colores protegidos del maestro de logo; no son tokens de interfaz. */
  --pcm-logo-night: #0b0d34;
  --pcm-logo-blue-start: #163aa9;
  --pcm-logo-blue-mid: #4767c8;
  --pcm-logo-lavender-blue: #899dde;
  --pcm-logo-lavender-warm: #c2b7ca;
  --pcm-logo-orange-light: #fba562;
  --pcm-logo-orange-end: #fb9649;
  --pcm-logo-warm-white: #f3f0ec;
}

[data-pcm-theme="dark"] {
  color-scheme: dark;
  --pcm-surface-canvas: var(--pcm-color-ink);
  --pcm-surface-primary: var(--pcm-color-ink);
  --pcm-surface-muted: var(--pcm-color-royal);
  --pcm-text-primary: var(--pcm-color-paper);
  --pcm-text-secondary: var(--pcm-color-soft-blue);
  --pcm-link: var(--pcm-color-active-orange);
  --pcm-link-hover: var(--pcm-color-paper);
  --pcm-border-subtle: var(--pcm-color-royal);
  --pcm-border-control: var(--pcm-color-soft-blue);
}

@media (forced-colors: active) {
  :root,
  [data-pcm-theme="dark"] {
    --pcm-action-primary-bg: ButtonFace;
    --pcm-action-primary-text: ButtonText;
    --pcm-border-control: ButtonText;
    --pcm-focus-on-light: Highlight;
    --pcm-focus-on-dark: Highlight;
    --pcm-link: LinkText;
  }
}