@tailwind base;
@tailwind components;
@tailwind utilities;

@theme {
    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
}

[x-cloak] {
    display: none;
}

:root {
    /* --main-color: #141d38; */
    --main-color: #00459E;
    --neutral-50: #eeeff1;

    /* Corporate colors CCL */
    /* 🌟 Primarios */
    --yellow-ccl: #FFDA00;
    --blue-ccl: #10069F;
    --green-ccl: #1E5631;
    /* 🔹 Derivados del Amarillo */
    --yellow-ccl-light: #FFE866;
    --yellow-ccl-pastel: #FFF5B0;
    --yellow-ccl-dark: #CCAD00;
    /* 🔹 Derivados del Azul */
    --blue-ccl-light: #4D47C3;
    --blue-ccl-pastel: #A9A6E2;
    --blue-ccl-dark: #0B0450;
    /* 🔹 Derivados del Verde Oscuro */
    /* --green-ccl-medium: #4D7A4C; */
    --green-ccl-medium: #60c659;
    --green-ccl-light: #A1CFA3;
    --green-ccl-dark: #0F2B18;
    /* 🌟 Secundarios (ya definidos) */
    --black: #000000;
    --gray-cool: #999999;
    --green-ccl: #94C833;
    /* 🔹 Derivados del Gris */
    --gray-ccl-light: #CCCCCC;
    --gray-ccl-very-light: #F2F2F2;
    --gray-ccl-dark: #666666;
    /* 🔹 Derivados del Verde Claro */
    --green-ccl-light: #B5E673;
    --green-ccl-pastel: #DFF5C1;
    --green-ccl-dark: #6FA82D;
}

.btn-main {
    background-color: var(--main-color);
    color: var(--neutral-50);
}

.btn-main:hover {
    background-color: var(--green-ccl-medium);
    color: var(--neutral-50);
}

.link-main {
    color: var(--green-ccl-medium);
}
.link-main:hover {
    color: var(--main-color);
}

.form-check.form-check-solid .form-check-input {
    border: 0;
    background-color: #eff2f5
}

.form-check.form-check-solid .form-check-input:active,.form-check.form-check-solid .form-check-input:focus {
    filter: none;
    background-color: #eff2f5
}

.form-check.form-check-solid .form-check-input:checked {
    background-color: var(--green-ccl-medium) !important;
}