/*
  Trang chi tiết xe cho thuê (Catalog Views/Product/RentalDetail.cshtml) - bổ sung cho bố cục .main-product của template EGA.
  .rd-specs (thông số dưới ảnh), .rd-rates (bảng giá trong promo-box) - lịch trống + form đặt xe: rental-booking.css (layout),
  .rd-table (tabs), .rd-suggest (xe tương tự), .rd-sticky-bar (thanh đặt xe mobile). 1rem = 10px.
*/
.rental-detail {
  --rd-line: #e6eaf0;
  --rd-muted: #5f6b7a;
  --rd-soft: #EEF3FB;
  --rd-free: #EEF3FB;
  --rd-free-text: #0B2D66;
  --rd-hold: #FFEFE6;
  --rd-hold-text: #D9501A;
  --rd-busy: #fde8e8;
  --rd-busy-text: #b42318;
}
.rental-detail .menu-icon, .rd-sticky-bar .menu-icon { display: block; width: 100%; height: 100%; }
.rd-gallery-empty { aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; color: var(--rd-muted); border: 1px dashed var(--rd-line); border-radius: 1.2rem; }
.rental-detail .gallery-main-img { aspect-ratio: 4 / 3; object-fit: cover; }

/* ===== Slide video trong gallery ===== */
.rd-video-slide video-review, .rd-video-slide .review-video__item { display: block; width: 100%; }
.rd-video-placeholder { background: #0B2D66; }
.rd-video-play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 7.2rem; height: 7.2rem; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(242, 101, 34, .92); color: #fff; font-size: 2.6rem;
  box-shadow: 0 0 0 1rem rgba(255, 255, 255, .25); transition: transform .2s; pointer-events: none;
}
.rd-video-slide .review-video__item:hover .rd-video-play { transform: translate(-50%, -50%) scale(1.08); }
.rd-video-play--sm { width: 2.8rem; height: 2.8rem; font-size: 1.1rem; box-shadow: none; }
.rd-video-label {
  position: absolute; left: 1.6rem; bottom: 1.6rem; padding: .5rem 1.2rem; border-radius: 99rem;
  background: rgba(11, 45, 102, .75); color: #fff; font-size: 1.3rem; font-weight: 600; pointer-events: none;
}
.rd-video-thumb img { filter: brightness(.8); }
.rd-videos { margin: 2.4rem 0 0; padding: 0 .8rem; }

/* ===== Thông số nhanh ===== */
.rd-specs { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; margin: 2rem 0 0; padding: 0 .8rem; list-style: none; }
.rd-spec { display: flex; align-items: center; gap: 1rem; padding: 1.2rem 1.4rem; border: 1px solid var(--rd-line); border-radius: 1.2rem; background: #fff; }
.rd-spec__icon { flex: 0 0 3.6rem; width: 3.6rem; height: 3.6rem; padding: .8rem; border-radius: 1rem; background: var(--rd-soft); color: var(--color-primary); }
.rd-spec__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.rd-spec__text small { color: var(--rd-muted); font-size: 1.2rem; }
.rd-spec__text b { font-size: 1.4rem; }

/* ===== Giá ===== */
.rd-price .price { color: var(--color-primary); font-weight: 800; }

/* ===== Bảng giá trong promo-box ===== */
.rd-rates { display: grid; gap: .2rem; }
.rd-rate { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 0 1rem; padding: .7rem 0; border-bottom: 1px dashed var(--rd-line); transition: opacity .2s; }
.rd-rate:last-child { border-bottom: 0; }
.rd-rate.is-muted { opacity: .4; }
.rd-rate__unit { font-size: 1.4rem; }
.rd-rate__unit small { color: var(--rd-muted); }
.rd-rate__price { display: inline-flex; align-items: baseline; gap: .6rem; }
.rd-rate__price b { color: var(--color-primary); font-size: 1.5rem; }
.rd-rate__price del { color: var(--rd-muted); font-size: 1.2rem; }
.rd-rate__note { grid-column: 1 / -1; color: var(--rd-muted); font-size: 1.2rem; }

/* ===== Tabs ===== */
.rd-table { width: 100%; border-collapse: collapse; }
.rd-table th, .rd-table td { padding: 1rem 1.2rem; border-bottom: 1px solid var(--rd-line); text-align: left; vertical-align: top; }
.rd-table tbody tr td:first-child { color: var(--rd-muted); width: 34%; }
.rd-table del { margin-left: .6rem; color: var(--rd-muted); font-size: 1.2rem; }

/* ===== Xe tương tự ===== */
.rd-suggest__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.6rem; }
.rd-suggest__head .heading { margin: 0; }

/* ===== Thanh đặt xe mobile ===== */
.rd-sticky-bar { display: none; }
@media (max-width: 1023px) {
  .rd-sticky-bar {
    position: fixed; left: 0; right: 0; bottom: var(--cro-height, 6rem); z-index: 40;
    display: flex; align-items: center; justify-content: space-between; gap: 1.2rem;
    padding: 1rem 1.6rem; background: #fff; border-top: 1px solid var(--rd-line, #e6eaf0);
    box-shadow: 0 -.6rem 1.6rem rgba(11, 45, 102, .08); transition: transform .25s, opacity .25s;
  }
  .rd-sticky-bar div { display: flex; flex-direction: column; line-height: 1.3; }
  .rd-sticky-bar small { font-size: 1.2rem; color: #5f6b7a; }
  .rd-sticky-bar b { color: var(--color-primary); font-size: 1.7rem; }
  .rd-sticky-bar .btn { padding: 1rem 2.4rem; }
  .rd-sticky-bar.is-hidden { transform: translateY(120%); opacity: 0; pointer-events: none; }
}
@media (max-width: 575px) {
  .rd-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0; }
}