/* ============================================================
   HEADER v2 — Hot pink + travel-motif decoration
   Loaded conditionally based on the active header-theme.
   The "v1" / classic maroon theme is the default in style.css;
   loading this file overrides those rules with the pink theme.
   ============================================================ */

/* Slim contact strip — deeper pink for layering */
.royal-topbar {
  background: linear-gradient(90deg, #b50871 0%, #d10989 50%, #b50871 100%);
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
/* Keep the top contact strip a touch darker than the rest of the header.
   More specific + later-loaded than the --user-header override, so it wins. */
html[data-user-header] .royal-topbar {
  background: #BD589E !important;
}
.royal-topbar .rtb-link,
.royal-topbar .rtb-link:visited { color: #fff !important; }
.royal-topbar .rtb-link svg { color: rgba(255, 255, 255, 0.85) !important; }
.royal-topbar .rtb-link:hover,
.royal-topbar .rtb-link:hover svg { color: #FFE9A8 !important; }
.royal-topbar .rtb-sep { color: rgba(255, 255, 255, 0.35) !important; }
.royal-topbar .rtb-follow { color: rgba(255, 255, 255, 0.95) !important; }

/* Main bar — hot pink with subtle vertical gradient for depth */
.royal-strip {
  background: linear-gradient(180deg, #ff1aa3 0%, #f20b97 55%, #d10989 100%);
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 6px 18px -10px rgba(120, 6, 75, 0.45);
  min-height: 60px;
  padding: 2px 0;
}
body.scrolled .royal-strip { min-height: 52px; padding: 1px 0; }
.royal-strip::before { display: none; }
.royal-strip .royal-pattern { display: none; }

.rs-decor {
  display: block;
  flex: 1 1 0;
  min-width: 60px;
  align-self: stretch;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  margin: 0 12px 0 -6px;
}
/* Height fixed to one pattern tile (64px) + vertically centred — so the motif
   strip shows once instead of tiling down the taller header band. */
.rs-decor-svg {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 64px;
  display: block;
  pointer-events: none;
}
.royal-strip .rs-frame { flex: 0 1 auto; }

/* Soft radial glow behind the logo — an elliptical light halo that fades fully
   to transparent before any edge, so it never reads as a rectangular "patch".
   Gives the colourful logo enough light backing to stay crisp on the pink. */
.rs-logo-card {
  background: none;
  box-shadow: none;
  position: relative;
  min-width: 210px;
  min-height: 0;
  padding: 6px 36px;   /* trimmed so the bigger logo doesn't grow the header */
}
/* Soft feathered glow behind the logo — a blurred white pill, sized to cover the
   whole logo. The heavy blur feathers every edge, so it never reads as a patch. */
.rs-logo-card::before {
  content: "";
  display: block;
  position: absolute;
  inset: 4px 24px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 999px;
  filter: blur(20px);
  z-index: 0;
  pointer-events: none;
}
.rs-logo-card::after { display: none; }
/* Logo enlarged to 80px tall (native is 150 x 49); card padding trimmed to match,
   so the header strip height is unchanged. */
.rs-logo-img {
  height: 80px; width: auto; max-width: 100%;
  filter: none;
  position: relative;
  z-index: 1;
}

.rs-since-banner { color: #fff; filter: none; }
.rs-since-text {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #FFE9A8 !important;
  color: #FFE9A8 !important;
  animation: none !important;
  filter: none !important;
}
.rs-est { color: #FFE9A8; }
.rs-diamond { color: rgba(255, 233, 168, 0.7); }
.rs-since-flourish { color: rgba(255, 255, 255, 0.45); opacity: 0.6; filter: none; }

.rs-frame { justify-content: center; }
.rs-frame-text {
  align-items: center !important;
  text-align: center !important;
}
.rs-headline {
  font-size: clamp(20px, 2.4vw, 32px);
  margin: 0;
  text-align: center;
}
/* Headline shimmer disabled — it was a near-white sweeping band that gave the old
   gold text its foil sheen; with solid cream text it just reads as a white patch. */
.rs-headline::before { display: none !important; }

/* Headline — solid bright cream. The gold gradient sat too close in tone to the
   pink header and washed out; a solid cream + dark shadow reads cleanly. */
.rs-h-line1 {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #FFD93D !important;
  color: #FFD93D !important;
  filter: none !important;
  text-shadow: 0 2px 5px rgba(40, 5, 28, 0.9) !important;
  font-weight: 700;
  margin-right: 0 !important;   /* base CSS adds 10px — drop it, keep just a word space */
}

.rs-h-line2 em {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: #FFD93D !important;
  color: #FFD93D !important;
  filter: none !important;
  text-shadow: 0 2px 5px rgba(40, 5, 28, 0.9) !important;
  animation: none !important;
  font-weight: 700;
}
.rs-h-line2 em::before,
.rs-h-line2 em::after { display: none !important; }
.rs-h-flourish { color: #FFE9A8; opacity: 0.85; filter: drop-shadow(0 0 6px rgba(232, 198, 119, 0.6)); }

.rs-subhead {
  text-align: center !important;
  align-self: center !important;
}
/* Subhead — solid bright cream + dark shadow. A gold-foil gradient at this small
   size was unreadable on the pink header; a solid colour reads cleanly. */
.rs-sub-main {
  background: none !important;
  -webkit-text-fill-color: #FFD93D !important;
  color: #FFD93D !important;
  filter: none !important;
  text-shadow: 0 1px 3px rgba(40, 5, 28, 0.9) !important;
  animation: none !important;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.rs-medallion {
  transform: none;
  animation: none;
  filter: drop-shadow(0 3px 8px rgba(120, 6, 75, 0.25));
  width: auto;
  height: auto;
}
/* Since-2005 seal at its actual size. */
.rs-medallion .rs-seal-img,
.rs-medallion img.rs-seal-img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
}

.rs-rating {
  background: transparent;
  border: none;
  padding: 4px 8px;
  box-shadow: none;
}
.rs-rating:hover { background: rgba(255, 255, 255, 0.08); }
.rs-rating-body strong { color: #fff; text-shadow: 0 1px 2px rgba(120, 6, 75, 0.3); }
.rs-rating-body .rs-stars { color: #FFE9A8; }
.rs-rating-body small { color: rgba(255, 255, 255, 0.85); }
.rs-rating .brand-icon {
  background: #FFFDF7;
  padding: 3px;
  border-radius: 50%;
  box-sizing: content-box;
  box-shadow: 0 1px 4px rgba(120, 6, 75, 0.25);
}

.rs-dir-meta strong { color: #fff; }
.rs-dir-tag {
  color: #FFE9A8 !important;
  -webkit-text-fill-color: #FFE9A8 !important;
}
.rs-dir-frame {
  background: none;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
}
.rs-dir-frame img {
  width: 85px;
  height: auto;
  border-radius: 0;
  filter: drop-shadow(0 3px 8px rgba(120, 6, 75, 0.35));
}

/* Nav bar */
.pdf-nav {
  background: linear-gradient(180deg, #d10989 0%, #b50871 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-bottom: 1px solid rgba(120, 6, 75, 0.45);
}
.pdf-nav.shrunk {
  background: linear-gradient(180deg, rgba(165, 7, 109, 0.92) 0%, rgba(140, 5, 92, 0.92) 100%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.pdf-nav-links a {
  color: #fff;
  text-shadow: 0 1px 2px rgba(120, 6, 75, 0.35);
}
.pdf-nav-links a:hover,
.pdf-nav-links a.is-active,
.pdf-nav.shrunk .pdf-nav-links a:hover,
.pdf-nav.shrunk .pdf-nav-links a.is-active {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.16);
}
.pdf-nav-links a.enquiry-link,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link {
  background: linear-gradient(135deg, #FFE9A8, #D4A24A);
  color: #4a0631;
  border-color: rgba(255, 233, 168, 0.6);
  text-shadow: none;
}
.pdf-nav-links a.enquiry-link:hover,
.pdf-nav-links a.enquiry-link.is-active,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link:hover,
.pdf-nav.shrunk .pdf-nav-links a.enquiry-link.is-active {
  background: linear-gradient(135deg, #FFF1C2, #E8C677);
  color: #4a0631;
  border-color: #FFE9A8;
}

.pdf-submenu,
.pdf-itin-menu {
  background: linear-gradient(180deg, #b50871 0%, #8c0559 100%);
  border: 1px solid rgba(255, 233, 168, 0.40);
}
.pdf-submenu li,
.pdf-itin-menu li { border-bottom-color: rgba(255, 233, 168, 0.30); }
.pdf-submenu a,
.pdf-itin-menu a { color: #fff; }
.pdf-submenu a:hover,
.pdf-itin-menu a:hover {
  background: rgba(255, 255, 255, 0.10);
  color: #FFE9A8;
}
.pdf-itin-menu a.active,
.pdf-itin-menu a.is-active {
  color: #FFE9A8;
  border-bottom-color: #FFE9A8;
}

/* (Switcher widget CSS lives in style.css so it's always available regardless of active theme) */

/* v2 Pink uses the full-bleed video hero — same swap as royal/navy. */
html[data-header-theme="pink"] .hero { display: none !important; }
html[data-header-theme="pink"] .hero-royal { display: block !important; }

/* ============================================================
   TEXT VISIBILITY — tuned for the finalised v2 Pink palette:
   light-mauve page (#cd93bb) + light-pink footer (#ce7cb9) -> dark text;
   dark-magenta cards (#9D207B) -> white text.
   ============================================================ */

/* Section headings, eyebrows + intro text on the light page background -> dark. */
.home-eyebrow, .eyebrow,
.home-head h2, .home-head h2 em,
.section-head h2, .section-head h2 em,
.home-head p, .section-sub {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
  background: none !important;
}

/* Card content -> white, readable on the magenta cards. */
.hic-body h3, .hic-days,
.hdc-region, .hdc-overlay h3, .hdc-overlay p, .hdc-cta,
.hfc-body h3, .hfc-body p, .hfc-cap, .hfc-link,
.hs-label strong, .hs-label small,
.affil-mono, .affil-meta strong, .affil-meta small,
.vrc-body h3, .vrc-body p,
.trc-meta h3, .trc-meta small, .trc-text,
.home-why-card h3, .home-why-card p {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Footer text -> dark, readable on the light-pink footer. */
footer.site-footer,
footer.site-footer p,
footer.site-footer a,
footer.site-footer span,
footer.site-footer small,
footer.site-footer h5 {
  color: #2B1220 !important;
}

/* "View all / view more" buttons — solid dark fill + yellow label, so they
   stand out instead of blending into the pink page as faint outlines. */
.btn-ghost.dark {
  background: #2B1220 !important;
  border-color: #2B1220 !important;
  color: #FFD93D !important;
  -webkit-text-fill-color: #FFD93D !important;
}
.btn-ghost.dark:hover {
  background: #45203A !important;
  border-color: #45203A !important;
  color: #FFE066 !important;
  -webkit-text-fill-color: #FFE066 !important;
}

/* ============================================================
   BRAND COLOUR UNIFICATION
   Remap every off-brand base-theme accent (terracotta / teal /
   sage) to the v2 Pink brand palette, so no foreign colour shows
   on any page. Gold is kept — it's a brand accent.
   ============================================================ */
:root {
  --terracotta:   #9D207B;
  --terracotta-d: #7D1862;
  --teal:         #9D207B;
  --teal-soft:    #B0367E;
  --sage:         #9D207B;
  /* Cream "paper" surfaces -> brand pink (every var(--paper*) background, site-wide). */
  --paper:        #cd93bb;
  --paper-2:      #c79ab9;
  --paper-3:      #cd93bb;
  --bg-page:      #cd93bb;
  --bg-page-alt:  #cd93bb;
  --bg-card:      #9D207B;
}

/* Decorative feature sections — flatten to brand magenta, drop the
   off-brand pattern/gradient overlays. */
.cta-block,
.why-section,
.rajasthan-section,
.itin-section,
.themes-section {
  background: #9D207B !important;
}
.cta-block::before,
.cta-block::after,
.why-section::before,
.rajasthan-section::before {
  display: none !important;
}

/* Internal-page text on the light pink background — keep it dark/readable. */
.section-head h2,
.section-head h2 em,
.section-head .eyebrow,
.section-sub,
.breadcrumb,
.breadcrumb a,
.breadcrumb span {
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}

/* Itineraries page — it carries its own private --pi-* palette
   (hardcoded cream / terracotta / gold). Remap it to the brand. */
.page-itineraries,
body.page-itineraries {
  --pi-bg:      #cd93bb;
  --pi-bg-2:    #c186ad;
  --pi-ember:   #9D207B;
  --pi-ivory:   #2B1220;
  --pi-ivory-d: rgba(43, 18, 32, 0.78);
  --pi-ivory-x: rgba(43, 18, 32, 0.55);
  --pi-line:    rgba(43, 18, 32, 0.16);
  --pi-line-2:  rgba(43, 18, 32, 0.26);
}
body.page-itineraries,
.page-itineraries,
.itin-stage {
  background: #cd93bb !important;
}
/* Itinerary card body text -> white on the magenta card. */
.itin-card-title,
.itin-card-route,
.itin-soon-card h3,
.itin-soon-card h4,
.itin-soon-card p {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Filled CTA / submit buttons -> solid dark + yellow (matches the home buttons). */
.btn-cta-primary, .btn-primary, .btn-submit, .btn-search {
  background: #2B1220 !important;
  border-color: #2B1220 !important;
  color: #FFD93D !important;
  -webkit-text-fill-color: #FFD93D !important;
}
.btn-cta-primary:hover, .btn-primary:hover, .btn-submit:hover, .btn-search:hover {
  background: #45203A !important;
  border-color: #45203A !important;
}
/* Outline CTA button -> dark outline, readable on the light pink page. */
.btn-cta-secondary {
  background: transparent !important;
  border-color: #2B1220 !important;
  color: #2B1220 !important;
  -webkit-text-fill-color: #2B1220 !important;
}

/* Magenta feature sections (Why-section, CTA block, Wedding) — text stays white. */
.why-section h2, .why-section h2 em, .why-section .section-sub,
.why-section .eyebrow, .why-section p,
.why-section .stat-num, .why-section .stat-label, .why-section .counter,
.cta-block h2, .cta-block h2 em, .cta-block p,
.wedding-section h2, .wedding-section h2 em, .wedding-section p {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* ============================================================
   BRAND PALETTE — ENFORCED UNCONDITIONALLY (!important).
   v2 Pink is the finalised, only theme. These rules do NOT depend
   on the demo --user-* variables, localStorage or admin state, and
   they override inline style="" attributes in the views too.
   ============================================================ */
body { background: #cd93bb !important; }

.royal-topbar { background: #BD589E !important; }
.royal-strip,
.pdf-nav,
.pdf-nav.shrunk { background: #CD60AC !important; }
footer.site-footer { background: #ce7cb9 !important; }

/* Solid / inline-styled content sections -> brand pink. */
.about-section, .itin-section, .dest-section, .themes-section,
.fleet-section, .reviews-section, .gallery-section, .blog-section,
.article-section, .faq-section, .contact-section, .enquiry-section,
.content-block, .rajasthan-section {
  background: #cd93bb !important;
}

/* Display cards + dark CTA sections (incl. inline-styled ones) -> brand magenta. */
.home-itin-card, .home-dest-card, .home-fleet-card, .hs-card,
.affil-card, .video-review-card, .text-review-card, .home-why-card,
.dest-card, .itin-card, .vehicle-card, .loc-card, .review-card,
.blog-card, .mon-visual-card, .service-detail-card, .sidebar-widget,
.wedding-cta, .cta-block, .why-section {
  background: #9D207B !important;
}
.service-detail-card h2, .service-detail-card h3, .service-detail-card h4,
.service-detail-card p,
.sidebar-widget h2, .sidebar-widget h3, .sidebar-widget h4,
.sidebar-widget p, .sidebar-widget ul, .sidebar-widget li, .sidebar-widget a {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* ============================================================
   ENQUIRY PAGE ("Plan My Trip") — every form + sidebar surface
   on-brand magenta, with text recoloured for contrast.
   The view sets many colours via inline style="" using
   var(--ink / --ink-soft / --paper-3 / --line*); redefining
   those variables in this scope recolours them cleanly without
   touching the rest of the site.
   ============================================================ */

/* Form card + sidebar panels -> brand magenta. */
.enquiry-card,
.enquiry-section aside > div {
  background: #9D207B !important;
}

/* Scoped variable remap — inline var(--ink*/--paper-3/--line*/
   --terracotta) inside the card + panels now resolve light/readable. */
.enquiry-card,
.enquiry-section aside > div {
  --ink:        #FFFFFF;
  --ink-soft:   rgba(255, 255, 255, 0.82);
  --paper-3:    #FFFFFF;
  --line:       rgba(255, 255, 255, 0.22);
  --line-soft:  rgba(255, 255, 255, 0.18);
  --terracotta: #FFD93D;
}

/* Headings + emphasised copy -> white. */
.enquiry-card h2,
.enquiry-card h3,
.enquiry-section aside > div h3,
.enquiry-card strong,
.enquiry-section aside > div strong {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Eyebrow + heading emphasis -> brand yellow. */
.enquiry-section .eyebrow,
.enquiry-card h2 em,
.enquiry-card h3 em,
.enquiry-section aside > div h3 em {
  color: #FFD93D !important;
  -webkit-text-fill-color: #FFD93D !important;
  background: none !important;
}

/* Form labels + the required-field asterisk. */
.enquiry-card .form-field label { color: rgba(255, 255, 255, 0.92) !important; }
.enquiry-card .form-field label .req { color: #FFD93D !important; }

/* Inputs -> white field, dark text, gold focus ring. */
.enquiry-card .form-field input,
.enquiry-card .form-field textarea,
.enquiry-card .form-field select {
  background: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.5) !important;
  color: #2B1220 !important;
}
.enquiry-card .form-field input::placeholder,
.enquiry-card .form-field textarea::placeholder {
  color: #8A6A7E !important;
}
.enquiry-card .form-field input:focus,
.enquiry-card .form-field textarea:focus,
.enquiry-card .form-field select:focus {
  border-color: #FFD93D !important;
  box-shadow: 0 0 0 3px rgba(255, 217, 61, 0.3) !important;
}

/* Outline button on the magenta card (success state) -> light outline. */
.enquiry-card .btn-cta-secondary {
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
