/*
Theme Name: MSR Neon
Theme URI: https://www.makerspaceringebu.no/
Author: Makerspace Ringebu
Author URI: https://www.makerspaceringebu.no/
Description: Neon-cyberpunk tema for Makerspace Ringebu. Lekent men seriøst uttrykk med subtile glow-effekter, transparent neon-kart i hero, og integrert påmeldingsseksjon. Profilfargene orange (#d96c00) og turkis (#0095a9) er beholdt, med boostede neon-varianter som aksenter.
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: msr-neon
Tags: one-page, custom-colors, custom-menu, featured-images, translation-ready
*/

/* Selve stilene ligger i assets/theme.css og lastes via functions.php */

/* ── Mobil produktgalleri-fix ─────────────────────────────────────────────
   FlexSlider (WooCommerce-galleri) initialiseres med bredde beregnet fra
   desktop-layout (~814 px per slide × 3 slides = 2 443 px). Det setter
   inline-style="width:2442.88px" på wrapper-elementet og
   inline-style="height:2442.88px" på flex-viewport.
   Disse CSS-reglene tvinger galleriet til å holde seg innenfor mobil-
   bredden selv om JS-ens inline-verdier er feil.
   ──────────────────────────────────────────────────────────────────────── */
@media (max-width: 860px) {
    .woocommerce div.product .woocommerce-product-gallery {
        min-width: 0 !important;   /* forhindrer grid-kolonne-utvidelse */
        overflow: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .woocommerce div.product .woocommerce-product-gallery .flex-viewport {
        height: auto !important;   /* JS setter feil høyde (2443 px) */
        overflow: hidden !important;
        max-width: 100% !important;
    }
    .woocommerce div.product .woocommerce-product-gallery__image {
        width: 100% !important;    /* hvert slide fyller galleriet */
    }
    .woocommerce div.product .woocommerce-product-gallery__image img {
        width: 100% !important;
        height: auto !important;
    }
}

/* ── Mobil produkt-grid fix ───────────────────────────────────────────────
   display:block !important fra theme.css overstyres av noe i browsermiljøet.
   Som fallback: tving grid til én kolonne slik at galleri og sammendrag
   stacker vertikalt på mobil.
   ──────────────────────────────────────────────────────────────────────── */
@media (max-width: 860px) {
    body.single-product .woocommerce div.product {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto !important;
        grid-auto-rows: auto !important;
    }
    body.single-product .woocommerce div.product > * {
        grid-column: 1 !important;
        grid-row: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        float: none !important;
    }
    /* Spesifikk grid-area reset for kjente WooCommerce-elementer */
    body.single-product .woocommerce div.product .woocommerce-product-gallery {
        grid-area: auto !important;
    }
    body.single-product .woocommerce div.product .summary {
        grid-area: auto !important;
        padding: 16px !important;
    }
    body.single-product .woocommerce div.product .woocommerce-tabs {
        grid-area: auto !important;
    }
}