@font-face {
  font-family: "Arvo-Regular";
  src: url("../fonts/arvo/Arvo-Regular.ttf"); }
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  font-family: "Arvo-Regular";
  font-size: 15px;
  color: #fff;
  margin: 0; }

:focus {
  outline: none; }

textarea {
  resize: none; }

input, textarea, select, button {
  font-size: 15px;
  color: #fff; }

p, h1, h2, h3, h4, h5, h6, ul {
  margin: 0; }

ul {
  padding: 0;
  margin: 0;
  list-style: none; }

a {
  text-decoration: none; }

textarea {
  resize: none; }

img {
  max-width: 100%;
  vertical-align: middle; }

.wrapper {
      min-height: 100vh; /* Altura mínima = 100% del viewport */
    height: auto; /* Permite que crezca si el contenido es mayor */
  display: flex; }
  .wrapper .image-holder {
    width: 65.78%; }
  .wrapper .form-content {
        min-height: 100vh; /* Asegura que el formulario ocupe toda la altura */
    overflow-y: auto; /* Añade scroll si el contenido excede la altura */
    width: 34.22%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 4.3%;
    padding-right: 4.3%;
    position: relative; }

.wizard {
  height: 509px; }

.steps .current-info, .steps .number {
  display: none; }

.steps ul {
  display: flex;
  justify-content: center;
  margin-bottom: 30px; }

.steps li a {
  display: block; }
.steps li .step-arrow {
  display: block;
  margin-top: 3px;
  margin-left: 20%; }
.steps li:nth-child(2) .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
.steps li:nth-child(3) .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
.steps li:nth-child(4) .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
.steps li:nth-child(5) .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
.steps li:nth-child(6) .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
.steps li:nth-child() .step-arrow, .steps li:last-child .step-arrow {
  margin-left: 47%; }
h3 {
  font-size: 32px;
  color: #fff;
  font-weight: 400;
  text-align: center;
  margin-bottom: 58px; }

.image-holder {
  background: url("../images/form2.jpg") center center;
  background-size: cover; }
  .image-holder img {
    display: none; }

.form-content {
  background: url("../images/form-wizard-bg.jpg") center center;
  background-size: cover; }

.info {
  margin-bottom: 50px; }

.info-item {
  margin-bottom: 29px; }
  .info-item span {
    color: #ccc; }
    .info-item span.unit {
      margin-right: 15px; }
    .info-item span.lnr {
      margin-right: 4px; }
    .info-item span.lnr-calendar-full {
      margin-right: 7px; }

.content h4 {
  display: none; }

.form-group {
  display: flex;
  margin-bottom: 15px; }
  .form-group .form-price {
    width: 65.46%; }
  .form-group .form-select {
    width: 34.54%; }

label {
  color: #ccc; }

.form-wrapper {
  display: flex;
  align-items: flex-end;
  margin-bottom: 22px; }
  .form-wrapper label {
    width: 27.85%;
    transform: translateY(1px); }
  .form-wrapper input {
    width: 72.15%; }
  .form-wrapper.last {
    margin-bottom: 50px; }

.form-price {
  display: flex; }
  .form-price label {
    width: 42.55%; }
  .form-price span {
    width: 57.45%; }

.form-select {
  display: flex;
  justify-content: space-between; }

.form-holder {
  position: relative;
  transform: translateY(-4px); }
  .form-holder i {
    position: absolute;
    transform: translateY(-20px);
    left: 22px; }

.form-control {
  height: 25px;
  display: block;
  font-size: 13px;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  background: none;
  color: #fff;
  padding: 0; }

input:focus {
  border-bottom: 1px solid rgba(255, 255, 255, 0.8); }

select.form-control {
  -moz-appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  width: 50px;
  border: none;
  font-size: 15px;
  padding: 0 5px; }

.option {
  color: #999; }

.actions ul {
  display: flex;
  justify-content: space-between; }
.actions li a {
  padding: 0;
  border: none;
  display: inline-flex;
  height: 42px;
  width: 96px;
  justify-content: center;
  align-items: center;
  border: 1px solid #fff;
  background: none;
  font-family: "Times New Roman";
  cursor: pointer;
  color: #fff; }
  .actions li a:hover {
    background: #fff;
    color: #333;
    border: 1px solid transparent; }
.actions li[aria-disabled="true"] a {
  opacity: 0;
  transition: all 1s; }

.request {
  margin-bottom: 21px; }

.special-request {
  margin-bottom: 21px; }
  .special-request label {
    float: left;
    margin-top: 8px; }
  .special-request input.form-control {
    width: calc(100% - 155px);
    margin-left: auto; }

.question-request {
  line-height: 2;
  margin-top: 23px; }
  .question-request span {
    color: #ccc; }
  .question-request input.form-control {
    width: 56px;
    margin: 0 2px;
    transform: translateY(-5px); }

.social {
  position: absolute;
  text-align: center;
  bottom: 7.35%;
  left: 0;
  right: 0; }
  .social a {
    font-size: 17px;
    color: #fff;
    margin-right: 14px; }
    .social a:last-child {
      margin-right: 0; }
    .social a:hover {
      color: #e5e5e5; }

.checkbox {
  margin-bottom: 41px; }
  .checkbox label {
    cursor: pointer;
    display: inline-block;
    padding-left: 22px;
    position: relative; }
  .checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer; }
  .checkbox input:checked ~ .checkmark {
    background: #ccc; }
    .checkbox input:checked ~ .checkmark:after {
      display: block; }
  .checkbox .checkmark {
    position: absolute;
    top: 3px;
    left: 0;
    height: 11px;
    width: 11px;
    border: 1px solid #ccc;
    border-radius: 50%;
    font-family: Material-Design-Iconic-Font;
    color: #49276c;
    font-size: 10px;
    font-weight: 400; }
    .checkbox .checkmark:after {
      top: -0.5px;
      left: 0.5px;
      position: absolute;
      display: none;
      content: '\f26b'; }

@media (max-width: 1199px) {
  .wrapper {
    display: block; }
    .wrapper .image-holder {
      width: 100%;
      height: 45vh; }
    .wrapper .form-content {
      width: 100%;
      height: 55vh; }

  .wizard {
    width: 50%;
    margin: auto; } }
@media (max-width: 991px) {
  .wrapper .image-holder {
    height: 35vh; }
  .wrapper .form-content {
    height: 65vh; }

  .wizard {
    width: 80%; }

  .social {
    bottom: 4.35%; } }
@media (max-width: 767px) {
  h3 {
    font-size: 30px; }

  .image-holder {
    background: none; }
    .image-holder img {
      display: block; }

  .wrapper {
    height: auto; }
    .wrapper .image-holder {
      height: auto; }
    .wrapper .form-content {
      height: auto;
      padding: 35px 20px; }

  .wizard {
    width: 100%;
    height: auto; }

  .social {
    position: static;
    margin-top: 30px; } }

/*# sourceMappingURL=style.css.map */
.form-wrapper .d-flex {
  width: 100%;
}
.d-flex {
  display: flex;
}
.gap-2 {
  gap: 10px;   /* Ajusta el espacio entre inputs a tu gusto */
}

.date-field {
  width: 0;
  flex: 1;               /* Cada uno ocupa igual espacio */
  max-width: 80px;       /* Opcional: límite de ancho */
  text-align: center;    /* Centrar el texto dentro */
}
/* overlay genérico */
.custom-modal {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,.7);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}
/* caja del modal */
.modal-content {
  background: #fff; color: #333;
  max-width: 600px; width: 90%;
  max-height: 80vh;
  display: flex; flex-direction: column;
  border-radius: 5px; overflow: hidden;
}
/* cabecera y cierre */
.modal-header {
  position: relative; padding: 1rem;
  background: #f5f5f5;
}
.modal-header .close {
  position: absolute; top: .5rem; right: 1rem;
  cursor: pointer; font-size: 1.5rem;
}
/* cuerpo con scroll */
.modal-body {
  padding: 1rem; overflow-y: auto; flex: 1;
  line-height: 1.4;
}
/* pie con toggle */
.modal-footer {
  padding: .75rem 1rem; background: #f5f5f5;
  display: flex; align-items: center;
}
/* estilo del switch */
.switch {
  position: relative; display: inline-block;
  width: 50px; height: 24px;
}
.switch input {
  opacity: 0; width: 0; height: 0;
}
.slider {
  position: absolute; cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #ccc; transition: .4s;
  border-radius: 24px;
}
.slider:before {
  position: absolute; content: "";
  height: 18px; width: 18px;
  left: 3px; bottom: 3px;
  background-color: white; transition: .4s;
  border-radius: 50%;
}
.switch input:checked + .slider {
  background-color: #4CAF50;
}
.switch input:checked + .slider:before {
  transform: translateX(26px);
}
/* tus botones de abrir */
.modal-buttons .btn {
  margin-right: .5rem;
}
/* Contenedor de botones centrado */
.modal-buttons {
  display: flex;
  justify-content: center;   /* centra horizontalmente */
  gap: 1rem;                  /* espacio entre botones */
  margin-bottom: 1rem;        /* opcional, separa de otros elementos */
}

/* Estilo para los botones dentro de modal-buttons */
.modal-buttons .btn {
  background-color: #EB1616;  /* rojo fuerte */
  color: #FFFFFF;             /* texto blanco */
  border: none;               /* quita borde por defecto */
  padding: 0.5rem 1rem;       /* ajuste de tamaño */
  text-transform: uppercase;  /* opcional: mayúsculas */
  cursor: pointer;            /* puntero mano */
  transition: background .2s;
}

/* Hover más oscuro */
.modal-buttons .btn:hover {
  background-color: #C41212;
}

/* Estilo para las listas dentro del modal */
.modal-body ul {
  list-style-type: disc;       /* viñetas sólidas */
  list-style-position: outside;/* viñeta fuera del bloque de texto */
  margin: 1rem 0;              /* espacio arriba y abajo de la lista */
  padding-left: 1.5rem;        /* sangría para el bloque de lista */
}

/* Si tuvieras sublistas, las mostramos con otro estilo */
.modal-body ul ul {
  list-style-type: circle;     /* sub-viñetas */
  padding-left: 1.5rem;        /* sangría extra para sublistas */
}

/* Espacio entre ítems para mejorar legibilidad */
.modal-body ul li {
  margin-bottom: 0.5rem;
}

#canvas {
    border: 1px solid black;
}
.btn {
  background-color: #EB1616;  /* rojo fuerte */
  color: #FFFFFF;             /* texto blanco */
  border: none;               /* quita borde por defecto */
  padding: 0.5rem 1rem;       /* ajuste de tamaño */
  text-transform: uppercase;  /* opcional: mayúsculas */
  cursor: pointer;            /* puntero mano */
  transition: background .2s;
}
.radio-group {
    display: flex;
    gap: 15px;
    margin-top: 5px;
}

.radio-label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.radio-label input[type="radio"] {
    margin: 0;
}
.pago {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.form-pago {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
}

.package-option {
    display: flex;
    align-items: center;
    gap: 15px;
    cursor: pointer;
    width: 100%;
}

.package-content {
    display: flex;
    align-items: center;
    gap: 15px;
    width: 100%;
}

.package-option input[type="radio"] {
    margin: 0;
    min-width: 16px;
}

.package-content span {
    min-width: 120px;
    text-align: left;
}

.package-content img {
    flex-shrink: 0;
}