/* Lock Doctor — yellow theme override. Applied site-wide via a single <link> tag.
   Goal: remove dark backgrounds, add yellow accents matching the brand. Red remains the primary brand colour. */

:root,
html {
  --yellow: #f5b800;
  --yellow-dark: #d99a00;
  --yellow-soft: #fff7d6;
}

/* ── Backgrounds: any dark wrapper class → light ── */
.ld-hero,
.ld-coverage-strip,
.ld-tracker,
.ld-tracker-side,
.ld-tracker-map-wrap,
.ld-footer,
.ld-services,
.ld-process,
.ld-cta,
.ld-tagline,
.ld-auto-showcase,
.ld-banner,
.ld-strip,
.ld-stats {
  background: #ffffff !important;
}

/* Hero — light gradient + yellow accent line + left yellow bar on content */
.ld-hero {
  background: linear-gradient(135deg, #fffbe6 0%, #ffffff 60%, #fff3c4 100%) !important;
  border-top: 6px solid #f5b800 !important;
  position: relative;
}
.ld-hero::before {
  background:
    radial-gradient(circle at 85% 20%, rgba(245,184,0,.18) 0%, transparent 55%),
    radial-gradient(circle at 12% 90%, rgba(196,0,0,.05) 0%, transparent 55%) !important;
  opacity: 1 !important;
}
.ld-hero-content,
.ld-hero-inner > div:first-child {
  border-left: 6px solid #f5b800;
  padding-left: 22px;
}

/* Coverage strip — light with yellow borders */
.ld-coverage-strip {
  background: linear-gradient(180deg, #ffffff 0%, #fff7d6 100%) !important;
  border-top: 4px solid #f5b800 !important;
  border-bottom: 4px solid #f5b800 !important;
}

/* Tracker — light surfaces, map placeholder grey */
.ld-tracker {
  border-top: 4px solid #f5b800 !important;
  border-bottom: 4px solid #f5b800 !important;
}
.ld-tracker-map-wrap,
#ld-fleet-map {
  background: #e8e8ec !important;
}
.ld-tracker-side {
  background: #f5f5f7 !important;
  border-left: 6px solid #f5b800 !important;
  border-top: none !important;
}
@media (max-width: 880px) {
  .ld-tracker-side {
    border-left: none !important;
    border-top: 6px solid #f5b800 !important;
  }
}
.ld-tracker-badge {
  background: rgba(255,255,255,.95) !important;
  border: 1px solid #f5b800 !important;
  border-left: 4px solid #f5b800 !important;
}
.ld-tracker-services a {
  background: #ffffff !important;
}
.ld-tracker-services a:hover {
  background: #fff7d6 !important;
  border-left-color: #f5b800 !important;
}

/* Footer — light bg, yellow top accent, yellow underline on column headings */
.ld-footer {
  background: #f5f5f7 !important;
  border-top: 6px solid #f5b800 !important;
}
.ld-footer-col h4 {
  padding-bottom: 8px;
  border-bottom: 2px solid #f5b800;
  display: inline-block;
}

/* ── Text: anything inside formerly-dark sections must be readable on light bg ── */
.ld-hero, .ld-hero *,
.ld-coverage-strip, .ld-coverage-strip *,
.ld-tracker-side, .ld-tracker-side *,
.ld-tracker-badge, .ld-tracker-badge *,
.ld-footer, .ld-footer *,
.ld-services, .ld-services *,
.ld-process, .ld-process *,
.ld-cta, .ld-cta *,
.ld-tagline, .ld-tagline *,
.ld-auto-showcase, .ld-auto-showcase *,
.ld-banner, .ld-banner *,
.ld-stats, .ld-stats * {
  color: #1a1a1a !important;
}

/* Muted text inside those sections */
.ld-hero p.ld-lead,
.ld-tracker-side p,
.ld-footer-brand p,
.ld-footer-col a,
.ld-footer-bottom,
.ld-tracker-badge-subtitle,
.ld-hero-stat-sub,
.ld-service p,
.ld-process-step p,
.ld-cta p,
.ld-auto-showcase-sub {
  color: #6b7280 !important;
}

/* Keep red accents intact for brand-coloured words/labels */
.ld-hero h1 span,
.ld-hero h1 .ld-red,
.ld-tracker-side h3 span,
.ld-coverage-stat-num,
.ld-footer-col h4,
.ld-tracker-badge-status,
.ld-mega-title,
.ld-hero-eyebrow,
.ld-service-num,
.ld-services-eyebrow,
.ld-process-step-num,
.ld-process-eyebrow,
.ld-cta-eyebrow {
  color: #c40000 !important;
}

/* Header on auto-style pages: dark header → white */
.ld-header {
  background: #ffffff !important;
  border-bottom: 4px solid #c40000;
}
.ld-header *,
.ld-logo-text strong,
.ld-logo-text span,
.ld-nav a {
  color: #1a1a1a !important;
}
.ld-logo-text span,
.ld-nav a:hover {
  color: #c40000 !important;
}
.ld-header-call,
.ld-header-call:hover {
  background: #c40000 !important;
  color: #ffffff !important;
}
.ld-header-call * { color: #ffffff !important; }

/* Hero action buttons (Call Us / Send Enquiry) — shrink */
.ld-action-btn {
  padding: 14px 18px !important;
  font-size: 15px !important;
  gap: 12px !important;
  border-radius: 8px !important;
}
.ld-action-btn-icon {
  width: 36px !important;
  height: 36px !important;
}
.ld-action-btn-icon svg { width: 18px !important; height: 18px !important; }
.ld-action-btn-text strong { font-size: 15px !important; }
.ld-action-btn-text span { font-size: 11px !important; margin-top: 1px !important; }
.ld-action-btn-arrow { font-size: 18px !important; }

/* Buttons that were styled for dark hero — keep white on coloured bg */
.ld-btn-primary,
.ld-btn-primary:hover {
  background: #c40000 !important;
  color: #ffffff !important;
}
.ld-btn-primary * { color: #ffffff !important; }
.ld-btn-outline {
  background: transparent !important;
  color: #1a1a1a !important;
  border: 2px solid #1a1a1a !important;
}
.ld-btn-outline * { color: #1a1a1a !important; }

/* Service cards on auto-style pages have white text + dark bg — flip */
.ld-service {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
}
.ld-service:hover {
  background: #fffbe6 !important;
  border-color: #f5b800 !important;
}
.ld-service h3,
.ld-service:hover h3 { color: #1a1a1a !important; }
.ld-service p,
.ld-service:hover p { color: #6b7280 !important; }
.ld-service-arrow,
.ld-service:hover .ld-service-arrow { color: #f5b800 !important; }

/* Process steps */
.ld-process-step {
  background: #ffffff !important;
}
.ld-process-step h4 { color: #1a1a1a !important; }
.ld-process-step p { color: #6b7280 !important; }

/* CTA / tagline blocks */
.ld-cta-inner,
.ld-tagline-inner { background: transparent !important; }
.ld-cta h2,
.ld-tagline h2 { color: #1a1a1a !important; }

/* Modal */
.ld-modal { background: #ffffff !important; }
.ld-modal *,
.ld-modal-header h3,
.ld-modal-header p,
.ld-modal-close,
.ld-nearest-name { color: #1a1a1a !important; }

/* No red banner at the top of the call modal */
.ld-modal-header {
  background: #ffffff !important;
  border-bottom: 1px solid #e5e7eb !important;
  padding: 18px 24px !important;
}
.ld-modal-header h3 { font-size: 17px !important; }
.ld-modal-header p { font-size: 12px !important; }
.ld-modal-close {
  background: #f5f5f7 !important;
  color: #1a1a1a !important;
  width: 28px !important;
  height: 28px !important;
  font-size: 18px !important;
}
.ld-modal-close:hover { background: #e5e7eb !important; }

/* Smaller call buttons */
.ld-nearest-call {
  padding: 12px 18px !important;
  font-size: 16px !important;
  gap: 10px !important;
  border-radius: 8px !important;
  background: #c40000 !important;
  color: #ffffff !important;
}
.ld-nearest-call * { color: #ffffff !important; }
.ld-nearest-call svg { width: 18px !important; height: 18px !important; fill: #ffffff !important; }
.ld-nearest-call-mobile {
  background: #f5b800 !important;
  color: #1a1a1a !important;
}
.ld-nearest-call-mobile * { color: #1a1a1a !important; }
.ld-nearest-call-mobile svg { fill: #1a1a1a !important; }

/* Compact base list rows */
.ld-base-list a {
  padding: 10px 14px !important;
  font-size: 13px !important;
}
.ld-base-list-name strong { font-size: 13px !important; }
.ld-base-list-name span { font-size: 11px !important; }
.ld-base-list-phone { font-size: 13px !important; }
.ld-base-list-mobile { padding: 6px 14px !important; }

/* Auto showcase block */
.ld-auto-showcase-fig figcaption,
.ld-auto-showcase-fig figcaption strong,
.ld-auto-showcase-sub { color: #1a1a1a !important; }
.ld-auto-showcase-sub { color: #6b7280 !important; }

/* ── Mega-menu accent bar → yellow ── */
.ld-mega { border-top-color: #f5b800 !important; }

/* Service icon tiles — yellow tint to match brand */
.ld-service-icon {
  background: linear-gradient(135deg, #fffbe6, #fff3c4) !important;
}
.ld-service-icon svg { display: block; }

/* ── SEO content block (footer-area, keyword-rich) ── */
.ld-seo-block {
  background: #ffffff;
  border-top: 4px solid #f5b800;
  padding: 70px 30px 60px;
  color: #1a1a1a;
}
.ld-seo-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.ld-seo-block h2 {
  font-size: clamp(26px, 3.5vw, 36px);
  font-weight: 900;
  letter-spacing: -.8px;
  line-height: 1.15;
  margin-bottom: 32px;
  color: #1a1a1a;
  text-align: center;
}
.ld-seo-block h2 span { color: #c40000; }
.ld-seo-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px 40px;
  margin-bottom: 40px;
}
.ld-seo-grid h3 {
  font-size: 17px;
  font-weight: 900;
  margin-bottom: 10px;
  color: #1a1a1a;
  padding-bottom: 6px;
  border-bottom: 2px solid #f5b800;
  display: inline-block;
}
.ld-seo-grid p {
  font-size: 14px;
  line-height: 1.65;
  color: #6b7280;
}
.ld-seo-locations {
  border-top: 1px solid #e5e7eb;
  padding-top: 30px;
}
.ld-seo-locations h3 {
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #c40000;
  margin-bottom: 16px;
  text-align: center;
}
.ld-seo-locations ul {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 6px 16px;
}
.ld-seo-locations li a {
  display: block;
  padding: 6px 10px;
  font-size: 13px;
  color: #1a1a1a;
  text-decoration: none;
  border-radius: 4px;
  transition: all .15s;
}
.ld-seo-locations li a:hover {
  background: #fff7d6;
  color: #c40000;
}
@media (max-width: 780px) {
  .ld-seo-grid { grid-template-columns: 1fr; gap: 22px; }
  .ld-seo-block { padding: 50px 20px 40px; }
}

/* ── Forms ── */
.ld-form-head {
  background: #f5b800 !important;
  color: #1a1a1a !important;
  border-bottom: 4px solid #d99a00 !important;
}
.ld-form-head h3,
.ld-form-head p { color: #1a1a1a !important; opacity: 1 !important; }
.ld-form-btn-next {
  background: #f5b800 !important;
  color: #1a1a1a !important;
  box-shadow: 0 16px 40px rgba(245,184,0,.35) !important;
}
.ld-form-btn-next:hover { background: #d99a00 !important; color: #1a1a1a !important; }
.ld-form-progress-step.active { background: #f5b800 !important; }

/* ── Mobile slide-out menu ── */
.ld-mobile-menu {
  background: #ffffff !important;
  border-left: 6px solid #f5b800 !important;
  box-shadow: -8px 0 30px rgba(0,0,0,.2) !important;
}
.ld-mobile-menu a {
  color: #1a1a1a !important;
  border-bottom-color: rgba(0,0,0,.08) !important;
}
.ld-mobile-menu a:hover { color: #c40000 !important; }
.ld-mm-close { color: #1a1a1a !important; }
