﻿/*
 EFS DIGITAL THEME - WEB-M1B-R3 v1.0.3
 White-led corporate theme with blue/navy structure and restrained red highlights.
*/

:root {
  --efs-blue: #004B9B;
  --efs-navy: #123A63;
  --efs-red: #E30613;
  --efs-light-blue: #F0F6FF;
  --efs-soft-gray: #F6F8FA;
  --efs-white: #FFFFFF;
  --efs-text: #1F2937;
  --efs-muted: #6B7280;
  --efs-border: #E5E7EB;
}

html { scroll-behavior: smooth; }

body {
  background: var(--efs-white) !important;
  color: var(--efs-text);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--efs-navy);
}

/* Normal light-surface text */
.color-brand-2 { color: var(--efs-navy) !important; }
.color-brand-1 { color: var(--efs-red) !important; }
.color-grey-900,
.color-grey-800,
.color-grey-700,
.color-grey-600 { color: var(--efs-text); }

a { color: var(--efs-blue); }
a:hover { color: var(--efs-red); }

/* ------------------------------------------------------------------
   CTA SYSTEM
   Old template yellow/orange buttons become BLUE, not red blocks.
   Red remains a highlight/accent.
------------------------------------------------------------------- */
.btn.btn-brand-1,
.btn.btn-brand-1-big,
.btn.btn-get-quote,
button.btn-brand-1,
button.btn-brand-1-big,
input.btn-brand-1,
input.btn-brand-1-big {
  background: var(--efs-blue) !important;
  border-color: var(--efs-blue) !important;
  color: var(--efs-white) !important;
}

.btn.btn-brand-1 *,
.btn.btn-brand-1-big *,
.btn.btn-get-quote *,
button.btn-brand-1 *,
button.btn-brand-1-big * {
  color: var(--efs-white) !important;
  fill: currentColor;
}

.btn.btn-brand-1:hover,
.btn.btn-brand-1-big:hover,
.btn.btn-get-quote:hover,
button.btn-brand-1:hover,
button.btn-brand-1-big:hover,
input.btn-brand-1:hover,
input.btn-brand-1-big:hover {
  background: var(--efs-navy) !important;
  border-color: var(--efs-navy) !important;
  color: var(--efs-white) !important;
}

.btn.btn-brand-2,
.btn.btn-brand-2-full {
  background: var(--efs-navy) !important;
  border-color: var(--efs-navy) !important;
  color: var(--efs-white) !important;
}

.btn.btn-brand-2:hover,
.btn.btn-brand-2-full:hover {
  background: var(--efs-blue) !important;
  border-color: var(--efs-blue) !important;
  color: var(--efs-white) !important;
}

/* Old yellow tag/highlight -> restrained red with readable white text */
.btn.btn-tag,
.btn.btn-border-brand-1,
.badge-warning,
.badge-orange {
  background: var(--efs-red) !important;
  border-color: var(--efs-red) !important;
  color: var(--efs-white) !important;
}

.btn.btn-tag *,
.btn.btn-border-brand-1 * {
  color: var(--efs-white) !important;
}

/* Red accent elements */
.color-brand-1,
.icon-brand-1,
.text-brand-1,
.text-accent,
.highlight,
.accent,
.section-title > span,
.section-heading > span,
.sub-title,
.subtitle {
  color: var(--efs-red) !important;
}

.swiper-pagination .swiper-pagination-bullet-active,
.swiper-pagination.swiper-pagination-2 .swiper-pagination-bullet-active {
  background: var(--efs-red) !important;
}

/* Light former-yellow areas become light blue/white-led */
.bg-1,
.top-bar-style-3 .box-bar,
.box-newsletter,
.box-cover-contactform,
.box-info-3-bottom,
.box-info-testimonial-4,
.box-button-play-2,
.mobile-search form {
  background-color: var(--efs-light-blue) !important;
}

.section-bg,
.bg-light,
.bg-grey,
.bg-gray,
.grey-bg,
.gray-bg {
  background-color: var(--efs-soft-gray);
}

/* ------------------------------------------------------------------
   DARK SURFACES
   These selectors were identified from the actual legacy template CSS.
------------------------------------------------------------------- */
.bg-brand-2,
.bg-grey-900,
.bg-3,
.footer-1,
.footer-2,
.box-info-bottom-img,
.bg-customers-say,
.box-bg-leading,
.bg-get-quote,
.banner-left,
.bg-testimonial-3,
.box-pageheader-1,
.cardLeadingCompany,
.card-plan.popular,
.pricing-style-2 .card-plan.popular,
.box-button-play,
.cardTeam .cardInfo:hover,
.cardService .cardInfo:hover,
.cardServiceStyle3:hover {
  color: var(--efs-white) !important;
}

/* Primary readable text on every identified dark surface */
.bg-brand-2 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.bg-grey-900 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.bg-3 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.footer-1 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.footer-2 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.box-info-bottom-img :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.bg-customers-say :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.box-bg-leading :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.bg-get-quote :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.banner-left :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.bg-testimonial-3 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.box-pageheader-1 :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.cardLeadingCompany :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.card-plan.popular :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.pricing-style-2 .card-plan.popular :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.box-button-play :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.cardTeam .cardInfo:hover :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.cardService .cardInfo:hover :is(h1,h2,h3,h4,h5,h6,p,li,strong,small),
.cardServiceStyle3:hover :is(h1,h2,h3,h4,h5,h6,p,li,strong,small) {
  color: var(--efs-white) !important;
}

/* Legacy text utility classes frequently caused low contrast on dark surfaces */
.bg-brand-2 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.bg-grey-900 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.bg-3 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.footer-1 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.footer-2 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.box-info-bottom-img :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.bg-customers-say :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.box-bg-leading :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.bg-get-quote :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.banner-left :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.bg-testimonial-3 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.box-pageheader-1 :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.cardLeadingCompany :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.card-plan.popular :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.pricing-style-2 .card-plan.popular :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.box-button-play :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.cardTeam .cardInfo:hover :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.cardService .cardInfo:hover :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2),
.cardServiceStyle3:hover :is(.color-grey-900,.color-grey-800,.color-grey-700,.color-grey-600,.color-brand-2) {
  color: var(--efs-white) !important;
}

/* Red highlight remains visible on dark backgrounds */
.bg-brand-2 .color-brand-1,
.bg-grey-900 .color-brand-1,
.footer-1 .color-brand-1,
.footer-2 .color-brand-1,
.box-info-bottom-img .color-brand-1,
.bg-customers-say .color-brand-1,
.box-bg-leading .color-brand-1,
.bg-get-quote .color-brand-1,
.banner-left .color-brand-1,
.bg-testimonial-3 .color-brand-1,
.box-pageheader-1 .color-brand-1,
.cardLeadingCompany .color-brand-1,
.cardServiceStyle3:hover .color-brand-1 {
  color: #FF5A63 !important;
}

/* Links on dark surfaces */
.bg-brand-2 a:not(.btn),
.bg-grey-900 a:not(.btn),
.footer-1 a:not(.btn),
.footer-2 a:not(.btn),
.box-info-bottom-img a:not(.btn),
.bg-customers-say a:not(.btn),
.box-bg-leading a:not(.btn),
.bg-get-quote a:not(.btn),
.banner-left a:not(.btn),
.bg-testimonial-3 a:not(.btn),
.box-pageheader-1 a:not(.btn),
.cardLeadingCompany a:not(.btn),
.cardServiceStyle3:hover a:not(.btn) {
  color: var(--efs-white) !important;
}

.bg-brand-2 a:not(.btn):hover,
.bg-grey-900 a:not(.btn):hover,
.footer-1 a:not(.btn):hover,
.footer-2 a:not(.btn):hover,
.box-info-bottom-img a:not(.btn):hover,
.bg-customers-say a:not(.btn):hover,
.box-bg-leading a:not(.btn):hover,
.bg-get-quote a:not(.btn):hover,
.banner-left a:not(.btn):hover,
.bg-testimonial-3 a:not(.btn):hover,
.box-pageheader-1 a:not(.btn):hover,
.cardLeadingCompany a:not(.btn):hover,
.cardServiceStyle3:hover a:not(.btn):hover {
  color: #DCEBFA !important;
}

/* SVG/icons inherit readable color unless explicitly designated as red accent */
.bg-grey-900 svg:not(.color-brand-1),
.footer-1 svg:not(.color-brand-1),
.footer-2 svg:not(.color-brand-1),
.box-info-bottom-img svg:not(.color-brand-1),
.bg-customers-say svg:not(.color-brand-1),
.bg-get-quote svg:not(.color-brand-1),
.box-pageheader-1 svg:not(.color-brand-1) {
  color: var(--efs-white) !important;
  fill: currentColor;
}

/* Header stays bright and readable */
.header,
.header-area,
.main-header,
.navbar,
.header-bottom {
  background-color: var(--efs-white);
}

.header .main-menu li a,
.navbar-nav a,
.nav-link {
  color: var(--efs-navy) !important;
}

.header .main-menu li a:hover,
.navbar-nav a:hover,
.nav-link:hover,
.header .main-menu li.active > a {
  color: var(--efs-red) !important;
}

/* Forms */
input,
select,
textarea,
.form-control {
  background: var(--efs-white) !important;
  color: var(--efs-text) !important;
  border-color: #D1D5DB !important;
}

input::placeholder,
textarea::placeholder {
  color: #7A8491 !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.thin-focus:focus {
  border-color: var(--efs-blue) !important;
  box-shadow: 0 0 0 2px rgba(0,75,155,.14) !important;
  outline: none !important;
}

/* Footer */
.footer-1 { background-color: var(--efs-navy) !important; }
.footer-2 { background-color: #0B2239 !important; }

/* Tracking page */
.bg-efsBlue { background-color: var(--efs-blue) !important; }
.text-efsBlue { color: var(--efs-blue) !important; }
.text-efsRed { color: var(--efs-red) !important; }
.efs-light-blue { background-color: var(--efs-light-blue) !important; }

/* Accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--efs-blue) !important;
  outline-offset: 2px;
}