
/* =========================================================
   Kabod Community School — Executive / High-End School Theme
   Applies globally without changing PHP functionality.
   ========================================================= */
:root{
  --kcs-ink:#0b1220;
  --kcs-navy:#06142f;
  --kcs-navy-2:#0b1f49;
  --kcs-royal:#123b7a;
  --kcs-gold:#c9a24a;
  --kcs-gold-2:#f3d98b;
  --kcs-emerald:#0f6b57;
  --kcs-paper:#f7f4ec;
  --kcs-soft:#f8fafc;
  --kcs-line:rgba(15,23,42,.10);
  --kcs-shadow:0 24px 70px rgba(2,6,23,.12);
  --kcs-shadow-sm:0 10px 30px rgba(2,6,23,.10);
}

html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 0% 0%, rgba(201,162,74,.16), transparent 28rem),
    radial-gradient(circle at 100% 0%, rgba(15,107,87,.12), transparent 30rem),
    linear-gradient(135deg, #f8fafc 0%, #f4efe3 100%) !important;
  color:var(--kcs-ink);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Premium scrollbars */
*{scrollbar-width:thin; scrollbar-color:rgba(201,162,74,.75) rgba(15,23,42,.08);}
*::-webkit-scrollbar{width:10px;height:10px;}
*::-webkit-scrollbar-track{background:rgba(15,23,42,.06);border-radius:999px;}
*::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--kcs-gold),#9f7931);border-radius:999px;border:2px solid rgba(255,255,255,.55);}

/* Global cards / panels */
.bg-white, .dark\:bg-dark-800, .dark\:bg-dark-700{
  background:rgba(255,255,255,.88) !important;
  backdrop-filter:blur(16px);
}
.rounded-xl, .rounded-lg{border-radius:1.15rem !important;}
.shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl{
  box-shadow:var(--kcs-shadow-sm) !important;
}
.border, .dark\:border-dark-700, .dark\:border-dark-600{
  border-color:var(--kcs-line) !important;
}

/* Executive page header */
.sticky.top-0 .bg-white,
[data-aos="fade-down"].bg-white,
body > .flex.justify-between.items-center.bg-white,
main .bg-white:first-child{
  border:1px solid rgba(201,162,74,.20) !important;
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,250,238,.92)) !important;
  box-shadow:0 18px 50px rgba(6,20,47,.10) !important;
}
h1, h2, h3{letter-spacing:-.025em;}
h1.text-2xl, .text-2xl.font-bold{
  color:var(--kcs-navy) !important;
}

/* Sidebar: high-end school look */
.bg-primary-700, .from-primary-600, .to-secondary-600,
aside, .sidebar, [class*="sidebar"] .bg-primary-700{
  background:
    linear-gradient(180deg, rgba(6,20,47,.98) 0%, rgba(8,31,73,.98) 54%, rgba(7,50,48,.98) 100%) !important;
}
.h-full.text-white.py-5.overflow-y-auto{
  border-right:1px solid rgba(243,217,139,.18);
  box-shadow:18px 0 55px rgba(6,20,47,.20) !important;
}
.h-full.text-white.py-5.overflow-y-auto h2::after{
  content:"";
  display:block;
  width:54px;
  height:3px;
  border-radius:999px;
  margin-top:.55rem;
  background:linear-gradient(90deg,var(--kcs-gold),transparent);
}
.h-full.text-white.py-5.overflow-y-auto a{
  border-radius:0 999px 999px 0 !important;
  margin-right:.75rem;
}
.h-full.text-white.py-5.overflow-y-auto a.bg-white\/20,
.h-full.text-white.py-5.overflow-y-auto a:hover{
  background:linear-gradient(90deg, rgba(201,162,74,.24), rgba(255,255,255,.09)) !important;
  border-left-color:var(--kcs-gold) !important;
}

/* Buttons and key actions */
.bg-primary-600, .hover\:bg-primary-700:hover,
button[type="submit"], a.bg-primary-600, .bg-gradient-to-r.from-primary-500.to-primary-600{
  background:linear-gradient(135deg, var(--kcs-navy-2), var(--kcs-emerald)) !important;
  color:#fff !important;
  border:1px solid rgba(243,217,139,.28) !important;
  box-shadow:0 14px 30px rgba(6,20,47,.18) !important;
}
button[type="submit"]:hover, a.bg-primary-600:hover, .bg-primary-600:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 40px rgba(6,20,47,.24) !important;
}
.text-primary-600, .dark\:text-primary-400{color:var(--kcs-royal) !important;}
.bg-primary-100, .dark\:bg-primary-900\/30, .bg-primary-50{
  background:rgba(201,162,74,.14) !important;
}
.text-primary-800, .text-primary-700{color:var(--kcs-navy) !important;}

/* Hero gradients used on pages */
.bg-gradient-to-r.from-primary-500.to-primary-600,
.bg-gradient-to-r.from-primary-600.to-secondary-600,
.gradient-bg{
  background:
    radial-gradient(circle at 15% 20%, rgba(243,217,139,.30), transparent 22rem),
    linear-gradient(135deg, var(--kcs-navy) 0%, var(--kcs-royal) 52%, var(--kcs-emerald) 100%) !important;
}

/* Tables */
table{
  border-collapse:separate !important;
  border-spacing:0 !important;
  width:100%;
}
thead, thead tr, th{
  background:linear-gradient(135deg, var(--kcs-navy), var(--kcs-navy-2)) !important;
  color:#fff !important;
}
th{
  font-size:.72rem !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:800 !important;
}
th, td{
  padding:.78rem .9rem !important;
  border-bottom:1px solid rgba(15,23,42,.08) !important;
}
tbody tr:hover{background:rgba(201,162,74,.08) !important;}
.overflow-x-auto{
  border-radius:1.25rem;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(255,255,255,.78);
}

/* Forms */
input, select, textarea{
  border:1px solid rgba(15,23,42,.14) !important;
  background:rgba(255,255,255,.92) !important;
  color:var(--kcs-ink) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset !important;
}
input:focus, select:focus, textarea:focus{
  outline:none !important;
  border-color:rgba(201,162,74,.95) !important;
  box-shadow:0 0 0 4px rgba(201,162,74,.18) !important;
}
label{color:#334155 !important;font-weight:700 !important;}

/* Dashboard statistic cards */
.grid-dashboard > *, .quick-actions-grid > *,
[class*="grid"] > .bg-white{
  border:1px solid rgba(201,162,74,.16) !important;
}
.grid-dashboard > *:hover, .quick-actions-grid > *:hover,
[class*="grid"] > .bg-white:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 60px rgba(6,20,47,.14) !important;
}

/* Role/account pills */
.role-dropdown-container button, .role-dropdown{
  border:1px solid rgba(201,162,74,.18) !important;
}
.role-dropdown{z-index:60 !important; border-radius:1rem !important; overflow:hidden;}

/* Login premium shell */
.kcs-login-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  background:
    radial-gradient(circle at 16% 18%, rgba(243,217,139,.28), transparent 25rem),
    linear-gradient(135deg, var(--kcs-navy) 0%, var(--kcs-navy-2) 44%, #073230 100%);
}
.kcs-login-brand{
  position:relative;
  overflow:hidden;
  color:#fff;
  padding:clamp(2rem,5vw,5rem);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.kcs-login-brand::before{
  content:"";
  position:absolute;
  inset:auto -8rem -8rem auto;
  width:28rem;height:28rem;border-radius:999px;
  background:rgba(201,162,74,.16);
  filter:blur(6px);
}
.kcs-crest{
  width:4.6rem;height:4.6rem;border-radius:1.25rem;
  display:grid;place-items:center;
  background:linear-gradient(135deg, rgba(243,217,139,.95), rgba(201,162,74,.72));
  color:var(--kcs-navy);
  box-shadow:0 25px 60px rgba(0,0,0,.28);
}
.kcs-login-card{
  align-self:center;
  justify-self:center;
  width:min(92%, 31rem);
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(243,217,139,.32) !important;
  box-shadow:0 35px 90px rgba(0,0,0,.28) !important;
}
.kcs-metric{
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  border-radius:1.25rem;
  padding:1.05rem;
  backdrop-filter:blur(14px);
}

/* Small-device polish */
@media (max-width: 900px){
  .kcs-login-shell{grid-template-columns:1fr;}
  .kcs-login-brand{min-height:22rem;}
}
@media (max-width: 768px){
  body{background:#f8fafc !important;}
  .sticky.top-0 .bg-white, [data-aos="fade-down"].bg-white{
    padding:.85rem !important;
    margin-bottom:1rem !important;
  }
  h1.text-2xl, .text-2xl.font-bold{font-size:1.25rem !important;}
  .overflow-x-auto{border-radius:1rem;}
  th,td{padding:.65rem .7rem !important;}
  .kcs-login-brand{padding:1.5rem;}
  .kcs-login-card{width:calc(100% - 1.5rem);}
}

/* Print-safe */
@media print{
  body{background:white !important;}
  .shadow, .shadow-sm, .shadow-md, .shadow-lg, .shadow-xl{box-shadow:none !important;}
}

/* =========================================================
   Mobile header correction — compact executive school bars
   Fixes wrapping/thick headers on admin/teacher/parent pages.
   ========================================================= */
@media (max-width: 640px){
  main > header.bg-white,
  main > header.dark\:bg-dark-800,
  main > header.shadow-sm,
  main > header.shadow-soft{
    position:sticky;
    top:0;
    z-index:45;
    border-radius:0 0 1.05rem 1.05rem !important;
    border:1px solid rgba(201,162,74,.18) !important;
    border-top:0 !important;
    background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,249,235,.94)) !important;
    box-shadow:0 12px 34px rgba(6,20,47,.12) !important;
  }

  main > header > div.flex.items-center.justify-between,
  main > header > div.flex.justify-between.items-center{
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center !important;
    gap:.55rem !important;
    min-height:58px !important;
    padding:.55rem .75rem !important;
  }

  main > header h1,
  main > header .text-2xl.font-bold,
  main > header h1.text-2xl{
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    font-size:1.05rem !important;
    line-height:1.12 !important;
    letter-spacing:-.02em !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    color:var(--kcs-navy) !important;
  }

  main > header button.md\:hidden,
  main > header button[class*="md:hidden"]{
    width:2.15rem !important;
    height:2.15rem !important;
    padding:0 !important;
    border-radius:.8rem !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:var(--kcs-navy) !important;
    background:rgba(6,20,47,.06) !important;
    border:1px solid rgba(6,20,47,.08) !important;
  }

  main > header .flex.items-center.space-x-4,
  main > header .flex.items-center.gap-3,
  main > header .flex.items-center.gap-4{
    gap:.35rem !important;
    min-width:max-content !important;
    justify-self:end !important;
  }

  main > header .relative > button,
  main > header button.relative,
  main > header button.flex.items-center{
    padding:.25rem !important;
    min-width:2.15rem !important;
    min-height:2.15rem !important;
  }

  main > header .w-10.h-10,
  main > header .w-12.h-12{
    width:2.15rem !important;
    height:2.15rem !important;
    border-radius:999px !important;
  }

  main > header .fa-bars.text-xl,
  main > header .fa-bell.text-xl,
  main > header i.text-xl{
    font-size:1rem !important;
  }

  main > header .fa-chevron-down,
  main > header span.hidden.md\:block,
  main > header small,
  main > header .font-medium + small{
    display:none !important;
  }

  main > header .absolute.right-0.mt-2.w-80,
  main > header .absolute.right-0.mt-2.w-72{
    width:calc(100vw - 1.25rem) !important;
    right:-.35rem !important;
    max-width:22rem !important;
  }

  /* Shared component header: prevent two-line title blocks on narrow phones */
  .sticky.top-0 > .bg-white > .flex.justify-between.items-center{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    gap:.65rem !important;
    padding:.65rem !important;
  }
  .sticky.top-0 > .bg-white h1{
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    font-size:1.05rem !important;
    line-height:1.15 !important;
  }
  .sticky.top-0 > .bg-white p.text-xs{
    display:none !important;
  }
}

@media (max-width: 380px){
  main > header h1,
  main > header .text-2xl.font-bold,
  main > header h1.text-2xl{
    font-size:.98rem !important;
  }
  main > header > div.flex.items-center.justify-between,
  main > header > div.flex.justify-between.items-center{
    gap:.4rem !important;
    padding:.5rem .6rem !important;
  }
  main > header .w-10.h-10,
  main > header .w-12.h-12,
  main > header button.md\:hidden,
  main > header button[class*="md:hidden"]{
    width:2rem !important;
    height:2rem !important;
  }
}

/* =========================================================
   Final all-page mobile header fix
   Keeps mobile headers short: full page title remains inside page cards.
   ========================================================= */
.kcs-mobile-page-title{display:none;}
@media (max-width: 640px){
  main > header.kcs-mobile-header-ready,
  .sticky.top-0 > .bg-white.kcs-mobile-header-ready,
  [data-aos="fade-down"].bg-white.kcs-mobile-header-ready{
    position:sticky !important;
    top:0 !important;
    z-index:50 !important;
    margin-bottom:.9rem !important;
    border-radius:0 0 1rem 1rem !important;
    border:1px solid rgba(201,162,74,.18) !important;
    border-top:0 !important;
    background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,250,238,.96)) !important;
    box-shadow:0 12px 30px rgba(6,20,47,.11) !important;
  }

  .kcs-mobile-header-row{
    display:grid !important;
    grid-template-columns:2.2rem minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:.5rem !important;
    width:100% !important;
    min-height:54px !important;
    padding:.48rem .68rem !important;
  }

  .kcs-mobile-header-row > .kcs-original-page-title,
  .kcs-mobile-header-row > div:first-child:has(.kcs-original-page-title) .kcs-original-page-title{
    display:none !important;
  }

  .kcs-mobile-header-row .kcs-mobile-page-title{
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    color:var(--kcs-navy) !important;
    font-size:1.02rem !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:-.025em !important;
  }

  .kcs-mobile-header-row > button.md\:hidden,
  .kcs-mobile-header-row > button[class*="md:hidden"],
  .kcs-mobile-header-row > button:first-child{
    grid-column:1 !important;
    width:2.05rem !important;
    height:2.05rem !important;
    min-width:2.05rem !important;
    min-height:2.05rem !important;
    padding:0 !important;
    border-radius:.72rem !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(6,20,47,.055) !important;
    color:var(--kcs-navy) !important;
  }

  .kcs-mobile-header-row > .kcs-mobile-page-title{
    grid-column:2 !important;
  }

  .kcs-mobile-header-actions,
  .kcs-mobile-header-row > .flex:last-child{
    grid-column:3 !important;
    justify-self:end !important;
    gap:.28rem !important;
    min-width:max-content !important;
  }

  .kcs-mobile-header-actions .font-medium,
  .kcs-mobile-header-actions small,
  .kcs-mobile-header-actions span:not(.absolute),
  .kcs-mobile-header-row small,
  .kcs-mobile-header-row p.text-xs{
    display:none !important;
  }

  .kcs-mobile-header-actions .w-10.h-10,
  .kcs-mobile-header-actions .w-12.h-12,
  .kcs-mobile-header-actions img,
  .kcs-mobile-header-actions button,
  .kcs-mobile-header-row button.relative,
  .kcs-mobile-header-row .relative > button{
    width:2.05rem !important;
    height:2.05rem !important;
    min-width:2.05rem !important;
    min-height:2.05rem !important;
    padding:.2rem !important;
  }

  .kcs-mobile-header-row i.text-xl,
  .kcs-mobile-header-row .fa-bars.text-xl,
  .kcs-mobile-header-row .fa-bell.text-xl{
    font-size:.98rem !important;
  }

  .kcs-mobile-header-row .absolute.right-0.mt-2.w-80,
  .kcs-mobile-header-row .absolute.right-0.mt-2.w-72,
  .kcs-mobile-header-row .role-dropdown{
    width:calc(100vw - 1.25rem) !important;
    max-width:22rem !important;
    right:-.35rem !important;
  }
}

@media (max-width: 360px){
  .kcs-mobile-header-row{
    grid-template-columns:2rem minmax(0,1fr) auto !important;
    gap:.38rem !important;
    padding:.45rem .55rem !important;
  }
  .kcs-mobile-header-row .kcs-mobile-page-title{font-size:.95rem !important;}
}

@media (max-width: 640px){
  .kcs-mobile-header-row > .kcs-mobile-title-block{display:none !important;}
  .kcs-mobile-header-row.kcs-no-mobile-menu{
    grid-template-columns:minmax(0,1fr) auto !important;
  }
  .kcs-mobile-header-row.kcs-no-mobile-menu > .kcs-mobile-page-title{
    grid-column:1 !important;
  }
  .kcs-mobile-header-row.kcs-no-mobile-menu .kcs-mobile-header-actions,
  .kcs-mobile-header-row.kcs-no-mobile-menu > .flex:last-child{
    grid-column:2 !important;
  }
}

/* =========================================================
   Clean mobile header patch — removes duplicated mobile titles
   and keeps desktop headers original.
   ========================================================= */
.kcs-mobile-page-title{display:none !important;}
.kcs-clean-header h1{display:block !important;}

@media (min-width: 641px){
  .kcs-clean-header-row{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
  }
  .kcs-clean-header h1{
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
  }
}

@media (max-width: 640px){
  main > header.kcs-clean-header,
  .sticky.top-0 > .bg-white.kcs-clean-header,
  [data-aos="fade-down"].bg-white.kcs-clean-header{
    position:sticky !important;
    top:0 !important;
    z-index:55 !important;
    margin-bottom:.85rem !important;
    border-radius:0 0 1rem 1rem !important;
    border:1px solid rgba(201,162,74,.18) !important;
    border-top:0 !important;
    background:linear-gradient(135deg, rgba(255,255,255,.985), rgba(255,250,238,.96)) !important;
    box-shadow:0 12px 30px rgba(6,20,47,.10) !important;
  }

  .kcs-clean-header-row{
    display:grid !important;
    grid-template-columns:2.15rem minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:.48rem !important;
    width:100% !important;
    min-height:54px !important;
    padding:.48rem .65rem !important;
  }

  .kcs-clean-header-row > button.md\:hidden,
  .kcs-clean-header-row > button[class*="md:hidden"],
  .kcs-clean-header-row > button:first-child{
    grid-column:1 !important;
    width:2.05rem !important;
    height:2.05rem !important;
    min-width:2.05rem !important;
    min-height:2.05rem !important;
    padding:0 !important;
    border-radius:.72rem !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:rgba(6,20,47,.055) !important;
    color:var(--kcs-navy) !important;
    border:1px solid rgba(6,20,47,.08) !important;
  }

  .kcs-clean-header h1{
    grid-column:2 !important;
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    color:var(--kcs-navy) !important;
    font-size:1.02rem !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:-.025em !important;
  }

  .kcs-clean-header-actions,
  .kcs-clean-header-row > .flex:last-child{
    grid-column:3 !important;
    justify-self:end !important;
    display:flex !important;
    align-items:center !important;
    gap:.28rem !important;
    min-width:max-content !important;
  }

  .kcs-clean-header-actions .font-medium,
  .kcs-clean-header-actions small,
  .kcs-clean-header-actions span:not(.absolute),
  .kcs-clean-header-row small,
  .kcs-clean-header-row p.text-xs,
  .kcs-clean-header-row .fa-chevron-down{
    display:none !important;
  }

  .kcs-clean-header-actions .w-10.h-10,
  .kcs-clean-header-actions .w-12.h-12,
  .kcs-clean-header-actions img,
  .kcs-clean-header-actions button,
  .kcs-clean-header-row button.relative,
  .kcs-clean-header-row .relative > button{
    width:2.05rem !important;
    height:2.05rem !important;
    min-width:2.05rem !important;
    min-height:2.05rem !important;
    padding:.2rem !important;
  }

  .kcs-clean-header-row i.text-xl,
  .kcs-clean-header-row .fa-bars.text-xl,
  .kcs-clean-header-row .fa-bell.text-xl{
    font-size:.98rem !important;
  }

  .kcs-clean-header-row .absolute.right-0.mt-2.w-80,
  .kcs-clean-header-row .absolute.right-0.mt-2.w-72,
  .kcs-clean-header-row .role-dropdown{
    width:calc(100vw - 1.25rem) !important;
    max-width:22rem !important;
    right:-.35rem !important;
  }
}

@media (max-width: 360px){
  .kcs-clean-header-row{
    grid-template-columns:2rem minmax(0,1fr) auto !important;
    gap:.38rem !important;
    padding:.45rem .55rem !important;
  }
  .kcs-clean-header h1{font-size:.95rem !important;}
}

/* =========================================================
   Readability correction for premium gradient hero cards
   Keeps dark navy text out of dark blue/green panels.
   ========================================================= */
.bg-gradient-to-r.from-primary-500.to-primary-600 h1,
.bg-gradient-to-r.from-primary-500.to-primary-600 h2,
.bg-gradient-to-r.from-primary-500.to-primary-600 h3,
.bg-gradient-to-r.from-primary-500.to-primary-600 .text-2xl,
.bg-gradient-to-r.from-primary-500.to-primary-600 .font-bold,
.bg-gradient-to-r.from-primary-600.to-secondary-600 h1,
.bg-gradient-to-r.from-primary-600.to-secondary-600 h2,
.bg-gradient-to-r.from-primary-600.to-secondary-600 h3,
.bg-gradient-to-r.from-primary-600.to-secondary-600 .text-2xl,
.bg-gradient-to-r.from-primary-600.to-secondary-600 .font-bold,
.gradient-bg h1,
.gradient-bg h2,
.gradient-bg h3,
.gradient-bg .text-2xl,
.gradient-bg .font-bold{
  color:#ffffff !important;
  text-shadow:0 2px 12px rgba(2,6,23,.30) !important;
}

.bg-gradient-to-r.from-primary-500.to-primary-600 p,
.bg-gradient-to-r.from-primary-500.to-primary-600 span,
.bg-gradient-to-r.from-primary-600.to-secondary-600 p,
.bg-gradient-to-r.from-primary-600.to-secondary-600 span,
.gradient-bg p,
.gradient-bg span{
  color:rgba(255,255,255,.90) !important;
}

.bg-gradient-to-r.from-primary-500.to-primary-600 a,
.bg-gradient-to-r.from-primary-600.to-secondary-600 a,
.gradient-bg a{
  color:#ffffff !important;
}

.bg-gradient-to-r.from-primary-500.to-primary-600 a.bg-white,
.bg-gradient-to-r.from-primary-600.to-secondary-600 a.bg-white,
.gradient-bg a.bg-white,
.bg-gradient-to-r.from-primary-500.to-primary-600 button.bg-white,
.bg-gradient-to-r.from-primary-600.to-secondary-600 button.bg-white,
.gradient-bg button.bg-white{
  color:var(--kcs-navy) !important;
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.55) !important;
}

@media (max-width:640px){
  .bg-gradient-to-r.from-primary-500.to-primary-600,
  .bg-gradient-to-r.from-primary-600.to-secondary-600,
  .gradient-bg{
    background:
      radial-gradient(circle at 15% 12%, rgba(243,217,139,.22), transparent 14rem),
      linear-gradient(135deg, #071936 0%, #0b3c6f 48%, #0d6755 100%) !important;
  }
}
