/* SEYLAC COBALT OCEAN BRAND CONTRACT V1
   Primary brand: #124E96. This file is intentionally loaded last.
   Semantic success, warning, danger and chart colours remain distinct. */
:root {
  --sy-font: "Instrument Sans", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  --sy-primary: #124e96 !important;
  --sy-primary-hover: #0e427f !important;
  --sy-primary-active: #0a3568 !important;
  --sy-primary-soft: #e0ecf8 !important;
  --sy-background-soft: #f3f7fc !important;
  --sy-focus: #82adda !important;
  --sy-footer: #0a2a55 !important;
  --sy-gold: #f4b942 !important;
  --sy-mint: #2ed3b7 !important;
  --sy-ink: #071d35 !important;
  --sy-primary-strong: var(--sy-primary-active) !important;
  --sy-navy: var(--sy-primary) !important;
  --sy-navy-2: var(--sy-primary-active) !important;
  --blue: var(--sy-primary) !important;
  --blue2: var(--sy-primary-hover) !important;
  --blue-2: var(--sy-primary-hover) !important;
  --blue-3: var(--sy-focus) !important;
  --blue-dark: var(--sy-primary-hover) !important;
  --blue-strong: var(--sy-primary-hover) !important;
  --blue-soft: var(--sy-primary-soft) !important;
  --blue-pale: var(--sy-background-soft) !important;
  --soft-blue: var(--sy-background-soft) !important;
  --navy: var(--sy-primary) !important;
  --navy-2: var(--sy-primary-active) !important;
  --navy-light: var(--sy-primary-hover) !important;
  --sey-brand: var(--sy-primary) !important;
  --sey-ink: var(--sy-ink) !important;
  --shv-dark: var(--sy-primary) !important;
  --syw-brand: var(--sy-primary) !important;
  --syw-navy: var(--sy-primary) !important;
  --pcc-blue: var(--sy-primary) !important;
  --pcc-blue-2: var(--sy-primary-hover) !important;
  --pcc-navy: var(--sy-primary) !important;
  --pcc-navy-2: var(--sy-primary-active) !important;
  --ucc-blue: var(--sy-primary) !important;
  --ucc-navy: var(--sy-primary) !important;
  --legal-blue: var(--sy-primary) !important;
  --legal-blue-dark: var(--sy-primary-hover) !important;
  --legal-navy: var(--sy-primary-active) !important;
  --smart-blue: var(--sy-primary) !important;
  --smart-navy: var(--sy-primary-active) !important;
  --inv-blue: var(--sy-primary) !important;
  --inv-navy: var(--sy-primary-active) !important;
  --wps-blue: var(--sy-primary) !important;
  --wps-blue-dark: var(--sy-primary-hover) !important;
  --mac-primary: var(--sy-primary) !important;
  --seylac-web-accent: var(--sy-primary) !important;
  --seylac-web-sidebar-active-bg: var(--sy-primary-soft) !important;
  --seylac-web-sidebar-active-text: var(--sy-primary) !important;
  --seylac-primary-button-bg: var(--sy-primary) !important;
  --seylac-primary-button-text: #fff !important;
  --sy-v42-brand: var(--sy-primary) !important;
  --sy-v42-brand-hover: var(--sy-primary-hover) !important;
  --seylac-public-font: var(--sy-font) !important;
}

html body,
html body button,
html body input,
html body select,
html body textarea,
html body optgroup,
html body table {
  font-family: var(--sy-font) !important;
}

html body :is(
  .btn-primary,
  .pcc-btn.primary,
  .pcc-mini-btn,
  .sd26 .btn-primary,
  .syf-btn-primary,
  .sy-ai26-button,
  .nav-actions > .btn,
  .seylac-production-nav .nav-cta,
  .mobile-panel .mobile-cta,
  .guest-card button[type="submit"],
  .auth-submit,
  .sey-ai-send,
  .ai-ui-composer button,
  .dashboard-ai-form .btn,
  .shv-button-dark,
  .invoice-button,
  .wps-btn.primary
) {
  background: var(--sy-primary) !important;
  background-image: none !important;
  border-color: var(--sy-primary) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(18, 78, 150, .20) !important;
}

html body :is(
  .btn-primary,
  .pcc-btn.primary,
  .pcc-mini-btn,
  .sd26 .btn-primary,
  .syf-btn-primary,
  .sy-ai26-button,
  .nav-actions > .btn,
  .seylac-production-nav .nav-cta,
  .mobile-panel .mobile-cta,
  .guest-card button[type="submit"],
  .auth-submit,
  .sey-ai-send,
  .ai-ui-composer button,
  .dashboard-ai-form .btn,
  .shv-button-dark,
  .invoice-button,
  .wps-btn.primary
):hover {
  background: var(--sy-primary-hover) !important;
  border-color: var(--sy-primary-hover) !important;
}

html body :is(
  .btn-secondary,
  .btn-outline,
  .shv-button-outline,
  .sd26 .btn-secondary,
  .pcc-btn.secondary
) {
  border-color: color-mix(in srgb, var(--sy-primary) 38%, #fff) !important;
  color: var(--sy-primary) !important;
}

html body :is(
  .nav-links a[aria-current="page"],
  .mobile-panel a[aria-current="page"],
  .side-link.active,
  .side-sublink.active,
  .pcc-nav a.active,
  .sd26-tab.active,
  .legal-nav-links a[aria-current="page"]
) {
  color: var(--sy-primary) !important;
  border-color: var(--sy-primary) !important;
}

html body :is(.side-link.active, .side-sublink.active, .pcc-nav a.active) {
  background: var(--sy-primary-soft) !important;
  box-shadow: inset 4px 0 0 var(--sy-primary) !important;
}

html body :is(.side-link.active, .side-sublink.active, .pcc-nav a.active) :is(svg, .side-icon) {
  color: var(--sy-primary) !important;
}

html body :is(
  .shv-hero,
  .shv-hero-image,
  .guest-panel,
  .sy-auth-panel,
  .pcc-sidebar,
  .mp-hero,
  .features-hero,
  .solutions-hero,
  .features-cta-box,
  .solutions-cta-box,
  .cta-box,
  .ai-panel,
  .sey-ai-launcher,
  .sey-ai-widget-head,
  .dashboard-ai-intro
) {
  background-color: var(--sy-primary) !important;
  background-image: none !important;
}

html body :is(.seylac-shared-footer, .seylac-footer-modern, .seylac-footer-2026, .seylac-footer, footer.site-footer) {
  background-color: var(--sy-footer) !important;
}

html body.route-dashboard .sd26 {
  --brand: var(--sy-primary) !important;
  --teal: var(--sy-primary-hover) !important;
}

html body.route-dashboard :is(.top-action:last-of-type, .sd26-search button, .sd26-tab.active) {
  background: var(--sy-primary) !important;
  background-image: none !important;
  border-color: var(--sy-primary) !important;
  color: #fff !important;
}

html body.route-dashboard :is(.side-link:hover, .top-action:hover) {
  color: var(--sy-primary) !important;
}

html body.route-dashboard .sd26-metric.cash {
  --metric: var(--sy-primary) !important;
  --metric-soft: var(--sy-primary-soft) !important;
}

html body.route-dashboard .sd26-position-bar {
  background: linear-gradient(180deg, var(--sy-primary), var(--sy-focus)) !important;
}

html body :is(.mp-card, .feature-card, .solution-card, .card, .panel, .app-card) a:not(.btn),
html body :is(.mp-link, .text-link, .eyebrow, .features-kicker, .solutions-kicker, .link-button) {
  color: var(--sy-primary);
}

html body :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(130, 173, 218, .55) !important;
  outline-offset: 2px;
}

html body :is(.btn-danger, .danger, .is-danger, .link-danger) {
  background-image: none !important;
}

@media (max-width: 860px) {
  html body .mobile-panel .mobile-cta {
    background: var(--sy-primary) !important;
    border-color: var(--sy-primary) !important;
    color: #fff !important;
  }
}

/* The production homepage hero uses .hero.hero-fintech-reference. */
html body .hero.hero-fintech-reference {
  background: #124e96 !important;
  background-image: none !important;
}

html body .hero.hero-fintech-reference .hero-actions .btn.btn-primary,
html body .hero.hero-fintech-reference .hero-actions .btn.btn-dark {
  background: #124e96 !important;
  border-color: #124e96 !important;
  color: #fff !important;
}

html body .hero.hero-fintech-reference .hero-actions .btn.btn-light {
  background: #fff !important;
  border-color: #fff !important;
  color: #124e96 !important;
}