@media only screen and (min-width: 761px) and (max-width: 1030px) {
    .dropdown.county .lists ul:nth-child(3),
    .dropdown.county .lists ul:nth-child(4) {
        border-top: 1px solid #ededed;
        margin-top: 60px;
        padding-top: 20px;
    }
}

/* Dölj menyposter (och deras undermeny) i mobilmenyn, som aktiveras vid <=1030px */
@media only screen and (max-width: 1030px) {
    ul.main-nav .mobile-hidden,
    ul.main-nav > li.mobile-hidden,
    .mobile-hidden {
        display: none !important;
    }

    /* Fallback tills vyn byggs om: dölj Press och KulTur via deras länk */
    ul.main-nav > li:has(> a[href="/press/"]),
    ul.main-nav > li:has(> a[href="/kultur/"]) {
        display: none !important;
    }

    /* Accordion: undermenyer ska vara kollapsade som standard, öppnas via .open.
       [class*="has-children"] matchar även om Razor-klassen råkat bli sammanslagen. */
    ul.main-nav li[class*="has-children"] > ul.sub-nav {
        display: block;
        position: static;
        top: auto;
        max-height: 0 !important;
        overflow: hidden !important;
        padding: 0;
        box-shadow: none;
        transition: max-height 0.3s ease;
    }

    ul.main-nav li[class*="has-children"].open > ul.sub-nav {
        max-height: 2000px !important;
    }
}

@media only screen and (max-width: 760px) {
    .mobile-only {
        margin-bottom: 20px;
    }

    article.standard .copy ul,
    article.standard .copy ol {
        margin: 0 0 16px;
        padding-left: 20px;
        list-style-position: outside;
    }

    article.standard .copy ul {
        list-style-type: disc;
    }

    article.standard .copy li {
        padding-left: 2px;
    }

    article.standard .copy a {
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}

/* === Mobilanpassning av söksidorna (AttractionSearch / ExhibitionSearch) ===
   Home har klasserna .attraction-search + .exhibition-search men INTE .search-page,
   därför påverkar dessa regler aldrig startsidan (som fortsatt visar promo-korten). */
@media only screen and (max-width: 760px) {

    /* Visa full sök-UI på mobil (döljs annars av style.min.css) */
    .search-page section.filters,
    .search-page section.results,
    .search-page .grid-wrap {
        display: block;
    }

    /* Sökfält fullbredd */
    .search-page .search-wrap input {
        width: 100%;
        box-sizing: border-box;
    }

    /* Filter-header / sortering: radbryt och gör touch-vänligt */
    .search-page .filter-wrap {
        margin-top: 10px;
    }

    .search-page .filter-wrap .sorting {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        padding: 10px;
    }

    .search-page .filter-wrap .sorting .instruct {
        width: 100%;
        margin: 0 0 6px;
        font-size: 16px;
    }

    .search-page .filter-wrap .sorting .instruct:after {
        display: none; /* ta bort den vertikala avdelaren */
    }

    .search-page .filter-wrap .sorting .sort {
        flex: 1 1 100%;
        min-width: 0;
        margin: 0;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-align: left;
    }

    .search-page .filter-wrap .sorting .sort i {
        margin-left: 8px;
        flex-shrink: 0;
    }

    /* Grid/karta-toggle: från absolut till inline i flödet */
    .search-page .filter-wrap .sorting .viewing-options {
        position: static;
        right: auto;
        top: auto;
        margin-left: auto;
    }

    .search-page .filter-wrap .sorting .viewing-options span {
        width: 44px;
        height: 44px;
    }

    /* Tabs (Funna / Rensa urval) */
    .search-page .filter-wrap .tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }

    .search-page .filter-wrap .tabs .tab {
        min-height: 44px;
        padding: 10px;
    }

    /* Dropdowns: från absolut overlay till statiskt fullbredds-block.
       display styrs fortsatt av .toggled (JS), vi ändrar bara position/bredd. */
    .search-page .dropdown {
        position: static;
        top: auto;
        width: 100%;
        box-sizing: border-box;
        padding: 15px 10px;
        box-shadow: none;
    }

    .search-page .dropdown .head h2.service {
        float: none;
        position: static;
        right: auto;
        top: auto;
        display: block;
        margin-top: 10px;
    }

    /* Listor (landskap/kategori/service): fullbredd, scroll vid behov */
    .search-page .dropdown .lists {
        max-height: 60vh;
        overflow-y: auto;
    }

    .search-page .dropdown .lists ul {
        width: 100%;
        margin: 10px 0;
        border-right: none;
    }

    /* Tidsperiod-datepickers (ExhibitionSearch) fullbredd */
    .search-page .dropdown.time .datepicker,
    .search-page .datepicker {
        display: block;
        width: 100%;
        margin: 15px 0 0;
    }

    .search-page .ui-datepicker {
        width: auto !important;
        max-width: 100%;
    }

    /* Resultat-grid (a.col-4 blir redan 100% i style.min.css) */
    .search-page .grid-wrap {
        margin-bottom: 0;
    }

    /* Luft mellan sista kortet och "Ladda fler"-knappen */
    .search-page .button.forward {
        margin-top: 30px;
    }

    /* Kortbilder: fyll fullbredds-kortet utan att förvanska proportionerna */
    .search-page .grid-item img {
        height: 220px;
        object-fit: cover;
    }

    /* Annonskort där hela kortet är en bakgrundsbild (kulturarvskortet):
       contain så HELA affischen syns (ingen beskärning), stående proportion. */
    .search-page .grid-item.ad {
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        aspect-ratio: 3 / 4;
        height: auto;
        min-height: 0;
    }

    /* Karta responsiv (AP4) */
    .search-page #map_attraction_canvas_home,
    .search-page #map_exhibition_canvas_home {
        width: 100%;
        height: 400px;
    }
}

/* === Mobilmeny: hindra horisontell overflow som knuffar ut chevron-knapparna === */
@media only screen and (max-width: 1030px) {
    /* .menus har overflow-y:auto vilket gör X-axeln scrollbar; klipp den istället */
    .menus {
        overflow-x: hidden;
    }

    /* Håll alla nav-element innanför skärmbredden */
    ul.main-nav,
    ul.main-nav > li,
    ul.main-nav > li > a,
    ul.main-nav ul.sub-nav,
    ul.main-nav ul.sub-nav li,
    ul.main-nav ul.sub-nav li a,
    ul.highlight-nav {
        max-width: 100%;
    }

    /* Neutralisera kvarvarande desktop-positionering/bredd på undermenyn */
    ul.main-nav ul.sub-nav {
        left: auto;
        right: auto;
        width: 100%;
    }

    /* Säkerställ att chevron-knappen alltid ligger vid högerkanten och syns */
    .submenu-toggle {
        right: 0;
    }
}

/* === Desktop-meny: placera länkraden vertikalt som i live ===
   Dev-buildens style.min.css placerar menyn högre upp än live. Nudga ner den
   så länktexten hamnar på samma höjd som live. */
@media only screen and (min-width: 1031px) {
    .menus {
        margin-top: 20px;
    }

    /* Dev har fler menyposter än live; minska länkavståndet något så raden
       klarar logotypen utan att "Start" hamnar under den. Textstorlek som live. */
    ul.main-nav li {
        margin: 0 5px;
    }
}

/* === Bulkköpar-portal (Mina beställningar) === */
.bulk-portal-table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0 24px;
}

.bulk-portal-table th,
.bulk-portal-table td {
    text-align: left;
    padding: 10px;
    border-bottom: 1px solid #eee;
    vertical-align: top;
}

.bulk-portal-table th {
    background: #f6f1ec;
    font-weight: 600;
}

/* Tydlig avgränsare mellan varje kod/kort-rad. */
.bulk-portal-table tbody tr {
    border-bottom: 2px solid #d8ccbf;
}

.bulk-portal-table tbody tr:last-child {
    border-bottom: none;
}

.bulk-portal-table code {
    font-size: 1rem;
}

.bulk-portal-stats {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin: 16px 0;
}

.bulk-portal-stats div {
    background: #f6f1ec;
    border-radius: 8px;
    padding: 12px 16px;
}

.bulk-portal-inline {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

.bulk-portal-inline input {
    padding: 6px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Skicka-kod-formulär i kodtabellen: stackade fält + knapprad, kompakt och prydligt. */
.bulk-send-form {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 240px;
}

.bulk-send-form input {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: .9rem;
    margin: 0;
}

.bulk-send-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 2px;
}

/* Standardknappar för redan skickade koder (inputs dolda tills "annan mottagare" väljs). */
.bulk-sent-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: flex-start;
}

.bulk-sent-actions .button.default {
    margin: 0;
    padding: 6px 12px;
    font-size: .85rem;
    white-space: nowrap;
}

.bulk-send-fields.is-hidden {
    display: none;
}

.bulk-send-actions .button.default {
    margin: 0;
    padding: 6px 10px;
    font-size: .82rem;
    white-space: nowrap;
}

/* Kompaktare knappar inne i portal-tabellen så de får plats i raden */
.bulk-portal-table .button.default {
    padding: 6px 12px;
    font-size: .85rem;
    white-space: nowrap;
}

/* Dra-och-släpp-yta för filimport. */
.bulk-dropzone {
    border: 2px dashed #b9a894;
    border-radius: 8px;
    padding: 24px 16px;
    text-align: center;
    background: #faf7f2;
    cursor: pointer;
    margin-bottom: 12px;
    transition: background .15s, border-color .15s;
}

.bulk-dropzone.is-dragover {
    border-color: #7a2e2e;
    background: #f1e7dc;
}

.bulk-dropzone input[type="file"] {
    display: block;
    margin: 0 auto 8px;
}

.bulk-dropzone-text {
    margin: 4px 0 0;
    color: #6b5b4b;
    font-size: .95rem;
}

.bulk-dropzone-file {
    margin: 6px 0 0;
    font-weight: 600;
}

/* Textarea + reglage för inklistrad lista. */
.bulk-paste-area {
    width: 100%;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 6px;
    margin-bottom: 12px;
    font-family: inherit;
    font-size: .95rem;
}

.bulk-switch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    cursor: pointer;
    user-select: none;
}

.bulk-switch input {
    display: none;
}

.bulk-radio-group {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
}

.bulk-radio-group label {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    user-select: none;
    margin: 0;
}

.bulk-radio-group input[type="radio"] {
    cursor: pointer;
    width: auto;
    margin: 0;
}

.bulk-switch-slider {
    width: 46px;
    height: 24px;
    background: #b9a894;
    border-radius: 12px;
    position: relative;
    transition: background .15s;
    flex: 0 0 auto;
}

.bulk-switch-slider::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 50%;
    transition: transform .15s;
}

.bulk-switch input:checked + .bulk-switch-slider {
    background: #0066cc;
}

.bulk-switch input:checked + .bulk-switch-slider::before {
    transform: translateX(22px);
}

/* Loading Spinner */
.bulk-loading-spinner {
    text-align: center;
    padding: 24px;
    margin-top: 24px;
}

.bulk-spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 4px solid #e0e0e0;
    border-top: 4px solid #0066cc;
    border-radius: 50%;
    animation: bulk-spin 1s linear infinite;
    margin: 0 auto 12px;
}

@keyframes bulk-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.bulk-loading-spinner p {
    color: #666;
    font-size: 0.95rem;
    margin: 0;
}