#ef-customizer{
  margin:20px 0;
  padding:15px;
  border:1px solid #eee;
  border-radius:10px;
  background:#fafafa;
}

.ef-step{
  border:1px solid #e5e5e5;
  margin-bottom:12px;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
}

.ef-step-title{
  background:#c62828;
  color:#fff;
  padding:12px 14px;
  cursor:pointer;
  font-weight:700;
  font-size:15px;
}

.ef-step-content{
  padding:14px;
  display:block;
}

.ef-columns-fixed{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:24px;
}

.ef-col-title{
  font-weight:800;
  margin-bottom:8px;
  letter-spacing:.2px;
}

.ef-radio{
  display:flex;
  align-items:center;
  gap:10px;
  margin:8px 0;
}

.ef-radio input{ transform: translateY(1px); }

.ef-color-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.ef-color-option{
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  padding:6px 10px;
  border-radius:18px;
  border:1px solid transparent;
  transition: border-color .2s ease, background .2s ease;
  user-select:none;
}

.ef-color-option input{ display:none; }

.ef-color-circle{
  width:20px;
  height:20px;
  border-radius:50%;
  border:2px solid #ddd;
}

.ef-color-label{ font-size:13px; font-weight:700; }

.ef-color-option:has(input:checked){
  border-color:#c62828;
  background: rgba(198,40,40,.08);
}

.ef-select{
  width:100%;
  padding:10px 12px;
  border-radius:8px;
  border:1px solid #ddd;
  font-size:14px;
  background:#fff;
}

#ef-price-box{
  margin-top:14px;
  margin-bottom:14px; /* espacio con el botón */
  padding:12px 14px;
  border-radius:10px;
  background:#111;
  color:#fff;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.ef-price-label{ font-size:13px; opacity:.9; }
#ef-unit-price, #ef-total-price{ font-size:16px; font-weight:900; }
.ef-price-divider{
  width:1px;
  height:18px;
  background: rgba(255,255,255,.25);
  margin: 0 8px;
}

.ef-required-msg{
  margin: 0 0 12px 0;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(198,40,40,.35);
  background: rgba(198,40,40,.08);
  color: #7a0f3e;
  font-weight: 700;
}

.ef-step.ef-step-error{
  border-color: rgba(198,40,40,.75);
  box-shadow: 0 0 0 3px rgba(198,40,40,.12);
}

.ef-help{
  display:block;
  margin-top:6px;
  font-size:12px;
  opacity:.75;
}

@media (max-width: 600px){
  /* Mantener 2 columnas 50/50 en celular como pediste */
  .ef-columns-fixed{
    grid-template-columns: 1fr 1fr;
    gap:14px;
  }
  #ef-price-box{
    justify-content:space-between;
  }
}


@media (max-width: 600px){
  #ef-price-box{
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .ef-price-divider{
    display: none;
  }

  #ef-unit-price,
  #ef-total-price{
    font-size: 17px;
    font-weight: 900;
  }
}
