/*****************************************************
 * VARIÁVEIS CSS GLOBAIS
 * 
 * Variáveis de cores e configurações globais do sistema
 *****************************************************/

:root {
    /* ===== Cores da marca ===== */
    --obra-brand: #007dba;
    --obra-brand-deep: #006291;
    --obra-brand-10: color-mix(in srgb, var(--obra-brand) 10%, #fff);
    
    /* ===== Cores de superfície ===== */
    --obra-surface: #f1f5f9;
    --obra-surface-alt: #f8fafc;
    --obra-surface-alt-2: #fbfcfd;
    --obra-surface-gradient-start: #f8fafc;
    --obra-surface-gradient-end: #eef2f7;
    
    /* ===== Cores de texto ===== */
    --obra-texto: #1e293b;
    --obra-texto-suave: #64748b;
    --obra-texto-muted: #94a3b8;
    --obra-texto-light: #475569;
    --obra-texto-dark: #334155;
    --obra-texto-darker: #0f172a;
    
    /* ===== Cores de borda ===== */
    --obra-borda: #e2e8f0;
    --obra-borda-dark: #cbd5e1;
    --obra-borda-darker: #94a3b8;
    --obra-borda-light: #e6ebf1;
    --obra-borda-lighter: #d5dce4;
    --obra-borda-azul: #dce9f5;
    --obra-borda-creme: #ece6d9;
    --obra-borda-verde: #dcebdd;
    --obra-borda-roxo: #e5e0f0;
    
    /* ===== Cores de estado ===== */
    --obra-sucesso: #10b981;
    --obra-sucesso-bg: #dcfce7;
    --obra-sucesso-text: #166534;
    --obra-atencao: #f59e0b;
    --obra-atencao-bg: #fffbeb;
    --obra-atencao-text: #92400e;
    --obra-erro: #ef4444;
    --obra-erro-bg: #fee2e2;
    --obra-erro-text: #991b1b;
    --obra-info: #3b82f6;
    --obra-info-bg: #eff6ff;
    --obra-info-text: #1e40af;
    
    /* ===== Cores específicas do login ===== */
    --obra-login-surface: #f2f4f6;
    --obra-login-line: #dde3e8;
    
    /* ===== Variáveis da assinatura ObraApp ===== */
    --obra-ink: #0b2338;
    --obra-muted: #6a7d8c;
    --obra-sig-accent: color-mix(in srgb, var(--obra-brand) 62%, #000);
    --obra-sig-line: #cbd5dd;
    
    /* ===== Cores temáticas por seção ===== */
    --obra-azul-bg: #f8fbff;
    --obra-azul-borda: #dce9f5;
    --obra-azul-icone: #1d6fa5;
    
    --obra-creme-bg: #fdfcf9;
    --obra-creme-borda: #ece6d9;
    --obra-creme-icone: #9a7b3f;
    
    --obra-verde-bg: #fafdfa;
    --obra-verde-borda: #dcebdd;
    --obra-verde-icone: #2f8f4e;
    
    --obra-roxo-bg: #fcfbff;
    --obra-roxo-borda: #e5e0f0;
    --obra-roxo-icone: #6b5aa8;
    
    /* ===== Border-radius padrões ===== */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-2xl: 16px;
    --radius-full: 9999px;
    
    /* ===== Espaçamentos padrões ===== */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 0.75rem;
    --space-lg: 0.9rem;
    --space-xl: 1rem;
    --space-2xl: 1.25rem;
    --space-3xl: 1.5rem;
    --space-4xl: 2rem;
    
    /* ===== Font-weights padrões ===== */
    --font-normal: 400;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    
    /* ===== Sombras padrões ===== */
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 16px rgba(15, 23, 42, .04);
    --shadow-lg: 0 10px 24px rgba(15, 23, 42, .08);
    --shadow-brand: 0 4px 6px -1px rgba(0, 125, 186, 0.2);
    
    /* ===== Transições padrões ===== */
    --transition-fast: 0.15s;
    --transition-normal: 0.2s;
    --transition-slow: 0.35s;
}

/* Variáveis específicas para login (sobrescrevem quando necessário) */
.login-container {
    --obra-brand: #2f4858;
    --obra-brand-deep: #1e3441;
    --obra-surface: var(--obra-login-surface);
    --obra-borda: var(--obra-login-line);
}