/*
 * Descripción: SIMPLE COOKIES
 * Copyright (c) 2025
*/

/*===================================
			Google Fonts 
=====================================*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,600;0,700;0,900;1,300&display=swap');

/*
	font-family: 'Roboto', sans-serif;
*/

/*===================================
       Colores light / dark
=====================================*/


:root {
  --body-font-size: 1em;
  --body-font-weight: 400;
  --body-line-height: 1.5;
  --fuente-principal:'Roboto', sans-serif, Arial, Helvetica;
    
  --colordest: #ff7700;
  --colordest-hover: #ff7700;
  --colordest-active: #ff7700;
  --colordest-txt:#fff;
  --colordest-fill: #ff7700;

  --colordest-light:#ffe2bf;

  --color-principal:#20282f;
  --color-principal-hover:#20282f;
  --color-principal-focus:#20282f;
  
  --color-title:#20282f;
  --color-title-a:#20282f;
  --color-title-hover:#20282f;
  --color-title-focus:#20282f;

  --color-tit-card:#253750;

  --blanco: #fff;
  --gris:#999;

  --fondoweb:#fff;
  --fondocookies:#fff;


  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1;

  --titaba:#fff;
  --titaba-a:#fff;
  --titaba-hover:#fff;
  --titaba-focus:#fff;
  
  --txtaba:#5b6166;
  --txtaba-a: var(--colordest);
  --txtaba-hover:var(--colordest);
  --txtaba-focus:var(--colordest);

  --borde-tabla:#c7ccd9;
  --fondo-th-tabla:#e7e8ec;
  
  --borde-header:#eeeeee;
  --borde-colder:#dbdfea;
  --borde-colizq:#dbdfea;
  --borde-colder-claro:rgba(255,255,255,0.16);
  --fondo-colder:#f4f4f8;
   
  --color-borde:#e5e9f2;

   /*forms*/
  --form-txt:#79889a;
  --form-color: #79889a;
  --form-fondo:#ffffff;
  --form-borde: #dbdfea;
  --form-borde-hover:#dbdfea;
  --form-borde-active:#dbdfea;
  --form-txt-active:#3c4d62;
  
  --form-txt-disabled:#c2c2c2;
  --form-color-disabled:#c2c2c2;
  --form-borde-disabled:#dbdfea;
  --form-fondo-disabled:#f5f6fa;
  
  --form-label-top: #8D8D8D;
  --form-label-top-active: #000;
  
}

.dark {
    --fondoweb: #141414;
    --fondocookies:#20252a;
   
    --color-principal:#fff;
    --color-principal-hover:#fff;
    --color-principal-focus:#fff;

   
    --form-txt:#fff;
    --form-color: rgba(255,255,255,.7);
    --form-fondo:#20252a;
    --form-borde: rgba(255,255,255,.24);
    --form-borde-hover:#8D8D8D;
    --form-borde-active:#fff;
    --form-txt-active:#fff;
    --form-disabled:#c2c2c2;  

    --form-txt-active:#3c4d62;
    --form-txt-disabled:#556c8e;
    --form-color-disabled:#556c8e;
    --form-borde-disabled:#324054;
    --form-fondo-disabled:#141c26;   
}


/*=========================
        Generales
=========================*/

*,
*::before,
*::after {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

.enlinea, .d-inline-block, .contenidos-enlinea{display:inline-block !important;}
.enbloque, .d-block{display:block !important}
.d-none{display: none !important;}
.extrabold{font-weight: 900}
.semibold{font-weight:600;}
.medium{font-weight:500;}
.normal{font-weight:400;}
.thin{font-weight:300;}

.mr-s-size{margin-right:.45rem !important}
.ml-s-size{margin-left:.45rem !important}
.mt-s-size{margin-top:.45rem !important}
.mb-s-size{margin-bottom:.45rem !important}
.mtb-s-size{margin:.45rem 0px !important}


::selection { background:var(--colordest);  color:var(--colordest-txt);}
::-moz-selection { background:var(--colordest); color:var(--colordest-txt);}



/*___tamaños y separadores__*/

.w-25{width:25%}
.w-50{width:50%}
.w-75{width:75%}
.w-100{width:100%}
.w-auto{ width:auto}

.h-25{height:25%}
.h-50{height:50%}
.h-75{height:75%}
.h-100{height:100%}
.h-auto{height:auto}

.mw-100{max-width:100%}
.mh-100{max-height:100%}

.min-vw-100{min-width:100vw}
.min-vh-100{min-height:100vh}

.vw-100{width:100vw}
.vh-100{height:100vh}

.mr{margin-right:0.5rem}
.ml{margin-left:0.5rem}
.mt{margin-top:1.2rem}
.mb{margin-bottom:1.2rem}
.mtb{margin:0.5rem 0px ;}

.ma{margin:0.5rem}/*margin all*/
.ma-l-size{margin:1rem}
.ma-xl-size{margin:1.5rem}
.ma-s-size{margin:0.25rem}

.mr-auto{margin-right: auto;}
.ml-auto{margin-left: auto;}

.mb-l-size{margin-bottom:1.875rem}
.mb-xl-size{margin-bottom:2.5rem}
.mb-xxl-size{margin-bottom:3.125rem}

.mt-l-size{margin-top:1.875rem}
.mt-xl-size{margin-top:2.5rem}
.mt-xxl-size{margin-top:3.125rem}

.mr-s-size{margin-right:.25rem }
.ml-s-size{margin-left:.25rem }
.mt-s-size{margin-top:.25rem }
.mb-s-size{margin-bottom:.25rem }
.mtb-s-size{margin:.25rem 0px }

.mtb-l-size{margin:1rem 0px }
.mtb-xl-size{margin:1.875rem 0px }

.p-0 {padding: 0.175rem ;}
.p-1 {padding: 0.375rem ;}
.p-2 {padding: 0.75rem ;}
.p-3 {padding: 1rem ;}
.p-4 {padding: 1.5rem ;}
.p-5 {padding: 2.75rem ;}

.gap-4{gap:4px;}
.gap-8{gap:8px;}
.gap-10{gap:10px;}
.gap-15{gap:15px;}

/*=========================
          CUSTOM
=========================*/

.txt-truncate, .elipsis{right:5px}

.contenedor-fluid, .contenedor-full{width:100%;}

.sombra-texto {text-shadow: 2px 1px 1px rgba(0,0,0,0.8);}

.clear::before, .clear::after {content: " "; display: table;}

.hover-trans:hover{opacity:0.7; transition: all .3s;}

.spinner-border {border: .15em solid #575757; border-right-color: transparent}

.contenedor.max-width, .contenedor-fluid.max-width{width: 100%; margin:0 auto;	max-width:1600px;}
.contenedor.max-width.s-size, .contenedor-fluid.max-width.s-size{max-width:1400px;}
.contenedor.max-width.xs-size, .contenedor-fluid.max-width.xs-size{max-width:1200px;}
.contenedor.max-width.xxs-size, .contenedor-fluid.max-width.xxs-size{max-width:1000px;}

.contenido-maxwidth{max-width:1500px; margin:0 auto;}
.contenido-maxwidth.xl-size{max-width:1800px;}
.contenido-maxwidth.l-size{max-width:1600px;}
.contenido-maxwidth.s-size{max-width:1200px;}
.contenido-maxwidth.xs-size{max-width:1024px;}
.contenido-maxwidth.xxs-size{max-width:600px;}

p.s-size{font-size:0.9375em;}
p.xs-size{font-size:0.875em;}
p.xxs-size{font-size:0.8125em;}

.gap-4{gap:4px !important;}
.gap-8{gap:8px !important;}
.gap-10{gap:10px !important;}
.gap-15{gap:15px !important;}

ul li::before, ul li::marker {color:var(--colordest);}

.linea.footer {background:rgba(255,255,255,0.1);}
.dark .linea.footer{}

html{height:100%;}

.full-height{height:100%; flex: 1 1 auto;}
.borde-texto{ -webkit-text-stroke: 1px rgba(0,0,0,0.2); /*text-stroke: 1px rgba(0,0,0,0.2);*/}

.img-dia{display:block;}
.img-noche{display:none;}

.dark .img-dia{display:none;}
.dark .img-noche{display:block;}

.dark img.dianoche {filter: var(--filter-blanco);}

.responsive-iframe {position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%;}
.center-iframe{display:block; margin:0 auto;}

@media (max-width: 480px){
	.logotipo {max-width:200px;}
    footer{
        padding-top:80px;
        /*clip-path: polygon(100% 10%, 0% 0%, 0% 100%, 100% 100%);*/
        clip-path: polygon(100% 0%, 0% 10%, 0% 100%, 100% 100%);
    }
}

.linea {background:var(--form-borde);}
.borde-colder{border-left:1px solid var(--borde-colder);}
.borde-colizq{border-right:1px solid var(--borde-colizq);}
.borde-colder.claro{border-left:1px solid var(--borde-colder-claro);}
.fondo-colder{background:var(--fondo-colder); padding:10px 0;}



/*==============================
          NUEVAS COOKIES
==============================*/

.cookies-fixed{
    position: fixed;
    left: 0;
    bottom: -1px;
    z-index: 999999;
    width: 100%;
    display: block;

    margin: 0;
    padding:0;
    border:none;
    outline:none;

    font-family: var(--fuente-principal);
    font-size: var(--body-font-size);
    line-height: var(--lbody-line-height);
    font-weight: var(--body-font-weight);
    color: var(--color-principal);
}
.cookies-container{
    background: var(--fondocookies);
    padding: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    gap:10px;
}

.cookies-text{
    display: flex;
    align-items: center;
    width:50%
}
.cookies-text.config{
    width:auto;
    flex-direction: column;
    align-items: self-start;
    gap: 10px;
}

.cookies-buttons{
    display: flex;
    align-items: center;
    justify-content: center;
    gap:10px;
    width:50%
}

.cookies-buttons.config{
    width: 30%;
}

@media (max-width: 991px) {
    .cookies-container,.cookies-text, .cookies-buttons{
        flex-direction: column;
        width: 100%;
    }
    .cookies-buttons.config{
        flex-direction: row;
        width: 100%;
    }
}

.container-check{
    font-size: 1.2em;
    padding-left: 28px;
}


/*==============================
          Formularios
==============================*/

.cookies-fixed form, .cookies-fixed input, .cookies-fixed p, .cookies-fixed a{margin:0; padding:0; background:transparent; text-decoration:none;}

.cookies-fixed input, .cookies-fixed textarea { 
       /*-webkit-appearance: none; */
       -webkit-border-radius:0; /* remove border-radius in iOS*/
       border-radius: 0; 
}

.cookies-fixed input::-webkit-calendar-picker-indicator {cursor: pointer;}/*cursor pointer en icono calendario tipo date*/
::-webkit-calendar-picker-indicator {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 24 24"><path fill="%23bbbbbb" d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"/></svg>');
}/*cambia el icono del calendario por uno con un color válido para dark version*/

.cookies-fixed input[type=number] { -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; }/*no muestra las flechitas dentro del input tipo number en Mozilla*/
.cookies-fixed input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0;}/*no muestra las flechitas dentro del input tipo number en Mozilla*/

.label-absolute{position: absolute; left: 0px; top: 70%; z-index: 1; font-size: 0.625em; line-height: 0.85em; font-weight: 500; text-align: left}/*NUEVO*/
.label-absolute.active, .label-absolute.ok{color:var(--form-txt-active);}/*NUEVO*/
.label-absolute.ko{color:var(--rojo);}/*NUEVO*/
.label-absolute.disabled {color: var(--gris-claro)}/*NUEVO*/

.container-check {display: block; position: relative; padding-left: 28px; margin-bottom: 15px; cursor: pointer; font-size: 1.2em; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.container-check input {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark-check {position: absolute; top: 0; left: 0; height: 22px; width: 22px; background-color: var(--form-fondo); border:1px solid var(--form-borde); border-radius:4px;}
.container-check:hover input ~ .checkmark-check{background-color: var(--form-fondo-disabled);}
.container-check input:disabled ~ .checkmark-check {background-color: var(--form-fondo-disabled);}
.container-check input:checked ~ .checkmark-check {background-color: var(--colordest); border:1px solid var(--colordest)}
.checkmark-check:after {content: ""; position: absolute; display: none;}
.container-check input:checked ~ .checkmark-check:after {display: block;}
.container-check .checkmark-check:after {left: 7px; top: 3px; width: 6px; height: 12px; border:1px solid var(--blanco); border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/*==============================
             Botones
==============================*/

.enlinea-botones .boton{margin-bottom:5px;}
.botones-enlinea .boton{margin-bottom:5px;}

.boton {
  font-family: inherit; display:inline-block; padding:10px 15px; font-weight:normal; font-size:1em; line-height:1.42857143; text-align:center; vertical-align:middle; border-radius:inherit; -ms-touch-action:manipulation; touch-action:manipulation; background-image:none;  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
  border:1px solid transparent; background-color:inherit; color:inherit; cursor:pointer; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-appearance: none;/*elimina estilos por defecto ios*/
  vertical-align: middle; line-height: 1;
}
.boton:focus,.boton:active:focus,.boton.active:focus,.boton.focus,.boton:active.focus,.boton.active.focus{outline:5px auto -webkit-focus-ring-color; outline-offset:-2px; outline:0; /*box-shadow: 0 0 0 0.1rem rgba(0, 0, 0, 0.08);*/}
.boton:hover,.boton:focus,.boton.focus{color:inherit; text-decoration:none;}
.boton.disabled,.boton[disabled],button[disabled] .boton,fieldset[disabled] .boton {cursor:not-allowed !important; filter:alpha(opacity=85); opacity:.85; -webkit-box-shadow:none; box-shadow:none; pointer-events: none;/*no hover*/}

.boton a{color:inherit;}
.boton a:hover{color:inherit;}
input.boton{cursor:pointer;/*border:0 none;*/ outline:none;}
.boton i{vertical-align:middle; line-height:1;}

.boton-rounded {border-radius:100%;}

.boton .badge {position: relative; top: -1px;}

.boton.redondeado {
    border-radius: 50px;
    min-width: 120px;
}

.boton.redondo {
    border-radius: 10px;
    min-width: 120px;
}

.boton.bold{font-weight: 500}

.boton.colordest {color: var(--colordest-txt) !important;background-color: var(--colordest);}
.boton.colordest:hover,.boton.colordest.bordered:hover, .boton.colordest.active, .boton.colordest.bordered.active {color: var(--colordest-txt) !important;background-color: var(--colordest) !important;}
.boton.colordest.bordered {color: var(--colordest) !important;background-color: transparent; border:1px solid var(--colordest);}

.boton.grisclaro {color: var(--blanco); background-color: var(--gris);}
.boton.grisclaro:hover,.boton.grisclaro.active {color: var(--blanco); background-color: var(--gris);}
.boton.grisclaro.bordered, .boton.grisclaro.bordered:hover, .boton.grisclaro.bordered.active {border:1px solid var(--gris); color: var(--negro); background:transparent}

.boton.transparente {color: var(--colordest); background-color: transparent;}
.boton.transparente:hover,.boton.transparente.active {color: var(--colordest!important); background-color: transparent;}
.boton.transparente.bordered, .boton.transparente.bordered:hover, .boton.transparente.bordered.active {border:1px solid var(--gris); color: var(--negro); background:transparent}

/*tamaños botones*/
.boton.xl-size {padding: 14px 16px; font-size: 1.125em; line-height: 1.3333333;}/*btn-big padding: 18px 16px;*/
.boton.l-size {padding: 12px 16px; font-size: 1em; line-height: 1.3333333;}/*btn-med padding: 14px 16px;*/
.boton.s-size {padding: 6px 12px; font-size: 0.9375em; line-height: 1.5;}/*btn-min padding: 8px 12px;*/

.boton.xs-size {padding: 3px 8px; font-size: 0.8125em; line-height: 1.5;}/*btn-peq padding: 5px 8px;*/
.boton.xs-size img{max-width:16px;}

.boton.xxs-size {padding: 0px 6px; font-size: 0.8125em; line-height: 1.5;}

.boton.full, .btn.full{width:100%; display:block; min-width:100%;}

.boton.redondeado {border-radius: 50px; min-width:120px}

.boton:disabled{color: var(--form-color-disabled) !important; background-position: 100% 50%; background-color:var(--form-fondo-disabled); border:1px solid var(--form-borde-disabled); cursor: not-allowed; pointer-events: none;}

/*==============================
			Textos
==============================*/

.txtmin.l-size{font-size: 0.875em;}
.txtmin{font-size: 0.8125em; text-decoration: none;line-height:1.231em;}
.txtmin.s-size{font-size:0.75em;}
.txtmin.xs-size{font-size:0.6875em;}
.txtmin.active{color:var(--colordest);}


/*colores*/
.colordest {color:var(--colordest) !important;}