/* =========================================================
   CAMPISI HEADER V5 — dedicated stylesheet
   Loaded after the theme CSS from head.tpl.
   Desktop >= 1200, tablet 768–1199. Mobile <= 767 untouched.
   ========================================================= */

.header_v2 .header-center .header-shipping-card,
.header_v2 .header-center .header-shipping-card * {
  box-sizing: border-box;
}

.header_v2 .header-center .header-shipping-card {
  background: #fff;
  border: 1px solid #d5dde3;
  border-radius: 8px;
  overflow: hidden;
}

.header_v2 .header-center .header-shipping-details:focus,
.header_v2 .header-center .header-shipping-details:focus-visible,
.header_v2 .header-center #header_search .spr-query:focus,
.header_v2 .header-center #header_search .spr-query:focus-visible,
.header_v2 .header-center #header_search .spr-search-button:focus,
.header_v2 .header-center #header_search .spr-search-button:focus-visible,
.header_v2 .header-center #header-logo > a:focus,
.header_v2 .header-center #header-logo > a:focus-visible,
.header_v2 .header-center .header-marzamemi-card > a:focus,
.header_v2 .header-center .header-marzamemi-card > a:focus-visible {
  outline: 3px solid #0073aa !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #fff !important;
  position: relative !important;
  z-index: 50 !important;
}

.header_v2 .header-center #header-logo > a:focus::after,
.header_v2 .header-center #header-logo > a:focus-visible::after,
.header_v2 .header-center .header-marzamemi-card > a:focus::after,
.header_v2 .header-center .header-marzamemi-card > a:focus-visible::after {
  content: none !important;
}

/* Shared 768+ ------------------------------------------------ */
@media (min-width: 768px) {
  .header_v2 .header-center {
    background: #fff !important;
    border-bottom: 1px solid #e6eaed;
  }

  .header_v2 .header-center .header-center-main-row {
    display: grid !important;
    float: none !important;
    align-items: center !important;
    margin: 0 !important;
  }

  .header_v2 .header-center #header-logo,
  .header_v2 .header-center .header-brand-copy,
  .header_v2 .header-center #header_search,
  .header_v2 .header-center .header-shipping-panel,
  .header_v2 .header-center .header-marzamemi-card {
    float: none !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .header_v2 .header-center #header-logo {
    grid-area: brand;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .header_v2 .header-center #header-logo > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 5px;
  }

  .header_v2 .header-center #header-logo .logo {
    display: block !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  .header_v2 .header-center .header-brand-copy {
    grid-area: copy;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-center #titlehome {
    margin: 0 0 3px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #111 !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: left !important;
    text-transform: none !important;
    letter-spacing: -.01em !important;
  }

  .header_v2 .header-center #subtitlehome {
    margin: 0 !important;
    padding: 0 !important;
    color: #454d53 !important;
    line-height: 1.35 !important;
    text-align: left !important;
  }

  .header_v2 .header-center #header_search {
    grid-area: search;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-center #header_search .spSearchPro,
  .header_v2 .header-center #header_search .spr-container,
  .header_v2 .header-center #header_search .sprsearch-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  .header_v2 .header-center #header_search .sprsearch-form {
    display: flex !important;
    align-items: stretch !important;
    overflow: visible !important;
  }

  .header_v2 .header-center #header_search .content-search {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    display: block !important;
  }

  .header_v2 .header-center #header_search .spr-query {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    border: 1px solid #0070bd !important;
    border-right: 0 !important;
    border-radius: 5px 0 0 5px !important;
    background: #fff !important;
    color: #222 !important;
    box-sizing: border-box !important;
  }

  .header_v2 .header-center #header_search .spr-query::placeholder {
    color: #596169 !important;
    opacity: 1 !important;
  }

  .header_v2 .header-center #header_search .spr-search-button {
    flex: 0 0 auto !important;
    margin: 0 !important;
    border: 1px solid #016ab7 !important;
    border-radius: 0 5px 5px 0 !important;
    background: #016ab7 !important;
    color: #fff !important;
    cursor: pointer !important;
  }

  .header_v2 .header-center #header_search .spr-search-button:hover {
    background: #005b9f !important;
    border-color: #005b9f !important;
  }

  .header_v2 .header-center .header-marzamemi-card {
    grid-area: live;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    border: 1px solid #d7e0e5;
    border-radius: 7px;
    background: #fff;
  }

  .header_v2 .header-center .header-marzamemi-card img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }

  .header_v2 .header-center .header-shipping-panel {
    grid-area: ship;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .header_v2 .header-center .header-shipping-card {
    display: grid !important;
    width: 100% !important;
    align-items: stretch !important;
  }

  .header_v2 .header-center .header-shipping-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    background: #f3f8fb !important;
    border-right: 1px solid #d5dde3 !important;
    text-align: center !important;
  }

  .header_v2 .header-center .header-shipping-head .fa {
    color: #016ab7 !important;
    line-height: 1 !important;
  }

  .header_v2 .header-center .header-shipping-title {
    display: block !important;
    color: #17242d !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
    letter-spacing: .035em !important;
  }

  .header_v2 .header-center .header-shipping-zone {
    display: block !important;
    min-width: 0 !important;
    background: #fff !important;
  }

  .header_v2 .header-center .header-shipping-zone + .header-shipping-zone {
    border-left: 1px solid #d5dde3 !important;
  }

  .header_v2 .header-center .header-shipping-zone-title {
    display: block !important;
    color: #222 !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
  }

  .header_v2 .header-center .header-shipping-rates {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-center .header-shipping-rate {
    margin: 0 !important;
    text-align: center !important;
    border-left: 1px solid #e1e5e8 !important;
  }

  .header_v2 .header-center .header-shipping-rate:first-child {
    border-left: 0 !important;
  }

  .header_v2 .header-center .header-shipping-rate dt,
  .header_v2 .header-center .header-shipping-rate dd {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    text-align: center !important;
  }

  .header_v2 .header-center .header-shipping-rate dt {
    color: #4d565d !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }

  .header_v2 .header-center .header-shipping-rate dd {
    color: #111 !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
  }

  .header_v2 .header-center .header-shipping-eu-copy {
    margin: 0 !important;
    color: #343b40 !important;
    line-height: 1.35 !important;
  }

  .header_v2 .header-center .header-shipping-eu-copy strong {
    color: #111 !important;
    font-weight: 700 !important;
  }

  .header_v2 .header-center .header-shipping-details {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    background: #fff !important;
    border-left: 1px solid #d5dde3 !important;
    color: #005b9f !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    text-decoration: none !important;
  }

  .header_v2 .header-center .header-shipping-details:hover {
    background: #f3f8fb !important;
    color: #004d87 !important;
  }
}

/* Desktop >=1200 ------------------------------------------- */
@media (min-width: 1200px) {
  .header_v2 .header-center {
    padding: 16px 0 18px !important;
  }

  .header_v2 .header-center .container {
    width: 1500px !important;
    max-width: calc(100% - 48px) !important;
  }

  .header_v2 .header-center .header-center-main-row {
    grid-template-columns: 250px minmax(560px,1fr) 250px !important;
    grid-template-areas:
      "brand copy live"
      "brand search live"
      "brand ship live" !important;
    column-gap: 28px !important;
    row-gap: 8px !important;
  }

  .header_v2 .header-center .header-center-main-row.header-no-copy {
    grid-template-areas:
      "brand search live"
      "brand ship live" !important;
  }

  .header_v2 .header-center #header-logo .logo {
    width: 240px !important;
    max-width: 100% !important;
  }

  .header_v2 .header-center #titlehome { font-size: 1.45rem !important; }
  .header_v2 .header-center #subtitlehome { font-size: 1.02rem !important; }

  .header_v2 .header-center #header_search .spr-query {
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 18px !important;
    font-size: 16px !important;
  }

  .header_v2 .header-center #header_search .spr-search-button {
    width: 72px !important;
    min-width: 72px !important;
    height: 54px !important;
    min-height: 54px !important;
    font-size: 20px !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    max-width: 240px !important;
  }

  .header_v2 .header-center .header-shipping-card {
    grid-template-columns: 108px minmax(360px,1.35fr) minmax(255px,.9fr) 108px !important;
    min-height: 78px !important;
  }

  .header_v2 .header-center .header-shipping-head { padding: 9px 10px !important; }
  .header_v2 .header-center .header-shipping-head .fa { font-size: 22px !important; }
  .header_v2 .header-center .header-shipping-title { font-size: 12px !important; }
  .header_v2 .header-center .header-shipping-zone { padding: 9px 13px !important; }
  .header_v2 .header-center .header-shipping-zone-title { margin-bottom: 5px !important; font-size: 13px !important; }
  .header_v2 .header-center .header-shipping-rate { padding: 0 8px !important; }
  .header_v2 .header-center .header-shipping-rate dt { font-size: 11px !important; }
  .header_v2 .header-center .header-shipping-rate dd { font-size: 18px !important; }
  .header_v2 .header-center .header-shipping-eu-copy { font-size: 12px !important; }
  .header_v2 .header-center .header-shipping-eu-copy strong { font-size: 14px !important; }
  .header_v2 .header-center .header-shipping-details { min-width: 108px !important; padding: 8px 10px !important; font-size: 12px !important; }
}

/* Tablet 768–1199 ------------------------------------------ */
@media (min-width: 768px) and (max-width: 1199px) {
  .header_v2 .header-top .container,
  .header_v2 .header-center .container,
  .header_v2 .header-bottom .container {
    width: 100% !important;
    max-width: 100% !important;
  }

  .header_v2 .header-center {
    padding: 18px 0 16px !important;
  }

  .header_v2 .header-center .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .header_v2 .header-center .header-center-main-row {
    grid-template-columns: 170px minmax(0,1fr) 140px !important;
    grid-template-areas:
      "brand copy live"
      "brand search live"
      "ship ship ship" !important;
    column-gap: 16px !important;
    row-gap: 9px !important;
  }

  .header_v2 .header-center .header-center-main-row.header-no-copy {
    grid-template-areas:
      "brand search live"
      "ship ship ship" !important;
  }

  .header_v2 .header-center #header-logo .logo {
    width: 160px !important;
    max-width: 100% !important;
  }

  .header_v2 .header-center #titlehome { font-size: 1.18rem !important; }
  .header_v2 .header-center #subtitlehome { font-size: .9rem !important; }

  .header_v2 .header-center #header_search .spr-query {
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 13px !important;
    font-size: 15px !important;
  }

  .header_v2 .header-center #header_search .spr-search-button {
    width: 58px !important;
    min-width: 58px !important;
    height: 48px !important;
    min-height: 48px !important;
    font-size: 18px !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    max-width: 138px !important;
  }

  .header_v2 .header-center .header-shipping-panel {
    margin-top: 5px !important;
  }

  .header_v2 .header-center .header-shipping-card {
    grid-template-columns: 98px minmax(0,1.4fr) minmax(205px,.85fr) 92px !important;
    min-height: 80px !important;
  }

  .header_v2 .header-center .header-shipping-head { padding: 8px !important; }
  .header_v2 .header-center .header-shipping-head .fa { font-size: 20px !important; }
  .header_v2 .header-center .header-shipping-title { font-size: 11px !important; }
  .header_v2 .header-center .header-shipping-zone { padding: 9px 10px !important; }
  .header_v2 .header-center .header-shipping-zone-title { margin-bottom: 5px !important; font-size: 12px !important; }
  .header_v2 .header-center .header-shipping-rate { padding: 0 5px !important; }
  .header_v2 .header-center .header-shipping-rate dt { font-size: 10px !important; }
  .header_v2 .header-center .header-shipping-rate dd { font-size: 16px !important; }
  .header_v2 .header-center .header-shipping-eu-copy { font-size: 11px !important; }
  .header_v2 .header-center .header-shipping-eu-copy strong { font-size: 13px !important; }
  .header_v2 .header-center .header-shipping-details { min-width: 92px !important; padding: 7px 8px !important; font-size: 11px !important; }

  /* Top bar: keep controls on one line, but allow sensible wrapping inside the right cluster. */
  .header_v2 .header-top .row {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
  }

  .header_v2 .header-top .box-left,
  .header_v2 .header-top .box-right {
    float: none !important;
  }

  .header_v2 .header-top .box-left { flex: 0 0 auto !important; width: auto !important; }
  .header_v2 .header-top .box-right { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; }

}

/* Tablet narrow: shipping card wraps its details row instead of shrinking text. */
@media (min-width: 768px) and (max-width: 900px) {
  .header_v2 .header-center .header-shipping-card {
    grid-template-columns: 92px minmax(0,1.3fr) minmax(190px,.9fr) !important;
  }

  .header_v2 .header-center .header-shipping-details {
    grid-column: 1 / -1 !important;
    min-height: 36px !important;
    border-left: 0 !important;
    border-top: 1px solid #d5dde3 !important;
    padding: 6px 10px !important;
  }
}

/* =========================================================
   CAMPISI HEADER V7 — refinement desktop/tablet
   - centro titolo/sottotitolo
   - topbar tablet social allineati
   - header più compatto
   - menu tablet affiancati e mega-menu realmente apribile
   ========================================================= */

@media (min-width: 768px) {
  /* Brand copy centered over search */
  .header_v2 .header-center .header-brand-copy {
    text-align: center !important;
  }

  .header_v2 .header-center #titlehome,
  .header_v2 .header-center #subtitlehome {
    text-align: center !important;
  }

  .header_v2 .header-center #titlehome {
    color: #111820 !important;
    letter-spacing: -0.02em !important;
  }

  .header_v2 .header-center #subtitlehome {
    color: #39444c !important;
  }

  /* Cleaner search treatment */
  .header_v2 .header-center #header_search .spr-query {
    border-color: #0b70b7 !important;
    box-shadow: inset 0 1px 0 rgba(0,0,0,.02) !important;
  }

  .header_v2 .header-center #header_search .spr-search-button {
    background: #0674bd !important;
    border-color: #0674bd !important;
  }

  /* Shipping as a compact information card */
  .header_v2 .header-center .header-shipping-card {
    border-color: #cfdbe3 !important;
    box-shadow: 0 3px 12px rgba(28,61,82,.06) !important;
  }

  .header_v2 .header-center .header-shipping-head {
    background: #f0f7fb !important;
  }

  .header_v2 .header-center .header-shipping-details {
    background: #f8fbfd !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    box-shadow: 0 3px 12px rgba(28,61,82,.08) !important;
  }
}

@media (min-width: 1200px) {
  /* Slightly more elegant proportions on desktop */
  .header_v2 .header-center {
    padding-top: 14px !important;
    padding-bottom: 16px !important;
  }

  .header_v2 .header-center .header-center-main-row {
    grid-template-columns: 250px minmax(600px,1fr) 250px !important;
    column-gap: 34px !important;
    row-gap: 9px !important;
  }

  .header_v2 .header-center .header-brand-copy {
    align-self: end !important;
  }

  .header_v2 .header-center #titlehome {
    font-size: 1.5rem !important;
    margin-bottom: 4px !important;
  }

  .header_v2 .header-center #subtitlehome {
    font-size: 1rem !important;
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  /* ---------- TOP BAR ---------- */
  .header_v2 .header-top {
    min-height: 48px !important;
  }

  .header_v2 .header-top .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .header_v2 .header-top .row {
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
  }

  .header_v2 .header-top .box-left,
  .header_v2 .header-top .box-right {
    min-height: 48px !important;
  }

  .header_v2 .header-top .box-left {
    display: flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
  }

  .header_v2 .header-top .header-top-left,
  .header_v2 .header-top .social-block {
    display: flex !important;
    align-items: center !important;
  }

  .header_v2 .header-top .social-block {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 7px !important;
    white-space: nowrap !important;
  }

  .header_v2 .header-top .socialicone {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  .header_v2 .header-top .socialicone a,
  .header_v2 .header-top .socialicone picture,
  .header_v2 .header-top .socialicone img {
    display: block !important;
  }

  .header_v2 .header-top .socialicone img {
    width: 30px !important;
    height: 30px !important;
  }

  .header_v2 .header-top .box-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  .header_v2 .header-top .header-top-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* ---------- CENTER HEADER ---------- */
  .header_v2 .header-center {
    padding: 10px 0 10px !important;
    margin: 0 !important;
  }

  .header_v2 .header-center .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .header_v2 .header-center .header-center-main-row {
    grid-template-columns: 145px minmax(0,1fr) 128px !important;
    grid-template-areas:
      "brand copy live"
      "brand search live"
      "ship ship ship" !important;
    column-gap: 14px !important;
    row-gap: 7px !important;
    align-items: center !important;
  }

  .header_v2 .header-center #header-logo .logo {
    width: 140px !important;
  }

  .header_v2 .header-center #titlehome {
    font-size: 1.12rem !important;
    margin-bottom: 2px !important;
  }

  .header_v2 .header-center #subtitlehome {
    font-size: .84rem !important;
    line-height: 1.25 !important;
  }

  .header_v2 .header-center #header_search .spr-query {
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 12px !important;
    font-size: 14px !important;
  }

  .header_v2 .header-center #header_search .spr-search-button {
    width: 52px !important;
    min-width: 52px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    max-width: 124px !important;
  }

  .header_v2 .header-center .header-shipping-panel {
    margin-top: 2px !important;
  }

  .header_v2 .header-center .header-shipping-card {
    grid-template-columns: 78px minmax(0,1.6fr) minmax(185px,.95fr) !important;
    min-height: 62px !important;
  }

  .header_v2 .header-center .header-shipping-head {
    padding: 6px !important;
  }

  .header_v2 .header-center .header-shipping-head .fa {
    font-size: 18px !important;
  }

  .header_v2 .header-center .header-shipping-title {
    font-size: 10px !important;
  }

  .header_v2 .header-center .header-shipping-zone {
    padding: 6px 8px !important;
  }

  .header_v2 .header-center .header-shipping-zone-title {
    margin-bottom: 3px !important;
    font-size: 10px !important;
  }

  .header_v2 .header-center .header-shipping-rate {
    padding: 0 4px !important;
  }

  .header_v2 .header-center .header-shipping-rate dt {
    font-size: 9px !important;
  }

  .header_v2 .header-center .header-shipping-rate dd {
    font-size: 14px !important;
  }

  .header_v2 .header-center .header-shipping-eu-copy {
    font-size: 10px !important;
    line-height: 1.25 !important;
  }

  .header_v2 .header-center .header-shipping-eu-copy strong {
    font-size: 11px !important;
  }

  .header_v2 .header-center .header-shipping-details {
    grid-column: 1 / -1 !important;
    min-height: 30px !important;
    padding: 4px 8px !important;
    border-left: 0 !important;
    border-top: 1px solid #d5dde3 !important;
    font-size: 10px !important;
  }

  /* Remove legacy whitespace between center and nav */
  .header_v2 .header-center + .header-bottom,
  .header_v2 .header-bottom {
    margin-top: 0 !important;
  }

  .header_v2 .header-bottom .container,
  .header_v2 .header-bottom .header-ontop,
  .header_v2 .header-bottom .header-ontop > .row {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

}

@media (min-width: 768px) and (max-width: 820px) {
  .header_v2 .header-center .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .header_v2 .header-center .header-center-main-row {
    grid-template-columns: 142px minmax(0,1fr) 118px !important;
    column-gap: 10px !important;
  }

  .header_v2 .header-center #header-logo .logo {
    width: 136px !important;
  }

  .header_v2 .header-center .header-marzamemi-card > a {
    max-width: 116px !important;
  }

  .header_v2 .header-center #titlehome {
    font-size: 1.05rem !important;
  }

  .header_v2 .header-center #subtitlehome {
    font-size: .8rem !important;
  }
}


/* =========================================================
   CAMPISI HEADER V8 — tablet menu + mobile state safety
   ========================================================= */

/* Smartphone: il pannello Prodotti deve essere chiuso di default.
   Si rende visibile solo dopo attivazione esplicita del pulsante. */
@media (max-width: 767px) {
  .mobile_layout .spverticalmenu .sp-vermegamenu:not(.sp-vermegamenu-active) {
    visibility: hidden !important;
    pointer-events: none !important;
    -webkit-transform: translate3d(-100%, 0, 0) !important;
    transform: translate3d(-100%, 0, 0) !important;
  }

  .mobile_layout .spverticalmenu .sp-vermegamenu.sp-vermegamenu-active {
    visibility: visible !important;
    pointer-events: auto !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
  }
}

/* =========================================================
   CAMPISI HEADER V11 — top bar + tablet vertical rhythm
   2026-10-01
   - top bar più ordinata e coerente
   - social in riga
   - target interattivi >= 44px
   - rimozione definitiva del padding legacy 70px prima dei menu
   ========================================================= */

/* TOP BAR: base comune desktop/tablet ---------------------- */
@media (min-width: 768px) {
  .header_v2 .header-top {
    min-height: 48px !important;
    height: auto !important;
    padding: 0 !important;
    background: #f6f7f8 !important;
    border-top: 1px solid #d7e2ea !important;
    border-bottom: 1px solid #dde3e7 !important;
  }

  .header_v2 .header-top .container {
    min-height: 48px !important;
  }

  .header_v2 .header-top .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    min-height: 48px !important;
    margin: 0 !important;
  }

  .header_v2 .header-top .box-left,
  .header_v2 .header-top .box-right {
    float: none !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .header_v2 .header-top .box-left {
    flex: 0 0 auto !important;
    width: auto !important;
    display: flex !important;
    align-items: center !important;
  }

  .header_v2 .header-top .box-right {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
  }

  .header_v2 .header-top .header-top-left,
  .header_v2 .header-top .social-block {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    gap: 5px !important;
    white-space: nowrap !important;
  }

  .header_v2 .header-top .socialicone {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
  }

  .header_v2 .header-top .socialicone > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 5px !important;
    line-height: 1 !important;
  }

  .header_v2 .header-top .socialicone picture,
  .header_v2 .header-top .socialicone img {
    display: block !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-top .socialicone img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
  }

  .header_v2 .header-top .header-top-right {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    width: auto !important;
    max-width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
    float: none !important;
  }

  /* Ordine visivo: paese di spedizione / account / lingua. */
  .header_v2 .header-top .topright-content {
    order: 1 !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: normal !important;
    font-size: 13px !important;
  }

  .header_v2 .header-top .splanguage-block {
    order: 2 !important;
    display: flex !important;
    align-items: stretch !important;
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-left: 1px solid #d9dfe3 !important;
  }

  .header_v2 .header-top .country_changer,
  .header_v2 .header-top #_desktop_country_changer,
  .header_v2 .header-top .register,
  .header_v2 .header-top .login,
  .header_v2 .header-top .or {
    display: inline-flex !important;
    align-items: center !important;
    float: none !important;
    margin: 0 !important;
  }

  .header_v2 .header-top #_desktop_country_changer {
    border-left: 1px solid #d9dfe3 !important;
    border-right: 1px solid #d9dfe3 !important;
  }

  .header_v2 .header-top .btn-CountryChanger {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border: 0 !important;
    background: transparent !important;
    color: #20262b !important;
    font: inherit !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
  }

  .header_v2 .header-top .btn-CountryChanger:hover {
    background: #eef4f8 !important;
  }

  .header_v2 .header-top .btn-CountryChanger img {
    width: auto !important;
    max-width: 22px !important;
    height: 14px !important;
    margin: 0 !important;
  }

  .header_v2 .header-top .register a,
  .header_v2 .header-top .login a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 48px !important;
    padding: 0 5px !important;
    color: #005b9f !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
  }

  .header_v2 .header-top .register a:hover,
  .header_v2 .header-top .login a:hover {
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
  }

  .header_v2 .header-top .or {
    min-height: 48px !important;
    padding: 0 1px !important;
    color: #7a8288 !important;
  }

  .header_v2 .header-top .language-selector,
  .header_v2 .header-top .sp-language-title {
    height: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
  }

  .header_v2 .header-top .sp-language-title {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    padding: 0 10px !important;
    color: #30383e !important;
  }

  .header_v2 .header-top .sp-language-title:hover {
    background: #eef4f8 !important;
  }

  .header_v2 .header-top .lang-flag {
    margin: 0 4px 0 0 !important;
  }

  /* Focus consistente sulla barra superiore. */
  .header_v2 .header-top .socialicone > a:focus,
  .header_v2 .header-top .socialicone > a:focus-visible,
  .header_v2 .header-top .btn-CountryChanger:focus,
  .header_v2 .header-top .btn-CountryChanger:focus-visible,
  .header_v2 .header-top .register a:focus,
  .header_v2 .header-top .register a:focus-visible,
  .header_v2 .header-top .login a:focus,
  .header_v2 .header-top .login a:focus-visible,
  .header_v2 .header-top .sp-language-title:focus,
  .header_v2 .header-top .sp-language-title:focus-visible {
    outline: 3px solid #0073aa !important;
    outline-offset: -3px !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 20 !important;
  }
}

/* TABLET: compatta header e rimuove il vuoto legacy -------- */
@media (min-width: 768px) and (max-width: 991px) {
  .header_v2 .header-top .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .header_v2 .header-top .social-block {
    gap: 2px !important;
  }

  .header_v2 .header-top .socialicone,
  .header_v2 .header-top .socialicone > a {
    width: 34px !important;
  }

  .header_v2 .header-top .socialicone img {
    width: 27px !important;
    height: 27px !important;
    max-width: 27px !important;
  }

  .header_v2 .header-top .btn-CountryChanger {
    padding-left: 9px !important;
    padding-right: 9px !important;
  }

  .header_v2 .header-top .register a,
  .header_v2 .header-top .login a {
    padding-left: 3px !important;
    padding-right: 3px !important;
    font-size: 12px !important;
  }

  .header_v2 .header-top .sp-language-title {
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 12px !important;
  }

  /* Riduzione ritmo verticale della testata centrale. */
  .header_v2 .header-center {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  .header_v2 .header-center .header-center-main-row {
    row-gap: 6px !important;
  }

  .header_v2 .header-center .header-shipping-panel {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Reset forte del layout tablet originale del tema:
     _responsive-768px-992px.scss aggiunge padding-top:70px. */
  body .header_v2 > .menu-on-top.header-bottom,
  body .header_v2 > .header-bottom.menu-on-top {
    margin-top: 0 !important;
    padding-top: 0 !important;
    top: auto !important;
  }

  body .header_v2 > .menu-on-top.header-bottom > .container,
  body .header_v2 > .header-bottom.menu-on-top > .container,
  body .header_v2 .header-bottom > .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
  }

  body .header_v2 .header-bottom .header-ontop,
  body .header_v2 .header-bottom .header-ontop > .row,
  body .header_v2 .header-bottom #vertical_menu,
  body .header_v2 .header-bottom .main-menu {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  body .header_v2 .header-bottom .main-menu {
    top: auto !important;
    transform: none !important;
  }

  /* Un piccolo distacco intenzionale: 6px, non i ~70px legacy. */
  body .header_v2 .header-center + .menu-on-top.header-bottom,
  body .header_v2 .header-center + .header-bottom {
    margin-top: 6px !important;
  }
}

/* Desktop: topbar più ariosa senza diventare alta. ---------- */
@media (min-width: 1200px) {
  .header_v2 .header-top .container {
    max-width: calc(100% - 48px) !important;
  }

  .header_v2 .header-top .social-block {
    gap: 4px !important;
  }

  .header_v2 .header-top .btn-CountryChanger {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .header_v2 .header-top .register a,
  .header_v2 .header-top .login a {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
}

/* =========================================================

/* =========================================================
   TABLET NAVIGATION — side drawer, coerente con il mobile
   Mantiene il JS nativo del modulo. Intervento solo geometrico.
   ========================================================= */
@media (min-width: 768px) and (max-width: 991px) {
  .header_v2 {
    position: relative !important;
  }

  .header_v2 .header-bottom .header-ontop > .row {
    position: relative !important;
    min-height: 50px !important;
    background: #000 !important;
  }

  .header_v2 .header-bottom #vertical_menu {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 55px !important;
    max-width: 55px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 3 !important;
  }

  .header_v2 .header-bottom .main-menu,
  .header_v2 .header-bottom #header_menu {
    position: static !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    height: 50px !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-bottom #header_menu .spmegamenu,
  .header_v2 .header-bottom #header_menu .spmegamenu .navbar {
    position: static !important;
    width: 100% !important;
    height: 50px !important;
    margin: 0 !important;
  }

  /* Trigger centrale: resta identico quando il pannello si apre. */
  .header_v2 .header-bottom #header_menu .navbar-button {
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;
    width: 55px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%) !important;
    z-index: 4 !important;
  }

  /* Carrello completamente a destra. */
  .header_v2 .header-bottom #header-cart {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    top: 0 !important;
    width: 55px !important;
    min-width: 55px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
  }

  /* Il pannello tablet usa la stessa metafora del mobile: drawer laterale.
     Non cambiamo classi o handler JS: sp-megamenu-active resta lo stato nativo. */
  .header_v2 .header-bottom #header_menu #sp-megamenu {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: auto !important;
    width: 280px !important;
    max-width: 82vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    margin: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transform: translateX(-110%) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: rgba(34,34,34,.94) !important;
    box-shadow: 4px 0 14px rgba(0,0,0,.22) !important;
    transition: transform .25s ease, opacity .2s ease, visibility .2s ease !important;
    z-index: 10050 !important;
  }

  .header_v2 .header-bottom #header_menu #sp-megamenu.sp-megamenu-active {
    transform: translateX(0) !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow: 4px 0 14px rgba(0,0,0,.22) !important;
  }

  .header_v2 .header-bottom #header_menu #sp-megamenu .label-menu {
    display: block !important;
  }

  .header_v2 .header-bottom #header_menu #sp-megamenu #remove-megamenu {
    display: block !important;
  }
}

/* =========================================================
   DESKTOP - ACCOUNT LOGGATO NELLA TOP BAR
   Allinea "Ciao Nome Cognome" e Logout alla stessa altezza
   dei controlli spedizione/lingua, senza modificare il template.
   ========================================================= */
@media (min-width: 992px) {

  .header_v2 .header-top .topright-content > a,
  .header_v2 .header-top .topright-content > .logout,
  .header_v2 .header-top .topright-content > .logout > a {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .header_v2 .header-top .topright-content > a {
    max-width: 260px !important;
    padding: 0 12px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Il separatore testuale "|" è decorativo: usiamo un bordo più pulito. */
  .header_v2 .header-top .topright-content > span[aria-hidden="true"] {
    display: none !important;
  }

  .header_v2 .header-top .topright-content > .logout {
    border-left: 1px solid #d9dfe3 !important;
  }

  .header_v2 .header-top .topright-content > .logout > a {
    padding: 0 12px !important;
    color: #005b9f !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }

  .header_v2 .header-top .topright-content > a:hover,
  .header_v2 .header-top .topright-content > .logout > a:hover {
    background: #eef4f8 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
  }

  .header_v2 .header-top .topright-content > a:focus,
  .header_v2 .header-top .topright-content > a:focus-visible,
  .header_v2 .header-top .topright-content > .logout > a:focus,
  .header_v2 .header-top .topright-content > .logout > a:focus-visible {
    outline: 3px solid #0073aa !important;
    outline-offset: -3px !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 20 !important;
  }
}

/* =========================================================
   TABLET - ACCOUNT LOGGATO NELLA TOP BAR
   Compatta nome utente e Logout senza rompere la riga.
   ========================================================= */
@media (min-width: 768px) and (max-width: 991px) {

  .header_v2 .header-top .topright-content {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: stretch !important;
    justify-content: flex-end !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .header_v2 .header-top .topright-content > a,
  .header_v2 .header-top .topright-content > .logout,
  .header_v2 .header-top .topright-content > .logout > a {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  .header_v2 .header-top .topright-content > a {
    max-width: 145px !important;
    padding: 0 7px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .header_v2 .header-top .topright-content > span[aria-hidden="true"] {
    display: none !important;
  }

  .header_v2 .header-top .topright-content > .logout {
    flex: 0 0 auto !important;
    border-left: 1px solid #d9dfe3 !important;
  }

  .header_v2 .header-top .topright-content > .logout > a {
    padding: 0 7px !important;
    color: #005b9f !important;
    font-weight: 700 !important;
    text-decoration: none !important;
  }

  .header_v2 .header-top .topright-content > a,
  .header_v2 .header-top .topright-content > .logout > a {
    font-size: 11px !important;
  }

  .header_v2 .header-top .topright-content > a:hover,
  .header_v2 .header-top .topright-content > .logout > a:hover {
    background: #eef4f8 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
  }

  .header_v2 .header-top .topright-content > a:focus,
  .header_v2 .header-top .topright-content > a:focus-visible,
  .header_v2 .header-top .topright-content > .logout > a:focus,
  .header_v2 .header-top .topright-content > .logout > a:focus-visible {
    outline: 3px solid #0073aa !important;
    outline-offset: -3px !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 20 !important;
  }
}


/* =========================================================
   CAMPISI HEADER V12 — REFLOW / ZOOM FIX
   2026-10-02
   - 992–1199px: mantiene la navigazione desktop su una riga
   - <=767px: la card spedizioni nell'header cresce col contenuto
                e non viene coperta dalla barra menu
   ========================================================= */

/* ---------------------------------------------------------
   DESKTOP COMPATTO / ZOOM INTERMEDIO
   Validato a viewport CSS ~1098px (zoom browser 125%).
   Mantiene il menu desktop e impedisce il wrapping.
   --------------------------------------------------------- */
@media (min-width: 992px) and (max-width: 1199px) {

  .header_v2 .header-bottom .header-ontop > .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  .header_v2 .header-bottom #vertical_menu {
    flex: 0 0 22% !important;
    width: 22% !important;
    max-width: 22% !important;
  }

  .header_v2 .header-bottom .main-menu {
    flex: 0 0 78% !important;
    width: 78% !important;
    max-width: 78% !important;
  }

  .header_v2 .header-bottom #header_menu {
    width: calc(90% - 65px) !important;
    max-width: calc(100% - 65px) !important;
  }

  .header_v2 .header-bottom #header_menu .navbar-nav {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    width: auto !important;
    white-space: nowrap !important;
  }

  .header_v2 .header-bottom #header_menu .navbar-nav > li {
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
  }

  .header_v2 .header-bottom #header_menu .navbar-nav > li > a,
  .header_v2 .header-bottom #header_menu .navbar-nav > li > a:visited {
    white-space: nowrap !important;
    letter-spacing: 0.14em !important;
    color: #ffffff !important;
  }

  .header_v2 .header-bottom #header_menu .navbar-nav > li > a:hover,
  .header_v2 .header-bottom #header_menu .navbar-nav > li > a:focus,
  .header_v2 .header-bottom #header_menu .navbar-nav > li > a:focus-visible {
    color: #ffffff !important;
  }
}

/* ---------------------------------------------------------
   REFLOW MOBILE / ZOOM ELEVATO
   A <=767 CSS px la card spedizioni dell'header deve essere
   parte del normale flusso e crescere con il contenuto.
   --------------------------------------------------------- */
@media (max-width: 767px) {

  .header_v2 .header-center {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .header_v2 .header-center .header-center-main-row {
    height: auto !important;
    min-height: 0 !important;
  }

  .header_v2 .header-center .header-shipping-panel {
    float: none !important;
    clear: both !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 16px 0 16px !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .header_v2 .header-center .header-shipping-card {
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #c7d3dc !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
  }

  .header_v2 .header-center .header-shipping-head {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    padding: 14px 7px !important;
    background: #f2f7fb !important;
    border-right: 1px solid #d6dfe5 !important;
    text-align: center !important;
  }

  .header_v2 .header-center .header-shipping-zone {
    grid-column: 2 !important;
    min-width: 0 !important;
    padding: 11px 12px !important;
    background: #fff !important;
  }

  .header_v2 .header-center .header-shipping-zone-it {
    border-bottom: 1px solid #d6dfe5 !important;
  }

  .header_v2 .header-center .header-shipping-rates {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .header_v2 .header-center .header-shipping-rate {
    margin: 0 !important;
    padding: 0 7px !important;
    text-align: center !important;
  }

  .header_v2 .header-center .header-shipping-rate dt,
  .header_v2 .header-center .header-shipping-rate dd {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  .header_v2 .header-center .header-shipping-details {
    grid-column: 1 / -1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 9px 12px !important;
    background: #f7fafc !important;
    border-top: 1px solid #d6dfe5 !important;
  }
}

/* =========================================================
   FINE CAMPISI HEADER V12
   ========================================================= */