/*
 * Tokens de marca Paywill (Pw*).
 * Formaliza como variables los colores que ya existen hoy dispersos en
 * Style.css (background-alpha/beta, color-gamma, etc.) y agrega los que
 * faltaban (success/error/warning/tertiary/base) siguiendo la paleta
 * documentada en DESIGN.md (Bicom ERP), que ya coincide con la de Paywill
 * en primary (#FF5D36) y secondary (#446EEE / #446ef0).
 *
 * Los componentes Pw* (pw-btn, pw-badge, pw-table-actions, PwConfirmModal)
 * SOLO deben usar estas variables, nunca un hex literal nuevo.
 */
:root {
    --pw-primary: #FF5D36;
    --pw-primary-fg: #F8FAFC;

    --pw-secondary: #446EEE;
    --pw-secondary-fg: #F8FAFC;

    --pw-base: #0A2542;
    --pw-base-fg: #F0F2F4;

    --pw-tertiary: #F4BA40;
    --pw-tertiary-fg: #F8FAFC;

    --pw-success: #349423;
    --pw-success-fg: #F3F9F2;

    --pw-error: #EB0728;
    --pw-error-fg: #FEF0F2;

    --pw-warning: #856404;
    --pw-warning-fg: #FFFBEB;

    --pw-muted: #64748B;
    --pw-muted-bg: #F1F5F9;

    --pw-radius-sm: 6px;
    --pw-radius-md: 8px;
    --pw-radius-lg: 10px;
    --pw-radius-xl: 14px;

    --pw-shadow-xs: 0 1px 2px rgba(10, 37, 66, .06);
    --pw-shadow-sm: 0 1px 3px rgba(10, 37, 66, .08);
    --pw-shadow-md: 0 4px 10px rgba(10, 37, 66, .10);
    --pw-shadow-lg: 0 10px 24px rgba(10, 37, 66, .16);

    /*
     * Superficies y texto del modo día/noche (ver docs/rediseno-ui-dark-mode-plan.md).
     * El sidebar y el navbar superior ya son oscuros por diseño en modo día
     * (background-alpha / #354151) y no usan estos tokens: esto cubre el
     * área de contenido (#wrapper-content, .card, .table, modales, etc.)
     * a través de paywill-theme-dark.css.
     */
    --pw-surface: #FFFFFF;
    --pw-surface-alt: #F6FAFF;
    --pw-border: #E2E7F0;
    --pw-text: #1A2A4E;
    --pw-page-bg: #FFFFFF;
}

[data-theme="dark"] {
    --pw-surface: #182233;
    --pw-surface-alt: #1F2B3D;
    --pw-border: #2E3A50;
    --pw-text: #E5E9F0;
    --pw-page-bg: #101826;

    --pw-muted: #94A3B8;
    --pw-muted-bg: #22304A;

    --pw-shadow-xs: 0 1px 2px rgba(0, 0, 0, .3);
    --pw-shadow-sm: 0 1px 3px rgba(0, 0, 0, .35);
    --pw-shadow-md: 0 4px 10px rgba(0, 0, 0, .4);
    --pw-shadow-lg: 0 10px 24px rgba(0, 0, 0, .5);
}
