/* ============================================
   MODERN DETAILS PAGE OVERRIDES
   ============================================ */

/* --- Panels: card style --- */
.panel.panel-default {
  border: none !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.07) !important;
  overflow: hidden;
  margin-bottom: 28px;
}
.panel-default > .panel-heading {
  background: #ffffff !important;
  border-bottom: 1px solid #f0f0f5 !important;
  color: #1a1a2e !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  padding: 18px 24px !important;
  letter-spacing: 0.2px;
}
.panel-default > .panel-heading.panel-green,
.panel-heading.panel-yellow {
  background: #fafbfd !important;
  color: #1a1a2e !important;
}
.panel-body {
  padding: 24px !important;
}

/* --- Image slider --- */
.fotorama {
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;
}

/* --- Sidebar info card --- */
.col-md-4.hidden-xs.hidden-sm {
  border: none !important;
  border-radius: 16px !important;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,0.07);
  overflow: hidden;
}
.col-md-4.hidden-xs.hidden-sm > .row {
  height: auto !important;
}
.col-md-4.hidden-xs.hidden-sm > .row > div:first-child {
  padding: 24px !important;
}

/* --- Nav tabs modern --- */
#detailTab {
  border-bottom: none !important;
  display: flex;
  gap: 4px;
  margin-bottom: 24px !important;
  flex-wrap: wrap;
}
#detailTab > li > a {
  background: #f0f2f8 !important;
  color: #555 !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 12px 22px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: all 0.25s ease !important;
  margin-right: 0 !important;
}
#detailTab > li > a:hover {
  background: #e4e8f4 !important;
  color: #1a1a2e !important;
}
#detailTab > li.active > a,
#detailTab > li.active > a:hover,
#detailTab > li.active > a:focus {
  background: #015cad !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(1,92,173,0.3) !important;
}

/* --- Header mob bar --- */
.header-mob {
  background: linear-gradient(135deg, #015cad 0%, #0074d9 100%) !important;
  padding: 16px 0 !important;
  margin-bottom: 0;
}
.mob-trip-info-head strong {
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px;
}

/* --- Tables modern --- */
table.table-bordered,
table.table {
  border: 1px solid #eef0f5 !important;
  border-radius: 12px !important;
  overflow: hidden;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
table.table-bordered td,
table.table-bordered th,
table.table td,
table.table th {
  border-color: #eef0f5 !important;
  padding: 16px 18px !important;
  vertical-align: middle !important;
  font-size: 14px !important;
}
.table > tbody > tr > th[scope="row"] {
  font-weight: 600 !important;
  color: #333 !important;
  font-size: 14px !important;
}
.table > thead > tr > th {
  background: #f8f9fc !important;
  color: #1a1a2e !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  border-bottom: 2px solid #eef0f5 !important;
}
.table > tbody > tr:hover {
  background: #f8f9fc !important;
}

/* --- Select inputs --- */
.selectx {
  border: 1px solid #dde1ea !important;
  border-radius: 8px !important;
  padding: 6px 12px !important;
  background: #fff !important;
  transition: border-color 0.2s !important;
  font-size: 15px !important;
  min-width: 65px !important;
  font-weight: 600 !important;
  height: auto !important;
  line-height: 1.5 !important;
}
.selectx:focus {
  border-color: #015cad !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(1,92,173,0.1) !important;
}

/* --- Booking button --- */
.btn-action {
  border-radius: 12px !important;
  background: linear-gradient(135deg, #015cad 0%, #0074d9 100%) !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  letter-spacing: 0.5px !important;
  transition: all 0.3s ease !important;
  border: none !important;
  box-shadow: 0 6px 20px rgba(1,92,173,0.3) !important;
  padding: 16px 24px !important;
  height: auto !important;
}
.btn-action:hover {
  background: linear-gradient(135deg, #004a8f 0%, #015cad 100%) !important;
  box-shadow: 0 8px 28px rgba(1,92,173,0.4) !important;
  transform: translateY(-2px) !important;
}

/* --- Total cost well --- */
.well.well-sm {
  background: linear-gradient(135deg, #f8f9fc 0%, #eef2ff 100%) !important;
  border: 2px solid #e0e8f8 !important;
  border-radius: 14px !important;
  padding: 20px !important;
  margin-top: 4px !important;
  margin-bottom: 14px !important;
  line-height: 1.6 !important;
}
.well.well-sm .totalCost,
.well.well-sm strong {
  font-size: 24px !important;
  color: #015cad !important;
  font-weight: 800 !important;
}

/* --- Date & departure buttons --- */
.btn-date,
.btn-departure {
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
.btn-date:hover,
.btn-departure:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(1,92,173,0.15) !important;
}
.btn-date.active,
.btn-departure.active {
  box-shadow: 0 4px 16px rgba(1,92,173,0.3) !important;
}

/* --- ph-tour panels (date/departure selectors) --- */
.ph-tour {
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,0.06) !important;
  overflow: hidden;
  margin-bottom: 20px !important;
}
.ph-tour > .panel-heading {
  background: #015cad !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 14px 20px !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: none !important;
}
.panel.panel-default.ph-tour > .panel-heading {
  background: #015cad !important;
  color: #fff !important;
}
.ph-tour > .panel-body {
  padding: 20px !important;
}

/* --- Section titles --- */
.main-title {
  font-size: 17px !important;
  font-weight: 800 !important;
  color: #1a1a2e !important;
  margin-bottom: 10px !important;
  position: relative;
}
.tiltle-line {
  height: 3px !important;
  width: 48px !important;
  background: linear-gradient(90deg, #015cad, #4a9eff) !important;
  border-radius: 3px !important;
  display: inline-block !important;
}

/* --- Inclusions / Exclusions --- */
#INCLUSIONS,
#EXCLUSIONS {
  padding: 0 !important;
}

/* Legacy list_ok kept for other pages */
ul.list_ok {
  margin: 0 !important;
  padding: 0 !important;
}
ul.list_ok li:before {
  color: #fff !important;
  font-size: 11px !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 24px !important;
  height: 24px !important;
  background: #015cad !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 24px !important;
  text-align: center !important;
}
ul.list_ok li {
  padding: 10px 0 10px 38px !important;
  line-height: 1.7 !important;
  font-size: 14px !important;
  border-bottom: 1px solid #eef0f5 !important;
  position: relative !important;
}
ul.list_ok li:last-child {
  border-bottom: none !important;
}
/* Legacy tourNotes icon */
#tourNotes .fa-angle-right {
  color: #015cad !important;
}

/* --- Form controls --- */
.form-control {
  border: 1px solid #dde1ea !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  box-shadow: none !important;
  font-size: 14px !important;
}
.form-control:focus {
  border-color: #015cad !important;
  box-shadow: 0 0 0 3px rgba(1,92,173,0.1) !important;
}

/* --- Horizontal rules --- */
hr {
  border-top: 1px solid #eef0f5 !important;
  margin: 20px 0 !important;
}

/* --- Alerts --- */
.alert-danger {
  border-radius: 10px !important;
  border: none !important;
  background: #fff0f0 !important;
  color: #c0392b !important;
}

/* --- Buttons general --- */
.btn-primary {
  background: #015cad !important;
  border-color: #015cad !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background: #004a8f !important;
  border-color: #004a8f !important;
}
.btn-danger {
  border-radius: 10px !important;
  font-weight: 600 !important;
}
.btn-danger.btn-outline {
  border: 2px solid #e74c3c !important;
  border-radius: 10px !important;
  padding: 10px !important;
  font-weight: 600 !important;
  transition: all 0.25s !important;
}
.btn-danger.btn-outline:hover {
  background: #e74c3c !important;
  color: #fff !important;
}

/* --- Price table styling --- */
.phTB5 {
  border: 1px solid #e0e4ed !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
.phTB5 td,
.phTB5 th {
  border: 1px solid #eef0f5 !important;
  padding: 10px 12px !important;
}

/* --- Price column in booking table --- */
.adultPrice,
.childPrice,
.infantPrice,
.singlePrice,
.supplePrice {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #015cad !important;
  letter-spacing: -0.3px !important;
}

/* --- Weak text (unit prices) --- */
.weak {
  display: block !important;
  color: #015cad !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  margin-bottom: 2px !important;
  letter-spacing: -0.2px !important;
}

/* --- Share buttons spacing --- */
.sharethis-inline-share-buttons {
  margin: 16px 0 !important;
}

/* --- Map box --- */
.map-box {
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-bottom: 20px;
}

/* --- Reviews --- */
.fixedtopic .table > tbody > tr > td {
  border-color: #eef0f5 !important;
  padding: 18px !important;
}
.badge {
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 5px 12px !important;
}
.writeReview {
  border-radius: 10px !important;
  font-weight: 600 !important;
  padding: 14px !important;
}

/* --- Progress bars (review scores) --- */
.progress {
  border-radius: 8px !important;
  height: 8px !important;
  background-color: #eef0f5 !important;
}
.progress-bar {
  border-radius: 8px !important;
}

/* --- Related items section --- */
.featured-back {
  background: #f8f9fc !important;
  padding: 48px 0 !important;
  margin-top: 24px;
}
.destination-title {
  font-size: 24px !important;
  font-weight: 800 !important;
  color: #1a1a2e !important;
  margin-bottom: 28px !important;
}
.imgLodBg {
  border-radius: 14px !important;
  overflow: hidden !important;
}
.overlay a {
  background: #015cad !important;
  color: #fff !important;
  padding: 12px 32px !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  transition: all 0.25s !important;
}
.overlay a:hover {
  background: #004a8f !important;
  text-decoration: none !important;
}

/* --- Marquee bar --- */
marquee {
  border-radius: 8px;
}

/* --- Tab content area --- */
.tab-content {
  padding: 0 !important;
}
.tab-content > .tab-pane {
  padding: 0 !important;
}

/* --- Description area font --- */
.panel-body .visible-lg.visible-md,
.panel-body .visible-xs.visible-sm {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #333 !important;
}

/* --- Highlight text in sidebar --- */
.mob-fs14 {
  font-size: 14px !important;
  line-height: 1.8 !important;
  color: #444 !important;
}

/* --- Print button hide --- */
@media print {
  .Noprn { display: none !important; }
}

/* --- Promotion marker --- */
.st-prom {
  background: linear-gradient(90deg, #fff9c4, #fff176) !important;
  border-radius: 6px !important;
  padding: 4px 12px !important;
  font-weight: 700 !important;
}

/* --- Tour inline title (inside content area) --- */
.tour-inline-header {
  width: 100%;
  padding: 24px 0 18px;
}
.tour-inline-title {
  font-size: 26px;
  font-weight: 800;
  color: #1a1a2e;
  margin: 0 0 10px 0;
  line-height: 1.3;
  letter-spacing: -0.2px;
}
.tour-inline-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.tour-inline-meta span {
  font-size: 13px;
  color: #777;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.tour-inline-meta i {
  color: #015cad;
  font-size: 13px;
}
@media (max-width: 767px) {
  .tour-inline-header { padding: 16px 0 12px; }
  .tour-inline-title { font-size: 20px; }
}

/* --- ShareThis buttons: small circles --- */
.st-btn {
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 4px !important;
}
.st-btn img {
  width: 16px !important;
  height: 16px !important;
}
.st-btn .st-label {
  display: none !important;
}
.st-inline-share-buttons {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
}

/* --- Mobile: slider full width, no radius --- */
@media (max-width: 991px) {
  #OVERVIEW.container {
    overflow-x: visible !important;
  }
  .tour-slider-col {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .tour-slider-col .tour-slider-wrap {
    border-radius: 0 !important;
    box-shadow: none !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}
