/* ======================================================================== */
/* PENTA PROJECTS - CUSTOM CSS MASTER                   */
/* ======================================================================== */
/* Indice:
   1. Globali, Utility e Fix Template
   2. Header, Ricerca e MegaMenu
   3. J2Store: Griglia Prodotti e Dettaglio
   4. J2Store: Carrello (Desktop & Mobile)
   5. J2Store: Checkout
   6. Utenti: Login e Registrazione
   7. Pagine Custom (Apple Hero, Lampada, Chi Siamo)
   8. Footer
   9. Privacy e Cookie (n3t Consent)
=========================================================================== */

/* ======================================================================== */
/* 1. GLOBALI, UTILITY E FIX TEMPLATE                                       */
/* ======================================================================== */
html, body { overflow-x: hidden; margin: 0; padding: 0; width: 100%; }
td { position: relative; }
.form-text { display: none; }
input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
#back-to-top i { color: #fff; line-height: 1.5rem; }
joomla-alert { border-radius: 15px !important; border: none !important; box-shadow: 0 5px 20px rgba(0,0,0,0.05) !important; overflow: hidden; margin-bottom: 30px; display: block; }
.inputbox { max-width: 240px; display: block; width: 100%; padding: 0.4375rem 1.5rem; font-size: 1rem; color: var(--body-text-color); background-color: var(--body-bg-color); background-clip: padding-box; border: 1px solid var(--tpl-base-200); border-radius: 0.25rem; appearance: none; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
.inputbox:focus { border-color: var(--tpl-base-500); box-shadow: 0 0 0 0.25rem rgba(0, 123, 255, 0.25); }
#remember.form-check-input.inputbox { padding: 0 !important; }
.form-check-input[type=checkbox], .contact .email-copy > input[type=checkbox] { border-radius: 0.25em; width: 16px !important; height: 16px !important; display: inline-block; vertical-align: middle; }
.highlight, mark.highlight, .awesomplete mark { background: transparent !important; color: inherit !important; font-weight: bold !important; padding: 0 !important; }

/* Blocchi info generici */
.dsp-table { display: flex; justify-content: space-between; align-items: center; width: 100%; }
.dsp-cell { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 33%; min-width: 280px; }
.icon-left { margin-bottom: 10px; width: 50px; height: auto; }
.txt { display: flex; flex-direction: column; align-items: center; }
.txt strong { font-size: 16px; font-weight: bold; }
.txt p { margin: 5px 0 0; font-size: 14px; color: #666; }


/* ======================================================================== */
/* 2. HEADER, RICERCA E MEGAMENU                                            */
/* ======================================================================== */

.t4-module#Mod194 { order: 1; } 
.t4-module#Mod195 { order: 2; }
.header-top .text-center img { margin-left: 25px !important; }
.t4-header-r { display: flex; align-items: center; gap: 15px; }

/* Ricerca Custom Penta */
.custom-search-input { border: 1px solid #ced4da; border-right: none; border-radius: 20px 0 0 20px !important; padding-left: 15px; }
.custom-search-input:focus { border-color: #9b85c5; }
.custom-search-btn { background-color: transparent; border: 1px solid #ced4da; border-left: none; color: #9b85c5; border-radius: 0 20px 20px 0 !important; padding-right: 15px; }
.custom-search-input:focus + .custom-search-btn { border-color: #9b85c5; }
.custom-search-btn:hover { background-color: #9b85c5; color: #ffffff; border-color: #9b85c5; }
.penta-search-module .d-md-none button.text-dark { color: #9b85c5 !important; transition: color 0.3s ease; }
.penta-search-module .d-md-none button.text-dark:active, .penta-search-module .d-md-none button.text-dark:focus { color: #7a63a5 !important; }
/* Ricerca Custom Penta */
.custom-search-input { 
    border: 2px solid #efe8f5 !important; 
    border-right: none !important; 
    border-radius: 30px 0 0 30px !important; /* Arrotondamento a pillola */
    padding: 10px 20px !important; 
    font-size: 0.95rem !important; 
    background-color: #faf8fc !important; /* Sfondo lilla chiarissimo a riposo */
    color: #495057 !important; 
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; 
    height: 48px !important; 
    box-shadow: none !important; 
}
.custom-search-input:focus { 
    border-color: #9b85c5 !important; 
    background-color: #ffffff !important; /* Diventa bianco puro quando scrivi */
    outline: none !important; 
}
.custom-search-btn { 
    background-color: #faf8fc !important; 
    border: 2px solid #efe8f5 !important; 
    border-left: none !important; 
    color: #9b85c5 !important; 
    border-radius: 0 30px 30px 0 !important; 
    padding: 0 22px !important; 
    height: 48px !important; 
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; 
}
.custom-search-input:focus + .custom-search-btn { 
    border-color: #9b85c5 !important; 
    background-color: #ffffff !important; 
}
.custom-search-btn:hover { 
    background-color: #9b85c5 !important; 
    color: #ffffff !important; 
    border-color: #9b85c5 !important; 
}

/* Modale/Tendina della ricerca (quando clicchi la lente su Desktop) */
.t4-search .dropdown-menu { 
    border: none !important; 
    border-radius: 20px !important; 
    box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15) !important; 
    padding: 20px !important; 
    min-width: 320px !important; 
    margin-top: 20px !important; 
}

/* Lente di ingrandimento base su Mobile */
.penta-search-module .d-md-none button.text-dark { color: #9b85c5 !important; transition: color 0.3s ease; }
.penta-search-module .d-md-none button.text-dark:active, .penta-search-module .d-md-none button.text-dark:focus { color: #7a63a5 !important; }

/* MegaMenu Principale */
.t4-megamenu .level0 > .nav-item > .nav-link { font-weight: 600 !important; color: #495057 !important; text-transform: uppercase; letter-spacing: 1px; font-size: 0.95rem; padding: 10px 20px !important; transition: color 0.3s ease !important; }
.t4-megamenu .level0 > .nav-item:hover > .nav-link, .t4-megamenu .level0 > .nav-item.active > .nav-link { color: #9b85c5 !important; }
.t4-megamenu .item-caret { margin-left: 8px; transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important; }
.t4-megamenu .nav-item.dropdown:hover .item-caret { transform: rotate(180deg); }
.t4-megamenu .dropdown-menu { border: none !important; border-radius: 20px !important; box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15) !important; background-color: #ffffff !important; padding: 15px !important; min-width: 260px; margin-top: 10px !important; }
.t4-megamenu .dropdown-menu::before { content: ""; position: absolute; top: -15px; left: 0; width: 100%; height: 15px; background: transparent; }
/* 3. Le singole Voci del Sottomenu */
.t4-megamenu .dropdown-item {
    color: #6c757d !important;
    font-weight: 500 !important;
    font-size: 1.05rem;
    padding: 12px 20px !important;
    border-radius: 12px !important;
    /* Evitiamo la regola "all" che fa sfarfallare le transizioni */
    transition: color 0.3s ease, background-color 0.3s ease, transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    background: transparent !important;
    margin-bottom: 5px;
    
    /* FIX ANTI-GLITCH: Fissa il testo per non farlo sembrare grassetto */
    backface-visibility: hidden !important;
    -webkit-font-smoothing: antialiased !important;
    transform: translateZ(0) translateX(0) !important;
}

/* 4. Effetto Hover, Focus e Active sulle Voci (Blindato) */
.t4-megamenu .dropdown-item:hover,
.t4-megamenu .dropdown-item:focus,
.t4-megamenu .dropdown-item:active {
    color: #9b85c5 !important;
    background-color: #faf8fc !important; /* Sfondo lilla chiarissimo */
    transform: translateZ(0) translateX(8px) !important;
    font-weight: 500 !important; /* Mantiene lo stesso esatto peso */
    outline: none !important;
    box-shadow: none !important;
}

/* ======================================================================== */
/* --- STILE ICONA CARRELLO E NOTIFICA (HEADER) --- */
/* ======================================================================== */

/* 1. Il contenitore del link (La "Gabbia" che tiene insieme icona e pallino) */
.j2store-minicart-button .cart-item-info .link {
    display: inline-flex !important;
    position: relative !important; /* FONDAMENTALE per ancorare il pallino */
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 15px !important;
    text-decoration: none !important;
}

/* 2. L'icona del cestino (Colorata di lilla di default) */
.j2store-minicart-button .fa-shopping-basket {
    font-size: 28px !important; 
    color: #9b85c5 !important; /* Modificato da grigio al Lilla Penta */
    margin: 0 !important;
    line-height: 1 !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.j2store-minicart-button .link:hover .fa-shopping-basket {
    transform: scale(1.1) translateY(-2px) !important;
    color: #7a63a5 !important; /* Diventa un lilla leggermente più scuro al passaggio */
}

/* 3. Il Pallino Rosso (Allontanato dall'icona) */
.j2store-minicart-button .cart-item-count {
    position: absolute !important;
    top: -6px !important;  /* Spostato più in alto */
    right: -8px !important; /* Spostato più a destra, per staccarlo dal bordo del cestino */
    background-color: #ff6b6b !important; 
    color: #ffffff !important;
    border-radius: 50% !important; 
    width: 20px !important;
    height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    padding: 0 !important;
    box-shadow: 0 4px 10px rgba(255, 107, 107, 0.4) !important;
    transition: transform 0.3s ease !important;
    z-index: 5 !important;
}

/* ======================================================================== */
/* 3. J2STORE: GRIGLIA PRODOTTI E DETTAGLIO                                 */
/* ======================================================================== */
/* Filtri e Ordinamento */
.j2store-product-list option[value*="sku"], .j2store-product-list option[value*="brand"] { display: none !important; }
#j2store-product-list-container { border-top: 1px solid #ced4da !important; padding-top: 30px !important; margin-top: 10px !important; clear: both !important; }
.j2store-product-list #productFilters { margin-bottom: 10px; padding-bottom: 0px; display: flex; justify-content: flex-end; }
#j2store_sortby { appearance: none; background-color: #ffffff; border: 1px solid #ced4da; border-radius: 30px; padding: 10px 40px 10px 20px; font-size: 0.95rem; color: #495057; cursor: pointer; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02); transition: all 0.3s ease; background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%239b85c5%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: right 15px top 50%; background-size: 12px auto; }
#j2store_sortby:focus, #j2store_sortby:hover { border-color: #9b85c5; box-shadow: 0 4px 15px rgba(155, 133, 197, 0.15); outline: none; }

/* Griglia Singolo Prodotto */
.j2store-single-product { background: #ffffff; border-radius: 20px; padding: 20px; margin-bottom: 30px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); transition: transform 0.3s ease, box-shadow 0.3s ease; border: 1px solid transparent; display: flex; flex-direction: column; height: 100%; text-align: center; }
.j2store-single-product:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); border-color: #efe8f5; }
.j2store-product-images { margin-bottom: 20px; }
.j2store-thumbnail-image img { border-radius: 15px; width: 100%; height: 250px; object-fit: cover; box-shadow: 0 5px 15px rgba(0,0,0,0.08); transition: transform 0.4s ease; }
.j2store-single-product:hover .j2store-thumbnail-image img { transform: scale(1.03); }
.product-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 10px; line-height: 1.3; flex-grow: 1; }
.product-title a { color: #333; text-decoration: none; transition: color 0.2s; }
.product-title a:hover { color: #9b85c5; }
.product-price-container { margin-bottom: 15px; }
.sale-price { font-size: 1.4rem; font-weight: 800; color: #9b85c5; }
.j2store-add-to-cart { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: auto; }
.product-qty input { border: 1px solid #ced4da; border-radius: 30px; padding: 8px 15px; text-align: center; color: #495057; width: 80px !important; font-weight: 600; }
.product-qty input:focus { border-color: #9b85c5; box-shadow: 0 0 0 0.2rem rgba(155, 133, 197, 0.25); outline: none; }
.j2store-cart-button.btn-primary { background-color: #9b85c5 !important; color: #ffffff !important; border: none !important; border-radius: 30px !important; padding: 10px 20px !important; font-weight: 600 !important; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.5px; transition: all 0.3s ease; width: 100%; box-shadow: 0 4px 15px rgba(155, 133, 197, 0.3); }
.j2store-cart-button.btn-primary:hover { background-color: #7a63a5 !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(155, 133, 197, 0.45); }
.cart-action-complete p.text-success { color: #28a745; font-weight: 600; font-size: 0.9rem; margin-bottom: 10px; background: #e6f4ea; padding: 8px; border-radius: 10px; }
.j2store-checkout-link { display: inline-block; color: #9b85c5; font-weight: bold; margin-left: 5px; text-decoration: underline; }

/* Dettaglio Prodotto (Pagina Singola) */
.j2store-single-product.detail { background: #ffffff; border-radius: 20px; padding: 40px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important; margin-top: 20px; margin-bottom: 40px; box-sizing: border-box !important; transform: none !important; transition: none !important; }
.j2store-single-product.detail:hover { transform: none !important; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important; border-color: transparent !important; }
.j2store-single-product.detail .row { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }
.j2store-mainimage { text-align: center; margin-bottom: 20px; width: 100%; }
.j2store-product-main-image { border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.08); max-width: 100%; height: auto; object-fit: contain; margin: 0 auto; cursor: zoom-in !important; }
.j2store-product-additional-images ul.additional-image-list { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; justify-content: center !important; align-items: center !important; gap: 15px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; width: 100% !important; }
.j2store-product-additional-images ul.additional-image-list li { display: block !important; margin: 0 !important; padding: 0 !important; }
.j2store-item-additionalimage-preview { border-radius: 15px !important; box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important; border: 3px solid transparent !important; cursor: zoom-in !important; transition: all 0.3s ease !important; width: 80px !important; height: 80px !important; object-fit: cover !important; }
.j2store-item-additionalimage-preview:hover { border-color: #9b85c5 !important; transform: translateY(-3px) !important; }
.j2store-single-product.detail .product-title { font-size: 2.5rem; font-weight: 800; color: #333; margin-bottom: 20px; line-height: 1.2; }
.j2store-single-product.detail .sale-price { font-size: 2.2rem; color: #9b85c5; font-weight: 800; margin-bottom: 25px; }
.j2store-single-product.detail .j2store-add-to-cart { display: flex; align-items: center; gap: 20px; margin-bottom: 30px; }
.j2store-single-product.detail .product-qty input { width: 90px !important; font-size: 1.2rem; height: 54px; }
.j2store-single-product.detail .j2store-cart-button.btn-primary { padding: 14px 40px !important; font-size: 1.1rem !important; height: 54px; }
.j2store-single-product.detail .nav-tabs { border-bottom: 2px solid #efe8f5 !important; display: flex; gap: 30px; margin-top: 50px; margin-bottom: 30px; }
.j2store-single-product.detail .nav-tabs .nav-link { border: none !important; background: transparent !important; color: #6c757d !important; border-radius: 0 !important; padding: 10px 0 !important; font-weight: 700; font-size: 1.4rem; position: relative; box-shadow: none !important; }
.j2store-single-product.detail .nav-tabs .nav-link.active { color: #9b85c5 !important; }
.j2store-single-product.detail .nav-tabs .nav-link.active::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 100%; height: 3px; background-color: #9b85c5; border-radius: 3px 3px 0 0; }
.j2store-single-product.detail .tab-content { background: #faf8fc; border-radius: 20px; padding: 35px; color: #495057; font-size: 1.15rem; line-height: 1.8; border: 1px solid #efe8f5; }

.zoomImg { display: none !important; }
.j2store-single-product.detail .j2store-mainimage span.zoom { display: inline-block; max-width: 100%; cursor: zoom-in !important; }

/* Tasto Condividi */
.penta-share-btn { background-color: #ffffff !important; color: #9b85c5 !important; border: 2px solid #efe8f5 !important; border-radius: 30px !important; padding: 14px 25px !important; font-size: 1rem !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: 0.5px; cursor: pointer; transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important; height: 54px !important; }
.penta-share-btn:hover { background-color: #faf8fc !important; border-color: #9b85c5 !important; transform: translateY(-2px) !important; box-shadow: 0 8px 20px rgba(155, 133, 197, 0.15) !important; }

/* Lightbox */
#penta-lightbox { display: none; position: fixed; z-index: 999999; left: 0; top: 0; width: 100vw; height: 100vh; background-color: rgba(255, 255, 255, 0.95); backdrop-filter: blur(5px); align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s ease; }
#penta-lightbox.active { display: flex; opacity: 1; }
#penta-lightbox img { max-width: 90vw; max-height: 85vh; border-radius: 20px; box-shadow: 0 25px 60px rgba(155, 133, 197, 0.4); transform: scale(0.9); transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1); object-fit: contain; }
#penta-lightbox.active img { transform: scale(1); }
#penta-lightbox-close { position: absolute; top: 20px; right: 30px; font-size: 50px; font-weight: 300; color: #9b85c5; cursor: pointer; transition: color 0.3s ease, transform 0.3s ease; z-index: 1000000; line-height: 1; }
#penta-lightbox-close:hover { color: #7a63a5; transform: scale(1.1); }

/* Pulsante Indietro */
.j2store-product-back-btn { background-color: transparent !important; border: none !important; color: #6c757d !important; border-radius: 10px; padding: 8px 16px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; position: relative; top: -10px; text-align: center; transition: all 0.3s ease-in-out; }
.j2store-product-back-btn i { display: flex; align-items: center; justify-content: center; }
.j2store-product-back-btn:hover { background-color: transparent !important; color: #6c757d !important; }


/* ======================================================================== */
/* 4. J2STORE: CARRELLO (DESKTOP E MOBILE)                                  */
/* ======================================================================== */
#j2store-cart { max-width: 1100px; margin: 40px auto; background: #ffffff; border-radius: 20px; padding: 40px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); width: 100%; }

/* --- TABELLA CARRELLO MODERNA (Costruita sul tuo HTML a 3 colonne) --- */
.j2store-cart-table { width: 100%; display: block; border: none !important; margin-bottom: 30px; }
.j2store-cart-table thead { display: none !important; }
.j2store-cart-table tbody { display: flex; flex-direction: column; gap: 15px; width: 100%; }

.j2store-cart-table tbody tr { 
    background-color: #faf8fc; border-radius: 20px; transition: transform 0.2s ease, box-shadow 0.2s ease; 
    display: flex; align-items: center; justify-content: space-between; padding: 20px 25px; 
    border: 1px solid #efe8f5; width: 100%; box-sizing: border-box; 
}
.j2store-cart-table tbody tr:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(155, 133, 197, 0.15); border-color: #9b85c5; }
.j2store-cart-table td { border: none !important; padding: 0 !important; display: flex; align-items: center; background: transparent !important; }

/* Colonna 1: Immagine e Testi */
.j2store-cart-table td:nth-child(1) { flex: 1; justify-content: flex-start; gap: 20px; }
.j2store-cart-table td:nth-child(1) br { display: none; } /* Nasconde a capo inutili */
.cart-thumb-image img { border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); width: 85px; height: 85px; object-fit: cover; }
.cart-product-name { color: #333; font-weight: 800; font-size: 1.2rem; text-decoration: none; margin-bottom: 5px; display: block; }
/* Stile del vero link cliccabile del Carrello */
.cart-product-name .penta-cart-link { color: inherit !important; text-decoration: none !important; transition: color 0.3s ease !important; display: block !important; }
.cart-product-name .penta-cart-link:hover { color: #9b85c5 !important; }
.cart-product-unit-price { color: #6c757d; font-size: 0.95rem; font-weight: 500; display: block; }
.cart-item-title { display: none; } /* Nasconde "Prezzo unitario" su PC */
.cart-item-value { font-weight: 700; color: #9b85c5; }

/* Colonna 2: Quantità + Cestino (Ben distanziati!) */
.j2store-cart-table td:nth-child(2) { flex: 0 0 170px; justify-content: flex-end; gap: 25px; }
.product-qty input { width: 65px !important; text-align: center; border-radius: 10px !important; border: 1px solid #ced4da !important; height: 42px; font-weight: bold; color: #495057; margin: 0 !important; }
.product-qty input:focus { border-color: #9b85c5 !important; outline: none; }

/* Il Nuovo Cestino Vettoriale */
.j2store-cart-table a.j2store-remove.btn-danger { 
    background-color: #ffffff !important; border: 2px solid #ff6b6b !important; width: 42px !important; height: 42px !important; min-width: 42px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center; justify-content: center; transition: all 0.3s ease; box-shadow: 0 4px 10px rgba(255, 107, 107, 0.1) !important; text-decoration: none; padding: 0 !important; 
    /* Disegna il cestino rosso */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ff6b6b' d='M135.2 17.7C140.6 6.8 151.7 0 163.8 0H284.2c12.1 0 23.2 6.8 28.6 17.7L320 32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 96 0 81.7 0 64S14.3 32 32 32h96l7.2-14.3zM32 128H416V448c0 35.3-28.7 64-64 64H96c-35.3 0-64-28.7-64-64V128zm96 64c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 16px 16px !important; 
}
.j2store-cart-table a.j2store-remove.btn-danger i { display: none !important; }
.j2store-cart-table a.j2store-remove.btn-danger:hover { 
    background-color: #ff6b6b !important; transform: scale(1.1); box-shadow: 0 8px 15px rgba(255, 107, 107, 0.3) !important; 
    /* Cambia il cestino in bianco */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M135.2 17.7C140.6 6.8 151.7 0 163.8 0H284.2c12.1 0 23.2 6.8 28.6 17.7L320 32h96c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 96 0 81.7 0 64S14.3 32 32 32h96l7.2-14.3zM32 128H416V448c0 35.3-28.7 64-64 64H96c-35.3 0-64-28.7-64-64V128zm96 64c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16zm96 0c-8.8 0-16 7.2-16 16V400c0 8.8 7.2 16 16 16s16-7.2 16-16V208c0-8.8-7.2-16-16-16z'/%3E%3C/svg%3E") !important; 
}

/* Colonna 3: Totale */
.j2store-cart-table td:nth-child(3) { flex: 0 0 100px; justify-content: flex-end; color: #9b85c5; font-weight: 800; font-size: 1.3rem; }

/* --- BOTTONI CARRELLO INFERIORI --- */
.cart-update-button { display: none !important; }
.j2store-cart-buttons { display: flex; justify-content: space-between; align-items: center; width: 100%; border-top: 2px dashed #efe8f5; padding-top: 30px; margin-bottom: 40px; flex-wrap: wrap; gap: 15px; }
.buttons-left, .buttons-right { display: flex; gap: 15px; flex-wrap: wrap; }
.j2store-cart-buttons input[type="button"], .cart-clear-button a.btn-danger { border-radius: 30px !important; padding: 14px 30px !important; font-weight: 700 !important; text-transform: uppercase; font-size: 0.9rem; letter-spacing: 0.5px; transition: all 0.3s ease; border: none !important; }
.j2store-cart-buttons input[type="button"] { background-color: #f1f3f5 !important; color: #495057 !important; }
.j2store-cart-buttons input[type="button"]:hover { background-color: #e2e6ea !important; color: #333 !important; transform: translateY(-2px); }
.cart-clear-button a.btn-danger { background-color: #ffffff !important; color: #ff6b6b !important; border: 2px solid #ff6b6b !important; box-shadow: 0 4px 10px rgba(255, 107, 107, 0.1); display: inline-block; }
.cart-clear-button a.btn-danger:hover { background-color: #ff6b6b !important; color: white !important; box-shadow: 0 8px 15px rgba(255, 107, 107, 0.25); transform: translateY(-2px); }

/* --- CONTENITORE COUPON VS TOTALE (Anti-Sovrapposizione Definitivo) --- */
.j2store-cart > .row { display: flex !important; flex-wrap: wrap !important; width: 100% !important; margin: 0 !important; }
.j2store-cart > .row > .col-md-6 { flex: 0 0 48% !important; max-width: 48% !important; width: 100% !important; padding: 0 !important; margin-bottom: 20px; }
.j2store-cart > .row:last-of-type { justify-content: space-between !important; margin-top: 20px !important; }

/* Coupon e Voucher */
.voucher, .coupon { margin-bottom: 20px; width: 100%; }
.cart-estimator-discount-block form { display: flex; align-items: center; width: 100%; max-width: 100%; }
.cart-estimator-discount-block input[type="text"], #j2store-cart input[name="coupon_code"], #j2store-cart input[name="voucher_code"] { border-radius: 30px 0 0 30px !important; border: 1px solid #ced4da !important; border-right: none !important; padding: 12px 20px !important; box-shadow: none !important; flex: 1; height: 48px; transition: border-color 0.3s; background: #faf8fc; }
.cart-estimator-discount-block input[type="text"]:focus { background: #ffffff; outline: none; border-color: #9b85c5 !important; }
.cart-estimator-discount-block input[type="submit"], #j2store-cart input[name="apply_coupon"], #j2store-cart input[name="apply_voucher"] { border-radius: 0 30px 30px 0 !important; background-color: #d9d5f2 !important; color: #495057 !important; border: 1px solid #d9d5f2 !important; padding: 0 25px !important; height: 48px; font-weight: 700; text-transform: uppercase; font-size: 0.85rem; transition: all 0.3s ease; cursor: pointer; }
.cart-estimator-discount-block input[type="submit"]:hover { background-color: #9b85c5 !important; color: #ffffff !important; border-color: #9b85c5 !important; }

/* Totale Carrello e Checkout */
#j2store-cart h3 { color: #9b85c5; font-weight: 800; font-size: 1.8rem; margin-bottom: 20px; text-align: center; }
table.cart-footer, .cart-total-table { background: #faf8fc !important; border-radius: 20px; padding: 25px; border: 1px solid #efe8f5 !important; box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); display: block; width: 100%; max-width: 100%; margin: 0; }
table.cart-footer tbody { display: table; width: 100%; }
table.cart-footer th, table.cart-footer td, .cart-total-table td { border: none !important; padding: 15px 10px !important; font-size: 1.15rem; background: transparent !important; color: #495057; }
table.cart-footer th { text-align: left; color: #6c757d; font-weight: 500; }
table.cart-footer td { text-align: right; font-weight: 700; }
table.cart-footer tr:last-child th, table.cart-footer tr:last-child td, .cart-total-table tr:last-child td { font-weight: 800; font-size: 1.6rem; color: #9b85c5; border-top: 2px dashed #d9d5f2 !important; padding-top: 25px !important; display: table-cell; }

a.j2store-checkout-button, .cart-checkout-button a.btn-success { background-color: #9b85c5 !important; color: #ffffff !important; border-radius: 30px !important; box-shadow: 0 6px 20px rgba(155, 133, 197, 0.35) !important; padding: 16px 45px !important; font-size: 1.15rem !important; font-weight: 700 !important; text-transform: uppercase; margin-top: 20px; display: block; text-align: center; width: 100%; transition: all 0.3s ease; text-decoration: none; }
a.j2store-checkout-button:hover, .cart-checkout-button a.btn-success:hover { background-color: #7a63a5 !important; transform: translateY(-3px); box-shadow: 0 10px 25px rgba(155, 133, 197, 0.45) !important; }

/* Carrello Vuoto */
#t4-main-body .j2store-cart { padding: 80px 20px !important; text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; min-height: 400px; }
.cart-no-items { background: #ffffff !important; padding: 60px 40px !important; border-radius: 25px !important; box-shadow: 0 15px 45px rgba(155, 133, 197, 0.12) !important; color: #495057 !important; font-size: 1.4rem !important; font-weight: 700 !important; max-width: 500px !important; width: 100% !important; display: block !important; border: 1px solid #efe8f5 !important; }
.cart-no-items::before { content: "🛒" !important; display: block !important; font-size: 4rem !important; margin-bottom: 25px !important; filter: drop-shadow(0 5px 10px rgba(155, 133, 197, 0.3)); opacity: 0.8; }
/* FIX OVERFLOW ORIZZONTALE: Impedisce ai Coupon di allargare lo schermo */
    .cart-estimator-discount-block { max-width: 100% !important; }
    .cart-estimator-discount-block form { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
    
    .cart-estimator-discount-block input[type="text"], 
    #j2store-cart input[name="coupon_code"], 
    #j2store-cart input[name="voucher_code"] { 
        min-width: 0 !important; /* FONDAMENTALE: permette all'input di rimpicciolirsi senza sfondare i margini */
        flex: 1 1 auto !important;
    }
    
    .cart-estimator-discount-block input[type="submit"], 
    #j2store-cart input[name="apply_coupon"], 
    #j2store-cart input[name="apply_voucher"] { 
        padding: 0 12px !important; /* Rimpicciolisce il bottone laterale per fare spazio */
        font-size: 0.75rem !important;
        flex-shrink: 0 !important; /* Impedisce al bottone di schiacciarsi rovinando la scritta */
    }
.cart-no-items::after { content: "Sembra che tu non abbia ancora scelto nulla. Lasciati ispirare dalle nostre creazioni!" !important; display: block !important; font-size: 1rem !important; color: #6c757d !important; font-weight: 400 !important; margin-top: 15px !important; line-height: 1.5 !important; }


/* ======================================================================== */
/* 5. J2STORE: CHECKOUT                                                     */
/* ======================================================================== */
#j2store-checkout { max-width: 900px; margin: 40px auto; background: #ffffff; border-radius: 20px; padding: 40px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05); }
#j2store-checkout h1 { color: #9b85c5; font-weight: 800; font-size: 2.5rem; margin-bottom: 30px; text-align: center; border-bottom: 2px dashed #efe8f5; padding-bottom: 20px; }
.checkout-heading { background-color: #faf8fc; color: #495057; font-weight: 700; font-size: 1.2rem; padding: 18px 25px; border-radius: 12px; margin-bottom: 15px; cursor: pointer; border: 1px solid #efe8f5; display: flex; justify-content: space-between; align-items: center; transition: all 0.3s ease; }
.checkout-heading:hover { background-color: #f1ecf8; color: #9b85c5; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(155, 133, 197, 0.1); }
.checkout-heading a { color: #9b85c5; font-size: 0.9rem; font-weight: 600; text-transform: uppercase; text-decoration: none; background: #ffffff; padding: 5px 15px; border-radius: 20px; border: 1px solid #d9d5f2; transition: all 0.2s; }
.checkout-heading a:hover { background: #9b85c5; color: #ffffff; }
.checkout-content { padding: 20px 25px 40px; border-left: 2px solid #faf8fc; margin-left: 20px; margin-bottom: 20px; }
.checkout-content h2 { color: #333; font-size: 1.5rem; font-weight: 700; margin-bottom: 15px; }
.checkout-content p { color: #6c757d; line-height: 1.6; margin-bottom: 20px; }
#j2store-checkout input[type="text"], #j2store-checkout input[type="password"], #j2store-checkout select, #j2store-checkout textarea { width: 100%; border: 1px solid #ced4da; border-radius: 10px; padding: 12px 15px; margin-top: 5px; margin-bottom: 20px; font-size: 1rem; color: #495057; background-color: #ffffff; transition: border-color 0.3s, box-shadow 0.3s; }
#j2store-checkout input[type="text"]:focus, #j2store-checkout input[type="password"]:focus, #j2store-checkout select:focus, #j2store-checkout textarea:focus { border-color: #9b85c5; box-shadow: 0 0 0 0.25rem rgba(155, 133, 197, 0.25); outline: none; }
#j2store-checkout label { font-weight: 600; color: #495057; cursor: pointer; display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
#j2store-checkout input[type="radio"], #j2store-checkout input[type="checkbox"] { width: 18px; height: 18px; accent-color: #9b85c5; cursor: pointer; margin: 0; }
#j2store-checkout .btn-primary { background-color: #9b85c5 !important; color: #ffffff !important; border: none !important; border-radius: 30px !important; padding: 12px 30px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(155, 133, 197, 0.3); }
#j2store-checkout .btn-primary:hover { background-color: #7a63a5 !important; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(155, 133, 197, 0.45); }
#j2store-checkout .col-md-6.left { border-right: 1px solid #efe8f5; padding-right: 30px; }
#j2store-checkout .col-md-6.right { padding-left: 30px; }
#j2store-checkout a { color: #9b85c5; text-decoration: none; font-weight: 600; }
#j2store-checkout a:hover { color: #7a63a5; text-decoration: underline; }


/* ======================================================================== */
/* 6. UTENTI: LOGIN E REGISTRAZIONE                                         */
/* ======================================================================== */
.login-wrap { max-width: 450px; margin: 60px auto; background: #ffffff; border-radius: 20px; padding: 45px 40px; box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); }
.frm-wrap.login { border: none !important; padding: 0 !important; background: transparent !important; }
.login-wrap .control-label label, .com-users-registration .control-label label, .com-users-registration .control-label { font-weight: 700; color: #495057; font-size: 0.95rem; margin-bottom: 8px; display: block; }
.login-wrap input[type="text"], .login-wrap input[type="password"], .com-users-registration input[type="text"], .com-users-registration input[type="email"], .com-users-registration input[type="password"], .com-users-registration select { border-radius: 12px !important; border: 1px solid #ced4da !important; padding: 12px 15px !important; font-size: 1rem; transition: all 0.3s ease; background-color: #faf8fc; width: 100%; color: #495057; box-sizing: border-box !important; }
.login-wrap input:focus, .com-users-registration input:focus, .com-users-registration select:focus { border-color: #9b85c5 !important; background-color: #ffffff !important; box-shadow: 0 0 0 0.2rem rgba(155, 133, 197, 0.25) !important; outline: none; }
.login-wrap .input-group, .com-users-registration .input-group { position: relative !important; display: block !important; width: 100% !important; border: none !important; box-shadow: none !important; }
.login-wrap .input-group input[type="password"], .com-users-registration .input-group input[type="password"] { padding-right: 45px !important; width: 100% !important; }
.login-wrap .input-password-toggle, .com-users-registration .input-password-toggle { position: absolute !important; right: 5px !important; top: 50% !important; transform: translateY(-50%) !important; background: transparent !important; border: none !important; color: #9b85c5 !important; box-shadow: none !important; z-index: 10; padding: 8px !important; }
.login-wrap .input-password-toggle:hover, .com-users-registration .input-password-toggle:hover { color: #7a63a5 !important; }
.login-remember { margin: 20px 0 30px 0; }
.login-remember .form-check { display: flex; align-items: center; gap: 10px; }
.login-remember input[type="checkbox"], .com-users-registration input[type="radio"], .com-users-registration input[type="checkbox"] { width: 18px !important; height: 18px !important; accent-color: #9b85c5; cursor: pointer; margin: 0; vertical-align: middle; }
.login-remember label { margin: 0; cursor: pointer; color: #6c757d; font-weight: 500; }
.login-submit button[type="submit"].btn-primary, .com-users-registration__register { background-color: #9b85c5 !important; color: #ffffff !important; border: none !important; border-radius: 30px !important; padding: 14px 20px !important; font-size: 1.1rem !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: 0.5px; width: 100%; box-shadow: 0 5px 20px rgba(155, 133, 197, 0.35); transition: all 0.3s ease; margin-bottom: 15px; }
.login-submit button[type="submit"].btn-primary:hover, .com-users-registration__register:hover { background-color: #7a63a5 !important; transform: translateY(-2px); box-shadow: 0 8px 25px rgba(155, 133, 197, 0.5); }
.other-links { margin-top: 30px; text-align: center; border-top: 1px solid #efe8f5; padding-top: 25px; }
.other-links ul { list-style: none; padding: 0; margin: 0; }
.other-links li { margin-bottom: 12px; }
.other-links a { color: #6c757d; font-weight: 600; text-decoration: none; transition: color 0.2s ease; font-size: 0.95rem; }
.other-links a:hover { color: #9b85c5; text-decoration: underline; }
.login-wrap .form-control-feedback, .com-users-registration .form-control-feedback { display: block !important; position: static !important; background: transparent !important; color: #ff6b6b !important; border: none !important; box-shadow: none !important; padding: 5px 0 0 0 !important; font-size: 0.85rem !important; font-weight: 600 !important; text-align: left !important; width: 100% !important; }
.login-wrap .form-control-feedback::before, .login-wrap .form-control-feedback::after, .com-users-registration .form-control-feedback::before, .com-users-registration .form-control-feedback::after { display: none !important; }

/* Registrazione Specifica */
.com-users-registration { max-width: 800px; margin: 60px auto; background: #ffffff; border-radius: 20px; padding: 50px; box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); }
.com-users-registration fieldset { border: none !important; padding: 0 !important; margin-bottom: 40px !important; }
.com-users-registration legend { font-size: 1.5rem; font-weight: 800; color: #9b85c5; border-bottom: 2px dashed #efe8f5; padding-bottom: 15px; margin-bottom: 25px; width: 100%; text-transform: uppercase; letter-spacing: 0.5px; clear: both !important; display: block !important; }
.com-users-registration .field-spacer, div[id*="jform[j2storecustom]"], label[for="jform_profile_tos1"], label[for="jform_terms_terms1"] { display: none !important; }
.com-users-registration .star, .j2store_field_required { color: #ff6b6b !important; margin-left: 3px; font-weight: bold; display: inline-block !important; line-height: 1 !important; margin-top: 0 !important; }
.com-users-registration .control-group { display: flex !important; flex-direction: column !important; align-items: flex-start !important; width: 100% !important; margin-bottom: 25px !important; clear: both !important; }
.com-users-registration .control-label { display: flex !important; align-items: center !important; width: 100% !important; max-width: 100% !important; text-align: left !important; float: none !important; margin-bottom: 8px !important; padding: 0 !important; visibility: visible !important; opacity: 1 !important; }
.com-users-registration .control-label label { display: inline-block !important; margin-bottom: 0 !important; width: auto !important; visibility: visible !important; opacity: 1 !important; }
.com-users-registration .controls { width: 100% !important; max-width: 100% !important; float: none !important; margin-left: 0 !important; padding: 0 !important; }
#billing-new br { display: none !important; }
#billing-new .row { display: flex !important; flex-wrap: wrap !important; margin-left: -15px !important; margin-right: -15px !important; width: auto !important; }
#billing-new .col-md-6 { flex: 0 0 50% !important; max-width: 50% !important; padding-left: 15px !important; padding-right: 15px !important; box-sizing: border-box !important; }
#billing-new input, #billing-new select { width: 100% !important; max-width: 100% !important; }
.com-users-registration .controls fieldset.radio, .com-users-registration .controls fieldset.checkboxes { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 20px !important; margin: 0 !important; padding: 0 !important; }
.com-users-registration .controls fieldset.radio label, .com-users-registration .controls fieldset.checkboxes label { display: inline-flex !important; align-items: center !important; margin: 0 !important; margin-right: 20px !important; font-weight: 500; color: #495057; cursor: pointer; }
.field-calendar .input-group { display: flex !important; }
.field-calendar .input-group input { border-radius: 12px 0 0 12px !important; flex: 1; height: 48px; }
.field-calendar .input-group .btn-primary { border-radius: 0 12px 12px 0 !important; background-color: #9b85c5 !important; border: 1px solid #9b85c5 !important; color: #ffffff !important; padding: 0 20px; margin: 0 !important; height: 48px; box-shadow: none !important; }
.com-users-registration .small, .com-users-registration .form-text { color: #888; font-size: 0.85rem; margin-top: 8px; display: block; line-height: 1.4; }
meter#progress-0 { width: 100%; height: 10px; border-radius: 10px; margin-top: 10px; }
.com-users-registration .alert-info { background-color: #faf8fc !important; color: #7a63a5 !important; border: 1px solid #efe8f5 !important; border-radius: 15px !important; font-weight: 600; margin-top: 15px !important; margin-bottom: 25px !important; position: relative !important; display: block !important; clear: both !important; }
.com-users-registration a[data-bs-toggle="modal"] { color: #9b85c5; font-weight: bold; text-decoration: underline; }
.com-users-registration a[data-bs-toggle="modal"]:hover { color: #7a63a5; }

/* Pulsante WebAuthn */
.plg_system_webauthn_login_button { width: 400px; height: 50px; font-size: 16px; padding: 0 12px; display: flex; align-items: center; justify-content: center; gap: 8px; background-color: #ffffff !important; color: #495057 !important; border: 2px solid #efe8f5 !important; border-radius: 30px !important; font-weight: 600 !important; transition: all 0.3s ease; box-shadow: 0 4px 10px rgba(0,0,0,0.03); margin-bottom: 20px; }
.plg_system_webauthn_login_button svg { width: 24px; height: 24px; fill: currentColor; }
.plg_system_webauthn_login_button:hover { background-color: #faf8fc !important; border-color: #9b85c5 !important; color: #9b85c5 !important; transform: translateY(-2px); }

/* ========================================================= */
/* --- STILE PROFILO UTENTE (PENTA PREMIUM) --- */
/* ========================================================= */

/* 1. Contenitore Principale (Card Identica alla Registrazione) */
.com-users-profile.profile {
    max-width: 800px;
    margin: 60px auto;
    background: #ffffff;
    border-radius: 20px;
    padding: 50px;
    box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); /* Ombra morbida lilla */
}

/* 2. RIMOZIONE CHIRURGICA DEI CAMPI INDESIDERATI */

/* Nasconde tutto il blocco intero "Impostazioni di base" */
#users-profile-custom {
    display: none !important;
}

/* Nasconde "Data ultima visita" (il 4° elemento della prima lista) */
#users-profile-core dl dt:nth-of-type(4),
#users-profile-core dl dd:nth-of-type(4) {
    display: none !important;
}

/* Nasconde Avatar, User Position e Social Info (I primi 3 elementi della seconda lista) */
#users-profile-custom-profile dl dt:nth-of-type(-n+3),
#users-profile-custom-profile dl dd:nth-of-type(-n+3) {
    display: none !important;
}

/* Nasconde il campo vuoto fiscale (il 2° elemento senza nome che avevi nella lista Fiscale) */
#users-profile-custom-fields-1 dl dt:nth-of-type(2),
#users-profile-custom-fields-1 dl dd:nth-of-type(2) {
    display: none !important;
}

/* 3. Titoli delle sezioni (Legend) */
.com-users-profile__core legend,
.com-users-profile__custom legend {
    font-size: 1.5rem;
    font-weight: 800;
    color: #9b85c5;
    border-bottom: 2px dashed #efe8f5;
    padding-bottom: 15px;
    margin-bottom: 25px;
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: block;
}

.com-users-profile__core,
.com-users-profile__custom {
    border: none !important;
    padding: 0 !important;
    margin-bottom: 40px !important;
}

/* 4. Stile delle righe dei dati (Etichetta e Valore) */
.com-users-profile dl.row {
    margin: 0 !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center; 
}

.com-users-profile dt {
    font-weight: 700;
    color: #495057;
    font-size: 1rem;
    text-align: left !important;
    padding: 10px 15px 10px 0 !important;
    margin-bottom: 15px !important;
}

.com-users-profile dd {
    background-color: #faf8fc; /* Lilla chiarissimo di sfondo per il dato */
    color: #6c757d;
    font-weight: 600;
    border-radius: 12px;
    padding: 12px 20px !important;
    border: 1px solid #efe8f5;
    margin-bottom: 15px !important;
    display: flex;
    align-items: center;
    min-height: 48px;
}

/* 5. Il bottone "Modifica Profilo" (Pillola elegante) */
ul.com-users-profile__edit {
    list-style: none;
    padding: 0;
    margin: 0 0 35px 0;
    display: flex;
    justify-content: flex-end; /* Lo spinge elegantemente a destra */
}

ul.com-users-profile__edit .btn-secondary {
    background-color: #ffffff !important;
    color: #9b85c5 !important;
    border: 2px solid #efe8f5 !important;
    border-radius: 30px !important;
    padding: 12px 25px !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

ul.com-users-profile__edit .btn-secondary:hover {
    background-color: #9b85c5 !important;
    color: #ffffff !important;
    border-color: #9b85c5 !important;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(155, 133, 197, 0.25) !important;
}

ul.com-users-profile__edit .btn-secondary [class^="icon-"] {
    display: none; /* Nasconde l'icona vecchia di Joomla */
}
ul.com-users-profile__edit .btn-secondary::before {
    content: "✏️"; /* Aggiunge un'emoji matita più moderna */
    font-size: 1.1rem;
}

/* 6. Testi descrittivi (Il testo dei Dettagli Fiscali) */
.com-users-profile p {
    color: #6c757d;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 25px;
    background: #fdfbfd;
    padding: 15px 20px;
    border-left: 4px solid #9b85c5; /* Barra lilla a sinistra come evidenziatore */
    border-radius: 0 10px 10px 0;
}

/* --- ADATTAMENTO MOBILE PROFILO --- */
@media (max-width: 768px) {
    .com-users-profile.profile {
        padding: 30px 20px;
        margin: 30px 15px;
        border-radius: 15px;
    }
    .com-users-profile dt {
        padding: 0 0 5px 0 !important;
        margin-bottom: 0 !important;
    }
    .com-users-profile dd {
        margin-bottom: 25px !important;
    }
    ul.com-users-profile__edit {
        justify-content: center; /* Centra il bottone sul telefono */
    }
    ul.com-users-profile__edit .btn-secondary {
        width: 100%;
        justify-content: center;
    }
}

/* ========================================================= */
/* --- STILE MODIFICA PROFILO (PENTA PREMIUM) --- */
/* ========================================================= */

/* 1. Contenitore Principale (Card) e Fix Bug Sovrapposizione Header */
.com-users-profile__edit.profile-edit {
    max-width: 800px;
    margin: 100px auto 60px auto !important; /* Il 100px in alto RISOLVE il bug della linea sovrapposta! */
    background: #ffffff;
    border-radius: 20px;
    padding: 50px;
    box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15);
    position: relative;
    z-index: 1;
}

/* 2. RIMOZIONE CHIRURGICA CAMPI INDESIDERATI (Form Modifica) */

/* Nasconde "Impostazioni di base" (Tutto il 2° blocco) */
.com-users-profile__edit-form > fieldset:nth-of-type(2) {
    display: none !important;
}

/* Nasconde Avatar, User Position, Social Info (I primi 3 campi del 3° blocco "User info") */
.com-users-profile__edit-form > fieldset:nth-of-type(3) .control-group:nth-of-type(-n+3) {
    display: none !important;
}

/* Nasconde il campo vuoto "Cliente business" (Il 2° campo del 4° blocco "Dettagli Fiscali") */
.com-users-profile__edit-form > fieldset:nth-of-type(4) .control-group:nth-of-type(2) {
    display: none !important;
}
/* Nota: "Data ultima visita" non c'è qui perché Joomla non fa modificare quella data all'utente. */

/* 3. Titoli delle sezioni (Legend) */
.com-users-profile__edit-form legend {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    color: #9b85c5 !important;
    border-bottom: 2px dashed #efe8f5 !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
    width: 100% !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: block !important;
}

/* 4. Stile Label e Campi di Input */
.com-users-profile__edit-form .control-label label {
    font-weight: 700 !important;
    color: #495057 !important;
    font-size: 0.95rem !important;
    text-align: left !important;
    display: block !important;
    margin-bottom: 8px !important;
}

/* Campi da compilare lilla chiarissimo */
.com-users-profile__edit-form input[type="text"],
.com-users-profile__edit-form input[type="email"],
.com-users-profile__edit-form input[type="password"],
.com-users-profile__edit-form input[type="tel"],
.com-users-profile__edit-form select {
    border-radius: 12px !important;
    border: 1px solid #ced4da !important;
    padding: 12px 15px !important;
    font-size: 1rem !important;
    background-color: #faf8fc !important;
    width: 100% !important;
    color: #495057 !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
    height: auto !important;
}

.com-users-profile__edit-form input:focus,
.com-users-profile__edit-form select:focus {
    border-color: #9b85c5 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 0.2rem rgba(155, 133, 197, 0.25) !important;
    outline: none !important;
}

/* Rende grigio il "Nome utente" bloccato da Joomla */
.com-users-profile__edit-form input[readonly] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
    cursor: not-allowed;
    border-color: #e9ecef !important;
}

.com-users-profile__edit-form .control-group {
    margin-bottom: 25px !important;
}

/* Testo Esplicativo (Dettagli Fiscali) */
.com-users-profile__edit-form p {
    color: #6c757d;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 25px;
    background: #fdfbfd;
    padding: 15px 20px;
    border-left: 4px solid #9b85c5;
    border-radius: 0 10px 10px 0;
}

/* 5. Bottoni Salva e Annulla */
.com-users-profile__edit-submit {
    margin-top: 40px !important;
    padding-top: 30px !important;
    border-top: 1px solid #efe8f5 !important;
    display: flex;
    justify-content: flex-end;
}

.com-users-profile__edit-submit .col-sm-9 {
    display: flex;
    gap: 15px;
    width: 100%;
    justify-content: flex-end;
}

/* Tasto Salva (Lilla) */
.com-users-profile__edit-submit .btn-primary {
    background-color: #9b85c5 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 12px 35px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 5px 20px rgba(155, 133, 197, 0.35) !important;
}

.com-users-profile__edit-submit .btn-primary:hover {
    background-color: #7a63a5 !important;
    transform: translateY(-2px);
}

/* Tasto Annulla (Bordato Rosso) */
.com-users-profile__edit-submit .btn-danger {
    background-color: #ffffff !important;
    color: #ff6b6b !important;
    border: 2px solid #ff6b6b !important;
    border-radius: 30px !important;
    padding: 12px 35px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
}

.com-users-profile__edit-submit .btn-danger:hover {
    background-color: #ff6b6b !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* 8. Fix Blocco Email e Avviso Password (Inniettati via JS) */
.penta-locked-input {
    pointer-events: none !important; /* Impedisce il click */
    background-color: #e9ecef !important; /* Grigio bloccato */
    color: #6c757d !important;
    border-color: #e9ecef !important;
}

.penta-password-notice {
    background: #fdfbfd;
    padding: 15px 20px;
    border-left: 4px solid #9b85c5; /* Evidenziatore lilla a sinistra */
    border-radius: 0 10px 10px 0;
    color: #6c757d;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-top: 5px;
}

/* 9. FIX: Previene la sovrapposizione del menu con l'header SOLO nelle pagine Utente */
body:has(.com-users-profile) #t4-header,
body:has(.profile-edit) #t4-header,
body:has(.login-wrap) #t4-header,
body:has(.com-users-registration) #t4-header {
    margin-bottom: 30px !important; /* Spinge il menu verso il basso mettendolo sotto la linea */
}

/* ========================================================= */
/* --- STILE PROFILO E-COMMERCE J2STORE (PENTA PREMIUM) ---  */
/* ========================================================= */

/* 1. Contenitore Principale (Allineamento e Card) */
#akeeba-renderjoomla {
    max-width: 900px;
    margin: 40px auto;
}

.j2store-myprofile {
    background: #ffffff;
    border-radius: 20px;
    padding: 40px 50px;
    box-shadow: 0 15px 40px rgba(155, 133, 197, 0.15); /* Ombra morbida lilla */
    position: relative;
}

/* 2. Bottone "Esci" (Logout) in alto a destra */
#akeeba-renderjoomla .pull-right {
    float: none !important;
    display: flex;
    justify-content: flex-end;
    margin-bottom: 20px;
}

.logout-button .btn-primary {
    background-color: #ffffff !important;
    color: #ff6b6b !important; /* Rosso pastello */
    border: 2px solid #ff6b6b !important;
    border-radius: 30px !important;
    padding: 10px 25px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important;
}

.logout-button .btn-primary:hover {
    background-color: #ff6b6b !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(255, 107, 107, 0.2) !important;
}

/* 3. Titolo Dashboard */
.j2store-myprofile h3 {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    color: #9b85c5 !important;
    border-bottom: 2px dashed #efe8f5 !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* 4. Navigazione a Tabs (Ordini / Indirizzi) */
.j2store-myprofile .nav-tabs {
    border-bottom: none !important;
    gap: 15px;
    margin-bottom: 30px;
}

.j2store-myprofile .nav-link {
    border: 2px solid #efe8f5 !important;
    color: #6c757d !important;
    font-weight: 600 !important;
    border-radius: 30px !important; /* Stile a pillola */
    padding: 12px 25px !important;
    transition: all 0.3s ease !important;
    background: #ffffff !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.j2store-myprofile .nav-link:hover {
    border-color: #9b85c5 !important;
    color: #9b85c5 !important;
}

.j2store-myprofile .nav-link.active {
    background-color: #9b85c5 !important;
    border-color: #9b85c5 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 15px rgba(155, 133, 197, 0.3) !important;
}

/* 5. Tabella Ordini (Stile minimalista e pulito) */
.j2store-myprofile .table {
    border: none !important;
    margin-bottom: 0 !important;
}

.j2store-myprofile .table thead th {
    background-color: #faf8fc !important;
    color: #9b85c5 !important;
    border: none !important;
    border-bottom: 2px solid #efe8f5 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    padding: 15px !important;
    white-space: nowrap;
}

.j2store-myprofile .table tbody td {
    border: none !important;
    border-bottom: 1px solid #efe8f5 !important;
    padding: 20px 15px !important;
    vertical-align: middle !important;
    color: #495057 !important;
    font-weight: 600 !important;
    font-size: 0.95rem;
}

/* 6. Badge "Stato Ordine" */
.j2store-myprofile .badge {
    font-size: 0.8rem !important;
    padding: 8px 15px !important;
    border-radius: 20px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px;
    background-image: none !important; /* Rimuove sfumature vecchie */
}

/* Colore pastello per gli avvisi (es. "In sospeso", "In attesa") */
.j2store-myprofile .badge.text-bg-warning,
.j2store-myprofile .badge.label-warning {
    background-color: #fff3cd !important;
    color: #856404 !important;
    border: 1px solid #ffeeba !important;
}

/* 7. Icone Azioni (Occhietto e Stampante) */
.j2store-order-action-icons {
    display: flex;
    gap: 10px;
}

.j2store-order-action-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background-color: #faf8fc !important;
    color: #9b85c5 !important;
    border-radius: 50%; /* Icone perfettamente tonde */
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: 1px solid #efe8f5;
}

.j2store-order-action-icons a:hover {
    background-color: #9b85c5 !important;
    color: #ffffff !important;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(155, 133, 197, 0.25);
}

/* 8. Tab "I Miei Indirizzi" */
.myprofile-address-list-heading {
    display: none; /* Nascosto perché c'è già la Tab che lo dice */
}

.myprofile-address-addnew {
    margin-bottom: 25px;
}

/* Bottone "Aggiungi Indirizzo" */
.myprofile-address-addnew a {
    background-color: #9b85c5 !important;
    color: #ffffff !important;
    padding: 12px 30px !important;
    border-radius: 30px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    box-shadow: 0 5px 20px rgba(155, 133, 197, 0.25);
}

.myprofile-address-addnew a::before {
    content: "➕";
    margin-right: 10px;
    font-size: 0.9rem;
}

.myprofile-address-addnew a:hover {
    background-color: #7a63a5 !important;
    transform: translateY(-2px);
}

/* --- ADATTAMENTO MOBILE PROFILO J2STORE --- */
@media (max-width: 768px) {
    .j2store-myprofile {
        padding: 30px 20px !important;
        border-radius: 15px !important;
    }
    
    /* Impila le tab verticalmente sul telefono */
    .j2store-myprofile .nav-tabs {
        flex-direction: column;
        gap: 10px;
    }
    
    .j2store-myprofile .nav-link {
        justify-content: center;
        width: 100%;
    }

    /* Mette il tasto "Esci" al centro */
    #akeeba-renderjoomla .pull-right {
        justify-content: center;
    }
    .logout-button .btn-primary {
        width: 100%;
    }

    /* Ottimizzazione Tabella (Bordo e scroll morbido) */
    .j2store-myprofile .table-responsive {
        border: 1px solid #efe8f5;
        border-radius: 12px;
        box-shadow: inset 0 0 10px rgba(0,0,0,0.02);
    }
}

/* --- ADATTAMENTO MOBILE MODIFICA PROFILO --- */
@media (max-width: 768px) {
    .com-users-profile__edit.profile-edit {
        padding: 30px 20px !important;
        margin: 80px 15px 30px 15px !important;
    }
    .com-users-profile__edit-submit .col-sm-9 {
        flex-direction: column-reverse; /* Inverte l'ordine: Annulla sotto, Salva sopra */
        align-items: center;
        width: 100%;
    }
    .com-users-profile__edit-submit .btn-primary,
    .com-users-profile__edit-submit .btn-danger {
        width: 100%;
        text-align: center;
    }
}

/* 6. Fix Sezione Password (Occhiello, Barra Forza e Testo) */

/* Trasforma il gruppo password per ospitare l'occhiello fluttuante */
.com-users-profile__edit-form .password-group .input-group {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

/* Fa spazio a destra per non far sovrapporre il testo all'occhio */
.com-users-profile__edit-form .password-group input[type="password"] {
    padding-right: 45px !important;
}

/* Stile dell'occhiello (Lilla, senza sfondi brutti) */
.com-users-profile__edit-form .input-password-toggle {
    position: absolute !important;
    right: 5px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    color: #9b85c5 !important;
    box-shadow: none !important;
    z-index: 10;
    padding: 8px !important;
    height: auto !important;
}
.com-users-profile__edit-form .input-password-toggle:hover {
    color: #7a63a5 !important;
}

/* Barra della forza password (Meter in stile Apple) */
.com-users-profile__edit-form meter {
    width: 100% !important;
    height: 6px !important; /* Molto sottile ed elegante */
    border-radius: 10px !important;
    margin-top: 10px !important;
    background: #efe8f5 !important; /* Sfondo lilla chiarissimo */
    border: none !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.05) !important;
}

/* Stili specifici per i vari browser per colorare la barra internamente */
.com-users-profile__edit-form meter::-webkit-meter-bar {
    background: #efe8f5 !important;
    border: none !important;
    border-radius: 10px !important;
}
.com-users-profile__edit-form meter::-webkit-meter-optimum-value { background: #28a745 !important; border-radius: 10px !important; } /* Verde se perfetta */
.com-users-profile__edit-form meter::-webkit-meter-suboptimum-value { background: #ffc107 !important; border-radius: 10px !important; } /* Gialla se media */
.com-users-profile__edit-form meter::-webkit-meter-even-less-good-value { background: #ff6b6b !important; border-radius: 10px !important; } /* Rossa se debole */

/* Testo "La password non soddisfa..." */
.com-users-profile__edit-form .password-group .text-center {
    text-align: left !important;
    font-size: 0.85rem !important;
    color: #ff6b6b !important; /* Rosso pastello per l'allerta */
    margin-top: 8px !important;
    font-weight: 600 !important;
}

/* 7. Fix Sezione Passkey (Tabella e Bottone) */

/* Tabella delle passkey arrotondata */
#plg_system_webauthn-management-interface .table {
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #efe8f5 !important;
    margin-bottom: 20px !important;
}

/* Intestazione Tabella Passkey */
#plg_system_webauthn-management-interface .table thead th {
    background-color: #faf8fc !important;
    color: #9b85c5 !important;
    border-bottom: 2px solid #efe8f5 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    padding: 15px !important;
}

/* Celle interne Tabella Passkey */
#plg_system_webauthn-management-interface .table tbody td {
    background-color: #ffffff !important;
    color: #6c757d !important;
    border-bottom: 1px solid #efe8f5 !important;
    vertical-align: middle !important;
    padding: 15px !important;
}

/* Bottone "Aggiungi nuova passkey" (Pillola bianca con bordo Lilla) */
#plg_system_webauthn-manage-add.btn-success {
    background-color: #ffffff !important;
    color: #9b85c5 !important;
    border: 2px solid #efe8f5 !important;
    border-radius: 30px !important;
    padding: 12px 25px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02) !important;
    width: 100% !important;
}

/* Effetto al passaggio sul bottone Passkey */
#plg_system_webauthn-manage-add.btn-success:hover {
    background-color: #faf8fc !important;
    border-color: #9b85c5 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(155, 133, 197, 0.15) !important;
}

/* ======================================================================== */
/* 7. PAGINE CUSTOM E MODULI SPECIALI                                       */
/* ======================================================================== */
/* Stile Apple Hero (ZIG-ZAG) */
.acm-hero .hero-item, .acm-hero .hero-bg, .acm-hero [style*="background-image"] { background-position: center center !important; background-size: cover !important; background-attachment: scroll !important; }
.acm-features .feature-image { background: transparent !important; min-height: auto !important; }
.acm-features .row { display: flex !important; flex-direction: column !important; gap: 120px !important; }
.acm-features .row > div { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; padding: 0 !important; }
.acm-features .row > div:nth-child(even) { flex-direction: row-reverse !important; }
.acm-features .feature-image, .acm-features .feature-content { width: 45% !important; flex: 0 0 45% !important; padding: 0 !important; }
.acm-features .feature-image img, .acm-features .item-image img { max-width: 100% !important; height: auto !important; border-radius: 20px !important; box-shadow: 0 20px 40px rgba(0,0,0,0.1) !important; display: block !important; margin: 0 auto !important; transition: all 0.5s ease; }
.apple-img { width: 100%; max-height: 550px; object-fit: cover; border-radius: 20px !important; box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important; }
.apple-title { color: #9b85c5; font-weight: bold; font-size: 3rem; margin-bottom: 1rem; }
.apple-text { font-size: 1.25rem; color: #6c757d; }
.t4-section:has(#penta-apple-container), .t4-main-body:has(#penta-apple-container) { overflow: visible !important; }
.sticky-presentation { position: sticky !important; top: 0; height: 100vh; width: 100vw !important; left: 0 !important; margin-left: calc(50% - 50vw) !important; transform: none !important; display: flex; align-items: center; justify-content: center; overflow: hidden !important; z-index: 10; background: transparent !important; }
.sticky-presentation .container-xxl { width: 100% !important; max-width: 1320px !important; margin: 0 auto !important; padding: 0 20px !important; }
.sticky-presentation::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: linear-gradient(-45deg, #ffffff, #faf9fc, #eaddf7, #cbbde8); background-size: 400% 400%; animation: pentaAuroraFlow 25s ease infinite; }
.penta-blend-top, .penta-blend-bottom { position: absolute !important; width: 100vw !important; left: 0 !important; margin-left: calc(50% - 50vw) !important; transform: none !important; pointer-events: none; z-index: 15 !important; }
.penta-blend-top { top: -150px !important; height: 350px !important; background: linear-gradient(to bottom, #ffffff 40%, rgba(255,255,255,0) 100%); }
.penta-blend-bottom { bottom: 0; height: 250px !important; background: linear-gradient(to top, #ffffff 20%, rgba(255,255,255,0) 100%); }
.apple-slide { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(100vh); opacity: 0; transition: all 1s cubic-bezier(0.25, 1, 0.5, 1); pointer-events: none; width: 100%; }
.apple-slide.active { transform: translateY(-50%); opacity: 1; pointer-events: auto; }
.apple-slide.up { transform: translateY(-150%); opacity: 0; }
.presentation-done { height: auto !important; }
.presentation-done .sticky-presentation { position: relative !important; height: auto !important; display: block !important; overflow: visible !important; padding-top: 50px; background: transparent !important; }
.presentation-done .sticky-presentation::before, .presentation-done .penta-blend-top, .presentation-done .penta-blend-bottom, .penta-apple-track.presentation-done::before { display: none !important; content: none !important; opacity: 0 !important; }
.presentation-done .apple-slide { position: relative !important; top: auto !important; transform: none !important; opacity: 1 !important; pointer-events: auto !important; margin-bottom: 100px; visibility: visible !important; }
.presentation-done .apple-slide:last-child { margin-bottom: 0 !important; }
.presentation-done.penta-apple-track { height: fit-content !important; min-height: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important; }
.apple-slide:not(.active):not(.up) { visibility: hidden; }
.penta-apple-track { height: 250vh; position: relative; }
@keyframes pentaAuroraFlow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.penta-scroll-indicator { position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; z-index: 999; color: #9b85c5; font-weight: bold; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 2px; pointer-events: none; transition: opacity 0.6s ease, transform 0.6s ease; }
.penta-scroll-indicator .mouse { width: 28px; height: 44px; border: 2px solid #9b85c5; border-radius: 20px; position: relative; margin-bottom: 8px; }
.penta-scroll-indicator .wheel { width: 4px; height: 10px; background-color: #9b85c5; border-radius: 2px; position: absolute; top: 8px; left: 50%; transform: translateX(-50%); animation: scrollWheel 1.5s infinite ease-in-out; }
@keyframes scrollWheel { 0% { top: 8px; opacity: 1; } 100% { top: 24px; opacity: 0; } }
.presentation-done .penta-scroll-indicator { opacity: 0 !important; transform: translate(-50%, 30px) !important; display: none !important; }
.mobile-icon { display: none; }
.desktop-icon { display: block; }
.penta-scroll-indicator .swipe { width: 26px; height: 42px; border: 2px solid #9b85c5; border-radius: 8px; position: relative; margin-bottom: 8px; }
.penta-scroll-indicator .touch-dot { width: 10px; height: 10px; background-color: #9b85c5; border-radius: 50%; position: absolute; bottom: 6px; left: 50%; transform: translateX(-50%); animation: swipeUpGesture 1.5s infinite ease-in-out; }
@keyframes swipeUpGesture { 0% { bottom: 4px; opacity: 0; transform: translateX(-50%) scale(0.8); } 20% { opacity: 1; transform: translateX(-50%) scale(1); } 80% { bottom: 22px; opacity: 1; transform: translateX(-50%) scale(1); } 100% { bottom: 26px; opacity: 0; transform: translateX(-50%) scale(0.8); } }

/* Sezione Lampada Custom */
.custom-lamp-section-wrapper { width: 100vw; margin-left: calc(50% - 50vw); background-color: #faf8fc; padding: 100px 0; border-top: 1px solid #efe8f5; overflow: hidden; }
.custom-lamp-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 60px; }
.lamp-content-side { flex: 1; max-width: 550px; text-align: left; }
.custom-lamp-intro { margin-bottom: 40px; }
.custom-lamp-intro h2 { color: #9b85c5; font-weight: bold; font-size: 3.2rem; margin-bottom: 20px; line-height: 1.2; }
.custom-lamp-intro p { font-size: 1.25rem; color: #6c757d; line-height: 1.6; }
.custom-lamp-actions { display: flex; flex-direction: column; gap: 15px; align-items: flex-start; }
.lamp-visual-side { flex: 1; display: flex; justify-content: flex-end; }
.lamp-interactive-wrapper { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 500px; }
.lamp-checkbox-hidden { display: none; }
.lamp-images-container { position: relative; width: 100%; margin-bottom: 25px; border-radius: 20px; box-shadow: 0 15px 35px rgba(0,0,0,0.1); transition: box-shadow 0.6s ease-in-out; }
.lamp-img-off, .lamp-img-on { width: 100%; height: auto; border-radius: 20px; display: block; transition: opacity 0.6s ease-in-out; }
.lamp-img-on { position: absolute; top: 0; left: 0; opacity: 0; }
.lamp-checkbox-hidden:checked ~ .lamp-images-container .lamp-img-on { opacity: 1; }
.lamp-checkbox-hidden:checked ~ .lamp-images-container .lamp-img-off { opacity: 0; }
.lamp-checkbox-hidden:checked ~ .lamp-images-container { box-shadow: 0 20px 60px rgba(155, 133, 197, 0.45); }
.switch-container { display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 10px; }
.switch-ui { position: relative; display: inline-block; width: 60px; height: 34px; cursor: pointer; }
.switch-ui .slider { position: absolute; background-color: #ced4da; border-radius: 34px; top: 0; left: 0; right: 0; bottom: 0; transition: 0.4s cubic-bezier(0.25, 1, 0.5, 1); }
.switch-ui .slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: 4px; bottom: 4px; background-color: white; border-radius: 50%; transition: 0.4s cubic-bezier(0.25, 1, 0.5, 1); box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.lamp-checkbox-hidden:checked ~ .switch-container .switch-ui .slider { background-color: #9b85c5; }
.lamp-checkbox-hidden:checked ~ .switch-container .switch-ui .slider:before { transform: translateX(26px); }
.switch-label { font-size: 1.1rem; font-weight: 600; color: #495057; cursor: pointer; }
.btn-lamp-contact { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 16px 32px; border-radius: 50px; font-size: 1.05rem; font-weight: bold; text-decoration: none !important; transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1); width: 100%; max-width: 350px; }
.btn-lamp-contact i { font-size: 1.3rem; }
.btn-whatsapp { background-color: #25D366; color: #ffffff !important; box-shadow: 0 10px 20px rgba(37, 211, 102, 0.25); }
.btn-whatsapp:hover { background-color: #20ba59; transform: translateY(-4px); box-shadow: 0 15px 25px rgba(37, 211, 102, 0.4); }
.btn-email { background-color: #ffffff; color: #9b85c5 !important; border: 2px solid #9b85c5; box-shadow: 0 10px 20px rgba(155, 133, 197, 0.1); }
.btn-email:hover { background-color: #9b85c5; color: #ffffff !important; transform: translateY(-4px); box-shadow: 0 15px 25px rgba(155, 133, 197, 0.3); }

/* Chi Siamo */
.about-penta-wrapper { max-width: 1200px; margin: 0 auto; padding: 60px 20px; }
.about-header { text-align: center; margin-bottom: 70px; }
.about-title { font-size: 3.5rem; font-weight: 800; color: #9b85c5; margin-bottom: 15px; letter-spacing: -1px; }
.about-subtitle { font-size: 1.5rem; color: #6c757d; max-width: 700px; margin: 0 auto; }
.about-split-container { display: flex; align-items: center; justify-content: space-between; gap: 60px; margin-bottom: 100px; }
.about-text-side { flex: 1; max-width: 600px; }
.about-text-block { margin-bottom: 40px; }
.about-text-block h3 { font-size: 1.8rem; color: #333; font-weight: 700; margin-bottom: 15px; }
.about-text-block p { font-size: 1.15rem; line-height: 1.7; color: #555; }
.about-text-block strong { color: #9b85c5; }
.about-video-side { flex: 0 0 350px; display: flex; justify-content: center; }
.video-frame { width: 100%; max-width: 350px; border-radius: 35px; overflow: hidden; background-color: #ffffff; border: 8px solid #ffffff; box-shadow: 0 25px 50px rgba(155, 133, 197, 0.25); transform: translateZ(0); }
.penta-vertical-video { width: 100%; height: auto; display: block; object-fit: cover; border-radius: 27px; }
.about-contact-section { background-color: #faf8fc; border-radius: 30px; padding: 60px 30px; text-align: center; border: 1px solid #efe8f5; }
.about-contact-section h3 { font-size: 2.2rem; color: #9b85c5; font-weight: 700; margin-bottom: 15px; }
.about-contact-section p { font-size: 1.15rem; color: #6c757d; margin-bottom: 50px; }
.about-contact-grid { display: flex; justify-content: center; gap: 30px; flex-wrap: wrap; }
.contact-card { background: #ffffff; border-radius: 20px; padding: 35px 20px; min-width: 260px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.05); text-decoration: none !important; transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1); display: flex; flex-direction: column; align-items: center; color: inherit; }
a.contact-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(155, 133, 197, 0.25); }
.contact-card i { font-size: 2.8rem; color: #9b85c5; margin-bottom: 20px; }
.contact-card span { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 1px; color: #999; margin-bottom: 8px; }
.contact-card strong { font-size: 1.1rem; color: #333; }


/* ======================================================================== */
/* 8. FOOTER                                                                */
/* ======================================================================== */
.footer-wrapper { width: 100% !important; background-color: #d9d5f2 !important; color: #495057 !important; padding: 40px 0 !important; font-family: Arial, sans-serif !important; margin: 0 auto !important; position: relative !important; }
.footer-container { display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; align-items: center !important; max-width: 1200px !important; margin: 0 auto !important; padding: 0 20px !important; }
.footer-column { flex: 1 !important; min-width: 250px !important; text-align: center !important; margin-bottom: 20px !important; }
.footer-column img { margin-bottom: 5px !important; }
.footer-wrapper a:hover { color: #fff !important; text-decoration: none; transition: color 0.3s ease-in-out; }
.footer-wrapper a { color: #5581D9 !important; text-decoration: none; }
.footer-wrapper a img:hover { filter: brightness(0) invert(1); transition: filter 0.3s ease-in-out; }

/* 1. Base Footer e rimozione spazi esterni */
footer, #t4-footer, .t4-footer, #t4-section-1 { 
    background-color: #d9d5f2 !important; 
    padding: 20px 0 !important; /* Dà solo 20px di spazio sopra e sotto */
    margin-bottom: 0 !important; 
    width: 100%; 
    clear: both !important; 
    height: auto !important; 
}

/* 2. Uccide il padding gigante interno nascosto dal framework T4 */
#t4-footer .t4-section-inner,
.t4-footer .t4-section-inner,
#t4-section-1 .t4-section-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* 3. Schiaccia i moduli e i testi interni per renderli compatti */
#t4-footer .t4-module,
.t4-footer .t4-module,
#t4-footer p,
.t4-footer p {
    margin-bottom: 5px !important;
    padding-bottom: 0 !important;
}

/* 4. FIX MOBILE: Uccide lo spazio bianco a fondo pagina (Spesso causato dal body) */
html, body {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* 5. Previene che il tasto "Torna su" spinga il sito verso l'alto */
.t4-backtop, #back-to-top {
    margin-bottom: 0 !important;
}

/* Menu Footer Centrato in modo sicuro */
.foot-nav, #t4-footer .nav {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px 30px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
}
.foot-nav a, #t4-footer .nav a {
    color: #5581D9 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}
.foot-nav a:hover, #t4-footer .nav a:hover {
    color: #9b85c5 !important;
}

/* ======================================================================== */
/* 9. PRIVACY POLICY E COOKIE BANNER (N3T PENTA PREMIUM)                    */
/* ======================================================================== */
#cm { background-color: #ffffff !important; border-radius: 20px !important; box-shadow: 0 15px 40px rgba(155, 133, 197, 0.25) !important; border: 1px solid #efe8f5 !important; padding: 30px !important; font-family: inherit !important; }
#c-ttl { color: #9b85c5 !important; font-weight: 800 !important; font-size: 1.5rem !important; margin-bottom: 15px !important; text-transform: uppercase; letter-spacing: 0.5px; }
#c-txt { color: #6c757d !important; font-size: 1rem !important; line-height: 1.6 !important; }
#c-txt .cc-link, #s-bl .cc-link { color: #9b85c5 !important; font-weight: 700 !important; text-decoration: underline !important; transition: color 0.3s ease; }
#c-txt .cc-link:hover { color: #7a63a5 !important; }
#c-bns { gap: 15px !important; margin-top: 25px !important; display: flex !important; flex-wrap: wrap; }
#cm .cm__btns { gap: 15px !important; }

/* Bottoni Cookie Globali */
.c-bn, #c-p-bn, #c-s-bn, #s-all-bn, #s-rall-bn, #s-sv-bn { font-size: 0.85rem !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; transform: none !important; height: auto !important; padding: 12px 24px !important; border-radius: 30px !important; border: none !important; cursor: pointer; }
.c-bn:hover, #c-p-bn:hover, #c-s-bn:hover, #s-all-bn:hover, #s-rall-bn:hover, #s-sv-bn:hover { font-size: 0.85rem !important; transform: translateY(-2px) !important; box-shadow: 0 8px 20px rgba(155, 133, 197, 0.3) !important; }

#c-p-bn, #s-all-bn { background-color: #9b85c5 !important; color: #ffffff !important; box-shadow: 0 6px 20px rgba(155, 133, 197, 0.35) !important; flex-grow: 1; }
#c-p-bn:hover, #s-all-bn:hover { background-color: #7a63a5 !important; }
#c-s-bn, #s-rall-bn, #s-sv-bn { background-color: #f1f3f5 !important; color: #495057 !important; border: 1px solid #efe8f5 !important; }
#c-s-bn:hover, #s-rall-bn:hover, #s-sv-bn:hover { background-color: #e2e6ea !important; color: #333 !important; }

/* Preferenze Cookie (Settings) */
#s-cnt { border-radius: 20px !important; box-shadow: 0 25px 60px rgba(155, 133, 197, 0.3) !important; border: none !important; }
#s-ttl { color: #9b85c5 !important; font-weight: 800 !important; }
.b-ttl { color: #333 !important; font-weight: bold !important; }
#s-bl { font-family: inherit !important; }
#s-bl .c-bl { background: #ffffff !important; border: 1px solid #efe8f5 !important; border-radius: 15px !important; padding: 20px !important; margin-bottom: 15px !important; box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important; transition: all 0.3s ease !important; }
#s-bl .c-bl:hover { border-color: #9b85c5 !important; box-shadow: 0 8px 25px rgba(155, 133, 197, 0.1) !important; }
#s-bl .title .b-tl { color: #9b85c5 !important; font-weight: 800 !important; font-size: 1.15rem !important; background: transparent !important; border: none !important; text-align: left !important; padding: 0 !important; margin-left: 0 !important; text-transform: uppercase; letter-spacing: 0.5px; }
#s-bl .desc .p { color: #6c757d !important; font-size: 0.95rem !important; line-height: 1.6 !important; margin-top: 10px !important; }
#s-bl .c-bl:last-child { display: none !important; } /* Nasconde scatola vuota */
#s-bl table { width: 100% !important; margin-top: 15px !important; border-collapse: collapse !important; }
#s-bl th { color: #9b85c5 !important; border-bottom: 2px solid #efe8f5 !important; padding: 10px 5px !important; text-align: left !important; font-weight: bold !important; }
#s-bl td { color: #495057 !important; border-bottom: 1px solid #faf8fc !important; padding: 10px 5px !important; font-size: 0.85rem !important; }

/* Interruttori Cookie */
#s-bl .on-i, #s-bl .off-i, #s-bl .c-tg::before, #s-bl .c-tg::after, #s-bl .t-lb, #s-bl .b-tg::before, #s-bl .b-tg::after, #s-bl .t-lb::before, #s-bl .t-lb::after, #s-bl button.b-tl::before, #s-bl button.b-tl.exp::before, #s-bl button.b-tl::after, #s-bl button.b-tl.exp::after { display: none !important; content: none !important; background-image: none !important; border: none !important; }
#s-bl .c-tgl { display: none !important; } 
#s-bl .c-tg { position: relative !important; display: inline-block !important; width: 50px !important; height: 28px !important; background-color: #ced4da !important; background-image: none !important; border-radius: 30px !important; transition: background-color 0.3s ease !important; vertical-align: middle !important; margin-right: 15px !important; border: none !important; }
#s-bl .c-tg > span.on-i { display: block !important; position: absolute !important; top: 3px !important; left: 3px !important; width: 22px !important; height: 22px !important; background-color: #ffffff !important; border-radius: 50% !important; transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important; box-shadow: 0 2px 5px rgba(0,0,0,0.3) !important; opacity: 1 !important; }
#s-bl .c-tgl:checked + .c-tg { background-color: #9b85c5 !important; }
#s-bl .c-tgl:checked + .c-tg > span.on-i { transform: translateX(22px) !important; }
#s-bl .c-tgl:disabled + .c-tg { background-color: #d9d5f2 !important; cursor: not-allowed !important; }
#s-bl .b-tg { background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; display: inline-flex !important; align-items: center !important; flex-shrink: 0 !important; }
#s-bl .c-tg { margin-right: 0 !important; }

/* Fix Flex Cookie Settings */
#s-bl .title.b-bn { display: flex !important; align-items: center !important; justify-content: space-between !important; width: 100% !important; flex-wrap: nowrap !important; }
#s-bl .title .b-tl { flex: 1 1 auto !important; white-space: normal !important; text-align: left !important; padding-right: 15px !important; line-height: 1.4 !important; }
#s-bns { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; padding: 20px 0 25px 0 !important; justify-content: center !important; border-top: 1px solid #efe8f5 !important; margin-top: 25px !important; }
#s-bns .c-bn { padding: 10px 16px !important; font-size: 0.75rem !important; min-width: 120px !important; line-height: 1.2 !important; height: auto !important; }

/* Bottone Footer (Preferenze) */
.penta-cookie-trigger { display: inline-flex !important; align-items: center; justify-content: center; gap: 10px; background-color: #ffffff !important; color: #9b85c5 !important; border: 2px solid #efe8f5 !important; border-radius: 30px !important; padding: 12px 24px !important; font-size: 0.85rem !important; font-weight: 800 !important; text-transform: uppercase; letter-spacing: 0.5px; text-decoration: none !important; transition: all 0.3s ease !important; box-shadow: 0 4px 10px rgba(155, 133, 197, 0.05) !important; margin-top: 15px !important; }
.penta-cookie-trigger:hover { background-color: #9b85c5 !important; color: #ffffff !important; border-color: #9b85c5 !important; transform: translateY(-3px) !important; box-shadow: 0 8px 20px rgba(155, 133, 197, 0.3) !important; }


/* ======================================================================== */
/* 10. MEDIA QUERIES GLOBALI (MOBILE E TABLET)                              */
/* ======================================================================== */

/* --- TABLET / SMARTPHONE (max 991px) --- */
@media (max-width: 991px) {
    #t4-section-1, #t4-footer { max-height: 320px; }
    .penta-apple-track { height: 800vh !important; }
    .custom-lamp-container { flex-direction: column; text-align: center; gap: 50px; }
    .lamp-content-side { text-align: center; max-width: 100%; }
    .custom-lamp-actions { align-items: center; } 
    .lamp-visual-side { justify-content: center; width: 100%; }
    .about-split-container { flex-direction: column; text-align: center; gap: 50px; }
    .about-text-side { max-width: 100%; }
    .about-video-side { flex: auto; width: 100%; }
    .video-frame { max-width: 300px; }
}

/* --- SMARTPHONE (max 768px) --- */
@media (max-width: 768px) {
    /* Base e Footer */
    /* Fix blocchi Spedizione: li impila e impedisce che allarghino la pagina */
    .dsp-table { flex-direction: column !important; width: 100% !important; box-sizing: border-box !important; }
    /* Schiaccia il Footer e i suoi moduli interni su Mobile */
    #t4-footer, .t4-footer, #t4-section-1 {
        padding: 20px 0 10px 0 !important;
    }
    
    #t4-footer .t4-section-inner, 
    #t4-section-1 .t4-section-inner {
        padding: 0 !important;
    }

    #t4-footer .t4-module, 
    #t4-section-1 .t4-module {
        margin-bottom: 15px !important; /* Dà solo un minimo di respiro tra le sezioni del footer */
    }

    /* FIX DEFINITIVO SPAZIO BIANCO IN FONDO: Uccide qualsiasi margine aggiunto dai browser mobile o plugin */
    html, body {
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        height: auto !important;
        min-height: 100vh !important;
    }
    
    .t4-wrapper {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    .dsp-cell { max-width: 100% !important; min-width: 0 !important; margin-bottom: 30px !important; padding: 0 15px !important; }
    #t4-section-1, #t4-footer { max-height: 500px; }
    .footer-container { flex-direction: column !important; text-align: center !important; }
    /* Header: Allineamento Ricerca e Carrello su Mobile */
    .t4-header-r {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 15px !important; /* Spazio esatto tra lente e carrello */
    }

    /* Ridimensionamento Carrello Mobile per eguagliare la lente */
    .j2store-minicart-button .cart-item-info .link {
        padding: 5px !important; /* Toglie il padding largo che lo spingeva in basso */
    }

    .j2store-minicart-button .fa-shopping-basket {
        font-size: 22px !important; /* Rimpicciolito per essere identico alla lente */
        color: #9b85c5 !important;  /* Forza il lilla anche su mobile */
    }

    /* Aggiusta il pallino rosso per la nuova dimensione piccola */
    .j2store-minicart-button .cart-item-count {
        top: -6px !important;
        right: -8px !important;
        width: 18px !important;
        height: 18px !important;
        font-size: 10px !important;
    }
    
    /* Login e Registrazione */
    .login-wrap { margin: 30px 15px; padding: 35px 20px; width: auto; }
    .com-users-registration { padding: 30px 20px; margin: 30px 15px; border-radius: 15px; }
    .com-users-registration legend { font-size: 1.3rem; }
    #billing-new .col-md-6 { flex: 0 0 100% !important; max-width: 100% !important; }
    
    /* Pagine Custom */
    .acm-features .row > div, .acm-features .row > div:nth-child(even) { flex-direction: column !important; text-align: center !important; gap: 30px; }
    .acm-features .feature-image, .acm-features .feature-content { width: 100% !important; flex: 0 0 100% !important; }
    .desktop-icon { display: none !important; }
    .mobile-icon { display: block !important; }
    .penta-scroll-indicator { bottom: 15px; font-size: 0.7rem; }
    .penta-scroll-indicator .swipe { width: 24px; height: 38px; margin-bottom: 5px; }
    .penta-apple-track { margin-top: 80px !important; }
    .apple-title { font-size: 2rem !important; margin-bottom: 0.5rem !important; }
    .apple-text { font-size: 1.05rem !important; }
    .penta-scroll-indicator { bottom: 30px !important; }
    .penta-blend-bottom { display: none !important; }
    .apple-slide .p-3.p-md-5 { padding-bottom: 40px !important; }
    .custom-lamp-intro h2 { font-size: 2.2rem; }
    .custom-lamp-intro p { font-size: 1.05rem; }
    .lamp-images-container { max-width: 340px; }
    .about-penta-wrapper { padding: 40px 15px; }
    .about-title { font-size: 2.5rem; }
    .about-subtitle { font-size: 1.15rem; }
    .about-contact-section { padding: 40px 20px; }
    .contact-card { width: 100%; min-width: 100%; }

    /* Cookie Bottoni Settings */
    #s-bns { flex-direction: column !important; gap: 12px !important; padding: 20px 0 !important; }
    #s-bns .c-bn { width: 100% !important; min-width: 100% !important; height: auto !important; min-height: 48px !important; padding: 12px 20px !important; display: flex !important; justify-content: center !important; align-items: center !important; aspect-ratio: auto !important; }

    /* J2Store Checkout */
    #j2store-checkout { padding: 20px; }
    #j2store-checkout .col-md-6.left { border-right: none; padding-right: 15px; border-bottom: 1px solid #efe8f5; padding-bottom: 30px; margin-bottom: 30px; }
    #j2store-checkout .col-md-6.right { padding-left: 15px; }
    .checkout-content { margin-left: 0; border-left: none; padding: 20px 10px; }

    /* J2Store Bottoni Generici Carrello */
    .j2store-cart-buttons { flex-direction: column; align-items: center; }
    .buttons-left, .buttons-right { flex-direction: column; align-items: center; }

    /* J2Store: Lista Prodotti Mobile */
    .j2store-product-list #productFilters { justify-content: center; }
    .j2store-product-list .j2store-products-row { display: flex !important; flex-direction: column !important; gap: 15px !important; margin: 0 !important; }
    .j2store-product-list .j2store-products-row > [class*="col-"] { width: 100% !important; max-width: 100% !important; padding: 0 !important; margin: 0 !important; }
    .j2store-single-product { display: grid !important; grid-template-columns: 110px 1fr !important; grid-template-rows: auto auto auto !important; gap: 5px 15px !important; padding: 15px !important; align-items: center !important; text-align: left !important; height: auto !important; border-radius: 15px !important; }
    .j2store-product-images { grid-column: 1 / 2 !important; grid-row: 1 / 4 !important; margin-bottom: 0 !important; }
    .product-title { grid-column: 2 / 3 !important; grid-row: 1 / 2 !important; font-size: 1.05rem !important; margin-bottom: 0 !important; line-height: 1.2 !important; }
    .product-price-container { grid-column: 2 / 3 !important; grid-row: 2 / 3 !important; margin-bottom: 0 !important; }
    .j2store-addtocart-form { grid-column: 2 / 3 !important; grid-row: 3 / 4 !important; margin: 0 !important; }
    .j2store-thumbnail-image img { width: 100% !important; height: 110px !important; object-fit: cover !important; border-radius: 12px !important; }
    .sale-price { font-size: 1.2rem !important; }
    .j2store-add-to-cart { display: block !important; width: 100% !important; margin-top: 5px !important; }
    .j2store-add-to-cart .product-qty { display: none !important; }
    .j2store-cart-button.btn-primary { width: auto !important; padding: 8px 16px !important; font-size: 0.75rem !important; display: inline-block !important; margin: 0 !important; }

    /* J2Store Dettaglio Prodotto Mobile */
    .j2store-single-product.detail, .j2store-single-product.detail .simple-product, .j2store-single-product.detail .row, .j2store-single-product.detail [class*="col-"] { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box !important; float: none !important; }
    .j2store-single-product.detail { padding: 20px 15px !important; border-radius: 0 !important; overflow: hidden !important; }
    .j2store-mainimage { width: 100% !important; margin: 0 auto 20px auto !important; text-align: center !important; }
    .j2store-product-main-image { width: 100% !important; height: auto !important; max-width: 100% !important; display: block !important; margin: 0 auto !important; }
    .j2store-product-additional-images { width: 100% !important; margin-bottom: 30px !important; }
    ul.additional-image-list { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; padding: 0 !important; margin: 0 !important; }
    ul.additional-image-list li { display: block !important; margin: 0 !important; padding: 0 !important; }
    .j2store-single-product.detail .product-title { text-align: center !important; font-size: 2rem !important; margin-bottom: 15px !important; padding: 0 10px !important; }
    .j2store-single-product.detail .price-sku-brand-container { text-align: center !important; margin-bottom: 20px !important; }
    .j2store-single-product.detail .price-sku-brand-container .col-sm-6 { text-align: center !important; }
    .j2store-single-product.detail .sale-price { text-align: center !important; display: block !important; width: 100% !important; font-size: 2rem !important; }
    .j2store-single-product.detail .j2store-add-to-cart { display: flex !important; flex-direction: column !important; align-items: center !important; padding: 0 15px !important; width: 100% !important; box-sizing: border-box !important; }
    .j2store-single-product.detail .product-qty input, .j2store-single-product.detail .j2store-cart-button.btn-primary { width: 100% !important; max-width: 320px !important; margin: 0 auto !important; }
    .j2store-single-product.detail .nav-tabs, .j2store-single-product.detail .tab-content, .j2store-single-product.detail .tab-pane { width: 100% !important; min-width: 100% !important; display: block !important; box-sizing: border-box !important; }
    .j2store-single-product.detail .product-sdesc, .j2store-single-product.detail .product-ldesc { text-align: center !important; width: 100% !important; }
    .j2store-single-product.detail .nav-tabs { margin-top: 30px !important; padding: 0 15px !important; justify-content: center !important; }
    .j2store-single-product.detail .tab-content { padding: 25px 15px !important; margin-top: 10px !important; background: #faf8fc !important; border-radius: 20px !important; }
    .penta-share-btn { width: 100% !important; margin-top: 5px !important; }

    /* --- J2STORE: CARRELLO MOBILE --- */
    .j2store-cart > .row > .col-md-6 { flex: 0 0 100% !important; max-width: 100% !important; margin-bottom: 30px !important; }
    
    .j2store-cart-table tbody tr { flex-wrap: wrap !important; padding: 20px 15px !important; }
    
    /* Immagine e Testi vanno sopra a tutto */
    .j2store-cart-table td:nth-child(1) { flex: 0 0 100%; justify-content: flex-start; align-items: flex-start; gap: 15px; margin-bottom: 15px; }
    .cart-thumb-image img { width: 80px; height: 80px; }
    .cart-item-title { display: inline-block; margin-right: 5px; } /* Mostra "Prezzo Unitario" su mobile */
    
    /* Quantità, Cestino e Totale Righe inferiori */
    .j2store-cart-table td:nth-child(2) { flex: 1; justify-content: flex-start; gap: 20px !important; padding-top: 15px !important; border-top: 1px solid #efe8f5 !important; }
    .j2store-cart-table td:nth-child(3) { flex: 0 0 auto; justify-content: flex-end; padding-top: 15px !important; border-top: 1px solid #efe8f5 !important; }
    
    /* Bottoni e Moduli Incolonnati */
    .j2store-cart-buttons { flex-direction: column !important; gap: 15px !important; }
    .buttons-left, .buttons-right { width: 100% !important; flex-direction: column !important; justify-content: center !important; }
    .buttons-left input, .buttons-right a { width: 100% !important; text-align: center; }

    /* Carrello Vuoto Mobile */
    #t4-main-body .j2store-cart { padding: 40px 15px !important; }
    .cart-no-items { padding: 40px 25px !important; font-size: 1.2rem !important; }
    .cart-no-items::before { font-size: 3rem !important; }
    
    /* Carrello Vuoto Mobile */
    #t4-main-body .j2store-cart { padding: 40px 15px !important; }
    .cart-no-items { padding: 40px 25px !important; font-size: 1.2rem !important; }
    .cart-no-items::before { font-size: 3rem !important; }
}

/* --- SMALL MOBILE (max 576px) --- */
@media (max-width: 576px) {
    .form-check-input[type=checkbox] { width: 16px !important; height: 16px !important; }
}

/* --- EXTRA SMALL (max 480px) --- */
@media (max-width: 480px) {
    .plg_system_webauthn_login_button { width: 100%; max-width: 400px; height: auto; padding: 10px; }
    .plg_system_webauthn_login_button svg { width: 20px; height: 20px; }
    .j2store-remove { width: 30px; height: 30px; font-size: 14px; }
    .voucher, .coupon { margin-top: 15px; }
    .coupon { margin-top: 30px; }
}