/*
 * Calzoleria Paoletti - stili del tema (kit Elementor v3 blu)
 * Caricato da paoletti/paoletti.php dopo i CSS di Elementor.
 * Le regolazioni piu' usate sono le variabili qui sotto.
 */
:root{
	--pao-velo:.6;        /* fasce con foto: 1 = velatura impostata in Elementor, .5 = la meta' */
	--pao-velo-hero:.6;   /* slider della home: 1 = come il kit, .4 = molto chiaro */
}

/* --- 1. Hero e fascia marquee della home: niente spazi sotto lo slider ---
   Prima erano agganciati agli ID Elementor (49ad636b, 34d4cbf, 285fc5d8): ora alle classi del kit,
   quindi restano validi anche se la home viene ricostruita o il template reinserito. */
.e-con.e-parent:has(> .pao-hero),
.e-con.e-parent:has(> .e-con-inner > .pao-hero),
.e-con.e-parent:has(> .elementor-widget-html .pao-marquee),
.e-con.e-parent:has(> .e-con-inner > .elementor-widget-html .pao-marquee){
	--padding-top:0px;--padding-bottom:0px;--min-height:0px;--gap:0px;
	padding-top:0!important;padding-bottom:0!important;margin-top:0!important;margin-bottom:0!important;min-height:0!important
}
.pao-hero.elementor-widget,
.pao-hero .swiper-slide,
.pao-hero .swiper-slide-inner,
.pao-hero .swiper-slide-contents{margin-bottom:0!important;padding-bottom:0!important}

/* --- 2. Velature ---
   I contenitori Elementor disegnano la velatura con ::before (o sul livello della parallasse),
   non con .elementor-background-overlay: per questo la regola opacity:.1 aveva effetto solo sullo slider.
   Qui la velatura di ogni fascia viene moltiplicata per --pao-velo, mantenendo le proporzioni del kit.
   Esclusa la fascia con il video (sfumatura laterale per il testo). */
body .e-con:not(:has(> .elementor-background-video-container, > .e-con-inner > .elementor-background-video-container))::before,
body .e-con > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{
	opacity:calc(var(--overlay-opacity, 1) * var(--pao-velo))
}
.e-con:has(> .elementor-motion-effects-container) :is(.elementor-heading-title, .elementor-widget-text-editor, .elementor-icon-list-text){
	text-shadow:0 1px 14px rgba(14,25,45,.45)
}
/* slider della home: velatura della slide + sfumatura laterale del kit */
.pao-hero .elementor-background-overlay{opacity:var(--pao-velo-hero)}
body .pao-hero .swiper-slide-inner{
	background:linear-gradient(90deg,rgba(14,25,45,calc(.86 * var(--pao-velo-hero))) 0%,rgba(14,25,45,calc(.55 * var(--pao-velo-hero))) 42%,rgba(14,25,45,0) 72%)
}
.pao-hero .elementor-slide-heading,.pao-hero .elementor-slide-description{text-shadow:0 1px 16px rgba(14,25,45,.4)}
@media (max-width:767px){body .pao-hero .swiper-slide-inner{background:rgba(14,25,45,calc(.62 * var(--pao-velo-hero)))}}

/* --- 3. Fascia marquee (sostituisce la versione del CSS del kit) --- */
.pao-marquee{position:relative;width:100%;overflow:hidden;background:var(--e-global-color-secondary,#13213A);color:#fff;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);user-select:none;margin-top:0!important}
.pao-marquee .pao-marquee__track{display:flex;align-items:center;gap:0;width:max-content;white-space:nowrap;animation:paoMq 34s linear infinite}
.pao-marquee:hover .pao-marquee__track{animation-play-state:paused}
.pao-marquee .pao-marquee__track span{font:600 11px/1 Manrope,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#fff;padding:0 22px}
.pao-marquee .pao-marquee__track i{display:inline-block;width:5px;height:5px;border-radius:50%;transform:none;background:var(--e-global-color-accent,#AD6E3A);flex-shrink:0}
@keyframes paoMq{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-50%,0,0)}}

/* --- 4. Prima / dopo --- */
.pao-pd{min-width:0}
.pao-pd__st{position:relative;overflow:hidden;background:#fff;box-shadow:0 24px 48px -24px rgba(19,33,58,.35);user-select:none;-webkit-user-select:none;cursor:ew-resize;touch-action:pan-y}
.pao-pd__l{position:absolute;inset:0;background-repeat:no-repeat;transition:opacity .35s}
.pao-pd__prima{clip-path:inset(0 50% 0 0)}
.pao-pd__tag{position:absolute;top:16px;z-index:2;background:rgba(19,33,58,.85);color:#fff;font:600 11px/1 Manrope,sans-serif;letter-spacing:2px;text-transform:uppercase;padding:7px 12px}
.pao-pd__tag--a{left:16px}.pao-pd__tag--b{right:16px;background:var(--e-global-color-accent,#AD6E3A)}
.pao-pd__h{position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;z-index:2;pointer-events:none;transition:opacity .4s}
.pao-pd__h span{position:absolute;top:50%;left:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#fff;color:var(--e-global-color-primary,#1F3A5F);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.25);transition:transform .2s}
.pao-pd__st:hover .pao-pd__h span{transform:scale(1.08)}
.pao-pd__r{position:absolute;left:0;bottom:0;width:100%;height:1px;opacity:0;margin:0;pointer-events:none}
.pao-pd__st:focus-within{outline:2px solid var(--e-global-color-accent,#AD6E3A);outline-offset:3px}
.pao-pd__cap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid var(--e-global-color-psalvi2,#DCE3EC)}
.pao-pd__t{display:block;font:400 22px/1.25 Jost,sans-serif;color:var(--e-global-color-secondary,#13213A)}.pao-pd__s{font-size:14px;color:var(--e-global-color-ptenue2,#8790A0)}
.pao-pd__n{font:300 22px Jost,sans-serif;color:var(--e-global-color-primary,#1F3A5F);letter-spacing:1px;white-space:nowrap}
.pao-pd__ths{display:grid;gap:8px;margin-top:14px}
.pao-pd__th{position:relative;aspect-ratio:1;border:0;padding:0;background-repeat:no-repeat;cursor:pointer;opacity:.5;outline:2px solid transparent;outline-offset:2px;transition:opacity .2s,outline-color .2s;border-radius:0}
.pao-pd__th:hover,.pao-pd__th.is-on{opacity:1}.pao-pd__th.is-on{outline-color:var(--e-global-color-primary,#1F3A5F)}
.pao-pd.is-cambio .pao-pd__l{opacity:.15}
.pao-pd.is-dissolvi .pao-pd__prima{clip-path:none!important;transition:none}
.pao-pd.is-dissolvi .pao-pd__h{opacity:0}
.pao-pd.is-auto .pao-pd__th.is-on::after{content:"";position:absolute;left:0;bottom:-7px;height:2px;width:calc(var(--p,0) * 100%);background:var(--e-global-color-accent,#AD6E3A)}
.pao-pd.is-auto.is-dissolvi .pao-pd__tag--a{transition:opacity .4s}
.pao-pd.is-dopo .pao-pd__tag--a{opacity:0}

/* --- 5. Caroselli prodotti e card WooCommerce ---
   Gli !important servono finche' la tipografia di sistema "Primary" del kit ha una dimensione (44px):
   i widget WooCommerce di Elementor Pro la usano come valore predefinito. Vedi LEGGIMI. */
.pao-carosello.elementor-wc-products ul.products {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    gap: 24px !important;
    margin: 0 !important;
    padding: 4px 2px 12px !important;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.pao-carosello.elementor-wc-products ul.products::-webkit-scrollbar {
    display: none;
}
.pao-carosello.elementor-wc-products ul.products li.product {
    flex: 0 0 calc((100% - 72px) / 4) !important;
    max-width: calc((100% - 72px) / 4) !important;
    width: calc((100% - 72px) / 4) !important;
    scroll-snap-align: start;
    margin: 0 !important;
}
@media(max-width: 1024px) {
    .pao-carosello.elementor-wc-products ul.products { gap: 18px !important; }
    .pao-carosello.elementor-wc-products ul.products li.product {
        flex: 0 0 calc((100% - 36px) / 3) !important;
        max-width: calc((100% - 36px) / 3) !important;
        width: calc((100% - 36px) / 3) !important;
    }
}
@media(max-width: 767px) {
    .pao-carosello.elementor-wc-products ul.products { gap: 14px !important; }
    .pao-carosello.elementor-wc-products ul.products li.product {
        flex: 0 0 calc((100% - 14px) / 2) !important;
        max-width: calc((100% - 14px) / 2) !important;
        width: calc((100% - 14px) / 2) !important;
    }
}

.woocommerce ul.products li.product,
.elementor-wc-products ul.products li.product {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    background: #fff !important;
    border: 1px solid var(--e-global-color-psalvi2, #DCE3EC) !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    text-align: center;
}
.woocommerce ul.products li.product:hover,
.elementor-wc-products ul.products li.product:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px -18px rgba(19, 33, 58, .22);
    border-color: var(--e-global-color-primary, #1F3A5F) !important;
}
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link,
.elementor-wc-products ul.products li.product > a.woocommerce-LoopProduct-link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-decoration: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: 1 1 auto; /* spinge il pulsante in fondo: CTA allineate in tutte le card */
}
.woocommerce ul.products li.product img,
.elementor-wc-products ul.products li.product img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    margin: 0 0 14px 0 !important;
    display: block !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.elementor-wc-products ul.products li.product .woocommerce-loop-product__title {
    font: 400 17px/1.35 Jost, sans-serif !important;
    letter-spacing: .2px !important;
    color: var(--e-global-color-secondary, #13213A) !important;
    padding: 0 14px !important;
    margin: 0 0 8px 0 !important;
    min-height: 2.7em;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.woocommerce ul.products li.product .price,
.elementor-wc-products ul.products li.product .price {
    font: 600 19px/1.2 Manrope, sans-serif !important;
    color: var(--e-global-color-primary, #1F3A5F) !important;
    margin: 0 0 16px 0 !important;
    padding: 0 14px !important;
    display: flex !important;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
    gap: 4px 10px;
}
/* il widget Prodotti di Elementor da' a prezzo e prezzo barrato la tipografia "Titoli" (44px) */
.woocommerce ul.products li.product .price :is(.amount, bdi),
.elementor-wc-products ul.products li.product .price :is(.amount, bdi) {
    font: inherit !important;
}
.woocommerce ul.products li.product .price ins,
.elementor-wc-products ul.products li.product .price ins {
    font: inherit !important;
    text-decoration: none !important;
    color: var(--e-global-color-accent, #AD6E3A) !important;
    order: 1;
}
.woocommerce ul.products li.product .price del,
.elementor-wc-products ul.products li.product .price del {
    font: 400 14px/1.2 Manrope, sans-serif !important;
    color: var(--e-global-color-ptenue2, #8790A0) !important;
    opacity: 1;
    order: 2;
}
.woocommerce ul.products li.product .button,
.elementor-wc-products ul.products li.product .button {
    display: inline-block !important;
    width: auto !important;
    font: 600 11px/1 Manrope, sans-serif !important;
    letter-spacing: 1.6px !important;
    text-transform: uppercase !important;
    color: #fff !important;
    background: var(--e-global-color-primary, #1F3A5F) !important;
    border: 1px solid var(--e-global-color-primary, #1F3A5F) !important;
    border-radius: 0 !important;
    padding: 12px 18px !important;
    margin: auto 16px 0 16px !important;
    transition: background .2s, border-color .2s;
    text-decoration: none !important;
    /* sempre visibile: il CSS del kit lo mostrava solo al passaggio del mouse */
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}
.woocommerce ul.products li.product .button:hover,
.elementor-wc-products ul.products li.product .button:hover {
    background: var(--e-global-color-secondary, #13213A) !important;
    border-color: var(--e-global-color-secondary, #13213A) !important;
    color: #fff !important;
}

/* --- 6. Moduli WooCommerce, WhatsApp, frecce dei caroselli --- */
.woocommerce form .form-row label,.woocommerce-page form .form-row label{font:600 12px/1.4 Manrope,sans-serif!important;letter-spacing:1.2px;text-transform:uppercase;color:var(--e-global-color-secondary,#13213A);margin-bottom:6px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row select,.woocommerce form .form-row textarea,.woocommerce-page form .form-row input.input-text,.woocommerce-page form .form-row select,.woocommerce-page form .form-row textarea{font:400 15px/1.5 Manrope,sans-serif!important;color:var(--e-global-color-secondary,#13213A)!important;background:#fff;border:1px solid var(--e-global-color-psalvi2,#DCE3EC)!important;border-radius:0!important;padding:11px 14px!important}
.pao-wa{position:fixed;right:20px;bottom:20px;z-index:997;display:flex;align-items:center;gap:10px;height:56px;padding:0 16px;border-radius:28px;background:#25D366;color:#fff;font:600 15px Manrope,sans-serif;text-decoration:none;box-shadow:0 10px 24px -8px rgba(19,33,58,.45);transition:bottom .35s,transform .2s}
.pao-wa:hover{transform:translateY(-2px);color:#fff}
.pao-wa svg{width:26px;height:26px;flex:none}
body.pao-satc-on .pao-wa{bottom:88px}
@media(max-width:767px){.pao-wa{width:56px;padding:0;justify-content:center;right:14px;bottom:14px}.pao-wa span{display:none}body.pao-satc-on .pao-wa{bottom:82px}}
@media print{.pao-wa{display:none}}
.pao-car-nav{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.pao-car-nav button{width:46px;height:46px;border-radius:50%;border:1px solid var(--e-global-color-psalvi2,#DCE3EC);background:#fff;color:var(--e-global-color-secondary,#13213A);display:grid;place-items:center;cursor:pointer;transition:background .2s,color .2s,opacity .2s;padding:0}
.pao-car-nav button:hover{background:var(--e-global-color-secondary,#13213A);color:#fff;border-color:var(--e-global-color-secondary,#13213A)}
.pao-car-nav button[disabled]{opacity:.35;cursor:default;background:#fff;color:var(--e-global-color-secondary,#13213A)}
.pao-car-nav[hidden]{display:none}

.pao-car-nav svg{width:18px;height:18px;display:block}
.pao-car-nav .pao-car-nav__next svg{transform:scaleX(-1)}

@media (prefers-reduced-motion:reduce){.pao-marquee .pao-marquee__track{animation:none}}

/* --- 7. Scheda prodotto: misure cinture, avvisi, guida, barra di acquisto --- */
.pao-av{display:flex;flex-direction:column;gap:10px;margin:2px 0}
.pao-av__badges{display:flex;flex-wrap:wrap;gap:8px}
.pao-av__badge{display:inline-block;background:var(--e-global-color-primary,#1F3A5F);color:#fff;font:600 11px/1 Manrope,sans-serif;letter-spacing:1.5px;text-transform:uppercase;padding:7px 11px}
.pao-av__msg{margin:0;padding:11px 14px;background:var(--e-global-color-psalvia,#EEF2F6);border-left:3px solid var(--e-global-color-primary,#1F3A5F);color:var(--e-global-color-secondary,#13213A);font-size:14px;line-height:1.5}
.pao-av__msg--importante{border-left-color:var(--e-global-color-accent,#AD6E3A);background:#FBF4EE}
.pao-av__msg--tempi{border-left-color:var(--e-global-color-accent,#AD6E3A)}
.pao-opz{margin:0 0 18px;width:100%}
.pao-opz__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}
.pao-opz__label{font:600 12px/1.4 Manrope,sans-serif;letter-spacing:1.6px;text-transform:uppercase;color:var(--e-global-color-secondary,#13213A)}
.pao-opz__label abbr{text-decoration:none;color:var(--e-global-color-accent,#AD6E3A)}
.pao-opz__guida,.pao-aiuto__link{background:none;border:0;padding:0;font:500 14px Manrope,sans-serif;color:var(--e-global-color-primary,#1F3A5F);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pao-opz__chips{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.pao-opz__chip{position:relative;cursor:pointer;margin:0}
.pao-opz__chip input{position:absolute;opacity:0;width:1px;height:1px}
.pao-opz__chip span{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 4px;border:1px solid var(--e-global-color-psalvi2,#DCE3EC);background:#fff;transition:border-color .2s,background .2s,color .2s}
.pao-opz__chip b{font:600 15px/1.1 Manrope,sans-serif;color:var(--e-global-color-secondary,#13213A)}
.pao-opz__chip small{font-size:12px;color:var(--e-global-color-ptenue2,#8790A0)}
.pao-opz__chip:hover span{border-color:var(--e-global-color-secondary,#13213A)}
.pao-opz__chip input:checked+span{background:var(--e-global-color-secondary,#13213A);border-color:var(--e-global-color-secondary,#13213A)}
.pao-opz__chip input:checked+span b,.pao-opz__chip input:checked+span small{color:#fff}
.pao-opz__chip input:focus-visible+span{outline:2px solid var(--e-global-color-accent,#AD6E3A);outline-offset:2px}
.pao-opz__altra{margin-top:12px}.pao-opz__altra label{display:block;font-size:14px;margin-bottom:6px;color:var(--e-global-color-secondary,#13213A)}
.pao-opz__altra input{width:140px;padding:10px 12px;border:1px solid var(--e-global-color-psalvi2,#DCE3EC)}
.pao-opz__msg{margin:10px 0 0;color:#B42318;font-size:14px}
.pao-opz.is-err .pao-opz__chip span{border-color:#B42318}
@media(max-width:480px){.pao-opz__chips{grid-template-columns:repeat(3,1fr)}}
.pao-aiuto{display:flex;flex-wrap:wrap;gap:12px 24px}
.pao-aiuto__link{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.pao-aiuto__link span{text-decoration:underline;text-underline-offset:3px}
.pao-guida{box-sizing:border-box;max-width:560px;width:calc(100% - 32px);max-height:calc(100vh - 32px);overflow:auto;margin:auto;border:0;padding:36px 32px 28px;box-shadow:0 30px 80px -20px rgba(19,33,58,.5);color:var(--e-global-color-text,#545D6B)}
.pao-guida::backdrop{background:rgba(19,33,58,.55)}
.pao-guida__x{position:absolute;top:10px;right:12px;width:40px;height:40px;border:0;background:none;font-size:28px;line-height:1;cursor:pointer;color:var(--e-global-color-secondary,#13213A)}
.pao-guida__k{margin:0;font:600 12px Manrope,sans-serif;letter-spacing:2.4px;text-transform:uppercase;color:var(--e-global-color-accent,#AD6E3A)}
.pao-guida h2{font:300 28px/1.2 Jost,sans-serif;color:var(--e-global-color-secondary,#13213A);margin:6px 0 12px}
.pao-guida p{font-size:15px;line-height:1.6}
.pao-guida table{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px}
.pao-guida th{background:var(--e-global-color-secondary,#13213A);color:#fff;font-weight:600;text-align:left;padding:10px 14px}
.pao-guida td{padding:9px 14px;border-bottom:1px solid var(--e-global-color-psalvi2,#DCE3EC);color:var(--e-global-color-secondary,#13213A)}
.pao-guida tr:nth-child(even) td{background:var(--e-global-color-psalvia,#EEF2F6)}
.pao-guida__nota{font-style:italic;color:var(--e-global-color-ptenue2,#8790A0)}
.pao-badge-loop{position:absolute;top:12px;right:12px;z-index:2;background:var(--e-global-color-primary,#1F3A5F);color:#fff;font:600 11px/1 Manrope,sans-serif;letter-spacing:1.5px;text-transform:uppercase;padding:6px 10px}
.pao-satc{position:fixed;left:0;right:0;bottom:0;z-index:998;display:none;align-items:center;gap:12px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -10px 30px -12px rgba(19,33,58,.35);transform:translateY(110%);transition:transform .35s ease}
.pao-satc img{width:48px;height:48px;object-fit:cover;flex:none}
.pao-satc__t{flex:1;min-width:0;display:flex;flex-direction:column;font-size:13px;line-height:1.3}
.pao-satc__t b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--e-global-color-secondary,#13213A)}
.pao-satc__t span{color:var(--e-global-color-primary,#1F3A5F);font-weight:600}
.pao-satc__b{flex:none;border:0;background:var(--e-global-color-primary,#1F3A5F);color:#fff;font:500 14px Manrope,sans-serif;padding:12px 16px;cursor:pointer}
@media(max-width:1024px){.pao-satc{display:flex}body.pao-satc-on .pao-satc{transform:none}}
