/*
Theme Name: Eurokanto
Description: Thème enfant de Twenty Twenty-Five pour chanter l’Europe ensemble.
Template: twentytwentyfive
Version: 0.4.17
Requires at least: 6.7
Requires PHP: 7.4
Text Domain: europok
License: GPL-2.0-or-later
*/

/* Emphasize home-page calls to action and keep form controls comfortable to use. */
.home .wp-block-post-content .wp-block-button__link {
    font-size: 1.125rem;
}

.europok-map-filters .wp-element-button {
    box-sizing: border-box;
    min-height: 44px;
    font-size: 1rem;
}

/* Separate each home-page section from the preceding call to action. */
.home .wp-block-post-content .wp-block-buttons + h2.wp-block-heading {
    margin-block-start: clamp(2rem, 4vw, 3rem);
}

.europok-language-menu {
    flex-shrink: 0;
}

.europok-header > .wp-block-navigation:not(.europok-language-menu) {
    flex: 1;
    min-width: 0;
    justify-content: center;
}

/* Outrank WordPress's open-on-click rule, which reserves right padding for a chevron. */
.europok-language-menu .europok-language-toggle > button.wp-block-navigation-item__content {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
}

/* Keep the native button's accessible name while showing only a globe. */
.europok-language-toggle > .wp-block-navigation-item__content > .wp-block-navigation-item__label,
.europok-mobile-languages > .wp-block-navigation-item__content > .wp-block-navigation-item__label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.europok-language-toggle > .wp-block-navigation-item__content::before,
.europok-mobile-languages > .wp-block-navigation-item__content::before {
    content: "";
    width: 24px;
    height: 24px;
    background-color: currentColor;
    -webkit-mask: url("assets/languages.svg") center / contain no-repeat;
    mask: url("assets/languages.svg") center / contain no-repeat;
}

.europok-language-menu .europok-language-toggle > .wp-block-navigation__submenu-icon {
    display: none;
}

.europok-language-toggle > .wp-block-navigation-item__content:focus-visible,
.europok-mobile-languages > .wp-block-navigation-item__content:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.europok-language-menu .europok-language-toggle > .wp-block-navigation__submenu-container {
    inset-inline-start: auto;
    inset-inline-end: 0;
    min-width: min(12rem, calc(100vw - 2rem));
    max-width: calc(100vw - 2rem);
}

.europok-language-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    box-sizing: border-box;
    min-height: 44px;
    padding: .5rem .75rem;
}

.europok-header .wp-block-navigation .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content .europok-mobile-languages {
    display: none;
}

@media (max-width: 599px) {
    .europok-header.wp-block-group {
        gap: .5rem;
    }

    .europok-header .wp-block-navigation__responsive-container-open {
        box-sizing: border-box;
        width: 44px;
        height: 44px;
        padding: 7px;
        align-items: center;
        justify-content: center;
    }

    .europok-header .wp-block-navigation__responsive-container-open svg {
        width: 30px;
        height: 30px;
    }

    .europok-header .wp-block-site-logo {
        max-width: min(140px, 35vw);
    }

    .europok-header .wp-block-site-logo img {
        max-width: 100%;
        height: auto;
    }

    .europok-header > .wp-block-navigation:not(.europok-language-menu) {
        flex: 0 0 auto;
        margin-inline-start: auto;
    }

    .europok-header > .europok-language-menu {
        display: none;
    }

    .europok-header .wp-block-navigation .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content .europok-mobile-languages {
        display: flex;
        align-self: stretch;
        margin-block-start: var(--wp--preset--spacing--30);
        padding-block-start: var(--wp--preset--spacing--30);
        border-block-start: 1px solid currentColor;
    }

    .europok-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .europok-mobile-languages > .wp-block-navigation__submenu-container {
        min-width: 0;
        max-width: 100%;
        padding: .5rem 0 0;
        gap: .25rem;
    }

    /* WordPress expands submenus in overlays by default; retain the native toggle. */
    .europok-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .europok-mobile-languages > button[aria-expanded="false"] ~ .wp-block-navigation__submenu-container {
        display: none;
    }

    .europok-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .europok-mobile-languages > .wp-block-navigation__submenu-icon {
        display: none;
    }

    .europok-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .europok-mobile-languages > button.wp-block-navigation-submenu__toggle {
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-width: 64px;
        height: 44px;
        padding: 9px 10px;
        border: 1px solid currentColor;
        border-radius: .5rem;
        background-color: var(--wp--preset--color--base, #fff);
        text-decoration: none;
    }

    .europok-mobile-languages > button.wp-block-navigation-submenu__toggle::after {
        content: "";
        box-sizing: border-box;
        width: 8px;
        height: 8px;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: translateY(-2px) rotate(45deg);
    }

    .europok-mobile-languages > button.wp-block-navigation-submenu__toggle[aria-expanded="true"]::after {
        transform: translateY(2px) rotate(225deg);
    }

    .europok-header .europok-mobile-languages .wp-block-navigation-item__content {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }
}

.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"],
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
    color: var(--wp--preset--color--accent-1, #003399);
    text-decoration-line: underline;
    text-decoration-color: var(--wp--preset--color--accent-2, #ffcc00);
    /* Override Twenty Twenty-Five's !important 1px link underline. */
    text-decoration-thickness: 3px !important;
    text-underline-offset: .4em;
}

.wp-block-navigation .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"],
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
    font-weight: 600;
}

.europok-form fieldset {
    margin: 1.5rem 0;
    padding: 1.25rem;
    border: 1px solid currentColor;
    border-radius: .4rem;
    min-inline-size: 0;
}
.europok-form legend { font-size: 1.25rem; font-weight: 700; padding: 0 .5rem; }
.europok-field label { display: block; font-weight: 600; margin-block-end: .4rem; }
.europok-field input, .europok-field select, .europok-field textarea {
    box-sizing: border-box;
    width: 100%;
    padding: .75rem;
    font: inherit;
    color: inherit;
    background: var(--wp--preset--color--base, #fff);
    border: 1px solid currentColor;
    border-radius: .25rem;
}
.europok-form-row { display: flex; flex-wrap: wrap; gap: 1rem; }
.europok-form-row > * { flex: 1 1 12rem; }
.europok-help { font-size: .95em; }
.europok-checkbox input { width: 1.2rem; height: 1.2rem; vertical-align: middle; }
.europok-form :focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
.europok-notice, .europok-errors { padding: 1rem; border: 2px solid currentColor; }
.europok-field-error { display: block; font-weight: 600; margin-block-start: .4rem; }
.europok-form [aria-invalid="true"] { border-width: 3px; }
.europok-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.europok-form [hidden] { display: none; }

.europok-gatherings [hidden] { display: none; }
.europok-map-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; margin-block: 1.5rem; }
.europok-map-filters p { margin: 0; }
.europok-map-filters label { display: block; }
.europok-map-filters select { font: inherit; padding: .5rem; max-width: 100%; }
.europok-map-panel { display: flex; flex-direction: column; gap: .75rem; margin-block-start: clamp(2rem, 4vw, 3rem); }
.europok-map-panel > * { margin-block: 0; }
.europok-map-panel [data-map-status]:empty { display: none; }
.europok-map-panel [data-reset-map] { align-self: flex-start; }
.europok-map-canvas { height: clamp(350px, 55vh, 550px); width: 100%; z-index: 0; }
.europok-event-list { list-style: none; padding: 0; }
.europok-event-card { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1rem; padding-block: .75rem; border-bottom: 1px solid #ccd5e5; }
.europok-event-card p { margin: 0; }
.europok-event-summary { flex: 1 1 14rem; min-width: 0; overflow-wrap: anywhere; }
.europok-event-place { font-size: .9em; }
.europok-event-kind { font-size: .9em; font-weight: 600; }
.europok-event-details { font-size: .9em; padding-block: .25rem; }
.europok-list-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-block: 1rem; }
.europok-gatherings :focus-visible { outline: 3px solid #003399; outline-offset: 3px; }
.europok-map-pin { box-sizing: border-box; border: 3px solid #fff; border-radius: 50%; background: #003399; box-shadow: 0 1px 5px #15264b; }
.europok-map-pin.is-closed { background: #ffcc00; border: 4px dashed #15264b; }
.europok-map-pin.is-cluster { color: #fff; font: 700 14px/24px system-ui; text-align: center; }
.europok-map-canvas .leaflet-popup-content { max-height: 320px; overflow: auto; }
