﻿:root {
  /* Theme tokens: change these 2 values from admin panel later */
  --theme-primary: #A9C8F4;
  --theme-accent: #8DB5EC;

  /* Derived colors */
  --theme-primary-rgb: 169, 200, 244;
  --theme-accent-rgb: 141, 181, 236;
  --theme-primary-hover: #8DB5EC;
  --theme-accent-hover: #7BA8E6;
  --theme-bg-soft: #FAFCFF;
  --theme-header-soft: #FAFCFF;
  --theme-on-accent: #1F2937;
  --theme-text: #1F2937;
}

:root,
[data-bs-theme="light"] {
  --bs-primary: var(--theme-primary);
  --bs-primary-rgb: var(--theme-primary-rgb);
  --bs-link-color: var(--theme-primary);
  --bs-link-color-rgb: var(--theme-primary-rgb);
  --bs-link-hover-color: var(--theme-primary-hover);
  --bs-focus-ring-color: rgba(var(--theme-primary-rgb), 0.25);

  /* Keep theme aligned with selected palette */
  --bs-success: var(--theme-accent);
  --bs-success-rgb: var(--theme-accent-rgb);
  --bs-warning: var(--theme-accent);
  --bs-warning-rgb: var(--theme-accent-rgb);
}

/* Optional utility classes for custom sections */
.bg-theme-soft {
  background-color: var(--theme-bg-soft) !important;
}

.text-theme-primary {
  color: var(--theme-primary) !important;
}

.text-theme-accent {
  color: var(--theme-accent) !important;
}

.border-theme-primary {
  border-color: var(--theme-primary) !important;
}

/* Override template hardcoded colors */
.bg-eef2da {
  background-color: var(--theme-header-soft) !important;
}

.default-btn {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
  color: #fff !important;
}

.default-btn:hover,
.default-btn.active {
  background-color: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
}

.default-btn.active:hover,
.default-btn.border-btn:hover {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
  color: var(--theme-on-accent) !important;
}

.page-banner-area ul li,
.page-banner-area ul li a:hover {
  color: var(--theme-accent) !important;
}

.swiper-pagination-banner .swiper-pagination-bullet-active,
.swiper-pagination-case-study .swiper-pagination-bullet-active,
.swiper-pagination-testimonial .swiper-pagination-bullet-active {
  background-color: var(--theme-accent) !important;
}

body {
  background-color: var(--theme-bg-soft);
  color: var(--theme-text);
}

.top-title,
.banner-content .top-title {
  color: var(--theme-primary) !important;
}

.top-title::before,
.banner-content .top-title::before {
  background-color: var(--theme-primary) !important;
}

.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus-visible {
  border-color: var(--theme-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--theme-primary-rgb), 0.25) !important;
}

.services-list img[src$="check.png"],
.about-list img[src$="check.png"] {
  filter: hue-rotate(185deg) saturate(45%) brightness(1.08);
}

.ti.ti-calendar-week.text-primary {
  color: var(--theme-primary) !important;
}

/* Palette background normalization for legacy green/yellow textured images */
.banner-area.bg-img {
  background-image:
    linear-gradient(180deg, rgba(250, 252, 255, 0.90) 0%, rgba(169, 200, 244, 0.36) 100%),
    url(/Main/assets/images/banner-bg.png) !important;
}

.services-area.bg-img {
  background-image:
    linear-gradient(180deg, rgba(250, 252, 255, 0.94) 0%, rgba(141, 181, 236, 0.34) 100%),
    url(/Main/assets/images/services-bg.png) !important;
}

.case-study-area.bg-img {
  background-image:
    linear-gradient(180deg, rgba(250, 252, 255, 0.94) 0%, rgba(169, 200, 244, 0.32) 100%),
    url(/Main/assets/images/case-study-bg.png) !important;
}

.oldero-information-area.bg-img {
  background-image:
    linear-gradient(180deg, rgba(250, 252, 255, 0.93) 0%, rgba(141, 181, 236, 0.30) 100%),
    url(/Main/assets/images/information-bg.jpg) !important;
}

.contact-us-area.bg-img {
  background-image:
    linear-gradient(180deg, rgba(250, 252, 255, 0.93) 0%, rgba(169, 200, 244, 0.30) 100%),
    url(/Main/assets/images/contact-us-bg.png) !important;
}

/* Remove excessive top whitespace in hero area */
.banner-area {
  padding-top: 0px !important;
}

@media only screen and (max-width: 991px) {
  .banner-area {
    padding-top: 24px !important;
  }
}

/* Logo sizing */
.navbar-brand img.main-logo,
.navbar-brand img.white-logo {
  width: auto;
  height: 90px;
  max-height: 90px;
  object-fit: contain;
}

.mobile-navbar .offcanvas-header .logo img,
.footer-single-widget .logo img {
  width: auto;
  height: 56px;
  max-height: 56px;
  object-fit: contain;
}

@media only screen and (max-width: 991px) {
  .navbar-brand img.main-logo,
  .navbar-brand img.white-logo {
    height: 52px;
    max-height: 52px;
  }
}

/* Toastr theme override */
#toast-container > .toast {
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.22);
  border-radius: 10px;
  opacity: 1;
  color: #fff;
}

#toast-container > .toast-success {
  background-color: var(--theme-primary);
  color: var(--theme-on-accent);
}

#toast-container > .toast-error {
  background-color: #dc2626;
}

#toast-container > .toast-info {
  background-color: #2563eb;
}

#toast-container > .toast-warning {
  background-color: var(--theme-accent);
  color: var(--theme-on-accent);
}

/* Final palette enforcement: remove legacy green/orange accents from UI */
a:hover,
.top-title,
.banner-content .top-title,
.navbar .navbar-nav .nav-item .nav-link.active,
.navbar .navbar-nav .nav-item .nav-link:hover,
.mobile-navbar .offcanvas-header .btn-close,
.mobile-navbar .offcanvas-body ul.mobile-menu .active > a {
  color: var(--theme-primary) !important;
}

.top-title::before,
.banner-content .top-title::before,
.subscribe-content .top-title::before {
  background-color: var(--theme-primary) !important;
}

.banner-content .banner-btn .call-us i,
.services-btn .call-us i,
.about-content-two .about-btn .call-us i {
  background-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
  border-color: var(--theme-accent) !important;
}

.banner-content .banner-btn .call-us:hover i,
.services-btn .call-us:hover i,
.about-content-two .about-btn .call-us:hover i {
  background-color: var(--theme-primary) !important;
  color: var(--theme-on-accent) !important;
  border-color: var(--theme-primary) !important;
}

.banner-content .banner-btn .call-us:hover .number,
.services-btn .call-us:hover .number,
.about-content-two .about-btn .call-us:hover .number {
  color: var(--theme-primary) !important;
}

.default-btn,
.default-btn.active,
.default-btn.border-btn:hover,
.btn-primary {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
}

.default-btn:hover,
.default-btn.active:hover,
.btn-primary:hover {
  background-color: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
}

/* Services list tuning: compact cards and visible icons */
.services-single-item {
  min-height: 92px !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

.services-single-item .icon {
  width: 64px !important;
  height: 64px !important;
  background-color: var(--theme-primary) !important;
}

.services-single-item .icon i {
  font-size: 30px !important;
  line-height: 1 !important;
  color: var(--theme-on-accent) !important;
}

.services-single-item .liquid {
  background-color: var(--theme-primary) !important;
}

.services-single-item:hover,
.services-single-item.active {
  background-color: var(--theme-primary) !important;
}

.services-single-item:hover h3,
.services-single-item:hover p,
.services-single-item:hover span,
.services-single-item.active h3,
.services-single-item.active p,
.services-single-item.active span {
  color: #ffffff !important;
}

.services-single-item:hover .icon,
.services-single-item.active .icon {
  background-color: var(--theme-on-accent) !important;
  border-color: var(--theme-on-accent) !important;
}

.services-single-item:hover .icon i,
.services-single-item.active .icon i {
  color: #ffffff !important;
}

/* Fun-fact palette alignment */
.fun-fact-single-item {
  border: 1px solid rgba(var(--theme-primary-rgb), 0.35) !important;
  background-color: rgba(250, 252, 255, 0.92) !important;
}

.fun-fact-single-item:hover {
  border-color: var(--theme-accent) !important;
  background-color: rgba(var(--theme-accent-rgb), 0.14) !important;
}

.fun-fact-single-item h2,
.fun-fact-single-item h2 .counter {
  color: var(--theme-on-accent) !important;
}

.fun-fact-single-item p {
  color: rgba(31, 41, 55, 0.82) !important;
}

.fun-fact-single-item img {
  filter: hue-rotate(185deg) saturate(55%) brightness(1.06);
}

/* Remove remaining green accents from requested elements */
.about-content .about-btn .mail-us i,
.about-content-two .about-btn .call-us i {
  background-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
}

.about-content .about-btn .mail-us:hover .mail,
.about-content-two .about-btn .call-us:hover .number,
.oldero-information-content .call i,
.oldero-information-content .call:hover span {
  color: var(--theme-primary) !important;
}

#backtotop {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
  color: var(--theme-on-accent) !important;
}

#backtotop:hover {
  background-color: var(--theme-accent) !important;
  border-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
}

.work-single-item:hover .icon {
  background-color: var(--theme-primary) !important;
}

.work-single-item .icon,
.about-content .maintaining .icon {
  border-color: rgba(var(--theme-primary-rgb), 0.35) !important;
  background-color: rgba(var(--theme-accent-rgb), 0.12) !important;
}

.work-single-item .icon img,
.about-content .maintaining .icon img {
  /* Dark blue tint for work/about icon PNGs */
  filter: brightness(0) saturate(100%) invert(36%) sepia(59%) saturate(958%) hue-rotate(185deg) brightness(93%) contrast(91%) !important;
}

.fun-fact-single-item img {
  /* Slightly stronger blue for fun-fact icon PNGs */
  filter: brightness(0) saturate(100%) invert(33%) sepia(66%) saturate(1090%) hue-rotate(191deg) brightness(95%) contrast(90%) !important;
}

/* Why-choose (Schnellhilfe) icon palette + image fit fix */
.why-choose-us-single-item .icon {
  background-color: var(--theme-primary) !important;
  border: 1px solid rgba(var(--theme-primary-rgb), 0.45) !important;
}

.why-choose-us-single-item .icon img {
  width: 56px !important;
  height: 56px !important;
  object-fit: contain !important;
  filter: brightness(0) saturate(100%) invert(18%) sepia(14%) saturate(837%) hue-rotate(179deg) brightness(95%) contrast(95%) !important;
}

/* Newsletter readability */
.newsletter-form .form-control {
  background-color: #ffffff !important;
  border: 1px solid rgba(var(--theme-primary-rgb), 0.45) !important;
  color: var(--theme-on-accent) !important;
  padding-right: 64px !important;
  box-shadow: 0 6px 18px rgba(var(--theme-primary-rgb), 0.12);
}

.newsletter-form .form-control::placeholder {
  color: rgba(31, 41, 55, 0.68) !important;
}

.newsletter-form .submit-btn {
  width: 48px !important;
  height: 48px !important;
  border-radius: 10px !important;
  border: 1px solid var(--theme-primary) !important;
  background-color: var(--theme-primary) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  right: 6px !important;
}

.newsletter-form .submit-btn img {
  width: 18px !important;
  height: 18px !important;
  filter: brightness(0) saturate(100%) invert(18%) sepia(14%) saturate(837%) hue-rotate(179deg) brightness(95%) contrast(95%) !important;
}

/* Blog section title hover/active color normalization */
.blog-single-item:hover h3,
.blog-single-item:focus h3,
.blog-single-item:active h3,
.blog-single-item:hover .blog-content h3 {
  color: var(--theme-primary) !important;
}

/* FAQ accordion button palette */
.faq-wrapper .accordion-button,
.faq-wrapper .accordion-button.collapsed {
  color: var(--theme-on-accent) !important;
}

.faq-wrapper .accordion-button:not(.collapsed) {
  color: var(--theme-on-accent) !important;
  background-color: rgba(var(--theme-primary-rgb), 0.16) !important;
}

.faq-wrapper .accordion-button:focus {
  border-color: rgba(var(--theme-primary-rgb), 0.45) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--theme-primary-rgb), 0.22) !important;
}

.faq-wrapper .accordion-button::after {
  filter: hue-rotate(185deg) saturate(55%) brightness(1.02) !important;
}

.faq-area .faq-wrapper.style-two .accordion-item {
  margin-bottom: 16px;
}

.faq-area .faq-wrapper.style-two .accordion-item:last-child {
  margin-bottom: 0;
}

/* Video button palette */
.contact-us-img .bg-color,
.contact-us-img .video-btn {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
}

.contact-us-img .video-btn i {
  color: var(--theme-on-accent) !important;
}

/* Footer newsletter heading tone */
.footer-single-widget.newsletter-form h3,
.footer-single-widget h3 {
  color: var(--theme-primary) !important;
}

.footer-single-widget h3::after,
.footer-single-widget .h3::after {
  background-color: var(--theme-primary) !important;
}

.copy-right-area {
  background-color: rgba(var(--theme-primary-rgb), 0.22) !important;
}

.copy-right-area p,
.copy-right-area p span,
.copy-right-area a {
  color: var(--theme-on-accent) !important;
}

.copy-right-area a:hover {
  color: var(--theme-primary) !important;
}

.footer-single-widget .info-list i {
  color: var(--theme-primary) !important;
}

.footer-single-widget .logo img {
  height: 82px !important;
  max-height: 82px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Hero spacing: align with reference template */
.banner-area {
  padding-top: 0 !important;
}

.banner-content {
  padding-top: 120px !important;
  padding-bottom: 90px !important;
}

.banner-img .trusted {
  background-color: rgba(31, 41, 55, 0.42) !important;
  border: 1px solid rgba(250, 252, 255, 0.45) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  backdrop-filter: blur(4px);
}

.banner-img .trusted h4,
.banner-img .trusted p {
  color: #FAFCFF !important;
}

/* Testimonials section: lock layout close to original template proportions */
#testimonialsSection .testimonial-item-wrap {
  max-width: 975px !important;
  margin-left: auto !important;
}

#testimonialsSection .testimonial-slide .swiper-wrapper {
  height: auto !important;
}

#testimonialsSection .testimonial-single-item {
  min-height: 405px;
  gap: 36px !important;
}

#testimonialsSection .testimonial-single-item > .flex-shrink-0.position-relative {
  width: 320px;
  flex: 0 0 320px;
}

#testimonialsSection .testimonial-single-item > .flex-shrink-0.position-relative > img:first-child {
  width: 320px;
  height: 325px;
  object-fit: cover;
  border-radius: 15px;
}

#testimonialsSection .testimonial-single-item p {
  font-size: 17px;
  line-height: 1.55;
}

#testimonialsSection .testimonial-pagination {
  bottom: 26px;
}

/* Case study alignment refinement (closer to original template composition) */
.case-study-single-item {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 20px !important;
}

.case-study-single-item > .d-sm-flex {
  flex: 1 1 100% !important;
}

.case-study-single-item > p {
  order: 2;
  flex: 1 1 58% !important;
  max-width: none !important;
  margin-bottom: 0 !important;
}

.case-study-single-item > .case-study-img {
  order: 3;
  flex: 0 0 220px !important;
  margin-left: auto !important;
}

.case-study-single-item .count,
.case-study-single-item-two .count {
  background-color: var(--theme-accent) !important;
  color: var(--theme-on-accent) !important;
}

.case-study-single-item:hover .count,
.case-study-single-item-two:hover .count {
  background-color: var(--theme-primary) !important;
  color: var(--theme-on-accent) !important;
}

@media only screen and (max-width: 991px) {
  .banner-area {
    padding-top: 0 !important;
  }

  .banner-content {
    padding-top: 70px !important;
    padding-bottom: 40px !important;
  }

  #testimonialsSection .testimonial-single-item {
    min-height: auto;
    gap: 20px !important;
  }

  #testimonialsSection .testimonial-single-item > .flex-shrink-0.position-relative,
  #testimonialsSection .testimonial-single-item > .flex-shrink-0.position-relative > img:first-child {
    width: 100%;
    height: 260px;
    flex-basis: 100%;
  }

  .case-study-single-item > p {
    flex-basis: 100% !important;
  }

  .case-study-single-item > .case-study-img {
    flex-basis: 100% !important;
    margin-left: 0 !important;
  }
}

/* Home case-study image sizing fix */
.case-study-single-item .case-study-img {
  width: 220px;
  flex: 0 0 220px;
}

.case-study-single-item .case-study-img .img {
  width: 220px;
  height: 140px;
  object-fit: cover;
}

@media only screen and (max-width: 767px) {
  .case-study-single-item .case-study-img,
  .case-study-single-item .case-study-img .img {
    width: 100%;
    flex-basis: 100%;
  }

  .case-study-single-item .case-study-img .img {
    height: 180px;
  }
}
