/*
Theme Name: Hello Biz Child
Theme URI: https://github.com/elementor/hello-biz-child/
Description: Hello Biz Child is a child theme of Hello Biz, created by Elementor team
Author: Elementor Team
Template: hello-biz
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Version: 1.0.0
Stable tag: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: hello-biz-child
Tags: flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready, style-variations
*/

/* Add your custom styles here */

/* Melding over een sluiting, naast de openingstijden in de balk bovenaan.
   Het streepje en de tekst blijven bij elkaar, zodat de regel netjes
   afbreekt op een smal scherm. */
.opening-today-notice {
    white-space: nowrap;
}

/* Weekoverzicht van de openingstijden via [openingstijden_lijst].
   De kleur komt uit de omgeving, zodat dezelfde lijst werkt op een lichte
   pagina en in de donkere footer. */
.vispoort-tijden {
    display: inline-flex;
    gap: 96px;
    align-self: start;
    color: inherit;
}

.vispoort-tijden__kolom {
    margin: 0;
    padding: 0;
    list-style: none;
}

.vispoort-tijden__kolom li + li {
    margin-top: 14px;
}

@media (max-width: 767px) {
    .vispoort-tijden {
        gap: 48px;
    }
}

/* Op de menukaartpagina (/menu) blijft het menu bovenaan staan, maar vervalt het
   grote headerbeeld. Dat gebeurt met CSS en niet met een uitzondering in de
   Elementor-condities, want zodra dat sjabloon daar wegvalt springt het thema in
   met zijn eigen opmaak. */
.page-id-917 .elementor-element-2858d33 {
    display: none;
}

/* Zonder dat beeld valt de ruimte boven de inhoud te ruim uit. De body-kiezer
   staat erbij omdat Elementor deze waarde zelf al met drie klassen zet. */
body.page-id-917 .elementor-element.elementor-element-d0092b6 {
    --padding-top: 24px;
}

/* Menukaartpagina voor buitenlandse bezoekers (/menu), bedoeld voor de QR-code.
   Zonder JavaScript staan beide talen onder elkaar; met JavaScript toont de
   pagina er een en kan de bezoeker wisselen. */
.vp-menukaart {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
}

.vp-menukaart__keuze {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-bottom: 32px;
}

/* De attribuutkiezer erbij, anders wint de knopstijl van het thema. */
.vp-menukaart .vp-menukaart__knop[data-taal] {
    flex: 1 1 0;
    max-width: 200px;
    padding: 14px 24px;
    border: 2px solid #004631;
    border-radius: 8px;
    background: transparent;
    color: #004631;
    font: inherit;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
}

.vp-menukaart .vp-menukaart__knop[data-taal][aria-pressed="true"] {
    background: #004631;
    color: #FCF9F3;
}

.vp-menukaart__intro {
    margin-bottom: 24px;
}

.vp-menukaart__vel {
    display: block;
    margin-bottom: 16px;
}

.vp-menukaart__vel img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
    box-shadow: 0 2px 14px rgba(0, 70, 49, 0.12);
}

.vp-menukaart__pdf {
    display: inline-block;
    margin-top: 16px;
    color: #004631;
}

/* Pas verbergen zodra het script draait, zodat er altijd iets te lezen valt. */
.vp-menukaart.is-actief .vp-menukaart__blok {
    display: none;
}

.vp-menukaart.is-actief .vp-menukaart__blok.is-zichtbaar {
    display: block;
}