/* style.css - Global Utilities for Admin & Track pages */

:root {
    --emerald: #0f2b1f; /* Primary */
    --emerald-light: #1a4a33;
    --gold: #c9a84c;
    --cream: #f8f5f0;
}

body {
    background-color: var(--cream);
    font-family: 'Inter', sans-serif;
}

/* Colors */
.bg-emerald { background-color: var(--emerald) !important; color: #fff; }
.bg-light-emerald { background-color: var(--cream) !important; }
.text-emerald { color: var(--emerald) !important; }

.bg-gold { background-color: var(--gold) !important; color: var(--emerald); }
.text-gold { color: var(--gold) !important; }

/* Buttons */
.btn-emerald {
    background-color: var(--emerald);
    color: #fff;
    border: none;
}
.btn-emerald:hover {
    background-color: var(--emerald-light);
    color: #fff;
}
.btn-outline-emerald {
    border: 2px solid var(--emerald);
    color: var(--emerald);
    background: transparent;
}
.btn-outline-emerald:hover {
    background-color: var(--emerald);
    color: #fff;
}

.btn-gold {
    background-color: var(--gold);
    color: var(--emerald);
    border: none;
}
.btn-gold:hover {
    background-color: #e8d5a3;
    color: var(--emerald);
}

/* Typography & Layout */
.max-w-md { max-width: 600px; margin-left: auto; margin-right: auto; }
.max-w-lg { max-width: 800px; margin-left: auto; margin-right: auto; }
.fw-extrabold { font-weight: 800 !important; }
.extra-small { font-size: 0.75rem !important; }

/* Header Fallbacks for non-SPA pages */
.header {
    background: var(--emerald);
    padding: 14px 0;
    border-bottom: 1px solid rgba(201, 168, 76, 0.15);
}
.header a { text-decoration: none; }
.header .logo {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 1.5rem;
    color: #fff;
    text-decoration: none;
}
.header .logo i { color: var(--gold); font-size: 1.8rem; }
.header .logo span { color: var(--gold); }

.header .nav-links {
    display: flex;
    align-items: center;
    gap: 28px;
    list-style: none;
    margin-bottom: 0;
}
.header .nav-links a {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9rem;
    font-weight: 500;
}
.header .nav-links a:hover { color: #fff; }
.header .nav-cta {
    background: var(--gold) !important;
    color: var(--emerald) !important;
    padding: 8px 22px;
    border-radius: 50px;
    font-weight: 600;
}
.header .hamburger { display: none; }