/* SAMI Calculator — themed to match site */
.sami-calc {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  background: #111;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  padding: 40px;
  color: #fff;
  font-family: 'Manrope', sans-serif;
}
@media (max-width: 600px) {
  .sami-calc { padding: 24px; border-radius: 4px; }
}

.sami-calc-step { display: flex; flex-direction: column; gap: 24px; }
.sami-calc-title {
  font-family: 'Manrope', sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #fff;
}
.sami-calc-subtitle {
  margin-top: 6px;
  font-size: 14px;
  color: #b8b8b8;
}

.sami-calc-step-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #b8b8b8;
}
.sami-calc-progress-track {
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  overflow: hidden;
}
.sami-calc-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: #ffd234;
}

.sami-calc-slider { display: flex; flex-direction: column; gap: 12px; }
.sami-calc-slider-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.sami-calc-label {
  font-size: 14px;
  font-weight: 500;
  color: #fff;
}
.sami-calc-value {
  font-size: 18px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #ffd234;
  white-space: nowrap;
}
.sami-calc-input {
  width: 5.5em;
  text-align: right;
  font: inherit;
  color: #ffd234;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,210,52,0.3);
  border-radius: 4px;
  padding: 4px 8px;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
.sami-calc-input:focus {
  outline: none;
  border-color: #ffd234;
  background: rgba(255,210,52,0.08);
}
.sami-calc-input::-webkit-outer-spin-button,
.sami-calc-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.sami-calc-range-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #8a8a8a;
  font-variant-numeric: tabular-nums;
}

/* Override shadcn slider colors to SAMI theme */
.sami-calc-range [data-slot="slider-track"],
.sami-calc-range [role="slider"] ~ span,
.sami-calc .sami-calc-range > span:first-child {
  background: rgba(255,255,255,0.1) !important;
}
.sami-calc-range [data-slot="slider-range"] {
  background: #ffd234 !important;
}
.sami-calc-range [role="slider"] {
  background: #ffd234 !important;
  border-color: #ffd234 !important;
  box-shadow: 0 0 0 4px rgba(255,210,52,0.15) !important;
}

/* Buttons */
.sami-calc-btn-next {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 24px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  background: #ffd234;
  color: #0a0a0a;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}
.sami-calc-btn-next:hover:not(:disabled) { background: #c9a020; }
.sami-calc-btn-next:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.sami-calc-btn-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 14px 20px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  color: #b8b8b8;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.15);
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
}
.sami-calc-btn-back:hover { color: #fff; border-color: rgba(255,255,255,0.35); }

/* Result cards */
.sami-calc-card {
  border-radius: 4px;
  padding: 24px;
  background: #1a1a1a;
  border: 1px solid rgba(255,255,255,0.08);
}
.sami-calc-card-accent {
  background: linear-gradient(135deg, rgba(255,210,52,0.1) 0%, rgba(255,210,52,0.02) 100%);
  border: 1px solid rgba(255,210,52,0.3);
}
.sami-calc-card-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #8a8a8a;
  margin-bottom: 14px;
}
.sami-calc-card-label-accent { color: #ffd234; }
.sami-calc-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.sami-calc-num {
  font-size: 26px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #fff;
  line-height: 1.1;
}
.sami-calc-num-accent { font-size: 32px; font-weight: 800; color: #ffd234; }
.sami-calc-num-label { font-size: 13px; color: #b8b8b8; margin-top: 4px; }
.sami-calc-card-foot { font-size: 14px; color: #e0e0e0; line-height: 1.6; }