/*
Theme Name: Darty Clone
Theme URI: https://dartyfr.com/
Description: Tema classico WordPress/WooCommerce che replica la UI del clone statico Darty. Richiede WooCommerce.
Author: Darty Replica
Version: 1.0.1
License: GNU General Public License v2 or later
Text Domain: darty
*/

/* ================================================================
   clone.css — stili custom del clone statico (copiati 1:1 da
   build_clone.py / clone/assets/css/clone.css)
   ================================================================ */
.clone-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin:16px 0 32px}
.clone-grid .tw-product_box{width:auto}
.clone-section-title{font-family:var(--font-bold);color:var(--black);font-size:24px;margin:32px 0 16px}
.clone-hero{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);display:grid;grid-template-columns:minmax(280px,420px) 1fr;gap:32px;align-items:center;margin:16px 0 32px;padding:32px}
.clone-hero .hero-img{display:flex;justify-content:center;align-items:center}
.clone-hero .hero-img img{max-width:100%;max-height:360px;width:auto;height:auto;object-fit:contain}
.clone-hero .hero-title{font-family:var(--font-bold);font-size:28px;color:var(--black);margin:0 0 8px}
.clone-hero .hero-brand{color:var(--mid-grey);text-transform:uppercase;font-size:14px;letter-spacing:.02em;margin-bottom:8px}
.clone-hero .hero-price{font-family:var(--font-bold);font-size:32px;color:var(--black);margin:16px 0 4px}
.clone-hero .hero-price.promo{color:var(--red)}
.clone-hero .hero-old{color:var(--mid-grey);text-decoration:line-through;font-size:18px;margin-left:8px}
.clone-hero .hero-cta{display:inline-flex;margin-top:16px}
.clone-univers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin:16px 0 32px}
.clone-univers-card{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);overflow:hidden;text-decoration:none;color:inherit;display:block;transition:box-shadow .15s ease-in-out}
.clone-univers-card:hover{box-shadow:0 4px 10px rgba(69,69,69,.18)}
.clone-univers-card .uc-img{height:170px;display:flex;justify-content:center;align-items:center;background:var(--white);padding:12px;box-sizing:border-box}
.clone-univers-card .uc-img img{width:auto;height:auto;max-width:100%;max-height:146px;object-fit:contain}
.clone-univers-card .uc-name{font-family:var(--font-bold);font-size:15px;padding:12px 16px;color:var(--dark-grey)}
.clone-univers-card.nolink{cursor:default}
.clone-variants{margin:16px 0}
.clone-variants .variant-dim{margin-bottom:12px}
.clone-variants .variant-dim-name{font-family:var(--font-bold);font-size:14px;margin-bottom:6px}
.clone-variants .variant-opts{display:flex;flex-wrap:wrap;gap:8px}
.clone-variant-btn{display:inline-block;border:2px solid var(--low-grey);border-radius:20px;background:var(--white);color:var(--dark-grey);cursor:pointer;font-family:var(--font-regular);font-size:14px;padding:6px 16px;text-decoration:none}
a.clone-variant-btn:hover{border-color:var(--blue)}
.clone-variant-btn.selected{border-color:var(--blue);color:var(--blue);font-family:var(--font-bold);cursor:default}
.clone-variant-btn.disabled{color:var(--soft-grey);border-color:var(--border-grey);cursor:not-allowed;background:var(--light-grey)}
.clone-review{border-top:1px solid var(--border-grey);padding:20px 0}
.clone-review .review-stars{margin-bottom:6px}
.clone-review .review-title{font-family:var(--font-bold);font-size:15px;margin:4px 0}
.clone-review .review-text{font-size:14px;line-height:1.5;margin:6px 0}
.clone-review .review-meta{color:var(--mid-grey);font-size:12px;margin-top:6px}
.clone-avis-summary{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.clone-avis-summary .big{font-family:var(--font-bold);font-size:40px;color:var(--black)}
.clone-color-dots{display:flex;gap:5px;align-items:center;min-height:14px;margin-top:4px}
.clone-color-dot{width:12px;height:12px;border-radius:50%;display:inline-block;border:1px solid var(--low-grey)}
.clone-variant-note{color:var(--mid-grey);font-size:13px;margin:6px 0 4px}
.clone-variant-note a{color:var(--blue)}
.clone-placeholder-note{color:var(--mid-grey);font-size:13px}
.product-pictures .main-picture picture{display:flex;justify-content:center;align-items:center;width:100%;height:100%}
.product-pictures .main-picture .picture{max-width:100%;max-height:100%;object-fit:contain}
a.tw-button{text-decoration:none}
.clone-footer-bottom{background:var(--dark-grey);color:#fff;padding:32px 5%;margin-top:32px}
.clone-footer-bottom .cfb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px;max-width:1400px;margin:0 auto}
.clone-footer-bottom .cfb-title{font-family:var(--font-bold);font-size:15px;text-transform:uppercase;margin-bottom:10px}
.clone-footer-bottom .cfb-text{font-size:13px;line-height:1.5;color:#d8d8d8}
.clone-footer-bottom .cfb-link{color:#fff;text-decoration:none;display:block}
.clone-footer-bottom .cfb-link:hover .cfb-title{text-decoration:underline}
/* Paginazione: frecce prev/next leggibili (chevron 20px invece di 12px) */
.pagination .list .link.control{background-size:50%}
.pagination .list .link.control:hover{background-color:var(--light-blue)}
.clone-footer-legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:18px 5%;border-top:1px solid var(--border-grey);font-size:13px;color:var(--mid-grey)}
.clone-footer-legal p{margin:0}
.clone-footer-legal .cfl-links a{color:var(--mid-grey);text-decoration:underline;margin-left:18px}

/* ================================================================
   Adattamenti WordPress / WooCommerce
   ================================================================ */

/* base pagina */
body{background:var(--light-grey);font-family:var(--font-regular);color:var(--dark-grey);margin:0}
.site-wrapper{min-height:100vh;display:flex;flex-direction:column}
.main{flex:1}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
img{max-width:100%;height:auto}

/* contatore carrello header */
.header .user-menu .basket{position:relative}
.cart-count-badge{position:absolute;top:-6px;right:-8px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;line-height:18px;text-align:center;font-family:var(--font-bold)}

/* menu mobile: il clone gestisce .js-open via JS; su schermi piccoli
   la nav del bundle CSS resta utilizzabile con scroll orizzontale */
@media (max-width:900px){
	.header .row{flex-wrap:wrap}
	.header .searchbar{order:3;width:100%}
	.nav .list{overflow-x:auto}
}

/* layout archivio: sidebar sottocategorie + contenuto */
.clone-archive-layout{display:grid;grid-template-columns:230px 1fr;gap:24px;align-items:start}
.clone-archive-layout .clone-archive-content{min-width:0}
.clone-sidebar{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:16px}
.clone-sidebar .sidebar-title{font-family:var(--font-bold);font-size:15px;color:var(--black);margin:0 0 8px}
.clone-sidebar ul{list-style:none;margin:0;padding:0}
.clone-sidebar li{margin:0;padding:0}
.clone-sidebar a{display:block;padding:7px 8px;color:var(--dark-grey);text-decoration:none;font-size:14px;border-radius:4px}
.clone-sidebar a:hover{background:var(--light-grey);color:var(--blue)}
.clone-sidebar li.current-cat a{color:var(--blue);font-family:var(--font-bold)}
.clone-sidebar li.children{padding-left:14px}
@media (max-width:900px){.clone-archive-layout{grid-template-columns:1fr}.clone-sidebar{margin-bottom:8px}}

/* paginazione archivi */
.woocommerce-pagination{margin:8px 0 32px;text-align:center}
.woocommerce-pagination ul{display:inline-flex;gap:8px;list-style:none;margin:0;padding:0;border:0}
.woocommerce-pagination ul li{border:0}
.woocommerce-pagination .page-numbers{display:inline-block;min-width:36px;padding:8px 12px;border:1px solid var(--low-grey);border-radius:4px;background:var(--white);color:var(--dark-grey);text-decoration:none;font-size:14px}
.woocommerce-pagination .page-numbers.current{background:var(--blue);border-color:var(--blue);color:#fff;font-family:var(--font-bold)}
.woocommerce-pagination a.page-numbers:hover{border-color:var(--blue);color:var(--blue)}

/* ordinamento + conteggio risultati */
.woocommerce-result-count{color:var(--mid-grey);font-size:13px;margin:8px 0}
.woocommerce-ordering{margin:8px 0 16px;float:right}
.woocommerce-ordering select{padding:8px 12px;border:1px solid var(--low-grey);border-radius:4px;font-family:var(--font-regular);font-size:14px;background:var(--white);color:var(--dark-grey)}

/* card prodotto: il pulsante WC diventa il bottone clone */
.tw-product_box .add_to_cart_button,
.tw-product_box .product_type_simple,
.tw-product_box .product_type_variable{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;text-decoration:none}
.tw-product_box .add_to_cart_button.added{display:none}
.tw-product_box .added_to_cart{display:inline-flex;justify-content:center;width:100%;margin-top:6px;color:var(--green);font-size:13px;text-decoration:underline}

/* ---------- pagina prodotto: form WooCommerce ri-stilizzato ---------- */
/* il form WC delle variazioni resta funzionante ma i <select> sono
   guidati dalle pill .clone-variant-btn renderizzate dal tema */
form.cart .variations{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
form.cart .variations td,form.cart .variations th{display:block;padding:0;border:0}
.woocommerce-variation-price .price{font-family:var(--font-bold);font-size:32px;color:var(--black)}
.woocommerce-variation-price .price del{color:var(--mid-grey);font-size:18px;font-weight:400;margin-right:8px}
.woocommerce-variation-price .price ins{color:var(--red);text-decoration:none}
.woocommerce-variation-availability{font-size:14px;color:var(--mid-grey);margin:8px 0}
.woocommerce-variation-availability .in-stock{color:var(--green)}
.woocommerce-variation-availability .out-of-stock{color:var(--red)}
.single_variation_wrap .woocommerce-variation{margin:12px 0}
.woocommerce-variation--unavailable{font-size:14px;color:var(--red);margin:12px 0}
form.cart .quantity{display:inline-block;margin-right:12px;vertical-align:middle}
form.cart .quantity .qty{width:64px;padding:10px;border:1px solid var(--low-grey);border-radius:4px;font-size:15px;text-align:center}
form.cart .single_add_to_cart_button{margin-top:16px}
form.cart .single_add_to_cart_button.disabled{opacity:.6}
/* wrap variazioni: nascosto finché non si sceglie una variazione
   (lo mostra lo script WC con slideDown) */
.single_variation_wrap .woocommerce-variation{display:none!important}
.woocommerce-variation-add-to-cart-disabled .single_add_to_cart_button{opacity:.5;pointer-events:none}
/* badge carrello vuoto = nascosto */
.cart-count-badge:empty{display:none}

/* messaggi WC (notices) */
.woocommerce-message,.woocommerce-info,.woocommerce-error{list-style:none;margin:16px auto;max-width:1200px;padding:14px 18px;border-radius:8px;background:var(--white);box-shadow:0 2px 4px rgba(69,69,69,.08);border-left:4px solid var(--blue);font-size:14px}
.woocommerce-message{border-left-color:var(--green)}
.woocommerce-error{border-left-color:var(--red)}
.woocommerce-message .button,.woocommerce-info .button,.woocommerce-error .button{float:right;margin-left:12px;color:var(--blue)}
.woocommerce-message a,.woocommerce-info a{color:var(--blue)}

/* pagine carrello / checkout / account: contenitore coerente */
.woocommerce .cart-collaterals .cart_totals,.woocommerce-cart table.cart,.woocommerce-checkout .woocommerce-checkout-review-order-table,.woocommerce-MyAccount-content,.woocommerce-MyAccount-navigation{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08);padding:20px}
.woocommerce-cart table.cart{width:100%;border-collapse:collapse;background:transparent;box-shadow:none;padding:0}
.woocommerce-cart table.cart th{font-family:var(--font-bold);font-size:13px;text-transform:uppercase;color:var(--mid-grey);border-bottom:1px solid var(--border-grey);padding:10px 8px;text-align:left}
.woocommerce-cart table.cart td{padding:12px 8px;border-bottom:1px solid var(--border-grey);vertical-align:middle}
.woocommerce-cart table.cart img{width:64px;height:auto}
.woocommerce a.remove{color:var(--red)!important;font-size:20px;text-decoration:none}
.woocommerce table.shop_table{width:100%;border-collapse:collapse}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{padding:10px 8px;border-bottom:1px solid var(--border-grey);text-align:left;font-size:14px}
.woocommerce .cart-collaterals .cart_totals h2{font-family:var(--font-bold);font-size:18px}
.woocommerce button.button,.woocommerce a.button,.woocommerce input.button,.woocommerce #respond input#submit{display:inline-block;background:var(--red);color:#fff;border:0;border-radius:4px;padding:12px 24px;font-family:var(--font-bold);font-size:14px;cursor:pointer;text-decoration:none}
.woocommerce button.button:hover,.woocommerce a.button:hover,.woocommerce input.button:hover{background:var(--red-hover);color:#fff}
.woocommerce button.button.alt,.woocommerce a.button.alt{background:var(--red)}
.woocommerce form .form-row{padding:6px 0;margin:0 0 12px}
.woocommerce form .form-row label{display:block;font-family:var(--font-bold);font-size:13px;margin-bottom:4px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{width:100%;padding:10px 12px;border:1px solid var(--low-grey);border-radius:4px;font-size:14px;font-family:var(--font-regular);box-sizing:border-box}
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.woocommerce-MyAccount-navigation a{display:block;padding:8px 4px;color:var(--dark-grey);text-decoration:none}
.woocommerce-MyAccount-navigation li.is-active a{color:var(--blue);font-family:var(--font-bold)}
@media (min-width:901px){.woocommerce-MyAccount-navigation{float:left;width:25%}.woocommerce-MyAccount-content{float:right;width:73%}}
.woocommerce-cart .cart-collaterals,.woocommerce-checkout{clear:both}

/* form recensione (clone style) */
.clone-review-form{margin-top:24px;border-top:1px solid var(--border-grey);padding-top:20px}
.clone-review-form h3{font-family:var(--font-bold);font-size:16px;margin:0 0 12px}
.clone-review-form label{display:block;font-size:13px;font-family:var(--font-bold);margin:10px 0 4px}
.clone-review-form input[type=text],.clone-review-form input[type=email],.clone-review-form textarea{width:100%;max-width:520px;padding:10px 12px;border:1px solid var(--low-grey);border-radius:4px;font-size:14px;font-family:var(--font-regular);box-sizing:border-box}
.clone-review-form select{padding:8px 12px;border:1px solid var(--low-grey);border-radius:4px;font-size:14px;background:var(--white)}
.clone-review-form .submit{margin-top:14px;background:var(--red);color:#fff;border:0;border-radius:4px;padding:12px 28px;font-family:var(--font-bold);font-size:14px;cursor:pointer}
.clone-review-form .submit:hover{background:var(--red-hover)}

/* pagine statiche / 404 / ricerca */
.clone-page{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:32px;margin:16px 0 32px}
.clone-page h1{font-family:var(--font-bold);font-size:28px;color:var(--black);margin:0 0 16px}
.clone-page h2{font-family:var(--font-bold);font-size:20px}
.clone-page a{color:var(--blue)}
.clone-page input[type=text],.clone-page input[type=search],.clone-page input[type=email],.clone-page input[type=password],.clone-page textarea{padding:10px 12px;border:1px solid var(--low-grey);border-radius:4px;font-size:14px;font-family:var(--font-regular)}
.clone-page button,.clone-page input[type=submit]{background:var(--red);color:#fff;border:0;border-radius:4px;padding:10px 22px;font-family:var(--font-bold);font-size:14px;cursor:pointer}
.clone-page .search-form{display:flex;gap:8px;margin:16px 0}
.clone-page .search-form input[type=search]{flex:1;max-width:420px}

/* breadcrumb WooCommerce disattivato: usiamo markup clone.
   classi helper comuni */
.darty-stars{display:inline-flex;gap:2px;align-items:center}
.darty-stars svg{display:inline-block;vertical-align:middle}

/* sticky anchors: non sticky sotto i 900px (come da comportamento clone semplificato) */
@media (max-width:900px){.sticky_ctas{position:static}}

/* responsive clone (breakpoint originale) */
@media (max-width:900px){.clone-hero{grid-template-columns:1fr}}

/* Logo header: il PNG sorgente (1280x720) contiene il cerchio DARTY a destra,
   cover + right lo ritaglia perfettamente nel box 48x48 */
.header .logo .picto{width:48px !important;height:48px !important;object-fit:cover;object-position:right center;border-radius:6px}

/* ================================================================
   Mega-menu Rayons: pannello sottocategorie al passaggio del mouse
   (comportamento di darty.com: hover su universo -> pannello a destra)
   ================================================================ */
.nav .menu-btn .menu{min-width:280px}
.nav .menu-btn .menu .universe{position:relative}
.nav .menu-btn .menu .universe.has-submenu>.universe-link:after{content:"";display:inline-block;margin-left:auto;width:8px;height:8px;border-right:2px solid var(--mid-grey);border-bottom:2px solid var(--mid-grey);transform:rotate(-45deg)}
.nav .menu-btn .menu .universe.has-submenu>.universe-link{display:flex;align-items:center;gap:8px}
.nav .menu-btn .menu .universe.has-submenu:hover>.universe-link{color:var(--blue)}
.submenu-panel{display:none;position:absolute;left:100%;top:0;min-width:340px;max-width:480px;background:var(--white);border-radius:0 8px 8px 8px;box-shadow:0 8px 24px rgba(69,69,69,.18),0 0 2px rgba(69,69,69,.14);padding:18px 22px;z-index:60}
.nav .menu-btn .menu .universe:hover>.submenu-panel{display:block}
.submenu-panel .submenu-title{font-family:var(--font-bold);font-size:15px;color:var(--black);margin:0 0 10px;text-transform:uppercase}
.submenu-panel .submenu-list{list-style:none;margin:0;padding:0;columns:2;column-gap:28px}
.submenu-panel .submenu-item{margin:0;padding:0;break-inside:avoid}
.submenu-panel .submenu-link{display:block;padding:6px 0;color:var(--dark-grey);text-decoration:none;font-size:14px;line-height:1.3}
.submenu-panel .submenu-link:hover{color:var(--blue);text-decoration:underline}
.submenu-panel .submenu-all{display:inline-block;margin-top:12px;color:var(--blue);font-family:var(--font-bold);font-size:13px;text-decoration:underline}
@media (max-width:900px){.submenu-panel{display:none!important}}

/* ================================================================
   Catalogo / ricerca: integrazioni al bundle products_list originale
   ================================================================ */

/* dropdown "Trier par": apertura via JS (.js-open) */
.sort-list{position:relative;cursor:pointer}
.sort-list .sort-options{display:none;position:absolute;right:0;top:100%;margin-top:4px;background:var(--white);border-radius:8px;box-shadow:0 8px 24px rgba(69,69,69,.18),0 0 2px rgba(69,69,69,.14);list-style:none;padding:8px 0;min-width:200px;z-index:50}
.sort-list.js-open .sort-options{display:block}
.sort-list .sort-options .item{display:block;padding:9px 16px;color:var(--dark-grey);text-decoration:none;font-size:14px;white-space:nowrap}
.sort-list .sort-options .item:hover{background:var(--light-grey);color:var(--blue)}

/* toggle filtri attivi (Promotions ecc.) */
.filters .toggle .link.selected .label{font-family:var(--font-bold)}
.filters .toggle .link.selected:after{content:"";position:absolute;inset:6px auto auto 6px;width:10px;height:10px;border-radius:50%;background:var(--red)}
.filters .toggle .link{position:relative}

/* checkbox selezionata nei gruppi filtri */
.filters .target.selected .checkbox{border-color:var(--blue);background:var(--blue);box-shadow:inset 0 0 0 2px var(--white)}
.filters .target.selected .text{font-family:var(--font-bold)}

/* form prezzo min/max */
.darty-price-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.darty-price-form .range-value{flex:1;min-width:90px}
.darty-price-form .range-input{width:100%;padding:8px 10px;border:1px solid var(--low-grey);border-radius:4px;font-size:14px;font-family:var(--font-regular);box-sizing:border-box}
.darty-price-form .darty-price-submit{padding:8px 16px;border:1px solid var(--blue);border-radius:4px;color:var(--blue);background:var(--white);cursor:pointer;font-size:13px}
.darty-price-form .darty-price-submit:hover{background:var(--blue);color:#fff}
.darty-price-form .darty-price-submit .cta-content{display:block}

/* riga prodotto: immagine contenuta + centrata (le foto WC sono quadrate) */
.product-list .product .picture-wrapper .picture{max-width:100%;max-height:230px;width:auto;height:auto;object-fit:contain;margin:0 auto;display:block}
.product-list .product .column.center .reference{color:inherit}

/* stelline rating in riga */
.product-list .product .rating .link{display:flex;align-items:center;gap:4px;text-decoration:none}
.product-list .product .rating .score{display:inline-flex;gap:2px}
.product-list .product .rating .average,.product-list .product .rating .count{font-size:13px;color:var(--dark-grey)}

/* CTA secondaria "Voir le produit" */
.product-list .product .tw-brand_secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;text-align:center}

/* nessun risultato */
.product-list .no-results{background:var(--white);border-radius:8px;padding:32px;font-size:15px;color:var(--dark-grey)}

/* freccia "next" della paginazione (il bundle originale usa un'icona via font/JS) */
.pagination .link.control.next:after{content:"›";font-size:20px;line-height:1}

/* i prodotti variabili non hanno ajax add_to_cart: il bottone resta un link pieno */
.product-list .product .add_to_cart_button.added{display:none}
.product-list .product .added_to_cart{color:var(--green);font-size:13px;text-decoration:underline}

/* la regola generica dei bottoni WC non deve toccare l'header (geoloc ecc.) */
.woocommerce .header button.button,.woocommerce .header a.button{background:transparent;color:var(--dark-grey);padding:0 10px;border-radius:0}
.woocommerce .header button.button:hover{background:transparent;color:var(--blue)}

/* ================================================================
   Mobile (<=900px) — layer responsive completo del clone.
   Obiettivo: zero overflow orizzontale, filtri in drawer,
   header compatto, footer impilato. Come darty.com mobile.
   ================================================================ */

/* desktop: i controlli mobile restano nascosti */
.filter-open-btn,.filters-overlay,.filters-drawer-head{display:none}

@media (max-width:900px){

/* ---------- header compatto ---------- */
.header{padding:8px 12px}
.header .row{flex-wrap:wrap;gap:8px;align-items:center}
.header .logo{flex:none}
.header .logo .picto{width:36px !important;height:36px !important;min-width:36px}
.header .user-menu{margin-left:auto;gap:2px}
.header .user-menu .item{padding:2px 4px;border:0}
.header .user-menu .label{display:none}                 /* solo icone */
.header .user-menu .item:has(.link.help),
.header .user-menu .item:has(.geoloc){display:none}     /* help + geoloc fuori su mobile */
.header .searchbar{order:3;width:100%;margin:4px 0 0}
.header .searchbar .form{width:100%}
.header .searchbar .input{width:100%;box-sizing:border-box}
.nav{margin-top:6px}
.nav .list{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
.nav .list::-webkit-scrollbar{display:none}
.nav .list .item{flex:none}

/* ---------- catalogo: barra sticky Filtrer/Trier + drawer ---------- */
.top-filters{position:sticky;top:0;z-index:60;background:var(--white)}
.top-filters .wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filter-open-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1;padding:10px 14px;border:1px solid var(--blue);border-radius:24px;background:var(--white);color:var(--blue);font-family:var(--font-bold);font-size:14px;cursor:pointer}
.filter-open-btn:before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("assets/img/dots.293cad8c.18ddc2f2.svg") center/contain no-repeat;mask:url("assets/img/dots.293cad8c.18ddc2f2.svg") center/contain no-repeat}
.top-filters .result-count{order:3;flex:1 1 100%;font-size:12px;color:var(--mid-grey)}
.top-filters .sort-area{margin-left:auto;flex:none;max-width:55%}
.top-filters .sort-list{text-align:right}
.top-filters .sort-value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.list-container{flex-direction:column}
.filters-container{position:fixed;top:0;left:0;bottom:0;width:88%;max-width:360px;background:var(--white);z-index:1200;transform:translateX(-105%);transition:transform .25s ease;overflow-y:auto;padding:0 0 32px;margin:0;box-shadow:2px 0 16px rgba(0,0,0,.2)}
body.filters-open .filters-container{transform:none}
.filters-overlay{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.45);z-index:1190;opacity:0;visibility:hidden;transition:opacity .25s}
body.filters-open .filters-overlay{opacity:1;visibility:visible}
.filters-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--low-grey);position:sticky;top:0;background:var(--white);z-index:2}
.filters-drawer-head .title{font-family:var(--font-bold);font-size:16px}
.filters-close{width:32px;height:32px;border:0;background:transparent;cursor:pointer;position:relative}
.filters-close:before,.filters-close:after{content:"";position:absolute;top:50%;left:50%;width:18px;height:2px;background:var(--dark-grey)}
.filters-close:before{transform:translate(-50%,-50%) rotate(45deg)}
.filters-close:after{transform:translate(-50%,-50%) rotate(-45deg)}
.filters-container .filters{padding:0 16px}
.product-list{width:100%}

/* riga prodotto compatta: da grid a flex impilabile */
.list-container,.product-list{max-width:100%}
.product-list .product{display:flex !important;flex-wrap:wrap;max-width:100%;box-sizing:border-box}
.product-list .product .column.left{flex:0 0 84px;box-sizing:border-box;padding:8px}
.product-list .product .picture-wrapper{width:84px;height:84px}
.product-list .product .column.center{flex:1 1 0;min-width:0;box-sizing:border-box}
.product-list .product .column.center *{max-width:100%}
.product-list .product .column.right{flex:1 1 100%;flex-direction:row !important;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px 0}
.product-list .product .price_product{font-size:20px}
.product-list .product .column.right .cta-clean{padding:10px 18px}

/* barra CTA sticky + anchors: larghezza piena */
.sticky_ctas{width:100% !important;left:0;right:0}
.page-product .anchors{max-width:100%;overflow-x:auto}

/* ---------- pagina prodotto ---------- */
.page-product .product-section{grid-template-columns:1fr !important;grid-column-gap:0;padding-top:12px}
.page-product .product-body{grid-template-columns:1fr !important;grid-column-gap:0}
.page-product .product-column,.page-product .body-column{min-width:0;width:100%}
.main.page-product .content,
.main.page-product .product-cols,
.main.page-product .clone-grid-2{grid-template-columns:1fr !important;flex-direction:column}
.main.page-product .buybox{width:100% !important;margin:12px 0}
.main.page-product .product-pictures .main-picture{height:300px}
.main.page-product .product-pictures .viewer .list{flex-wrap:nowrap;overflow-x:auto}
.main.page-product .list-characteristics{width:100%;overflow-x:auto}
.main.page-product .list-characteristics table{width:100%;min-width:0}
.main.page-product .anchors .list{overflow-x:auto;flex-wrap:nowrap}

/* ---------- carrello / checkout / account ---------- */
.woocommerce table.shop_table{display:block;overflow-x:auto}
.woocommerce-cart .cart-collaterals .cart_totals{width:100%}

/* ---------- footer ---------- */
.footer .seo{grid-template-columns:1fr 1fr;grid-auto-flow:row;gap:0 16px;padding:20px 16px 28px}
.footer .seo .list{margin-bottom:18px}
.reinsurances .list{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;gap:24px;padding:0 16px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.reinsurances .list::-webkit-scrollbar{display:none}
.reinsurances .item{flex:none}
.clone-footer-bottom .cfb-grid{grid-template-columns:1fr;gap:20px}
.clone-footer-legal{flex-direction:column;align-items:flex-start;gap:8px}
.clone-footer-legal .cfl-links a{margin-left:0;margin-right:14px}

/* ---------- pagine di servizio ---------- */
.clone-page{padding:0 16px}

/* ---------- home ---------- */
.clone-univers-grid{grid-template-columns:repeat(2,1fr) !important;gap:10px}
}

/* FIX RADICE mobile: il bundle desktop fissa .site-wrapper a 1024px */
@media (max-width:900px){
	.site-wrapper{width:100% !important;padding:0 12px}
	.header .row{height:auto}
	.main{max-width:100%}
}

/* ================================================================
   PDP — replica darty.com live: hero 3 colonne, buybox ricca,
   varianti tile colore, specs 2 colonne + expander, avis 2 colonne,
   chips categorie, recherches associées, barra acquisto mobile
   ================================================================ */

/* --- galleria: thumbs uniformi 72x72 + tile "+N autres" --- */
.product-pictures .viewer{flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin-left:0}
.product-pictures .viewer .item{width:72px;height:72px;flex:none;border:2px solid var(--border-grey);border-radius:8px;background:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;box-sizing:border-box;padding:4px;margin:0}
.product-pictures .viewer .item img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.product-pictures .viewer .item.js-active{border-color:var(--blue)}
.product-pictures .viewer .item-more{color:var(--blue);font-family:var(--font-bold);font-size:13px;text-align:center}
.product-pictures .viewer .item-extra{display:none}
.product-pictures .viewer.expanded .item-extra{display:flex}
.product-pictures .viewer.expanded .item-more{display:none}

/* --- azioni sotto galleria: comparateur + wishlist --- */
.gallery-actions{display:flex;gap:24px;align-items:center;margin:4px 0 8px;flex-wrap:wrap}
.ga-btn{display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;color:var(--dark-grey);font-family:var(--font-regular);font-size:14px;padding:6px 0}
.ga-btn .ga-check{width:18px;height:18px;border:2px solid var(--low-grey);border-radius:3px;display:inline-block;box-sizing:border-box;background:var(--white)}
.ga-btn[aria-pressed="true"] .ga-check{border-color:var(--blue);background:var(--blue);box-shadow:inset 0 0 0 2px var(--white)}
.ga-btn svg{color:var(--dark-grey)}
.ga-btn[aria-pressed="true"] svg{color:var(--red);fill:var(--red)}
.ga-btn:hover{color:var(--blue)}

/* --- varianti: pill rettangolari darty + tile colore --- */
.clone-variant-btn{border-radius:8px;min-width:64px;text-align:center;padding:8px 18px;position:relative}
.clone-variant-btn.disabled{background:var(--white);color:var(--soft-grey)}
.clone-variant-btn.disabled:after{content:"";position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--disabled)}
.variant-more-options{display:flex;align-items:center;gap:8px;color:var(--mid-grey);font-size:13px;margin:18px 0 4px}
.variant-more-options .dot{width:8px;height:8px;border-radius:50%;background:var(--soft-grey);display:inline-block}
.variant-opts-tiles{gap:12px}
.clone-variant-btn.variant-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 12px;min-width:88px;border-radius:12px;height:auto}
.clone-variant-btn.variant-tile .tile-img{width:56px;height:56px;display:flex;align-items:center;justify-content:center}
.clone-variant-btn.variant-tile .tile-img img{max-width:100%;max-height:56px;object-fit:contain;width:auto;height:auto}
.clone-variant-btn.variant-tile .tile-label{font-size:13px}
span.clone-variant-btn.variant-tile{cursor:not-allowed}

/* --- buybox ricca --- */
@media (min-width:901px){.page-product .buybox{position:sticky;top:90px;align-self:start}}
.pdp-soldby{font-size:13px;color:var(--dark-grey);margin:0 0 6px}
.pdp-soldby span{color:var(--red);font-family:var(--font-bold)}
.buybox .prices-container .price{color:var(--black)}
.buybox .prices-container .price.discounted{color:var(--red)}
.buybox .prices-container .price del{color:var(--mid-grey);font-size:18px;font-weight:400;margin-right:8px}
.buybox .prices-container .price ins{color:var(--red);text-decoration:none}
.pdp-monthly{display:inline-block;background:var(--light-grey);border-radius:16px;padding:6px 14px;font-size:14px;color:var(--dark-grey);margin:2px 0 10px}
.pdp-stock-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0 4px;flex-wrap:wrap}
.pdp-stock{display:inline-flex;align-items:center;gap:8px;font-size:14px;margin:0}
.pdp-stock .stock-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.pdp-stock.in .stock-dot{background:var(--green)}
.pdp-stock.out .stock-dot{background:var(--red)}
.pdp-stock-link{color:var(--dark-grey);font-size:13px;text-decoration:underline}
.pdp-stock-link:hover{color:var(--blue)}
.pdp-cta-store{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;box-sizing:border-box;margin-top:10px;padding:12px 16px;background:var(--black);color:#fff;border-radius:24px;font-family:var(--font-bold);font-size:15px;text-decoration:none}
.pdp-cta-store:hover{background:var(--black-hover);color:#fff}
.pdp-services{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--border-grey)}
.pdp-services li{margin:0 0 6px}
.pdp-services a{color:var(--dark-grey);font-size:13px;text-decoration:none;padding-left:18px;position:relative}
.pdp-services a:before{content:"";position:absolute;left:0;top:4px;width:9px;height:5px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.pdp-services a:hover{color:var(--blue);text-decoration:underline}

/* --- caratteristiche: card points forts a lato + expander --- */
.pdp-specs .specs-side{flex:none;width:340px;max-width:100%}
.specs-side-card{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:20px}
.specs-side-title{font-family:var(--font-bold);font-size:16px;margin:0 0 10px;color:var(--black)}
.specs-side-list{list-style:none;margin:0;padding:0}
.specs-side-list li{position:relative;padding-left:16px;font-size:14px;margin-bottom:8px;color:var(--dark-grey)}
.specs-side-list li:before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.pdp-specs.is-collapsed .list-characteristics .row-characteristic:nth-child(n+9){display:none}
.pdp-specs.expanded .list-characteristics .row-characteristic{display:grid}
.pdp-expander{display:flex;align-items:center;gap:6px;margin:14px auto 4px;background:none;border:0;color:var(--blue);font-family:var(--font-bold);font-size:14px;cursor:pointer;padding:6px 12px}
.pdp-expander:hover{text-decoration:underline}
.pdp-expander .exp-less{display:none}
.pdp-specs.expanded .pdp-expander .exp-more{display:none}
.pdp-specs.expanded .pdp-expander .exp-less{display:inline}
.pdp-expander svg{transition:transform .2s}
.pdp-specs.expanded .pdp-expander svg{transform:rotate(180deg)}

/* --- description 2 colonne --- */
.pdp-description .desc-card{background:var(--white);padding:24px;border-radius:8px}
@media (min-width:901px){.pdp-description .desc-cols{columns:2;column-gap:40px}}
.pdp-description .desc-cols p{font-size:14px;line-height:1.6}

/* --- avis clients 2 colonne --- */
.avis-grid{display:grid;grid-template-columns:300px 1fr;gap:24px;align-items:start}
.avis-summary-card{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:24px;text-align:center}
.avis-label{font-size:13px;color:var(--mid-grey);margin:0 0 8px}
.avis-big{font-family:var(--font-bold);font-size:44px;color:var(--black);margin:0}
.avis-big .avis-of{font-size:20px;color:var(--mid-grey)}
.avis-stars{display:flex;justify-content:center;margin:6px 0}
.avis-count{font-size:13px;color:var(--mid-grey);margin:0 0 10px}
.avis-reco{font-size:14px;margin:0 0 14px}
.avis-dist{text-align:left;margin:0 0 14px}
.avis-dist-row{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mid-grey);margin-bottom:4px}
.avis-dist-star{width:10px;text-align:right}
.avis-dist-bar{flex:1;height:6px;border-radius:3px;background:var(--border-grey);overflow:hidden}
.avis-dist-fill{display:block;height:100%;background:#ffd700;border-radius:3px}
.avis-dist-n{width:18px;text-align:right}
.avis-auth{font-size:12px;color:var(--mid-grey);margin:0;border-top:1px solid var(--border-grey);padding-top:12px}
.avis-blue-card{display:flex;align-items:center;gap:10px;border:2px solid var(--blue);border-radius:8px;background:var(--white);padding:12px 18px;margin-bottom:16px;font-size:14px;flex-wrap:wrap}
.avis-blue-card .abc-label{color:var(--blue);font-family:var(--font-bold)}
.avis-blue-card .abc-rating{display:inline-flex;align-items:center;gap:4px}
.avis-blue-card .abc-count{margin-left:auto;color:var(--mid-grey);font-size:13px}
.avis-card{background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:18px 20px;margin-bottom:12px}
.avis-card-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.avis-card-rating{display:inline-flex;align-items:center;gap:4px;font-size:15px}
.avis-card-rating strong{font-family:var(--font-bold)}
.avis-card-rating .avis-of{color:var(--mid-grey);font-size:12px}
.avis-card .review-meta{color:var(--mid-grey);font-size:12px;margin:0}
.avis-card .review-title{font-family:var(--font-bold);font-size:15px;margin:6px 0 4px}
.avis-card .review-text{font-size:14px;line-height:1.5;margin:6px 0}
.avis-card .review-signal{font-size:12px;color:var(--mid-grey);text-decoration:underline;display:inline-block;margin-top:8px}
.pdp-avis .avis-extra{display:none}
.pdp-avis.expanded .avis-extra{display:block}
.pdp-avis .avis-expander{border:1px solid var(--blue);border-radius:24px;padding:10px 24px;margin:8px auto}

/* --- chips "Toutes les catégories" --- */
.pdp-cats{margin-top:32px}
.pdp-chips{display:flex;gap:12px;overflow-x:auto;padding:8px 2px 16px;scrollbar-width:none}
.pdp-chips::-webkit-scrollbar{display:none}
.pdp-chip{flex:none;width:130px;background:var(--white);border-radius:8px;box-shadow:0 2px 4px rgba(69,69,69,.08),0 0 2px rgba(69,69,69,.14);padding:12px;text-align:center;text-decoration:none;color:var(--dark-grey);box-sizing:border-box}
.pdp-chip:hover{box-shadow:0 4px 10px rgba(69,69,69,.18)}
.pdp-chip .chip-img{display:flex;height:72px;align-items:center;justify-content:center;margin-bottom:8px}
.pdp-chip .chip-img img{max-width:100%;max-height:72px;width:auto;height:auto;object-fit:contain}
.pdp-chip .chip-name{font-size:13px;font-family:var(--font-bold);line-height:1.25;display:block}

/* --- recherches associées --- */
.pdp-recherches{margin-top:24px}
.rech-list{list-style:none;margin:0;padding:16px 20px;background:var(--white);border-radius:8px;columns:3;column-gap:32px}
.rech-list li{break-inside:avoid;margin-bottom:8px}
.rech-list a{color:var(--dark-grey);text-decoration:none;font-size:14px}
.rech-list a:hover{color:var(--blue);text-decoration:underline}

/* --- barra acquisto sticky mobile --- */
.pdp-mobile-bar{display:none}
@media (max-width:900px){
	.pdp-mobile-bar{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:1100;background:var(--white);box-shadow:0 -2px 10px rgba(0,0,0,.15);padding:10px 14px}
	.pdp-mobile-bar .mb-img{width:40px;height:40px;object-fit:contain;flex:none}
	.pdp-mobile-bar .mb-price{font-family:var(--font-bold);font-size:18px;color:var(--black);white-space:nowrap}
	.pdp-mobile-bar .mb-cta{margin-left:auto;display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;border:0;border-radius:24px;padding:10px 22px;font-family:var(--font-bold);font-size:15px;cursor:pointer}
	body{padding-bottom:64px}
	.avis-grid{grid-template-columns:1fr}
	.pdp-specs .characteristics-wrap{flex-direction:column}
	.pdp-specs .specs-side{width:100%}
	.rech-list{columns:1}
	.gallery-actions{gap:16px}
	.main.page-product .buybox{width:100% !important;box-sizing:border-box}
	.main.page-product .product-pictures .viewer{flex-wrap:wrap;overflow-x:visible}
	.main.page-product .list-characteristics .row-characteristic{grid-template-columns:1fr;gap:4px;margin:0 16px;padding:14px 0}
}

/* FIX overflow mobile PDP: le sezioni full-bleed del bundle usano margin -16px,
   ma il wrapper su mobile ha padding 12px -> -12px le porta a filo viewport */
@media (max-width:900px){
	.header,.footer,.surheader{margin-left:-12px !important;margin-right:-12px !important}
	.main.page-product .main-product{margin-left:-12px;margin-right:-12px}
	.pdp-mobile-bar{box-sizing:border-box}
}

/* pallino colore nelle tile variante quando le foto variazione non sono distintive */
.clone-variant-btn.variant-tile .tile-swatch{width:28px;height:28px;border-radius:50%;display:inline-block;border:1px solid var(--low-grey);box-sizing:border-box}

/* ================================================================
   MOBILE POLISH (<=768px) — header compatto, home riorganizzata,
   una sola fonte carrello (header -> slide cart FunnelKit)
   ================================================================ */
@media (max-width:768px){
	/* --- header: riga 1 = logo + panier; riga 2 = search full-width --- */
	.header .row{display:flex !important;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 12px !important}
	.header .logo{flex:none}
	.header .logo .picto{width:40px !important;height:40px !important;min-width:40px !important}
	.header .user-menu{margin:0 0 0 auto !important;padding:0;display:flex !important;align-items:center;list-style:none}
	.header .user-menu .item{margin:0}
	.header .user-menu .help,.header .user-menu .geoloc{display:none !important}
	.header .user-menu .basket .label{display:none}
	.header .searchbar{order:3;flex:1 0 100%;width:100%;margin:4px 0 0 !important}
	.header .searchbar .form{display:flex;width:100%}
	.header .searchbar .input{flex:1;min-width:0;font-size:16px} /* 16px: niente zoom iOS */
	/* --- sezioni home --- */
	.clone-section-title{font-size:20px;margin:22px 0 10px}
	/* Nos univers: 2 colonne compatte come darty mobile */
	.clone-univers-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px;margin:10px 0 20px}
	.clone-univers-card .uc-img{height:110px;padding:8px}
	.clone-univers-card .uc-img img{max-height:94px}
	.clone-univers-card .uc-name{font-size:13px;padding:8px 10px;line-height:1.25}
	/* hero compatta */
	.clone-hero{padding:18px;gap:16px;margin:12px 0 20px}
	.clone-hero .hero-img img{max-height:180px}
	.clone-hero .hero-title{font-size:20px}
	.clone-hero .hero-price{font-size:24px}
	/* Nos meilleures ventes: 2 colonne compatte */
	.clone-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px;margin:10px 0 20px}
	.clone-grid .tw-product_box{padding:8px !important}
	.clone-grid .tw-product_box .tw-button{font-size:12px !important;padding:8px 6px !important}
	.clone-grid .tw-product_box p[class*=tw-title]{font-size:16px !important}
	.clone-grid .tw-product_box a[class*=title],.clone-grid .tw-product_box .product-title{font-size:12px;line-height:1.3}
	/* niente bolla flottante FunnelKit su mobile: il carrello si apre
	   dall'icona Panier in header (il click JS funziona anche da nascosta) */
	.fkcart-floating-icon,#fkcart-floating-toggler{display:none !important}
	/* footer piu' compatto */
	.clone-footer-bottom{padding:24px 16px}
	.clone-footer-bottom .cfb-grid{grid-template-columns:1fr 1fr;gap:18px}
	.clone-footer-bottom .cfb-title{font-size:13px}
	.clone-footer-bottom .cfb-text{font-size:12px}
}

/* ================================================================
   MOBILE (<=768px) — card categoria compatte: via punti forti,
   doppio bottone e comparatore (ridondanti su schermo piccolo)
   ================================================================ */
@media (max-width:768px){
	.product-list .product .points{display:none}
	.product-list .product .tw-brand_secondary{display:none}
	.product-list .product .button-comparator{display:none}
	.product-list .product{padding:10px 0}
	.product-list .product .column.right{padding:8px 12px 0}
	.product-list .product .price_product{font-size:18px}
	.product-list .product .seller{font-size:11px}
	.product-list .product .column.center .link, .product-list .product .column.center .title{font-size:14px;line-height:1.3}
	/* paginazione compatta */
	.pagination{flex-wrap:wrap;gap:6px;justify-content:center}
}

/* ================================================================
   MOBILE MENU DRAWER + header sticky (<=768px)
   ================================================================ */
.burger-btn{display:none}
.mnav,.mnav-overlay{display:none}

@media (max-width:768px){
	/* header sempre visibile: burger + logo + panier / search */
	.header{position:sticky;top:0;z-index:200;background:var(--white);box-shadow:0 1px 6px rgba(69,69,69,.12)}
	.header .nav{display:none} /* il menu mobile e' il drawer */
	.header .row{gap:10px}
	.burger-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;padding:9px;border:0;background:transparent;cursor:pointer;flex:none}
	.burger-btn span{display:block;width:100%;height:2px;background:var(--dark-grey);border-radius:2px;transition:transform .2s,opacity .2s}
	body.mnav-open .burger-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
	body.mnav-open .burger-btn span:nth-child(2){opacity:0}
	body.mnav-open .burger-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

	/* drawer */
	.mnav{display:block;position:fixed;top:0;left:0;bottom:0;width:88%;max-width:340px;background:var(--white);z-index:1300;transform:translateX(-105%);transition:transform .25s ease;overflow-y:auto;box-shadow:2px 0 16px rgba(0,0,0,.2)}
	body.mnav-open .mnav{transform:none}
	.mnav-overlay{display:block;position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.45);z-index:1290;opacity:0;visibility:hidden;transition:opacity .25s}
	body.mnav-open .mnav-overlay{opacity:1;visibility:visible}
	body.mnav-open{overflow:hidden}
	.mnav-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--low-grey);position:sticky;top:0;background:var(--white);z-index:2}
	.mnav-title{font-family:var(--font-bold);font-size:17px}
	.mnav-close{width:32px;height:32px;border:0;background:transparent;cursor:pointer;position:relative}
	.mnav-close:before,.mnav-close:after{content:"";position:absolute;top:50%;left:50%;width:18px;height:2px;background:var(--dark-grey)}
	.mnav-close:before{transform:translate(-50%,-50%) rotate(45deg)}
	.mnav-close:after{transform:translate(-50%,-50%) rotate(-45deg)}
	.mnav-list{list-style:none;margin:0;padding:0}
	.mnav-item{border-bottom:1px solid var(--light-grey)}
	.mnav-row{display:flex;align-items:center;justify-content:space-between}
	.mnav-link{display:block;flex:1;padding:14px 16px;font-family:var(--font-bold);font-size:15px;color:var(--dark-grey);text-decoration:none}
	.mnav-link:active{background:var(--light-grey)}
	.mnav-chev{width:44px;height:44px;border:0;background:transparent;cursor:pointer;position:relative;flex:none}
	.mnav-chev:before{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;border-right:2px solid var(--mid-grey);border-bottom:2px solid var(--mid-grey);transform:translate(-50%,-60%) rotate(45deg);transition:transform .2s}
	.mnav-item.open .mnav-chev:before{transform:translate(-50%,-40%) rotate(-135deg)}
	.mnav-sub{display:none;list-style:none;margin:0;padding:0 0 8px;background:var(--light-grey)}
	.mnav-item.open .mnav-sub{display:block}
	.mnav-sub-link{display:block;padding:10px 16px 10px 28px;font-size:14px;color:var(--dark-grey);text-decoration:none}
	.mnav-sub-link:active{background:var(--low-grey)}
	.mnav-all{font-family:var(--font-bold);color:var(--blue)}
	.mnav-extra{border-top:4px solid var(--light-grey);padding:8px 0 24px}
	.mnav-extra .mnav-link{font-family:var(--font-regular)}
}