:root {
    --webko-travel-accent: #1a4d3e;
    --webko-travel-accent-light: #e2ede5;
}

/* Michael har bedt om at de gamle filtre (destination/pris/sortering) fjernes på pilot-siden,
   så kun de to faner + spring-til-rejse-dropdown er tilbage. */
.elementor-element-4eb7e8b,
.elementor-element-aa35286 {
    display: none !important;
}

.webko-travel-tabs {
    margin: 24px auto;
}

.webko-travel-tabs-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.webko-travel-tabs-buttons {
    position: relative;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    background: var(--webko-travel-accent-light);
    padding: 6px;
    border-radius: 999px;
}

.webko-travel-tabs-buttons::-webkit-scrollbar {
    display: none;
}

.webko-travel-tabs-buttons button.webko-tab-btn {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    cursor: pointer;
    padding: 10px 22px;
    white-space: nowrap;
    font-weight: 600;
    font-size: 15px;
    border-radius: 999px;
    border: none !important;
    background: none !important;
    color: var(--webko-travel-accent) !important;
    font-family: inherit;
    transition: color 0.2s ease;
}

.webko-travel-tabs-buttons button.webko-tab-btn.is-active {
    color: #fff !important;
}

.webko-travel-tabs-buttons button.webko-tab-btn:hover,
.webko-travel-tabs-buttons button.webko-tab-btn:focus,
.webko-travel-tabs-buttons button.webko-tab-btn:active {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    outline: none;
}

.webko-travel-tabs-buttons button.webko-tab-btn:focus-visible {
    outline: 2px solid var(--webko-travel-accent);
    outline-offset: 2px;
}

.webko-travel-tabs-indicator {
    position: absolute;
    top: 6px;
    left: 0;
    bottom: 6px;
    width: 0;
    z-index: 0;
    background: var(--webko-travel-accent);
    border-radius: 999px;
    transform: translateX(0);
    transition: transform 0.25s ease, width 0.25s ease;
}

.webko-travel-jump {
    flex: 0 0 auto;
    width: auto !important;
    max-width: 320px;
    /* margin-left:auto skubber den til højre uanset om fane-knapperne findes eller ej —
       når de mangler (intet filter), er dropdown'en det eneste element i rækken. */
    margin-left: auto;
    padding: 12px 18px;
    border-radius: 999px;
    border: 2px solid var(--webko-travel-accent);
    background: #fff;
    color: var(--webko-travel-accent);
    font-weight: 600;
    font-size: 15px;
    font-family: inherit;
    cursor: pointer;
}

@media (max-width: 640px) {
    .webko-travel-jump {
        max-width: 100%;
    }
}

@media (max-width: 640px) {
    .webko-travel-tabs-row {
        flex-direction: column;
        align-items: stretch;
    }

    .webko-travel-jump {
        width: 100%;
    }
}

/* .is-popular sidder på kortets ydre wrapper (e-loop-item), ikke på .travel-card selv,
   så vi skal skjule wrapperen ud fra dens egen klasse, ikke et compound-selector på kortet. */

/* Standardvisning ("Mest solgte") kræver intet klik og intet JavaScript: ikke-populære kort
   er skjult som ren CSS-standard. Kun skiftet TIL "Alle rejser" kræver klik (via .webko-show-all).
   Filtreringen er betinget af body.webko-has-popular (sat server-side), så lande uden nogen
   populære rejser aldrig filtrerer noget væk — der er jo intet at vise frem for. */
body.webko-has-popular .elementor-location-archive .e-loop-item:not(.is-popular) {
    display: none;
}

body.webko-has-popular .elementor-location-archive.webko-show-all .e-loop-item:not(.is-popular) {
    display: revert;
}