/* Blocksy-adapter: uitsluitend themaspecifieke navigatie en zoekvensters. */
@media screen {
    [data-device="mobile"] .ct-header-trigger,
    [data-device="mobile"] .ct-header-search {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        padding: 0;
        border: 0;
        border-radius: 6px;
        color: #000 !important;
        background-color: transparent !important;
        --theme-icon-color: #000;
        --theme-icon-hover-color: #000;
        --theme-link-initial-color: #000;
        --theme-link-hover-color: #000;
    }

    [data-device="mobile"] .ct-header-trigger:hover,
    [data-device="mobile"] .ct-header-trigger:focus-visible,
    [data-device="mobile"] .ct-header-search:hover,
    [data-device="mobile"] .ct-header-search:focus-visible {
        color: #000 !important;
        background-color: transparent !important;
    }

    [data-device="mobile"] .ct-header-trigger:focus-visible,
    [data-device="mobile"] .ct-header-search:focus-visible {
        outline: 2px solid var(--theme-palette-color-3, #ed1646);
        outline-offset: 2px;
    }

    [data-device="mobile"] .ct-header-trigger .ct-icon,
    [data-device="mobile"] .ct-header-search .ct-icon {
        width: 32px !important;
        height: 32px !important;
        color: #000 !important;
        fill: #000 !important;
    }

    #offcanvas,
    #search-modal {
        box-sizing: border-box;
        inset: 0 !important;
        width: 100vw;
        height: 100dvh;
        min-height: 100dvh;
        max-height: none;
        align-items: flex-start;
        padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
        background: rgba(0, 0, 0, 0.48) !important;
        overscroll-behavior: contain;
        --panel-content-height: auto;
    }

    #offcanvas .ct-panel-actions,
    #offcanvas .ct-panel-content[data-device="mobile"] {
        flex: none;
        width: min(86vw, 340px);
        color: #fff;
        background: var(--theme-palette-color-3, #ed1646);
    }

    #offcanvas .ct-panel-actions {
        min-height: 52px;
        padding: 12px 16px 6px;
        border-radius: 8px 8px 0 0;
    }

    #offcanvas .ct-panel-content[data-device="mobile"] {
        max-height: calc(100dvh - 76px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
        overflow: hidden;
        border-radius: 0 0 8px 8px;
        --panel-padding: 6px 16px 16px;
    }

    #offcanvas .ct-panel-content-inner {
        height: auto;
        max-height: inherit;
        overflow-y: auto;
    }

    #offcanvas .ct-panel-heading {
        color: #fff;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.2;
    }

    #offcanvas .ct-toggle-close,
    #search-modal .ct-toggle-close {
        color: #fff;
        --theme-icon-color: #fff;
        --theme-icon-hover-color: #fff;
    }

    #offcanvas .ct-toggle-close:hover,
    #offcanvas .ct-toggle-close:focus-visible,
    #search-modal .ct-toggle-close:hover,
    #search-modal .ct-toggle-close:focus-visible {
        color: #000;
        --theme-icon-color: #000;
        --theme-icon-hover-color: #000;
    }

    #offcanvas [data-id="mobile-menu"] {
        --theme-link-initial-color: #fff;
        --theme-link-hover-color: #fff;
        --items-vertical-spacing: 2px;
        --theme-font-size: 18px;
    }

    #offcanvas .mobile-menu .ct-menu-link {
        padding: 7px 9px;
        border-radius: 5px;
    }

    #offcanvas .mobile-menu .ct-menu-link:hover,
    #offcanvas .mobile-menu .ct-menu-link:focus-visible,
    #offcanvas .mobile-menu .ct-menu-link:active,
    #offcanvas .mobile-menu .ct-menu-link[aria-current="page"],
    #offcanvas .mobile-menu .current-menu-item > .ct-menu-link,
    #offcanvas .mobile-menu .current_page_item > .ct-menu-link,
    #offcanvas .mobile-menu .current-menu-ancestor > .ct-menu-link {
        color: #fff !important;
        background: var(--theme-palette-color-4, #4099ff) !important;
    }

    #search-modal {
        --vertical-alignment: flex-start;
    }

    #search-modal .ct-panel-actions,
    #search-modal .ct-panel-content {
        flex: none;
        width: min(calc(100vw - 24px), 540px);
        margin-inline: auto;
        color: #fff;
        background: var(--theme-palette-color-3, #ed1646);
    }

    #search-modal .ct-panel-actions {
        min-height: 48px;
        padding: 8px 12px 2px;
        border-radius: 8px 8px 0 0;
    }

    #search-modal .ct-panel-content {
        padding: 4px 14px 14px;
        border-radius: 0 0 8px 8px;
    }

    #search-modal .ct-panel-heading,
    #search-modal .lwd-search-panel-title {
        display: block;
        margin-right: auto;
        color: #fff;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.2;
    }

    #search-modal .ct-search-form {
        width: 100%;
        max-width: none;
        margin: 0;
        --theme-form-font-size: 17px;
        --theme-form-field-height: 44px;
        --theme-form-border-radius: 6px;
        --theme-form-text-initial-color: #000;
        --theme-form-text-focus-color: #000;
        --theme-form-field-border-initial-color: #000;
        --theme-form-field-border-focus-color: #000;
        --theme-button-text-initial-color: #fff;
        --theme-button-text-hover-color: #fff;
        --theme-button-background-initial-color: var(--theme-palette-color-4, #4099ff);
        --theme-button-background-hover-color: var(--theme-palette-color-4, #4099ff);
    }

    #search-modal .ct-search-form-inner {
        margin-bottom: 0;
        padding: 3px;
        border: 2px solid #000;
        border-radius: 6px;
        background: #fff !important;
    }

    #search-modal .modal-field {
        min-width: 0;
        color: #000 !important;
        background: #fff !important;
    }

    #search-modal .modal-field::placeholder {
        color: #777;
        opacity: 1;
    }

    #search-modal .wp-element-button {
        color: #fff;
        background: var(--theme-palette-color-4, #4099ff);
        --theme-icon-color: #fff;
        --theme-icon-hover-color: #fff;
    }

    #search-modal .wp-element-button:is(:hover, :focus-visible, :active) {
        color: #fff;
        background: var(--theme-palette-color-4, #4099ff);
    }

    #search-modal .wp-element-button .ct-search-button-content {
        color: #fff;
        fill: currentColor;
    }

    #search-modal .ct-search-results {
        max-height: min(48dvh, 420px);
        margin-top: 8px;
        overflow-y: auto;
        color: #000;
        background: #fff;
        border-radius: 6px;
        --theme-link-initial-color: #000;
        --theme-link-hover-color: var(--theme-palette-color-3, #ed1646);
    }

    body.liw-regiolinks-page #search-modal .ct-panel-actions,
    body.liw-regiolinks-page #search-modal .ct-panel-content {
        background: #243b88;
    }

    body.liw-regiolinks-page #search-modal .ct-search-form {
        --theme-button-background-initial-color: #000;
        --theme-button-background-hover-color: #000;
    }

    body.liw-regiolinks-page #search-modal .wp-element-button,
    body.liw-regiolinks-page #search-modal .wp-element-button:is(:hover, :focus-visible, :active) {
        color: #fff;
        background: #000;
        --theme-icon-color: #fff;
        --theme-icon-hover-color: #fff;
    }

    body.liw-regiolinks-page #search-modal .ct-search-results {
        display: none !important;
    }
}
