/*
 * Tokens do padrão visual Support (prefixo --ss-): cores, cantos, sombras, fonte e medidas de layout dos dois temas.
 * Vêm do SupportERP, que é a referência; os valores têm de ficar iguais nos sistemas Support. Cada sistema ainda pode ter os nomes
 * antigos (aqui --sp-*), definidos como apelidos desses tokens (ver o começo de supportsev.css).
 * Cor da marca, de sucesso, de perigo e de informação podem ser trocadas pela Personalização: ela só redefine --ss-primary,
 * --ss-success, --ss-danger e --ss-info, e o resto (escuro, claro, sombras) acompanha sozinho.
 */
:root,
[data-theme="light"] {
    color-scheme: light;
    --ss-primary: #1f9d57;
    --ss-primary-dark: color-mix(in srgb, var(--ss-primary) 84%, #000);
    --ss-primary-light: color-mix(in srgb, var(--ss-primary) 12%, transparent);
    --ss-on-primary: #ffffff;
    --ss-on-danger: #ffffff;
    --ss-tertiary: #0d9488;
    --ss-success: #1f9d57;
    --ss-danger: #e5484d;
    --ss-warning: #c98a05;
    --ss-info: #2f6fed;
    --ss-active: #0ea5e9;
    --ss-bg-page: #f4f6f8;
    --ss-bg-surface: #ffffff;
    --ss-bg-header: #ffffff;
    --ss-bg-soft: #f8fafc;
    --ss-text-primary: #18202b;
    --ss-text-secondary: #5a6472;
    --ss-text-muted: #8a93a0;
    --ss-border: #e4e8ed;
    --ss-border-soft: #eef1f4;
    --ss-sidebar-bg: #11161a;
    --ss-sidebar-elevate: #171d23;
    --ss-sidebar-text: #aab4bd;
    --ss-sidebar-accent: #3fc079;
    --ss-white: #ffffff;
    --ss-radius-sm: 7px;
    --ss-radius-input: 9px;
    --ss-radius-md: 10px;
    --ss-radius-lg: 14px;
    --ss-radius-xl: 18px;
    --ss-radius-full: 999px;
    --ss-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
    --ss-shadow-md: 0 4px 12px rgba(16, 24, 40, .08);
    --ss-shadow-lg: 0 12px 32px rgba(16, 24, 40, .12);
    --ss-shadow-primary: 0 4px 12px color-mix(in srgb, var(--ss-primary) 25%, transparent);
    --ss-shadow-danger: 0 4px 12px color-mix(in srgb, var(--ss-danger) 25%, transparent);
    --ss-ux-focus-ring: 0 0 0 3px color-mix(in srgb, var(--ss-primary) 22%, transparent);
    --ss-radius-btn: 8px;
    --ss-layout-sidebar-width: 270px;
    --ss-layout-header-height: 72px;
    --ss-transition: 160ms ease;
    --ss-font-sans: "Inter", "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ss-info-dark: #1e3a8a;
    --ss-sidebar-muted: #8a93a0;
    --ss-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}

[data-theme="dark"] {
    color-scheme: dark;
    --ss-info-dark: #3b5bdb;
    --ss-primary: #2cba6c;
    --ss-primary-dark: color-mix(in srgb, var(--ss-primary) 88%, #000);
    --ss-primary-light: color-mix(in srgb, var(--ss-primary) 16%, transparent);
    --ss-tertiary: #2dd4bf;
    --ss-success: #2cba6c;
    --ss-danger: #f06b70;
    --ss-warning: #ecb04a;
    --ss-info: #5b8def;
    --ss-active: #38bdf8;
    --ss-bg-page: #0e1316;
    --ss-bg-surface: #161c20;
    --ss-bg-header: #131a1e;
    --ss-bg-soft: #11181c;
    --ss-text-primary: #e7ebee;
    --ss-text-secondary: #98a2ab;
    --ss-text-muted: #6b757e;
    --ss-border: #262e34;
    --ss-border-soft: #20272c;
    --ss-sidebar-bg: #11161a;
    --ss-sidebar-elevate: #171d23;
    --ss-sidebar-text: #aab4bd;
    --ss-sidebar-accent: #3fc079;
    --ss-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .32);
    --ss-shadow-md: 0 4px 12px rgba(0, 0, 0, .34);
    --ss-shadow-lg: 0 12px 32px rgba(0, 0, 0, .4);
    --ss-ux-focus-ring: 0 0 0 3px color-mix(in srgb, var(--ss-primary) 24%, transparent);
    --ss-shadow-primary: 0 4px 12px color-mix(in srgb, var(--ss-primary) 28%, transparent);
    --ss-shadow-danger: 0 4px 12px color-mix(in srgb, var(--ss-danger) 28%, transparent);
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    font-family: var(--ss-font-sans);
    background: var(--ss-bg-page);
    color: var(--ss-text-primary);
}

body {
    min-height: 100vh;
    margin: 0;
    background: var(--ss-bg-page);
    color: var(--ss-text-primary);
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
}

:focus-visible {
    outline: 0;
    box-shadow: var(--ss-ux-focus-ring);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
    }
}

/* Cor do texto sobre a cor primária e a de perigo: branco, exceto quando a cor escolhida na Personalização é clara (aí fica escuro, para
   continuar legível). O limiar 0,72 mantém o branco nos verdes atuais. Navegador sem suporte a cor relativa continua com o branco. */
@supports (color: oklch(from red l c h)) {
    :root,
    [data-theme="light"],
    [data-theme="dark"] {
        --ss-on-primary: oklch(from var(--ss-primary) clamp(0, (0.72 - l) * 1000, 1) 0 0);
        --ss-on-danger: oklch(from var(--ss-danger) clamp(0, (0.72 - l) * 1000, 1) 0 0);
    }
}
