/* Modern theme overrides and variables */
:root{
    /* Color palette */
    --bg: linear-gradient(180deg,#f6fbf8 0%, #f1f7f5 100%);
    --surface: #ffffff;
    --text: #0f172a;
    --muted: #6b7280;
    --accent: #16a34a; /* primary green */
    --accent-600: #059669;
    --secondary: #064e3b;
    --radius: 12px;
    --shadow-1: 0 8px 22px rgba(2,6,23,0.06);
    --mobile-authbar-height: 0px;
}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');

html,body{height:100%;}
body{
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
    background: var(--bg);
    color: var(--text);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

/* Make primary container-fluids slightly constrained for better reading */
.container-fluid { max-width: 90%; margin: 0 auto; }
.hero-banner { max-width: 100%;}

/* Soften navbar with translucent backdrop */
.navbar{
    background: rgba(19,78,40,0.92) !important;
    backdrop-filter: blur(6px);
    padding-top: .5rem;
    padding-bottom: .5rem;
}

/* Topbar (above navbar) */
.topbar{padding: .6rem 0;}
.topbar .topbar-link{color:var(--muted)}

/* Brand adjustments */
.navbar .navbar-brand{font-weight:700;letter-spacing:.2px}
.navbar .navbar-brand img{height:48px;max-width:100%;width:auto;height:auto;max-height:48px}

/* Cards: modern rounded surfaces */
.card, .glossy-card{
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
    background: var(--surface);
}

/* Forms */
.form-control{
    border-radius: 10px;
    border: 1px solid rgba(15,23,42,0.06);
    padding: .65rem .75rem;
}
.form-label{font-weight:600;color:var(--muted);}

/* Buttons */
/* Primary buttons are provided by the `c-btn` component system in `components.css` */

/* Utility: center full height sections */
.vh-center{min-height:calc(100vh - var(--site-header-height));display:flex;align-items:center;justify-content:center;padding:2rem}

/* Login specific tweaks */
.login-illustration{background: linear-gradient(180deg, rgba(22,163,74,0.08), rgba(5,150,105,0.04)); display:flex; align-items:center; justify-content:center;}
.login-illustration svg{max-width:220px;width:100%;height:auto;opacity:.96}

/* Footer tweaks */
footer.site-footer{border-top-left-radius: var(--radius); border-top-right-radius: var(--radius); padding-top:1.25rem;padding-bottom:1.25rem;background:linear-gradient(180deg,#071427 0%, #071a2a 100%);}
.site-footer .footer-col h6{font-weight:700}
.site-footer a{color: #cbd5e1}

/* Typography helpers */
h1,h2,h3{line-height:1.15}
h1.hero-title{font-size:2.2rem;font-weight:800}
h2.section-title{font-size:1.35rem;font-weight:700}

/* Responsive utility helpers */
.u-stack-sm{display:flex;gap:1rem}
@media (max-width:767.98px){.u-stack-sm{flex-direction:column}}
.u-gap-2{gap:.5rem}
.text-center-sm{text-align:left}
@media (max-width:767.98px){.text-center-sm{text-align:center}}


@media (max-width: 767.98px){
    .container-fluid{max-width: 100%;}
    .login-illustration{display:none}
}

/* Keep navbar and mobile auth bar sticky across all screen sizes so navigation
    remains accessible while scrolling. Higher z-index keeps it above content. */
/* Fixed header: compute header heights and pin the header to the viewport.
   We provide CSS vars so projects can adjust precise spacing if needed. */
:root{
    --topbar-height: 124px; /* visible on large screens */
    --navbar-height: 64px; /* estimated navbar height */
    --site-header-height: calc(var(--topbar-height) + var(--navbar-height));
}

@media (max-width: 991.98px){
    /* Topbar hidden on small screens; only navbar (or mobile auth bar) is visible */
    :root{ --topbar-height: 0px; --navbar-height: 64px; --site-header-height: calc(var(--topbar-height) + var(--navbar-height)); }
}

/* Pin the main wrapper (topbar + navbar) to the top of the viewport */
.main-wrapper.sticky-top{position:fixed;top:0;left:0;right:0;z-index:1040;width:100%}
.main-wrapper .d-lg-none.w-100{position:fixed;bottom:0;top:auto;left:0;right:0;z-index:1045;width:100%}
.main-wrapper .navbar-collapse{z-index:1060}

/* Prevent page content from being hidden under the fixed header */
body{padding-top:var(--site-header-height);padding-bottom:var(--mobile-authbar-height)}
