/* ============================================
   KCARE 2025 Brand – Color Overrides
   Drop this at the bottom of zz-KAHCFKCALKSLA.css
   Primary: #FBB042  | Accent: #F04C27  | Neutral: #FFF7F0
   ============================================ */

:root {
  --kcare-primary: #FBB042;   /* Bright yellow / warm orange */
  --kcare-accent:  #F04C27;   /* Strong orange-red CTA */
  --kcare-neutral: #FFF7F0;   /* Light neutral background */
  --kcare-black:   #000000;
}

/* Base body / content surfaces */

body {
  background-color: var(--kcare-neutral);
  color: var(--kcare-black);
}

/* Headings – remove legacy blue/purple and align to KCARE */

h1,
.h1,
.PageTitle {
  color: var(--kcare-black);
}

h2,
.h2,
.PanelTitle,
.SectionTitle {
  color: var(--kcare-accent);
}

h3,
h4,
.h4,
.SectionLabel,
h5,
.h5,
.SectionLabelSmaller,
h6,
.h6 {
  color: var(--kcare-primary);
}

/* Global text links (non-nav) */

a,
a:visited,
.Link,
.Link:visited {
  color: var(--kcare-primary);
}

a:hover,
a:focus,
.Link:hover,
.Link:focus {
  color: var(--kcare-primary);
}

/* Core buttons – override Flat White purple buttons */

.btn,
.TextButton,
.RadUpload.RadUpload .ruButton,
.RadUploadProgressArea.RadUploadProgressArea .ruButton {
  background-color: var(--kcare-accent);
  border-color: var(--kcare-accent);
  color: #ffffff;
}

.btn:hover,
.btn:focus,
.btn:active,
.TextButton:hover,
.TextButton:focus,
.TextButton:active,
.RadUpload.RadUpload .ruButton:hover,
.RadUpload.RadUpload .ruButton:focus,
.RadUpload.RadUpload .ruButton:active,
.RadUploadProgressArea.RadUploadProgressArea .ruButton:hover,
.RadUploadProgressArea.RadUploadProgressArea .ruButton:focus,
.RadUploadProgressArea.RadUploadProgressArea .ruButton:active {
  background-color: #d13f20; /* slightly darker than #F04C27 */
  border-color: #d13f20;
  color: #ffffff;
}

/* Optional: secondary/soft buttons if used */

.btn.SecondaryButton,
.TextButton.SecondaryButton {
  background-color: var(--kcare-primary);
  border-color: var(--kcare-primary);
  color: #000000;
}

.btn.SecondaryButton:hover,
.btn.SecondaryButton:focus,
.TextButton.SecondaryButton:hover,
.TextButton.SecondaryButton:focus {
  background-color: #d8942f; /* darker variant of primary */
  border-color: #d8942f;
  color: #000000;
}

/* Primary navigation – move away from legacy navy/purple */

.nav-primary {
  background-color: #ffffff;
  border-bottom: 2px solid var(--kcare-primary);
}

.nav-primary .NavigationListItem > .NavigationLink {
  color: var(--kcare-black);
  border-bottom: 3px solid transparent;
}

.nav-primary .NavigationListItem > .NavigationLink:hover,
.nav-primary .NavigationListItem > .NavigationLink:focus {
  color: var(--kcare-black);
  border-bottom-color: var(--kcare-primary);
  background-color: transparent;
}

.nav-primary .NavigationListItem.Selected > .NavigationLink,
.nav-primary .NavigationListItem .NavigationLink.Selected {
  color: var(--kcare-black);
  border-bottom-color: var(--kcare-accent);
  font-weight: 600;
}

/* Utility / auxiliary nav */

.nav-auxiliary a {
  color: var(--kcare-accent);
}

.nav-auxiliary a:hover,
.nav-auxiliary a:focus {
  color: var(--kcare-primary);
}

/* Key content blocks – swap beige/grey to KCARE neutral */

.ContentBlockPrimary,
.CommunicationPreferencesSection,
.CCOGrayBg .RadMultiPage {
  background-color: var(--kcare-neutral);
}

/* Alt background utilities – re-map to brand primaries */

.AltBgColororange > .panel,
.account-banner-bg-color-orange .account-banner:before,
.account-banner-bg-color-orange .account-banner-short .banner-top-bar {
  background-color: var(--kcare-primary);
}

.AltBgColororange > .panel,
.AltBgColororange > .panel h2,
.AltBgColororange > .panel a,
.AltBgColororange > .panel a:hover,
.AltBgColororange > .panel a:focus {
  color: #000000;
}

/* Use accent orange-red for “blue” emphasize blocks (visually on-brand) */

.AltBgColorblue > .panel,
.account-banner-bg-color-blue .account-banner:before,
.account-banner-bg-color-blue .account-banner-short .banner-top-bar {
  background-color: var(--kcare-accent);
}

.AltBgColorblue > .panel,
.AltBgColorblue > .panel h2,
.AltBgColorblue > .panel a,
.AltBgColorblue > .panel a:hover,
.AltBgColorblue > .panel a:focus {
  color: #ffffff;
}

/* Generic “highlight” content blocks */

.FeatureText {
  color: var(--kcare-accent);
}

/* Footer – remove legacy blue and align with neutral/black */

#ft {
  background-color: #000000;
  color: #ffffff;
}

#ft h4 {
  color: #ffffff;
}

/* ============================================
   KCARE 2025 Brand – Typography Overrides
   Headline: Anuphan  | Body: Nunito Sans
   ============================================ */

/* Global body / UI text – Nunito Sans */
body,
input,
select,
textarea,
button {
  font-family: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
}

/* Headings & key labels – Anuphan Semibold */
h1, .h1, .PageTitle,
h2, .h2, .PanelTitle,
h3, .SectionTitle,
h4, .h4, .SectionLabel,
h5, .h5, .SectionLabelSmaller,
h6, .h6 {
  font-family: "Anuphan", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 600;
  letter-spacing: 0.01em;
}

/* Kill legacy Bevan in common “title” components */
.TitleBarCaption,
.panel-heading.Distinguish,
.account-banner .account-banner-title,
.account-banner-short .banner-top-bar-title,
.RadGrid .rgHeader,
.RadGrid th.rgHeader,
.RadGrid .rgFilterRow th {
  font-family: "Anuphan", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 600;
}

/* Navigation / small UI text – keep in Nunito Sans */
.nav-primary .NavigationListItem > .NavigationLink,
.nav-auxiliary a,
.NavigationListItem,
.NavItem,
.FooterNav a,
.breadcrumb,
label,
.RadGrid,
.RadGrid * {
  font-family: "Nunito Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}


