/*
 * Overrides for the scoped Bootstrap 4 stylesheet loaded on CMS pages.
 *
 * The CMS body HTML was authored against the legacy BlueAirportTransfer
 * theme which remaps Bootstrap's --primary and adds custom utility classes.
 * The scoped Bootstrap ships with the default #007bff, so we patch the
 * variables and restore browser defaults that Tailwind's preflight strips.
 */

.cms-bootstrap-scope {
  --primary: #182c66;
  --primary-text: #ffffff;
  --secondary: #f50a16;
  --secondary-text: #ffffff;
  --tertiary: #ffd107;
  --tertiary-text: #000000;
  --body-color: #585858;
  --body-bg: #fafbfe;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ── Tailwind de-reset ────────────────────────────────────────
 * Tailwind's preflight strips margins, list bullets, link colors,
 * and heading weights. Bootstrap 4 expects browser defaults.
 * ───────────────────────────────────────────────────────────── */
.cms-bootstrap-scope h1,
.cms-bootstrap-scope h2,
.cms-bootstrap-scope h3,
.cms-bootstrap-scope h4,
.cms-bootstrap-scope h5,
.cms-bootstrap-scope h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: normal;
}
.cms-bootstrap-scope h1, .cms-bootstrap-scope .h1 { font-size: 2rem; }
.cms-bootstrap-scope h2, .cms-bootstrap-scope .h2 { font-size: 1.6rem; }
.cms-bootstrap-scope h3, .cms-bootstrap-scope .h3 { font-size: 1.4rem; }
.cms-bootstrap-scope h4, .cms-bootstrap-scope .h4 { font-size: 1.25rem; }
.cms-bootstrap-scope h5, .cms-bootstrap-scope .h5 { font-size: 1.1rem; }
.cms-bootstrap-scope h6, .cms-bootstrap-scope .h6 { font-size: 1rem; }
.cms-bootstrap-scope p { margin-top: 0; margin-bottom: 1rem; }
.cms-bootstrap-scope a { color: #007bff; text-decoration: none; }
.cms-bootstrap-scope a:hover { color: #0056b3; text-decoration: underline; }
.cms-bootstrap-scope ul, .cms-bootstrap-scope ol {
  margin-top: 0;
  margin-bottom: 1rem;
  padding-left: 2rem;
}
.cms-bootstrap-scope ul { list-style: disc; }
.cms-bootstrap-scope ol { list-style: decimal; }
.cms-bootstrap-scope li { display: list-item; }
.cms-bootstrap-scope hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.cms-bootstrap-scope strong { font-weight: 700; }
.cms-bootstrap-scope img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border-style: none;
}
.cms-bootstrap-scope label { display: inline-block; margin-bottom: 0.5rem; }
.cms-bootstrap-scope button, .cms-bootstrap-scope input,
.cms-bootstrap-scope select, .cms-bootstrap-scope textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* ── Background overrides ─────────────────────────────────── */
.cms-bootstrap-scope .bg-primary {
  background-color: var(--primary) !important;
}
.cms-bootstrap-scope .bg-tertiary {
  background-color: var(--tertiary) !important;
}

/* ── Text overrides ───────────────────────────────────────── */
.cms-bootstrap-scope .text-primary {
  color: var(--primary) !important;
}
.cms-bootstrap-scope .text-primary-text {
  color: var(--primary-text) !important;
}
.cms-bootstrap-scope .text-secondary-text {
  color: var(--secondary-text) !important;
}
.cms-bootstrap-scope .text-tertiary {
  color: var(--tertiary) !important;
}
.cms-bootstrap-scope .text-dark2 {
  color: #343a40b3 !important;
}

/* ── Button overrides ─────────────────────────────────────── */
.cms-bootstrap-scope .btn {
  text-decoration: none;
}
.cms-bootstrap-scope .btn:hover {
  text-decoration: none;
}
.cms-bootstrap-scope a.btn {
  text-decoration: none;
}
.cms-bootstrap-scope .btn-primary {
  color: var(--primary-text);
  background-color: var(--primary);
  border-color: var(--primary);
}
.cms-bootstrap-scope .btn-primary:hover {
  color: var(--primary-text);
  background-color: #0f1e47;
  border-color: #0f1e47;
}
.cms-bootstrap-scope .btn-secondary {
  color: var(--secondary-text);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.cms-bootstrap-scope .btn-secondary:hover {
  color: #fff;
  background-color: #c30812;
  border-color: #c30812;
}
.cms-bootstrap-scope .btn-tertiary {
  color: var(--tertiary-text);
  background-color: var(--tertiary);
  border-color: var(--tertiary);
}

/* ── Badge overrides ──────────────────────────────────────── */
.cms-bootstrap-scope .badge-primary {
  color: var(--primary-text);
  background-color: var(--primary);
}

/* ── Width utilities (legacy) ─────────────────────────────── */
.cms-bootstrap-scope .w-20 { width: 20% !important; }
.cms-bootstrap-scope .w-30 { width: 30% !important; }

/* ── Card enhancements ────────────────────────────────────── */
.cms-bootstrap-scope .rounded-3 {
  border-radius: 0.75rem !important;
}
.cms-bootstrap-scope .card {
  border: 1px solid rgba(0, 0, 0, 0.08);
}

/* ── CTA sections from CMS content ────────────────────────── */
.cms-bootstrap-scope .updated_cta_get_instant_quote .bg-primary {
  background-color: var(--primary) !important;
}
.cms-bootstrap-scope .updated_cta_get_instant_quote .btn-light {
  color: var(--primary);
  font-weight: 700;
}

/* ── Booking steps / info cards ───────────────────────────── */
.cms-bootstrap-scope .book_for_london_airport_transfer_today {
  background-color: var(--primary);
}
.cms-bootstrap-scope .book-in-advance-container {
  background-color: var(--primary);
}

/* ── Review carousel ──────────────────────────────────────── */
.cms-bootstrap-scope .car-card {
  padding: 1rem;
}
.cms-bootstrap-scope .fleet-title {
  font-size: 1.1rem;
  font-weight: 700;
}
.cms-bootstrap-scope .fee-inclusion {
  font-weight: 600;
  color: var(--primary);
}
.cms-bootstrap-scope .fixed-height-container {
  max-height: 110px;
  min-height: 110px;
  max-width: 550px;
  padding: 10px;
  overflow: hidden;
}

/* ── Carousel control visibility (dark controls on white bg) ─ */
.cms-bootstrap-scope .carousel-control-prev-icon,
.cms-bootstrap-scope .carousel-control-next-icon {
  filter: invert(1) grayscale(100);
}

/* ── Contact page ─────────────────────────────────────────── */
.cms-bootstrap-scope .contact_list li {
  margin-bottom: 0.5rem;
}
.cms-bootstrap-scope .li {
  list-style: none;
  padding-left: 0;
}
.cms-bootstrap-scope .li li {
  margin-bottom: 0.5rem;
}
.cms-bootstrap-scope .phone_icon {
  margin-right: 0.25rem;
}
.cms-bootstrap-scope .contact-form .form-control {
  width: 100%;
}
.cms-bootstrap-scope .info-column,
.cms-bootstrap-scope .form-column {
  padding: 0 15px;
}
.cms-bootstrap-scope .inner-column {
  padding: 0;
}

/* ── Stylish CTA buttons (inline styles in CMS body) ─────── */
.cms-bootstrap-scope .stylish-button {
  padding: 15px 30px;
  font-size: 18px;
  border-radius: 8px;
  border: none;
  margin: 10px;
  transition: all 0.3s;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.cms-bootstrap-scope .stylish-button i {
  margin-right: 8px;
}
.cms-bootstrap-scope .stylish-button.call {
  background-color: #4CAF50;
  color: #fff;
}
.cms-bootstrap-scope .stylish-button.whatsapp {
  background-color: #25D366;
  color: #fff;
}
.cms-bootstrap-scope .stylish-button.get-quote {
  background-color: #023564;
  color: #fff;
}
.cms-bootstrap-scope .stylish-button:hover {
  opacity: 0.85;
  text-decoration: none;
}

/* ── Misc legacy utilities ────────────────────────────────── */
.cms-bootstrap-scope .sm-link {
  font-size: 0.85rem;
}
.cms-bootstrap-scope .rbtn {
  border-radius: 0.25rem;
  font-weight: 700;
}
.cms-bootstrap-scope .text-bold,
.cms-bootstrap-scope .font-weight-bold {
  font-weight: 700 !important;
}
.cms-bootstrap-scope .exo {
  font-family: "Exo", sans-serif;
}
.cms-bootstrap-scope .border-animated4 {
  border-bottom: 4px solid var(--primary);
}
.cms-bootstrap-scope .footer-attr-title {
  font-size: 1.2rem;
  font-weight: 600 !important;
}
.cms-bootstrap-scope .listings {
  color: blue !important;
  font-weight: 700;
}
.cms-bootstrap-scope .listings a {
  color: blue;
}

/* ── Section reset (prevent Tailwind margin on <section>) ─── */
.cms-bootstrap-scope section {
  margin: 0;
  padding: 0;
}

/* ── Divider from inline styles in CMS content ────────────── */
.cms-bootstrap-scope div[style*="height: 1px"] {
  border: 0;
  height: 1px;
  background: #182c66;
  margin: 2rem 0;
}