/* 
 * variables.css
 * Variables de color y configuración global para Bhava Nirodha Nilaya
 * Colores ocre monásticos optimizados para accesibilidad
 */

:root {
    /* Paleta de colores ocre monásticos */
    --primary-color: #8B4513;     /* Ocre oscuro - color principal */
    --secondary-color: #A0522D;   /* Ocre medio - elementos secundarios */
    --accent-color: #CD853F;      /* Ocre claro - acentos y hover */
    --text-color: #2c2c2c;        /* Texto principal - casi negro */
    --light-bg: #F5F5DC;          /* Beige claro - fondos suaves */
    --white: #ffffff;             /* Blanco puro */
    --border-color: #D2B48C;      /* Bordes sutiles */
    --shadow-color: rgba(139, 69, 19, 0.1); /* Sombras sutiles */
    
    /* Colores funcionales */
    --success-color: #8FBC8F;     /* Verde suave para confirmaciones */
    --warning-color: #DEB887;     /* Beige oscuro para advertencias */
    --error-color: #CD853F;       /* Ocre para errores (mantiene armonía) */
    
    /* Tipografía */
    --font-family-base: Georgia, serif;
    --font-family-headings: Georgia, serif;
    --font-size-base: 16px;
    --line-height-base: 1.6;
    
    /* Espaciado */
    --spacing-xs: 0.25rem;    /* 4px */
    --spacing-sm: 0.5rem;     /* 8px */
    --spacing-md: 1rem;       /* 16px */
    --spacing-lg: 1.5rem;     /* 24px */
    --spacing-xl: 2rem;       /* 32px */
    --spacing-xxl: 3rem;      /* 48px */
    
    /* Contenedores */
    --container-max-width: 1200px;
    --container-padding: 1rem;
    
    /* Bordes y radios */
    --border-radius-sm: 4px;
    --border-radius-md: 6px;
    --border-radius-lg: 8px;
    --border-radius-xl: 12px;
    
    /* Transiciones */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.4s ease;
    
    /* Sombras */
    --shadow-sm: 0 2px 4px var(--shadow-color);
    --shadow-md: 0 4px 6px var(--shadow-color);
    --shadow-lg: 0 8px 16px var(--shadow-color);
    
    /* Z-index */
    --z-dropdown: 100;
    --z-header: 500;
    --z-modal: 1000;
    --z-tooltip: 1500;
}