.epw{--ep-accent:#ec8900;--ep-ink:#000000;--ep-muted:#000000;--ep-border:#7D0400;color:var(--ep-ink);font-family:inherit;font-size:16px;line-height:1.55;max-width:1200px;margin:24px auto}.epw *{box-sizing:border-box}.epw [hidden]{display:none!important}.epw h2,.epw h3,.epw h4,.epw p{margin:0 0 12px}.epw h2{color:#7D0400;font-size:clamp(26px,4vw,38px);line-height:1.2}.epw h3{color:#7D0400;font-size:22px}.epw h4{color:#7D0400;font-size:19px}.epw-header{padding:28px 30px;background:#FFF8F2;border-radius:12px;border:1px solid var(--ep-border);margin-bottom:20px}.epw-eyebrow{display:block;color:#7D0400;letter-spacing:.12em;font-size:11px;font-weight:700;margin-bottom:9px}.epw-header p{margin:0;color:var(--ep-muted)}.epw-alerts{padding:24px;border:1px solid var(--ep-border);border-radius:12px;background:#FFF8F2;margin-bottom:20px}.epw-forecast{padding:0;border:0;border-radius:0;background:transparent;margin-bottom:20px}.epw-summary{padding:0;border:0;border-radius:0;background:transparent;margin-bottom:20px}.epw-heading{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:8px}.epw-heading h3{margin:0}.epw-muted,.epw-footnote,.epw-source,.epw-footer,.epw-coverage{color:var(--ep-muted)}.epw-muted{font-size:14px}.epw-status{padding:12px 16px;border-radius:10px;font-size:14px}.epw-clear{background:#edf6ed;color:#285638;border:1px solid #d3e9d6}.epw-unknown{background:#fff7e7;color:#805714;border:1px solid #f2dfb7}.epw-warning{border-left:5px solid;padding:15px 18px;border-radius:8px;margin:12px 0}.epw-warning p{margin:7px 0}.epw-amarillo{background:#fffbea;border-color:#dfb600}.epw-naranja{background:#fff2e5;border-color:#eb8200}.epw-rojo{background:#fff0ef;border-color:#c62f24}.epw-valid{font-size:13px}.epw-source{font-size:12px;margin-top:16px}.epw a{color:#7D0400;text-decoration:underline;text-underline-offset:3px}.epw a:hover{color:#126000}.epw-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.epw-overview{padding:20px;border:1px solid #7D0400;border-radius:12px;background:#FFF8F2}.epw-overview h4{display:flex;justify-content:space-between}.epw-overview h4 small{font-weight:400;color:var(--ep-muted);font-size:14px}.epw-metric-min{color:#365B88}.epw-metric-max{color:#C62F24}.epw dl{margin:12px 0}.epw dl div{display:flex;justify-content:space-between;gap:12px;margin:7px 0}.epw dt{font-weight:400}.epw dd{margin:0;font-weight:650;white-space:nowrap}.epw-coverage{font-size:12px;margin:14px 0 0!important}.epw-footnote{font-size:12px;margin:16px 0 0!important}.epw-select{display:flex;align-items:center;gap:10px}.epw-select label{font-size:13px}.epw select{font:inherit;color:var(--ep-ink);background:#FFFFFF;border:1px solid #7D0400;border-radius:8px;padding:9px 32px 9px 12px;max-width:100%;min-height:44px}.epw select:focus-visible,.epw a:focus-visible{outline:3px solid var(--ep-accent);outline-offset:3px}.epw-panel{margin-top:24px}.epw-days{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.epw-day{padding:16px 12px;border:1px solid var(--ep-border);border-radius:12px;background:#FFF8F2}.epw-day-date{font-size:13px;font-weight:700;text-transform:capitalize}.epw-temperatures{display:flex;align-items:baseline;gap:10px;margin:10px 0}.epw-temperatures strong{font-size:30px;color:#C62F24;line-height:1.2}.epw-temperatures span{font-size:21px;color:#365B88}.epw-sky{font-size:13px;min-height:40px}.epw-day dl{font-size:12px;margin-bottom:0}.epw-day small{display:block;color:var(--ep-muted);font-size:10px}.epw-footer{font-size:12px;padding:0 6px}.epw-overview small{font-size:11px}@media(max-width:600px){.epw-header,.epw-alerts,.epw-summary,.epw-forecast{padding:18px}.epw-summary-grid{grid-template-columns:1fr}.epw-select{display:block;width:100%}.epw-select label{display:block;margin:6px 0}.epw select{width:100%}.epw-days{grid-template-columns:repeat(2,minmax(0,1fr))}.epw h3{color:#7D0400;font-size:20px}.epw-overview{padding:16px}}

/* Previsión: selector + hoy / seis días restantes */
.epw-forecast-top{
    display:grid;
    grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);
    gap:16px;
    align-items:stretch;
}

.epw-forecast-today,
.epw-forecast-today .epw-panel{
    display:contents;
}

.epw-forecast-selector{
    grid-column:1;
    padding:20px;
    border:1px solid #7D0400;
    border-radius:12px;
    background:#FFF8F2;
}

.epw-select-title{
    margin:0 0 12px;
    font-weight:700;
    color:#7D0400;
}

.epw-forecast-selector .epw-select{
    display:block;
}

.epw-forecast-selector select{
    width:100%;
}

.epw-today{
    grid-column:2;
}

.epw-day-today{
    height:100%;
}

.epw-days-rest{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
}

.epw-forecast-top .epw-source,
.epw-forecast-top .epw-status{
    grid-column:1 / -1;
}

@media(max-width:900px){
    .epw-days-rest{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}

@media(max-width:600px){
    .epw-forecast-top{
        grid-template-columns:1fr;
    }

    .epw-forecast-selector,
    .epw-today{
        grid-column:1;
    }

    .epw-days-rest{
        grid-column:1;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

/* Tamaño de iconos meteorológicos */
.epw-weather-icon{
    width:82px;
    height:82px;
    margin:12px auto;
}

.epw-weather-icon svg{
    display:block;
    width:100%;
    height:100%;
}

.epw-day-today .epw-weather-icon{
    width:130px;
    height:130px;
    margin:12px auto;
}

/* Tarjeta de hoy horizontal en escritorio y tablet */
.epw-day-today{
    display:grid;
    grid-template-columns:140px minmax(180px,.8fr) minmax(240px,1fr);
    grid-template-areas:
        "icon date data"
        "icon temps data"
        "icon sky data"
        "icon period data";
    column-gap:24px;
    row-gap:8px;
    align-items:center;
}

.epw-day-today .epw-day-date{
    grid-area:date;
}

.epw-day-today .epw-temperatures{
    grid-area:temps;
}

.epw-day-today .epw-weather-icon{
    grid-area:icon;
    width:120px;
    height:120px;
    margin:0 auto;
}

.epw-day-today .epw-sky{
    grid-area:sky;
    margin:0;
}

.epw-day-today > small{
    grid-area:period;
}

.epw-day-today dl{
    grid-area:data;
    margin:0;
}

/* En móvil vuelve al mismo formato vertical que el resto */
@media(max-width:600px){
    .epw-day-today{
        display:block;
    }

    .epw-day-today .epw-weather-icon{
        width:82px;
        height:82px;
        margin:12px auto;
    }
}

/* Igualar separación vertical y horizontal entre tarjetas */
.epw-days-rest{
    margin-top:0;
}

/* Fechas en formato largo */
.epw-day-date{
    line-height:1.15;
}

.epw-day-date strong{
    display:block;
    margin-bottom:4px;
    font-size:22px;
    font-weight:800;
    color:#7D0400;
    text-transform:uppercase;
}

.epw-day-date span{
    display:block;
    font-size:17px;
    font-weight:400;
    color:#000000;
}

/* Temperatura mínima algo más destacada */
.epw-temperatures span{
    font-size:24px;
    font-weight:600;
    color:#365B88;
}

/* Hoy: fecha y mínima ligeramente mayores */
.epw-day-today .epw-day-date strong{
    font-size:24px;
}

.epw-day-today .epw-day-date span{
    font-size:18px;
}

.epw-day-today .epw-temperatures span{
    font-size:26px;
}

/* Centrado del bloque visual de cada día */
.epw-day-date,
.epw-temperatures,
.epw-weather-icon,
.epw-sky{
    text-align:center;
}

.epw-temperatures{
    justify-content:center;
}

.epw-weather-icon{
    margin-left:auto;
    margin-right:auto;
}

/* En la tarjeta de hoy, centrar también la columna visual */
.epw-day-today .epw-day-date,
.epw-day-today .epw-temperatures,
.epw-day-today .epw-sky{
    text-align:center;
}


/* ======================================================
   RESPONSIVE PREVISIÓN — TABLET / ANCHO INTERMEDIO
   ====================================================== */

@media (max-width: 1100px) and (min-width: 601px) {

    .epw-forecast-top {
        grid-template-columns: 1fr;
    }

    .epw-forecast-selector,
    .epw-today {
        grid-column: 1;
        min-width: 0;
    }

    .epw-day-today {
        grid-template-columns:
            130px
            minmax(170px, .8fr)
            minmax(0, 1fr);

        column-gap: 20px;

        min-width: 0;
    }

    .epw-day-today dl {
        min-width: 0;
    }

    .epw-day-today dl div {
        min-width: 0;
    }
}


/* Ajuste de ancho del selector de municipio */
@media (min-width: 1101px) {

    .epw-forecast-top {
        grid-template-columns: minmax(340px, 400px) minmax(0, 1fr);
    }

}


/* Mantener selector y día de hoy en la misma fila */
@media (min-width: 701px) {

    .epw-forecast-top {
        grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
    }

    .epw-forecast-selector {
        grid-column: 1;
    }

    .epw-today {
        grid-column: 2;
    }

    .epw-day-today {
        grid-template-columns:
            110px
            minmax(150px, .7fr)
            minmax(180px, 1fr);

        column-gap: 14px;
    }

}


/* ======================================================
   TARJETA DE HOY — RESPONSIVE SIN DESBORDAMIENTO
   Mantiene selector + previsión en la misma fila
   ====================================================== */

@media (min-width: 701px) {

    .epw-forecast-top {
        grid-template-columns: minmax(250px, 300px) minmax(0, 1fr);
    }

    .epw-day-today {
        grid-template-columns:
            minmax(80px, 110px)
            minmax(140px, .65fr)
            minmax(230px, 1.35fr);

        column-gap: 12px;
        min-width: 0;
    }

    .epw-day-today dl {
        width: 100%;
        min-width: 0;
    }

    .epw-day-today dl div {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 12px;
        width: 100%;
        min-width: 0;
    }

    .epw-day-today dt {
        min-width: 0;
    }

    .epw-day-today dd {
        min-width: 0;
        white-space: nowrap;
        text-align: right;
    }
}


/* Cuando el espacio empieza a ser justo:
   las dos tarjetas siguen en la misma fila,
   pero la tarjeta de hoy se reorganiza internamente */
@media (min-width: 701px) and (max-width: 950px) {

    .epw-forecast-top {
        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    }

    .epw-day-today {
        grid-template-columns: 90px minmax(0, 1fr);

        grid-template-areas:
            "icon date"
            "icon temps"
            "sky  sky"
            "data data";

        column-gap: 12px;
        row-gap: 6px;
    }

    .epw-day-today > small {
        display: none;
    }

    .epw-day-today dl {
        margin-top: 8px;
    }

    .epw-day-today .epw-weather-icon {
        width: 90px;
        height: 90px;
    }
}


/* ======================================================
   AVISOS METEOROLÓGICOS — DISEÑO COMPACTO
   ====================================================== */

.epw-alerts {
    padding: 18px;
}

.epw-alerts > .epw-muted {
    margin-bottom: 14px;
}

.epw-warning {
    margin: 10px 0;
    padding: 14px 16px;

    border-left-width: 4px;
    border-radius: 8px;
}

.epw-warning-title {
    display: block;

    margin-bottom: 6px;

    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .015em;
}

.epw-warning-desc {
    margin: 0 0 6px !important;

    color: #000000;
    font-size: .95rem;
    line-height: 1.4;
}

.epw-valid {
    margin: 0 !important;

    color: #000000;
    font-size: .82rem;
    line-height: 1.35;
}

.epw-warning-zone {
    white-space: nowrap;
}

.epw-alerts .epw-source {
    margin-top: 12px;

    font-size: .78rem;
    line-height: 1.4;
}


/* Mantener colores semánticos */
.epw-amarillo {
    background: #FFFBEA;
    border-color: #DFB600;
}

.epw-naranja {
    background: #FFF2E5;
    border-color: #EB8200;
}

.epw-rojo {
    background: #FFF0EF;
    border-color: #C62F24;
}


/* Móvil */
@media (max-width: 600px) {

    .epw-alerts {
        padding: 14px;
    }

    .epw-warning {
        padding: 12px 13px;
    }

    .epw-warning-title {
        font-size: .95rem;
    }

    .epw-warning-desc {
        font-size: .9rem;
    }

    .epw-valid {
        font-size: .78rem;
    }
}