:root{--pink:#d91c74;--dark:#202124;--soft:#fff3f8;--line:#eadde4;--ok:#147a46}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--dark);background:#fafafa}header{background:white;border-bottom:1px solid var(--line);padding:16px 0}.wrap{width:min(1100px,92%);margin:auto}.brand{font-size:26px;font-weight:800;color:var(--pink)}.hero{padding:48px 0;background:linear-gradient(135deg,#fff,#fff3f8)}h1{font-size:clamp(32px,5vw,54px);margin:0 0 12px}.lead{font-size:18px;color:#5f6368}.card{background:white;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 8px 30px rgba(0,0,0,.04);margin:20px 0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}label{font-weight:700;font-size:14px}input,select,button{width:100%;padding:13px 14px;margin-top:6px;border:1px solid #ccc;border-radius:11px;font-size:16px}button,.btn{background:var(--pink);color:white;border:0;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;text-align:center;padding:13px 18px;border-radius:11px}.btn.secondary{background:#333}.trip{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}.price{font-size:24px;font-weight:800}.muted{color:#6b6f75}.ok{color:var(--ok);font-weight:700}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}nav a{margin-left:16px;color:#333;text-decoration:none}@media(max-width:800px){.grid,.grid2{grid-template-columns:1fr}.trip{align-items:flex-start;flex-direction:column}.trip .btn{width:100%}}

/* Fase 2 - selecci贸n de asientos */
.booking-layout{display:grid;grid-template-columns:minmax(320px,1.1fr) minmax(300px,.9fr);gap:28px;align-items:start}.seat-legend{display:flex;gap:16px;flex-wrap:wrap;margin:12px 0 18px;font-size:13px}.seat-legend span{display:flex;align-items:center;gap:7px}.legend-dot{width:14px;height:14px;border-radius:4px;display:inline-block;border:1px solid #bbb}.legend-dot.available{background:#dff5e7;border-color:#77bc91}.legend-dot.selected{background:var(--pink);border-color:var(--pink)}.legend-dot.occupied{background:#e4e4e4;border-color:#c7c7c7}.vehicle-shell{max-width:430px;margin:0 auto;border:2px solid #d7d7d7;border-radius:46px 46px 24px 24px;padding:18px 24px 26px;background:#fcfcfc}.vehicle-front{text-align:center;font-size:12px;color:#777;border-bottom:1px dashed #ccc;padding:3px 0 14px;margin-bottom:18px}.seat-map{display:grid;grid-template-columns:repeat(4,56px);justify-content:center;column-gap:20px;row-gap:14px}.seat-map .seat-option:nth-child(4n+2){margin-right:18px}.seat-option{display:block;margin:0}.seat-option input{position:absolute;opacity:0;pointer-events:none}.seat-option span{display:flex;width:56px;height:46px;align-items:center;justify-content:center;background:#dff5e7;border:1px solid #77bc91;border-radius:9px;font-weight:800;cursor:pointer;transition:.15s}.seat-option input:checked+span{background:var(--pink);border-color:var(--pink);color:#fff;transform:translateY(-1px);box-shadow:0 5px 12px rgba(217,28,116,.2)}.seat-option.is-occupied span{background:#e7e7e7;border-color:#c9c9c9;color:#8b8b8b;cursor:not-allowed;text-decoration:line-through}.booking-summary>div{margin-bottom:13px}.summary-box{background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:16px;margin:18px 0!important;line-height:1.8}.alert-error{background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;padding:12px 14px;border-radius:12px;margin:14px 0}.table-scroll{overflow-x:auto}
@media(max-width:800px){.booking-layout{grid-template-columns:1fr}.seat-map{grid-template-columns:repeat(4,50px);column-gap:14px}.seat-option span{width:50px;height:44px}.vehicle-shell{padding-left:14px;padding-right:14px}.seat-map .seat-option:nth-child(4n+2){margin-right:10px}}

/* Toyota Hiace - distribución real de 14 asientos */

.seat-map-hiace14{
    display:grid;
    grid-template-columns:repeat(4,56px);
    grid-template-rows:repeat(5,46px);
    justify-content:center;
    column-gap:18px;
    row-gap:18px;
    position:relative;
}

.seat-map-hiace14 .seat-option:nth-child(4n+2){
    margin-right:0;
}

/* Fila delantera */
.seat-map-hiace14 .seat-option:nth-child(1){
    grid-column:4;
    grid-row:1;
}

.seat-map-hiace14 .seat-option:nth-child(2){
    grid-column:3;
    grid-row:1;
}

/* Segunda fila */
.seat-map-hiace14 .seat-option:nth-child(3){
    grid-column:1;
    grid-row:2;
}

.seat-map-hiace14 .seat-option:nth-child(4){
    grid-column:2;
    grid-row:2;
}

/* Tercera fila */
.seat-map-hiace14 .seat-option:nth-child(5){
    grid-column:1;
    grid-row:3;
}

.seat-map-hiace14 .seat-option:nth-child(6){
    grid-column:2;
    grid-row:3;
}

.seat-map-hiace14 .seat-option:nth-child(7){
    grid-column:4;
    grid-row:3;
}

/* Cuarta fila */
.seat-map-hiace14 .seat-option:nth-child(8){
    grid-column:1;
    grid-row:4;
}

.seat-map-hiace14 .seat-option:nth-child(9){
    grid-column:2;
    grid-row:4;
}

.seat-map-hiace14 .seat-option:nth-child(10){
    grid-column:4;
    grid-row:4;
}

/* Última fila */
.seat-map-hiace14 .seat-option:nth-child(11){
    grid-column:1;
    grid-row:5;
}

.seat-map-hiace14 .seat-option:nth-child(12){
    grid-column:2;
    grid-row:5;
}

.seat-map-hiace14 .seat-option:nth-child(13){
    grid-column:3;
    grid-row:5;
}

.seat-map-hiace14 .seat-option:nth-child(14){
    grid-column:4;
    grid-row:5;
}

/* Asiento del conductor */
.seat-map-hiace14::before{
    content:"Conductor";
    grid-column:1;
    grid-row:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:56px;
    height:46px;
    background:#333;
    color:#fff;
    border-radius:9px;
    font-size:9px;
    font-weight:700;
}

/* JAC Sunray - distribución real de 16 asientos */

.seat-map-jac16{
    display:grid;
    grid-template-columns:repeat(4,56px);
    grid-template-rows:repeat(6,46px);
    justify-content:center;
    column-gap:18px;
    row-gap:18px;
    position:relative;
}

/* Quitar separación automática del mapa genérico */
.seat-map-jac16 .seat-option:nth-child(4n+2){
    margin-right:0;
}

/* Fila delantera */
.seat-map-jac16 .seat-option:nth-child(1){
    grid-column:4;
    grid-row:1;
}

.seat-map-jac16 .seat-option:nth-child(2){
    grid-column:3;
    grid-row:1;
}

/* Segunda fila */
.seat-map-jac16 .seat-option:nth-child(3){
    grid-column:1;
    grid-row:2;
}

.seat-map-jac16 .seat-option:nth-child(4){
    grid-column:2;
    grid-row:2;
}

/* Tercera fila */
.seat-map-jac16 .seat-option:nth-child(5){
    grid-column:1;
    grid-row:3;
}

.seat-map-jac16 .seat-option:nth-child(6){
    grid-column:2;
    grid-row:3;
}

/* Cuarta fila */
.seat-map-jac16 .seat-option:nth-child(8){
    grid-column:1;
    grid-row:4;
}

.seat-map-jac16 .seat-option:nth-child(9){
    grid-column:2;
    grid-row:4;
}

.seat-map-jac16 .seat-option:nth-child(7){
    grid-column:4;
    grid-row:4;
}

/* Quinta fila */
.seat-map-jac16 .seat-option:nth-child(11){
    grid-column:1;
    grid-row:5;
}

.seat-map-jac16 .seat-option:nth-child(12){
    grid-column:2;
    grid-row:5;
}

.seat-map-jac16 .seat-option:nth-child(10){
    grid-column:4;
    grid-row:5;
}

/* Última fila */
.seat-map-jac16 .seat-option:nth-child(13){
    grid-column:1;
    grid-row:6;
}

.seat-map-jac16 .seat-option:nth-child(14){
    grid-column:2;
    grid-row:6;
}

.seat-map-jac16 .seat-option:nth-child(15){
    grid-column:3;
    grid-row:6;
}

.seat-map-jac16 .seat-option:nth-child(16){
    grid-column:4;
    grid-row:6;
}

/* Asiento del conductor */
.seat-map-jac16::before{
    content:"Conductor";
    grid-column:1;
    grid-row:1;
    display:flex;
    align-items:center;
    justify-content:center;
    width:56px;
    height:46px;
    background:#333;
    color:#fff;
    border-radius:9px;
    font-size:9px;
    font-weight:700;
}

/* Indicador visual de puerta lateral */
.vehicle-shell{
    position:relative;
}

.vehicle-door{
    position:absolute;
    right:-2px;
    top:115px;
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    font-size:11px;
    font-weight:700;
    color:#777;
    background:#fff;
    border:1px solid #ccc;
    border-radius:6px 0 0 6px;
    padding:8px 4px;
}