/* =========================================================
   SHAHMIE TRAVEL & TOURS — V19 FINAL UI FIXES
   Fokus: sidebar maroon, hero card full image, clean dots,
   checkout radius and FPX processing maroon.
   ========================================================= */
:root{
  --v19-maroon-950:#260207;
  --v19-maroon-900:#35040b;
  --v19-maroon-850:#470711;
  --v19-maroon-800:#5d0b19;
  --v19-maroon-700:#741426;
  --v19-gold:#ddb34e;
  --v19-gold-soft:#f4d87f;
  --v19-cream:#fff8ec;
  --v19-paper:#fffdf9;
  --v19-line:#ead7bf;
}

/* 1 — Panel navigation: solid dark maroon on every viewport */
body[data-layout="panel"] .sidebar,
.panel-shell > .sidebar,
.panel-shell.sidebar-open > .sidebar{
  background-color:var(--v19-maroon-900)!important;
  background-image:linear-gradient(180deg,var(--v19-maroon-950) 0%,var(--v19-maroon-900) 48%,var(--v19-maroon-800) 100%)!important;
  color:#fff!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  isolation:isolate!important;
  border-right:1px solid rgba(244,216,127,.20)!important;
}
body[data-layout="panel"] .sidebar::before,
body[data-layout="panel"] .sidebar::after{display:none!important}
body[data-layout="panel"] .sidebar-brand{
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:none!important;
}
body[data-layout="panel"] .sidebar-role{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.10)!important;
  color:#f8e8d5!important;
}
body[data-layout="panel"] .sidebar-role strong{color:var(--v19-gold-soft)!important}
body[data-layout="panel"] .sidebar-section{color:var(--v19-gold-soft)!important}
body[data-layout="panel"] .sidebar-nav a{color:#fff2e2!important}
body[data-layout="panel"] .sidebar-nav a i{color:#f1cb66!important}
body[data-layout="panel"] .sidebar-nav a:hover{
  color:#fff!important;
  background:rgba(255,255,255,.10)!important;
}
body[data-layout="panel"] .sidebar-nav a:hover i{color:#fff3c2!important}
body[data-layout="panel"] .sidebar-nav a.active{
  color:var(--v19-maroon-800)!important;
  background:linear-gradient(135deg,#fff8ec,#f8ead4)!important;
  box-shadow:inset 4px 0 0 var(--v19-gold),0 12px 28px rgba(18,0,4,.18)!important;
}
body[data-layout="panel"] .sidebar-nav a.active i{color:var(--v19-maroon-700)!important}

/* 2 — Homepage hero package card: full-bleed image inside panel */
.hero-card-preview{
  width:100%!important;
  max-width:440px!important;
  overflow:hidden!important;
  border-radius:27px!important;
  background:var(--v19-paper)!important;
}
.hero-card-top{width:100%!important}
.hero-card-image{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:250px!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:var(--v19-maroon-900)!important;
}
.hero-card-image img{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:0!important;
}
.hero-card-body{width:100%!important}
@media(min-width:1200px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(400px,440px)!important}
}

/* 3 — Keep slide navigation, remove numeric styling */
.hero-carousel .carousel-dots{
  gap:8px!important;
  padding:0!important;
  min-height:14px!important;
}
.hero-carousel .carousel-dot{
  width:10px!important;
  min-width:10px!important;
  height:10px!important;
  min-height:10px!important;
  padding:0!important;
  border-radius:999px!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  background:rgba(255,255,255,.42)!important;
  border:1px solid rgba(255,255,255,.50)!important;
  box-shadow:none!important;
}
.hero-carousel .carousel-dot.active{
  width:32px!important;
  background:linear-gradient(90deg,var(--v19-gold-soft),var(--v19-gold))!important;
  border-color:var(--v19-gold-soft)!important;
}

/* 4 — FPX summary: clean radius, no dark corner bleed */
.checkout-bg{
  background:radial-gradient(circle at 10% 5%,rgba(221,179,78,.11),transparent 25%),linear-gradient(180deg,#fffaf2,#fffdf9)!important;
}
.checkout-side{
  background:transparent!important;
  background-image:none!important;
  border-radius:0!important;
  padding:0!important;
  overflow:visible!important;
}
.checkout-summary{
  position:sticky!important;
  top:96px!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid var(--v19-line)!important;
  box-shadow:0 24px 65px rgba(53,4,11,.12)!important;
  clip-path:none!important;
  isolation:isolate!important;
}
.checkout-summary::before,.checkout-summary::after,
.checkout-side::before,.checkout-side::after{display:none!important;content:none!important}
.checkout-logo{padding-bottom:18px!important;border-bottom:1px solid var(--v19-line)!important;margin-bottom:22px!important}
.checkout-logo img{height:58px!important;max-width:190px!important;object-fit:contain!important}
.checkout-summary h3{color:var(--v19-maroon-900)!important}
.checkout-summary .info-row.highlight{
  background:linear-gradient(135deg,#fff1c9,#fff8e8)!important;
  color:var(--v19-maroon-800)!important;
  border-radius:14px!important;
}
.qr-panel{background:#fff9ef!important;border-color:var(--v19-line)!important}

/* 5 — FPX processing screen: maroon background and visible typography */
.payment-processing{
  background:
    radial-gradient(circle at 50% 35%,rgba(221,179,78,.17),transparent 28%),
    linear-gradient(145deg,rgba(38,2,7,.97),rgba(93,11,25,.96))!important;
  color:#fff!important;
  backdrop-filter:blur(9px)!important;
  -webkit-backdrop-filter:blur(9px)!important;
}
.payment-processing>div{
  width:min(92vw,520px)!important;
  padding:42px 34px!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.075)!important;
  border:1px solid rgba(244,216,127,.30)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.35)!important;
}
.payment-processing h2{
  margin:22px 0 8px!important;
  color:#fff!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:clamp(2rem,4vw,3rem)!important;
  line-height:1.1!important;
  text-shadow:0 5px 22px rgba(0,0,0,.25)!important;
}
.payment-processing p{color:#ffeecb!important;font-size:1rem!important;margin:0!important}
.payment-processing .loader-ring{
  width:66px!important;height:66px!important;
  border:6px solid rgba(255,255,255,.22)!important;
  border-top-color:var(--v19-gold-soft)!important;
  border-right-color:var(--v19-gold-soft)!important;
  box-shadow:0 0 30px rgba(221,179,78,.18)!important;
}

/* Responsive safeguards */
@media(max-width:1050px){
  body[data-layout="panel"] .sidebar{width:280px!important}
  .checkout-summary{position:static!important}
}
@media(max-width:900px){
  .hero-card-preview{display:none!important}
}
@media(max-width:560px){
  .checkout-summary{border-radius:22px!important;padding:20px!important}
  .payment-processing>div{padding:34px 22px!important;border-radius:22px!important}
  .payment-processing h2{font-size:2rem!important}
}