/* ============================================================ ResinPlan 3.0 — LOW QUALITY MODE (file unico) ------------------------------------------------------------ Attivazione: Impostato dallo script in layouts/header.blade.php: - di DEFAULT in auto-detect sui device deboli (poca RAM / pochi core+touch / save-data / prefers-reduced-motion) - oppure forzato dall'utente col toggle in "Il mio account → Impostazioni" (localStorage 'rp-quality' = 'low' | 'high') Cosa fa: rimuove gli effetti costosi mantenendo il layout. 1) Azzera TUTTI i backdrop-filter (l'effetto più pesante) e rende opache le superfici "vetro" (altrimenti resterebbero slavate). 2) Nasconde le 4 sfere animate e il blur ambientale dello stage. 3) Ferma le animazioni infinite / ambient, ma fa "scattare" subito allo stato finale quelle di comparsa (reveal) per non lasciare elementi invisibili. Nota: usa i token --bg-* / --border-* così funziona sia in tema chiaro che scuro (in dark sono già ridefiniti da dark.css). Va caricato DOPO glass.css e dark.css. ============================================================ */ /* ------------------------------------------------------------ 1) Niente backdrop-filter (ovunque) ------------------------------------------------------------ */ [data-quality="low"] *, [data-quality="low"] *::before, [data-quality="low"] *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } /* ------------------------------------------------------------ 2) Superfici "vetro" → opache (senza blur la trasparenza è brutta) ------------------------------------------------------------ */ [data-quality="low"] .glass, [data-quality="low"] .glass-strong, [data-quality="low"] .glass-soft { background: var(--bg-1) !important; border: 1px solid var(--border-1) !important; box-shadow: var(--shadow-2) !important; } [data-quality="low"] .glass::before, [data-quality="low"] .glass-strong::before, [data-quality="low"] .glass-soft::before { display: none !important; } [data-quality="low"] .btn-glass, [data-quality="low"] .icon-btn { background: var(--bg-2) !important; border: 1px solid var(--border-1) !important; } /* Nav pill / menu / mini-cart / drawer mobile */ [data-quality="low"] .nav-menu, [data-quality="low"] .rp-dropdown-menu, [data-quality="low"] .rp-mega-menu, [data-quality="low"] .rp-mini-cart, [data-quality="low"] #rp-mobile-drawer { background: var(--bg-1) !important; border: 1px solid var(--border-1) !important; } /* Card prodotto correlati */ [data-quality="low"] .rp-product-card { background: var(--bg-1) !important; border: 1px solid var(--border-1) !important; } /* Toast / SweetAlert */ [data-quality="low"] #toast-container > .toast, [data-quality="low"] .rp-swal-popup { background: var(--bg-1) !important; } [data-quality="low"] #toast-container > .toast::before, [data-quality="low"] .rp-swal-popup::before { display: none !important; } [data-quality="low"] .rp-swal-cancel { background: var(--bg-2) !important; } /* Chip/bolle sopra le foto prodotto (tile chiaro): le lasciamo opache chiare */ [data-quality="low"] .rp-spec-chip, [data-quality="low"] .rp-wish-bubble, [data-quality="low"] .rp-avail-strip { background: #ffffff !important; } /* Overlay drawer mobile: meno costoso senza blur, manteniamo la velatura */ [data-quality="low"] #rp-drawer-overlay { background: rgba(24, 25, 63, 0.55) !important; } /* ------------------------------------------------------------ 3) Sfere + blur ambientale dello stage → via ------------------------------------------------------------ */ [data-quality="low"] .rp-orb { display: none !important; } [data-quality="low"] .rp-stage::before { display: none !important; } /* ------------------------------------------------------------ 4) Animazioni: stop a quelle infinite/ambient, snap a quelle di comparsa (stessa strategia del blocco prefers-reduced-motion già presente) ------------------------------------------------------------ */ [data-quality="low"] *, [data-quality="low"] *::before, [data-quality="low"] *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; will-change: auto !important; scroll-behavior: auto !important; }