/* Clearis Product Features - estilos del bloque "Oferta Flash" */

.clerfeat-box{
    background:#fff;
    border-radius:6px;
    padding:18px 22px;
    margin:18px 0;
    box-shadow:0 1px 4px rgba(0,0,0,.06);
    font-family:inherit;
    color:#333;
}

/* ---------- Banner Oferta Flash ---------- */
.clerfeat-flash{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:14px;
    border-bottom:1px solid #eee;
    padding-bottom:14px;
}
.clerfeat-flash-left{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.clerfeat-flash-bolt{
    color:#f15a24;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.clerfeat-flash-badge{
    background:#f15a24;
    color:#fff;
    font-weight:700;
    font-size:14px;
    padding:6px 12px;
    border-radius:4px;
    letter-spacing:.5px;
    white-space:nowrap;
}
.clerfeat-flash-text{
    color:#222;
    font-weight:500;
    font-style:italic;
    font-size:15px;
}

/* ---------- Precio ---------- */
.clerfeat-price{
    margin-bottom:18px;
}
.clerfeat-price-now{
    color:#f15a24;
    font-size:34px;
    font-weight:800;
    margin-right:10px;
}
.clerfeat-price-old{
    color:#888;
    font-size:18px;
    text-decoration:line-through;
    margin-right:8px;
}
.clerfeat-price-pct{
    background:#f15a24;
    color:#fff;
    padding:3px 8px;
    border-radius:3px;
    font-weight:700;
    font-size:14px;
    vertical-align:middle;
}
.clerfeat-price-tax{
    color:#aaa;
    font-size:13px;
    margin-top:2px;
}

/* ---------- Grid de características ---------- */
.clerfeat-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
    gap:14px;
    align-items:start;
}
.clerfeat-slot{
    text-align:center;
    padding:8px 4px;
}
.clerfeat-slot-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    height:42px;
    color:#9a9a9a;
    margin-bottom:4px;
}
.clerfeat-slot-label{
    color:#9a9a9a;
    font-size:12px;
    text-transform:none;
    margin-bottom:2px;
}
.clerfeat-slot-value{
    color:#444;
    font-size:13px;
    font-weight:600;
}

/* ---------- Etiqueta energética ---------- */
.clerfeat-energy{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    color:#222;
}
.clerfeat-energy-arrow{
    position:absolute;
    top:-3px;
    left:-2px;
    font-size:8px;
    color:#222;
    font-weight:700;
    background:#fff;
}
.clerfeat-energy-letter{
    display:inline-block;
    background:#7ec242;
    color:#fff;
    font-weight:800;
    font-size:18px;
    width:30px;
    height:24px;
    line-height:24px;
    text-align:center;
    border-radius:2px;
    position:relative;
}
/* Colores por grado */
.clerfeat-energy[data-grade="A"] .clerfeat-energy-letter{background:#00a651}
.clerfeat-energy[data-grade="B"] .clerfeat-energy-letter{background:#7ec242}
.clerfeat-energy[data-grade="C"] .clerfeat-energy-letter{background:#fff200;color:#222}
.clerfeat-energy[data-grade="D"] .clerfeat-energy-letter{background:#fdb813}
.clerfeat-energy[data-grade="E"] .clerfeat-energy-letter{background:#f89728}
.clerfeat-energy[data-grade="F"] .clerfeat-energy-letter{background:#ef4029}
.clerfeat-energy[data-grade="G"] .clerfeat-energy-letter{background:#ed1c24}

/* ---------- Responsive ---------- */
@media (max-width:600px){
    .clerfeat-box{padding:14px}
    .clerfeat-price-now{font-size:28px}
    .clerfeat-grid{grid-template-columns:repeat(3,1fr)}
}