/*======================================================
                    VARIABLES GLOBALES
======================================================*/

:root{

    /*==================================================
                        COLORES
    ==================================================*/

    /* Color principal (Dorado) */
    --color-primary: #C89A56;
    --color-primary-light: #D9B57A;
    --color-primary-dark: #A77937;

    /* Gradiente dorado */
    --gradient-gold: linear-gradient(
        135deg,
        #D9B57A 0%,
        #C89A56 45%,
        #A77937 100%
    );

    /* Fondos */
    --bg: #000000;
    --bg-secondary: #111111;
    --card: #161616;
    --card-hover: #1D1D1D;

    /* Textos */
    --text-white: #FFFFFF;
    --text-main: #ECECEC;
    --text-secondary: #B7B7B7;
    --text-muted: #8C8C8C;

    /* Bordes */
    --border: #252525;

    /* Estados */
    --success: #25D366;
    --danger: #E74C3C;
    --warning: #F39C12;



    /*==================================================
                        TIPOGRAFÍA
    ==================================================*/

    --font-family: 'Poppins', sans-serif;

    /* Tamaños */

    --fs-xs: .75rem;      /*12px*/
    --fs-sm: .875rem;     /*14px*/
    --fs-md: 1rem;        /*16px*/
    --fs-lg: 1.125rem;    /*18px*/
    --fs-xl: 1.4rem;      /*22px*/
    --fs-2xl: 2rem;       /*32px*/
    --fs-3xl: 2.8rem;     /*45px*/

    /* Pesos */

    --fw-light:300;
    --fw-regular:400;
    --fw-medium:500;
    --fw-semibold:600;
    --fw-bold:700;



    /*==================================================
                        ESPACIADOS
    ==================================================*/

    --space-1:4px;
    --space-2:8px;
    --space-3:12px;
    --space-4:16px;
    --space-5:20px;
    --space-6:24px;
    --space-7:32px;
    --space-8:40px;
    --space-9:50px;
    --space-10:60px;
    --space-11:80px;



    /*==================================================
                        BORDES
    ==================================================*/

    --radius-sm:10px;
    --radius-md:16px;
    --radius-lg:22px;
    --radius-xl:28px;
    --radius-round:999px;



    /*==================================================
                        SOMBRAS
    ==================================================*/

    --shadow-sm:
    0 3px 8px rgba(0,0,0,.15);

    --shadow-md:
    0 10px 25px rgba(0,0,0,.30);

    --shadow-lg:
    0 20px 40px rgba(0,0,0,.45);

    --shadow-gold:
    0 10px 25px rgba(200,154,86,.25);



    /*==================================================
                        TRANSICIONES
    ==================================================*/

    --transition-fast:.2s ease;
    --transition:.35s ease;
    --transition-slow:.6s ease;



    /*==================================================
                        LAYOUT
    ==================================================*/

    --container-width:430px;

    --header-height:80px;



    /*==================================================
                        BOTONES
    ==================================================*/

    --btn-height:62px;

    --btn-font-size:1.2rem;

    --btn-radius:18px;



    /*==================================================
                        CARDS
    ==================================================*/

    --card-radius:18px;

    --card-padding:20px;



    /*==================================================
                        ICONOS
    ==================================================*/

    --icon-sm:20px;
    --icon-md:28px;
    --icon-lg:38px;
    --icon-xl:55px;



    /*==================================================
                        Z-INDEX
    ==================================================*/

    --z-dropdown:1000;
    --z-sticky:1010;
    --z-fixed:1020;
    --z-modal-backdrop:1030;
    --z-modal:1040;
    --z-tooltip:1050;



    /*==================================================
                    EFECTOS ESPECIALES
    ==================================================*/

    --glass: rgba(255,255,255,.03);

    --blur: blur(10px);

}