/*
 * Site-wide light theme, matching the homepage: system sans-serif body text,
 * a white top menu with green type, and a cream top banner with green type in
 * place of the dark green one. Pages opt in with <body class="... light-top">
 * and <link rel="stylesheet" href="/shared/light.css">.
 *
 * It recolors the existing Tailwind classes rather than rewriting each page,
 * so every page keeps its own layout.
 */

/* ---------- Font: same as the homepage ---------- */
body.light-top {
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}
body.light-top .prose-body h2,
body.light-top .prose-body h3 { font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif !important; font-weight: 800; letter-spacing: -0.02em; }

/* ---------- Top menu ---------- */
body.light-top > nav,
body.light-top nav.fixed,
body.light-top nav.sticky {
    background: rgba(255, 255, 255, .94) !important;
    color: #084734 !important;
    border-bottom: 1px solid #eef0ee !important;
    box-shadow: none !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
body.light-top > nav .text-white,
body.light-top > nav [class*="text-white/"] { color: #084734 !important; }
body.light-top > nav [class*="text-brand-200"],
body.light-top > nav [class*="text-brand-100"] { color: #1d4730 !important; }
body.light-top > nav [class*="text-brand-200"]:hover { color: #5a9326 !important; }
body.light-top > nav [class*="text-brand-400"] { color: #6b7280 !important; }
/* the active page */
body.light-top > nav a.bg-brand-800 { background: #f5fbe6 !important; color: #084734 !important; }
/* call-to-action button */
body.light-top > nav a.bg-brand-300 { background: #084734 !important; color: #fff !important; }
body.light-top > nav a.bg-brand-300:hover { background: #1d4730 !important; }
/* menu button and the phone menu */
body.light-top > nav #mobile-toggle,
body.light-top > nav button[aria-label="Menu"] { color: #084734 !important; }
body.light-top > nav #mobile-toggle:hover { background: #f5fbe6 !important; }
body.light-top > nav #mobile-menu { background: #fff !important; border-color: #eef0ee !important; }
body.light-top > nav #mobile-menu .border-brand-800,
body.light-top > nav #mobile-menu [class*="border-white/"] { border-color: #eef0ee !important; }
/* the Govably mark: a green tile, whatever the page's markup */
body.light-top > nav img[src*="govably-icon"] { object-fit: contain; }
body.light-top > nav a > img[src*="govably-icon"] {
    width: 32px !important; height: 32px !important; padding: 6px; border-radius: 9px; background: #084734;
}
body.light-top > nav .bg-brand-800 > img[src*="govably-icon"] { background: none; padding: 0; }

/* ---------- Top banner: cream, green type ---------- */
body.light-top .gradient-hero,
body.light-top .light-banner {
    background: #fbf6ee !important;
    animation: none !important;
    color: #1f2937;
}
body.light-top .gradient-hero .text-white,
body.light-top .light-banner .text-white { color: #084734 !important; }
body.light-top .gradient-hero h1,
body.light-top .light-banner h1 { color: #084734 !important; }
body.light-top .gradient-hero [class*="text-white/"],
body.light-top .light-banner [class*="text-white/"] { color: #1d4730 !important; }
body.light-top .gradient-hero [class*="text-brand-100"],
body.light-top .gradient-hero [class*="text-brand-200"],
body.light-top .light-banner [class*="text-brand-100"],
body.light-top .light-banner [class*="text-brand-200"] { color: #374151 !important; }
body.light-top .gradient-hero .text-brand-300,
body.light-top .gradient-hero [class*="text-brand-300/"],
body.light-top .light-banner .text-brand-300,
body.light-top .light-banner [class*="text-brand-300/"] { color: #3d6b1c !important; }
body.light-top .gradient-hero .text-gray-300,
body.light-top .gradient-hero .text-gray-400,
body.light-top .light-banner .text-gray-300 { color: #6b7280 !important; }
/* eyebrow pills and outline buttons */
body.light-top .gradient-hero [class*="bg-white/"],
body.light-top .light-banner [class*="bg-white/"] { background-color: #fff !important; }
body.light-top .gradient-hero [class*="border-white/"],
body.light-top .light-banner [class*="border-white/"] { border-color: #e7dcc8 !important; }
body.light-top .gradient-hero a[class*="border-white"],
body.light-top .light-banner a[class*="border-white"] { color: #084734 !important; border-color: rgba(8, 71, 52, .3) !important; background: transparent !important; }
body.light-top .gradient-hero a[class*="border-white"]:hover { background: #fff !important; }
/* primary buttons */
body.light-top .gradient-hero a.bg-brand-300,
body.light-top .light-banner a.bg-brand-300 { background: #084734 !important; color: #fff !important; }
body.light-top .gradient-hero a.bg-brand-300:hover { background: #1d4730 !important; }
/* decorative glows and grid lines made for a dark background */
body.light-top .gradient-hero > .absolute.inset-0 { display: none; }
/* breadcrumbs and small links */
body.light-top .gradient-hero a.text-brand-300,
body.light-top .light-banner a.text-brand-300 { color: #3d6b1c !important; }
/* section labels in the phone menu */
body.light-top > nav #mobile-menu [class*="text-brand-300"],
body.light-top > nav #mobile-menu [class*="text-brand-400"],
body.light-top > nav #mobile-menu [class*="text-brand-500"] { color: #6b7280 !important; }
