/*
Theme Name: Boxspring Gekte v2
Theme URI: https://boxspringgekte.nl/
Author: SAM Online Marketing
Author URI: https://samonlinemarketing.nl/
Description: Het nieuwe ontwerp (Claude Design, 'Boxspring Gekte website redesign'). Zelfstandig thema: templates, CSS en JS. Wat de winkel doet komt uit mu-plugins/kern. Voorvertonen met ?bgThema=boxspringgekte-v2.
Version: 0.2.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.3
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: boxspringgekte
*/

/* ---------------------------------------------------------------------------
 * Bewust vrijwel leeg (baserules 4): alleen de klassen die WordPress zelf in de
 * HTML zet. De tokens waar ze naar verwijzen (--kleurTekst, --kleurTekstZacht,
 * --kleurWit) staan in inc/css/main.css.
 * --------------------------------------------------------------------------- */

/* WordPress zet deze klassen op uitgelijnde media in de inhoud. */
.alignleft {
    float: left;
    margin-right: 1.5rem;
    margin-bottom: 1rem;
}

.alignright {
    float: right;
    margin-left: 1.5rem;
    margin-bottom: 1rem;
}

.aligncenter {
    display: block;
    margin-inline: auto;
    margin-bottom: 1rem;
}

.alignnone {
    margin-bottom: 1rem;
}

/* Bijschriften bij afbeeldingen uit de mediabibliotheek. */
.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    margin-top: .5rem;
    font-size: .875rem;
    color: var(--kleurTekstZacht);
}

/* Alleen voor schermlezers: uit het beeld, niet uit de toegankelijkheidsboom.
   display:none zou de tekst ook voor schermlezers verbergen. */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Overslaan-naar-inhoud krijgt focus wél zichtbaar terug. */
.screen-reader-text:focus {
    position: fixed !important;
    top: 1rem;
    left: 1rem;
    z-index: 100000;
    width: auto;
    height: auto;
    padding: .75rem 1.25rem;
    clip-path: none;
    background: var(--kleurWit);
    color: var(--kleurTekst);
    font-size: 1rem;
    text-decoration: none;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgb(0 0 0 / .2);
}

/* De galerij-shortcode. */
.gallery {
    display: grid;
    grid-template-columns: repeat(var(--galerijKolommen, 3), 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.gallery-item {
    margin: 0;
}

.gallery-columns-1 { --galerijKolommen: 1; }
.gallery-columns-2 { --galerijKolommen: 2; }
.gallery-columns-4 { --galerijKolommen: 4; }
.gallery-columns-5 { --galerijKolommen: 5; }

/* Ingesloten media (oEmbed) moet mee kunnen krimpen. */
.wp-embed-responsive iframe,
.wp-block-embed iframe {
    max-width: 100%;
}
