/* ============================================================================
   REPliche PERFETTE — correzioni leggibilità MOBILE
   ----------------------------------------------------------------------------
   Incluso da tutte le pagine. Contiene SOLO override di leggibilità e di
   contenimento del testo: non cambia struttura, colori o comportamento.

   Copre i problemi rilevati nell'audit:
   1. Micro-testi 6–8 px (0.39–0.50rem) usati nei badge, nelle CTA delle card,
      negli indicatori SET/STOCK/confronto e nei footer.
   2. Titoli hero troppo grandi generati da clamp() con minimo enorme
      (21–28vw), che su 320–390 px occupano l'intero viewport.
   3. Etichette troncate con white-space:nowrap + text-overflow:ellipsis.
   4. Elementi a altezza fissa (46–48 px) che tagliano il testo una volta
      ingrandito.
   ========================================================================= */

/* ==========================================================================
   PULSANTI FLOTTANTI (Trustpilot / WhatsApp)
   --------------------------------------------------------------------------
   Aggiunti a tutte le pagine. Servono due regole perché molte pagine hanno una
   barra fissa in basso (.bottom-utility-dock, .mobile-activity-bar,
   .set-mobile-progress, .stock-mobile-bar): i pulsanti vanno alzati sopra la
   barra invece di sovrapporsi.
   ========================================================================== */
:root{
  --rp-fab-bottom:max(16px,env(safe-area-inset-bottom));
  --rp-fab-gap:.6rem;
  --rp-fab-size:48px;
}
.floating-actions{
  position:fixed;
  z-index:1200;
  right:max(14px,env(safe-area-inset-right));
  /* la posizione dipende da eventuali barre fisse in basso (vedi sotto):
     deve usare la variabile, non un valore fisso, altrimenti le regole
     piu' specifiche per SET/STOCK non hanno effetto. */
  bottom:var(--rp-fab-bottom);
  display:flex;
  align-items:flex-end;
  gap:var(--rp-fab-gap);
  max-width:calc(100% - 28px);
  pointer-events:none;
}
.float-action{
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  height:var(--rp-fab-size);
  padding:0 .95rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(17,16,15,.86);
  color:#f4efe7;
  box-shadow:0 14px 35px rgba(0,0,0,.28);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  font-size:.69rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s cubic-bezier(.2,.8,.2,1),border-color .3s cubic-bezier(.2,.8,.2,1);
}
.float-action:hover{transform:translateY(-3px);background:rgba(31,29,26,.95);border-color:rgba(223,201,166,.34)}
.float-action .float-icon{
  width:25px;height:25px;border-radius:50%;
  display:grid;place-items:center;flex:0 0 auto;
}
.float-action.trust .float-icon{background:#00b67a;color:#fff;font-size:1rem;line-height:1}
.float-action.whatsapp .float-icon{background:#f0ece4;color:#141311}
.float-action.whatsapp svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.float-action strong{font-weight:500}

@media (max-width:759px){
  .floating-actions{
    right:max(10px,env(safe-area-inset-right));
    /* NON impostare `bottom` qui: userebbe un valore fisso e ignorerebbe
       le regole che alzano i pulsanti sopra le barre SET/STOCK. */
    bottom:var(--rp-fab-bottom);
    gap:.45rem;
    max-width:calc(100% - 20px);
  }
  .float-action{width:46px;height:46px;padding:0;border-radius:50%}
  .float-action strong{display:none}
  .float-action .float-icon{width:29px;height:29px;background:transparent!important}
  .float-action.trust .float-icon{color:#00b67a}
  .float-action.whatsapp .float-icon{color:#f1ede5}
}

/* Pagine con barra fissa in basso (dock + barra attività): alza i pulsanti. */
body:has(.bottom-utility-dock) .floating-actions{--rp-fab-bottom:max(134px,calc(env(safe-area-inset-bottom) + 126px))}
body:has(.set-mobile-progress) .floating-actions{--rp-fab-bottom:max(140px,calc(env(safe-area-inset-bottom) + 132px))}
body:has(.stock-mobile-bar) .floating-actions,
body:has(#stockMobileBar) .floating-actions{--rp-fab-bottom:max(150px,calc(env(safe-area-inset-bottom) + 142px))}
@media (min-width:760px){
  body:has(.step-bottom-bar) .floating-actions{--rp-fab-bottom:max(88px,calc(env(safe-area-inset-bottom) + 82px))}
  body:has(.stock-mobile-bar) .floating-actions,
  body:has(#stockMobileBar) .floating-actions{--rp-fab-bottom:max(88px,calc(env(safe-area-inset-bottom) + 82px))}
}

/* --------------------------------------------------------------------------
   NIENTE SOVRAPPOSIZIONI
   --------------------------------------------------------------------------
   1) Quando si apre il menu laterale il pulsante "Offerta a tempo" deve
      sparire: resta visibile solo il menu.
   2) Quando si crea un SET o uno STOCK si aprono drawer e barre di avanzamento
      che finivano sotto i pulsanti Trustpilot/WhatsApp: qui li nascondiamo
      finché il drawer è aperto, così non si sovrappongono a nulla.
   -------------------------------------------------------------------------- */

/* Offerta a tempo: nascosta solo mentre il menu è aperto. */
body:has(#menuDrawer.open) #timeOfferFloat,
body:has(.menu-drawer.open) #timeOfferFloat,
body:has(#menuDrawer.open) .time-offer-float{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(14px)!important;
}

/* SET / STOCK / confronto aperti: i pulsanti flottanti si ritirano. */
body:has(#setDrawer.open) .floating-actions,
body:has(#stockDrawer.open) .floating-actions,
body:has(#compareDrawer.open) .floating-actions,
body:has(#quickViewDrawer.open) .floating-actions,
body:has(#offerQuickViewDrawer.open) .floating-actions,
body:has(#setProductPickerDrawer.open) .floating-actions,
body:has(#sizeGuideDrawer.open) .floating-actions,
body:has(#stockGuideDrawer.open) .floating-actions,
body:has(#stockSummaryDrawer.open) .floating-actions,
body:has(#stockFullSummaryDrawer.open) .floating-actions,
body:has(.set-mobile-progress.visible) .floating-actions,
body:has(.stock-mobile-bar.visible) .floating-actions,
body:has(#stockMobileBar.visible) .floating-actions{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.floating-actions{transition:opacity .25s var(--ease, cubic-bezier(.2,.8,.2,1)),visibility .25s}

/* --------------------------------------------------------------------------
   CONFRONTO E GUIDE COME FINESTRA POPUP
   --------------------------------------------------------------------------
   Il confronto si apriva come pannello laterale: su mobile era poco leggibile.
   Ora è una finestra centrata, con intestazione, contenuto scrollabile e
   pulsante di chiusura sempre visibile.
   -------------------------------------------------------------------------- */
.rp-popup-drawer{
  position:fixed!important;
  z-index:1500!important;
  top:50%!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:min(760px,calc(100vw - 24px))!important;
  max-height:min(86dvh,760px)!important;
  height:auto!important;
  border-radius:22px!important;
  overflow:hidden!important;
  transform:translate(-50%,-46%) scale(.985)!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s!important;
}
.rp-popup-drawer.open{
  transform:translate(-50%,-50%) scale(1)!important;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.rp-popup-drawer .drawer-head{
  position:sticky;
  top:0;
  z-index:2;
  background:inherit;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.rp-popup-drawer .drawer-body{
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  max-height:calc(min(86dvh,760px) - 74px);
  padding-bottom:max(1rem,env(safe-area-inset-bottom));
}
.rp-popup-drawer .compare-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.rp-popup-drawer .compare-table{min-width:520px}

@media (max-width:759px){
  .rp-popup-drawer{
    width:calc(100vw - 16px)!important;
    max-height:min(88dvh,720px)!important;
    border-radius:20px!important;
  }
  .rp-popup-drawer .drawer-body{max-height:calc(min(88dvh,720px) - 70px)}
  .rp-popup-drawer .compare-table{min-width:460px}
}

/* --------------------------------------------------------------------------
   SET E STOCK: PULSANTE "AGGIUNGI AL CARRELLO" DENTRO IL PANNELLO
   --------------------------------------------------------------------------
   Nelle pagine SET e STOCK il carrello si apriva senza modo di aggiungere
   direttamente la composizione. Questo blocco, creato dallo script, dà il
   pulsante principale e lascia le azioni secondarie in secondo piano.
   -------------------------------------------------------------------------- */
.rp-add-cart-block{
  margin:1rem 0 .6rem;
  padding:1rem;
  border:1px solid rgba(0,0,0,.1);
  border-radius:16px;
  background:rgba(255,255,255,.55);
}
.rp-add-cart-block .rp-add-summary{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.7rem;
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.75;
}
.rp-add-cart-block .rp-add-total{
  font-family:var(--serif,Georgia,serif);
  font-size:1.5rem;
  letter-spacing:0;
  text-transform:none;
  opacity:1;
}
.rp-add-cart-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  width:100%;
  min-height:52px;
  padding:.85rem 1.1rem;
  border:0;
  border-radius:999px;
  background:#141311;
  color:#f8f4ec;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
}
.rp-add-cart-btn:hover{background:#221f1b}
.rp-add-cart-btn[disabled]{opacity:.45;cursor:not-allowed}
.rp-add-cart-hint{
  margin:.55rem 0 0;
  font-size:.72rem;
  line-height:1.5;
  text-align:center;
  opacity:.7;
}
@media (max-width:759px){
  .rp-add-cart-block{padding:.85rem;border-radius:14px}
  .rp-add-cart-block .rp-add-total{font-size:1.3rem}
  .rp-add-cart-btn{min-height:50px;font-size:.76rem}
  .rp-add-cart-hint{font-size:.72rem}
}

/* Il carrello della pagina non deve restare senza il pulsante di checkout
   anche quando l'utente arriva qui da SET o STOCK. */
.rp-checkout-block{margin-top:1rem}
.rp-checkout-btn{
  display:block;
  width:100%;
  padding:.95rem 1.1rem;
  border-radius:999px;
  background:#141311;
  color:#f8f4ec;
  text-align:center;
  text-decoration:none;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.rp-checkout-btn:hover{background:#221f1b}
.rp-checkout-note{
  margin:.6rem 0 0;
  font-size:.72rem;
  line-height:1.5;
  color:#766f66;
  text-align:center;
}

/* Blocchi SET/STOCK aggiunti dal sincronizzatore dove la pagina non li conosce */
.rp-cart-groups{margin-top:.6rem}
.rp-cart-groups .cart-group-block{
  margin:0 0 .9rem;
  padding:.9rem;
  border:1px solid rgba(0,0,0,.1);
  border-radius:16px;
}
.rp-cart-groups .cart-group-block h3{
  font-family:var(--serif,Georgia,serif);
  font-weight:400;
  margin:.25rem 0 .5rem;
}
.rp-cart-groups .cart-group-actions{
  display:flex;
  gap:.5rem;
  margin-top:.7rem;
}
.rp-cart-groups .cart-group-actions>*{flex:1 1 0}
.rp-cart-groups .cart-set-line{padding:.45rem 0;border-bottom:1px solid rgba(0,0,0,.06)}
.rp-cart-groups .cart-set-line:last-child{border-bottom:0}
.rp-cart-groups .cart-stock-alloc{font-size:.72rem;opacity:.75;margin:.2rem 0 .4rem}

/* ==========================================================================
   RETI DI SICUREZZA
   ========================================================================== */

/* Immagini non ancora caricate nella cartella: il browser mostrerebbe l'icona
   di immagine rotta. rp-shared.js intercetta l'errore e aggiunge .rp-img-missing,
   che disegna un segnaposto neutro. Nessun effetto sulle immagini presenti. */
img.rp-img-missing{
  background-color:#e5ded3;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a89f91' stroke-width='1.2'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 16l5-4 4 3 3-2 6 5'/%3E%3Ccircle cx='9' cy='9' r='1.4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:min(38%,64px);
  min-height:60px;
}

/* ------------------------------------------------------------------ mobile */
@media (max-width:759px){

  /* --- 1. micro-testi: portiamo il pavimento a 0.7rem (≈11.2px) --- */
  .card-link,
  .card-badge,
  .product-meta,
  .product-meta span,
  .attribute span,
  .quick-section-title,
  .quick-image-hint,
  .compare-attribute-block>strong,
  .compare-mini-card button,
  .drawer-kicker,
  .menu-links b,
  .menu-links small,
  .menu-kicker,
  .footer-col h3,
  .footer-bottom,
  .footer-note-placeholder,
  .mini-progress+.summary-row span,
  .rounding-note,
  .cart-source,
  .cart-variant,
  .set-composition span,
  .set-card .subtitle,
  .stock-card-meta,
  .stock-rule-badge,
  .stock-compact-meta,
  .discovery-assistant,
  .discovery-label,
  .card-activity-cue,
  .slot-overlay .slot-label,
  .language-menu small,
  .menu-language-options small,
  .menu-language-status{
    font-size:.7rem!important;
    line-height:1.4;
  }

  /* --- 2. CTA e pulsanti delle card --- */
  .bag-set-cta,.bag-stock-cta,.bag-compare-cta,
  .shoe-set-cta,.shoe-stock-cta,.shoe-compare-cta,
  .watch-set-cta,.watch-stock-cta,.watch-compare-cta,
  .jewel-set-cta,.jewel-stock-cta,.jewel-compare-cta,
  .accessory-set-cta,.accessory-stock-cta,.accessory-compare-cta{
    font-size:.68rem!important;
    padding:.4rem .3rem!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.25;
    min-height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .bag-cart-cta,.shoe-cart-cta,.watch-cart-cta,
  .jewel-cart-cta,.accessory-cart-cta{
    font-size:.72rem!important;
    min-height:42px!important;
    white-space:normal!important;
  }

  /* la riga secondaria deve poter andare a capo invece di troncare */
  .card-secondary-row{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:.35rem!important;
  }
  .card-secondary-row>*{
    flex:1 1 auto!important;
    min-width:max(84px,30%)!important;
    max-width:none!important;
  }

  /* --- 3. indicatori SET / STOCK / confronto: niente altezza fissa --- */
  .set-indicator,
  .stock-indicator,
  .compare-indicator{
    height:auto!important;
    min-height:44px!important;
    max-width:100%!important;
    padding:.5rem .7rem!important;
  }
  .set-indicator span,
  .stock-indicator span,
  .compare-indicator span,
  .set-indicator strong,
  .stock-indicator strong,
  .compare-indicator strong{
    font-size:.7rem!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.35;
  }

  /* --- 4. barra attività mobile e dock --- */
  .mobile-activity-bar button{
    font-size:.68rem!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    min-height:44px!important;
    line-height:1.25;
    height:auto!important;
    flex:1 1 auto!important;
  }
  .bottom-utility-dock{
    flex-wrap:wrap!important;
    gap:.45rem!important;
  }
  .stock-qty-presets button{font-size:.72rem!important}

  /* --- 5. titoli hero: clamp() con minimo enorme --- */
  .hero-copy h1,
  .set-hero-copy h1,
  .stock-hero h1,
  .offer-hero h1,
  .about-hero h1,
  .faq-hero h1{
    font-size:clamp(2.1rem,9vw,3.4rem)!important;
    line-height:1.1!important;
    text-wrap:pretty;
    overflow-wrap:anywhere;
  }
  .hero-copy p,
  .hero-sub,
  .set-hero-copy p,
  .stock-hero p,
  .offer-hero p{
    font-size:.95rem!important;
    line-height:1.6!important;
  }

  /* --- 6. menu laterale: mai nowrap su etichette lunghe --- */
  .menu-links a{
    font-size:1.05rem!important;
    height:auto!important;
    min-height:48px;
    padding-top:.6rem;
    padding-bottom:.6rem;
  }
  .menu-links a>span{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.3;
  }
  .menu-star-badge,.menu-time-badge{flex:0 0 24px!important}

  /* --- 7. footer --- */
  .footer-col a{font-size:.86rem!important;line-height:1.6}
  .footer-col h3{font-size:.72rem!important;letter-spacing:.12em}
  .footer-bottom{font-size:.72rem!important}

  /* --- 8. mini-card e pannelli con testi piccoli --- */
  .mini-product strong{font-size:.88rem!important}
  .mini-product small{font-size:.74rem!important}
  .search-result small,
  .search-result strong{font-size:.78rem!important}
  .match-card small{font-size:.74rem!important}
  .match-card .match-score{font-size:.68rem!important}
  .pricing-row,
  .summary-row{font-size:.84rem!important}
  .summary-row.total{font-size:1.3rem!important}
  .quick-detail h2{font-size:clamp(1.5rem,7vw,2.1rem)!important;line-height:1.15!important}
  .consult-question h2{font-size:clamp(1.6rem,8vw,2.4rem)!important;line-height:1.15!important}
  .set-builder-title h2,
  .picker-intro h3{font-size:clamp(1.4rem,6.5vw,2rem)!important;line-height:1.18!important}
  .stock-builder-card h2,
  .stock-product-card strong{font-size:1.15rem!important}
  .drawer-head h2{font-size:1.45rem!important}
  .empty-state h2{font-size:1.4rem!important;line-height:1.2!important}
  .empty-state p{font-size:.9rem!important}
}

/* --------------------------------------------------- schermi molto stretti */
@media (max-width:420px){
  .card-link,
  .card-badge,
  .product-meta,
  .product-meta span,
  .cart-source,
  .set-composition span,
  .discovery-assistant,
  .discovery-label,
  .stock-card-meta{
    font-size:.66rem!important;
  }
  .bag-set-cta,.bag-stock-cta,.bag-compare-cta,
  .shoe-set-cta,.shoe-stock-cta,.shoe-compare-cta,
  .watch-set-cta,.watch-stock-cta,.watch-compare-cta,
  .jewel-set-cta,.jewel-stock-cta,.jewel-compare-cta,
  .accessory-set-cta,.accessory-stock-cta,.accessory-compare-cta{
    font-size:.64rem!important;
  }
  .hero-copy h1,
  .set-hero-copy h1,
  .stock-hero h1,
  .offer-hero h1,
  .about-hero h1{
    font-size:clamp(1.85rem,8.6vw,2.6rem)!important;
  }
  .menu-links a{font-size:1rem!important}
}

@media (max-width:350px){
  .hero-copy h1,
  .set-hero-copy h1,
  .stock-hero h1,
  .offer-hero h1{
    font-size:clamp(1.7rem,8.4vw,2.2rem)!important;
  }
  .bag-compare-cta,.shoe-compare-cta,.watch-compare-cta,
  .jewel-compare-cta,.accessory-compare-cta{
    font-size:.62rem!important;
  }
}

/* I blocchi SET/STOCK nativi della pagina vengono nascosti quando lo script di
   sincronizzazione ne disegna di equivalenti ma uniformi su tutte le pagine. */
.rp-native-group{display:none!important}