/* F22D - Final unified dark-green wizard */

#b702-dark-wizard-root .b702-main {
  min-width: 0 !important;
}

#b702-dark-wizard-root .b702-content {
  width: min(calc(100% - 40px), 1450px) !important;
  max-width: none !important;
  padding: 24px 0 42px !important;
}

#b702-dark-wizard-root .b702-title h1 {
  font-size: clamp(24px, 2vw, 32px) !important;
  line-height: 1.2 !important;
}

#b702-dark-wizard-root .b702-title p,
#b702-dark-wizard-root .b702-section-title p {
  font-size: 15px !important;
  line-height: 1.55 !important;
}

@media (min-width: 1101px) {
  #b702-dark-wizard-root .b702-app[data-b702-step] .b702-grid:has(> #b702-right) {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(270px,310px) !important;
    gap: 20px !important;
    align-items: start !important;
  }

  #b702-dark-wizard-root .b702-app[data-b702-step] #b702-right {
    display: block !important;
    min-width: 0 !important;
    width: auto !important;
  }

  #b702-dark-wizard-root .b702-app[data-b702-step="0"] #b702-right {
    display: none !important;
  }

  #b702-dark-wizard-root #b702-right > aside {
    position: sticky !important;
    top: 88px !important;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
  }
}

@media (max-width: 1100px) {
  #b702-dark-wizard-root .b702-grid,
  #b702-dark-wizard-root .b702-grid-form {
    grid-template-columns: minmax(0,1fr) !important;
  }

  #b702-dark-wizard-root #b702-right {
    display: block !important;
    min-width: 0 !important;
  }

  #b702-dark-wizard-root #b702-right > aside {
    position: static !important;
    max-height: none !important;
  }
}

#b702-dark-wizard-root .b702-panel,
#b702-dark-wizard-root .b702-form-card,
#b702-dark-wizard-root .b702-flowers-card,
#b702-dark-wizard-root .b702-flower-item,
#b702-dark-wizard-root .b702-florist,
#b702-dark-wizard-root .b702-flower-billing,
#b702-dark-wizard-root .b702-flower-total {
  background: #173b30 !important;
  border: 1px solid #426656 !important;
  border-radius: 12px !important;
  color: #f0f5ef !important;
}

#b702-dark-wizard-root .b702-panel,
#b702-dark-wizard-root .b702-form-card,
#b702-dark-wizard-root .b702-flowers-card {
  padding: 20px !important;
}

#b702-dark-wizard-root .b702-flowers-card label,
#b702-dark-wizard-root .b702-flowers-card strong,
#b702-dark-wizard-root .b702-flowers-card legend,
#b702-dark-wizard-root .b702-flowers-card span,
#b702-dark-wizard-root .b702-flower-item label,
#b702-dark-wizard-root .b702-flower-billing label,
#b702-dark-wizard-root .b702-florist label {
  color: #f0f5ef !important;
  opacity: 1 !important;
}

#b702-dark-wizard-root .b702-flowers-card input:not([type="radio"]):not([type="checkbox"]),
#b702-dark-wizard-root .b702-flowers-card select,
#b702-dark-wizard-root .b702-flowers-card textarea {
  background: #102d26 !important;
  color: #f5f8f2 !important;
  border: 1px solid #678675 !important;
  border-radius: 8px !important;
  min-height: 42px !important;
  font-size: 15px !important;
}

#b702-dark-wizard-root .b702-flowers-card input::placeholder,
#b702-dark-wizard-root .b702-flowers-card textarea::placeholder {
  color: #b6cbbd !important;
  opacity: 1 !important;
}

#b702-dark-wizard-root .b702-flowers-card input[type="radio"],
#b702-dark-wizard-root .b702-flowers-card input[type="checkbox"] {
  accent-color: #b8d4a7 !important;
  width: 18px;
  height: 18px;
}

#b702-dark-wizard-root .b702-flowers-card h2,
#b702-dark-wizard-root .b702-flowers-card h3,
#b702-dark-wizard-root .b702-flowers-card h4 {
  color: #ffffff !important;
  font-size: clamp(17px,1.4vw,21px) !important;
}

#b702-dark-wizard-root .b702-flowers-card .b702-flower-grid {
  gap: 14px !important;
}

#b702-dark-wizard-root #b702-right .b702-panel {
  margin-bottom: 14px !important;
}

#b702-dark-wizard-root #b702-right .b702-panel h3 {
  color: #f4f7f0 !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
}

#b702-dark-wizard-root #b702-right .b702-kv {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

#b702-dark-wizard-root #b702-right .b702-kv strong {
  color: #f4f7f0 !important;
  font-size: 15px !important;
}

#b702-dark-wizard-root .b702-field > span {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: #edf4e9 !important;
}

#b702-dark-wizard-root .b702-section-title h2 {
  font-size: 20px !important;
  line-height: 1.3 !important;
}

@media (max-width: 760px) {
  #b702-dark-wizard-root .b702-content {
    width: auto !important;
    padding: 16px 12px 28px !important;
  }

  #b702-dark-wizard-root .b702-flowers-card,
  #b702-dark-wizard-root .b702-panel {
    padding: 15px !important;
  }
}
