.simulator {
  max-width: 940px;

  margin: 0 auto;
}

.simulator-layout {
  display: grid;
  gap: var(--space-4);
}

.simulator-card,
.final-summary-card,
.payment-result {
  border: 1px solid var(--color-border);

  border-radius: var(--radius-xl);

  background: rgba(255, 255, 255, 0.92);

  box-shadow: var(--shadow-md);

  backdrop-filter: blur(10px);
}

.simulator-card,
.final-summary-card {
  padding: var(--space-4);
}

.payment-result {
  padding: var(--space-4);

  border-color: rgba(132, 47, 131, 0.34);

  background:
    radial-gradient(circle at top right, rgba(132, 47, 131, 0.11), transparent 40%),
    rgba(255, 255, 255, 0.94);
}

.simulator-title {
  margin-bottom: var(--space-3);

  letter-spacing: -0.035em;
}

.form-group {
  margin-bottom: var(--space-3);
}

.form-label {
  display: block;

  margin-bottom: 8px;

  color: var(--color-text);

  font-weight: var(--font-weight-semibold);
}

.form-select,
.form-input {
  width: 100%;
  min-height: 56px;

  padding: 0 16px;

  border: 1px solid var(--color-border);

  border-radius: var(--radius-md);

  background: var(--color-white);

  color: var(--color-text);
}

.form-select:focus,
.form-input:focus {
  outline: none;

  border-color: var(--color-primary);

  box-shadow: 0 0 0 4px var(--color-primary-soft);
}

.summary-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;

  gap: var(--space-2);

  padding: 12px 0;

  border-bottom: 1px solid var(--color-border);
}

.summary-item span {
  color: var(--color-text-secondary);
}

.summary-item strong {
  text-align: right;
}

.summary-soft {
  margin-top: var(--space-3);

  padding-left: var(--space-3);
  padding-right: var(--space-3);

  border-radius: var(--radius-md);

  background: var(--color-primary-soft);
}

.payment-label {
  margin-bottom: var(--space-2);

  color: var(--color-text-secondary);

  font-size: var(--font-size-sm);

  font-weight: var(--font-weight-semibold);

  text-transform: uppercase;

  letter-spacing: 0.08em;
}

.payment-value {
  margin-top: var(--space-2);

  color: var(--color-primary);

  font-size: clamp(36px, 7vw, 56px);

  font-weight: var(--font-weight-bold);

  letter-spacing: -0.06em;
}

.installment-options {
  display: grid;
  gap: var(--space-2);
}

.installment-option {
  padding: var(--space-3);

  border: 1px solid var(--color-border);

  border-radius: var(--radius-lg);

  background: linear-gradient(180deg, #ffffff, #fbf8fc);

  transition: transform var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.installment-option:hover {
  transform: translateY(-2px);

  border-color: rgba(132, 47, 131, 0.30);

  box-shadow: var(--shadow-sm);
}

.simulator-note {
  margin-top: var(--space-1);

  color: var(--color-text-secondary);

  font-size: var(--font-size-sm);
}

.addon-notice {
  margin-bottom: var(--space-3);

  padding: 12px 16px;

  border-radius: var(--radius-md);

  background: rgba(132, 47, 131, 0.10);

  color: var(--color-primary);

  font-size: var(--font-size-sm);

  font-weight: var(--font-weight-bold);

  transition: var(--transition-normal);
}

.addon-notice-hide {
  opacity: 0;

  transform: translateY(-4px);
}

.final-summary-card {
  border-color: rgba(132, 47, 131, 0.18);
}

.final-summary-header {
  margin-bottom: var(--space-4);

  text-align: center;
}

.summary-section {
  padding: var(--space-4) 0;
}

.summary-section:not(:last-child) {
  border-bottom: 1px solid var(--color-border);
}

.summary-section-title {
  margin-bottom: var(--space-3);

  color: var(--color-text);

  font-size: var(--font-size-lg);
}

.summary-highlight-box {
  margin-top: var(--space-3);

  padding: var(--space-4);

  border: 1px solid rgba(132, 47, 131, 0.18);

  border-radius: var(--radius-lg);

  background:
    radial-gradient(circle at top right, rgba(132, 47, 131, 0.10), transparent 46%),
    #fffafd;
}

.summary-total-line {
  display: flex;
  justify-content: space-between;
  align-items: center;

  gap: var(--space-2);

  padding: 12px 0;

  border-bottom: 1px solid var(--color-border);
}

.summary-total-line span {
  color: var(--color-text-secondary);
}

.summary-total-line strong {
  color: var(--color-text);
}

.selected-addons-list {
  display: grid;
  gap: var(--space-2);
}

.selected-addon-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;

  gap: var(--space-3);

  padding: var(--space-3);

  border: 1px solid var(--color-border);

  border-radius: var(--radius-lg);

  background: #fffafd;
}

.selected-addon-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;

  gap: 10px;
}

.quantity-control {
  display: flex;
  align-items: center;

  gap: 8px;

  padding: 6px;

  border: 1px solid var(--color-border);

  border-radius: var(--radius-pill);

  background: var(--color-white);
}

.quantity-button {
  width: 30px;
  height: 30px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: var(--color-primary-soft);

  color: var(--color-primary);

  font-size: 18px;

  font-weight: var(--font-weight-bold);

  cursor: pointer;
}

.quantity-button:hover {
  background: var(--color-primary);

  color: var(--color-white);
}

.quantity-value {
  min-width: 24px;

  text-align: center;

  font-weight: var(--font-weight-bold);
}

.remove-addon-button {
  padding: 7px 12px;

  border-radius: var(--radius-pill);

  background: rgba(132, 47, 131, 0.08);

  color: var(--color-primary);

  font-size: var(--font-size-xs);

  font-weight: var(--font-weight-bold);

  cursor: pointer;
}

.remove-addon-button:hover {
  background: var(--color-primary);

  color: var(--color-white);
}

.whatsapp-summary-box {
  margin-top: var(--space-4);

  padding: var(--space-4);

  border: 1px solid rgba(132, 47, 131, 0.20);

  border-radius: var(--radius-xl);

  background:
    radial-gradient(circle at top, rgba(132, 47, 131, 0.13), transparent 48%),
    #fffafd;

  text-align: center;
}

.whatsapp-summary-box h4 {
  margin-bottom: var(--space-2);

  font-size: var(--font-size-xl);

  letter-spacing: -0.035em;
}

.whatsapp-summary-box p {
  margin-bottom: var(--space-3);

  color: var(--color-text-secondary);
}

.whatsapp-summary-button {
  width: 100%;
  padding: 18px 24px;

  line-height: 1.4;

  min-height: 64px;
}
/* ==================================================
   RESUMEN ECONÓMICO PREMIUM
   ================================================== */

.summary-highlight-box {
  position: relative;

  padding: var(--space-4);

  border: 2px solid rgba(132, 47, 131, 0.22) !important;

  background:
    radial-gradient(circle at top right, rgba(132, 47, 131, 0.16), transparent 44%),
    linear-gradient(180deg, #fffafd 0%, #ffffff 100%) !important;

  box-shadow: 0 20px 48px rgba(132, 47, 131, 0.12);
}

.summary-highlight-box::before {
  content: "";

  position: absolute;
  top: -13px;
  left: 50%;

  width: 52px;
  height: 5px;

  transform: translateX(-50%);

  border-radius: var(--radius-pill);

  background: var(--color-primary);
}

.summary-balance-title {
  margin-bottom: 4px;

  color: var(--color-primary);

  text-align: center;
}

.summary-balance-subtitle {
  margin: 0 0 var(--space-3);

  color: var(--color-text-secondary);

  font-size: var(--font-size-sm);

  text-align: left;
}

.summary-highlight-box .summary-item,
.summary-highlight-box .summary-total-line {
  padding: 14px 0;
}

.summary-highlight-box .summary-item:first-of-type strong {
  color: var(--color-primary);

  font-size: var(--font-size-lg);
}
/* ==================================================
   FOTOLIBROS · ESTIMACIÓN DE FOTOS
   ================================================== */

.photobook-estimate {
  margin: 0 0 var(--space-3);

  padding: 12px 14px;

  border-left: 3px solid var(--color-primary);

  background: var(--color-primary-soft);
}

.photobook-estimate strong {
  display: block;

  color: var(--color-primary-dark);

  font-size: var(--font-size-sm);
}

.photobook-estimate small {
  display: block;

  margin-top: 6px;

  color: var(--color-text-secondary);

  font-size: 0.73rem;

  line-height: 1.45;
}

.photobook-summary-disclaimer {
  margin: 6px 0 0;

  color: var(--color-text-secondary);

  font-size: 0.72rem;

  line-height: 1.45;
}
/* ==================================================
   AVISO DE FECHA LÍMITE DE PAGO
   ================================================== */

.payment-deadline-note {
  margin: var(--space-3) 0 0;

  padding: 13px 15px;

  border-left: 3px solid var(--color-primary);
  border-radius: var(--radius-md);

  background:
    linear-gradient(
      180deg,
      rgba(132, 47, 131, 0.08),
      rgba(132, 47, 131, 0.04)
    );

  color: var(--color-text-secondary);

  font-size: var(--font-size-sm);
  line-height: 1.55;

  text-align: left;
}

.payment-deadline-note strong {
  color: var(--color-primary);

  font-weight: var(--font-weight-bold);
}

.payment-deadline-note-summary {
  margin-top: var(--space-3);
}