:root {
    /* Primary Colors */
    --mw-deep-blue: #020835;
    --mw-cyan: #46BEDD;
    --mw-pink: #FF3354;
    --mw-green: #8CC740;
    --mw-white: #FFFFFF;

    /* Gray Shades */
    --mw-g50: #F9FAFB;
    --mw-g100: #F3F4F6;
    --mw-g200: #E2E8F0;
    --mw-g300: #CBD5E1;
    --mw-g400: #9CA3AF;
    --mw-g500: #6B7280;
    --mw-g700: #374151;
    --mw-g900: #111827;

    /* Shadows */
    --mw-sh-subtle: 0 1px 2px 0 rgba(0,0,0,0.05);
    --mw-sh-soft: 0 10px 25px -15px rgba(2,8,53,0.35);

    /* Radius */
    --mw-r-small: 8px;
    --mw-r-card: 12px;
    --mw-r-card-xl: 24px;
    --mw-r-pill: 9999px;
}

body {
    background-color: var(--mw-g50);
    color: var(--mw-g700);
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    overflow-x: hidden; /* Empêche le scroll horizontal */
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: var(--mw-deep-blue);
}

/* Responsive Utilities */
#wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

.mw-sidebar {
    min-width: 250px;
    max-width: 250px;
    background: var(--mw-deep-blue);
    color: #fff;
    transition: all 0.3s;
    z-index: 1000;
}

.mw-sidebar.collapsed {
    margin-left: -250px;
}

#content {
    width: 100%;
    min-height: 100vh;
    transition: all 0.3s;
}

/* Navbar */
.mw-navbar {
    background-color: var(--mw-white);
    border-bottom: 1px solid var(--mw-g200);
    padding: 10px 20px;
}

/* Mobile specific */
@media (max-width: 768px) {
    .mw-sidebar {
        margin-left: -250px;
        position: fixed;
        height: 100%;
    }
    .mw-sidebar.active {
        margin-left: 0;
    }
    h1 { font-size: 1.5rem; }
    .mw-card-xl { padding: 15px; }
}

/* Cards */
.mw-card {
    background-color: var(--mw-white);
    border: 1px solid var(--mw-g200);
    border-radius: var(--mw-r-card);
    box-shadow: var(--mw-sh-subtle);
    margin-bottom: 15px;
}

.q-faire { border-top: 4px solid var(--mw-pink) !important; }
.q-planifier { border-top: 4px solid var(--mw-cyan) !important; }
.q-deleguer { border-top: 4px solid var(--mw-green) !important; }
.q-supprimer { border-top: 4px solid var(--mw-g500) !important; }

.mw-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}