:root {
    --brand: #15803d;
    --brand-dark: #126331;
    --brand-light: #dcfce7;
    --bs-primary-rgb: 21, 128, 61;
    --ink: #1f2937;
    --muted: #6b7280;
    --bg: #f4f6f8;
}

body {
    background-color: var(--bg);
    color: var(--ink);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---- Couleur de marque appliquée aux composants Bootstrap ---- */
.btn-primary {
    --bs-btn-bg: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand-dark);
    --bs-btn-hover-border-color: var(--brand-dark);
    --bs-btn-active-bg: var(--brand-dark);
    --bs-btn-active-border-color: var(--brand-dark);
    --bs-btn-disabled-bg: var(--brand);
    --bs-btn-disabled-border-color: var(--brand);
}
.btn-outline-primary {
    --bs-btn-color: var(--brand);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand);
    --bs-btn-hover-border-color: var(--brand);
    --bs-btn-active-bg: var(--brand);
    --bs-btn-active-border-color: var(--brand);
}
.text-primary { color: var(--brand) !important; }
.bg-primary { background-color: var(--brand) !important; }
.link-primary { color: var(--brand) !important; }
a { color: var(--brand-dark); }
.form-control:focus, .form-select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 .2rem rgba(21, 128, 61, .15);
}

/* ---- Mise en page ---- */
.app-navbar {
    background: var(--brand);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.app-navbar .navbar-brand,
.app-navbar .nav-link,
.app-navbar .navbar-text { color: #fff !important; }
.app-navbar .nav-link:hover { color: #e8f5ec !important; }

.app-shell { display: flex; min-height: calc(100vh - 56px); }
.app-sidebar {
    width: 240px;
    background: #fff;
    border-right: 1px solid #e5e7eb;
    flex-shrink: 0;
}
.app-content { flex: 1 1 auto; padding: 1.25rem; min-width: 0; }

.sidebar-link {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .6rem 1rem;
    color: var(--ink);
    text-decoration: none;
    border-left: 3px solid transparent;
    font-size: .95rem;
}
.sidebar-link:hover { background: #f3f4f6; color: var(--brand-dark); }
.sidebar-link.active {
    background: var(--brand-light);
    color: var(--brand-dark);
    border-left-color: var(--brand);
    font-weight: 600;
}
.sidebar-link svg { width: 18px; height: 18px; flex-shrink: 0; }
.sidebar-heading {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--muted);
    padding: 1rem 1rem .35rem;
    margin: 0;
}

/* ---- Cartes statistiques ---- */
.stat-card {
    border: none;
    border-radius: .75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}
.stat-card .stat-icon {
    width: 44px; height: 44px;
    display: grid; place-items: center;
    border-radius: .6rem;
    background: var(--brand-light);
    color: var(--brand-dark);
}
.stat-value { font-size: 1.6rem; font-weight: 700; line-height: 1.1; }
.stat-label { color: var(--muted); font-size: .85rem; }

/* ---- Cartes & tableaux ---- */
.card { border: none; border-radius: .75rem; box-shadow: 0 1px 3px rgba(0,0,0,.07); }
.card-header {
    background: #fff;
    border-bottom: 1px solid #eef0f2;
    font-weight: 600;
    border-radius: .75rem .75rem 0 0 !important;
}
.table > :not(caption) > * > * { padding: .65rem .75rem; }
.table thead th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--muted);
    border-bottom: 2px solid #eef0f2;
}
.avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--brand-light);
    color: var(--brand-dark);
    display: inline-grid; place-items: center;
    font-weight: 600; font-size: .85rem;
}
.avatar-lg { width: 96px; height: 96px; font-size: 1.8rem; }

/* ---- Connexion ---- */
.login-wrapper {
    min-height: 100vh;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
    padding: 1rem;
}
.login-card {
    width: 100%; max-width: 410px;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .25);
}
.login-logo {
    width: 64px; height: 64px;
    border-radius: 1rem;
    background: var(--brand-light);
    color: var(--brand-dark);
    display: grid; place-items: center;
    margin: 0 auto 1rem;
}

.page-title { font-weight: 700; margin: 0; }
.badge-soft { padding: .35em .6em; font-weight: 600; border-radius: .5rem; }

@media (max-width: 991.98px) {
    .app-sidebar { display: none; }
    .app-content { padding: 1rem; }
}