/*
 * Degero contrast safeguards
 * Shared, late-loading overrides for text, controls and keyboard states.
 */

/* Prevent broad link rules from overriding the white homepage CTA. */
html body.page-home .dg-home-final__actions > a.dg-button--light,
html body.page-home .dg-home-final__actions > a.dg-button--light:hover {
  color: #0a2540 !important;
  background: #ffffff !important;
  text-decoration: none !important;
}

/* Knowledge hero labels need a stable surface, independent of image brightness. */
html body.page-category-kennisbank main#main-content .sb-hero__visual-card {
  color: #ffffff !important;
  background: rgba(8, 38, 64, 0.94) !important;
}

html body.page-category-kennisbank main#main-content .sb-hero__visual-note {
  color: #ffffff !important;
}

/* Small uppercase labels use the accessible Degero green on light surfaces. */
html body.page-category-kennisbank .sb-section__header .sb-section__eyebrow,
html body main#main-content.dg-references-page .dg-reference-section .sb-section__eyebrow,
html body main#main-content.dg-references-page .dg-reference-clients .sb-section__eyebrow {
  color: #08783f !important;
}

/* Appointment flow: text, component boundaries and state changes. */
html:root {
  --dg-booking-green: #147a40;
}

html body main#main-content.dg-booking-main .dg-booking-kicker {
  color: #0d6b37;
}

html body main#main-content.dg-booking-main .dg-booking-hero .dg-booking-kicker {
  color: #80dda5;
}

html body main#main-content.dg-booking-main .dg-booking-progress li {
  color: #526174;
}

html body main#main-content.dg-booking-main .dg-booking-progress li[aria-current="step"] {
  color: #0d6b37;
  font-weight: 800;
  box-shadow: inset 0 -3px 0 #0d6b37;
}

html body main#main-content.dg-booking-main .dg-booking-field input,
html body main#main-content.dg-booking-main .dg-booking-field textarea,
html body main#main-content.dg-booking-main .dg-booking-button--quiet {
  border-color: #718092;
}

html body main#main-content.dg-booking-main .dg-booking-field input:focus,
html body main#main-content.dg-booking-main .dg-booking-field textarea:focus {
  border-color: #147a40;
  outline: 3px solid #0d6b37;
  outline-offset: 2px;
  box-shadow: none;
}

html body main#main-content.dg-booking-main .dg-booking-button:focus-visible {
  outline: 3px solid #0a2540;
  outline-offset: 3px;
}

/* The unread indicator remains useful, but its small text must pass AA. */
html body .sb-chat-widget__badge {
  color: #ffffff !important;
  background: #991b1b !important;
}

/* Persistent component boundaries in the dark footer. */
html body .dg-footer-app__link {
  border-color: rgba(142, 226, 164, 0.76) !important;
}

html body .dg-footer-app__text span {
  font-size: 0.75rem !important;
  line-height: 1.35 !important;
}

html body .sb-footer__contact a {
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* Active navigation and route-card hover are also identifiable without fill alone. */
html body .sb-navbar__link--active,
html body .sb-navbar__link[aria-current="page"] {
  box-shadow: inset 0 -2px 0 #08783f;
}

html body .dg-route:hover {
  border-color: #08783f;
}

/* Generic hover states use the dark brand green, not the low-contrast bright green. */
html body .sb-btn:hover,
html body a.sb-btn:hover,
html body button.sb-btn:hover,
html body .sb-chat-cta:hover,
html body .sb-navbar__cta:hover,
html body a.sb-phone-block__phone:hover {
  color: #ffffff !important;
  background: #08783f !important;
  border-color: #08783f !important;
}

/* Two-tone focus indicator stays visible on both white and navy surfaces. */
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body textarea:focus-visible,
html body select:focus-visible,
html body summary:focus-visible,
html body [tabindex]:focus-visible {
  outline: 3px solid #ffffff !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px #0a2540 !important;
}

/* Restore interaction feedback after the high-specificity service-page lock. */
html body.page-category-diensten main#main-content.dg-diensten-page
  > section.sb-hero.sb-hero--split[data-sb-section="hero"]
  .sb-hero__actions .sb-btn--ghost:hover,
html body.page-category-diensten main#main-content.dg-diensten-page
  > section.sb-hero.sb-hero--split[data-sb-section="hero"]
  .sb-hero__actions a[href^="tel:"]:hover {
  border-color: #ffffff !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

html body main.dg-bottom-funnel-page .dg-bf-btn--primary:hover,
html body main#main.dg-bottom-funnel-page .dg-bf-btn--primary:hover {
  background: #b9f6ca !important;
  border-color: #b9f6ca !important;
}

html body main.dg-bottom-funnel-page .dg-bf-btn--secondary:hover,
html body main#main.dg-bottom-funnel-page .dg-bf-btn--secondary:hover {
  color: #082640 !important;
  background: #ffffff !important;
  border-color: #ffffff !important;
}

@media (max-width: 640px) {
  html body .sb-chat-widget__quick-replies {
    max-height: 90px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }
}