/* Variables globales */
:root{
    /* Colores principales */
    --morado-Allure: #6F1B55;
    --rosa-Allure: #BE368C;
    --verde-Allure: #BBC80C;
    --verde-Nav-Allure: #DAEEBD;
    --beige-Allure: #FAF1E0;
    --bg-Admin-Allure: #FCF8EF;
    --beige-tablas: #EBE2D2;
    --beige-tablas-fuerte: #D9D0C2;
    --gris-background-pantalla: #F2F2F2;
    --gris-background-img: #423F3F;
    --gris-bordes: #969696;
    --gris-textos: #242424;
    --gris-Allure: #dadada;

    /* Tamaño de los radios en los bordes */
    --radios-grandes: 15px;
    --radios-chicos: 5px;

    /* Opacidad para transparencias */
    --opacidad-Allure: 0.25;
    --opacidad-Allure-cuadros: 0.6;
    --blanco-Allure-Op: rgba(255, 255, 255, var(--opacidad-Allure));
    --morado-Allure-Op: rgba(111, 27, 85, var(--opacidad-Allure));
    --rosa-Allure-Op: rgba(187, 54, 138, var(--opacidad-Allure));
    --verde-Allure-Op: rgba(187, 200, 12, var(--opacidad-Allure));
    --morado-Allure-Cuadros: rgba(111, 27, 85, var(--opacidad-Allure-cuadros));
    --rosa-Allure-Cuadros: rgba(187, 54, 138, var(--opacidad-Allure-cuadros));
    --verde-Allure-Cuadros: rgba(187, 200, 12, var(--opacidad-Allure-cuadros));
    
    --opacidad-box-shadow: 0.25;
    --box-shadow-morado: 0 0 0 0.25rem rgba(111, 27, 85, var(--opacidad-box-shadow));
    --box-shadow-rosa: 0 0 0 0.25rem rgba(187, 54, 138, var(--opacidad-box-shadow));
    --box-shadow-verde: 0 0 0 0.25rem rgba(187, 200, 12, var(--opacidad-box-shadow));
}



/* Tipografía */
@font-face {
    font-family: "Made Tommy";
    src: url('../FONTS/font_regular.otf');
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "Made Tommy";
    src: url('../FONTS/font_bold.otf');
    font-style: normal;
    font-weight: bold;
}
@font-face {
    font-family: "Made Tommy";
    src: url('../FONTS/font_extra_bold.otf');
    font-style: normal;
    font-weight: bolder;
}
@font-face {
    font-family: "Made Tommy";
    src: url('../FONTS/font_light.otf');
    font-style: normal;
    font-weight: lighter;
}
@font-face {
    font-family: "Made Tommy";
    src: url('../FONTS/font_thin.otf');
    font-style: normal;
    font-weight: 300;
}



/* Ajustes globales */
body{
   font-family: 'Made Tommy', 'Open Sans', serif!important;
   background-color: var(--gris-Allure);
}



/* Clases para textos */
.textosVerdes{
    color: var(--verde-Allure);
}
.textosMorados{
    color: var(--morado-Allure);
}
.textosRosas{
    color: var(--rosa-Allure);
}
.textosBlancos{
    color: white;
}
.parrafos{
    text-align: justify;
}



/* Clases para botones */
.btnMorados{
    background-color: var(--morado-Allure);
    color: white;
}
.btnMorados:hover{
    background-color: var(--rosa-Allure);
    color: white;
}



/* Clases para los campos en los formularios */
.camposFormulario{
    width: 80%;
}
.inputsRegistro{
    border-radius: var(--radios-chicos);
    border: 1px solid var(--gris-bordes);
    padding: 4px 6px;
    margin: 4px 1px;
    caret-color: var(--morado-Allure);
    outline-color: var(--morado-Allure);
}
.inputsRegistro::placeholder{
    color: var(--gris-bordes);
}
select.inputsRegistro{
    color: var(--gris-bordes);
}
.inputsRegistro:focus{
    border-color: var(--morado-Allure);
    box-shadow: 0 0 0 0.25rem var(--morado-Allure-25);
    outline: 0;
}



/* Configuración de las sombras en los textos */
div[data-shadow] {
    font-size:calc(1.25rem + 2.7vw);
    position:relative;
}
@media screen and (min-width: 1200px) {
    div[data-shadow] {
        font-size:3.5rem;
        position:relative;
    }
}
div[data-shadow]::before {
    content:attr(data-shadow);
    color: var(--morado-Allure);
    font-weight: bold;
    text-transform: uppercase;
}
div[data-shadow]::after {
    position:absolute;
    content:attr(data-shadow);
    color:transparent;
    font-weight: bold;
    font-size:105%;
    text-transform: uppercase;
    left:0; top:0;
    text-shadow: 0em -0.5em 0em var(--morado-Allure-Op);
}
div[data-shadow].textosBlancosConSombra::before {
    content:attr(data-shadow);
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    display: inline-block;
    width: 100%;
    text-align: center;
}
div[data-shadow].textosBlancosConSombra::after {
    position:absolute;
    content:attr(data-shadow);
    color:transparent;
    font-weight: bold;
    font-size:100%;
    text-transform: uppercase;
    left:0; top:0;
    display: inline-block;
    width: 100%;
    text-align: center;
    text-shadow: 0em -.5em 0em var(--blanco-Allure-Op);
}
@media screen and (max-width: 768px) {
    div[data-shadow] {
        text-align: center;
    }
    div[data-shadow]::before {
        text-align: center;
    }
    div[data-shadow]::after {
        text-align: center;
    }
}






/* Overlays */
.transparenciasVerdes{
    background-color: var(--verde-Allure-Cuadros);
}
.transparenciasMoradas{
    background-color: var(--morado-Allure-Cuadros);
}
.bordesRedondosCuadros{
    border-radius: var(--radios-grandes);
}
.marcadoresListadosChecks{
    width: 1em;
}