/*
 * Sistema de diseño 4.50.0 — IVE v6.2.
 * Los tokens claros son la base. El oscuro solo entra dentro de .esm-tema-oscuro.
 * Las aliases públicas conservan los valores que ya venían usando área personal y galería.
 */
:root {
    /* Tipografía */
    --esm-font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --esm-font-family-mono: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
    --esm-font-size-2xs: 10.5px;
    --esm-font-size-xs: 11.5px;
    --esm-font-size-sm: 12.5px;
    --esm-font-size-base: 14px;
    --esm-font-size-md: 15px;
    --esm-font-size-lg: 19px;
    --esm-font-size-xl: 24px;
    --esm-font-size-2xl: 34px;
    --esm-font-size-figure: 30px;
    --esm-font-weight-normal: 400;
    --esm-font-weight-medium: 500;
    --esm-font-weight-strong: 600;
    --esm-font-weight-heading: 700;
    --esm-line-height-tight: 1.15;
    --esm-line-height-text: 1.55;
    --esm-line-height-long: 1.65;
    --esm-letter-spacing-heading: -0.02em;

    /* Espaciado, radios y movimiento */
    --esm-space-1: 4px;
    --esm-space-2: 8px;
    --esm-space-3: 12px;
    --esm-space-4: 16px;
    --esm-space-5: 24px;
    --esm-space-6: 32px;
    --esm-space-7: 48px;
    --esm-space-8: 64px;
    --esm-radius-sm: 5px;
    --esm-radius: 8px;
    --esm-radius-lg: 10px;
    --esm-radius-pill: 6px;
    --esm-duration-fast: 120ms;
    --esm-duration-medium: 180ms;
    --esm-easing: cubic-bezier(.2,.8,.2,1);
    --esm-control-height: 38px;

    /* Tema claro v6.2 */
    --esm-color-white: #ffffff;
    --esm-color-bg-page: #ffffff;
    --esm-color-bg-workspace: #ffffff;
    --esm-color-bg-sidebar: #f7f7f5;
    --esm-color-bg-surface: #ffffff;
    --esm-color-bg-hover: #f4f4f6;
    --esm-color-border: rgba(15,15,20,.09);
    --esm-color-border-strong: rgba(15,15,20,.13);
    --esm-shadow-1: 0 1px 1px rgba(15,15,20,.02);
    --esm-shadow-2: 0 12px 32px rgba(15,15,20,.10), 0 2px 8px rgba(15,15,20,.05);
    --esm-color-text-primary: #0b0b0d;
    --esm-color-text-secondary: #55555b;
    --esm-color-text-tertiary: #8e8e94;
    --esm-color-event-label: #6b6b70;
    --esm-color-separator: #c2c2c7;
    --esm-color-accent: var(--wp-admin-theme-color, #2271b1);
    --esm-color-accent-hover: #195a8d;
    --esm-color-accent-soft: #eef5fc;
    --esm-color-on-accent: #ffffff;
    --esm-color-focus: 0 0 0 2px #ffffff, 0 0 0 4px var(--esm-color-accent);

    /* Estados: ámbar pendiente, verde hecho, rojo riesgo y azul informativo */
    --esm-color-ok: #16794f;
    --esm-color-ok-bg: #eafaf1;
    --esm-color-ok-border: #bfe8d3;
    --esm-color-pending: #92400e;
    --esm-color-pending-bg: #fff6e5;
    --esm-color-pending-border: #f3dba8;
    --esm-color-risk: #b91c1c;
    --esm-color-risk-bg: #fef2f2;
    --esm-color-risk-border: #f6c9c9;
    --esm-color-risk-button: #b91c1c;
    --esm-color-info: #1d4ed8;
    --esm-color-info-bg: #eff6ff;
    --esm-color-info-border: #cfe0fb;

    /* Compatibilidad con nombres previos del panel. */
    --esm-blanco: var(--esm-color-white);
    --esm-fondo: var(--esm-color-bg-page);
    --esm-linea: var(--esm-color-border);
    --esm-borde: var(--esm-color-border-strong);
    --esm-tinta: var(--esm-color-text-primary);
    --esm-gris: var(--esm-color-text-secondary);
    --esm-tenue: var(--esm-color-text-secondary);
    --esm-azul: var(--esm-color-accent);
    --esm-ok-texto: var(--esm-color-ok);
    --esm-ok-fondo: var(--esm-color-ok-bg);
    --esm-ok-borde: var(--esm-color-ok-border);
    --esm-warn-texto: var(--esm-color-pending);
    --esm-warn-fondo: var(--esm-color-pending-bg);
    --esm-warn-borde: var(--esm-color-pending-border);
    --esm-danger-texto: var(--esm-color-risk);
    --esm-danger-fondo: var(--esm-color-risk-bg);
    --esm-danger-borde: var(--esm-color-risk-border);
    --esm-info-texto: var(--esm-color-info);
    --esm-info-fondo: var(--esm-color-info-bg);
    --esm-info-borde: var(--esm-color-info-border);
    --esm-neutro-texto: var(--esm-color-text-secondary);
    --esm-neutro-fondo: var(--esm-color-bg-hover);
    --esm-neutro-borde: var(--esm-color-border-strong);
    --esm-ok-fuerte: var(--esm-color-ok);
    --esm-apagado: var(--esm-color-text-tertiary);
    --esm-r-sm: var(--esm-radius-sm);
    --esm-r: var(--esm-radius);
    --esm-r-pill: var(--esm-radius-pill);
    --esm-sombra-1: var(--esm-shadow-1);
    --esm-sombra-2: var(--esm-shadow-2);
    --esm-e1: var(--esm-space-1);
    --esm-e2: var(--esm-space-2);
    --esm-e3: var(--esm-space-3);
    --esm-e4: var(--esm-space-4);
    --esm-e5: var(--esm-space-5);
    --esm-e6: var(--esm-space-6);
    --esm-alto-control: var(--esm-control-height);

    /* Paleta pública preexistente, conservada para no alterar sus capturas. */
    --esm-public-color-333: #333;
    --esm-public-color-1b1b1b: #1b1b1b;
    --esm-public-color-555: #555;
    --esm-public-color-888: #888;
    --esm-public-color-fff: #fff;
    --esm-public-color-cfd3d0: #cfd3d0;
    --esm-public-color-e3e7e4: #e3e7e4;
    --esm-public-color-f5f6f8: #f5f6f8;
    --esm-public-color-f8f9f8: #f8f9f8;
    --esm-public-color-5f6368: #5f6368;
    --esm-public-color-727272: #727272;
    --esm-public-color-b3261e: #b3261e;
    --esm-public-color-666: #666;
    --esm-public-color-4a4a4a: #4a4a4a;
    --esm-public-color-fbfbfa: #fbfbfa;
    --esm-public-color-2c3e50: #2c3e50;
    --esm-public-color-d9d9d9: #d9d9d9;
    --esm-public-color-8a8a8a: #8a8a8a;
    --esm-public-color-949494: #949494;
    --esm-public-color-e5e5e5: #e5e5e5;
    --esm-public-color-9a4300: #9a4300;
    --esm-public-color-cc5500: #cc5500;
    --esm-public-color-d2691e: #d2691e;
    --esm-public-color-111: #111;
    --esm-public-color-dc3545: #dc3545;
    --esm-public-color-c62b39: #c62b39;
    --esm-public-color-454545: #454545;

    /* Área personal: aliases históricos y métricas congeladas por contrato público. */
    --esm-ap-tinta: #1d1d1f;
    --esm-ap-suave: #6e6e73;
    --esm-ap-linea: #d2d2d7;
    --esm-ap-fondo: #ffffff;
    --esm-ap-lienzo: #f5f5f7;
    --esm-ap-acento: #0071e3;
    --esm-ap-ok: #0a5c36;
    --esm-ap-ok-fondo: #e3f5ea;
    --esm-ap-alerta: #7a4b00;
    --esm-ap-alerta-fondo: #fff8e6;
    --esm-ap-borde: #e3e7e4;
    --esm-ap-linea-hover: #c7c7cc;
    --esm-ap-foco-fondo: #ececf0;
    --esm-ap-blanco: #fff;
    --esm-ap-ancho: 1200px;
    --esm-ap-radio: 8px;
    --esm-ap-pad-x: 1.25rem;
    --esm-ap-pad-y: 1rem;

    /* Galería: estos valores son defaults; las custom properties de cada evento los pisan. */
    --esm-gal-btn: #2c3e50;
    --esm-gal-btn-texto: #fff;
    --esm-gal-fs: 16px;

    /* Lote 4.59 — Largo en caracteres de una cifra de dinero: esm_ui_importe() pone el suyo en cada una y
       panel.css (.esm-importe) calcula con él el tamaño que cabe en su tarjeta. 12 es «147.055,00 €». */
    --esm-ch: 12;
}

/* Optativo. Nadie activa esta clase por defecto; wp-admin y las páginas públicas siguen claras. */
.esm-tema-oscuro {
    --esm-color-bg-page: #0b0b0d;
    --esm-color-bg-workspace: #0b0b0d;
    --esm-color-bg-sidebar: #111113;
    --esm-color-bg-surface: #17171a;
    --esm-color-bg-hover: #1f1f23;
    --esm-color-border: rgba(255,255,255,.10);
    --esm-color-border-strong: rgba(255,255,255,.14);
    --esm-shadow-1: 0 1px 1px rgba(0,0,0,.30);
    --esm-shadow-2: 0 16px 40px rgba(0,0,0,.55);
    --esm-color-text-primary: #f5f5f7;
    --esm-color-text-secondary: #a1a1a6;
    --esm-color-text-tertiary: #77777d;
    --esm-color-event-label: #9a9aa0;
    --esm-color-separator: #4a4a50;
    --esm-color-accent: #4c9eea;
    --esm-color-accent-hover: #6fb2ee;
    --esm-color-accent-soft: #132638;
    --esm-color-on-accent: #0b0b0d;
    --esm-color-focus: 0 0 0 2px #0b0b0d, 0 0 0 4px var(--esm-color-accent);
    --esm-color-ok: #3ddc84;
    --esm-color-ok-bg: #0b241a;
    --esm-color-ok-border: #164a33;
    --esm-color-pending: #f5b942;
    --esm-color-pending-bg: #2a1d05;
    --esm-color-pending-border: #4a3a12;
    --esm-color-risk: #ff6f61;
    --esm-color-risk-bg: #2a0f0d;
    --esm-color-risk-border: #4a1a16;
    --esm-color-risk-button: #c4453a;
    --esm-color-info: #6ea8fe;
    --esm-color-info-bg: #10192e;
    --esm-color-info-border: #23345a;
}
