/*
 * BresciaPC Theme - global.css (Base)
 *
 * Questo file contiene SOLO:
 * - Variabili CSS globali (:root)
 * - Reset/base
 * - Tipografia di base + utilità A11Y (screen-reader, skip-link)
 * - Focus ring + riduzione motion
 *
 * Modularizzazione (Step 7):
 * - /core/core.css (layout utility + componenti riutilizzabili)
 * - /components/header/header.css
 * - /components/footer/footer.css
 * - /woo/common/common.css (solo contesto Woo)
 * - /core/print.css (media print)
 */

:root {
    color-scheme: light;

    /* ── Colori primari ────────────────────────────────────── */
    --bspc-blue-primary: #0066cc;
    --bspc-blue-hover: #0058b0;
    --bspc-green-primary: #34c759;
    --bspc-green-hover: #2fa94e;
    --bspc-red-error: #e02020;

    /* ── Gerarchia testo (3 livelli) ───────────────────────── */
    --bspc-text-primary: #1d1d1f;
    --bspc-text-secondary: #515154;     /* [Audit] era #333 - allineato ad Apple */
    --bspc-text-light: #636366;         /* [Audit v6.0 #graphic-1] A11Y: era #86868b (3.53:1) - ora 5.0:1 passa WCAG AA */
    --bspc-text-dark: var(--bspc-text-primary);
    --bspc-text-placeholder: #aaa;

    /* ── Sfondi ────────────────────────────────────────────── */
    --bspc-bg-light: #f5f5f7;           /* [Audit] era #fafafa - unificato a Apple */
    --bspc-bg-white: #ffffff;

    /* ── Bordi ─────────────────────────────────────────────── */
    --bspc-border-light: #e5e5ea;       /* [Audit] era #e0e0e0 - leggermente più caldo */
    --bspc-border-medium: #d2d2d7;
    --bspc-border-dark: #c7c7cc;        /* [Audit] era #ccc - allineato alla scala */

    /* ── Layout ────────────────────────────────────────────── */
    --bspc-content-width: 1120px;
    --bspc-content-width-wider: 1200px;
    --bspc-grid-gap: clamp(15px, 3vw, 20px);
    --bspc-page-gutter: clamp(16px, 4vw, 24px); /* [Audit] nuovo: gutter unico responsivo */
    --bspc-mobile-padding: var(--bspc-page-gutter);
    --bspc-desktop-padding: var(--bspc-page-gutter);

    /* ── Border-radius (4 livelli) ─────────────────────────── */
    --bspc-radius-small: 8px;           /* [Audit] era 12 - input, badge, chip */
    --bspc-radius-medium: 14px;         /* [Audit] era 16 - pulsanti, card piccole */
    --bspc-radius-large: 22px;          /* [Audit] era 18 - card principali, modali */

    /* ── Ombre (4 livelli: inset, light, medium, strong) ────── */
    --bspc-shadow-light: 0 2px 8px rgba(0, 0, 0, 0.04);   /* [Audit] card a riposo - era 0 6px 16px */
    --bspc-shadow-medium: 0 8px 24px rgba(0, 0, 0, 0.08);  /* [Audit] hover - era 0 10px 24px */
    --bspc-shadow-strong: 0 12px 32px rgba(0, 0, 0, 0.12);  /* [Audit] modali - era 0 14px 36px */

    /* ── Shadow tokens (standard pattern) ────────────────── [Audit v6.0 #deepscan-2] */
    --bspc-shadow-sm: 0 2px 8px rgba(0,0,0,0.04);
    --bspc-shadow-md: 0 4px 16px rgba(0,0,0,0.06);
    --bspc-shadow-lg: 0 8px 24px rgba(0,0,0,0.08);
    --bspc-shadow-xl: 0 12px 32px rgba(0,0,0,0.10);

    /* ── Card system (deriva dai token sopra) ──────────────── */
    --bspc-card-bg: #ffffff;
    --bspc-card-border: var(--bspc-border-light);
    --bspc-card-radius: var(--bspc-radius-large);
    --bspc-card-shadow: var(--bspc-shadow-light);
    --bspc-card-shadow-hover: var(--bspc-shadow-medium);

    /* ── Feedback ───────────────────────────────────────────── */
    --bspc-success-bg: #eaf7ee;
    --bspc-success-text: #2a7d3a;
    --bspc-success-border: #cfe9d7;
    --bspc-error-bg: #faeceb;
    --bspc-error-text: #bf2e26;
    --bspc-error-border: #f3cdc8;

    /* ── v7.0 - Tokens aggiuntivi (Audit v6.0 Definitivo) ──── */
    --bspc-hero-overlay-rgb: 245, 245, 247;  /* [Audit v6.0 #4] Hero overlay RGB per dark mode */
    --bspc-panel-bg: #ffffff;                /* [Audit v6.0 #9] Panel/drawer bg */
    --bspc-modal-bg: #ffffff;                /* [Audit v6.0 #9] Modal bg */
    --bspc-input-bg: #f9fafb;               /* [Audit v6.0 #27] Form input bg */
    --bspc-badge-bg: rgba(255, 255, 255, 0.75); /* [Audit v6.0 #9] Badge hero bg */
    --bspc-bg-glass: rgba(255, 255, 255, 0.85); /* [Audit v6.0 #50] Glass overlay */
    --bspc-breadcrumb-color: inherit;        /* [Audit v6.0 #9] Breadcrumb link color */
    --bspc-hero-text-shadow: 0 2px 10px rgba(255, 255, 255, 0.8); /* [Audit v6.0 #dark-1] Hero text shadow light mode */
    --bspc-footer-bg: var(--bspc-bg-light); /* [Audit v6.0 #dark-2] Footer background */
    --bspc-footer-text: var(--bspc-text-light); /* [Audit v6.0 #dark-2] Footer text */

    /* ── v6.4.x - Colori soft / overlay (CRO Audit Sprint 1) ── */
    --bspc-blue-soft: #eaf3ff;           /* Backgrounds rassicuranti */
    --bspc-green-soft: #e8f8ec;          /* Success backgrounds */
    --bspc-amber-warning: #B8860B;       /* [Audit v6.0 #dark-1] Warning states (light: #B8860B, dark: #F5A623) */
    --bspc-amber-soft: #fff4e0;          /* Warning backgrounds */
    --bspc-red-soft: #fdecea;            /* Error backgrounds (leggero) */
    --bspc-overlay: rgba(0, 0, 0, 0.55); /* Modal backdrop */

    /* ── Accessibilità ─────────────────────────────────────── */
    --bspc-focus-ring: 0 0 0 4px rgba(0, 102, 204, 0.25);

    /* ── Z-index - scala unica condivisa (SSOT) ─────────────── */
    --z-content: 0;
    --z-breadcrumb: 10;
    --z-card-overlay: 50;
    --z-page-sticky: 200;
    --z-dropdown: 400;
    --z-header: 500;
    --z-overlay: 800;
    --z-sticky-cta: 850;
    --z-dock: 860;
    --z-dialog: 900;
    --z-toast: 950;
    --z-tooltip: 980;
    --z-skip-link: 1000;
    --z-hub-bar: 99990;
    --z-hub-overlay: 99995;
    --z-hub-modal: 99999;

    /* Alias retrocompatibili: non definire una seconda scala. */
    --bspc-z-dropdown: var(--z-dropdown);
    --bspc-z-sticky: var(--z-page-sticky);
    --bspc-z-header: var(--z-header);
    --bspc-z-overlay: var(--z-overlay);
    --bspc-z-modal: var(--z-dialog);
    --bspc-z-tooltip: var(--z-tooltip);

    /* ── Font ──────────────────────────────────────────────── */
    --bspc-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

    /* ── Easing ────────────────────────────────────────────── */
    --bspc-ease-apple: cubic-bezier(.23,1,.32,1);

    /* ── Transizioni (SSOT) ───────────────────────────────── */
    --bspc-transition-fast: 180ms var(--bspc-ease-apple);
    --bspc-transition-normal: 320ms var(--bspc-ease-apple);
    --bspc-transition-slow: 500ms var(--bspc-ease-apple);

    /* ── Radius aggiuntivo ────────────────────────────────────── */
    --bspc-radius-pill: 999px;            /* Pill buttons, search fields, chips */

    /* ── Scala spaziatura (8pt grid) ─────────────────────────── */
    --bspc-space-2xs: 4px;
    --bspc-space-xs: 8px;
    --bspc-space-sm: 12px;
    --bspc-space-md: 16px;
    --bspc-space-lg: 24px;
    --bspc-space-xl: 32px;
    --bspc-space-2xl: 48px;
    --bspc-space-3xl: 64px;

    /* ── v6.4.x - Alias numerati spaziatura (CRO Audit Sprint 1) ── */
    --bspc-space-1: 4px;    /* = space-2xs */
    --bspc-space-2: 8px;    /* = space-xs  */
    --bspc-space-3: 12px;   /* = space-sm  */
    --bspc-space-4: 16px;   /* = space-md  */
    --bspc-space-5: 24px;   /* = space-lg  */
    --bspc-space-6: 32px;   /* = space-xl  */
    --bspc-space-7: 48px;   /* = space-2xl */
    --bspc-space-8: 64px;   /* = space-3xl */
    --bspc-space-9: 96px;   /* Nuovo: sezioni ampie */

    /* ── Spaziatura modale / pannelli ────────────────────────── */
    --bspc-modal-padding: 24px;
    --bspc-modal-padding-mobile: 18px 16px;

    /* ── Font scale (body text) ──────────────────────────────── */
    --bspc-font-2xs: 11px;
    --bspc-font-xs: 12px;
    --bspc-font-sm: 13px;
    --bspc-font-base-sm: 14px;   /* [6.0.2] nuovo - 75 usi nel tema */
    --bspc-font-base: 15px;
    --bspc-font-md: 16px;
    --bspc-font-lg: 18px;
    --bspc-font-xl: 20px;        /* [6.0.2] nuovo - 23 usi nel tema */
    --bspc-font-btn: 15px;

    /* ── Colori extra (brand / decorativi) ────────────────────── */
    --bspc-star-color: #f5a623;
    /*
     * [A11Y 7.60.0] Il verde WhatsApp di marca resta quello: serve per icone,
     * bordi e sfondi tenui, dove non regge testo. Ma con il testo bianco sopra
     * dava 1,98:1 - misurato con axe sulle pagine vere, non stimato - e serve
     * 4,5:1. Da qui i due tocchi separati: --strong per i pulsanti pieni,
     * --ink per la scritta verde su fondo chiaro.
     */
    --bspc-whatsapp-green: #25d366;
    --bspc-whatsapp-green-hover: #12833c;
    --bspc-whatsapp-strong: #12833c;      /* bianco sopra: 4,84:1 */
    --bspc-whatsapp-strong-hover: #0f7133; /* bianco sopra: 5,72:1 */
    --bspc-whatsapp-ink: #0f6b31;         /* su bianco: 6,25:1 */
    --bspc-logout-red: #ff3b30;
    --bspc-blue-primary-hover: #0058b0;

    /* ── Ombra aggiuntiva ─────────────────────────────────────── */
    --bspc-shadow-inset: inset 0 1px 0 rgba(0, 0, 0, 0.03);

    /* ── Spaziature sezione (Apple-style) ─────────────────── */
    --bspc-section-gap: clamp(64px, 8vw, 120px);
    --bspc-section-gap-small: clamp(40px, 5vw, 72px);

    /* ── Heading scale (Apple-style) ──────────────────────── */
    --bspc-heading-hero: clamp(34px, 5.3vw, 64px);
    --bspc-heading-section: clamp(26px, 3.5vw, 44px);
    --bspc-heading-card: clamp(18px, 2.5vw, 24px);
    --bspc-heading-small: clamp(15px, 2vw, 18px);

    /* ── Header ────────────────────────────────────────────── */
    --header-height-desktop: 65px;
    --header-height-mobile: 60px;
    --header-bg-initial: rgba(255,255,255,.78);
    --header-bg-scrolled: rgba(255,255,255,.96);
    --header-blur: 12px;
    --header-border-color: rgba(0,0,0,.08);
    --header-text-color: #1d1d1f;
    --header-icon-color: #1d1d1f;
    --header-link-hover: #0066cc;
    --header-z-index: var(--z-header);    /* Legacy alias → --z-header */
    --dialog-z-index: var(--z-dialog);    /* Legacy alias → --z-dialog */
    --admin-bar-height-desktop: 32px;
    --admin-bar-height-mobile: 46px;

    /* ── Dock ──────────────────────────────────────────────── */
    --dock-height: clamp(56px, 6.5vw, 64px);
    --dock-radius: 16px;
    --dock-blur: 18px;
    --bpc-accent: #0A84FF;
    --bpc-ctl-size: clamp(36px, 3.5vw, 44px);
    --bpc-icon-size: clamp(17px, 2.4vw, 19px);

    /* ── Legacy aliases (backward-compat, will be removed in future) ── */
    /* IMPORTANT: These are maintained for backward compatibility only. */
    /* New implementations should use the --bspc-* prefixed tokens above. */
    --content-width: var(--bspc-content-width-wider);
    --light-gray-bg: var(--bspc-bg-light);
    --medium-gray-border: var(--bspc-border-light);
    --dark-gray-text: var(--bspc-text-light);
    --easing-smooth: var(--bspc-ease-apple);
}

/* ==========================================================
   v6.4.x Sprint 8 - Dark Mode Token Remap
   Activated by [data-theme="dark"] on <html>.
   Respects OS preference via prefers-color-scheme fallback.
   ========================================================== */
[data-theme="dark"] {
    color-scheme: dark;

    /* ── Colori primari ── */
    --bspc-blue-primary: #2997ff;
    --bspc-blue-hover: #40a9ff;
    --bspc-green-primary: #30d158;
    --bspc-green-hover: #28b84c;
    --bspc-red-error: #ff453a;

    /* ── Gerarchia testo ── */
    --bspc-text-primary: #f5f5f7;
    --bspc-text-secondary: #a1a1a6;
    --bspc-text-light: #86868b;
    --bspc-text-dark: var(--bspc-text-primary);
    --bspc-text-placeholder: #636366;

    /* ── Sfondi - v6.5.2 OLED: bg pagina nero assoluto, card #1c1c1e ── */
    --bspc-bg-light: #000000;
    --bspc-bg-white: #1c1c1e;

    /* ── Bordi ── */
    --bspc-border-light: #38383a;
    --bspc-border-medium: #48484a;
    --bspc-border-dark: #636366;

    /* ── Ombre (ridotte in dark mode) ── */
    --bspc-shadow-light: 0 2px 8px rgba(0, 0, 0, 0.3);
    --bspc-shadow-medium: 0 8px 24px rgba(0, 0, 0, 0.4);
    --bspc-shadow-strong: 0 12px 32px rgba(0, 0, 0, 0.5);

    /* ── Card system ── */
    --bspc-card-bg: #1c1c1e;
    --bspc-card-border: var(--bspc-border-light);

    /* ── Feedback ── */
    --bspc-success-bg: #0d3318;
    --bspc-success-text: #30d158;
    --bspc-success-border: #1a5c2e;
    --bspc-error-bg: #3a1414;
    --bspc-error-text: #ff453a;
    --bspc-error-border: #5c1a1a;

    /* ── Colori soft / overlay ── */
    --bspc-blue-soft: #0a1a2e;
    --bspc-green-soft: #0d2818;
    --bspc-amber-warning: #F5A623;
    --bspc-amber-soft: #2a1f0a;
    --bspc-red-soft: #2a0f0d;
    --bspc-overlay: rgba(0, 0, 0, 0.7);

    /* ── Accessibilità ── */
    --bspc-focus-ring: 0 0 0 4px rgba(41, 151, 255, 0.35);

    /* ── v7.0 - Tokens aggiuntivi dark (Audit v6.0 Definitivo) ── */
    --bspc-hero-overlay-rgb: 0, 0, 0;           /* [Audit v6.0 #4] Dark hero overlay */
    --bspc-panel-bg: #1c1c1e;                   /* [Audit v6.0 #9] Panel/drawer bg */
    --bspc-modal-bg: #1c1c1e;                   /* [Audit v6.0 #9] Modal bg */
    --bspc-input-bg: #2c2c2e;                   /* [Audit v6.0 #27] Form input bg */
    --bspc-badge-bg: rgba(0, 0, 0, 0.55);       /* [Audit v6.0 #9] Badge hero bg */
    --bspc-bg-glass: rgba(28, 28, 30, 0.85);    /* [Audit v6.0 #50] Glass overlay dark */
    --bspc-breadcrumb-color: #a1a1a6;            /* [Audit v6.0 #9] Breadcrumb dark */

    /* ── Colori extra ── */
    --bspc-star-color: #ffd60a;
    --bspc-blue-primary-hover: #40a9ff;

    /* ── Hero & text shadow dark ── */
    --bspc-hero-text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6); /* [Audit v6.0 #dark-1] Hero text shadow dark mode */

    /* ── Footer dark ── */
    --bspc-footer-bg: var(--bspc-bg-light); /* [Audit v6.0 #dark-2] Footer background dark */
    --bspc-footer-text: var(--bspc-text-light); /* [Audit v6.0 #dark-2] Footer text dark */

    /* ── Amber warning dark ── */
    --bspc-amber-warning: #F5A623; /* [Audit v6.0 #dark-1] Amber warning dark mode */

    /* ── Header ── */
    --header-bg-initial: rgba(0, 0, 0, 0.78);
    --header-bg-scrolled: rgba(0, 0, 0, 0.96);
    --header-border-color: rgba(255, 255, 255, 0.08);
    --header-text-color: #f5f5f7;
    --header-icon-color: #f5f5f7;
    --header-link-hover: #2997ff;
}

/* OS-level dark preference (auto mode, when no explicit data-theme) */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --bspc-blue-primary: #2997ff;
        --bspc-blue-hover: #40a9ff;
        --bspc-green-primary: #30d158;
        --bspc-green-hover: #28b84c;
        --bspc-red-error: #ff453a;
        --bspc-text-primary: #f5f5f7;
        --bspc-text-secondary: #a1a1a6;
        --bspc-text-light: #86868b;
        --bspc-text-dark: var(--bspc-text-primary);
        --bspc-text-placeholder: #636366;
        --bspc-bg-light: #000000;
        --bspc-bg-white: #1c1c1e;
        --bspc-border-light: #38383a;
        --bspc-border-medium: #48484a;
        --bspc-border-dark: #636366;
        --bspc-shadow-light: 0 2px 8px rgba(0, 0, 0, 0.3);
        --bspc-shadow-medium: 0 8px 24px rgba(0, 0, 0, 0.4);
        --bspc-shadow-strong: 0 12px 32px rgba(0, 0, 0, 0.5);
        --bspc-card-bg: #1c1c1e;
        --bspc-card-border: var(--bspc-border-light);
        --bspc-success-bg: #0d3318;
        --bspc-success-text: #30d158;
        --bspc-success-border: #1a5c2e;
        --bspc-error-bg: #3a1414;
        --bspc-error-text: #ff453a;
        --bspc-error-border: #5c1a1a;
        --bspc-blue-soft: #0a1a2e;
        --bspc-green-soft: #0d2818;
        --bspc-amber-warning: #F5A623;
        --bspc-amber-soft: #2a1f0a;
        --bspc-red-soft: #2a0f0d;
        --bspc-overlay: rgba(0, 0, 0, 0.7);
        --bspc-focus-ring: 0 0 0 4px rgba(41, 151, 255, 0.35);
        --bspc-star-color: #ffd60a;
        --bspc-blue-primary-hover: #40a9ff;
        --header-bg-initial: rgba(0, 0, 0, 0.78);
        --header-bg-scrolled: rgba(0, 0, 0, 0.96);
        --header-border-color: rgba(255, 255, 255, 0.08);
        --header-text-color: #f5f5f7;
        --header-icon-color: #f5f5f7;
        --header-link-hover: #2997ff;

        /* [Fase 3 · design system] Allineamento al blocco [data-theme="dark"]:
           questi 10 token mancavano nel fallback automatico (solo preferenza
           OS, senza toggle) → superfici chiare in pagine dark: input dei form,
           modali, pannelli, badge hero, breadcrumb, footer. Stessi valori del
           dark esplicito. */
        --bspc-hero-overlay-rgb: 0, 0, 0;
        --bspc-panel-bg: #1c1c1e;
        --bspc-modal-bg: #1c1c1e;
        --bspc-input-bg: #2c2c2e;
        --bspc-badge-bg: rgba(0, 0, 0, 0.55);
        --bspc-bg-glass: rgba(28, 28, 30, 0.85);
        --bspc-breadcrumb-color: #a1a1a6;
        --bspc-hero-text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6);
        --bspc-footer-bg: var(--bspc-bg-light);
        --bspc-footer-text: var(--bspc-text-light);
    }
}

/* Dark mode overrides for components with hardcoded colors */
[data-theme="dark"] .hero-glass,
:root:not([data-theme="light"]) .hero-glass {
    background: rgba(0, 0, 0, 0.72);
}
[data-theme="dark"] .hero-badges li,
:root:not([data-theme="light"]) .hero-badges li {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .hero-glass {
        background: rgba(255, 255, 255, 0.72);
    }
    :root:not([data-theme="dark"]) .hero-badges li {
        background: rgba(0, 0, 0, 0.04);
        border-color: rgba(0, 0, 0, 0.06);
    }
}

/* ------------------------------------------------------------------
   Reset di base e stili globali
------------------------------------------------------------------ */

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--bspc-font-family);
    color: var(--bspc-text-primary);
    background-color: var(--bspc-bg-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Leggera riduzione della spaziatura tra le lettere per una tipografia più nitida */
    letter-spacing: -0.01em;
    margin: 0;
}

/* ------------------------------------------------------------------
   Pagina 404: recupero chiaro, accessibile e coerente in light/dark.
------------------------------------------------------------------ */
.bpc-not-found {
    box-sizing: border-box;
    display: grid;
    min-height: clamp(430px, 62vh, 680px);
    place-items: center;
    padding: clamp(48px, 8vw, 96px) var(--bspc-page-gutter, 20px);
    color: #1d1d1f;
    background:
        radial-gradient(circle at 18% 20%, rgba(0, 113, 227, 0.12), transparent 34%),
        linear-gradient(180deg, #f8fbff 0%, #f5f5f7 100%);
}

.bpc-not-found__card {
    box-sizing: border-box;
    width: min(100%, 760px);
    padding: clamp(28px, 5vw, 56px);
    text-align: center;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 0, 0, 0.07);
    border-radius: clamp(24px, 4vw, 36px);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.1);
}

.bpc-not-found__eyebrow {
    margin: 0 0 10px;
    color: #0066cc;
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.bpc-not-found h1 {
    margin: 0;
    color: inherit;
    font-size: clamp(2rem, 5vw, 3.75rem);
    line-height: 1.04;
    letter-spacing: -0.045em;
}

.bpc-not-found__lead {
    max-width: 620px;
    margin: 20px auto 0;
    color: #515154;
    font-size: clamp(1rem, 2vw, 1.14rem);
    line-height: 1.65;
}

.bpc-not-found__search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    max-width: 580px;
    margin: 30px auto 0;
}

.bpc-not-found__search input,
.bpc-not-found__search button,
.bpc-not-found__actions a {
    box-sizing: border-box;
    min-height: 48px;
    border-radius: 14px;
    font: inherit;
}

.bpc-not-found__search input {
    width: 100%;
    padding: 0 16px;
    color: #1d1d1f;
    background: #fff;
    border: 1px solid #d2d2d7;
}

.bpc-not-found__search button,
.bpc-not-found__primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 22px;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    background: #006edb;
    border: 1px solid #006edb;
    cursor: pointer;
}

.bpc-not-found__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 18px;
}

.bpc-not-found__actions a {
    padding: 13px 20px;
}

.bpc-not-found__secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0066cc;
    font-weight: 700;
    text-decoration: none;
    background: rgba(0, 102, 204, 0.06);
    border: 1px solid rgba(0, 102, 204, 0.18);
}

.bpc-not-found__search input:focus-visible,
.bpc-not-found__search button:focus-visible,
.bpc-not-found__actions a:focus-visible {
    outline: 3px solid rgba(0, 102, 204, 0.35);
    outline-offset: 3px;
}

@media (max-width: 560px) {
    .bpc-not-found__search {
        grid-template-columns: 1fr;
    }

    .bpc-not-found__actions {
        display: grid;
    }
}

[data-theme="dark"] .bpc-not-found {
    color: #f5f5f7;
    background:
        radial-gradient(circle at 18% 20%, rgba(10, 132, 255, 0.2), transparent 34%),
        linear-gradient(180deg, #111214 0%, #050506 100%);
}

[data-theme="dark"] .bpc-not-found__card {
    background: rgba(28, 28, 30, 0.9);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

[data-theme="dark"] .bpc-not-found__eyebrow,
[data-theme="dark"] .bpc-not-found__secondary {
    color: #64a9ff;
}

[data-theme="dark"] .bpc-not-found__lead {
    color: #c7c7cc;
}

[data-theme="dark"] .bpc-not-found__search input {
    color: #f5f5f7;
    background: #1c1c1e;
    border-color: #48484a;
}

[data-theme="dark"] .bpc-not-found__secondary {
    background: rgba(100, 169, 255, 0.1);
    border-color: rgba(100, 169, 255, 0.28);
}


/* Contenimento orizzontale mirato per pannelli che animano fuori canvas. */
.bpc-overflow-clip,
.bpc-page-shell {
    overflow-x: clip;
}

/* ── Scroll lock SSOT ──────────────────────────────────────────
   [v6.0.3] Tre livelli di scroll lock, ciascuno con scopo distinto:
   1. bpc-no-scroll   - Blocco base: overflow hidden + touch-action none (header, notice, home)
   2. bpc-scroll-locked - iOS fix: position fixed (header panel, preserva scroll position)
   3. bpc-modal-open   - Modale: overflow hidden + transform reset su #primary/main

   Legacy aliases (non usare in nuovo codice):
   - no-scroll       → alias di bpc-no-scroll
   - bpc-scroll-lock → alias di bpc-no-scroll
   - bspc-modal-open → alias di bpc-modal-open
──────────────────────────────────────────────────────────────── */

/* 1. Blocco scroll base */
body.bpc-no-scroll,
body.no-scroll,
body.bpc-scroll-lock {
    overflow: hidden !important;
    touch-action: none;
}

/* 2. iOS scroll lock (JS imposta top negativo per preservare la posizione) */
body.bpc-scroll-locked {
    position: fixed;
    width: 100%;
    overflow: hidden;
}

/* 3. Modale scroll lock + transform reset */
body.bpc-modal-open,
body.bspc-modal-open {
    overflow: hidden !important;
}

body.bpc-modal-open #primary,
body.bpc-modal-open main,
body.bspc-modal-open #primary,
body.bspc-modal-open main {
    transform: none !important;
}


.screen-reader-text,
.sr-only {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal;
    white-space: nowrap;
}

/* Visibilità del link "Salta al contenuto" quando messo a fuoco */
.skip-link.screen-reader-text:focus {
    position: absolute;
    left: 10px;
    top: 10px;
    width: auto;
    height: auto;
    padding: 8px 12px;
    background: #ffffff;
    color: #000000;
    border-radius: var(--bspc-radius-small);
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    z-index: var(--z-skip-link);
    clip: auto;
    clip-path: none;
    overflow: visible;
    white-space: normal;
}

/* Focus visibile su elementi interattivi
   [v6.0.3] Migrato da box-shadow a outline per compatibilità con Windows High Contrast.
   outline-offset evita sovrapposizione con il contenuto dell'elemento. */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
    outline: 3px solid var(--bspc-blue-primary);
    outline-offset: 3px;
}

/* Riduzione movimento globale: una sola definizione, con fallback reveal. */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .fade-in-up,
    .reveal,
    [data-reveal] {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ------------------------------------------------------------------
   Utilities aggiuntive
   - .no-scrollbar: nasconde le barre di scorrimento su contenitori scrollabili
   - ::selection: personalizza il colore di selezione del testo
------------------------------------------------------------------ */

.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

::selection {
    background-color: rgba(0, 102, 204, 0.2);
    color: inherit;
}

/* ------------------------------------------------------------------
   v6.4.0 - Consolidamento hotfix ereditati da style.css
   (erano precedentemente appesi in coda a style.css; spostati qui
   per coerenza con l'architettura asset del tema.)
------------------------------------------------------------------ */

/* Category extended description accordion (ex v6.3.3) */
.category-extended-description{margin-top:2rem;border-top:1px solid var(--bpc-border,#d2d2d7);padding-top:1.5rem}
.bpc-acc{border-bottom:1px solid var(--bpc-border,#d2d2d7)}
.bpc-acc__summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 0}
.bpc-acc__summary::-webkit-details-marker{display:none}
.bpc-acc__title{font-size:1.0625rem;font-weight:600;color:var(--bpc-text,#1d1d1f)}
.bpc-acc__icon{width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .25s ease;color:var(--bpc-link,#0066cc);flex-shrink:0}
.bpc-acc[open] .bpc-acc__icon{transform:rotate(-135deg)}
.bpc-acc__body{padding:0 0 1.5rem;line-height:1.6;color:var(--bpc-text-soft,#515154)}

/* Quick wins UI (ex v6.3.13) */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.btn,.bspc-btn,.bspc-btn-primary,button.bspc-btn,.bpc-btn,a.bspc-btn{transition:transform .15s var(--bspc-ease-apple,cubic-bezier(.32,.72,0,1)),box-shadow .25s ease,background-color .2s ease}
.btn:active,.bspc-btn:active,.bspc-btn-primary:active,button.bspc-btn:active,.bpc-btn:active,a.bspc-btn:active{transform:scale(.96)}

@media (hover:hover){
  .bspc-btn-primary:hover,.btn--primary:hover{box-shadow:0 0 15px rgba(0,102,204,.4),0 4px 12px rgba(0,102,204,.15)}
}

:focus:not(:focus-visible){outline:none}

.bpc-card-unified,.bento-card,.apple-card,.apple-product-card{
  border:1px solid rgba(0,0,0,.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,1),0 4px 12px rgba(0,0,0,.03);
}

.apple-card__title,.apple-product-card__title,.bpc-card-unified__title{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;text-overflow:ellipsis;
}

input[type=text]:focus,input[type=email]:focus,input[type=tel]:focus,input[type=search]:focus,input[type=number]:focus,textarea:focus,select:focus{
  box-shadow:0 0 0 4px rgba(0,102,204,.18);
  border-color:transparent;
  outline:none;
}

@media (max-width:767.98px){
  .header-search-field,input.header-search-field{padding-right:45px}
}

.bpc-modal__dialog,.bpc-bottom-sheet,.bpc-modal-content{
  padding-bottom:max(24px,env(safe-area-inset-bottom));
}

/* ------------------------------------------------------------------
   v6.4.0 - A11Y/UX additions
------------------------------------------------------------------ */


/* Skip-link: scroll-margin per evitare che il target finisca sotto l'header fixed */
#primary {
  scroll-margin-top: calc(var(--header-height-desktop, 65px) + 12px);
}
@media (max-width: 980px) {
  #primary {
    scroll-margin-top: calc(var(--header-height-mobile, 60px) + 12px);
  }
}

/* Logo header: larghezza responsiva mobile-friendly */
.header-logo img,
.footer-logo img {
  width: auto;
  max-width: 150px;
  height: auto;
}
@media (max-width: 360px) {
  .header-logo img { max-width: 120px; }
}

/* ==========================================================
   v6.4.x Sprint 7 - Micro-interactions polish
   ========================================================== */

/* Smooth underline animation for text links inside content areas */
.bpc-hub-desc a,
.bpc-empty-state__desc a,
.inner-content a,
.entry-content a {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 3px;
  transition: text-decoration-color 0.2s ease;
}
.bpc-hub-desc a:hover,
.bpc-empty-state__desc a:hover,
.inner-content a:hover,
.entry-content a:hover {
  text-decoration-color: currentColor;
}

/* [7.11.10] Titoli-link dei risultati di ricerca/archivio (fallback index.php):
   erano <a> non stilizzati → blu/viola di default del browser (in dark il blu
   auto-adattato dall'UA). Li allineiamo ai token del tema: colore heading,
   niente sottolineatura, hover blu brand. Il dark è automatico (le variabili
   cambiano da sole). */
.site-content .entry-title a {
  color: var(--bspc-text-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}
.site-content .entry-title a:hover,
.site-content .entry-title a:focus-visible {
  color: var(--bspc-blue-primary);
}

/* [7.12.0] Safety net barra vecchia: la sticky CTA mobile ("Richiedi preventivo
   + WhatsApp") è stata rimossa dal Core (ora l'unica barra azioni è l'Action
   Dock). Se sullo staging gira ancora una versione vecchia del plugin Core che
   la re-inietta, la nascondiamo comunque dal TEMA - così sparisce già col solo
   aggiornamento del tema. .bpc-sticky-bar è markup morto: lo nascondiamo pure. */
.bpc-sticky-cta,
.bpc-sticky-bar {
  display: none !important;
}

/* [7.12.1] Notifiche WooCommerce (info/message/error) FUORI dalle pagine
   account: usavano lo stile chiaro di default di Woo (es. "Nessun prodotto",
   messaggi carrello) → riquadro chiaro su pagina scura. Le rendiamo dark
   sitewide, coerenti col tema. Pattern doppio [data-theme] + preferenza OS. */
[data-theme="dark"] .woocommerce-info,
[data-theme="dark"] .woocommerce-message,
[data-theme="dark"] .woocommerce-error,
[data-theme="dark"] .woocommerce-noreviews {
  background-color: rgba(255, 255, 255, 0.05);
  color: var(--bspc-text-primary);
  border-top-color: rgba(255, 255, 255, 0.14);
}
[data-theme="dark"] .woocommerce-info a,
[data-theme="dark"] .woocommerce-message a,
[data-theme="dark"] .woocommerce-error a,
[data-theme="dark"] .woocommerce-noreviews a {
  color: var(--bspc-blue-primary);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .woocommerce-info,
  :root:not([data-theme="light"]) .woocommerce-message,
  :root:not([data-theme="light"]) .woocommerce-error,
  :root:not([data-theme="light"]) .woocommerce-noreviews {
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--bspc-text-primary);
    border-top-color: rgba(255, 255, 255, 0.14);
  }
  :root:not([data-theme="light"]) .woocommerce-info a,
  :root:not([data-theme="light"]) .woocommerce-message a,
  :root:not([data-theme="light"]) .woocommerce-error a,
  :root:not([data-theme="light"]) .woocommerce-noreviews a {
    color: var(--bspc-blue-primary);
  }
}

/* Reduced-motion: disable scale transforms on buttons */
@media (prefers-reduced-motion: reduce) {
  .btn:active,
  .bpc-btn:active,
  .bpc-hub-btn:active {
    transform: none;
  }
}

/* ==========================================================
   v6.5.2 - Inner Glow sulle card (luce interna superiore)
   Sostituisce il bordo scuro netto con una hairline morbida
   + una luce interna in alto che simula il gesto "lift" Apple.
   Si applica a: .bpc-card, .bento-card, .apple-product-card,
   .apple-card, .bpc-card-unified, .category-faults-accordion (root).
   ========================================================== */
.bpc-card,
.bento-card,
.apple-product-card,
.apple-card,
.bpc-card-unified {
    border: 1px solid rgba(0, 0, 0, 0.04);
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 1);
}

/* Dark mode: no drop-shadow, solo hairline chiara come in iOS */
[data-theme="dark"] .bpc-card,
[data-theme="dark"] .bento-card,
[data-theme="dark"] .apple-product-card,
[data-theme="dark"] .apple-card,
[data-theme="dark"] .bpc-card-unified,
:root:not([data-theme="light"]) .bpc-card,
:root:not([data-theme="light"]) .bento-card,
:root:not([data-theme="light"]) .apple-product-card,
:root:not([data-theme="light"]) .apple-card,
:root:not([data-theme="light"]) .bpc-card-unified {
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* Body OLED: assicura che lo sfondo dietro i modali push-back sia nero puro */
[data-theme="dark"] body,
:root:not([data-theme="light"]) body {
    background-color: #000;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) body { background-color: #000; }
}

/* ==========================================================
   v6.5.2 - Push-Back Modal System
   Quando body.bpc-modal-open è attivo, la pagina sotto arretra
   in 3D (scale + radius + brightness) rivelando il nero dietro.
   Agganciato anche ai body-class esistenti:
   body.mobile-menu-open (header.css) e body.bpc-modal-open (nuovo).
   Il nuovo body-class andrà impostato via JS quando si aprono
   modali WooCommerce (mini-cart, quote, quick-view).
   ========================================================== */
body.bpc-modal-open,
body.mobile-menu-open,
body.search-dialog-open,
body.mini-cart-open {
    background-color: #000;
    overflow: hidden;
}

body.bpc-modal-open #primary,
body.bpc-modal-open .bresciapc-main-header,
body.mobile-menu-open #primary,
body.mobile-menu-open .bresciapc-main-header,
body.search-dialog-open #primary,
body.search-dialog-open .bresciapc-main-header,
body.mini-cart-open #primary,
body.mini-cart-open .bresciapc-main-header {
    transform: scale(0.94) translateY(10px);
    border-radius: 20px;
    filter: brightness(0.7);
    transition: transform 0.4s cubic-bezier(0.32, 0.72, 0, 1),
                border-radius 0.4s cubic-bezier(0.32, 0.72, 0, 1),
                filter 0.4s cubic-bezier(0.32, 0.72, 0, 1);
    transform-origin: center top;
    overflow: hidden;
}

#primary,
.bresciapc-main-header {
    transition: transform 0.4s cubic-bezier(0.32, 0.72, 0, 1),
                border-radius 0.4s cubic-bezier(0.32, 0.72, 0, 1),
                filter 0.4s cubic-bezier(0.32, 0.72, 0, 1);
}

@media (prefers-reduced-motion: reduce) {
    body.bpc-modal-open #primary,
    body.bpc-modal-open .bresciapc-main-header,
    body.mobile-menu-open #primary,
    body.mobile-menu-open .bresciapc-main-header {
        transform: none;
        border-radius: 0;
        filter: none;
    }
}


/* ============================================================
 * Tipografia globale.
 *
 * FAQ e "Come funziona" non vengono nascosti qui: sono componenti realmente
 * renderizzati e amministrabili nelle categorie e nei marchi. Le eventuali
 * esclusioni appartengono al template specifico (per esempio la scheda
 * prodotto compatta), così una regola globale non può occultare contenuti e
 * dati strutturati senza un sostituto effettivo.
 * ============================================================ */
:root {
  --bpc-font-system: system-ui, -apple-system, "SF Pro Text", "SF Pro Display", "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif;
}
body,
.bpc-section,
.bspc-archive-wrapper,
.bpc-v4-block,
.bpc-v4-faq,
.bpc-v4-steps,
p,
li {
  font-family: var(--bpc-font-system);
  font-weight: 400;
  line-height: 1.6;
}
h1,
h2,
.bpc-v4-t,
.bpc-v4-head h2 {
  font-family: var(--bpc-font-system);
  font-weight: 600;
  line-height: 1.3;
}
h3,
h4,
.bpc-v4-k {
  font-family: var(--bpc-font-system);
  font-weight: 500;
  line-height: 1.3;
}
/* === END CLEANUP 2026-05-27 === */

/* ==========================================================================
   BresciaPC Icon System - canonical inline SVG rendering
   ========================================================================== */
.bpc-icon {
    display: inline-block;
    flex: 0 0 auto;
    width: 1.25em;
    height: 1.25em;
    overflow: visible;
    vertical-align: -0.22em;
    color: currentColor;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
    shape-rendering: geometricPrecision;
}


.bpc-icon-tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    color: var(--bspc-blue-primary);
    background: color-mix(in srgb, var(--bspc-blue-primary) 8%, #fff);
    border: 1px solid color-mix(in srgb, var(--bspc-blue-primary) 14%, var(--bspc-border-light));
    border-radius: 14px;
}

.bpc-icon-tile .bpc-icon {
    width: 24px;
    height: 24px;
}

.bpc-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    color: var(--bspc-text-primary);
    background: var(--bspc-bg-white);
    border: 1px solid var(--bspc-border-light);
    border-radius: 50%;
    transition: color var(--bspc-transition-fast), background var(--bspc-transition-fast), border-color var(--bspc-transition-fast), transform var(--bspc-transition-fast);
}

.bpc-icon-button:hover {
    color: var(--bspc-blue-primary);
    border-color: color-mix(in srgb, var(--bspc-blue-primary) 30%, var(--bspc-border-light));
}

.bpc-icon-button:active {
    transform: scale(.96);
}

@media (prefers-reduced-motion: reduce) {
    .bpc-icon-button {
        transition-duration: 0.01ms;
    }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~   [A11Y 7.60.1] BADGE "IN OFFERTA" DI WOOCOMMERCE            ~
~                                                              ~
~   WooCommerce dipinge il badge con --wc-highlight, che vale   ~
~   #958e09: con la scritta bianca sopra fa 3,41:1, e ne        ~
~   servono 4,5. Misurato sulla scheda Vivo V9 a 390px.         ~
~   Stesso colore, solo piu' scuro: 4,85:1, e nient'altro nel   ~
~   design cambia tinta.                                        ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
:root {
    --wc-highlight: #7a7407;
}

/*
 * La variabile da sola non basta: WooCommerce dichiara il proprio :root e,
 * a seconda di come LiteSpeed unisce i fogli, puo' finire dopo il nostro.
 * Verificato in pagina: il badge restava #958e09. Qui si vince per
 * specificita', non per ordine, cosi' l'esito non dipende dalla cache.
 */
body span.onsale,
body .woocommerce span.onsale,
body.woocommerce-page span.onsale {
    color: #fff;
    background-color: #7a7407;
}

/* Public honeypot: offscreen, excluded from pointer and assistive navigation. */
.bpc-hp-field {
    position: absolute !important;
    left: -10000px !important;
    top: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
}