/**
 * mod_zlapptrailcondition
 *
 * nooit eerder geladen (zie CHANGELOG.md) - de template
 * gebruikte deze classes al sinds, maar er was geen stylesheet
 * om ze te definiëren.
 *
 * @copyright   (C) 2026 Armand Jansen. All rights reserved.
 * @license     GNU General Public License version 2 or later
 */

.zlapptrailcondition-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.zlapptrailcondition-item {
    border-bottom: 1px solid #eee;
}

.zlapptrailcondition-item:last-child {
    border-bottom: none;
}

.zlapptrailcondition-item-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0;
    color: inherit;
    text-decoration: none;
}

/*: rijen met coördinaten zijn nu klikbaar (echte <a>, zelfde
   bestemming als de kaart-popup-knop) - een hover/focus-indicatie zodat
   duidelijk is dat de rij aanklikbaar is, zonder de bestaande layout te
   verstoren (geen onderstreping/linkkleur op de badge zelf). */
a.zlapptrailcondition-item-link--clickable {
    cursor: pointer;
    margin: 0 -0.5rem;
    padding: 0.35rem 0.5rem;
    border-radius: 4px;
}

a.zlapptrailcondition-item-link--clickable:hover,
a.zlapptrailcondition-item-link--clickable:focus-visible {
    background: #f2f6f9;
}

a.zlapptrailcondition-item-link--clickable:focus-visible {
    outline: 2px solid #0277bd;
    outline-offset: -2px;
}

.zlapptrailcondition-name {
    font-weight: 600;
    flex: 1;
}

.zlapptrailcondition-moisture {
    color: #777;
    font-size: 0.9em;
}

/*: trend-indicatortje in de lijst (tmpl/default.php) - zelfde
   grijstint als moisture hierboven, geen kleurcodering nodig (de badge
   ernaast draagt de kleur al). */
.zlapptrailcondition-trend {
    color: #777;
    font-size: 0.9em;
}

.zlapptrailcondition-more {
    color: #777;
    font-size: 0.85em;
    font-style: italic;
    margin: 0.4rem 0 0;
}

.zlapptrailcondition-empty {
    color: #777;
    font-style: italic;
}

.zlapptrailcondition-badge {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.85em;
    font-weight: 600;
}

/* (naar aanleiding van "de kleuren en scores in de module
   zijn anders dan in het component"): exact dezelfde 7-staps
   geel->groen->blauw-gradiënt als com_zlapptrailcondition's
   explore.css (v2.20.9) - was voorheen een grover 4-categorieën
   "ernst"-schema (danger/warning/success/info/muted), een bewuste
   eerdere keuze die door dit verzoek is achterhaald - zie helper.php
   voor de volledige toelichting. Bewust intenser/verzadigder richting
   de twee extremen, rustiger/pasteller richting het kalme midden
   ("ideaal") - zelfde ontwerp als het component. */
.zlapptrailcondition-badge.extreem_mul { background: #f9a825; color: #4a2c00; }
.zlapptrailcondition-badge.mul { background: #ffca28; color: #5c3d00; }
.zlapptrailcondition-badge.licht_mul { background: #d4e157; color: #3e4300; }
.zlapptrailcondition-badge.ideaal { background: #a5d6a7; color: #1b5e20; }
.zlapptrailcondition-badge.vochtig { background: #4dd0e1; color: #00363a; }
.zlapptrailcondition-badge.modderig { background: #4fc3f7; color: #01324a; }
.zlapptrailcondition-badge.extreem_modderig { background: #1976d2; color: #ffffff; }
.zlapptrailcondition-badge.zlapptrailcondition-muted { background: #eee; color: #888; }

/* v2.21.37 (BRO-subtype-mapping): eigen droog_nat-schaal voor verharde
   ondergrond - bewust GEEN hergebruik van de mul_modder-kleuren
   hierboven (andere schaal, andere betekenis), maar wel binnen dezelfde
   warm->koel-logica (droog=warm, nat=koel). */
.zlapptrailcondition-badge.droog { background: #d7ccc8; color: #4e342e; }
.zlapptrailcondition-badge.nat { background: #29b6f6; color: #012e42; }
.zlapptrailcondition-badge.extreem_nat { background: #0d47a1; color: #ffffff; }

.zlapptrailcondition-explore-link {
    margin-top: 0.5rem;
    font-size: 0.9em;
}

.zlapptrailcondition-module-map {
    width: 100%;
    border-radius: 4px;
    margin-bottom: 0.75rem;
}

/*: kaart-popup (map.js buildPopupHtml) - popup toont nu altijd
   eerst info, met een knop om door te navigeren i.p.v. de klik direct
   te laten navigeren. */
.zlapptrailcondition-popup {
    font-size: 0.9em;
    line-height: 1.4;
}

.zlapptrailcondition-popup-trend,
.zlapptrailcondition-popup-confidence,
.zlapptrailcondition-popup-updated {
    color: #777;
}

.zlapptrailcondition-popup-button {
    display: inline-block;
    margin-top: 0.5rem;
    padding: 0.3rem 0.7rem;
    border-radius: 4px;
    background: #0277bd;
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95em;
}

.zlapptrailcondition-popup-button:hover {
    background: #01579b;
}

/*: MTB-toegankelijkheid */
.zlapptrailcondition-popup-access-warning {
    background: #fdecea;
    color: #c62828;
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: 0.4rem;
}

.zlapptrailcondition-access-badge {
    display: inline-block;
    background: #fdecea;
    color: #c62828;
    border: 1px solid #f5c6cb;
    border-radius: 3px;
    padding: 0.1rem 0.4rem;
    font-size: 0.8em;
    font-weight: 600;
    margin-left: 0.4rem;
}