:root {
    --sky-1: #dff7ff;
    --sky-2: #b7ebff;
    --sky-3: #89ddff;
    --sky-4: #47c8ff;
    --sky-5: #1ca4f3;
    --sky-6: #0a78d1;
    --ink: #12314e;
    --muted: #6b86a4;
    --card: rgba(255,255,255,0.80);
    --card-strong: rgba(255,255,255,0.92);
    --line: rgba(17, 117, 190, 0.10);
    --success: #12c57a;
    --danger: #ff5f7e;
    --warning: #ffb648;
    --info: #6b7cff;
    --pdf: #8f48ff;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    color: var(--ink);
    background: linear-gradient(135deg, #dff7ff 0%, #d9f4ff 30%, #aee9ff 100%);
}

.page-bg {
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at top left, rgba(255,255,255,0.95), transparent 28%),
        radial-gradient(circle at top right, rgba(71,200,255,0.28), transparent 22%),
        radial-gradient(circle at bottom left, rgba(28,164,243,0.18), transparent 28%),
        linear-gradient(135deg, #def7ff 0%, #c5efff 35%, #8ddcff 100%);
    z-index: -2;
}

.app-shell { position: relative; z-index: 1; }

.glass-nav,
.glass-card,
.table-card,
.filter-card {
    background: var(--card);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255,255,255,0.45);
    box-shadow: 0 14px 40px rgba(28, 122, 182, 0.16);
}

.glass-nav {
    background: linear-gradient(135deg, rgba(8,119,202,0.92), rgba(47,190,255,0.88));
    border: 1px solid rgba(255,255,255,0.18);
}

.brand-logo {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: rgba(255,255,255,0.18);
    font-size: 1.4rem;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.22);
}

.brand-title { font-size: 1rem; line-height: 1.1; }
.brand-subtitle { color: rgba(255,255,255,0.85); }

.nav-pill {
    border-radius: 14px;
    padding: 0.75rem 1rem !important;
    background: rgba(255,255,255,0.10);
    color: #fff !important;
    font-weight: 600;
}

.nav-pill:hover,
.nav-pill:focus {
    background: rgba(255,255,255,0.18);
    transform: translateY(-1px);
}

.nav-pill-success { background: rgba(18,197,122,0.18); }
.nav-pill-danger { background: rgba(255,95,126,0.18); }
.nav-pill-pdf { background: rgba(143,72,255,0.18); }
.nav-pill-info { background: rgba(107,124,255,0.20); }

.user-chip {
    border-radius: 999px;
    padding: 0.75rem 1rem !important;
    background: rgba(255,255,255,0.14);
    color: #fff !important;
    display: flex;
    gap: 0.55rem;
    align-items: center;
}

.hero-banner {
    margin-top: 1.25rem;
    border-radius: 28px;
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(255,255,255,0.72), rgba(255,255,255,0.90));
    border: 1px solid rgba(255,255,255,0.55);
    box-shadow: 0 18px 45px rgba(28, 122, 182, 0.14);
}

.hero-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 18% 20%, rgba(71,200,255,0.28), transparent 18%),
      radial-gradient(circle at 82% 25%, rgba(143,72,255,0.14), transparent 20%),
      radial-gradient(circle at 60% 70%, rgba(18,197,122,0.12), transparent 18%);
    pointer-events: none;
}

.hero-title {
    font-size: clamp(1.5rem, 4vw, 2.4rem);
    font-weight: 800;
    margin-bottom: 0.6rem;
}

.hero-text {
    font-size: 1rem;
    color: var(--muted);
    max-width: 850px;
}

.quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.15rem;
}

.btn-glow {
    border: none;
    border-radius: 16px;
    padding: 0.9rem 1.15rem;
    font-weight: 700;
    color: #fff;
    box-shadow: 0 12px 24px rgba(30, 116, 201, 0.20);
}

.btn-sky { background: linear-gradient(135deg, #1fa6f4, #48d7ff); }
.btn-success-soft { background: linear-gradient(135deg, #09b66d, #2ae394); }
.btn-danger-soft { background: linear-gradient(135deg, #ff5b7a, #ff8ca2); }
.btn-pdf-soft { background: linear-gradient(135deg, #8142ff, #b075ff); }

.stat-card {
    border-radius: 24px;
    padding: 1.15rem;
    height: 100%;
    position: relative;
}

.stat-card .icon-wrap {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #fff;
    margin-bottom: 1rem;
}

.icon-sky { background: linear-gradient(135deg, #13a4f3, #55dcff); }
.icon-green { background: linear-gradient(135deg, #0ebd74, #33e59b); }
.icon-red { background: linear-gradient(135deg, #ff5d7c, #ff9bb0); }
.icon-purple { background: linear-gradient(135deg, #7746ff, #a781ff); }

.stat-label {
    color: var(--muted);
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.stat-value {
    font-size: clamp(1.2rem, 3vw, 2rem);
    font-weight: 800;
    line-height: 1.2;
}

.section-title {
    font-size: 1.15rem;
    font-weight: 800;
    margin-bottom: 0;
}

.section-subtitle {
    color: var(--muted);
    margin-bottom: 0;
}

.table-card,
.filter-card,
.glass-card {
    border-radius: 24px;
    padding: 1.1rem;
}

.table thead th {
    border: 0;
    color: var(--muted);
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.table tbody td {
    vertical-align: middle;
    border-color: var(--line);
}

.badge-soft {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    padding: 0.5rem 0.75rem;
    font-weight: 700;
}

.badge-entree { background: rgba(18,197,122,0.12); color: #098b56; }
.badge-sortie { background: rgba(255,95,126,0.12); color: #d1365c; }
.badge-immediate { background: rgba(255,182,72,0.16); color: #a56600; }

.chart-box {
    min-height: 320px;
    position: relative;
}

.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 1rem;
}

.login-card {
    max-width: 460px;
    width: 100%;
    border-radius: 28px;
    padding: 1.5rem;
}

.form-control,
.form-select {
    border-radius: 16px;
    min-height: 50px;
    border: 1px solid rgba(28,164,243,0.18);
    box-shadow: none !important;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(28,164,243,0.45);
    box-shadow: 0 0 0 0.24rem rgba(28,164,243,0.12) !important;
}

.footer-note {
    color: var(--muted);
    font-size: 0.92rem;
}

@media (max-width: 767.98px) {
    .hero-banner { padding: 1.15rem; border-radius: 22px; }
    .glass-nav { margin-left: 0.8rem !important; margin-right: 0.8rem !important; }
    .table-responsive { border-radius: 18px; overflow: hidden; }
    .btn-glow { width: 100%; }
}