/* v3.11.36 — Safar Make V3 layout regression fixes only.
   Scoped to Safar. No other theme is affected. */

/* 1. Keep the selected "Choose Your Blessed Journey" card text crisp.
   The card already has a strong selected border/shadow, so the extra 3D scale/rotate
   is unnecessary and can rasterize text on Chromium/WebKit. */
.public-site[data-theme="safar_make_v3"] [data-safar-selected-package-card="1"]{
  transform:translateY(-3px)!important;
  transform-style:flat!important;
  backface-visibility:visible!important;
  will-change:auto!important;
  rotate:0deg!important;
  scale:1!important;
  filter:none!important;
}
.public-site[data-theme="safar_make_v3"].safar-fx-package_tilt [data-safar-selected-package-card="1"]{
  rotate:0deg!important;
}
.public-site[data-theme="safar_make_v3"].safar-fx-gpu_safe_motion [data-safar-selected-package-card="1"]{
  transform-style:flat!important;
  backface-visibility:visible!important;
  will-change:auto!important;
}

/* 2. The capsule shell was reduced but the Safar header itself still retained the
   reference 80px desktop height, creating a visible empty strip at the bottom. */
.public-site[data-theme="safar_make_v3"][data-premium-capsule-header="1"] > header.safar-v3-site-header.site-header-capsule{
  height:var(--capsule-height,58px)!important;
  min-height:var(--capsule-height,58px)!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
.public-site[data-theme="safar_make_v3"][data-premium-capsule-header="1"] > header.safar-v3-site-header.site-header-capsule .safar-v3-header-shell{
  height:var(--capsule-height,58px)!important;
  min-height:var(--capsule-height,58px)!important;
  align-items:center!important;
}

/* 3. Journey: selected detail card belongs on the left and the step list on the right.
   The injected progress bar is moved into the step-list column by JS so it no longer
   becomes a third grid item and pushes the selected card to a second row. */
@media(min-width:768px){
  .public-site[data-theme="safar_make_v3"] #journey .safar-v3-journey-stable-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)!important;
    align-items:start!important;
  }
  .public-site[data-theme="safar_make_v3"] #journey .safar-v3-journey-selected-panel{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .public-site[data-theme="safar_make_v3"] #journey .safar-v3-journey-step-list{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
  }
}
.public-site[data-theme="safar_make_v3"] #journey .safar-v3-journey-step-list > .safar-app-journey-progress{
  margin:0 0 18px!important;
}

/* 4. Keep the testimonials archive CTA visually inside the Safar testimonial section
   instead of letting it sit below the section boundary. */
.public-site[data-theme="safar_make_v3"] .cms-section-frame[data-variant="safar-make-v3-testimonials"]{
  background:#050D1A!important;
}
.public-site[data-theme="safar_make_v3"] .cms-section-frame[data-variant="safar-make-v3-testimonials"] > .testimonial-archive-cta{
  margin-top:-64px!important;
  padding:0 18px 16px!important;
  background:transparent!important;
  position:relative!important;
  z-index:6!important;
}

/* 5. The app-style segmented treatment changes the package tabs to max-content width.
   Re-center the Hajj / Umrah / Holidays control without affecting other Safar controls. */
.public-site[data-theme="safar_make_v3"] .safar-v3-package-tabs-centered{
  margin-left:auto!important;
  margin-right:auto!important;
  justify-content:center!important;
}

@media(max-width:767px){
  .public-site[data-theme="safar_make_v3"] .cms-section-frame[data-variant="safar-make-v3-testimonials"] > .testimonial-archive-cta{
    margin-top:-52px!important;
    padding-bottom:18px!important;
  }
}