/* ===========================================================
   ISLAS GALÁPAGOS — booking.css
   Usa las mismas variables de color que el theme (definidas en
   :root por site.css). Si algún día se usa sin el theme, cae a
   estos valores de respaldo.
   =========================================================== */
.ig-res-band{
	background:linear-gradient(120deg, var(--teal-deep, #083A36), var(--teal, #0E4F4A));
	color:var(--paper, #FAFAF7);
	padding:88px 40px;
}
.ig-res-inner{max-width:720px; margin:0 auto;}
.ig-res-intro{margin-bottom:36px;}
.ig-res-intro h2{font-size:32px; font-weight:400; margin:12px 0 14px; font-family:'Fraunces', serif; color:var(--paper, #FAFAF7) !important;}
.ig-res-intro p{color:var(--gray-2, #C8C6BC); font-size:14.5px; line-height:1.6; margin-bottom:18px;}
.ig-res-note{
	display:flex; gap:10px; align-items:flex-start; font-size:13px; line-height:1.5;
	background:rgba(250,250,247,0.08); border:1px solid rgba(250,250,247,0.2);
	padding:12px 16px; border-radius:4px; color:var(--gray-2, #C8C6BC);
}
.ig-res-note i{color:var(--teal-bright, #1C8578); font-size:17px; flex-shrink:0; margin-top:1px;}

.ig-res-form{background:rgba(250,250,247,0.05); border:1px solid rgba(250,250,247,0.15); border-radius:6px; padding:28px;}
.ig-res-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.ig-res-row.ig-res-wrap{display:flex; flex-wrap:wrap; gap:16px;}
.ig-res-field{display:flex; flex-direction:column; gap:7px;}
.ig-res-field-small{flex:0 0 130px;}
.ig-res-field label{font-size:12px; letter-spacing:0.03em; color:rgba(250,250,247,0.75);}
.ig-res-field input{
	background:rgba(250,250,247,0.08); border:1px solid rgba(250,250,247,0.28); color:var(--paper, #FAFAF7);
	padding:12px 14px; font-family:'Inter', sans-serif; font-size:13.5px; border-radius:4px;
	-webkit-text-fill-color:var(--paper, #FAFAF7); /* fuerza el color real del texto — algunos navegadores ignoran "color" solo */
}
.ig-res-field input::placeholder{color:rgba(250,250,247,0.6); -webkit-text-fill-color:rgba(250,250,247,0.6);}
.ig-res-field input:focus{outline:none; border-color:var(--teal-bright, #1C8578);}
.ig-res-field input.ig-res-invalid{border-color:#E88A8A;}

/* Mismo fondo oscuro que el resto del formulario, con el texto forzado
   en blanco vía -webkit-text-fill-color (el "color" normal no alcanza
   en los selectores de fecha nativos de varios navegadores). */
.ig-res-field input[type="date"]{
  background:rgba(250,250,247,0.08) !important;
  color:var(--paper, #FAFAF7) !important;
  -webkit-text-fill-color:var(--paper, #FAFAF7) !important;
  border-color:rgba(250,250,247,0.28) !important;
  color-scheme:dark;
}
.ig-res-field input[type="date"]::-webkit-datetime-edit,
.ig-res-field input[type="date"]::-webkit-datetime-edit-fields-wrapper,
.ig-res-field input[type="date"]::-webkit-datetime-edit-text,
.ig-res-field input[type="date"]::-webkit-datetime-edit-month-field,
.ig-res-field input[type="date"]::-webkit-datetime-edit-day-field,
.ig-res-field input[type="date"]::-webkit-datetime-edit-year-field{
  color:var(--paper, #FAFAF7) !important;
  -webkit-text-fill-color:var(--paper, #FAFAF7) !important;
}
.ig-res-field input[type="date"]::-webkit-calendar-picker-indicator{
  filter:invert(1); /* ícono de calendario oscuro por defecto → blanco, para que se vea sobre fondo oscuro */
  cursor:pointer;
}
.ig-res-date-error{font-size:12px; color:#E88A8A; display:none;}
.ig-res-date-error.show{display:block;}
.ig-res-price-summary{
	display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px;
	background:rgba(28,133,120,0.15); border:1px solid rgba(28,133,120,0.4); border-radius:4px;
	padding:14px 18px; margin-bottom:20px;
}
.ig-res-price-summary .label{font-size:12px; letter-spacing:0.04em; color:rgba(250,250,247,0.75); text-transform:uppercase;}
.ig-res-price-summary .value{font-family:'Fraunces', serif; font-size:24px; color:var(--paper, #FAFAF7);}
.ig-res-price-note{width:100%; font-size:12px; color:rgba(250,250,247,0.6);}

.ig-res-stepper-control{display:flex; align-items:center; gap:0; border:1px solid rgba(250,250,247,0.28); border-radius:4px; overflow:hidden; width:fit-content;}
.ig-res-step-btn{
	background:rgba(250,250,247,0.1); border:none; color:var(--paper, #FAFAF7); width:38px; height:42px;
	font-size:18px; cursor:pointer; line-height:1;
}
.ig-res-step-btn:hover{background:var(--teal-bright, #1C8578);}
.ig-res-stepper-control input{
	width:52px; text-align:center; border:none; background:transparent; color:var(--paper, #FAFAF7);
	font-size:15px; padding:12px 0;
	-webkit-text-fill-color:var(--paper, #FAFAF7); opacity:1;
}

.ig-res-divider{
	display:flex; align-items:center; gap:12px; margin:24px 0 16px; font-size:12px;
	letter-spacing:0.06em; text-transform:uppercase; color:rgba(250,250,247,0.55);
}
.ig-res-divider::after{content:''; flex:1; height:1px; background:rgba(250,250,247,0.15);}

.ig-res-submit{width:100%; justify-content:center; margin-top:10px; font-size:15px; padding:15px;}
.ig-res-feedback{margin-top:12px; font-size:13px; text-align:center;}
.ig-res-feedback.error{color:#E88A8A;}

.ig-res-success{
	background:rgba(250,250,247,0.08); border:1px solid rgba(250,250,247,0.2); border-radius:6px;
	padding:40px 28px; text-align:center;
}
.ig-res-success h3{font-family:'Fraunces', serif; font-size:24px; font-weight:500; margin:14px 0 8px; color:var(--paper, #FAFAF7) !important;}
.ig-res-success p{color:var(--gray-2, #C8C6BC); font-size:14px; margin-bottom:22px;}

@media (max-width:640px){
	.ig-res-row{grid-template-columns:1fr;}
	.ig-res-band{padding:56px 22px;}
	.ig-res-form{padding:20px;}
}
