/* =========================================================================
   TrapLeague — lodge theme
   A tribute to the outdoors and the shotgun sports: walnut and pine
   structure, parchment paper, and the blaze orange of a clay target used
   only where it counts. No hunting imagery — this is about the games.

   Tokens
   ------------------------------------------------------------------- */
:root {
    --tl-walnut:      #3E2E22;   /* gunstock walnut — nav, footer */
    --tl-walnut-edge: #5A4433;
    --tl-pine:        #24402F;   /* deep pine — primary actions */
    --tl-pine-dark:   #1A2F22;
    --tl-forest:      #2F6B44;   /* approvals / success */
    --tl-parchment:   #F3EDE0;   /* page */
    --tl-card:        #FBF8F1;   /* surfaces */
    --tl-card-edge:   #DCCFB8;
    --tl-ink:         #2A2318;
    --tl-ink-muted:   #6E6152;
    --tl-clay:        #E4572E;   /* the clay target itself — accent, sparing */
    --tl-brass:       #A98435;   /* shell brass — focus, gold flair */
    --tl-spruce:      #4E7A6A;   /* venue-secretary teal, muted spruce */
}

/* Base ---------------------------------------------------------------- */
body {
    background-color: var(--tl-parchment);
    color: var(--tl-ink);
    font-family: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
}

h1, h2, h3, h4, h5, .navbar-brand {
    font-family: "Bitter", Georgia, serif;
    font-weight: 700;
    color: var(--tl-ink);
}

/* Page title carries the one clay accent line */
.tl-page-title { position: relative; padding-bottom: .35rem; }
.tl-page-title::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 3.5rem; height: 4px;
    border-radius: 2px;
    background: var(--tl-clay);
}

a { color: var(--tl-pine); }
a:hover { color: var(--tl-clay); }

/* Navbar: walnut rail ------------------------------------------------- */
.navbar.tl-nav {
    background-color: var(--tl-walnut);
    border-bottom: 3px solid var(--tl-brass);
}
.tl-nav .navbar-brand { color: var(--tl-parchment); display: flex; align-items: center; gap: .5rem; }
.tl-nav .navbar-brand:hover { color: #fff; }
.tl-nav .nav-link { color: #E9DFCE; }
.tl-nav .nav-link:hover, .tl-nav .nav-link:focus { color: var(--tl-brass); }
.tl-nav .navbar-toggler { border-color: var(--tl-walnut-edge); }
.tl-nav .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23E9DFCE' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.tl-nav .dropdown-menu {
    background-color: var(--tl-card);
    border: 1px solid var(--tl-card-edge);
}

/* The brand mark: a clay in flight (inline SVG colored here) */
.tl-clay-mark { width: 22px; height: 22px; }
.tl-clay-mark .disc { fill: var(--tl-clay); }
.tl-clay-mark .dome { fill: #F08A5D; }

/* Surfaces ------------------------------------------------------------ */
.card {
    background-color: var(--tl-card);
    border: 1px solid var(--tl-card-edge);
    border-radius: .5rem;
    box-shadow: 0 1px 2px rgba(42, 35, 24, .06);
}
.card-header {
    background-color: #EFE6D3;
    border-bottom: 1px solid var(--tl-card-edge);
    font-family: "Bitter", Georgia, serif;
    letter-spacing: .01em;
}
.list-group-item { background-color: transparent; }
.list-group-item-action:hover { background-color: #F5EEDF; }

/* Tables: score sheets ------------------------------------------------ */
.table { --bs-table-color: var(--tl-ink); font-variant-numeric: tabular-nums; }
.table > thead.table-light, .table-light {
    --bs-table-bg: #EFE6D3;
    --bs-table-color: var(--tl-ink);
}
.table-hover > tbody > tr:hover > * { background-color: #F5EEDF; }

/* Buttons ------------------------------------------------------------- */
.btn-primary {
    --bs-btn-bg: var(--tl-pine);
    --bs-btn-border-color: var(--tl-pine);
    --bs-btn-hover-bg: var(--tl-pine-dark);
    --bs-btn-hover-border-color: var(--tl-pine-dark);
    --bs-btn-active-bg: var(--tl-pine-dark);
    --bs-btn-active-border-color: var(--tl-pine-dark);
}
.btn-outline-primary {
    --bs-btn-color: var(--tl-pine);
    --bs-btn-border-color: var(--tl-pine);
    --bs-btn-hover-bg: var(--tl-pine);
    --bs-btn-hover-border-color: var(--tl-pine);
    --bs-btn-active-bg: var(--tl-pine-dark);
    --bs-btn-active-border-color: var(--tl-pine-dark);
}
.btn-success {
    --bs-btn-bg: var(--tl-forest);
    --bs-btn-border-color: var(--tl-forest);
    --bs-btn-hover-bg: #26573A;
    --bs-btn-hover-border-color: #26573A;
    --bs-btn-active-bg: #26573A;
    --bs-btn-active-border-color: #26573A;
}
.btn-outline-success {
    --bs-btn-color: var(--tl-forest);
    --bs-btn-border-color: var(--tl-forest);
    --bs-btn-hover-bg: var(--tl-forest);
    --bs-btn-hover-border-color: var(--tl-forest);
}
.btn-warning {
    --bs-btn-bg: #C98A2B;
    --bs-btn-border-color: #C98A2B;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #B0771F;
    --bs-btn-hover-border-color: #B0771F;
    --bs-btn-hover-color: #fff;
}
.btn-link { color: var(--tl-pine); }

/* Badges: role flair and statuses ------------------------------------- */
.badge.text-bg-primary { background-color: var(--tl-pine) !important; }
.badge.text-bg-info    { background-color: var(--tl-spruce) !important; color: #fff !important; }
.badge.text-bg-warning { background-color: var(--tl-brass) !important; color: #fff !important; }
.badge.text-bg-dark    { background-color: var(--tl-walnut) !important; }
.badge.text-bg-success { background-color: var(--tl-forest) !important; }

/* Alerts: warm tints -------------------------------------------------- */
.alert-success {
    --bs-alert-bg: #E7EFE4;
    --bs-alert-border-color: #C4D6BE;
    --bs-alert-color: #26482F;
}
.alert-danger {
    --bs-alert-bg: #F6E3DA;
    --bs-alert-border-color: #E4BCA8;
    --bs-alert-color: #7A301F;
}
.alert-info {
    --bs-alert-bg: #E6EDE9;
    --bs-alert-border-color: #C2D3CB;
    --bs-alert-color: #2E4A3F;
}

/* Forms --------------------------------------------------------------- */
.form-control, .form-select {
    background-color: #FFFDF8;
    border-color: var(--tl-card-edge);
    color: var(--tl-ink);
}
.form-control:focus, .form-select:focus {
    border-color: var(--tl-brass);
    box-shadow: 0 0 0 .2rem rgba(169, 132, 53, .2);
}
.form-text { color: var(--tl-ink-muted); }
.text-muted { color: var(--tl-ink-muted) !important; }

/* Footer -------------------------------------------------------------- */
footer.tl-footer {
    background-color: var(--tl-walnut);
    color: #CBBFA9;
    border-top: 3px solid var(--tl-brass);
}
footer.tl-footer a { color: #E9DFCE; }
footer.tl-footer a:hover { color: var(--tl-brass); }

/* Accessibility floor ------------------------------------------------- */
:focus-visible {
    outline: 2px solid var(--tl-brass);
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}

/* Avatars / misc carried from base ------------------------------------ */
.avatar { border-radius: 50%; object-fit: cover; }
.avatar-sm { width: 32px; height: 32px; }
.avatar-lg { width: 96px; height: 96px; }
.avatar-md { width: 48px; height: 48px; }
.avatar-xl { width: 128px; height: 128px; }
.visibility-public { color: var(--tl-forest); }
.visibility-followers { color: var(--tl-brass); }
.visibility-private { color: var(--tl-ink-muted); }