* {margin:0; padding:0; box-sizing:border-box;}
body {background-color: rgba(var(--color-fondo-rgb),0.27); font-family:var(--fuente),poppins; color: var(--color-texto);}
p {font-size:17px;}
.titulo {font-size:26px; font-family:var(--fuente-titulo),poppins; color:var(--color-texto); margin-bottom:15px; font-weight:bold; width: 100%;}
.subtitulo {font-size:18px; color:var(--color-texto); margin-bottom:12px; line-height:1.5;}


.btn_mg {
    margin: 8px auto 0px auto;
    text-transform: capitalize;
    text-shadow: 0px 1px 10px rgba(0, 0, 0, 0.5);
    letter-spacing:0.6px;
    text-decoration: none;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    height: 40px;
    border-radius: 10px;
    background-color: #222222;
    background-color: var(--color-primario);
    border: none;
    color: #fff;
    cursor: pointer;
    font-weight: 400;
    font-size: 14.1px;
    line-height: 20px;
    position: relative;
    display: flex;
    -webkit-transition: all .24s linear 0ms;
    -khtml-transition: all .24s linear 0ms;
    -moz-transition: all .24s linear 0ms;
    -ms-transition: all .24s linear 0ms;
    -o-transition: all .24s linear 0ms;
    transition: all .24s linear 0ms;
}
        
.btn_mg:hover {transform: translateY(-2px); background-color:#222222; rgba(var(--color-primario-rgb),0.8); box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);}
.btn_mg:active {background-color: rgba(var(--color-primario-rgb),0.6); transform: translateY(1px);}
.btn_mg:focus {outline:none; box-shadow: 0 0 0 4px rgba(var(--color-primario-rgb),0.5);}
.1btn_mg i {font-size:15px;}
.btn_mg_secundario {background-color: var(--color-secundario);}
.btn_mg_simple {font-size:18px; padding:10px 16px; border:1px solid rgba(200, 201, 202, 1); text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1); background-color:#fff; cursor:pointer; color: rgba(45, 46, 47, 1); border-radius: 8px; text-decoration:none; -webkit-transition:all 0.8s; transition:all 0.8s;}
.btn_mg_simple:hover {background-color: #222222; color:#fff;}
.btn_mg_simple .btn_verde {background:#EBFBEE; color:#40C057; border:1px solid #40C057;}




.btn_mg_pidir_ahora { text-shadow:none;
    
    border:1px solid rgba(200, 201, 202, 1); 
    background-color:#F7F7F7; cursor:pointer; color: rgba(45, 46, 47, 1); 
    
    1border-radius: 8px; 1text-decoration:none; -webkit-transition:all 0.8s; transition:all 0.8s;
    
    
    11background:#fff; 1color:var(--color-primario); -webkit-transition: all .24s linear 0ms; -khtml-transition: all .24s linear 0ms; -moz-transition: all .24s linear 0ms; -ms-transition: all .24s linear 0ms; -o-transition: all .24s linear 0ms; transition: all .24s linear 0ms;}


.1btn_mg_pidir_ahora {background:#fff; color:var(--color-primario); -webkit-transition: all .24s linear 0ms; -khtml-transition: all .24s linear 0ms; -moz-transition: all .24s linear 0ms; -ms-transition: all .24s linear 0ms; -o-transition: all .24s linear 0ms; transition: all .24s linear 0ms;}
.btn_mg_pidir_ahora:hover {background-color:#222222; color:#fff;}
        


        /* Específicamente para que el <a> funcione como un botón */
        1a.btn_mg {
           1 line-height: 1.1; /* Para alinear mejor el texto dentro del enlace */
        }
        
.btn_mg .cen {text-align:center;}

@media (max-width: 768px) {.titulo {font-size: 22px;} .subtitulo {font-size:16px;}}



.etiqueta {position:absolute; z-index:2; padding:4px 2px; top:20px; left:0px; background-color:#CC0C39; color:#fff; font-weight: bold; font-size: 14px; width: 60px; text-align: center; border-radius:4px; 1transform: rotate(-40deg);}
.etiqueta_nuevo {top:50px; background-color:#10a37f;}
.etiqueta_txt {font-size:16px; color:#CC0C39; font-weight: bold;}
.txt_uni_medida {color:#575757; font-size: 16px; }
.txt_pre {color: #35404A; font-weight: bold; font-size: 16px;}
.txt_pre_cotiza {font-size:16px; color:#004E00; font-weight: bold;}
.txt_pre_rebaja {font-size:16px; color:#000; font-weight: bold;}
.txt_pre_anterior {text-decoration: line-through; color: #575757; font-size: 13px; margin-right: 5px;}




        /* Estilo base para el contenedor de estrellas */
        .estrellas_contenedor {
            display: flex;
            align-items: center;
            
        }

        /* Estilos por defecto para el tamaño de las estrellas */
        .estrellas_completa, .estrellas_vacia, .estrellas_mitad {
            font-size: 32px;
            margin-right: 5px;
            position: relative;
        }
        .estrellas_vacia {
            color: lightgray;
        }
        .estrellas_mitad {
            color: lightgray;
        }
        .estrellas_mitad::before {
            content: "★";
            position: absolute;
            top: 0;
            left: 0;
            width: 50%;
            overflow: hidden;
            white-space: nowrap;
            color: var(--star-color, orange); /* Uso de la variable para el color */
        }

        /* Tamaños personalizados */
        .estrella_s .estrellas_completa, 
        .estrella_s .estrellas_vacia, 
        .estrella_s .estrellas_mitad {
             font-size: 20px;
            margin-right: 0;
        }

        .estrella_m .estrellas_completa, 
        .estrella_m .estrellas_vacia, 
        .estrella_m .estrellas_mitad {
            font-size: 24px;
            margin-right: 0;
        }


        .votos_texto {font-family:arial;
            margin-left:5px; padding:8px 0 0 0; 
            font-size: 13px;
            color: #ccc; /* Color por defecto */
        }


/* Para pantallas más pequeñas (móviles): ocultar el div */
@media (max-width: 768px) {
  .mostrar-en-pc {
    display: none;
  }
  .mostrar-en-cel {
    display: block;
  }
}


1img, .1nitido {filter: url('data:image/svg+xml,\ <svg xmlns="http://www.w3.org/2000/svg">\ <filter id="sharpen">\ <feConvolveMatrix order="3" preserveAlpha="true" kernelMatrix="0 -1 0 -1 5 -1 0 -1 0"/>\ </filter>\</svg>#sharpen') saturate(105%) brightness(1.05); }
