/*
  Vivacloud Orderflow CSS — Aura Design System v17
  Matches the Aura mockup from code.html / DESIGN.md as closely as possible inside WHMCS.
  Single consolidated file — no duplicate rule blocks.
*/

/* =========================================================
   GLOBAL
========================================================= */

body:has(#order-digit-of) {
  background: #fbfcfe !important;
  overflow-x: hidden !important;
}

.vc-content {
  width: 100% !important;
}

body:has(#order-digit-of) .vc-content {
  width: 100% !important;
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 0 24px 80px !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

#order-digit-of {
  --vc-navy:    #0a1530;
  --vc-blue:    #2b6fc4;
  --vc-blue2:   #4a92e5;
  --vc-pink:    #e63a77;
  --vc-green:   #16a34a;
  --vc-green2:  #22c55e;
  --vc-ink:     #101a36;
  --vc-sub:     #334155;
  --vc-muted:   #64748b;
  --vc-faint:   #94a3b8;
  --vc-line:    #eef2f7;
  --vc-border:  #e2e8f5;
  --vc-soft:    rgba(43,111,196,.10);
  --vc-glow:    rgba(43,111,196,.28);
  --vc-surface: #ffffff;
  --vc-radius:  26px;
  --vc-radius-sm: 18px;
  --vc-shadow-sm: 0 14px 38px rgba(15,34,72,.06);
  --vc-shadow-md: 0 22px 60px rgba(15,34,72,.10);
  --vc-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  width: 100% !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-feature-settings: 'cv11','ss01' !important;
  max-width: 100% !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

#order-digit-of,
#order-digit-of * {
  box-sizing: border-box !important;
}

/* =========================================================
   RESET WHMCS / BOOTSTRAP
========================================================= */

#order-digit-of > .row,
#order-digit-of .cart-body,
#order-digit-of .cart-body > .row,
#order-digit-of .cart-body [class*="col-"],
#order-digit-of .products [class*="col-"],
#order-digit-of .row-eq-height [class*="col-"] {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#order-digit-of > .row:before, #order-digit-of > .row:after,
#order-digit-of .cart-body:before, #order-digit-of .cart-body:after,
#order-digit-of .cart-body > .row:before, #order-digit-of .cart-body > .row:after,
#order-digit-of .products > .row:before, #order-digit-of .products > .row:after,
#order-digit-of .row-eq-height:before, #order-digit-of .row-eq-height:after {
  display: none !important;
  content: none !important;
}

#order-digit-of .vc-hidden-empty-wrapper { display: none !important; }

/* =========================================================
   BASE GRID — cart page
========================================================= */

#order-digit-of.vc-cart-redesign .cart-body {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-areas: "hero" "shell" !important;
  gap: 0 !important;
  justify-items: center !important;
  overflow: visible !important;
}

/* Shell = left + right inside the cart page */
#order-digit-of .vc-cart-shell {
  display: grid !important;
  grid-template-columns: minmax(0,740px) minmax(360px,380px) !important;
  gap: 28px !important;
  align-items: start !important;
  justify-content: center !important;
  width: min(100%, 1148px) !important;
  max-width: 1148px !important;
  margin: 28px auto 0 !important;
  position: relative !important;
  z-index: 3 !important;
}

#order-digit-of .vc-cart-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  min-width: 0 !important;
}

#order-digit-of .vc-cart-right {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  width: 100% !important;
  min-width: 360px !important;
  max-width: 380px !important;
  position: sticky !important;
  top: 24px !important;
}

/* Hide WHMCS direct children when redesign is active (they live inside shell) */
#order-digit-of.vc-cart-redesign .cart-body > .view-cart-items,
#order-digit-of.vc-cart-redesign .cart-body > .promo-code-cart-container,
#order-digit-of.vc-cart-redesign .cart-body > .promotion-code,
#order-digit-of.vc-cart-redesign .cart-body > .apply-credit-container,
#order-digit-of.vc-cart-redesign .cart-body > .order-summary,
#order-digit-of.vc-cart-redesign .cart-body > .summary-container,
#order-digit-of.vc-cart-redesign .cart-body > .sidebar-collapsed {
  display: none !important;
}

#order-digit-of .vc-cart-shell .view-cart-items,
#order-digit-of .vc-cart-shell .promo-code-cart-container,
#order-digit-of .vc-cart-shell .promotion-code,
#order-digit-of .vc-cart-shell .apply-credit-container,
#order-digit-of .vc-cart-shell .order-summary,
#order-digit-of .vc-cart-shell .summary-container,
#order-digit-of .vc-cart-shell .sidebar-collapsed {
  display: block !important;
}

/* =========================================================
   BASE GRID — product page
========================================================= */

#order-digit-of:not(.vc-cart-redesign) .cart-body {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 320px !important;
  grid-template-areas: "hero hero" "main side" !important;
  gap: 24px !important;
  align-items: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

#order-digit-of:not(.vc-cart-redesign) .products {
  grid-area: main !important;
  margin: 12px 0 0 !important;
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
}

#order-digit-of:not(.vc-cart-redesign) .sidebar-collapsed {
  grid-area: side !important;
  margin: 12px 0 0 !important;
  position: relative !important;
  z-index: 3 !important;
}

/* =========================================================
   HERO
========================================================= */

#order-digit-of .header-lined {
  grid-area: hero !important;
  width: 100% !important;
  min-height: 124px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  margin: 18px 0 0 !important;
  padding: 24px 240px 24px 98px !important;
  border: 0 !important;
  border-radius: 24px !important;
  /* dot grid + blue radial glow + deep-navy gradient */
  background:
    radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px) 0 0 / 30px 30px,
    radial-gradient(760px 320px at 100% 18%, rgba(74,146,229,.54), transparent 62%),
    linear-gradient(135deg, #0a1530 0%, #102450 56%, #2b6fc4 100%) !important;
  color: #fff !important;
  box-shadow: 0 18px 44px rgba(15,34,72,.12) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Icon tile on the left */
#order-digit-of .header-lined:before {
  content: "\f233" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  top: 50% !important;
  left: 24px !important;
  width: 58px !important;
  height: 58px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 18px !important;
  color: #fff !important;
  font-size: 23px !important;
  transform: translateY(-50%) !important;
  filter: none !important;
  pointer-events: none !important;
}

/* Pink accent line bottom-right */
#order-digit-of .header-lined:after {
  content: "" !important;
  position: absolute !important;
  right: 25px !important;
  bottom: 20px !important;
  width: 160px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(255,255,255,.08), var(--vc-pink)) !important;
}

#order-digit-of .header-lined h1 {
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  border: 0 !important;
  font-family: var(--vc-font) !important;
  font-size: 28px !important;
  line-height: 1.1 !important;
  font-weight: 800 !important;
  letter-spacing: -.6px !important;
  max-width: 560px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Eyebrow "— VIVACLOUD STORE" */
#order-digit-of .header-lined h1:before {
  content: "— VIVACLOUD STORE" !important;
  display: block !important;
  margin-bottom: 7px !important;
  color: rgba(255,255,255,.76) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

/* Subtitle below title */
#order-digit-of .header-lined h1:after {
  content: "Visualizza e gestisci gli articoli nel tuo carrello prima di procedere al pagamento sicuro." !important;
  display: block !important;
  margin-top: 8px !important;
  max-width: 520px !important;
  color: rgba(255,255,255,.82) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* Product catalogue uses the compact service-banner hero too. */
#order-digit-of:not(.vc-cart-redesign) .header-lined {
  min-height: 124px !important;
  align-items: center !important;
  margin: 18px 0 0 !important;
  padding: 24px 240px 24px 98px !important;
  border-radius: 24px !important;
  box-shadow: 0 18px 44px rgba(15,34,72,.12) !important;
}

#order-digit-of:not(.vc-cart-redesign) .header-lined:before {
  content: "\f233" !important;
  top: 50% !important;
  left: 24px !important;
  width: 58px !important;
  height: 58px !important;
  display: flex !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 18px !important;
  filter: none !important;
  transform: translateY(-50%) !important;
}

#order-digit-of:not(.vc-cart-redesign) .header-lined:after {
  right: 25px !important;
  bottom: 20px !important;
  width: 160px !important;
  height: 4px !important;
}

/* =========================================================
   CART ITEMS CARD
========================================================= */

#order-digit-of .view-cart-items {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--vc-surface) !important;
  border: 0 !important;
  border-top: 4px solid var(--vc-blue) !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-sm) !important;
  overflow: hidden !important;
}

#order-digit-of .view-cart-items-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 !important;
  padding: 20px 34px !important;
  min-height: 58px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--vc-line) !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #8ea0ba !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .15em !important;
}

#order-digit-of .view-cart-items .item,
#order-digit-of .view-cart-items .item-domain,
#order-digit-of .view-cart-items .item-addon,
#order-digit-of .view-cart-items .item-configurable-option,
#order-digit-of .view-cart-items .item-child,
#order-digit-of .cart-item {
  background: #fff !important;
  border: 1px solid var(--vc-line) !important;
  border-radius: var(--vc-radius-sm) !important;
  margin: 14px 16px !important;
  padding: 16px 18px !important;
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

#order-digit-of .view-cart-items .item:hover,
#order-digit-of .cart-item:hover {
  border-color: rgba(43,111,196,.22) !important;
  box-shadow: 0 6px 18px rgba(15,34,72,.06) !important;
}

#order-digit-of .view-cart-items .item-title,
#order-digit-of .cart-item-title {
  color: var(--vc-ink) !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  letter-spacing: -.2px !important;
}

/* =========================================================
   EMPTY CART
========================================================= */

#order-digit-of .empty-cart,
#order-digit-of .view-cart-empty,
#order-digit-of .view-cart-items .empty {
  min-height: 360px !important;
  margin: 0 !important;
  padding: 70px 34px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--vc-sub) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.5 !important;
  gap: 0 !important;
}

/* Circular icon */
#order-digit-of .empty-cart:before,
#order-digit-of .view-cart-empty:before,
#order-digit-of .view-cart-items .empty:before {
  content: "\f07a" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  width: 86px !important;
  height: 86px !important;
  border-radius: 999px !important;
  background: #f2f3ff !important;
  color: var(--vc-blue) !important;
  font-size: 34px !important;
  margin-bottom: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

#order-digit-of .empty-cart strong,
#order-digit-of .view-cart-empty strong,
#order-digit-of .view-cart-items .empty strong {
  display: block !important;
  color: var(--vc-ink) !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.5px !important;
  margin-bottom: 12px !important;
}

/* "Sfoglia prodotti" CTA — injected by JS */
#order-digit-of .vc-empty-cta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 28px !important;
  padding: 0 38px !important;
  min-height: 56px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--vc-blue), var(--vc-blue2)) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 20px rgba(43,111,196,.28) !important;
  transition: transform .15s ease, filter .15s ease !important;
}

#order-digit-of .vc-empty-cta:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.06) !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* =========================================================
   PROMO CODE CARD
========================================================= */

#order-digit-of .vc-promo-box,
#order-digit-of .promo-code-cart-container,
#order-digit-of .promotion-code,
#order-digit-of .apply-credit-container {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 34px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-sm) !important;
  overflow: hidden !important;
}

/* Reset all inner WHMCS wrappers */
#order-digit-of .vc-promo-box * { box-shadow: none !important; }

/* Header: "Hai un codice sconto?" */
#order-digit-of .vc-promo-box .vc-promo-toggle,
#order-digit-of .vc-promo-box a:not(.btn),
#order-digit-of .vc-promo-box button.vc-promo-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  width: auto !important;
  min-height: auto !important;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* Pink tag icon */
#order-digit-of .vc-promo-box .vc-promo-toggle:before,
#order-digit-of .vc-promo-box a:not(.btn):before {
  content: "\f06b" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--vc-pink) !important;
  background: rgba(230,58,119,.10) !important;
  font-size: 13px !important;
}

/* Form layout: input + button side by side */
#order-digit-of .vc-promo-box form,
#order-digit-of .vc-promo-box .panel-body,
#order-digit-of .vc-promo-box .card-body,
#order-digit-of .vc-promo-box .input-group,
#order-digit-of .vc-promo-box .row {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  background: transparent !important;
  border: 0 !important;
}

#order-digit-of .vc-promo-box .row:before,
#order-digit-of .vc-promo-box .row:after,
#order-digit-of .vc-promo-box .input-group:before,
#order-digit-of .vc-promo-box .input-group:after {
  display: none !important;
  content: none !important;
}

#order-digit-of .vc-promo-box [class*="col-"],
#order-digit-of .vc-promo-box .form-group {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
  background: transparent !important;
  border: 0 !important;
}

/* Input */
#order-digit-of .vc-promo-box input[type="text"],
#order-digit-of .vc-promo-box input[type="search"],
#order-digit-of .vc-promo-box .vc-promo-input,
#order-digit-of #promocode {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 180px !important;
  max-width: none !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1.5px solid var(--vc-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  outline: none !important;
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

#order-digit-of .vc-promo-box input[type="text"]:focus,
#order-digit-of .vc-promo-box input[type="search"]:focus,
#order-digit-of #promocode:focus {
  border-color: var(--vc-blue) !important;
  box-shadow: 0 0 0 4px var(--vc-soft) !important;
}

#order-digit-of .vc-promo-box input::placeholder { color: #9aa8ba !important; font-weight: 600 !important; }

#order-digit-of .vc-promo-box .input-group-addon,
#order-digit-of .vc-promo-box .input-group-text { display: none !important; }

/* Apply button — dark navy, matches code.html */
#order-digit-of .vc-promo-box .btn,
#order-digit-of .vc-promo-box button:not(.vc-promo-toggle),
#order-digit-of .vc-promo-box input[type="submit"],
#order-digit-of .vc-promo-box .vc-promo-apply,
#order-digit-of .vc-promo-box #validatepromo,
#order-digit-of #validatepromo {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 170px !important;
  max-width: none !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--vc-navy) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: filter .15s ease !important;
}

#order-digit-of .vc-promo-box .vc-promo-apply:hover,
#order-digit-of #validatepromo:hover {
  filter: brightness(1.15) !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* =========================================================
   ORDER SUMMARY CARD
========================================================= */

#order-digit-of .order-summary,
#order-digit-of .summary-container {
  width: 100% !important;
  min-width: 360px !important;
  max-width: 380px !important;
  margin: 0 !important;
  padding: 34px !important;
  background: #fff !important;
  border: 0 !important;
  border-top: 4px solid var(--vc-pink) !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-md) !important;
  overflow: hidden !important;
  position: relative !important;
  top: auto !important;
  z-index: 10 !important;
}

/* Heading */
#order-digit-of .order-summary h2,
#order-digit-of .order-summary h3,
#order-digit-of .summary-container h2,
#order-digit-of .summary-container h3 {
  margin: 0 0 26px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.5px !important;
  text-align: left !important;
  white-space: normal !important;
  display: block !important;
  gap: 0 !important;
}

/* Remove the icon that was injected in previous version */
#order-digit-of .order-summary h2:before,
#order-digit-of .order-summary h3:before,
#order-digit-of .summary-container h2:before,
#order-digit-of .summary-container h3:before {
  display: none !important;
  content: none !important;
}

/* Subtotal rows */
#order-digit-of .order-summary .summary-totals,
#order-digit-of .summary-container .summary-totals,
#order-digit-of .order-summary .content,
#order-digit-of .summary-container .content {
  padding: 0 !important;
  margin: 0 !important;
}

#order-digit-of .order-summary .clearfix,
#order-digit-of .summary-container .clearfix {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 0 16px !important;
  margin: 0 0 16px !important;
  border: 0 !important;
  color: var(--vc-muted) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#order-digit-of .order-summary .clearfix:last-child,
#order-digit-of .summary-container .clearfix:last-child { border-bottom: 0 !important; }

#order-digit-of .order-summary .clearfix span:last-child,
#order-digit-of .summary-container .clearfix span:last-child,
#order-digit-of .order-summary .clearfix div:last-child,
#order-digit-of .summary-container .clearfix div:last-child {
  color: var(--vc-ink) !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
}

/* Total box */
#order-digit-of .total-due-today {
  margin: 20px 0 24px !important;
  padding: 22px !important;
  border: 1px solid rgba(43,111,196,.14) !important;
  border-radius: 14px !important;
  background: #f2f3ff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

#order-digit-of .total-due-today > div:first-child,
#order-digit-of .total-due-today .total-label { flex: 1 !important; }

#order-digit-of .total-due-today > div > span:not(.amt),
#order-digit-of .total-due-today .total-label {
  display: block !important;
  color: var(--vc-sub) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .10em !important;
}

#order-digit-of .total-due-today .amt {
  display: block !important;
  margin: 0 !important;
  color: var(--vc-blue) !important;
  font-size: 38px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: -1.4px !important;
  font-variant-numeric: tabular-nums !important;
  text-align: right !important;
}

/* Checkout button — green gradient */
#order-digit-of .checkout,
#order-digit-of #checkout,
#order-digit-of .btn-checkout,
#order-digit-of .checkout-btn,
#order-digit-of .vc-checkout-button {
  width: 100% !important;
  min-height: 56px !important;
  height: 56px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, var(--vc-green), var(--vc-green2)) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -.1px !important;
  text-decoration: none !important;
  box-shadow: 0 14px 28px rgba(22,163,74,.25) !important;
  cursor: pointer !important;
  transition: transform .15s ease, filter .15s ease !important;
}

#order-digit-of .checkout:hover,
#order-digit-of #checkout:hover,
#order-digit-of .btn-checkout:hover,
#order-digit-of .checkout-btn:hover,
#order-digit-of .vc-checkout-button:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.05) !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* "Continua Shopping" */
#order-digit-of .order-summary a[href*="cart.php"],
#order-digit-of .summary-container a[href*="cart.php"],
#order-digit-of .continue-shopping,
#order-digit-of .back-to-shop {
  display: flex !important;
  justify-content: center !important;
  margin: 22px 0 0 !important;
  color: var(--vc-blue) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

#order-digit-of .continue-shopping:hover,
#order-digit-of .back-to-shop:hover { text-decoration: underline !important; }

/* Reassurance bar — vertical column, like code.html */
#order-digit-of .vc-reassurance {
  margin: 28px 0 0 !important;
  padding: 22px 0 0 !important;
  border-top: 1px solid var(--vc-line) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  background: transparent !important;
  color: var(--vc-muted) !important;
  font-family: var(--vc-font) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
}

#order-digit-of .vc-reassurance span {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
  white-space: nowrap !important;
}

#order-digit-of .vc-reassurance i {
  color: var(--vc-blue) !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
}

/* =========================================================
   FORMS / GENERAL INPUTS
========================================================= */

#order-digit-of input.form-control,
#order-digit-of select.form-control,
#order-digit-of textarea.form-control,
#order-digit-of .form-control {
  min-height: 48px !important;
  border: 1.5px solid var(--vc-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--vc-ink) !important;
  box-shadow: none !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  outline: none !important;
}

#order-digit-of input.form-control:focus,
#order-digit-of select.form-control:focus,
#order-digit-of textarea.form-control:focus {
  border-color: var(--vc-blue) !important;
  box-shadow: 0 0 0 4px var(--vc-soft) !important;
}

/* =========================================================
   CONFIGURE PRODUCT
========================================================= */

/* Configure page: centered, wide container so the Riepilogo has real space */
body:has(#order-digit-of.vc-configure-redesign) .vc-content {
  max-width: none !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* 2-column outer grid: form left, sidebar right */
#order-digit-of.vc-configure-redesign .cart-body {
  display: grid !important;
  grid-template-columns: minmax(0, 860px) minmax(330px, 370px) !important;
  grid-template-areas: "hero hero" "main side" !important;
  gap: 22px !important;
  align-items: start !important;
  overflow: visible !important;
  width: min(100%, 1260px) !important;
  margin: 0 auto !important;
}

#order-digit-of.vc-configure-redesign .header-lined {
  grid-area: hero !important;
  min-height: 156px !important;
  margin: 14px 0 0 !important;
  padding: 24px 210px 24px 98px !important;
  background:
    radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px) 0 0 / 30px 30px,
    radial-gradient(760px 320px at 100% 18%, rgba(74,146,229,.54), transparent 62%),
    linear-gradient(135deg, #0a1530 0%, #153c7d 58%, #7353aa 100%) !important;
}

#order-digit-of.vc-configure-redesign .header-lined:before {
  display: none !important;
}

#order-digit-of.vc-configure-redesign .header-lined h1 {
  font-size: 2.28rem !important;
  line-height: 1.12 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

#order-digit-of.vc-configure-redesign .header-lined h1:before {
  content: "Area clienti" !important;
}

#order-digit-of.vc-configure-redesign .header-lined h1:after {
  content: "Gestisci le risorse configurabili e conferma la variazione mensile del servizio." !important;
  max-width: 560px !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 500 !important;
}

/* Force white on any WHMCS-generated text node inside the configure hero
   (tagline, desc, vc-page-header p, etc.) */
#order-digit-of.vc-configure-redesign .header-lined p,
#order-digit-of.vc-configure-redesign .header-lined small,
#order-digit-of.vc-configure-redesign .header-lined .vc-page-header p,
#order-digit-of.vc-configure-redesign .header-lined > *:not(h1) {
  color: rgba(255,255,255,.82) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

/* Form → left column, single-column internally */
#order-digit-of.vc-configure-redesign #frmConfigureProduct,
#order-digit-of.vc-configure-redesign form[id*="configure" i],
#order-digit-of.vc-configure-redesign form:has(select[name="billingcycle"]),
#order-digit-of.vc-configure-redesign .product-configure {
  grid-area: main !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  justify-self: stretch !important;
  max-width: none !important;
}

/* Inner form row: always single column */
#order-digit-of.vc-configure-redesign #frmConfigureProduct > .row,
#order-digit-of.vc-configure-redesign form[id*="configure" i] > .row,
#order-digit-of.vc-configure-redesign form:has(select[name="billingcycle"]) > .row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
  justify-items: stretch !important;
}

/* Hide the WHMCS-generated summary that lives inside the form —
   JS moves it to .sidebar-collapsed so it shows in the right column */
#order-digit-of.vc-configure-redesign #frmConfigureProduct .order-summary,
#order-digit-of.vc-configure-redesign #frmConfigureProduct .summary-container,
#order-digit-of.vc-configure-redesign form[id*="configure" i] .order-summary,
#order-digit-of.vc-configure-redesign form[id*="configure" i] .summary-container {
  display: none !important;
}

/* Reset Bootstrap columns inside the form */
#order-digit-of.vc-configure-redesign #frmConfigureProduct [class*="col-"],
#order-digit-of.vc-configure-redesign form[id*="configure" i] [class*="col-"],
#order-digit-of.vc-configure-redesign form:has(select[name="billingcycle"]) [class*="col-"] {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  flex: 1 1 100% !important;
}

#order-digit-of.vc-configure-redesign #frmConfigureProduct > *,
#order-digit-of.vc-configure-redesign form[id*="configure" i] > *,
#order-digit-of.vc-configure-redesign form:has(select[name="billingcycle"]) > *,
#order-digit-of.vc-configure-redesign #frmConfigureProduct .row > *,
#order-digit-of.vc-configure-redesign form[id*="configure" i] .row > *,
#order-digit-of.vc-configure-redesign form:has(select[name="billingcycle"]) .row > * {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

/* Sidebar → right column, sticky, fills the full 420px column */
#order-digit-of.vc-configure-redesign .cart-body > .sidebar-collapsed {
  grid-area: side !important;
  position: sticky !important;
  top: 24px !important;
  align-self: start !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
}

#order-digit-of.vc-configure-redesign .sidebar-collapsed .vc-nav-panel,
#order-digit-of.vc-configure-redesign .sidebar-collapsed .vc-clean-sidebar {
  display: none !important;
}

/* ── Configure sidebar: Riepilogo mensile card (scp-sum design) ── */
#order-digit-of.vc-configure-redesign .sidebar-collapsed .order-summary,
#order-digit-of.vc-configure-redesign .sidebar-collapsed .summary-container {
  position: static !important;
  top: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1.5px solid #d0e0ff !important;
  border-top: none !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 40px rgba(26,115,232,.15) !important;
  overflow: hidden !important;
}

/* Hide the raw WHMCS content; only the rebuilt .vc-scp-panel shows */
#order-digit-of.vc-configure-redesign .sidebar-collapsed .order-summary > *:not(.vc-scp-panel),
#order-digit-of.vc-configure-redesign .sidebar-collapsed .summary-container > *:not(.vc-scp-panel) {
  display: none !important;
}
#order-digit-of.vc-configure-redesign .sidebar-collapsed .vc-scp-panel {
  display: block !important;
}

/* scp-sum-* panel */
#order-digit-of.vc-configure-redesign .scp-sum-head {
  background: linear-gradient(135deg, #1a73e8 0%, #0d47a1 100%) !important;
  color: #fff !important;
  padding: 20px 22px !important;
  font-family: var(--vc-font) !important;
  font-weight: 800 !important;
  font-size: 1.12rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  letter-spacing: .01em !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-head i {
  font-size: 1.2rem !important;
  opacity: .9 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-items {
  padding: 6px 0 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 22px !important;
  gap: 12px !important;
  border-bottom: 1px solid #f0f4ff !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-item:last-child {
  border-bottom: none !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-item-left {
  flex: 1 !important;
  min-width: 0 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-name {
  font-family: var(--vc-font) !important;
  font-weight: 700 !important;
  font-size: .98rem !important;
  color: #222 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-qty {
  font-family: var(--vc-font) !important;
  font-size: .9rem !important;
  color: #777 !important;
  margin-top: 4px !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-subtotal {
  font-family: var(--vc-font) !important;
  font-weight: 800 !important;
  font-size: 1.06rem !important;
  color: #1a73e8 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-divider {
  height: 2px !important;
  background: linear-gradient(to right, #e8ecf0, #c5d8ff, #e8ecf0) !important;
  margin: 5px 22px !important;
  border-radius: 99px !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-total {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 12px 22px 15px !important;
  background: #f7f9ff !important;
  border-top: 1px solid #edf0f8 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-total-label {
  font-family: var(--vc-font) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #888 !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-total-val {
  font-family: var(--vc-font) !important;
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  color: var(--vc-ink) !important;
  letter-spacing: -.01em !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: calc(100% - 32px) !important;
  margin: 6px 16px 20px !important;
  padding: 16px !important;
  background: linear-gradient(135deg, #1a73e8 0%, #0d47a1 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  font-family: var(--vc-font) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  letter-spacing: .01em !important;
  box-shadow: 0 8px 28px rgba(26,115,232,.45) !important;
  transition: opacity .2s, transform .1s !important;
  text-decoration: none !important;
}
#order-digit-of.vc-configure-redesign .scp-sum-btn:hover {
  opacity: .9 !important;
  transform: translateY(-2px) !important;
  color: #fff !important;
}

#order-digit-of.vc-configure-redesign .product-info {
  display: none !important;
}

#order-digit-of.vc-configure-redesign .product-info h2,
#order-digit-of.vc-configure-redesign .product-info h3 {
  margin: 0 0 10px !important;
  color: var(--vc-ink) !important;
  font-size: 25px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

#order-digit-of.vc-configure-redesign h3,
#order-digit-of.vc-configure-redesign .field-container > label,
#order-digit-of.vc-configure-redesign .form-group > label {
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

#order-digit-of.vc-configure-redesign .field-container {
  display: block !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 24px !important;
  min-width: 0 !important;
}

#order-digit-of.vc-configure-redesign .field-container > div,
#order-digit-of.vc-configure-redesign .field-container > select,
#order-digit-of.vc-configure-redesign .field-container > .form-control,
#order-digit-of.vc-configure-redesign .field-container:has(select[name="billingcycle"]) {
  width: 100% !important;
  max-width: none !important;
}

#order-digit-of.vc-configure-redesign .vc-configure-size-row {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(154px, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: none !important;
  align-items: stretch !important;
}

#order-digit-of.vc-configure-redesign .vc-configure-size-card {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 138px !important;
  margin: 0 !important;
  padding: 18px 16px !important;
  border: 1.5px solid #dce4f2 !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: var(--vc-sub) !important;
  font-family: var(--vc-font) !important;
  line-height: 1.45 !important;
  box-shadow: 0 1px 4px rgba(15,34,72,.04) !important;
  cursor: pointer !important;
  white-space: normal !important;
}

#order-digit-of.vc-configure-redesign .vc-configure-size-card input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

#order-digit-of.vc-configure-redesign .vc-configure-size-card:has(input:checked) {
  border-color: var(--vc-blue) !important;
  background: #f5f9ff !important;
  box-shadow: 0 0 0 3px rgba(43,111,196,.12) !important;
}

#order-digit-of.vc-configure-redesign .product-configurable-options,
#order-digit-of.vc-configure-redesign .configurable-options {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 16px 0 22px !important;
  min-width: 0 !important;
  max-width: none !important;
  align-self: stretch !important;
}

#order-digit-of.vc-configure-redesign .vc-configure-options-snapshot {
  width: 100% !important;
  min-height: var(--vc-options-refresh-min-height, 0) !important;
  pointer-events: none !important;
}

#order-digit-of.vc-configure-redesign form.vc-configure-billing-refresh .product-configurable-options,
#order-digit-of.vc-configure-redesign form.vc-configure-billing-refresh .configurable-options {
  display: none !important;
}

#order-digit-of.vc-configure-redesign form.vc-configure-billing-refresh .vc-configure-options-snapshot .product-configurable-options,
#order-digit-of.vc-configure-redesign form.vc-configure-billing-refresh .vc-configure-options-snapshot .configurable-options {
  display: flex !important;
}

#order-digit-of.vc-configure-redesign .product-configurable-options > .row,
#order-digit-of.vc-configure-redesign .configurable-options > .row {
  display: contents !important;
}

#order-digit-of.vc-configure-redesign .product-configurable-options .form-group,
#order-digit-of.vc-configure-redesign .configurable-options .form-group {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px 28px !important;
  background: #fff !important;
  border: 1.5px solid #e8ecf0 !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 14px rgba(0,0,0,.06) !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  transition: border-color .2s, box-shadow .2s !important;
}

#order-digit-of.vc-configure-redesign .product-configurable-options .form-group:hover,
#order-digit-of.vc-configure-redesign .configurable-options .form-group:hover {
  border-color: #b8d0ff !important;
  box-shadow: 0 4px 20px rgba(43,111,196,.10) !important;
}

/* Original label hidden — JS injects custom header instead */
#order-digit-of.vc-configure-redesign .vc-opt-orig-label {
  display: none !important;
}

/* ── Injected card header ── */
#order-digit-of.vc-configure-redesign .vc-opt-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  min-width: 0 !important;
  margin-bottom: 20px !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-label-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-width: 0 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-icon {
  width: 56px !important;
  height: 56px !important;
  border-radius: 14px !important;
  background: #e8f0fe !important;
  color: var(--vc-blue) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.45rem !important;
  flex-shrink: 0 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-name {
  font-family: var(--vc-font) !important;
  font-weight: 800 !important;
  font-size: 1.35rem !important;
  color: var(--vc-ink) !important;
  letter-spacing: 0 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-sub {
  font-family: var(--vc-font) !important;
  font-size: .92rem !important;
  color: var(--vc-faint) !important;
  margin-top: 3px !important;
  font-weight: 600 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-live-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  width: fit-content !important;
  margin-top: 5px !important;
  padding: 4px 11px !important;
  border-radius: 99px !important;
  background: #eafaf1 !important;
  color: #27ae60 !important;
  font-family: var(--vc-font) !important;
  font-size: .88rem !important;
  font-weight: 700 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-value-wrap {
  font-family: var(--vc-font) !important;
  min-width: 110px !important;
  font-size: 2.35rem !important;
  font-weight: 900 !important;
  color: var(--vc-blue) !important;
  text-align: right !important;
  white-space: nowrap !important;
  letter-spacing: 0 !important;
  flex-shrink: 0 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-unit {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--vc-muted) !important;
  margin-left: 5px !important;
}

/* ── Injected card footer ── */
#order-digit-of.vc-configure-redesign .vc-opt-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: 14px !important;
  gap: 12px !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-price {
  font-family: var(--vc-font) !important;
  font-size: .95rem !important;
  color: var(--vc-muted) !important;
  font-weight: 700 !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-stepper {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

#order-digit-of.vc-configure-redesign .vc-step-btn {
  width: 44px !important;
  height: 44px !important;
  border-radius: 11px !important;
  border: 1.5px solid var(--vc-border) !important;
  background: #f8f9fa !important;
  color: var(--vc-ink) !important;
  font-size: 1.35rem !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  padding: 0 !important;
  transition: border-color .15s, background .15s, color .15s !important;
}

#order-digit-of.vc-configure-redesign .vc-step-btn:hover {
  border-color: var(--vc-blue) !important;
  background: #e8f0fe !important;
  color: var(--vc-blue) !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-num {
  width: 88px !important;
  text-align: center !important;
  border: 1.5px solid var(--vc-border) !important;
  border-radius: 12px !important;
  padding: 8px !important;
  font-family: var(--vc-font) !important;
  font-size: 1.18rem !important;
  font-weight: 700 !important;
  color: var(--vc-ink) !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
  background: #fff !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-num::-webkit-inner-spin-button,
#order-digit-of.vc-configure-redesign .vc-opt-num::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
}

#order-digit-of.vc-configure-redesign .vc-opt-num:focus {
  outline: none !important;
  border-color: var(--vc-blue) !important;
  box-shadow: 0 0 0 3px var(--vc-soft) !important;
}

#order-digit-of.vc-configure-redesign .product-configurable-options select,
#order-digit-of.vc-configure-redesign .configurable-options select,
#order-digit-of.vc-configure-redesign select[name="billingcycle"] {
  width: 100% !important;
  min-height: 52px !important;
}

#order-digit-of.vc-configure-redesign .irs {
  width: 100% !important;
  min-height: 70px !important;
  margin-top: 4px !important;
}

#order-digit-of.vc-configure-redesign .irs-line,
#order-digit-of.vc-configure-redesign .irs-bar {
  top: 30px !important;
  height: 8px !important;
  border-radius: 999px !important;
}

#order-digit-of.vc-configure-redesign .irs-line {
  background: #e0e6f0 !important;
  border: 0 !important;
}

#order-digit-of.vc-configure-redesign .irs-bar {
  background: var(--vc-blue) !important;
  border: 0 !important;
}

#order-digit-of.vc-configure-redesign .irs-bar-edge {
  top: 30px !important;
  display: block !important;
  width: 18px !important;
  height: 8px !important;
  border: 0 !important;
  border-radius: 999px 0 0 999px !important;
  background: var(--vc-blue) !important;
  box-shadow: none !important;
}

#order-digit-of.vc-configure-redesign .irs-handle,
#order-digit-of.vc-configure-redesign .irs-slider {
  top: 19px !important;
  width: 30px !important;
  height: 30px !important;
  background: var(--vc-blue) !important;
  border: 4px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(43,111,196,.50) !important;
  cursor: pointer !important;
  transition: transform .15s !important;
}

#order-digit-of.vc-configure-redesign .irs-handle:hover,
#order-digit-of.vc-configure-redesign .irs-slider:hover {
  transform: scale(1.15) !important;
}

/* Value bubble replaced by large display in JS-injected header */
#order-digit-of.vc-configure-redesign .irs-single,
#order-digit-of.vc-configure-redesign .irs-from,
#order-digit-of.vc-configure-redesign .irs-to {
  display: none !important;
}

#order-digit-of.vc-configure-redesign .irs-grid-text {
  color: var(--vc-faint) !important;
  font-family: var(--vc-font) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

#order-digit-of.vc-configure-redesign .irs-min,
#order-digit-of.vc-configure-redesign .irs-max {
  top: 43px !important;
  display: block !important;
  background: transparent !important;
  color: #bbb !important;
  font-family: var(--vc-font) !important;
  font-size: .88rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  padding: 0 !important;
  visibility: visible !important;
}

#order-digit-of.vc-configure-redesign .irs-shadow,
#order-digit-of.vc-configure-redesign .irs-line-left,
#order-digit-of.vc-configure-redesign .irs-line-mid,
#order-digit-of.vc-configure-redesign .irs-line-right {
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Some WHMCS IonRange skins draw extra edge lines with pseudo-elements. */
#order-digit-of.vc-configure-redesign .irs-line::before,
#order-digit-of.vc-configure-redesign .irs-line::after,
#order-digit-of.vc-configure-redesign .irs-bar::before,
#order-digit-of.vc-configure-redesign .irs-bar::after {
  display: none !important;
  content: none !important;
}

#order-digit-of.vc-configure-redesign .irs-grid-pol {
  background: var(--vc-faint) !important;
}

#order-digit-of.vc-configure-redesign .irs-grid,
#order-digit-of.vc-configure-redesign .irs-grid-pol,
#order-digit-of.vc-configure-redesign .irs-grid-text {
  display: none !important;
}

#order-digit-of.vc-configure-redesign input.irs-input,
#order-digit-of.vc-configure-redesign .irs ~ input[type="range"],
#order-digit-of.vc-configure-redesign .irs ~ input[type="text"] {
  display: none !important;
}

@media (max-width: 1200px) {
  #order-digit-of.vc-configure-redesign .cart-body {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
  }
}

@media (max-width: 960px) {
  #order-digit-of.vc-configure-redesign .cart-body {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: "hero" "main" "side" !important;
  }

  #order-digit-of.vc-configure-redesign .cart-body > .sidebar-collapsed {
    position: static !important;
    max-width: 100% !important;
  }

  #order-digit-of.vc-configure-redesign .product-configurable-options,
  #order-digit-of.vc-configure-redesign .configurable-options {
    flex-direction: column !important;
  }
}

/* General primary button (e.g. "Ordina subito") */
#order-digit-of .btn-order-now,
#order-digit-of .wdes-digit-of-order-btn,
#order-digit-of .btn-primary {
  min-height: 52px !important;
  width: auto !important;
  min-width: 126px !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--vc-blue), var(--vc-blue2)) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.1px !important;
  text-decoration: none !important;
  box-shadow: 0 10px 20px rgba(43,111,196,.22) !important;
  cursor: pointer !important;
  transition: transform .15s ease, filter .15s ease !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#order-digit-of .btn-order-now:hover,
#order-digit-of .wdes-digit-of-order-btn:hover,
#order-digit-of .btn-primary:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.05) !important;
  color: #fff !important;
  text-decoration: none !important;
}

/* =========================================================
   PRODUCT CARDS
========================================================= */

#order-digit-of .products {
  width: 100% !important;
  margin: 0 !important;
}

#order-digit-of .products > .row,
#order-digit-of .row-eq-height {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
  width: 100% !important;
  margin: 0 !important;
}

#order-digit-of .products [class*="col-"] {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

#order-digit-of .product {
  height: 100% !important;
  min-height: 420px !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #fff !important;
  border: 1px solid #e8edf6 !important;
  border-top: 4px solid var(--vc-blue) !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-sm) !important;
  overflow: hidden !important;
  text-align: left !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}

#order-digit-of .product * { text-align: left !important; }

#order-digit-of .product:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 22px 56px rgba(15,34,72,.12) !important;
}

#order-digit-of .product header {
  min-height: 96px !important;
  padding: 28px 28px 16px !important;
  background: linear-gradient(180deg, rgba(238,244,255,.8), #fff) !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  color: var(--vc-ink) !important;
}

/* Product icon in soft tinted square */
#order-digit-of .product header > i {
  width: 50px !important;
  height: 50px !important;
  border-radius: 14px !important;
  background: #eaf2ff !important;
  color: var(--vc-blue) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  font-size: 20px !important;
}

#order-digit-of .product header span[id$="-name"] {
  color: var(--vc-ink) !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -.3px !important;
}

/* Pricing block */
#order-digit-of .product-pricing {
  padding: 12px 28px 22px !important;
  margin: 0 !important;
  border-top: 1px solid rgba(43,111,196,.12) !important;
  border-right: 0 !important;
  border-bottom: 1px solid rgba(43,111,196,.12) !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  background: #f7faff !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  color: #8ea0ba !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
}

#order-digit-of .product-pricing br { display: none !important; }

#order-digit-of .product-pricing .price {
  display: block !important;
  margin: 4px 0 0 !important;
  color: var(--vc-blue) !important;
  font-size: 34px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: -1px !important;
}

/* Description */
#order-digit-of .product-desc {
  flex: 1 !important;
  padding: 22px 28px 16px !important;
  display: block !important;
  color: #42526f !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  text-align: left !important;
}

#order-digit-of .product-desc p,
#order-digit-of .product-desc ul,
#order-digit-of .product-desc li {
  margin: 0 !important;
  padding: 0 !important;
  color: #42526f !important;
  font-family: var(--vc-font) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  list-style: none !important;
  border: 0 !important;
}

#order-digit-of .product-desc ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

#order-digit-of .product-desc li {
  padding-left: 28px !important;
  position: relative !important;
}

#order-digit-of .product-desc li:before {
  content: "\f00c" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 9px !important;
  color: var(--vc-blue) !important;
  position: absolute !important;
  left: 0 !important;
  top: 1px !important;
  width: 18px !important;
  height: 18px !important;
  background: var(--vc-soft) !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Product footer */
#order-digit-of .product footer {
  margin-top: auto !important;
  padding: 4px 28px 30px !important;
  border: 0 !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* "Ordina subito" button */
#order-digit-of .product .btn,
#order-digit-of .product button,
#order-digit-of .btn-order-now,
#order-digit-of .wdes-digit-of-order-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 52px !important;
  width: auto !important;
  min-width: 190px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 24px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, var(--vc-blue), var(--vc-blue2)) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 20px rgba(43,111,196,.22) !important;
  opacity: 1 !important;
  visibility: visible !important;
  white-space: nowrap !important;
  transition: transform .15s ease, filter .15s ease !important;
}

#order-digit-of .product .btn,
#order-digit-of .product button,
#order-digit-of .product .btn-order-now,
#order-digit-of .product .wdes-digit-of-order-btn {
  display: flex !important;
  float: none !important;
  width: fit-content !important;
  max-width: calc(100% - 56px) !important;
  align-self: center !important;
  margin: 0 auto !important;
}

#order-digit-of .product .vc-product-order-cta-wrap {
  display: flex !important;
  width: 100% !important;
  float: none !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

#order-digit-of .product .vc-product-order-cta {
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#order-digit-of .product .btn:hover,
#order-digit-of .product button:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.05) !important;
  color: #fff !important;
}

/* =========================================================
   RESPONSIVE — tablet
========================================================= */

@media (max-width: 1050px) {
  body:has(#order-digit-of) .vc-content {
    padding: 0 14px 60px !important;
  }

  #order-digit-of .header-lined {
    min-height: 124px !important;
    padding: 24px 190px 24px 98px !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .header-lined {
    min-height: 124px !important;
    padding: 24px 190px 24px 98px !important;
  }

  #order-digit-of .vc-cart-shell {
    grid-template-columns: 1fr !important;
    margin-top: 0 !important;
  }

  #order-digit-of .vc-cart-right {
    position: static !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .cart-body {
    grid-template-columns: 1fr !important;
    grid-template-areas: "hero" "side" "main" !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .products,
  #order-digit-of:not(.vc-cart-redesign) .sidebar-collapsed {
    margin-top: 0 !important;
  }

  #order-digit-of .products > .row,
  #order-digit-of .row-eq-height {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   RESPONSIVE — mobile
========================================================= */

@media (max-width: 680px) {
  #order-digit-of .header-lined {
    min-height: 144px !important;
    padding: 24px 22px 26px 22px !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .header-lined {
    min-height: 144px !important;
    padding: 24px 22px 26px 22px !important;
  }

  #order-digit-of .header-lined h1 {
    font-size: 25px !important;
  }

  #order-digit-of .header-lined:before {
    display: none !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .header-lined:before {
    display: none !important;
  }

  #order-digit-of .header-lined:after {
    width: 96px !important;
  }

  /* Promo: stack input + button vertically */
  #order-digit-of .vc-promo-box form,
  #order-digit-of .vc-promo-box .panel-body,
  #order-digit-of .vc-promo-box .card-body,
  #order-digit-of .vc-promo-box .input-group,
  #order-digit-of .vc-promo-box .row {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  #order-digit-of .vc-promo-box .btn,
  #order-digit-of .vc-promo-box button:not(.vc-promo-toggle),
  #order-digit-of .vc-promo-box input[type="submit"],
  #order-digit-of .vc-promo-box .vc-promo-apply,
  #order-digit-of .vc-promo-box #validatepromo,
  #order-digit-of #validatepromo {
    width: 100% !important;
    max-width: none !important;
  }

  #order-digit-of .order-summary,
  #order-digit-of .summary-container,
  #order-digit-of .vc-promo-box {
    padding: 24px !important;
  }

  #order-digit-of .total-due-today {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  #order-digit-of .total-due-today .amt {
    font-size: 32px !important;
    text-align: left !important;
  }
}


/* =========================================================
   V17 FINAL AURA LOCK — closer to code.html / DESIGN.md
   Keeps WHMCS markup stable and prevents old theme residues.
========================================================= */

body:has(#order-digit-of) {
  background: #fbfcfe !important;
}

#order-digit-of.vc-cart-redesign .cart-body {
  width: 100% !important;
}

#order-digit-of .vc-cart-shell {
  max-width: 1220px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#order-digit-of .view-cart-items,
#order-digit-of .vc-promo-box,
#order-digit-of .order-summary,
#order-digit-of .summary-container,
#order-digit-of .product {
  border-radius: 26px !important;
}

#order-digit-of .vc-promo-box {
  min-height: 250px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

#order-digit-of .vc-promo-box form,
#order-digit-of .vc-promo-box .panel-body,
#order-digit-of .vc-promo-box .card-body,
#order-digit-of .vc-promo-box .input-group,
#order-digit-of .vc-promo-box .row {
  align-items: stretch !important;
}

#order-digit-of .vc-promo-box input[type="text"],
#order-digit-of .vc-promo-box input[type="search"],
#order-digit-of .vc-promo-box .vc-promo-input,
#order-digit-of #promocode {
  box-shadow: none !important;
}

#order-digit-of .order-summary,
#order-digit-of .summary-container {
  border-top-color: #e63a77 !important;
}

#order-digit-of .product header > i:before,
#order-digit-of .vc-empty-cta i:before,
#order-digit-of .vc-reassurance i:before,
#order-digit-of .vc-ni-icon i:before {
  line-height: 1 !important;
}

#order-digit-of .product .btn:before,
#order-digit-of .wdes-digit-of-order-btn:before,
#order-digit-of .btn-order-now:before {
  content: "\f07a" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  margin-right: 8px !important;
}

#order-digit-of .vc-promo-box .btn:before,
#order-digit-of .vc-promo-box button:before,
#order-digit-of .vc-promo-box input[type="submit"]:before,
#order-digit-of #validatepromo:before {
  content: none !important;
  display: none !important;
}

@media (min-width: 992px) {
  #order-digit-of:not(.vc-cart-redesign) .cart-body {
    grid-template-columns: minmax(0, 1fr) 320px !important;
  }

  #order-digit-of .products > .row,
  #order-digit-of .row-eq-height {
    grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  }
}

@media (min-width: 992px) and (max-width: 1320px) {
  #order-digit-of:not(.vc-cart-redesign) .cart-body {
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 20px !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .products > .row,
  #order-digit-of:not(.vc-cart-redesign) .row-eq-height {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .sidebar-collapsed {
    max-width: 300px !important;
  }
}

@media (max-width: 991px) {
  #order-digit-of .vc-cart-shell {
    grid-template-columns: 1fr !important;
  }

  #order-digit-of .vc-cart-right {
    position: static !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .cart-body {
    grid-template-columns: 1fr !important;
    grid-template-areas: "hero" "main" "side" !important;
  }

  #order-digit-of:not(.vc-cart-redesign) .products,
  #order-digit-of:not(.vc-cart-redesign) .sidebar-collapsed {
    margin-top: 0 !important;
  }
}

/* =========================================================
   V18 FIXES — cleanup screenshot issues
   - header label slightly lower
   - promo card without inner grey/white box
   - order summary without nested boxes / wrong promo buttons
   - sidebar categories/actions flat, no duplicated panels
========================================================= */

/* Cart header label a little lower and more breathable */
#order-digit-of .view-cart-items-header {
  padding-top: 26px !important;
  padding-bottom: 18px !important;
  min-height: 72px !important;
  align-items: flex-start !important;
}

/* Promo card: remove WHMCS inner panel/card grey blocks */
#order-digit-of .vc-promo-box {
  padding: 34px !important;
  background: #fff !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-sm) !important;
}

#order-digit-of .vc-promo-box .panel,
#order-digit-of .vc-promo-box .card,
#order-digit-of .vc-promo-box .panel-default,
#order-digit-of .vc-promo-box .panel-primary,
#order-digit-of .vc-promo-box .well,
#order-digit-of .vc-promo-box .alert,
#order-digit-of .vc-promo-box .view-cart-promotion-code {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#order-digit-of .vc-promo-box .panel-heading,
#order-digit-of .vc-promo-box .card-header,
#order-digit-of .vc-promo-box .panel-title,
#order-digit-of .vc-promo-box .card-title,
#order-digit-of .vc-promo-box .heading,
#order-digit-of .vc-promo-box h2,
#order-digit-of .vc-promo-box h3,
#order-digit-of .vc-promo-box h4 {
  margin: 0 0 22px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
}

#order-digit-of .vc-promo-box .panel-body,
#order-digit-of .vc-promo-box .card-body,
#order-digit-of .vc-promo-box .content,
#order-digit-of .vc-promo-box .body {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Promo form must fill the white card, no compact grey island */
#order-digit-of .vc-promo-box form,
#order-digit-of .vc-promo-box .input-group,
#order-digit-of .vc-promo-box .row {
  width: 100% !important;
  max-width: none !important;
}

#order-digit-of .vc-promo-box input[type="text"],
#order-digit-of .vc-promo-box input[type="search"],
#order-digit-of .vc-promo-box .vc-promo-input,
#order-digit-of #promocode {
  max-width: none !important;
}

/* Order summary: if WHMCS outputs nested summary blocks, flatten the inner one */
#order-digit-of .order-summary .order-summary,
#order-digit-of .order-summary .summary-container,
#order-digit-of .summary-container .order-summary,
#order-digit-of .summary-container .summary-container {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Never show promo/apply-code buttons inside the right order-summary column */
#order-digit-of .vc-cart-right .order-summary #validatepromo,
#order-digit-of .vc-cart-right .summary-container #validatepromo,
#order-digit-of .vc-cart-right .order-summary .vc-promo-apply,
#order-digit-of .vc-cart-right .summary-container .vc-promo-apply,
#order-digit-of .vc-cart-right .order-summary button:not(.checkout):not(#checkout):not(.btn-checkout):not(.checkout-btn):not(.vc-checkout-button),
#order-digit-of .vc-cart-right .summary-container button:not(.checkout):not(#checkout):not(.btn-checkout):not(.checkout-btn):not(.vc-checkout-button),
#order-digit-of .vc-cart-right .order-summary input[type="submit"]:not(.checkout):not(#checkout):not(.btn-checkout):not(.checkout-btn):not(.vc-checkout-button),
#order-digit-of .vc-cart-right .summary-container input[type="submit"]:not(.checkout):not(#checkout):not(.btn-checkout):not(.checkout-btn):not(.vc-checkout-button) {
  display: none !important;
}

/* =========================================================
   V19 HARD FIXES — rebuilt clean promo/summary/sidebar
========================================================= */

/* Header label: move down a bit more */
#order-digit-of .view-cart-items-header {
  padding-top: 34px !important;
  padding-bottom: 20px !important;
  min-height: 86px !important;
  align-items: flex-start !important;
}

/* Hide original WHMCS promo once the clean card is rendered */
#order-digit-of .vc-original-promo-hidden {
  display: none !important;
}

#order-digit-of .vc-clean-promo-card {
  width: 100% !important;
  margin: 0 !important;
  padding: 34px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: var(--vc-radius) !important;
  box-shadow: var(--vc-shadow-sm) !important;
  overflow: visible !important;
}

#order-digit-of .vc-clean-promo-title {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.3px !important;
}

#order-digit-of .vc-clean-promo-title i {
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--vc-pink) !important;
  background: rgba(230,58,119,.10) !important;
  font-size: 13px !important;
}

#order-digit-of .vc-clean-promo-form {
  display: flex !important;
  width: 100% !important;
  gap: 16px !important;
  align-items: center !important;
}

#order-digit-of .vc-clean-promo-input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 56px !important;
  padding: 0 18px !important;
  border: 1.5px solid var(--vc-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  outline: none !important;
  box-shadow: none !important;
}

#order-digit-of .vc-clean-promo-input:focus {
  border-color: var(--vc-blue) !important;
  box-shadow: 0 0 0 4px var(--vc-soft) !important;
}

#order-digit-of .vc-clean-promo-input::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

#order-digit-of .vc-clean-promo-button {
  flex: 0 0 auto !important;
  min-width: 176px !important;
  height: 56px !important;
  padding: 0 28px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--vc-navy) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

/* Rebuilt summary: no inner boxes, no random apply-code buttons */
#order-digit-of .vc-summary-rebuilt > *:not(.vc-clean-summary) {
  display: none !important;
}

#order-digit-of .vc-clean-summary {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#order-digit-of .vc-clean-summary-title {
  margin: 0 0 26px !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.5px !important;
}

#order-digit-of .vc-clean-summary-lines {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  margin: 0 0 20px !important;
  padding: 0 0 4px !important;
  border-bottom: 1px solid rgba(194,198,211,.55) !important;
}

#order-digit-of .vc-clean-summary-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 0 18px !important;
  color: var(--vc-muted) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

#order-digit-of .vc-clean-summary-row strong {
  color: var(--vc-ink) !important;
  font-weight: 800 !important;
}

#order-digit-of .vc-clean-total-box {
  margin: 0 0 24px !important;
  padding: 22px !important;
  border: 1px solid rgba(43,111,196,.14) !important;
  border-radius: 14px !important;
  background: #f2f3ff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

#order-digit-of .vc-clean-total-box,
#order-digit-of .total-due-today {
  width: 100% !important;
  min-width: 0 !important;
}

#order-digit-of .vc-clean-total-amount {
  color: var(--vc-blue) !important;
  font-size: 38px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: -1.4px !important;
}

#order-digit-of .vc-clean-total-label {
  color: var(--vc-sub) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#order-digit-of .vc-clean-checkout {
  width: 100% !important;
  min-height: 56px !important;
  height: 56px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, var(--vc-green), var(--vc-green2)) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 28px rgba(22,163,74,.25) !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

#order-digit-of .vc-clean-continue {
  display: flex !important;
  justify-content: center !important;
  margin: 22px 0 0 !important;
  color: var(--vc-blue) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

#order-digit-of .vc-clean-reassurance {
  margin: 28px 0 0 !important;
  padding: 22px 0 0 !important;
  border-top: 1px solid var(--vc-line) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  color: var(--vc-muted) !important;
  font-family: var(--vc-font) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
}

#order-digit-of .vc-clean-reassurance span {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  white-space: nowrap !important;
}

#order-digit-of .vc-clean-reassurance i { color: var(--vc-blue) !important; }

@media (max-width: 767px) {
  #order-digit-of .vc-clean-promo-form { flex-direction: column !important; align-items: stretch !important; }
  #order-digit-of .vc-clean-promo-button { width: 100% !important; }
}


/* =========================================================
   V24 FIX DEFINITIVO — NASCONDE DUPLICATI SIDEBAR
========================================================= */

/* Tutti i blocchi duplicati marcati dal JS spariscono completamente */
#order-digit-of .vc-nav-panel.vc-sidebar-duplicate,
#order-digit-of .vc-nav-panel.vc-nav-duplicate,
#order-digit-of .vc-nav-head.vc-sidebar-duplicate,
#order-digit-of .vc-nav-body.vc-sidebar-duplicate,
#order-digit-of .vc-nav-item.vc-sidebar-duplicate,
#order-digit-of .vc-sidebar-duplicate {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Card principali sidebar */
#order-digit-of .sidebar-collapsed {
  display: flex !important;
  flex-direction: column !important;
  gap: 22px !important;
  width: 100% !important;
  max-width: 360px !important;
  margin: 24px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

#order-digit-of .sidebar-collapsed > .panel,
#order-digit-of .sidebar-collapsed > .card,
#order-digit-of .sidebar-collapsed > .list-group,
#order-digit-of .sidebar-collapsed > select {
  display: none !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid #e8edf6 !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 38px rgba(15,34,72,.08) !important;
  overflow: hidden !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-head {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 24px 18px 16px !important;
  background: #f7f9ff !important;
  border: 0 !important;
  border-bottom: 1px solid #e8edf6 !important;
  box-shadow: none !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-head i {
  display: none !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-head span {
  display: block !important;
  color: var(--vc-muted) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 14px !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 13px 15px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  border: 1px solid #eef2f7 !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #424752 !important;
  font-family: var(--vc-font) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item:hover {
  background: #f2f3ff !important;
  border-color: rgba(43,111,196,.22) !important;
  color: var(--vc-blue) !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item.is-active {
  background: linear-gradient(135deg, var(--vc-blue), var(--vc-blue2)) !important;
  border-color: transparent !important;
  color: #fff !important;
  cursor: default !important;
  box-shadow: 0 10px 20px rgba(43,111,196,.22) !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-ni-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  color: var(--vc-blue) !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item.is-active .vc-ni-icon {
  color: #fff !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-ni-label {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-ni-arrow {
  display: none !important;
}

#order-digit-of.vc-cart-redesign .vc-cart-right .sidebar-collapsed {
  max-width: none !important;
}

/* ── Billing calculation overlay ─────────────────────────────────────── */
.vc-calc-overlay {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 10;
  border-radius: 16px;
  pointer-events: none;
}
.vc-dark .vc-calc-overlay {
  background: rgba(10,18,36,.82);
}
.vc-calc-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-family: var(--vc-font);
  font-size: 13px;
  font-weight: 700;
  color: #1e2a44;
  letter-spacing: -.1px;
}
.vc-dark .vc-calc-inner { color: #cbd5e1; }
.vc-calc-spin {
  width: 28px;
  height: 28px;
  border: 3px solid rgba(43,111,196,.2);
  border-top-color: #2b6fc4;
  border-radius: 50%;
  animation: vc-calc-spin-anim .65s linear infinite;
}
@keyframes vc-calc-spin-anim { to { transform: rotate(360deg); } }

/* =========================================================
   V26 CHECKOUT REDESIGN
   Dedicated layout for cart.php?a=checkout. Keeps WHMCS form logic intact.
========================================================= */

body:has(#order-digit-of.vc-checkout-redesign) .vc-content {
  max-width: none !important;
  margin: 0 auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  padding-bottom: 80px !important;
}

#order-digit-of.vc-checkout-redesign {
  overflow: visible !important;
}

#order-digit-of.vc-checkout-redesign .cart-body {
  display: grid !important;
  grid-template-columns: minmax(0, 860px) minmax(300px, 360px) !important;
  grid-template-areas: none !important;
  gap: 24px !important;
  align-items: start !important;
  width: min(100%, 1260px) !important;
  margin: 0 auto !important;
  padding: 0 0 70px !important;
  overflow: visible !important;
}

#order-digit-of.vc-checkout-redesign .header-lined {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  grid-area: auto !important;
  width: 100% !important;
  min-height: 136px !important;
  margin: 14px 0 4px !important;
  padding: 24px 220px 24px 98px !important;
  background:
    radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px) 0 0 / 30px 30px,
    radial-gradient(760px 320px at 100% 18%, rgba(74,146,229,.54), transparent 62%),
    linear-gradient(135deg, #0a1530 0%, #153c7d 58%, #7353aa 100%) !important;
}

#order-digit-of.vc-checkout-redesign .header-lined h1 {
  font-size: 2.08rem !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

#order-digit-of.vc-checkout-redesign .header-lined h1:before {
  content: "Area clienti" !important;
}

#order-digit-of.vc-checkout-redesign .header-lined h1:after {
  content: "Completa l'ordine in modo sicuro e conferma il metodo di pagamento." !important;
  max-width: 560px !important;
  font-size: .98rem !important;
  line-height: 1.42 !important;
  color: rgba(255,255,255,.86) !important;
  font-weight: 600 !important;
}

#order-digit-of.vc-checkout-redesign .cart-body > *:not(.header-lined):not(.sidebar-collapsed):not(.vc-nav-panel):not(.vc-cart-shell) {
  grid-column: 1 !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin-top: 0 !important;
}

#order-digit-of.vc-checkout-redesign .cart-body > .alert:not(.vc-checkout-security) {
  margin: 0 0 4px !important;
  color: var(--vc-muted) !important;
  font-family: var(--vc-font) !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
}

#order-digit-of.vc-checkout-redesign .cart-body > p {
  display: none !important;
}

#order-digit-of.vc-checkout-redesign .cart-body > .sidebar-collapsed {
  grid-column: 2 !important;
  grid-row: 2 / span 20 !important;
  grid-area: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  align-self: start !important;
  position: sticky !important;
  top: 24px !important;
  z-index: 4 !important;
}

#order-digit-of.vc-checkout-redesign .vc-cart-shell {
  display: contents !important;
}

#order-digit-of.vc-checkout-redesign .vc-cart-left,
#order-digit-of.vc-checkout-redesign .vc-cart-right {
  display: contents !important;
}

#order-digit-of.vc-checkout-redesign .cart-body > .vc-checkout-main-wrap {
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-main,
#order-digit-of.vc-checkout-redesign #frmCheckout,
#order-digit-of.vc-checkout-redesign form[name="orderfrm"],
#order-digit-of.vc-checkout-redesign form.checkout,
#order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
#order-digit-of.vc-checkout-redesign .checkout-container,
#order-digit-of.vc-checkout-redesign .view-cart-checkout {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 28px !important;
  display: block !important;
  background: #fff !important;
  border: 1px solid #e4ebf6 !important;
  border-radius: 22px !important;
  color: var(--vc-ink) !important;
  box-shadow: 0 18px 46px rgba(15,34,72,.08) !important;
  transform: none !important;
  filter: none !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-main .row,
#order-digit-of.vc-checkout-redesign #frmCheckout .row,
#order-digit-of.vc-checkout-redesign form[name="orderfrm"] .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-main [class*="col-"],
#order-digit-of.vc-checkout-redesign #frmCheckout [class*="col-"],
#order-digit-of.vc-checkout-redesign form[name="orderfrm"] [class*="col-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  min-width: 0 !important;
}

#order-digit-of.vc-checkout-redesign .sub-heading,
#order-digit-of.vc-checkout-redesign .vc-checkout-section-title,
#order-digit-of.vc-checkout-redesign .section-heading {
  width: 100% !important;
  margin: 24px 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  text-align: left !important;
}

#order-digit-of.vc-checkout-redesign .sub-heading:first-child,
#order-digit-of.vc-checkout-redesign .vc-checkout-section-title:first-child {
  margin-top: 0 !important;
}

#order-digit-of.vc-checkout-redesign .sub-heading span,
#order-digit-of.vc-checkout-redesign .vc-checkout-section-title span,
#order-digit-of.vc-checkout-redesign .section-heading span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  letter-spacing: -.25px !important;
  text-transform: none !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container,
#order-digit-of.vc-checkout-redesign .account-select,
#order-digit-of.vc-checkout-redesign .payment-methods,
#order-digit-of.vc-checkout-redesign .payment-method,
#order-digit-of.vc-checkout-redesign .cc-payment-form,
#order-digit-of.vc-checkout-redesign .existing-cc-grid,
#order-digit-of.vc-checkout-redesign .client-credit-card {
  border-radius: 16px !important;
}

#order-digit-of.vc-checkout-redesign label,
#order-digit-of.vc-checkout-redesign .radio,
#order-digit-of.vc-checkout-redesign .checkbox {
  color: var(--vc-sub) !important;
  font-family: var(--vc-font) !important;
  font-weight: 650 !important;
}

#order-digit-of.vc-checkout-redesign .form-control,
#order-digit-of.vc-checkout-redesign input[type="text"],
#order-digit-of.vc-checkout-redesign input[type="email"],
#order-digit-of.vc-checkout-redesign input[type="password"],
#order-digit-of.vc-checkout-redesign select,
#order-digit-of.vc-checkout-redesign textarea {
  border-color: #dce6f5 !important;
  border-radius: 14px !important;
}

#order-digit-of.vc-checkout-redesign textarea {
  min-height: 96px !important;
  resize: vertical !important;
}

#order-digit-of.vc-checkout-redesign .total-due-today,
#order-digit-of.vc-checkout-redesign .view-cart-total,
#order-digit-of.vc-checkout-redesign .order-total {
  margin: 18px 0 22px !important;
  padding: 18px 22px !important;
  border: 1px solid rgba(34,197,94,.32) !important;
  border-radius: 14px !important;
  background: #ecfdf3 !important;
  color: #15803d !important;
  box-shadow: none !important;
}

#order-digit-of.vc-checkout-redesign .total-due-today .amt,
#order-digit-of.vc-checkout-redesign .view-cart-total strong,
#order-digit-of.vc-checkout-redesign .order-total strong {
  color: #15803d !important;
  font-size: 20px !important;
  letter-spacing: -.3px !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-complete,
#order-digit-of.vc-checkout-redesign #btnCompleteOrder,
#order-digit-of.vc-checkout-redesign button[name="checkout"],
#order-digit-of.vc-checkout-redesign input[type="submit"][name="checkout"] {
  width: auto !important;
  min-width: 210px !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 20px auto 0 !important;
  padding: 0 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #2b7be4, #1658b7) !important;
  color: #fff !important;
  font-family: var(--vc-font) !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  box-shadow: 0 16px 32px rgba(43,111,196,.28) !important;
  cursor: pointer !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-complete:hover,
#order-digit-of.vc-checkout-redesign #btnCompleteOrder:hover {
  color: #fff !important;
  filter: brightness(1.04) !important;
  transform: translateY(-1px) !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security {
  grid-column: 1 !important;
  width: min(100%, 360px) !important;
  margin: 0 0 0 auto !important;
  padding: 16px 18px 16px 54px !important;
  border: 1px solid #fed7aa !important;
  border-radius: 14px !important;
  background: #fff7ed !important;
  color: #c05621 !important;
  font-family: var(--vc-font) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
  position: relative !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security:before {
  content: "\f023" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  left: 17px !important;
  top: 18px !important;
  color: #c05621 !important;
  font-size: 22px !important;
}

#order-digit-of.vc-checkout-redesign .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) {
  box-shadow: 0 14px 38px rgba(15,34,72,.06) !important;
}

@media (max-width: 1180px) {
  #order-digit-of.vc-checkout-redesign .cart-body {
    grid-template-columns: minmax(0, 1fr) 320px !important;
  }
}

@media (max-width: 991px) {
  #order-digit-of.vc-checkout-redesign .cart-body {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    width: 100% !important;
  }

  #order-digit-of.vc-checkout-redesign .header-lined,
  #order-digit-of.vc-checkout-redesign .cart-body > *:not(.header-lined):not(.sidebar-collapsed):not(.vc-nav-panel):not(.vc-cart-shell),
  #order-digit-of.vc-checkout-redesign .vc-checkout-main,
  #order-digit-of.vc-checkout-redesign #frmCheckout,
  #order-digit-of.vc-checkout-redesign form[name="orderfrm"],
  #order-digit-of.vc-checkout-redesign .cart-body > .sidebar-collapsed,
  #order-digit-of.vc-checkout-redesign .vc-checkout-security {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  #order-digit-of.vc-checkout-redesign .cart-body > .sidebar-collapsed {
    position: static !important;
    max-width: none !important;
  }

  #order-digit-of.vc-checkout-redesign .header-lined {
    min-height: 150px !important;
    padding-right: 32px !important;
  }
}

@media (max-width: 640px) {
  body:has(#order-digit-of.vc-checkout-redesign) .vc-content {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  #order-digit-of.vc-checkout-redesign .header-lined {
    padding: 24px 24px 24px 84px !important;
  }

  #order-digit-of.vc-checkout-redesign .vc-checkout-main,
  #order-digit-of.vc-checkout-redesign #frmCheckout,
  #order-digit-of.vc-checkout-redesign form[name="orderfrm"],
  #order-digit-of.vc-checkout-redesign form.checkout,
  #order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
  #order-digit-of.vc-checkout-redesign .checkout-container,
  #order-digit-of.vc-checkout-redesign .view-cart-checkout {
    padding: 22px !important;
    border-radius: 18px !important;
  }

  #order-digit-of.vc-checkout-redesign .vc-checkout-complete,
  #order-digit-of.vc-checkout-redesign #btnCompleteOrder,
  #order-digit-of.vc-checkout-redesign button[name="checkout"],
  #order-digit-of.vc-checkout-redesign input[type="submit"][name="checkout"] {
    width: 100% !important;
    min-width: 0 !important;
  }
}

/* Checkout vertical correction: WHMCS keeps a large spacer before the native
   checkout form, so pull only the form wrapper upward on desktop/tablet. */
#order-digit-of.vc-checkout-redesign .cart-body > .vc-checkout-main-wrap,
#order-digit-of.vc-checkout-redesign .vc-checkout-main-wrap,
#order-digit-of.vc-checkout-redesign .vc-checkout-main,
#order-digit-of.vc-checkout-redesign #frmCheckout,
#order-digit-of.vc-checkout-redesign form[name="orderfrm"],
#order-digit-of.vc-checkout-redesign form.checkout,
#order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
#order-digit-of.vc-checkout-redesign .checkout-container,
#order-digit-of.vc-checkout-redesign .view-cart-checkout {
  margin-top: clamp(-240px, -22vh, -170px) !important;
}

@media (max-width: 991px) {
  #order-digit-of.vc-checkout-redesign .cart-body > .vc-checkout-main-wrap,
  #order-digit-of.vc-checkout-redesign .vc-checkout-main-wrap,
  #order-digit-of.vc-checkout-redesign .vc-checkout-main,
  #order-digit-of.vc-checkout-redesign #frmCheckout,
  #order-digit-of.vc-checkout-redesign form[name="orderfrm"],
  #order-digit-of.vc-checkout-redesign form.checkout,
  #order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
  #order-digit-of.vc-checkout-redesign .checkout-container,
  #order-digit-of.vc-checkout-redesign .view-cart-checkout {
    margin-top: 0 !important;
  }
}

/* Checkout polish: cleaner inner blocks and compact secure-order notice */
#order-digit-of.vc-checkout-redesign .vc-checkout-intro {
  display: none !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-main,
#order-digit-of.vc-checkout-redesign #frmCheckout,
#order-digit-of.vc-checkout-redesign form[name="orderfrm"],
#order-digit-of.vc-checkout-redesign form.checkout,
#order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
#order-digit-of.vc-checkout-redesign .checkout-container,
#order-digit-of.vc-checkout-redesign .view-cart-checkout {
  padding: 32px 34px 34px !important;
  border: 1px solid #dde7f5 !important;
  border-top: 4px solid var(--vc-blue) !important;
  box-shadow: 0 20px 58px rgba(15,34,72,.09) !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container,
#order-digit-of.vc-checkout-redesign .account-select,
#order-digit-of.vc-checkout-redesign .client-account,
#order-digit-of.vc-checkout-redesign .account-wrapper {
  min-height: 0 !important;
  margin: 10px 0 20px !important;
  padding: 14px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px !important;
  border: 1px solid #e5edf8 !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #fff 0%, #f8fbff 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8) !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container label,
#order-digit-of.vc-checkout-redesign .account-select label,
#order-digit-of.vc-checkout-redesign .payment-method,
#order-digit-of.vc-checkout-redesign label[for*="paymentmethod"] {
  min-height: 44px !important;
  margin: 0 !important;
  padding: 10px 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  border: 1px solid #e7eef8 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: var(--vc-sub) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container input[type="radio"],
#order-digit-of.vc-checkout-redesign .account-select input[type="radio"],
#order-digit-of.vc-checkout-redesign input[type="radio"] {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  accent-color: var(--vc-blue) !important;
}

#order-digit-of.vc-checkout-redesign .total-due-today,
#order-digit-of.vc-checkout-redesign .view-cart-total,
#order-digit-of.vc-checkout-redesign .order-total {
  background: linear-gradient(135deg, #ecfdf3 0%, #f5fff8 100%) !important;
  border-color: rgba(22,163,74,.26) !important;
  box-shadow: 0 10px 28px rgba(22,163,74,.07) !important;
}

#order-digit-of.vc-checkout-redesign textarea.form-control,
#order-digit-of.vc-checkout-redesign textarea {
  width: 100% !important;
  max-width: 330px !important;
  min-height: 104px !important;
  padding: 16px !important;
  background: #fbfdff !important;
  color: var(--vc-sub) !important;
  font-weight: 700 !important;
}

#order-digit-of.vc-checkout-redesign .checkbox,
#order-digit-of.vc-checkout-redesign .accepttos,
#order-digit-of.vc-checkout-redesign label[for="accepttos"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 22px 0 0 !important;
  color: var(--vc-sub) !important;
  font-size: 13px !important;
  font-weight: 750 !important;
}

#order-digit-of.vc-checkout-redesign input[name="accepttos"] {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  accent-color: var(--vc-blue) !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 18px 0 0 !important;
  padding: 15px 18px 15px 58px !important;
  display: block !important;
  border: 1px solid #fed7aa !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #fff7ed 0%, #fffaf5 100%) !important;
  color: #b45309 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.45 !important;
  box-shadow: 0 12px 28px rgba(180,83,9,.07) !important;
  overflow: hidden !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security:before {
  left: 17px !important;
  top: 50% !important;
  width: 28px !important;
  height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 9px !important;
  background: rgba(217,119,6,.12) !important;
  color: #d97706 !important;
  font-size: 15px !important;
  transform: translateY(-50%) !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security i,
#order-digit-of.vc-checkout-redesign .vc-checkout-security .fa,
#order-digit-of.vc-checkout-redesign .vc-checkout-security .fas,
#order-digit-of.vc-checkout-redesign .vc-checkout-security .fa-solid {
  display: none !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-security strong,
#order-digit-of.vc-checkout-redesign .vc-checkout-security b {
  color: #9a3412 !important;
  font-weight: 900 !important;
}

/* Checkout account/new-account refinements */
#order-digit-of.vc-checkout-redesign .account-select-container .radio,
#order-digit-of.vc-checkout-redesign .account-select-container .radio-inline,
#order-digit-of.vc-checkout-redesign .account-select-container .checkbox,
#order-digit-of.vc-checkout-redesign .account-select-container .checkbox-inline,
#order-digit-of.vc-checkout-redesign .account-select .radio,
#order-digit-of.vc-checkout-redesign .account-select .radio-inline,
#order-digit-of.vc-checkout-redesign .account-select .checkbox,
#order-digit-of.vc-checkout-redesign .account-select .checkbox-inline,
#order-digit-of.vc-checkout-redesign .client-account .radio,
#order-digit-of.vc-checkout-redesign .client-account .radio-inline,
#order-digit-of.vc-checkout-redesign .account-wrapper .radio,
#order-digit-of.vc-checkout-redesign .account-wrapper .radio-inline {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container label,
#order-digit-of.vc-checkout-redesign .account-select label,
#order-digit-of.vc-checkout-redesign .client-account label,
#order-digit-of.vc-checkout-redesign .account-wrapper label {
  background: #fff !important;
  border: 1px solid #dfe8f6 !important;
  box-shadow: 0 8px 18px rgba(15,34,72,.035) !important;
}

#order-digit-of.vc-checkout-redesign .account-select-container label:hover,
#order-digit-of.vc-checkout-redesign .account-select label:hover,
#order-digit-of.vc-checkout-redesign .client-account label:hover,
#order-digit-of.vc-checkout-redesign .account-wrapper label:hover {
  border-color: rgba(43,111,196,.34) !important;
  background: #f8fbff !important;
}

/* Wider additional notes */
#order-digit-of.vc-checkout-redesign textarea.form-control,
#order-digit-of.vc-checkout-redesign textarea,
#order-digit-of.vc-checkout-redesign textarea[name="notes"],
#order-digit-of.vc-checkout-redesign #inputAdditionalNotes,
#order-digit-of.vc-checkout-redesign #notes {
  width: min(100%, 560px) !important;
  max-width: 560px !important;
  min-height: 124px !important;
}

/* WHMCS intl-tel-input: keep country prefix visible in the new-account form */
#order-digit-of.vc-checkout-redesign .intl-tel-input,
#order-digit-of.vc-checkout-redesign .iti,
#order-digit-of.vc-checkout-redesign .iti--allow-dropdown,
#order-digit-of.vc-checkout-redesign .iti--separate-dial-code {
  width: 100% !important;
  max-width: 560px !important;
  display: block !important;
  position: relative !important;
}

#order-digit-of.vc-checkout-redesign .intl-tel-input .flag-container,
#order-digit-of.vc-checkout-redesign .iti__flag-container {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 3 !important;
}

#order-digit-of.vc-checkout-redesign .intl-tel-input .selected-flag,
#order-digit-of.vc-checkout-redesign .iti__selected-flag {
  width: 92px !important;
  min-width: 92px !important;
  height: 100% !important;
  padding: 0 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  background: #f8fbff !important;
  border-right: 1px solid #dfe8f6 !important;
  border-radius: 14px 0 0 14px !important;
  color: var(--vc-ink) !important;
}

#order-digit-of.vc-checkout-redesign .intl-tel-input .selected-dial-code,
#order-digit-of.vc-checkout-redesign .iti__selected-dial-code {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

#order-digit-of.vc-checkout-redesign .intl-tel-input.allow-dropdown input,
#order-digit-of.vc-checkout-redesign .intl-tel-input.separate-dial-code input,
#order-digit-of.vc-checkout-redesign .iti--allow-dropdown input,
#order-digit-of.vc-checkout-redesign .iti--separate-dial-code input,
#order-digit-of.vc-checkout-redesign input[name^="phone"],
#order-digit-of.vc-checkout-redesign input[name$="phone"] {
  padding-left: 108px !important;
}

#order-digit-of.vc-checkout-redesign .intl-tel-input .country-list,
#order-digit-of.vc-checkout-redesign .iti__country-list {
  z-index: 99999 !important;
  width: min(360px, 90vw) !important;
  max-height: 260px !important;
  border: 1px solid #dfe8f6 !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(15,34,72,.16) !important;
  color: var(--vc-ink) !important;
  background: #fff !important;
}

/* Checkout targeted markers: stabilise WHMCS account, notes and phone fields */
#order-digit-of.vc-checkout-redesign .vc-checkout-account-panel {
  width: 100% !important;
  margin: 10px 0 22px !important;
  padding: 14px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px !important;
  border: 1px solid #dde8f6 !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82) !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice-parent {
  min-width: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-panel label:not(.vc-checkout-account-choice),
#order-digit-of.vc-checkout-redesign .vc-checkout-account-panel .radio:not(.vc-checkout-account-choice),
#order-digit-of.vc-checkout-redesign .vc-checkout-account-panel .radio-inline:not(.vc-checkout-account-choice),
#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice label,
#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .radio,
#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .radio-inline {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice {
  min-height: 54px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  border: 1px solid #dfe8f6 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  color: var(--vc-ink) !important;
  font-family: var(--vc-font) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  box-shadow: 0 8px 20px rgba(15,34,72,.035) !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice:hover,
#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice:focus-within {
  border-color: rgba(43,111,196,.42) !important;
  background: #f8fbff !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice-new {
  background: #fff !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice input[type="radio"] {
  flex: 0 0 auto !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .label,
#order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .badge {
  border-radius: 8px !important;
  background: linear-gradient(135deg, #2f80ed 0%, #2b6fc4 100%) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-notes-parent {
  width: 100% !important;
  max-width: 720px !important;
  min-width: 0 !important;
}

#order-digit-of.vc-checkout-redesign textarea.vc-checkout-notes-field,
#order-digit-of.vc-checkout-redesign .vc-checkout-notes-field.form-control {
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  min-height: 138px !important;
  resize: vertical !important;
  display: block !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap,
#order-digit-of.vc-checkout-redesign .vc-checkout-iti {
  width: min(100%, 560px) !important;
  max-width: 560px !important;
  min-width: 0 !important;
  display: block !important;
  position: relative !important;
  overflow: visible !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-iti .flag-container,
#order-digit-of.vc-checkout-redesign .vc-checkout-iti .iti__flag-container,
#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .flag-container,
#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .iti__flag-container {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 104px !important;
  min-width: 104px !important;
  z-index: 12 !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-iti .selected-flag,
#order-digit-of.vc-checkout-redesign .vc-checkout-iti .iti__selected-flag,
#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .selected-flag,
#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .iti__selected-flag {
  width: 104px !important;
  min-width: 104px !important;
  padding: 0 12px !important;
  background: #f8fbff !important;
  border-right: 1px solid #dfe8f6 !important;
  border-radius: 14px 0 0 14px !important;
}

#order-digit-of.vc-checkout-redesign input.vc-checkout-phone-input {
  width: 100% !important;
  max-width: 560px !important;
  padding-left: 118px !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-phone-plain {
  position: relative !important;
  width: min(100%, 560px) !important;
  max-width: 560px !important;
}

#order-digit-of.vc-checkout-redesign input.vc-checkout-phone-editable-prefix {
  padding-left: 44px !important;
}

#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .selected-dial-code,
#order-digit-of.vc-checkout-redesign .vc-checkout-phone-wrap .iti__selected-dial-code {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: var(--vc-ink) !important;
}

/* =========================================================
   ORDERFLOW DARK MODE
   Store, configuratore, carrello, checkout.
========================================================= */

html[data-vc-dark] body:has(#order-digit-of),
html.vc-dark body:has(#order-digit-of),
body.vc-dark:has(#order-digit-of) {
  background: #0a1224 !important;
}

html[data-vc-dark] #order-digit-of,
.vc-dark #order-digit-of {
  --vc-ink: #f8fafc;
  --vc-sub: #e2e8f0;
  --vc-muted: #94a3b8;
  --vc-faint: #64748b;
  --vc-line: rgba(148,163,184,.16);
  --vc-border: rgba(148,163,184,.22);
  --vc-surface: #121c33;
  --vc-shadow-sm: 0 18px 44px rgba(0,0,0,.26);
  --vc-shadow-md: 0 26px 70px rgba(0,0,0,.34);
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of .vc-cart-shell,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .cart-body,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .cart-body,
.vc-dark #order-digit-of .vc-cart-shell,
.vc-dark #order-digit-of.vc-configure-redesign .cart-body,
.vc-dark #order-digit-of.vc-checkout-redesign .cart-body {
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of .product,
html[data-vc-dark] #order-digit-of .view-cart-items,
html[data-vc-dark] #order-digit-of .view-cart-items .item,
html[data-vc-dark] #order-digit-of .view-cart-items .item-domain,
html[data-vc-dark] #order-digit-of .view-cart-items .item-addon,
html[data-vc-dark] #order-digit-of .view-cart-items .item-configurable-option,
html[data-vc-dark] #order-digit-of .view-cart-items .item-child,
html[data-vc-dark] #order-digit-of .cart-item,
html[data-vc-dark] #order-digit-of .order-summary,
html[data-vc-dark] #order-digit-of .summary-container,
html[data-vc-dark] #order-digit-of .vc-clean-summary,
html[data-vc-dark] #order-digit-of .vc-clean-promo-card,
html[data-vc-dark] #order-digit-of .vc-promo-box,
html[data-vc-dark] #order-digit-of .promo-code-cart-container,
html[data-vc-dark] #order-digit-of .promotion-code,
html[data-vc-dark] #order-digit-of .apply-credit-container,
html[data-vc-dark] #order-digit-of .empty-cart,
html[data-vc-dark] #order-digit-of .view-cart-empty,
html[data-vc-dark] #order-digit-of .view-cart-items .empty,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .sidebar-collapsed .order-summary,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .sidebar-collapsed .summary-container,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .product-info,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .product-configurable-options .form-group,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .configurable-options .form-group,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-configure-size-card,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-main,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign #frmCheckout,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign form[name="orderfrm"],
html[data-vc-dark] #order-digit-of.vc-checkout-redesign form.checkout,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .checkout-container,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .view-cart-checkout,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-account-panel,
.vc-dark #order-digit-of .product,
.vc-dark #order-digit-of .view-cart-items,
.vc-dark #order-digit-of .view-cart-items .item,
.vc-dark #order-digit-of .view-cart-items .item-domain,
.vc-dark #order-digit-of .view-cart-items .item-addon,
.vc-dark #order-digit-of .view-cart-items .item-configurable-option,
.vc-dark #order-digit-of .view-cart-items .item-child,
.vc-dark #order-digit-of .cart-item,
.vc-dark #order-digit-of .order-summary,
.vc-dark #order-digit-of .summary-container,
.vc-dark #order-digit-of .vc-clean-summary,
.vc-dark #order-digit-of .vc-clean-promo-card,
.vc-dark #order-digit-of .vc-promo-box,
.vc-dark #order-digit-of .promo-code-cart-container,
.vc-dark #order-digit-of .promotion-code,
.vc-dark #order-digit-of .apply-credit-container,
.vc-dark #order-digit-of .empty-cart,
.vc-dark #order-digit-of .view-cart-empty,
.vc-dark #order-digit-of .view-cart-items .empty,
.vc-dark #order-digit-of.vc-configure-redesign .sidebar-collapsed .order-summary,
.vc-dark #order-digit-of.vc-configure-redesign .sidebar-collapsed .summary-container,
.vc-dark #order-digit-of.vc-configure-redesign .product-info,
.vc-dark #order-digit-of.vc-configure-redesign .product-configurable-options .form-group,
.vc-dark #order-digit-of.vc-configure-redesign .configurable-options .form-group,
.vc-dark #order-digit-of.vc-configure-redesign .vc-configure-size-card,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-main,
.vc-dark #order-digit-of.vc-checkout-redesign #frmCheckout,
.vc-dark #order-digit-of.vc-checkout-redesign form[name="orderfrm"],
.vc-dark #order-digit-of.vc-checkout-redesign form.checkout,
.vc-dark #order-digit-of.vc-checkout-redesign .checkout:not(a):not(button):not(input),
.vc-dark #order-digit-of.vc-checkout-redesign .checkout-container,
.vc-dark #order-digit-of.vc-checkout-redesign .view-cart-checkout,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-account-panel {
  background: #121c33 !important;
  border-color: rgba(148,163,184,.22) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.26) !important;
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of .product header,
html[data-vc-dark] #order-digit-of .product footer,
html[data-vc-dark] #order-digit-of .product-pricing,
html[data-vc-dark] #order-digit-of .view-cart-items-header,
html[data-vc-dark] #order-digit-of .vc-clean-total-box,
html[data-vc-dark] #order-digit-of .total-due-today,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-total,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .account-select-container,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .account-select,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .client-account,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .account-wrapper,
.vc-dark #order-digit-of .product header,
.vc-dark #order-digit-of .product footer,
.vc-dark #order-digit-of .product-pricing,
.vc-dark #order-digit-of .view-cart-items-header,
.vc-dark #order-digit-of .vc-clean-total-box,
.vc-dark #order-digit-of .total-due-today,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-total,
.vc-dark #order-digit-of.vc-checkout-redesign .account-select-container,
.vc-dark #order-digit-of.vc-checkout-redesign .account-select,
.vc-dark #order-digit-of.vc-checkout-redesign .client-account,
.vc-dark #order-digit-of.vc-checkout-redesign .account-wrapper {
  background: #17223b !important;
  border-color: rgba(148,163,184,.18) !important;
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of .product header > i,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-icon,
html[data-vc-dark] #order-digit-of .vc-clean-promo-title i,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .label,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .badge,
.vc-dark #order-digit-of .product header > i,
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-icon,
.vc-dark #order-digit-of .vc-clean-promo-title i,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .label,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-account-choice .badge {
  background: rgba(96,165,250,.14) !important;
  color: #60a5fa !important;
}

html[data-vc-dark] #order-digit-of .product header span[id$="-name"],
html[data-vc-dark] #order-digit-of .view-cart-items-header,
html[data-vc-dark] #order-digit-of .view-cart-items-header *,
html[data-vc-dark] #order-digit-of .view-cart-items .item-title,
html[data-vc-dark] #order-digit-of .cart-item-title,
html[data-vc-dark] #order-digit-of .order-summary h2,
html[data-vc-dark] #order-digit-of .order-summary h3,
html[data-vc-dark] #order-digit-of .summary-container h2,
html[data-vc-dark] #order-digit-of .summary-container h3,
html[data-vc-dark] #order-digit-of .vc-clean-summary-title,
html[data-vc-dark] #order-digit-of .vc-clean-summary-row strong,
html[data-vc-dark] #order-digit-of .vc-clean-total-amount,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-name,
html[data-vc-dark] #order-digit-of.vc-configure-redesign h3,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .field-container > label,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .form-group > label,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-name,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-total-val,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .sub-heading,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-section-title,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .section-heading,
.vc-dark #order-digit-of .product header span[id$="-name"],
.vc-dark #order-digit-of .view-cart-items-header,
.vc-dark #order-digit-of .view-cart-items-header *,
.vc-dark #order-digit-of .view-cart-items .item-title,
.vc-dark #order-digit-of .cart-item-title,
.vc-dark #order-digit-of .order-summary h2,
.vc-dark #order-digit-of .order-summary h3,
.vc-dark #order-digit-of .summary-container h2,
.vc-dark #order-digit-of .summary-container h3,
.vc-dark #order-digit-of .vc-clean-summary-title,
.vc-dark #order-digit-of .vc-clean-summary-row strong,
.vc-dark #order-digit-of .vc-clean-total-amount,
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-name,
.vc-dark #order-digit-of.vc-configure-redesign h3,
.vc-dark #order-digit-of.vc-configure-redesign .field-container > label,
.vc-dark #order-digit-of.vc-configure-redesign .form-group > label,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-name,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-total-val,
.vc-dark #order-digit-of.vc-checkout-redesign .sub-heading,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-section-title,
.vc-dark #order-digit-of.vc-checkout-redesign .section-heading {
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of .product-desc,
html[data-vc-dark] #order-digit-of .product-desc p,
html[data-vc-dark] #order-digit-of .product-desc ul,
html[data-vc-dark] #order-digit-of .product-desc li,
html[data-vc-dark] #order-digit-of .vc-clean-summary-row span,
html[data-vc-dark] #order-digit-of .vc-clean-total-label,
html[data-vc-dark] #order-digit-of .vc-clean-reassurance,
html[data-vc-dark] #order-digit-of .vc-reassurance,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-sub,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-unit,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-price,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-qty,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-total-label,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .irs-min,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .irs-max,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .irs-grid-text,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign label,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .radio,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .checkbox,
.vc-dark #order-digit-of .product-desc,
.vc-dark #order-digit-of .product-desc p,
.vc-dark #order-digit-of .product-desc ul,
.vc-dark #order-digit-of .product-desc li,
.vc-dark #order-digit-of .vc-clean-summary-row span,
.vc-dark #order-digit-of .vc-clean-total-label,
.vc-dark #order-digit-of .vc-clean-reassurance,
.vc-dark #order-digit-of .vc-reassurance,
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-sub,
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-unit,
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-price,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-qty,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-total-label,
.vc-dark #order-digit-of.vc-configure-redesign .irs-min,
.vc-dark #order-digit-of.vc-configure-redesign .irs-max,
.vc-dark #order-digit-of.vc-configure-redesign .irs-grid-text,
.vc-dark #order-digit-of.vc-checkout-redesign label,
.vc-dark #order-digit-of.vc-checkout-redesign .radio,
.vc-dark #order-digit-of.vc-checkout-redesign .checkbox {
  color: #cbd5e1 !important;
}

html[data-vc-dark] #order-digit-of .view-cart-items .item,
html[data-vc-dark] #order-digit-of .cart-item,
html[data-vc-dark] #order-digit-of .order-summary .clearfix,
html[data-vc-dark] #order-digit-of .summary-container .clearfix,
html[data-vc-dark] #order-digit-of .vc-clean-summary-row,
html[data-vc-dark] #order-digit-of .vc-clean-summary-lines,
html[data-vc-dark] #order-digit-of .vc-clean-reassurance,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-item,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-divider,
.vc-dark #order-digit-of .view-cart-items .item,
.vc-dark #order-digit-of .cart-item,
.vc-dark #order-digit-of .order-summary .clearfix,
.vc-dark #order-digit-of .summary-container .clearfix,
.vc-dark #order-digit-of .vc-clean-summary-row,
.vc-dark #order-digit-of .vc-clean-summary-lines,
.vc-dark #order-digit-of .vc-clean-reassurance,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-item,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-divider {
  border-color: rgba(148,163,184,.16) !important;
}

html[data-vc-dark] #order-digit-of input.form-control,
html[data-vc-dark] #order-digit-of select.form-control,
html[data-vc-dark] #order-digit-of textarea.form-control,
html[data-vc-dark] #order-digit-of .form-control,
html[data-vc-dark] #order-digit-of .vc-clean-promo-input,
html[data-vc-dark] #order-digit-of #promocode,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .product-configurable-options select,
html[data-vc-dark] #order-digit-of.vc-configure-redesign .configurable-options select,
html[data-vc-dark] #order-digit-of.vc-configure-redesign select[name="billingcycle"],
html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-opt-num,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign input[type="text"],
html[data-vc-dark] #order-digit-of.vc-checkout-redesign input[type="email"],
html[data-vc-dark] #order-digit-of.vc-checkout-redesign input[type="password"],
html[data-vc-dark] #order-digit-of.vc-checkout-redesign select,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign textarea,
.vc-dark #order-digit-of input.form-control,
.vc-dark #order-digit-of select.form-control,
.vc-dark #order-digit-of textarea.form-control,
.vc-dark #order-digit-of .form-control,
.vc-dark #order-digit-of .vc-clean-promo-input,
.vc-dark #order-digit-of #promocode,
.vc-dark #order-digit-of.vc-configure-redesign .product-configurable-options select,
.vc-dark #order-digit-of.vc-configure-redesign .configurable-options select,
.vc-dark #order-digit-of.vc-configure-redesign select[name="billingcycle"],
.vc-dark #order-digit-of.vc-configure-redesign .vc-opt-num,
.vc-dark #order-digit-of.vc-checkout-redesign input[type="text"],
.vc-dark #order-digit-of.vc-checkout-redesign input[type="email"],
.vc-dark #order-digit-of.vc-checkout-redesign input[type="password"],
.vc-dark #order-digit-of.vc-checkout-redesign select,
.vc-dark #order-digit-of.vc-checkout-redesign textarea {
  background: #0f1a31 !important;
  border-color: rgba(148,163,184,.24) !important;
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of input::placeholder,
html[data-vc-dark] #order-digit-of textarea::placeholder,
.vc-dark #order-digit-of input::placeholder,
.vc-dark #order-digit-of textarea::placeholder {
  color: #7f8da6 !important;
}

html[data-vc-dark] #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate),
.vc-dark #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) {
  background: #121c33 !important;
  border-color: rgba(148,163,184,.22) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.26) !important;
}

html[data-vc-dark] #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-head,
.vc-dark #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-head {
  background: #17223b !important;
  border-color: rgba(148,163,184,.18) !important;
}

html[data-vc-dark] #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-body,
.vc-dark #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-body {
  background: #121c33 !important;
}

html[data-vc-dark] #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item,
.vc-dark #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item {
  background: #0f1a31 !important;
  border-color: rgba(148,163,184,.18) !important;
  color: #e2e8f0 !important;
}

html[data-vc-dark] #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item:hover,
.vc-dark #order-digit-of .sidebar-collapsed .vc-nav-panel:not(.vc-sidebar-duplicate) .vc-nav-item:hover {
  background: #172544 !important;
  border-color: rgba(96,165,250,.36) !important;
  color: #bfdbfe !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-step-btn,
.vc-dark #order-digit-of.vc-configure-redesign .vc-step-btn {
  background: #0f1a31 !important;
  border-color: rgba(148,163,184,.24) !important;
  color: #f8fafc !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .irs-line,
.vc-dark #order-digit-of.vc-configure-redesign .irs-line {
  background: rgba(148,163,184,.22) !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .irs-grid-pol,
.vc-dark #order-digit-of.vc-configure-redesign .irs-grid-pol {
  background: rgba(148,163,184,.28) !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-configure-size-card:hover,
.vc-dark #order-digit-of.vc-configure-redesign .vc-configure-size-card:hover {
  border-color: rgba(96,165,250,.42) !important;
  background: #172544 !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .vc-configure-size-card:has(input:checked),
.vc-dark #order-digit-of.vc-configure-redesign .vc-configure-size-card:has(input:checked) {
  background: rgba(43,111,196,.18) !important;
  border-color: #60a5fa !important;
}

html[data-vc-dark] #order-digit-of.vc-configure-redesign .scp-sum-subtotal,
html[data-vc-dark] #order-digit-of .product-pricing .price,
html[data-vc-dark] #order-digit-of .total-due-today .amt,
html[data-vc-dark] #order-digit-of .vc-clean-total-amount,
html[data-vc-dark] #order-digit-of .vc-clean-summary-row strong,
.vc-dark #order-digit-of.vc-configure-redesign .scp-sum-subtotal,
.vc-dark #order-digit-of .product-pricing .price,
.vc-dark #order-digit-of .total-due-today .amt,
.vc-dark #order-digit-of .vc-clean-total-amount,
.vc-dark #order-digit-of .vc-clean-summary-row strong {
  color: #60a5fa !important;
}

html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-security,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-security {
  background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(234,88,12,.08)) !important;
  border-color: rgba(251,146,60,.34) !important;
  color: #fed7aa !important;
}

html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-security strong,
html[data-vc-dark] #order-digit-of.vc-checkout-redesign .vc-checkout-security b,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-security strong,
.vc-dark #order-digit-of.vc-checkout-redesign .vc-checkout-security b {
  color: #ffedd5 !important;
}

/* Configure dark-mode hard override for billing cycle + size presets.
   These controls can be rendered before the configure class is attached. */
html[data-vc-dark] .vc-overlay #order-digit-of select[name="billingcycle"],
html[data-vc-dark] .vc-overlay #order-digit-of [name="billingcycle"],
html[data-vc-dark] .vc-overlay #order-digit-of .field-container:has(select[name="billingcycle"]) select,
html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-card,
html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-row label,
html.vc-dark #order-digit-of select[name="billingcycle"],
html.vc-dark #order-digit-of [name="billingcycle"],
html.vc-dark #order-digit-of .field-container:has(select[name="billingcycle"]) select,
html.vc-dark #order-digit-of .vc-configure-size-card,
html.vc-dark #order-digit-of .vc-configure-size-row label,
body.vc-dark #order-digit-of select[name="billingcycle"],
body.vc-dark #order-digit-of [name="billingcycle"],
body.vc-dark #order-digit-of .field-container:has(select[name="billingcycle"]) select,
body.vc-dark #order-digit-of .vc-configure-size-card,
body.vc-dark #order-digit-of .vc-configure-size-row label,
.vc-overlay.vc-dark #order-digit-of select[name="billingcycle"],
.vc-overlay.vc-dark #order-digit-of [name="billingcycle"],
.vc-overlay.vc-dark #order-digit-of .field-container:has(select[name="billingcycle"]) select,
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-card,
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-row label,
.vc-dark #order-digit-of select[name="billingcycle"],
.vc-dark #order-digit-of [name="billingcycle"],
.vc-dark #order-digit-of .field-container:has(select[name="billingcycle"]) select,
.vc-dark #order-digit-of .vc-configure-size-card,
.vc-dark #order-digit-of .vc-configure-size-row label {
  background: #121c33 !important;
  border-color: rgba(148,163,184,.26) !important;
  color: #f8fafc !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.22) !important;
}

html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-card *,
html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-row label *,
html.vc-dark #order-digit-of .vc-configure-size-card *,
html.vc-dark #order-digit-of .vc-configure-size-row label *,
body.vc-dark #order-digit-of .vc-configure-size-card *,
body.vc-dark #order-digit-of .vc-configure-size-row label *,
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-card *,
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-row label *,
.vc-dark #order-digit-of .vc-configure-size-card *,
.vc-dark #order-digit-of .vc-configure-size-row label * {
  color: inherit !important;
}

html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-card:has(input:checked),
html[data-vc-dark] .vc-overlay #order-digit-of .vc-configure-size-row label:has(input:checked),
html.vc-dark #order-digit-of .vc-configure-size-card:has(input:checked),
html.vc-dark #order-digit-of .vc-configure-size-row label:has(input:checked),
body.vc-dark #order-digit-of .vc-configure-size-card:has(input:checked),
body.vc-dark #order-digit-of .vc-configure-size-row label:has(input:checked),
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-card:has(input:checked),
.vc-overlay.vc-dark #order-digit-of .vc-configure-size-row label:has(input:checked),
.vc-dark #order-digit-of .vc-configure-size-card:has(input:checked),
.vc-dark #order-digit-of .vc-configure-size-row label:has(input:checked) {
  background: rgba(43,111,196,.22) !important;
  border-color: #60a5fa !important;
  color: #ffffff !important;
}

/* =========================================================
   COMPLETE ORDER PAGE
========================================================= */

body:has(#order-digit-of.vc-complete-redesign) {
  background: #f6f8fc !important;
}

#order-digit-of.vc-complete-redesign .cart-body {
  display: block !important;
}

#order-digit-of.vc-complete-redesign .header-lined:before {
  content: "\f058" !important;
}

#order-digit-of.vc-complete-redesign .header-lined h1:after {
  content: "Ordine registrato correttamente. Completa il pagamento della fattura per attivare il servizio." !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-native-hidden {
  display: none !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-shell {
  width: min(100%, 860px) !important;
  margin: 28px auto 0 !important;
  font-family: var(--vc-font) !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-card {
  background: #fff !important;
  border: 1px solid #e5edf8 !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 48px rgba(15,34,72,.08) !important;
  position: relative !important;
  overflow: hidden !important;
  padding: 30px !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-card:after {
  content: "" !important;
  position: absolute !important;
  right: -80px !important;
  top: -90px !important;
  width: 240px !important;
  height: 240px !important;
  border-radius: 999px !important;
  background: radial-gradient(circle, rgba(34,197,94,.14), transparent 68%) !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-card-top {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  gap: 18px !important;
  align-items: center !important;
  position: relative !important;
  z-index: 1 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-status-icon {
  width: 62px !important;
  height: 62px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, #16a34a, #22c55e) !important;
  color: #fff !important;
  font-size: 26px !important;
  box-shadow: 0 16px 34px rgba(22,163,74,.28) !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-eyebrow {
  color: #16a34a !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-card h2 {
  max-width: 680px !important;
  margin: 8px 0 10px !important;
  color: #101a36 !important;
  font-size: 30px !important;
  line-height: 1.15 !important;
  font-weight: 850 !important;
  letter-spacing: -.4px !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-card p {
  max-width: 680px !important;
  margin: 0 !important;
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  font-weight: 650 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-info-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 14px !important;
  margin: 26px 0 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-info-tile {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  column-gap: 12px !important;
  row-gap: 3px !important;
  align-items: center !important;
  padding: 16px !important;
  border: 1px solid rgba(43,111,196,.22) !important;
  border-radius: 16px !important;
  background: #f4f8ff !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-info-tile i {
  grid-row: 1 / 3 !important;
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  background: rgba(43,111,196,.12) !important;
  color: #2b6fc4 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-info-tile span {
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-info-tile strong {
  color: #2b6fc4 !important;
  font-size: 20px !important;
  font-weight: 850 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 18px !important;
  position: relative !important;
  z-index: 1 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-primary,
#order-digit-of.vc-complete-redesign .vc-complete-secondary,
#order-digit-of.vc-complete-redesign .vc-complete-alert a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 52px !important;
  padding: 0 18px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  transition: transform .15s ease, filter .15s ease !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-primary {
  background: linear-gradient(135deg, #2b6fc4, #1658b7) !important;
  color: #fff !important;
  box-shadow: 0 16px 32px rgba(43,111,196,.28) !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-secondary {
  border: 1px solid #dce6f5 !important;
  background: #fff !important;
  color: #101a36 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-primary:hover,
#order-digit-of.vc-complete-redesign .vc-complete-secondary:hover,
#order-digit-of.vc-complete-redesign .vc-complete-alert a:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.03) !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-alert {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  gap: 16px !important;
  align-items: center !important;
  margin: 18px 0 0 !important;
  padding: 18px 20px !important;
  border: 1px solid #fed7aa !important;
  border-radius: 18px !important;
  background: #fff7ed !important;
  color: #c05621 !important;
  position: relative !important;
  z-index: 1 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-alert > i {
  width: 42px !important;
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 13px !important;
  background: rgba(234,88,12,.10) !important;
  font-size: 18px !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-alert strong,
#order-digit-of.vc-complete-redesign .vc-complete-alert span {
  display: block !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-alert strong {
  color: #9a3412 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

#order-digit-of.vc-complete-redesign .vc-complete-alert span {
  margin-top: 2px !important;
  color: #c05621 !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

@media (max-width: 900px) {
  #order-digit-of.vc-complete-redesign .vc-complete-info-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  #order-digit-of.vc-complete-redesign .vc-complete-card {
    padding: 22px !important;
    border-radius: 18px !important;
  }

  #order-digit-of.vc-complete-redesign .vc-complete-card-top {
    grid-template-columns: 1fr !important;
  }

  #order-digit-of.vc-complete-redesign .vc-complete-card h2 {
    font-size: 24px !important;
  }
}

/* Complete page fallback for cached/blocked JS. */
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) {
  max-width: 1220px !important;
  margin: 0 auto !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .header-lined {
  margin-bottom: 24px !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .header-lined:before {
  content: "\f058" !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .header-lined h1:after {
  content: "Ordine registrato correttamente. Completa il pagamento della fattura per attivare il servizio." !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) > p,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .cart-body > p {
  max-width: 760px !important;
  margin: 0 auto 18px !important;
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  font-weight: 650 !important;
  text-align: center !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-info,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-success {
  width: min(100%, 520px) !important;
  margin: 22px auto !important;
  padding: 18px 22px 18px 66px !important;
  border: 1px solid rgba(43,111,196,.20) !important;
  border-radius: 18px !important;
  background: #f4f8ff !important;
  color: #2b6fc4 !important;
  box-shadow: 0 14px 36px rgba(43,111,196,.08) !important;
  position: relative !important;
  text-align: left !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-info:before,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-success:before {
  content: "\f02a" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  width: 34px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 11px !important;
  background: rgba(43,111,196,.12) !important;
  transform: translateY(-50%) !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-info strong,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-info a,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-success strong,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-success a {
  color: #1658b7 !important;
  font-size: 21px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-warning,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-danger,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-block {
  width: min(100%, 760px) !important;
  margin: 24px auto 18px !important;
  padding: 24px 26px !important;
  border: 1px solid #fed7aa !important;
  border-left: 5px solid #f97316 !important;
  border-radius: 20px !important;
  background: linear-gradient(135deg, #fff7ed, #fffaf2) !important;
  color: #c05621 !important;
  box-shadow: 0 18px 44px rgba(194,86,33,.10) !important;
  text-align: center !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-warning a,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-danger a,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-block a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  margin-top: 14px !important;
  padding: 0 24px !important;
  border-radius: 13px !important;
  background: #c05621 !important;
  color: #fff !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .btn,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) a.btn,
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) input[type="button"],
.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) input[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 52px !important;
  padding: 0 24px !important;
  border: 1px solid #dce6f5 !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #101a36 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  box-shadow: 0 12px 30px rgba(15,34,72,.06) !important;
}

/* Product catalogue spacing: keep product cards compact and move navigation right. */
@media (min-width: 1200px) {
  body:has(#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign)) .vc-content {
    max-width: 1320px !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body {
    grid-template-columns: minmax(620px, 700px) minmax(310px, 350px) !important;
    column-gap: clamp(42px, 4vw, 72px) !important;
    row-gap: 28px !important;
    justify-content: center !important;
    align-items: start !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .header-lined {
    width: min(100%, 1120px) !important;
    justify-self: center !important;
    margin-bottom: 0 !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products {
    width: 100% !important;
    max-width: 700px !important;
    justify-self: end !important;
    margin-top: 0 !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed {
    width: 350px !important;
    max-width: 350px !important;
    justify-self: start !important;
    margin-top: 0 !important;
  }
}

/* Compact native complete layout when WHMCS renders without the JS card. */
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .header-lined {
  width: min(100%, 1160px) !important;
  margin: 0 auto 24px !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .cart-body {
  width: min(100%, 860px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 14px !important;
  margin: 0 auto !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) > *:not(.header-lined):not(.cart-body),
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .cart-body > * {
  width: 100% !important;
  max-width: 860px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) > p,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .cart-body > p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) > p:first-of-type,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .cart-body > p:first-of-type {
  padding: 22px 26px 0 !important;
  color: #101a36 !important;
  font-size: 18px !important;
  font-weight: 850 !important;
}

/* =========================================================
   V25 DESKTOP WIDTH FIX - cart and catalogue align to hero
========================================================= */

@media (min-width: 992px) {
  #order-digit-of.vc-cart-redesign .vc-cart-shell {
    width: min(1120px, calc(100vw - 160px)) !important;
    max-width: min(1120px, calc(100vw - 160px)) !important;
    grid-template-columns: minmax(0, 744px) minmax(320px, 352px) !important;
    gap: 24px !important;
    justify-self: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #order-digit-of.vc-cart-redesign .vc-cart-left,
  #order-digit-of.vc-cart-redesign .vc-cart-right {
    width: 100% !important;
    min-width: 0 !important;
  }

  #order-digit-of.vc-cart-redesign .order-summary,
  #order-digit-of.vc-cart-redesign .summary-container {
    min-width: 320px !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    row-gap: 28px !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .header-lined,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .products {
    width: min(1120px, calc(100vw - 160px)) !important;
    max-width: min(1120px, calc(100vw - 160px)) !important;
    justify-self: center !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .products > .row,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .row-eq-height {
    grid-template-columns: repeat(auto-fit, minmax(320px, 360px)) !important;
    justify-content: center !important;
    gap: 28px !important;
  }

  #order-digit-of .product footer {
    padding-left: 28px !important;
    padding-right: 28px !important;
    overflow: visible !important;
  }

  #order-digit-of .product .btn,
  #order-digit-of .product button,
  #order-digit-of .product .btn-order-now,
  #order-digit-of .product .wdes-digit-of-order-btn {
    width: 100% !important;
    max-width: 220px !important;
    min-width: 0 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
}

@media (min-width: 992px) and (max-width: 1160px) {
  #order-digit-of.vc-cart-redesign .vc-cart-shell,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .header-lined,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body:not(:has(> .sidebar-collapsed)) .products {
    width: calc(100vw - 72px) !important;
    max-width: calc(100vw - 72px) !important;
  }
}

@media (max-width: 991px) {
  #order-digit-of.vc-cart-redesign .vc-cart-shell,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .header-lined {
    width: 100% !important;
    max-width: 100% !important;
  }
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-info,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-success {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-warning,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-danger,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .alert-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) a.btn,
body.vc-order-complete-page #order-digit-of:not(.vc-complete-redesign) .btn {
  margin-top: 0 !important;
  align-self: flex-start !important;
}

/* =========================================================
   V26 HARD LAYOUT PATCH - force real page width and CTA alignment
========================================================= */

body:has(#order-digit-of) .vc-scroll,
body:has(#order-digit-of) .vc-main,
body:has(#order-digit-of) #content,
body:has(#order-digit-of) #content > div,
body:has(#order-digit-of) #content > section {
  width: 100% !important;
  max-width: none !important;
}

body:has(#order-digit-of) .vc-content {
  width: 100% !important;
  max-width: none !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

#order-digit-of {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

#order-digit-of .header-lined,
#order-digit-of.vc-cart-redesign .vc-cart-shell,
#order-digit-of .cart-body,
#order-digit-of .vivacloud-cart-body > section,
#order-digit-of .vivacloud-cart-body > div,
#order-digit-of:not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products {
  width: min(1120px, calc(100vw - 96px)) !important;
  max-width: min(1120px, calc(100vw - 96px)) !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#order-digit-of.vc-cart-redesign .vc-cart-shell,
#order-digit-of.vc-cart-redesign .cart-body > .vc-cart-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 740px) minmax(340px, 356px) !important;
  justify-content: center !important;
  gap: 24px !important;
}

#order-digit-of .vivacloud-cart-body .grid {
  width: 100% !important;
  grid-template-columns: minmax(0, 740px) minmax(340px, 356px) !important;
  justify-content: center !important;
}

#order-digit-of .vc-cart-left,
#order-digit-of .vc-cart-right,
#order-digit-of .view-cart-items,
#order-digit-of .order-summary,
#order-digit-of .summary-container {
  min-width: 0 !important;
  max-width: 100% !important;
}

#order-digit-of .products,
#order-digit-of .products > .row,
#order-digit-of .row-eq-height {
  justify-content: center !important;
  justify-items: center !important;
}

#order-digit-of .products > .row,
#order-digit-of .row-eq-height {
  grid-template-columns: repeat(auto-fit, minmax(320px, 360px)) !important;
}

#order-digit-of .product,
#order-digit-of .products [class*="col-"] {
  width: 100% !important;
  max-width: 360px !important;
  min-width: 0 !important;
}

#order-digit-of .product,
#order-digit-of .product footer,
#order-digit-of .product form,
#order-digit-of .product .vc-product-order-cta-wrap,
#order-digit-of .product .btn-group,
#order-digit-of .product .button,
#order-digit-of .product .actions {
  overflow: visible !important;
}

#order-digit-of .product footer,
#order-digit-of .product form,
#order-digit-of .product .vc-product-order-cta-wrap,
#order-digit-of .product .btn-group,
#order-digit-of .product .button,
#order-digit-of .product .actions {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
  float: none !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

#order-digit-of .product .btn,
#order-digit-of .product button,
#order-digit-of .product input[type="submit"],
#order-digit-of .product .btn-order-now,
#order-digit-of .product .wdes-digit-of-order-btn,
#order-digit-of .product .vc-product-order-cta {
  flex: 0 1 220px !important;
  width: 220px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
  float: none !important;
  clear: both !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  overflow: hidden !important;
}

#order-digit-of .product .btn:hover,
#order-digit-of .product button:hover,
#order-digit-of .product .btn-order-now:hover,
#order-digit-of .product .wdes-digit-of-order-btn:hover {
  transform: none !important;
}

@media (max-width: 991px) {
  #order-digit-of .header-lined,
  #order-digit-of.vc-cart-redesign .vc-cart-shell,
  #order-digit-of .cart-body,
  #order-digit-of .vivacloud-cart-body > section,
  #order-digit-of .vivacloud-cart-body > div,
  #order-digit-of:not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products {
    width: 100% !important;
    max-width: 100% !important;
  }

  #order-digit-of.vc-cart-redesign .vc-cart-shell,
  #order-digit-of .vivacloud-cart-body .grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* =========================================================
   V27 PRODUCT CATALOGUE RESTORE - cards + category tabs
========================================================= */

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body {
  display: grid !important;
  width: min(1148px, calc(100vw - 96px)) !important;
  max-width: min(1148px, calc(100vw - 96px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  grid-template-areas: "hero hero" "main side" !important;
  grid-template-columns: minmax(0, 780px) minmax(300px, 340px) !important;
  gap: 28px !important;
  align-items: start !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .header-lined {
  grid-area: hero !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  margin: 0 !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products {
  grid-area: main !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  margin: 0 !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products > .row,
#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .row-eq-height {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 28px !important;
  width: 100% !important;
  justify-content: stretch !important;
  justify-items: stretch !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products [class*="col-"],
#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .product {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed {
  grid-area: side !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 340px !important;
  max-width: 340px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: visible !important;
}

#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed .vc-nav-panel,
#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed .vc-nav-head,
#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed .vc-nav-body,
#order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed .vc-nav-item {
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

@media (max-width: 991px) {
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .cart-body {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-areas: "hero" "main" "side" !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .products > .row,
  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .row-eq-height {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #order-digit-of:not(.vc-cart-redesign):not(.vc-configure-redesign):not(.vc-checkout-redesign):not(.vc-complete-redesign) .sidebar-collapsed {
    width: 100% !important;
    max-width: 100% !important;
  }
}