/* ===== Hotel Mansión Colonial — Booking Engine ===== */
.book-overlay{position:fixed;inset:0;background:rgba(20,12,10,.72);z-index:200;display:none;align-items:center;justify-content:center;padding:20px;}
.book-overlay.open{display:flex;}
.book-modal{background:#faf6ee;max-width:640px;width:100%;max-height:90vh;overflow-y:auto;border-radius:6px;position:relative;box-shadow:0 30px 80px rgba(20,12,10,.4);}
.book-modal-head{background:linear-gradient(135deg,#7a2e2e,#4d1c1c);color:#fff;padding:28px 30px 22px;position:sticky;top:0;z-index:2;}
.book-modal-head h3{font-family:'Playfair Display',Georgia,serif;font-size:1.5rem;margin-bottom:4px;}
.book-modal-head p{font-size:.85rem;color:#e9d9c9;}
.book-close{position:absolute;top:18px;right:20px;background:rgba(255,255,255,.15);border:none;color:#fff;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:1.1rem;line-height:1;}
.book-close:hover{background:rgba(255,255,255,.3);}
.book-steps{display:flex;gap:6px;padding:16px 30px 0;font-size:.75rem;color:#b8863b;font-weight:600;letter-spacing:.03em;}
.book-steps span{opacity:.4;}
.book-steps span.active{opacity:1;}
.book-body{padding:24px 30px 30px;}
.book-body h4{font-family:'Playfair Display',Georgia,serif;color:#4d1c1c;font-size:1.15rem;margin-bottom:16px;}
.book-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;}
.book-field label{display:block;font-size:.78rem;font-weight:600;color:#6b5f50;margin-bottom:6px;text-transform:uppercase;letter-spacing:.03em;}
.book-field input,.book-field select,.book-field textarea{width:100%;padding:11px 13px;border:1px solid #d8c9ab;border-radius:3px;background:#fff;font-family:inherit;font-size:.92rem;color:#2a2119;}
.book-field input:focus,.book-field select:focus,.book-field textarea:focus{outline:2px solid #b8863b;outline-offset:1px;}
.room-pick{display:flex;gap:14px;border:1px solid #d8c9ab;border-radius:4px;padding:14px;margin-bottom:12px;align-items:center;background:#fff;}
.room-pick img{width:76px;height:76px;object-fit:cover;border-radius:3px;flex-shrink:0;}
.room-pick .rp-info{flex:1;}
.room-pick .rp-tag{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:#b8863b;font-weight:600;}
.room-pick h5{font-family:'Playfair Display',Georgia,serif;font-size:1rem;margin:2px 0 4px;color:#2a2119;}
.room-pick .rp-meta{font-size:.78rem;color:#6b5f50;}
.room-pick .rp-price{font-weight:600;color:#7a2e2e;}
.stepper{display:flex;align-items:center;gap:10px;}
.stepper button{width:28px;height:28px;border-radius:50%;border:1px solid #d8c9ab;background:#fff;cursor:pointer;font-size:1rem;color:#7a2e2e;line-height:1;}
.stepper button:hover{background:#efe6d8;}
.stepper .count{min-width:18px;text-align:center;font-weight:600;}
.book-total{background:#efe6d8;border-radius:4px;padding:18px;margin:18px 0;font-size:.9rem;}
.book-total .row{display:flex;justify-content:space-between;padding:5px 0;color:#4a3f34;}
.book-total .grand{font-family:'Playfair Display',Georgia,serif;font-size:1.3rem;color:#7a2e2e;border-top:1px solid #d8c9ab;margin-top:8px;padding-top:10px;}
.book-note{font-size:.78rem;color:#6b5f50;margin-top:10px;}
.book-actions{display:flex;gap:12px;margin-top:22px;}
.book-actions .btn{flex:1;text-align:center;cursor:pointer;border:none;font-family:inherit;}
.book-actions .btn-back{background:transparent;border:1px solid #d8c9ab;color:#4a3f34;}
.pay-methods{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.pay-methods a, .pay-methods .pay-static{display:flex;align-items:center;gap:8px;padding:12px 14px;border:1px solid #d8c9ab;border-radius:4px;background:#fff;font-size:.85rem;}
.pay-methods a:hover{background:#efe6d8;}
.bank-box{background:#fff;border:1px solid #d8c9ab;border-radius:4px;padding:14px;font-size:.85rem;margin-bottom:14px;}
.confirm-panel{text-align:center;padding:30px 10px;}
.confirm-panel .icon{font-size:3rem;margin-bottom:14px;}
.confirm-panel h4{font-size:1.4rem;margin-bottom:10px;}
.confirm-panel p{color:#5a4d3f;margin-bottom:22px;}

/* Quick Book trigger button variant already uses .btn-primary from page CSS */
@media(max-width:520px){
  .book-row{grid-template-columns:1fr;}
  .pay-methods{grid-template-columns:1fr;}
}