/* ======================================================
FORMULARIO – MÓDULO IDENTIFICACIÓN
BLUEToUR
====================================================== */

.bluetour-identificacion{

max-width:900px;

}


/* ======================================================
SECCIONES DEL FORMULARIO
====================================================== */

.bt-form-section{

margin-bottom:30px;
padding:20px;

background:white;

border:1px solid #E8EEF6;
border-radius:8px;

box-shadow:0 2px 6px rgba(0,0,0,0.03);

}

.bt-form-section h3{

margin-bottom:16px;

font-size:18px;
font-weight:600;

color:#121E29;

}


/* ======================================================
GRID
====================================================== */

.bt-grid-1{

display:grid;
grid-template-columns:1fr;
gap:16px;

}

.bt-grid-2{

display:grid;
grid-template-columns:1fr 1fr;
gap:16px;

}


/* ======================================================
CAMPOS
====================================================== */

.bt-field{

display:flex;
flex-direction:column;

}

.bt-field label{

font-weight:500;
margin-bottom:6px;

color:#121E29;

}

.bt-field input,
.bt-field select,
.bt-field textarea{

padding:10px 12px;

border:1px solid #D6DCE5;
border-radius:6px;

font-size:14px;

background:white;

transition:border .15s ease;

}

.bt-field input:focus,
.bt-field select:focus,
.bt-field textarea:focus{

outline:none;
border-color:#1E5BD7;

box-shadow:0 0 0 2px rgba(30,91,215,0.08);

}


/* ======================================================
SELECT MULTIPLE (turismo complementario)
====================================================== */

select[multiple]{

min-height:120px;

}


/* ======================================================
ACCIONES
====================================================== */

.bluetour-actions{

margin-top:20px;

display:flex;
gap:10px;

flex-wrap:wrap;

}

.bluetour-actions button{

cursor:pointer;

border:none;

padding:10px 16px;

border-radius:6px;

font-size:14px;

font-weight:500;

}


/* ======================================================
MENSAJES
====================================================== */

.bluetour-message{

margin-top:15px;
font-size:14px;

}

.bluetour-message.success{

color:#2E7D32;

}

.bluetour-message.error{

color:#C62828;

}


/* ======================================================
GALERÍA DE FOTOS – IDENTIFICACIÓN
====================================================== */

.bluetour-photo-preview {

display:grid;

grid-template-columns:repeat(auto-fill, minmax(90px,1fr));

gap:10px;

margin-top:10px;

}

.photo-thumb {

position:relative;

width:100%;

aspect-ratio:1/1;

overflow:hidden;

border-radius:6px;

border:1px solid #ddd;

background:#f8f8f8;

}

.photo-thumb img {

width:100%;

height:100%;

object-fit:cover;

display:block;

}

/* botón eliminar */

.photo-thumb button {

position:absolute;

top:4px;
right:4px;

width:22px;
height:22px;

border-radius:50%;

border:none;

background:rgba(0,0,0,0.7);

color:#fff;

font-size:14px;

line-height:22px;

cursor:pointer;

padding:0;

}

.photo-thumb button:hover{

background:#c0392b;

}


/* ======================================================
RESPONSIVE
====================================================== */

@media (max-width:768px){

.bt-grid-2{

grid-template-columns:1fr;

}

.bluetour-actions{

flex-direction:column;

}

.bluetour-actions button{

width:100%;

}

.bluetour-identificacion{

max-width:100%;

}

}


/* ======================================================
MÓVIL PEQUEÑO
====================================================== */

@media (max-width:480px){

.bt-form-section{

padding:16px;

}

.bt-field input,
.bt-field select,
.bt-field textarea{

font-size:16px; /* evita zoom en iPhone */

}

}