
/* ===== SKYDECK-TICKET (BLOCK) ===== */
.skydeck-booking{ position:relative;margin-bottom:80px; }
.skydeck-booking.skydeck-booking--overlap{ margin-top: -380px; }
.skydeck-booking .skydeck-booking__panel{
  background:#ffffff; border-radius:20px; box-shadow:0 24px 60px rgba(20,47,67,.12); padding:40px;
}

/* ---- breadcrumb ---- */
.skydeck-booking .skydeck-booking__breadcrumb{ margin-bottom:12px; }
.skydeck-booking .skydeck-booking__bc-list{ display:flex; flex-wrap:wrap; gap:12px; list-style:none; margin:0; padding:0; }
.skydeck-booking .skydeck-booking__bc-item{ position:relative; }
.skydeck-booking .skydeck-booking__bc-item+.skydeck-booking__bc-item::before{ content:"/"; margin:0 12px 0 0px; color:#484848; }
.skydeck-booking .skydeck-booking__bc-link{ text-decoration:none; color:#484848; }
.skydeck-booking .skydeck-booking__bc-link:hover{ text-decoration:underline; }
.skydeck-booking .skydeck-booking__bc-item--current{ color:#9aa6ae; }

/* ---- title ---- */
.skydeck-booking .skydeck-booking__title-main{
    font-family: Trajan Pro;
    margin: 0 0 20px;
    font-size: 60px;
    font-weight: 700;
}
.skydeck-booking .skydeck-booking__title{
    margin: 0 0 20px;
    font-size: clamp(15px, 2.5vw, 40px);
    font-weight: 700;
}

/* ---- gallery layout ---- */
/*.skydeck-booking .skydeck-booking__gallery{ display:grid; grid-template-columns: 2fr 1fr; grid-auto-rows: 1fr; gap:20px; }*/
.skydeck-booking .skydeck-booking__item{ margin:0; background:#eef4f7; border-radius:12px; overflow:hidden;display:block;aspect-ratio:16/7; }
.skydeck-booking .skydeck-booking__item--main{ grid-row: 1 / span 2; }
.skydeck-booking .skydeck-booking__img{ display:block; width:100%; height:100%; object-fit:cover; }
.skydeck-booking .skydeck-booking__item--main .skydeck-booking__img{ height:100%; }
.skydeck-booking__gallery .owl-dots{display:flex;justify-content:center;align-items:center;gap:12px;bottom:20px;left:50%;transform:translateX(-50%);position:absolute}
.skydeck-booking__gallery .owl-dot{width:auto}
.skydeck-booking__gallery .owl-dot span{display:block;width:8px;height:8px;border-radius:999px;background:#FFFFFF99;margin:0;transition:width .25s ease,background-color .25s ease,opacity .25s ease}
.skydeck-booking__gallery .owl-dot.active span{width:24px;height:8px;background:#fff;opacity:1}
.skydeck-booking__gallery .owl-dot:hover span{background:#92AAB7}
/* ===== MODIFIERS ===== */
.skydeck-booking--flush .skydeck-booking__panel{ box-shadow:none; }
.skydeck-booking--tight .skydeck-booking__panel{ padding:18px; }

/* ===== TOUR-BOOKING (SCOPED BEM) ===== */
.skydeck-booking .skydeck-booking__wrapper{margin: 0px 0px 80px;}
.skydeck-booking .skydeck-booking__box{margin-bottom:80px;}
.skydeck-booking .skydeck-booking__heading{ margin:0 0 20px; font-size:clamp(15px, 2.5vw, 40px); font-weight:700; }
.skydeck-booking .skydeck-booking__lead{ margin:0 0 20px; border-bottom:1px solid #C9D4D9; padding-bottom:20px; }
.skydeck-booking .skydeck-booking__facts{ list-style:none; padding:0; }
.skydeck-booking .skydeck-booking__fact{ display:flex; align-items:center; gap: 8px; }
.skydeck-booking .skydeck-booking__fact:first-child{ margin-bottom:8px; }
.skydeck-booking .skydeck-booking__fact:last-child{ border-bottom: 1px solid #C9D4D9; padding-bottom: 20px; }
.skydeck-booking .skydeck-booking__icon{ display:flex; }
.skydeck-booking .skydeck-booking__link{ color:#3f6c87; }

/* Calendar */
.skydeck-booking .skydeck-booking__calendar{ border:1px solid #C9D4D9; background:#fff; padding:20px; }
.skydeck-booking .skydeck-booking__cal-head{ display:flex; align-items:center; justify-content:space-between; padding:12px 0px; }
.skydeck-booking .skydeck-booking__cal-month{ color:#274b60; font-weight:600; }
.skydeck-booking .skydeck-booking__cal-nav{ background:none; outline:none; border:none; display:flex; padding:0; }
.skydeck-booking .skydeck-booking__cal-week{ display:grid; grid-template-columns: repeat(7, 1fr); gap: 8px; padding:20px 0; color:#527A8F; font-weight:700; margin:20px 0; border-bottom:1px solid #C9D4D9; border-top:1px solid #C9D4D9; }
.skydeck-booking .skydeck-booking__cal-week span{ display:inline-flex; background:#C9D4D933; border:1px solid #527A8F; justify-content:center; align-items:center; width:100%; height:clamp(28px, 3.75vw, 60px); border-radius:2px; }
.skydeck-booking .skydeck-booking__cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin:0 0 20px; border-bottom:1px solid #C9D4D9; padding-bottom:20px; }
.skydeck-booking .skydeck-booking__day{ height:clamp(28px, 3.75vw, 60px); border-radius:2px; display:flex; flex-direction:column; justify-content:center; align-items:center; background:#fff; color:#527A8F; cursor:pointer; transition:background .15s ease, color .15s ease, border-color .15s ease; border-style:unset; }
.skydeck-booking .skydeck-booking__day:hover{ background:#e4f0f6; }
.skydeck-booking .skydeck-booking__day--muted{ background:#f7f9fb; color:#9cb0bb; cursor:default; }
.skydeck-booking .skydeck-booking__day--off{ background:#C9D4D91A; color:#C9D4D9; border-style:unset; cursor:default; }
.skydeck-booking .skydeck-booking__day--active{ background:#527A8F; color:#fff; }
.skydeck-booking .skydeck-booking__day-num{ line-height:160%; font-weight:600; }
.skydeck-booking .skydeck-booking__day-price{ font-size:14px; line-height:160%; color:#527a8f;display:none;}
.skydeck-booking .skydeck-booking__day--off .skydeck-booking__day-price{ color:#9cb0bb; opacity:.7; }
.skydeck-booking .skydeck-booking__day--active .skydeck-booking__day-price{ color:#ffffff; opacity:1; }
.skydeck-booking .skydeck-booking__cal-legend{ padding:8px 0px; font-size:14px; }
.skydeck-booking .skydeck-booking__badge{ display:inline-block; width:12px; height:12px; border-radius:999px; margin-right:6px; vertical-align:-2px; }
.skydeck-booking .skydeck-booking__badge--off{ background:#cdd9e0; }

/* Types */
.skydeck-booking .skydeck-booking__type{ padding:20px 0; border-bottom:2px dashed #C9D4D9; }
.skydeck-booking .skydeck-booking__type:last-child{ border-bottom:none; }
.skydeck-booking .skydeck-booking__type-main{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 0; }
.skydeck-booking .skydeck-booking__type-name{ margin:0 0 12px; font-weight:700; font-size:clamp(18px, 1.5vw, 24px); }
.skydeck-booking .skydeck-booking__hint{ font-size:14px;font-weight: 400;margin-left:12px;}
.skydeck-booking .skydeck-booking__price{ display:flex; align-items:baseline; gap:12px; }
.skydeck-booking .skydeck-booking__price-new{ background:#527A8F1A; color:#527A8F; padding:2px 10px; font-weight:700; line-height:160%; border-top-right-radius:2px; border-bottom-right-radius:2px; border-bottom-left-radius:2px; position:relative; }
.skydeck-booking .skydeck-booking__price-new::before{ content:""; position:absolute; top:0; left:0; width:6px; height:7px; transform:translate(0%, -100%) rotate(-90deg); border-top:6px solid #527A8F1A; border-right:7px solid transparent; }
.skydeck-booking .skydeck-booking__price-old{ position:relative; color:#4a4a4a; display:inline-block; }
/*.skydeck-booking .skydeck-booking__price-old::after{ content:""; position:absolute; left:0; right:0; height:1px; bottom:10px; background:#484848; pointer-events:none; }*/

.skydeck-booking .skydeck-booking__qty{ display:flex; align-items:center; gap:8px; border:1px solid #C9D4D9; border-radius:100px; padding:8px; }
.skydeck-booking .skydeck-booking__qty-btn{ border:none; background:none; padding:0; }
.skydeck-booking .skydeck-booking__qty-val{ min-width:32px; height:32px; text-align:center; line-height:32px; }
.skydeck-booking .skydeck-booking__note{ border-top:1px solid #C9D4D9; padding-top:20px; }
.skydeck-booking .skydeck-booking__note-title{ margin:0 0 8px; font-weight:700; font-size:clamp(18px, 1.5vw, 24px); }
.skydeck-booking .skydeck-booking__list p{ margin-bottom:0; }

/* Summary */
.skydeck-booking .skydeck-booking__summary{ position:sticky; top:100px; background:#ffffff; border:2px solid #527A8F; border-radius:14px; padding:40px; box-shadow:0px 12px 40px 0px #527A8F0D; }
.skydeck-booking .skydeck-booking__summary-title{ margin:0 0 40px; font-weight:700; font-size:clamp(15px, 2.5vw, 40px); line-height:120%; }
.skydeck-booking .skydeck-booking__summary-list{ margin:0 0 40px; }
.skydeck-booking .skydeck-booking__rowline{ display:flex; justify-content:space-between; gap:12px; }
.skydeck-booking .skydeck-booking__rowline--strong{ font-weight:800; }
.skydeck-booking .skydeck-booking__rowline--option,.skydeck-booking .skydeck-booking__rowline--discount{ margin-bottom:8px; }
.skydeck-booking .skydeck-booking__rowline dt{ font-size:clamp(18px, 1.5vw, 24px); }
.skydeck-booking .skydeck-booking__divider{ height:1px; background:#C9D4D9; margin:20px 0; }
.skydeck-booking .skydeck-booking__bullets ul{ margin:0px 0 40px; }
.skydeck-booking .skydeck-booking__bullets ul li{ margin-bottom:4px; }
.skydeck-booking .skydeck-booking__bullets ul li:last-child{ margin-bottom:0px; }
.skydeck-booking .skydeck-booking__bullets ul li::marker{ color:#527A8F; }
.skydeck-booking .skydeck-booking__cta{ display:flex; margin-top:auto; width:100%; justify-content:center; align-items:center; gap:20px; padding:16px 32px; border-radius:4px; background:linear-gradient(92.75deg, #618FA8 0%, #406F87 100%); color:#FFFFFF; border:1px solid; text-decoration:unset; transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease; }
.skydeck-booking .skydeck-booking__cta:hover{ background-color:#315B6E; transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.08); }
.skydeck-booking .skydeck-booking__cta:active{ transform:translateY(0); box-shadow:none; }
.skydeck-booking .skydeck-booking__cta-text{ font-size:18px; line-height:160%; }
.skydeck-booking .skydeck-booking__cta-icon{ font-size:18px;}
.skydeck-booking  .skydeck-booking__grids{margin-bottom: 80px;}
/* Cột bên trong booking co nhỏ được */
.skydeck-booking__grids > [class*="col-"]{ min-width:0; }
/* Đảm bảo lịch không vượt quá cột */
.skydeck-booking .skydeck-booking__calendar{ box-sizing:border-box; max-width:100%; }
/* 1fr co về 0 khi cột hẹp => không phá layout */
.skydeck-booking .skydeck-booking__cal-week,
.skydeck-booking .skydeck-booking__cal-grid{ grid-template-columns: repeat(7, minmax(0, 1fr)); }

/* ========== RESPONSIVE ========== */

@media (max-width: 1599px){
  .skydeck-booking .skydeck-booking__qty-val{ min-width:auto; }
}
@media(max-width:1199px){
  .skydeck-booking .skydeck-booking__cal-week span,.skydeck-booking .skydeck-booking__day{height: clamp(28px, 9vw, 78px);}
}
@media (max-width:991px){
  .skydeck-booking{margin-bottom: 60px;}
  .skydeck-booking .skydeck-booking__panel{background:none;box-shadow:none;padding:0;border-radius: 0px;}
  .skydeck-booking .skydeck-booking__wrapper{background: #ffffff;border-radius: 20px;box-shadow: 0 24px 60px rgba(20, 47, 67, .12);padding: 40px;margin:0px 0px 60px;}
  .skydeck-booking .skydeck-booking__wrapper .skydeck-booking__box { margin-bottom: 0px;}
  .skydeck-booking .skydeck-booking__grids{background: #ffffff;border-radius: 20px;box-shadow: 0 24px 60px rgba(20, 47, 67, .12);padding: 40px;margin:0px 0px 60px;}
  .skydeck-booking .skydeck-booking__grids >.row{gap: 40px;}
  .skydeck-booking .skydeck-booking__title{ margin:0px 0 20px;text-align: center;font-size:40px; }
  .skydeck-booking .skydeck-booking__gallery{ grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; margin-bottom:40px;}
  .skydeck-booking .skydeck-booking__item--main{ grid-row: auto; grid-column: 1 / -1; aspect-ratio: 16 / 9; }
  .skydeck-booking .skydeck-booking__item{ aspect-ratio: 16/9; }
  .skydeck-booking .skydeck-booking__img{ height:100%; }
  .skydeck-booking .skydeck-booking__heading{ font-size:40px; text-align:center; }
  .skydeck-booking .skydeck-booking__fact:first-child{ margin:0 0 12px; border-bottom:1px solid #C9D4D9; padding-bottom:12px; }
  .skydeck-booking .skydeck-booking__fact:last-child{ padding-bottom:12px; }
  .skydeck-booking .skydeck-booking__facts{ margin:0 0 40px; }
  .skydeck-booking .skydeck-booking__summary{ margin-top:18px; }
  .skydeck-booking .skydeck-booking__cal-week,.skydeck-booking .skydeck-booking__cal-grid{margin: 12px 0;padding: 12px 0;}
  .skydeck-booking .skydeck-booking__type:first-child{border-top: 1px solid #C9D4D9}
  .skydeck-booking .skydeck-booking__type-name,.skydeck-booking .skydeck-booking__note-title{font-size:24px;}
  .skydeck-booking .skydeck-booking__qty-val {min-width: 32px;}
}
@media (max-width:575.98px){
  .skydeck-booking {margin-bottom: 40px;}
  .skydeck-booking.skydeck-booking--overlap {margin-top: -200px;background: #fff;padding: 40px 0;margin-bottom: 0;box-shadow: 0 24px 60px rgba(20, 47, 67, .12);border-top-left-radius: 12px;border-top-right-radius: 12px;}
  .skydeck-booking .skydeck-booking__breadcrumb{margin-bottom:4px;}
  .skydeck-booking .skydeck-booking__title-main{font-size:40px;}
  .skydeck-booking .skydeck-booking__title{font-size:32px;}
  .skydeck-booking .skydeck-booking__gallery{display:block;}
  .skydeck-booking .skydeck-booking__wrapper,.skydeck-booking .skydeck-booking__grids,.skydeck-gallery,.skydeck-faq{padding: 0px;box-shadow:none;background:none;}
  .skydeck-booking .skydeck-booking__item{border-radius:4px;}
  .skydeck-booking .skydeck-booking__heading{font-size:32px;}
  .skydeck-booking .skydeck-booking__lead{margin: 0 0 8px;}
  .skydeck-booking .skydeck-booking__fact:first-child{margin: 0 0 8px;padding-bottom: 8px;}
  .skydeck-booking .skydeck-booking__fact:last-child {padding-bottom: 8px;}
  .skydeck-booking .skydeck-booking__facts {margin: 0 0 20px;}
  .skydeck-booking .skydeck-booking__cta{padding:8px 16px;gap:8px}
  .skydeck-booking .skydeck-booking__wrapper{margin:0px 0px 40px;}
  .skydeck-booking .skydeck-booking__calendar{padding:12px;}
  .skydeck-booking .skydeck-booking__type-main{padding:0;align-items: end;}
  .skydeck-booking .skydeck-booking__type-name, .skydeck-booking .skydeck-booking__note-title {font-size: 20px;}
  .skydeck-booking .skydeck-booking__price{flex-direction: column;gap: 4px;}
  .skydeck-booking .skydeck-booking__hint{margin-left:8px;font-size:10px;}
  .skydeck-booking .skydeck-booking__bullets ul{margin: 0px 0px 20px;}
  .skydeck-booking .skydeck-booking__grids{margin: 0px 0px 40px;}
  .skydeck-booking .skydeck-booking__cal-week span{height:42px;}
  .skydeck-booking .skydeck-booking__day{height:49px;}
  .skydeck-booking .skydeck-booking__day-price{font-size:10px;}
  /* Dots custom (nằm giữa dưới) */
  .skydeck-booking .skydeck-booking__gallery .owl-dots{display: flex;justify-content: center;align-items: center;gap: 4px;bottom: 8px;left: 50%;transform: translateX(-50%);position: absolute;}
  .skydeck-booking .skydeck-booking__gallery .owl-dots .owl-dot{width: auto;}
  .skydeck-booking .skydeck-booking__gallery .owl-dots .owl-dot span{display: block;width: 4px;height: 4px;border-radius: 999px;background: #FFFFFF99;margin:0;transition: width .25s ease, background-color .25s ease, opacity .25s ease;}
  .skydeck-booking .skydeck-booking__gallery .owl-dots .owl-dot.active span{width: 16px;height: 4px;background: #fff;opacity: 1;}
  .skydeck-booking .skydeck-booking__gallery .owl-dots .owl-dot:hover span{background: #92AAB7;}
  .skydeck-booking__gallery .owl-dots{gap:4px}
  .skydeck-booking__gallery .owl-dots .owl-dot span{width:4px;height:4px}
  .skydeck-booking__gallery .owl-dots .owl-dot.active span{width:16px;height:4px}
  
}