/* ============================================================================
   deHazette — Bovenlokale toerisme-widgets
   Compacte "regio"-blokken die visueel losstaan van de lokale artikelstroom.
   Sober gehouden zodat het samengaat met de Hewo Modern Newspaper-template.
   ============================================================================ */

.dehazette-bovenlokaal {
    border: 1px solid #e3e3e3;
    border-top: 3px solid #c8a15a;      /* accentlijn: markeert 'regio', niet 'lokaal' */
    border-radius: 4px;
    background: #fbfaf7;
    padding: 14px 16px 10px;
    margin: 0 0 20px;
    font-family: inherit;
}

.dehazette-bovenlokaal__kop {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 1.05rem;
    line-height: 1.2;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.dehazette-bovenlokaal__emoji { font-size: 1.1em; }

.dehazette-bovenlokaal__badge {
    margin-left: auto;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8a6d2f;
    background: #f0e6cf;
    border-radius: 999px;
    padding: 2px 8px;
}

.dehazette-bovenlokaal__figuur { margin: 0 0 10px; }

.dehazette-bovenlokaal__foto {
    display: block;
    width: 100%;
    height: 130px;                       /* compact: vaste, lage hoogte */
    object-fit: cover;
    border-radius: 3px;
}

.dehazette-bovenlokaal__credits {
    font-size: .68rem;
    color: #999;
    margin-top: 3px;
    line-height: 1.3;
}
.dehazette-bovenlokaal__credits a { color: #999; text-decoration: underline; }

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

.dehazette-bovenlokaal__item {
    padding: 6px 0;
    border-bottom: 1px dotted #e0ddd4;
    font-size: .92rem;
    line-height: 1.35;
}
.dehazette-bovenlokaal__item:last-child { border-bottom: 0; }

.dehazette-bovenlokaal__zone { font-weight: 700; color: #444; }
.dehazette-bovenlokaal__scheider { color: #bbb; margin: 0 4px 0 1px; }

.dehazette-bovenlokaal__link { color: #b5482e; text-decoration: none; }
.dehazette-bovenlokaal__link:hover,
.dehazette-bovenlokaal__link:focus { text-decoration: underline; }

/* Subtiel eigen accent per type */
.dehazette-bovenlokaal--logies { border-top-color: #5a86c8; }
.dehazette-bovenlokaal--immo   { border-top-color: #5aa06e; }