/* MIN 2 Kotabaru palette, v4.0.3. Public presentation and sign-in only. */
:root {
  --min2-white: #ffffff;
  --min2-off-white: #f9f9f9;
  --min2-red: #e6082b;
  --min2-black: #090909;
  --min2-dark: #100707;
  --min2-gray: #eeeeee;
  --ink: var(--min2-black);
  --muted: var(--min2-black);
  --green: var(--min2-red);
  --green-dark: var(--min2-dark);
  --gold: var(--min2-red);
  --cream: var(--min2-off-white);
  --line: var(--min2-gray);
  --surface: var(--min2-gray);
  --gsr-red: var(--min2-red);
  --sy-blue: var(--min2-red);
  --sy-blue-dark: var(--min2-dark);
}

body:not(.login):not(.sy-workspace) {
  background: var(--min2-off-white);
  color: var(--min2-black);
}
::selection { background: var(--min2-red); color: var(--min2-white); }
:focus-visible { outline: 3px solid var(--min2-red); outline-offset: 4px; }

/* White header gives the official logo a continuous, spacious background. */
.site-header { background: var(--min2-white); border-bottom: 1px solid var(--min2-gray); }
.site-header .header-row { background: var(--min2-white); min-height: 82px; }
.site-header .brand-school,
.site-header .site-nav > ul > li > a { color: var(--min2-black); }
.site-header .site-nav a:hover,
.site-header .site-nav .current-menu-item > a { color: var(--min2-red); }
.site-header .search-toggle,
.site-header .menu-toggle { color: var(--min2-black); }
.site-header .search-toggle:hover,
.site-header .search-toggle[aria-expanded="true"],
.site-header .menu-toggle:hover { background: var(--min2-gray); color: var(--min2-red); }
.site-header .account-link {
  background: var(--min2-white);
  border: 1px solid var(--min2-red);
  color: var(--min2-red);
}
.site-header .account-link:hover { background: var(--min2-red); color: var(--min2-white); }
.site-header .min2-full-logo-link { background: var(--min2-white); }
.site-header .min2-full-logo-link:focus-visible { outline-color: var(--min2-red); }
.site-header .header-search { background: var(--min2-white); border-color: var(--min2-gray); }
.site-header .header-search label,
.site-header .header-search input { color: var(--min2-black); }
.site-header .header-search button { background: var(--min2-red); color: var(--min2-white); }

@media (min-width: 1181px) {
  .site-header .header-row {
    display: grid;
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr) auto;
    gap: 18px;
    padding: 12px 24px;
  }
  .site-header .site-identity-full { width: 100%; }
  .site-header .site-nav { margin-left: 0; }
  .site-header .site-nav > ul { gap: 14px; }
  .site-header .site-nav > ul > li > a { font-size: 18px; min-height: 44px; }
  .site-header .header-actions { margin-left: 0; }
  .site-header .header-search { grid-column: 1 / -1; }
}
@media (max-width: 1180px) {
  .site-header .site-nav { background: var(--min2-white); border-top: 1px solid var(--min2-gray) !important; }
  .site-header .site-nav a { color: var(--min2-black) !important; }
  .site-header .site-nav a:hover,
  .site-header .site-nav .current-menu-item > a { color: var(--min2-red) !important; }
}

/* Photographs keep their natural colors; red is reserved for emphasis. */
.gsr-home { background: var(--min2-white); color: var(--min2-black); }
.gsr-slide, .gsr-picture { background: var(--min2-gray); }
.gsr-slide:after, .gsr-picture:after { background: none; }
.gsr-slide:before {
  inset: 48% 0 0;
  background: linear-gradient(0deg, #ffffffed, #ffffff66 58%, transparent);
}
.gsr-slide figcaption { color: var(--min2-black); }
.gsr-slide figcaption i { color: var(--min2-red); }
.gsr-arrow { background: var(--min2-white); color: var(--min2-black); }
.gsr-dots button:before { background: var(--min2-gray); border: 1px solid var(--min2-black); }
.gsr-dots button[aria-current="true"]:before { background: var(--min2-red); border-color: var(--min2-red); }
.gsr-intro p, .gsr-feature-copy p, .gsr-stories p, .gsr-faq p { color: var(--min2-black); }
.gsr-home em { color: var(--min2-red); }
.gsr-mission { background: var(--min2-red); color: var(--min2-white); }
.gsr-mission h2, .gsr-mission p, .gsr-mission em { color: var(--min2-white); }
.gsr-values { background: var(--min2-dark); color: var(--min2-off-white); }
.gsr-values h2, .gsr-values h3, .gsr-values p { color: var(--min2-off-white); }
.gsr-values :focus-visible { outline-color: var(--min2-white); }
.gsr-home .gsr-faq h2 { color: var(--min2-black); }
.gsr-faq details, .gsr-more { border-color: var(--min2-gray); }
.gsr-faq summary:after { color: var(--min2-red); }
.gsr-faq details a { color: var(--min2-red); }
.gsr-button, body:not(.login) .button, .directory-tools button {
  background: var(--min2-white);
  border-color: var(--min2-red);
  color: var(--min2-red) !important;
}
.gsr-button:hover, body:not(.login) .button:hover, .directory-tools button:hover {
  background: var(--min2-red);
  color: var(--min2-white) !important;
}

/* Information and learning material retain black body text on light surfaces. */
.article, .entry-content { color: var(--min2-black); }
.article p, .entry-content p, .post-card p { color: var(--min2-black); }
.article h1, .article h2, .article h3,
.post-card h3 a, .card h2, .card h3 { color: var(--min2-black); }
.article blockquote, .notice-strip, .notice,
.min-form-message, .min-note { background: var(--min2-gray); color: var(--min2-black); }
.article blockquote, .notice, .min-form-message, .min-note { border-left-color: var(--min2-red); }
.article th, .entry-content th { background: var(--min2-gray); color: var(--min2-black); }
.article td, .entry-content td { background: var(--min2-white); color: var(--min2-black); }
/* Earlier information pages include these explicit inline brand colors. */
.entry-content [style*="background:#f5f5f7"] { background: var(--min2-gray) !important; }
.entry-content [style*="color:#1d1d1f"],
.entry-content [style*="color:#6e6e73"] { color: var(--min2-black) !important; }
.entry-content a[style*="border:1px solid #d2d2d7"] {
  background: var(--min2-white) !important;
  border-color: var(--min2-red) !important;
  color: var(--min2-red) !important;
}
.entry-content a[style*="border:1px solid #d2d2d7"]:hover {
  background: var(--min2-red) !important;
  color: var(--min2-white) !important;
}
.directory-hero, .org-leader, .banner, .min-account-form { background: var(--min2-off-white); }
.org-leader.is-head { background: var(--min2-gray); border-color: var(--min2-gray); color: var(--min2-black); }
.org-leader.is-head p, .org-leader.is-head small { color: var(--min2-black); }
.person-monogram, .org-leader .person-monogram,
.org-leader.is-head .person-monogram { background: var(--min2-white); color: var(--min2-red); }
.contact-banner { background: var(--min2-gray); color: var(--min2-black); }
.contact-banner h2, .contact-banner p { color: var(--min2-black); }
.contact-banner .button { background: var(--min2-white); border-color: var(--min2-red); color: var(--min2-red); }
.contact-banner .button:hover { background: var(--min2-red); color: var(--min2-white); }
body .ec-switcher { background: var(--min2-white); border-color: var(--min2-gray); }
body .ec-switcher a { color: var(--min2-black); }
body .ec-switcher a[aria-current] { background: var(--min2-gray); color: var(--min2-black); }
.site-footer { background: var(--min2-white); color: var(--min2-black); }
.site-footer > .wrap { border-top-color: var(--min2-gray); }
.site-footer p, .site-footer address, .site-footer a { color: var(--min2-black) !important; }
.site-footer a:hover { color: var(--min2-red) !important; }

/* Same identity at sign-in. Authentication controls keep their behavior. */
body.login { background: var(--min2-off-white); background-image: none; color: var(--min2-black); }
body.login #login { background: var(--min2-white); border-color: var(--min2-gray); border-top-color: var(--min2-red); box-shadow: none; }
body.login .min2-login-identity, body.login .min2-login-agency,
body.login #login form label, body.login #login form input.input { color: var(--min2-black); }
body.login #login form input.input { background: var(--min2-white); border-color: var(--min2-gray); }
body.login #login form input:focus { border-color: var(--min2-red); box-shadow: 0 0 0 1px var(--min2-red); }
body.login .button-primary { background: var(--min2-red); border-color: var(--min2-red); color: var(--min2-white); }
body.login .button-primary:hover { background: var(--min2-dark); border-color: var(--min2-dark); }
body.login #nav a, body.login #backtoblog a,
body.login a, body.login .button.wp-hide-pw { color: var(--min2-red); }
body.login .notice, body.login #login_error, body.login .message { background: var(--min2-gray); color: var(--min2-black); border-left-color: var(--min2-red); }
body.login a:focus-visible, body.login button:focus-visible { outline-color: var(--min2-red); }

@media print {
  .gsr-home em { color: var(--min2-black); }
  .gsr-mission, .gsr-values { background: var(--min2-white); }
  .gsr-mission h2, .gsr-mission p, .gsr-mission em,
  .gsr-values h2, .gsr-values h3, .gsr-values p { color: var(--min2-black); }
}
