:root {
    --ter-green: #51a121;
    --ter-green-dark: #467c18;
    --ter-green-light: #eaf5e0;
    --ter-gray: #9ca3af;
    --ter-gray-dark: #6b7280;
    --ter-text: #1f2937;
    --ter-text-muted: #6b7280;
    --ter-border: #eef0ee;
    --ter-page-bg: #f6f8f5;
    --ter-radius: 14px;
    --ter-radius-sm: 12px;
    --ter-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    --ter-shadow-hover: 0 10px 24px rgba(15, 23, 42, 0.10);
    --ter-transition: 0.2s ease;
}

.PWEB_TER_section {
    background-color: var(--ter-page-bg);
    padding: 1.5rem 0 3rem;
}

.PWEB_TER_container {
    width: min(1100px, calc(100vw - 3rem));
    margin: 0 auto;
}

.PWEB_TER_breadcrumb {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    color: var(--ter-text-muted);
    margin-bottom: 1rem;
}

    .PWEB_TER_breadcrumb a {
        color: var(--ter-text-muted);
        text-decoration: none;
    }

        .PWEB_TER_breadcrumb a:hover {
            color: var(--ter-green-dark);
        }

    .PWEB_TER_breadcrumb span.is-current {
        font-weight: 600;
        color: var(--ter-text);
    }

.PWEB_TER_title {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--ter-text);
    margin: 0 0 0.5rem;
}

.PWEB_TER_subtitle {
    font-size: 0.95rem;
    color: var(--ter-text-muted);
    margin: 0 0 1.75rem;
    max-width: 640px;
}

/* ===== Estado de carga ===== */
.PWEB_TER_loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.85rem;
    padding: 3rem 0;
    color: var(--ter-text-muted);
    font-size: 0.85rem;
}

.PWEB_TER_spinner {
    width: 34px;
    height: 34px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--ter-green);
    border-radius: 50%;
    animation: PWEB_TER_spin 0.8s linear infinite;
}

@keyframes PWEB_TER_spin {
    to {
        transform: rotate(360deg);
    }
}

.PWEB_TER_error {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background-color: #fef2f2;
    border: 1px solid #fee2e2;
    color: #b91c1c;
    border-radius: var(--ter-radius-sm);
    padding: 1rem 1.25rem;
    font-size: 0.85rem;
}

/* ===== Acordeón por año ===== */
.PWEB_TER_yearCard {
    background-color: #ffffff;
    border: 1px solid var(--ter-border);
    border-radius: var(--ter-radius);
    box-shadow: var(--ter-shadow);
    overflow: hidden;
    margin-bottom: 1.25rem;
}

.PWEB_TER_yearHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    border: none;
    cursor: pointer;
    padding: 1.1rem 1.5rem;
    color: #ffffff;
    font-size: 1.05rem;
    font-weight: 700;
    text-align: left;
}

    .PWEB_TER_yearHeader.is-vigente {
        background: linear-gradient(135deg, var(--ter-green), var(--ter-green-dark));
    }

    .PWEB_TER_yearHeader.is-historico {
        background: linear-gradient(135deg, var(--ter-gray), var(--ter-gray-dark));
    }

/* min-width:0 + flex-wrap: en pantallas angostas "Tarifas Históricas 2025" + la
   insignia no caben en una sola línea junto al ícono; sin esto, en vez de envolver,
   el contenido se desborda y la tarjeta (que tiene overflow:hidden) lo recorta —
   la insignia o el chevron de apertura simplemente desaparecían. */
.PWEB_TER_yearHeaderLeft {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    min-width: 0;
}

.PWEB_TER_yearLabel {
    min-width: 0;
}

.PWEB_TER_yearBadge {
    flex-shrink: 0;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    background-color: #ffffff;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
}

    .PWEB_TER_yearHeader.is-vigente .PWEB_TER_yearBadge {
        color: var(--ter-green-dark);
    }

    .PWEB_TER_yearHeader.is-historico .PWEB_TER_yearBadge {
        color: var(--ter-gray-dark);
    }

.PWEB_TER_yearChevron {
    flex-shrink: 0;
    transition: transform var(--ter-transition);
}

    .PWEB_TER_yearChevron.is-open {
        transform: rotate(180deg);
    }

.PWEB_TER_yearBody {
    display: none;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
}

    .PWEB_TER_yearBody.is-open {
        display: flex;
    }

    .PWEB_TER_yearBody.is-historico {
        background-color: var(--ter-page-bg);
    }

/* ===== Banner de vigencia ===== */
.PWEB_TER_banner {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    background-color: var(--ter-green-light);
    border-left: 4px solid var(--ter-green);
    border-radius: var(--ter-radius-sm);
    padding: 0.9rem 1.1rem;
    font-size: 0.83rem;
    font-weight: 600;
    color: var(--ter-green);
}

    .PWEB_TER_banner i {
        font-size: 1rem;
        flex-shrink: 0;
    }

/* ===== Secciones / tablas ===== */
.PWEB_TER_sectionCard {
    border: 1px solid var(--ter-border);
    border-radius: var(--ter-radius-sm);
    overflow: hidden;
}

.PWEB_TER_sectionHeader {
    background: linear-gradient(135deg, var(--ter-green), var(--ter-green-dark));
    color: #ffffff;
    padding: 0.75rem 1.1rem;
    font-size: 0.85rem;
    font-weight: 700;
}

.PWEB_TER_tableWrap {
    overflow-x: auto;
}

/* table-layout:fixed + ancho fijo en la columna de descripción: cada sección (Operaciones
   Terrestres, Movilizaciones, Inspecciones...) es una tabla independiente y por defecto
   calcula sus columnas según su propio contenido, así que la tarifa termina en una
   posición distinta en cada tarjeta. Con un ancho fijo, la columna de tarifa siempre
   arranca en el mismo punto en todas las secciones. */
.PWEB_TER_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.83rem;
    table-layout: fixed;
}

    .PWEB_TER_table td:first-child {
        width: 75%;
    }

    .PWEB_TER_table tbody tr {
        border-top: 1px solid var(--ter-border);
        transition: background-color var(--ter-transition);
    }

        .PWEB_TER_table tbody tr:hover {
            background-color: var(--ter-page-bg);
        }

    .PWEB_TER_table td {
        padding: 0.75rem 1.1rem;
        color: var(--ter-text);
        vertical-align: top;
    }

.PWEB_TER_itemSubtexto {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.74rem;
    color: var(--ter-text-muted);
}

.PWEB_TER_itemActividades {
    margin-top: 0.5rem;
    font-size: 0.74rem;
    color: var(--ter-text-muted);
    line-height: 1.6;
}

.PWEB_TER_itemTarifa {
    text-align: right;
    font-weight: 700;
    color: var(--ter-green-dark);
    white-space: nowrap;
}

.PWEB_TER_sectionNotes {
    background-color: var(--ter-page-bg);
    padding: 0.85rem 1.1rem;
    font-size: 0.78rem;
    color: var(--ter-text-muted);
    line-height: 1.7;
}

    .PWEB_TER_yearBody.is-historico .PWEB_TER_sectionNotes {
        background-color: #f3f4f6;
    }

/* ===== Bloque CEM ===== */
.PWEB_TER_cemCard {
    border: 1px solid var(--ter-border);
    border-radius: var(--ter-radius-sm);
    overflow: hidden;
}

.PWEB_TER_cemHeader {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    background: linear-gradient(135deg, var(--ter-green), var(--ter-green-dark));
    color: #ffffff;
    padding: 0.85rem 1.1rem;
    font-size: 0.88rem;
    font-weight: 700;
}

.PWEB_TER_cemBody {
    padding: 1.5rem;
    background-color: var(--ter-page-bg);
}

    .PWEB_TER_cemBody p {
        margin: 0 0 0.9rem;
        font-size: 0.85rem;
        color: var(--ter-text-muted);
        line-height: 1.65;
    }

        .PWEB_TER_cemBody p:last-of-type {
            margin-bottom: 0;
        }

.PWEB_TER_cemServicesTitle {
    margin: 1.25rem 0 0.85rem;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--ter-text);
}

.PWEB_TER_cemServicesList {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.5rem 1rem;
}

    .PWEB_TER_cemServicesList li {
        display: flex;
        align-items: flex-start;
        gap: 0.5rem;
        font-size: 0.82rem;
        color: var(--ter-text-muted);
    }

    .PWEB_TER_cemServicesList i {
        color: var(--ter-green);
        font-size: 0.78rem;
        margin-top: 0.2rem;
        flex-shrink: 0;
    }

.PWEB_TER_cemFootnotes {
    margin: 1.25rem 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

    .PWEB_TER_cemFootnotes li {
        font-size: 0.76rem;
        color: var(--ter-text-muted);
        padding-left: 1rem;
        position: relative;
    }

        .PWEB_TER_cemFootnotes li::before {
            content: '•';
            position: absolute;
            left: 0;
            color: var(--ter-green);
        }

@media (max-width: 640px) {
    .PWEB_TER_yearHeader {
        padding: 1rem;
        font-size: 0.92rem;
    }

    .PWEB_TER_yearBody {
        padding: 1rem;
    }
}
