:root {
    --color-primary: #2563EB;
    --color-primary-hover: #1D4ED8;
    --color-primary-soft: #EEF4FF;
    --color-danger: #DC2626;
    --color-danger-soft: #FDECEC;
    --color-success: #16A34A;
    --color-success-soft: #E8F7EE;
    --color-warning: #D97706;
    --color-warning-soft: #FBF1E2;
    --color-text: #0F172A;
    --color-text-muted: #475569;
    --color-text-light: #64748B;
    --color-muted: #94A3B8;
    --color-border: #E2E8F0;
    --color-border-soft: #EDF1F6;
    --color-row: #F1F5F9;
    --color-bg-soft: #F6F8FA;
    --color-bg: #FFFFFF;
    --radius-card: 14px;
    --radius-btn: 10px;
    --radius-pill: 999px;
    --shadow-card: 0 1px 2px rgba(15,23,42,.04), 0 1px 3px rgba(15,23,42,.05);
    --font-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --appbar-h: 56px;
    --tabbar-h: 60px;
    --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--color-bg-soft);
    color: var(--color-text);
    font-family: var(--font-base);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

label {
    display: block;
    margin: 0 0 6px;
    color: var(--color-text-muted);
    font-size: 13px;
    font-weight: 600;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

input, select, textarea {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
    color: var(--color-text);
    padding: 11px 13px;
}

textarea { min-height: 120px; resize: vertical; }

input:focus, select:focus, textarea:focus,
.appbar__icon-btn:focus-visible, .module-switch:focus-visible,
.tab:focus-visible, .menu-item:focus-visible,
.btn:focus-visible {
    outline: 3px solid rgba(37, 99, 235, 0.22);
    outline-offset: 1px;
    border-color: var(--color-primary);
}

h1, h2, h3, p { margin-top: 0; }

h1 {
    margin-bottom: 6px;
    font-size: clamp(1.3rem, 2.4vw, 1.6rem);
    line-height: 1.2;
    letter-spacing: -0.01em;
}

p { color: var(--color-text-muted); }

.app-shell { min-height: 100vh; display: flex; flex-direction: column; }

.desktop-sidebar { display: none; }

.appbar {
    position: sticky;
    top: 0;
    z-index: 30;
    background: rgba(255,255,255,0.92);
    -webkit-backdrop-filter: saturate(1.4) blur(8px);
    backdrop-filter: saturate(1.4) blur(8px);
    border-bottom: 1px solid var(--color-border-soft);
}

.appbar__inner {
    width: min(960px, calc(100% - 24px));
    margin: 0 auto;
    min-height: var(--appbar-h);
    display: flex;
    align-items: center;
    gap: 10px;
}

.appbar__left { display: flex; align-items: center; min-width: 0; flex: 1 1 0; }
.appbar__center { display: flex; align-items: center; justify-content: center; min-width: 0; }
.appbar__right { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; flex: 1 1 0; }

.brand {
    color: var(--color-text);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.appbar__icon-btn {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--color-text);
    border-radius: var(--radius-btn);
    font-size: 24px;
    line-height: 1;
}
.appbar__icon-btn:hover { background: var(--color-row); }
.appbar__icon-btn svg { width: 22px; height: 22px; }

.module-switch {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    border: none;
    background: transparent;
    color: var(--color-text);
    font-size: 16px;
    font-weight: 600;
    padding: 6px 8px;
    border-radius: var(--radius-btn);
    max-width: 60vw;
}
.module-switch:hover { background: var(--color-row); }
.module-switch span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.module-switch svg { width: 18px; height: 18px; flex: 0 0 auto; }

.appbar__title {
    font-size: 16px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 60vw;
}

.appbar__tabs { display: none; }
.appbar__module-nav { display: none; }

.module-nav__item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 12px;
    border-radius: var(--radius-pill);
    color: var(--color-text-light);
    font-size: 14px;
    font-weight: 500;
}
.module-nav__item:hover { background: var(--color-row); color: var(--color-text); }
.module-nav__item--active { background: var(--color-primary-soft); color: var(--color-primary); }
.module-nav__item--disabled { opacity: .48; cursor: not-allowed; }
.module-nav__item--disabled:hover { background: transparent; color: var(--color-text-light); }
.module-nav__icon { display: inline-flex; flex: 0 0 auto; }
.module-nav__icon svg { width: 18px; height: 18px; }

.tabbar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 30;
    display: flex;
    background: rgba(255,255,255,0.97);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border-top: 1px solid var(--color-border-soft);
    padding-bottom: var(--safe-bottom);
}

.tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: var(--tabbar-h);
    color: var(--color-text-light);
    font-size: 11px;
    font-weight: 500;
}
.tab svg { width: 23px; height: 23px; }
.tab__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1; }
.tab--active { color: var(--color-primary); }
.tab--disabled { color: var(--color-text-light); opacity: .55; cursor: not-allowed; }

.module-dropdown {
    position: fixed;
    inset: var(--appbar-h) 0 auto;
    z-index: 45;
    pointer-events: none;
}
.module-dropdown.is-open { pointer-events: auto; }
.module-dropdown__scrim {
    position: fixed;
    inset: var(--appbar-h) 0 0;
    z-index: 0;
    background: rgba(15,23,42,0.22);
    opacity: 0;
    transition: opacity .16s ease;
}
.module-dropdown.is-open .module-dropdown__scrim { opacity: 1; }
.module-dropdown__panel {
    position: relative;
    z-index: 1;
    width: min(360px, calc(100% - 24px));
    margin: 6px auto 0;
    padding: 8px;
    max-height: calc(100vh - var(--appbar-h) - 20px);
    overflow: auto;
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    background: var(--color-bg);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.16);
    transform: translateY(-8px);
    opacity: 0;
    transition: transform .16s ease, opacity .16s ease;
}
.module-dropdown.is-open .module-dropdown__panel { transform: translateY(0); opacity: 1; }
.module-dropdown__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: var(--radius-btn);
    color: var(--color-text);
    font-size: 14px;
    font-weight: 500;
}
.module-dropdown__item:hover { background: var(--color-row); }
.module-dropdown__item--active { background: var(--color-primary-soft); color: var(--color-primary); }
.module-dropdown__item--disabled { color: var(--color-text-light); opacity: .72; cursor: not-allowed; }
.module-dropdown__item--disabled:hover { background: transparent; }
.module-dropdown__item--danger {
    width: 100%;
    border: 0;
    background: transparent;
    color: var(--color-danger);
    text-align: left;
}
.module-dropdown__item--danger:hover { background: var(--color-danger-soft); }
.module-dropdown__item small { font-size: 12px; font-weight: 500; }
.module-dropdown__main { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.module-dropdown__icon { display: inline-flex; flex: 0 0 auto; color: currentColor; }
.module-dropdown__icon svg { width: 21px; height: 21px; }
.module-dropdown__group {
    padding: 10px 12px 4px;
    color: var(--color-text-light);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.module-dropdown__form {
    margin: 6px 0 0;
    padding-top: 6px;
    border-top: 1px solid var(--color-border-soft);
}

.menu-sheet { position: fixed; inset: 0; z-index: 50; pointer-events: none; }
.menu-sheet.is-open { pointer-events: auto; }
.menu-sheet__scrim { position: absolute; inset: 0; background: rgba(15,23,42,0.45); opacity: 0; transition: opacity .24s ease; }
.menu-sheet.is-open .menu-sheet__scrim { opacity: 1; }
.menu-sheet__panel {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    max-width: 480px;
    margin: 0 auto;
    background: var(--color-bg);
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    padding: 8px 16px calc(18px + var(--safe-bottom));
    transform: translateY(100%);
    transition: transform .28s cubic-bezier(.32,.72,0,1);
    box-shadow: 0 -8px 40px rgba(15,23,42,0.18);
    will-change: transform;
}
.menu-sheet.is-open .menu-sheet__panel { transform: translateY(0); }
.menu-sheet__handle { width: 36px; height: 4px; border-radius: 999px; background: var(--color-border); margin: 8px auto 12px; }
.menu-sheet__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.menu-sheet__title { font-size: 15px; font-weight: 600; }
.menu-sheet__list { display: flex; flex-direction: column; gap: 4px; }
.menu-item {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px;
    padding: 0 12px;
    border: none;
    background: transparent;
    border-radius: var(--radius-btn);
    color: var(--color-text);
    font-size: 15px;
    font-weight: 500;
    text-align: left;
}
.menu-item:hover { background: var(--color-row); }
.menu-item--danger { color: var(--color-danger); }
.menu-item__form { margin: 0; width: 100%; }

.app-main {
    flex: 1;
    width: min(960px, calc(100% - 24px));
    margin: 0 auto;
    padding: 18px 0 36px;
}

.app-footer { border-top: 1px solid var(--color-border-soft); color: var(--color-text-light); font-size: 13px; }
.app-footer__inner { width: min(960px, calc(100% - 24px)); margin: 0 auto; padding: 16px 0; }
body.dashboard-page .app-footer { display: none; }

.page-container { max-width: 960px; margin: 0 auto; padding: 0; }
.page-stack { display: grid; gap: 16px; }
.page-stack > *,
.card,
.list-section,
.action-bar,
.filter-chips {
    min-width: 0;
}

.page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-border-soft);
}
.page-header__body { min-width: min(100%, 360px); }
.page-header__actions, .actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    color: var(--color-text-light);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.stats-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    margin: 0;
    padding: 14px 16px;
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    background: var(--color-bg);
    box-shadow: var(--shadow-card);
    color: var(--color-text);
}
.stats-bar__item { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.stats-bar strong, .stats-bar__value { color: var(--color-text); font-size: 19px; font-weight: 600; line-height: 1; }
.stats-bar__value--danger, .stats-bar--danger strong { color: var(--color-danger); }

.card, .panel {
    background: var(--color-bg);
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    overflow: hidden;
}
.panel { padding: 24px; }
.narrow { max-width: 460px; margin: 28px auto; }
.card--danger { border-left: 3px solid var(--color-danger); border-radius: 0 var(--radius-card) var(--radius-card) 0; }
.card--warning { border-left: 3px solid var(--color-warning); border-radius: 0 var(--radius-card) var(--radius-card) 0; }
.card--primary { border-left: 3px solid var(--color-primary); border-radius: 0 var(--radius-card) var(--radius-card) 0; }

.card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 13px 16px;
    background: transparent;
    border-bottom: 1px solid var(--color-border-soft);
}
.card-title { margin: 0; color: var(--color-text); font-size: 15px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.card-body { padding: 14px 16px; }
.card-body p:last-child { margin-bottom: 0; }
.card-body p { overflow-wrap: anywhere; white-space: pre-wrap; }
.card-list { display: grid; gap: 12px; }

.detail-grid {
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr);
    gap: 7px 12px;
    color: var(--color-text);
    font-size: 14px;
}
.detail-label { color: var(--color-text-light); font-weight: 600; }
.detail-value { min-width: 0; overflow-wrap: anywhere; }

.data-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    background: var(--color-bg);
    box-shadow: var(--shadow-card);
}
.data-table { width: 100%; min-width: 680px; border-collapse: collapse; background: var(--color-bg); }
.data-table th, .data-table td { padding: 12px 14px; border-bottom: 1px solid var(--color-border-soft); text-align: left; vertical-align: top; }
.data-table th { color: var(--color-text-light); font-size: 12px; font-weight: 600; letter-spacing: 0.4px; text-transform: uppercase; background: var(--color-bg-soft); }
.data-table tbody tr:hover { background: var(--color-bg-soft); }
.data-table tbody tr:last-child td { border-bottom: 0; }
.demandes-mobile-list { display: none; }
.col-num, .data-table .col-num { color: var(--color-primary); font-weight: 600; }
.col-date, .data-table .col-date { color: var(--color-text-light); font-size: 13px; }
.col-amount, .data-table .col-amount { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }

.btn, .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
    color: var(--color-text);
    padding: 9px 16px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}
.btn:hover, .button:hover { border-color: var(--color-border); background: var(--color-row); color: var(--color-text); }
.btn__icon { width: 18px; height: 18px; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; }
.btn__icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.btn-primary, .button--primary { border-color: var(--color-primary); background: var(--color-primary); color: #fff; }
.btn-primary:hover, .button--primary:hover { border-color: var(--color-primary-hover); background: var(--color-primary-hover); color: #fff; }
.btn-success { border-color: var(--color-success); background: var(--color-success); color: #fff; }
.btn-success:hover { border-color: #15803D; background: #15803D; color: #fff; }
.btn-danger { border-color: var(--color-danger); background: var(--color-danger); color: #fff; }
.btn-danger:hover { border-color: #B91C1C; background: #B91C1C; color: #fff; }

.badge {
    display: inline-block;
    border-radius: var(--radius-pill);
    padding: 3px 10px;
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text-muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
}
.badge-urgent { border-color: transparent; background: var(--color-danger-soft); color: #991B1B; }
.badge-todo { border-color: transparent; background: var(--color-warning-soft); color: #92400E; }
.badge-done { border-color: transparent; background: var(--color-success-soft); color: #166534; }
.badge-private { border-color: transparent; background: var(--color-success-soft); color: #166534; }
.badge-public { border-color: transparent; background: var(--color-primary-soft); color: #1E40AF; }

.section-date { margin: 10px 0 0; color: var(--color-text); font-size: 17px; font-weight: 600; line-height: 1.25; }

.empty-state { border: 1px dashed var(--color-border); border-radius: var(--radius-card); padding: 30px 18px; background: var(--color-bg); color: var(--color-text-light); text-align: center; font-size: 14px; }

.alert, .flash, .error-list { border-radius: var(--radius-card); padding: 12px 14px; }
.alert, .error-list { border: 1px solid transparent; background: var(--color-danger-soft); color: #991B1B; }
.alert--link { display: block; font-weight: 600; }
.alert--link:hover { text-decoration: underline; }
.flash { border: 1px solid transparent; background: var(--color-success-soft); color: #166534; }
.error-list ul { margin: 0; padding-left: 18px; }

.filter-form, .form-grid { display: grid; gap: 16px; }
.filter-form { grid-template-columns: minmax(180px, 1fr) auto; align-items: end; }
.form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.filter-form > *,
.form-grid > *,
.field-full {
    min-width: 0;
}
.field-full { grid-column: 1 / -1; }

.has-tabbar .app-main { padding-bottom: calc(var(--tabbar-h) + var(--safe-bottom) + 16px); }
.has-tabbar .app-footer { display: none; }

@media (min-width: 861px) {
    :root {
        --sidebar-w: 286px;
        --sidebar-collapsed-w: 88px;
    }

    html.sidebar-collapsed,
    body.sidebar-collapsed {
        --sidebar-w: var(--sidebar-collapsed-w);
    }

    .has-sidebar .app-shell {
        padding-left: var(--sidebar-w);
        transition: padding-left .18s ease;
    }

    .desktop-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 40;
        width: var(--sidebar-w);
        display: flex;
        flex-direction: column;
        gap: 18px;
        padding: 18px 14px;
        border-right: 1px solid var(--color-border-soft);
        background: rgba(255,255,255,0.94);
        -webkit-backdrop-filter: saturate(1.35) blur(14px);
        backdrop-filter: saturate(1.35) blur(14px);
        box-shadow: 4px 0 18px rgba(15,23,42,.025);
        transition: width .18s ease;
    }

    .desktop-sidebar__top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        min-height: 44px;
    }

    .desktop-sidebar__brand {
        display: flex;
        align-items: center;
        min-width: 0;
        padding-left: 6px;
        color: var(--color-text);
        font-size: 17px;
        font-weight: 700;
        letter-spacing: -0.01em;
    }

    .desktop-sidebar__toggle {
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        border: 0;
        border-radius: var(--radius-btn);
        background: transparent;
        color: var(--color-text-light);
    }

    .desktop-sidebar__toggle:hover {
        background: var(--color-primary-soft);
        color: var(--color-primary);
    }

    .desktop-sidebar__toggle:focus-visible {
        outline: none;
    }

    .desktop-sidebar__nav,
    .desktop-sidebar__bottom {
        display: flex;
        flex-direction: column;
        gap: 6px;
        min-width: 0;
    }

    .desktop-sidebar__nav {
        flex: 1;
        padding-top: 6px;
    }

    .desktop-sidebar__group {
        padding: 10px 13px 4px;
        color: var(--color-text-light);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .desktop-sidebar__bottom {
        padding-top: 14px;
        border-top: 1px solid var(--color-border-soft);
    }

    .desktop-sidebar__item {
        position: relative;
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 46px;
        width: 100%;
        padding: 0 13px;
        border: 0;
        border-radius: 12px;
        background: transparent;
        color: var(--color-text-muted);
        font-size: 14px;
        font-weight: 600;
        text-align: left;
        transition: background-color 140ms ease, color 140ms ease, transform 140ms ease;
    }

    .desktop-sidebar__item:hover {
        background: var(--color-row);
        color: var(--color-text);
    }

    .desktop-sidebar__item--active {
        background: var(--color-primary-soft);
        color: var(--color-primary);
    }

    .desktop-sidebar__item--active::before {
        content: "";
        position: absolute;
        left: 6px;
        top: 12px;
        bottom: 12px;
        width: 3px;
        border-radius: var(--radius-pill);
        background: var(--color-primary);
    }

    .desktop-sidebar__item--disabled {
        opacity: .48;
        cursor: not-allowed;
    }

    .desktop-sidebar__item--disabled:hover {
        background: transparent;
        color: var(--color-text-muted);
    }

    .desktop-sidebar__item--danger {
        color: var(--color-danger);
    }

    .desktop-sidebar__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 22px;
        color: currentColor;
    }

    .desktop-sidebar__icon svg {
        width: 22px;
        height: 22px;
    }

    .desktop-sidebar__text {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .desktop-sidebar__account {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 58px;
        margin: 6px 0;
        padding: 9px 10px;
        border-radius: 14px;
        background: var(--color-bg-soft);
    }

    .desktop-sidebar__avatar {
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        border-radius: 50%;
        background: var(--color-bg);
        color: var(--color-primary);
        box-shadow: var(--shadow-card);
    }

    .desktop-sidebar__identity {
        display: flex;
        flex-direction: column;
        line-height: 1.2;
    }

    .desktop-sidebar__identity strong {
        overflow: hidden;
        color: var(--color-text);
        font-size: 13px;
        font-weight: 700;
        text-overflow: ellipsis;
    }

    .desktop-sidebar__identity small {
        color: var(--color-text-light);
        font-size: 12px;
    }

    .desktop-sidebar__form {
        margin: 0;
    }

    html.sidebar-collapsed .desktop-sidebar,
    body.sidebar-collapsed .desktop-sidebar {
        padding-inline: 12px;
    }

    html.sidebar-collapsed .desktop-sidebar__top,
    body.sidebar-collapsed .desktop-sidebar__top {
        justify-content: center;
        flex-direction: column;
    }

    html.sidebar-collapsed .desktop-sidebar__brand,
    body.sidebar-collapsed .desktop-sidebar__brand {
        padding-left: 0;
    }

    html.sidebar-collapsed .desktop-sidebar__text,
    html.sidebar-collapsed .desktop-sidebar__group,
    html.sidebar-collapsed .desktop-sidebar__item--active::before,
    body.sidebar-collapsed .desktop-sidebar__text,
    body.sidebar-collapsed .desktop-sidebar__group,
    body.sidebar-collapsed .desktop-sidebar__item--active::before {
        display: none;
    }

    html.sidebar-collapsed .desktop-sidebar__item,
    body.sidebar-collapsed .desktop-sidebar__item {
        justify-content: center;
        padding: 0;
    }

    html.sidebar-collapsed .desktop-sidebar__account,
    body.sidebar-collapsed .desktop-sidebar__account {
        justify-content: center;
        padding: 8px;
        background: transparent;
    }

    html.sidebar-collapsed .desktop-sidebar__toggle svg,
    body.sidebar-collapsed .desktop-sidebar__toggle svg {
        transform: rotate(180deg);
    }

    .has-sidebar .appbar {
        display: none;
    }

    .app-main,
    .app-footer__inner {
        width: min(1080px, calc(100% - 48px));
    }

    .app-main {
        padding-top: 30px;
    }

    .appbar__tabs { display: flex; align-items: center; gap: 4px; }
    .appbar__tabs .tab { flex: 0 0 auto; flex-direction: row; gap: 6px; min-height: 36px; padding: 0 14px; font-size: 14px; border-radius: var(--radius-pill); }
    .appbar__tabs .tab svg { width: 18px; height: 18px; }
    .appbar__tabs .tab--active { background: var(--color-primary-soft); }
    .appbar__module-nav { display: flex; align-items: center; justify-content: center; gap: 4px; }
    .tabbar { display: none; }
    .module-switch, .appbar__title { display: none; }
    .has-tabbar .app-main { padding-bottom: 36px; }
    .has-tabbar .app-footer { display: block; }
}

@media (max-width: 720px) {
    body { font-size: 16px; }
    .app-main { width: min(100%, calc(100% - 20px)); padding: 14px 0 28px; }
    .page-container { padding: 0; }
    .page-header { align-items: flex-start; flex-direction: column; }
    .page-header__actions, .actions { width: 100%; justify-content: flex-start; }
    .page-header__actions .btn, .actions .btn, .actions form { width: 100%; }
    .technician-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .technician-shortcuts .btn { width: 100%; min-height: 56px; justify-content: flex-start; padding: 12px 14px; font-size: 14px; }
    .technician-shortcuts .btn-primary, .technician-shortcuts .btn-danger { grid-column: span 1; }
    .stats-bar { align-items: stretch; flex-direction: column; gap: 10px; }
    .stats-bar__item { justify-content: space-between; }
    .card-header { align-items: flex-start; flex-direction: column; }
    .detail-grid { grid-template-columns: 104px minmax(0, 1fr); }
    .filter-form, .form-grid { grid-template-columns: 1fr; }
    .demandes-mobile-list { display: grid; }
    .demandes-table { display: none; }
    .data-table-wrap:not(.demandes-table) { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
    .data-table-wrap:not(.demandes-table) .data-table,
    .data-table-wrap:not(.demandes-table) .data-table tbody,
    .data-table-wrap:not(.demandes-table) .data-table tr,
    .data-table-wrap:not(.demandes-table) .data-table td { display: block; width: 100%; min-width: 0; }
    .data-table-wrap:not(.demandes-table) .data-table { background: transparent; border-collapse: separate; border-spacing: 0; }
    .data-table-wrap:not(.demandes-table) .data-table thead { display: none; }
    .data-table-wrap:not(.demandes-table) .data-table tbody { display: grid; gap: 12px; }
    .data-table-wrap:not(.demandes-table) .data-table tr { border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); background: var(--color-bg); box-shadow: var(--shadow-card); overflow: hidden; }
    .data-table-wrap:not(.demandes-table) .data-table tr:hover { background: var(--color-bg); }
    .data-table-wrap:not(.demandes-table) .data-table td { min-height: 44px; padding: 10px 12px; border-bottom: 1px solid var(--color-border-soft); text-align: left; overflow-wrap: anywhere; }
    .data-table-wrap:not(.demandes-table) .data-table td:last-child { border-bottom: 0; }
    .data-table-wrap:not(.demandes-table) .data-table td::before { content: attr(data-label); display: block; margin-bottom: 4px; color: var(--color-text-light); font-size: 12px; font-weight: 600; letter-spacing: 0.4px; text-transform: uppercase; }
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="Ascenseur"],
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="Immeuble"],
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="Reference"] { background: var(--color-bg-soft); }
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="PDF"] .actions,
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="Action"] form,
    .data-table-wrap:not(.demandes-table) .data-table td[data-label="Historique"] .btn { width: 100%; }
}

@media (max-width: 600px) {
    .demandes-table { border-radius: 0; margin-left: -10px; margin-right: -10px; width: calc(100% + 20px); }
}

@media (prefers-reduced-motion: reduce) {
    .menu-sheet__scrim, .menu-sheet__panel, .btn, .button { transition: none; }
}

@media (min-width: 861px) {
    .menu-sheet__scrim { background: transparent; }
    .menu-sheet__panel {
        left: auto;
        right: max(12px, calc((100% - 960px) / 2));
        bottom: auto;
        top: calc(var(--appbar-h) + 4px);
        width: 260px;
        max-width: none;
        margin: 0;
        padding: 8px;
        border: 1px solid var(--color-border-soft);
        border-radius: var(--radius-card);
        box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
        transform: translateY(-8px);
        opacity: 0;
        transition: transform .16s ease, opacity .16s ease;
        transform-origin: top right;
    }
    .menu-sheet.is-open .menu-sheet__panel { transform: translateY(0); opacity: 1; }
    .menu-sheet__handle { display: none; }
    .menu-sheet__head { margin-bottom: 4px; }
    .menu-item { min-height: 40px; font-size: 14px; }
}

.action-bar { display: flex; gap: 8px; }
.action-bar .btn { flex: 1; min-width: 0; }

.sublinks { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 0 2px; }
.sublinks a { color: var(--color-primary); font-size: 14px; font-weight: 500; }
.sublinks a:hover { text-decoration: underline; }
.sublinks span { color: var(--color-text-light); font-size: 14px; font-weight: 500; opacity: .7; }
.sublinks small { margin-left: 4px; font-size: 12px; font-weight: 500; }

.drive-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
}
.drive-link:hover { background: var(--color-row); border-color: var(--color-border); }
.drive-link svg { width: 24px; height: 22px; display: block; }

.pdf-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
}
.pdf-link:hover { background: var(--color-row); border-color: var(--color-border); }
.pdf-link svg { width: 24px; height: 28px; display: block; }

.icon-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
    color: var(--color-text);
}
.icon-action:hover { background: var(--color-row); border-color: var(--color-border); }
.icon-action svg { width: 24px; height: 24px; display: block; }
.icon-action--done { color: var(--color-success); border-color: rgba(22, 163, 74, .28); background: var(--color-success-soft); }
.icon-action--done svg, .icon-action--done svg * { fill: currentColor !important; stroke: currentColor !important; }

.alert-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    color: var(--color-danger);
    vertical-align: -3px;
}
.alert-icon svg { width: 18px; height: 18px; display: block; }
.alert-icon svg, .alert-icon svg * { fill: currentColor !important; stroke: currentColor !important; }
.alert-icon--title { width: 24px; height: 24px; margin-right: 6px; vertical-align: -4px; }
.alert-icon--title svg { width: 24px; height: 24px; }
.kpi__label--icon, .badge .alert-icon, .stats-bar__value .alert-icon { display: inline-flex; align-items: center; gap: 6px; }

.spec-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.spec--full { grid-column: 1 / -1; }
.spec__label { margin: 0; font-size: 11px; color: var(--color-text-light); text-transform: uppercase; letter-spacing: 0.04em; }
.spec__value { margin: 1px 0 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }

.list-section__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 2px 8px; }
.list-section__title { margin: 0; font-size: 13px; font-weight: 600; color: var(--color-text-light); text-transform: uppercase; letter-spacing: 0.04em; }
.list-stack { display: grid; gap: 8px; }

.list-row { display: flex; align-items: center; gap: 12px; padding: 11px 14px; background: var(--color-bg); border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); box-shadow: var(--shadow-card); color: var(--color-text); }
.list-row:hover { background: var(--color-bg-soft); }
.list-row__icon { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.list-row__icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.list-row__body { flex: 1; min-width: 0; }
.list-row__title { display: block; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.list-row__meta { display: block; margin-top: 1px; font-size: 12px; color: var(--color-text-light); }
.list-row .badge { flex: 0 0 auto; }

.tint-danger { background: var(--color-danger-soft); color: #991B1B; }
.tint-todo { background: var(--color-warning-soft); color: #92400E; }
.tint-done { background: var(--color-success-soft); color: #166534; }
.tint-info { background: var(--color-primary-soft); color: #1E40AF; }

/* === Chantiers : contrôles AJAX === */
.planning-control-form { margin: 0; width: 100%; }
.planning-check { width: 22px; min-height: 22px; height: 22px; accent-color: var(--color-success); }
.planning-check:disabled { opacity: .65; cursor: not-allowed; filter: saturate(.85); }
.planning-tech { width: 100%; min-height: 38px; padding: 7px 9px; border-radius: 8px; font-size: 13px; }
.planning-state-select { width: 100%; min-height: 38px; padding: 7px 9px; border-radius: 8px; font-size: 13px; }
.planning-muted { color: var(--color-text-light); }
.planning-danger { color: var(--color-danger); font-weight: 600; }
.planning-state { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--color-bg-soft); color: var(--color-text); }
.planning-state--0 { background: var(--color-border-soft); }
.planning-state--1 { background: var(--color-primary-soft); color: var(--color-primary); }
.planning-state--2 { background: var(--color-warning-soft); color: var(--color-warning); }
.planning-state--3 { background: var(--color-success-soft); color: var(--color-success); }
.planning-toast-stack { position: fixed; left: 12px; right: 12px; bottom: calc(var(--tabbar-h, 0px) + var(--safe-bottom, 0px) + 14px); z-index: 80; display: grid; justify-items: center; gap: 8px; pointer-events: none; }
.planning-toast { max-width: 360px; padding: 10px 14px; border-radius: var(--radius-btn); background: var(--color-success); color: #fff; font-size: 13px; font-weight: 600; box-shadow: 0 8px 28px rgba(15, 23, 42, .18); }
.planning-toast--error { background: var(--color-danger); }

/* === Chantiers : vue d'ensemble === */
.chantiers-toolbar { display:flex; flex-direction:column; gap:10px; margin-bottom:6px; }
.chantiers-toolbar__row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.chantiers-search { flex:1; min-width:180px; }
.chantier-list { display:grid; gap:10px; grid-template-columns:1fr; }
@media (min-width:861px){ .chantier-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } }
.chantier-card { display:block; background:var(--color-bg); border:1px solid var(--color-border-soft); border-radius:var(--radius-card); box-shadow:var(--shadow-card); padding:12px 14px; color:var(--color-text); }
.chantier-card:hover { background:var(--color-bg-soft); }
.chantier-card--retard { border-left:3px solid var(--color-danger); }
.chantier-card__top { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.chantier-card__title { font-size:15px; font-weight:600; overflow-wrap:anywhere; }
.chantier-card__sub { margin-top:2px; font-size:12px; color:var(--color-text-light); }
.chantier-progress { height:6px; background:var(--color-border-soft); border-radius:999px; overflow:hidden; margin:10px 0 7px; }
.chantier-progress__fill { height:100%; background:var(--color-primary); border-radius:999px; }
.chantier-progress__fill--retard { background:var(--color-danger); }
.chantier-progress__fill--done { background:var(--color-success); }
.chantier-card__foot { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; color:var(--color-text-light); }
.chantier-card__chev { color:var(--color-muted); display:inline-flex; }
.chantier-card__chev svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.chantier-prep__actions { margin-top:10px; }
.chantier-prep__actions form { margin:0; }
.badge-avenir { border-color:transparent; background:var(--color-bg-soft); color:var(--color-text-light); }
.badge-encours { border-color:transparent; background:var(--color-primary-soft); color:#1E40AF; }
.badge-retard { border-color:transparent; background:var(--color-danger-soft); color:#991B1B; }
.badge-termine { border-color:transparent; background:var(--color-success-soft); color:#166534; }

/* === Chantier : détail (stepper) === */
.chantier-detail { display:grid; gap:14px; }
.chantier-detail__sub { display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--color-text-light); font-size:13px; }
.term-steps { display:grid; }
.term-step { display:flex; gap:12px; align-items:stretch; }
.term-step__rail { width:20px; flex:0 0 20px; display:flex; flex-direction:column; align-items:center; }
.term-step__dot { width:20px; height:20px; border-radius:50%; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; background:var(--color-bg); border:2px solid var(--color-border); }
.term-step__dot svg { width:12px; height:12px; fill:none; stroke:#fff; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.term-step__dot--done { background:var(--color-success); border-color:var(--color-success); }
.term-step__dot--current { background:var(--color-primary); border-color:var(--color-primary); }
.term-step__line { flex:1; width:2px; background:var(--color-border-soft); margin:4px 0; }
.term-step:last-child .term-step__line { display:none; }
.term-step__content { flex:1; min-width:0; padding-bottom:16px; }
.term-step__head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.term-step__title { font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.term-step__meta { margin-top:3px; font-size:12px; color:var(--color-text-light); }
.term-step__controls { margin-top:10px; display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.term-step--active .term-step__controls { padding:12px; border:1px solid var(--color-primary-soft); border-radius:12px; }
.term-step__controls .planning-control-form { width:auto; }
.term-step__controls .planning-state-select, .term-step__controls .planning-tech { min-height:40px; min-width:120px; }

/* === Planning : Gantt (desktop) === */
.gantt-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.gantt { min-width:760px; border:1px solid var(--color-border-soft); border-radius:var(--radius-card); overflow:hidden; background:var(--color-bg); }
.gantt__row { display:grid; grid-template-columns:200px 1fr; border-bottom:1px solid var(--color-border-soft); color:var(--color-text); }
.gantt__row:hover { background:var(--color-bg-soft); }
.gantt__row:last-child { border-bottom:0; }
.gantt__label { padding:10px 12px; min-width:0; border-right:1px solid var(--color-border-soft); }
.gantt__label-title { font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.gantt__label-sub { font-size:11px; color:var(--color-text-light); }
.gantt__track { position:relative; min-height:46px; background-image:repeating-linear-gradient(to right, transparent 0, transparent calc(100%/12 - 1px), var(--color-border-soft) calc(100%/12 - 1px), var(--color-border-soft) calc(100%/12)); }
.gantt__head { background:var(--color-bg-soft); font-size:11px; color:var(--color-text-light); }
.gantt__head:hover, .gantt__foot:hover { background:var(--color-bg-soft); }
.gantt__head .gantt__track { display:flex; min-height:0; background-image:none; }
.gantt__week { flex:1; padding:8px 4px; text-align:center; border-right:1px solid var(--color-border-soft); }
.gantt__week:last-child { border-right:0; }
.gantt__week--current { color:var(--color-primary); font-weight:700; }
.gantt__bar { position:absolute; top:50%; transform:translateY(-50%); height:18px; border-radius:999px; background:var(--color-primary); color:#fff; font-size:11px; line-height:18px; padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; z-index:1; }
.gantt__bar--retard { background:var(--color-danger); }
.gantt__bar--termine { background:var(--color-success); }
.gantt__bar--avenir { background:var(--color-muted); }
.gantt__marker { position:absolute; top:5px; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:9px solid var(--color-warning); transform:translateX(-50%); z-index:2; }
.gantt__today { position:absolute; top:0; bottom:0; width:2px; background:var(--color-danger); transform:translateX(-1px); z-index:3; }
.gantt__foot { background:var(--color-bg-soft); }
.gantt__foot .gantt__track { display:flex; min-height:0; background-image:none; }
.gantt__load { flex:1; padding:6px 4px; text-align:center; font-size:11px; color:var(--color-text-light); border-right:1px solid var(--color-border-soft); }
.gantt__load:last-child { border-right:0; }
.gantt__load strong { color:var(--color-text); }

/* === Planning : agenda (mobile) === */
.agenda { display:grid; gap:18px; }
.agenda__group-title { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--color-text-light); margin-bottom:8px; }
.agenda__items { display:grid; gap:8px; }
.agenda-item { display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--color-bg); border:1px solid var(--color-border-soft); border-radius:var(--radius-card); box-shadow:var(--shadow-card); color:var(--color-text); }
.agenda-item:hover { background:var(--color-bg-soft); }
.agenda-item__date { flex:0 0 auto; width:44px; text-align:center; }
.agenda-item__day { display:block; font-size:18px; font-weight:700; line-height:1; }
.agenda-item__mon { display:block; font-size:11px; color:var(--color-text-light); text-transform:uppercase; }
.agenda-item__body { flex:1; min-width:0; }
.agenda-item__type { display:block; font-size:13px; font-weight:600; }
.agenda-item__type--commander { color:var(--color-warning); }
.agenda-item__chantier { display:block; font-size:12px; color:var(--color-text-light); overflow-wrap:anywhere; }
.agenda-item__chev { color:var(--color-muted); display:inline-flex; }
.agenda-item__chev svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* === Mes étapes === */
.etape-list { display:grid; gap:10px; }
@media (min-width:861px) { .etape-list { grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; } }
.etape-card { background:var(--color-bg); border:1px solid var(--color-border-soft); border-left:3px solid transparent; border-radius:var(--radius-card); box-shadow:var(--shadow-card); padding:14px 16px; display:grid; gap:10px; }
.etape-card[data-state="0"] { border-left-color:var(--color-border); }
.etape-card[data-state="1"] { border-left-color:var(--color-primary); }
.etape-card[data-state="2"] { border-left-color:var(--color-warning); }
.etape-card[data-state="3"] { border-left-color:var(--color-success); }
.etape-card__top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.etape-card__title { font-size:17px; font-weight:700; overflow-wrap:anywhere; line-height:1.2; }
.etape-card__loca { font-size:13px; color:var(--color-text-light); margin-top:2px; }
.etape-card__work { font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.etape-card__ctx { font-size:12px; color:var(--color-text-light); }
.etape-card__pdf { align-self:flex-start; display:inline-flex; align-items:center; gap:6px; }
.etape-card__foot { margin-top:2px; font-size:12px; color:var(--color-text-light); }

/* Segmenté (Vu / En cours / Terminé) */
.segmented { display:flex; border:1px solid var(--color-border); border-radius:var(--radius-pill); overflow:hidden; background:var(--color-bg); width:100%; max-width:100%; }
.segmented__btn { flex:1 1 0; padding:9px 10px; min-height:46px; background:transparent; color:var(--color-text-muted); font-size:14px; font-weight:600; border:0; border-right:1px solid var(--color-border); cursor:pointer; }
.segmented__btn:last-child { border-right:0; }
.segmented__btn:disabled { opacity:.6; cursor:wait; }
.segmented__btn--active[data-etat="1"] { background:var(--color-primary); color:#fff; }
.segmented__btn--active[data-etat="2"] { background:var(--color-warning); color:#fff; }
.segmented__btn--active[data-etat="3"] { background:var(--color-success); color:#fff; }

.sheet { position: fixed; inset: 0; z-index: 45; pointer-events: none; }
.sheet.is-open { pointer-events: auto; }
.sheet__scrim { position: absolute; inset: 0; background: rgba(15,23,42,0.45); opacity: 0; transition: opacity .24s ease; }
.sheet.is-open .sheet__scrim { opacity: 1; }
.sheet__panel { position: absolute; left: 0; right: 0; bottom: 0; max-width: 480px; margin: 0 auto; background: var(--color-bg); border-top-left-radius: 18px; border-top-right-radius: 18px; padding: 8px 16px calc(18px + var(--safe-bottom)); transform: translateY(100%); transition: transform .28s cubic-bezier(.32,.72,0,1); box-shadow: 0 -8px 40px rgba(15,23,42,0.18); will-change: transform; }
.sheet.is-open .sheet__panel { transform: translateY(0); }
.sheet__handle { width: 36px; height: 4px; border-radius: 999px; background: var(--color-border); margin: 8px auto 12px; }
.sheet__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.sheet__title { font-size: 15px; font-weight: 600; }
.sheet__list { display: flex; flex-direction: column; gap: 4px; }
.sheet-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 0 12px; border: none; background: transparent; border-radius: var(--radius-btn); color: var(--color-text); font-size: 15px; font-weight: 500; text-align: left; }
.sheet-item:hover { background: var(--color-row); }
.sheet-item__icon { display: inline-flex; flex: 0 0 auto; color: var(--color-primary); }
.sheet-item__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sheet-item__label { flex: 1; }
.sheet-item__hint { color: var(--color-text-light); font-size: 12px; }
.sheet-item__chev { color: var(--color-text-light); display: inline-flex; }
.sheet-item__chev svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.confirm-sheet__message { margin: 4px 0 16px; color: var(--color-text-muted); font-size: 15px; }
.confirm-sheet__actions { display: flex; justify-content: flex-end; gap: 10px; }
.confirm-sheet__actions .btn { min-width: 118px; }

@media (min-width: 861px) {
    .action-bar { justify-content: flex-start; }
    .action-bar .btn { flex: 0 0 auto; min-width: 150px; }
    .sheet__scrim { background: rgba(15,23,42,0.35); }
    .sheet__panel { left: 50%; right: auto; bottom: auto; top: 50%; width: 360px; max-width: none; margin: 0; border-radius: var(--radius-card); padding: 12px 14px 16px; transform: translate(-50%, calc(-50% + 8px)); opacity: 0; transition: transform .18s ease, opacity .18s ease; box-shadow: 0 24px 60px rgba(15,23,42,0.22); }
    .sheet.is-open .sheet__panel { transform: translate(-50%, -50%); opacity: 1; }
    .sheet__handle { display: none; }
}

.kpi-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.kpi { display: flex; flex-direction: column; gap: 3px; padding: 12px 10px; border-radius: var(--radius-card); background: var(--color-bg); border: 1px solid var(--color-border-soft); box-shadow: var(--shadow-card); color: var(--color-text); }
.kpi:hover { background: var(--color-bg-soft); }
.kpi__value { font-size: 22px; font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; }
.kpi__label { font-size: 12px; color: var(--color-text-light); }
.kpi--danger .kpi__value { color: var(--color-danger); }

.quick-row { display: flex; flex-wrap: wrap; gap: 8px; }
.quick { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-bg); color: var(--color-text); font-size: 14px; font-weight: 500; }
.quick:hover { background: var(--color-row); }
.quick svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.list-row--block { align-items: flex-start; }
.list-row--block .badge { margin-top: 2px; }
.list-row__desc { display: block; margin-top: 4px; font-size: 13px; color: var(--color-text-muted); overflow-wrap: anywhere; white-space: pre-wrap; }
.list-row__desc .badge { white-space: nowrap; margin-right: 6px; }
.list-row--danger { border-left: 3px solid var(--color-danger); }
.list-row--warning { border-left: 3px solid var(--color-warning); }
.list-row--primary { border-left: 3px solid var(--color-primary); }

.travaux-groups { display: grid; gap: 12px; }
.travaux-group { display: grid; gap: 8px; }
.travaux-group__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 0 2px;
}
.travaux-group__head strong { font-size: 15px; font-weight: 600; }
.travaux-group__head span { color: var(--color-text-light); font-size: 13px; }

.dashboard { max-width: 560px; margin: 0 auto; }
.dashboard--wide { max-width: 980px; }
.dashboard-grid { display: grid; gap: 12px; grid-template-columns: 1fr; }
.dashboard-card { display: grid; gap: 10px; }
.dashboard-more {
    justify-self: flex-start;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 600;
}
.dashboard-more:hover { text-decoration: underline; }
.module-grid { display: grid; gap: 10px; }
.module-tile { display: flex; align-items: center; gap: 14px; padding: 16px; background: var(--color-bg); border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); box-shadow: var(--shadow-card); color: var(--color-text); }
.module-tile:hover { background: var(--color-bg-soft); border-color: var(--color-border); }
.module-tile--disabled { color: var(--color-text-light); opacity: .76; cursor: not-allowed; }
.module-tile--disabled:hover { background: var(--color-bg); border-color: var(--color-border-soft); }
.module-tile--disabled .module-tile__icon { background: var(--color-row); color: var(--color-muted); }
.module-tile__icon { width: 46px; height: 46px; flex: 0 0 auto; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--color-primary-soft); color: var(--color-primary); }
.module-tile__icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.module-tile__body { flex: 1; min-width: 0; }
.module-tile__title { display: block; font-size: 16px; font-weight: 600; }
.module-tile__desc { display: block; margin-top: 2px; font-size: 13px; color: var(--color-text-light); }
.module-tile__chev { color: var(--color-muted); display: inline-flex; flex: 0 0 auto; }
.module-tile__chev svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ascenseur-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.ascenseur-search .btn[disabled] { opacity: .55; cursor: not-allowed; }
.quick-texts { width: 100%; max-width: 100%; margin-top: 8px; }
.field-hint { margin: 6px 0 0; color: var(--color-text-light); font-size: 13px; }
.timeline-list .list-row[hidden],
.ascenseur-row[hidden] { display: none; }
.kpi { position: relative; padding-right: 30px; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease; }
.kpi::after {
    content: "";
    position: absolute;
    top: 14px;
    right: 14px;
    width: 8px;
    height: 8px;
    border-top: 2px solid var(--color-muted);
    border-right: 2px solid var(--color-muted);
    transform: rotate(45deg);
    transition: border-color .14s ease, transform .14s ease;
}
.kpi:hover { border-color: var(--color-border); box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08); transform: translateY(-1px); }
.kpi:hover::after { border-color: var(--color-primary); transform: translateX(2px) rotate(45deg); }

@media (min-width: 992px) {
    .page-stack { gap: 22px; }
    .page-header { padding-bottom: 18px; }
    h1 { font-size: 1.9rem; }
    .page-header__body > p { font-size: 16px; }
    .kpi-grid { gap: 14px; }
    .kpi { padding: 20px 18px; padding-right: 34px; gap: 6px; }
    .kpi::after { top: 18px; right: 18px; }
    .kpi__value { font-size: 30px; }
    .kpi__label { font-size: 14px; }
    .quick { min-height: 46px; padding: 11px 18px; font-size: 15px; }
    .card-header { padding: 16px 22px; }
    .card-body { padding: 20px 22px; }
    .list-section__head { margin-bottom: 12px; }
    .list-stack { gap: 10px; }
    .list-row { padding: 16px 18px; }
    .list-row__title { font-size: 15px; }
    .list-row__desc { font-size: 14px; }
    .spec-grid { gap: 16px 20px; }
    .module-tile { padding: 20px; }
}

@media (min-width: 861px) {
    .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
    .appbar__inner, .app-main, .app-footer__inner { width: min(1080px, calc(100% - 48px)); }
    .page-container { max-width: 1080px; }
}

.toolbar { display: flex; flex-direction: column; gap: 10px; }
.filter-chips { display: flex; gap: 8px; overflow-x: auto; margin: 0; padding: 2px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.filter-chips::-webkit-scrollbar { display: none; }
.chip { flex: 0 0 auto; min-height: 38px; padding: 8px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-pill); background: var(--color-bg); color: var(--color-text-muted); font-size: 14px; font-weight: 500; white-space: nowrap; cursor: pointer; }
.chip:hover { background: var(--color-row); }
.chip--active { border-color: var(--color-primary); background: var(--color-primary-soft); color: #1E40AF; }

.list-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 0 2px; font-size: 13px; color: var(--color-text-light); }
.list-meta strong { color: var(--color-text); font-weight: 600; }

.task-list { display: grid; gap: 8px; }
.task { background: var(--color-bg); border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); box-shadow: var(--shadow-card); padding: 14px 16px; }
.task--danger { border-left: 3px solid var(--color-danger); }
.task--warning { border-left: 3px solid var(--color-warning); }
.task--primary { border-left: 3px solid var(--color-primary); }
.task__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.task__title { margin: 0; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.task__meta { margin-top: 2px; font-size: 13px; color: var(--color-text-light); }
.task__txt { margin: 10px 0 0; font-size: 14px; color: var(--color-text-muted); overflow-wrap: anywhere; white-space: pre-wrap; }
.task__foot { margin-top: 12px; display: flex; justify-content: flex-end; }
.task__foot form { margin: 0; }

@media (min-width: 992px) {
    .task { padding: 16px 18px; }
    .task__title { font-size: 16px; }
    .task__txt { font-size: 15px; }
}

.only-mobile { display: none; }
@media (max-width: 720px) {
    .only-desktop { display: none; }
    .only-mobile { display: block; }
}
.list-row__chev { color: var(--color-muted); display: inline-flex; flex: 0 0 auto; }
.list-row__chev svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.list-row__meta strong { color: var(--color-text); font-weight: 600; }

.rec-list { display: grid; gap: 8px; }
.rec { background: var(--color-bg); border: 1px solid var(--color-border-soft); border-radius: var(--radius-card); box-shadow: var(--shadow-card); padding: 14px 16px; }
.rec__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.rec__title { font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.rec__title a { color: var(--color-primary); }
.rec__amount { flex: 0 0 auto; font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.rec__meta { margin-top: 2px; font-size: 12px; color: var(--color-text-light); }
.rec__grid { margin: 10px 0 0; display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; font-size: 13px; }
.rec__grid dt { color: var(--color-text-light); }
.rec__grid dd { margin: 0; overflow-wrap: anywhere; }
.rec__actions { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.rec__actions form { margin: 0; }
.syndic-doc-rec .rec__actions { justify-content: flex-end; }


.btn-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.btn-row form { margin: 0; }
.drive-btn { width: 100%; }
.drive-btn__ico { display: inline-flex; align-items: center; width: 20px; height: 20px; flex: 0 0 auto; }
.drive-btn__ico svg { width: 20px; height: 20px; display: block; }
/* === Dashboard : encarts épurés (alignés sur la maquette) === */

/* En-tête : titre + compteur sur la même ligne, même sur mobile, sans séparateur */
.dashboard .card-header {
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    border-bottom: 0;
    padding: 14px 16px 4px;
}
.dashboard .card-title { min-width: 0; font-size: 16px; }
.dashboard .card-header .badge { flex: 0 0 auto; font-size: 13px; padding: 2px 10px; }

/* Corps : aperçu en texte simple, fini la "carte dans la carte" */
.dashboard .card-body.dashboard-card { padding: 4px 16px 14px; }
.dashboard-card .list-row {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    gap: 10px;
}
.dashboard-card .list-row:hover { background: transparent; }
.dashboard-card .list-row__icon { display: none; }      /* on retire le rond bleu imbriqué */
.dashboard-card .list-row__title { font-size: 14px; font-weight: 600; }
.dashboard-card .list-row__meta { font-size: 13px; color: var(--color-text-light); }
.dashboard-card .list-row + .list-row {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--color-border-soft);
}
.dashboard-card .list-row form { margin: 0; flex: 0 0 auto; }   /* bouton "Prêt" (admin) aligné à droite */

/* Lien "Voir tout" */
.dashboard-more {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 12px;
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 600;
}
.dashboard-more::after { content: "\2192"; }   /* flèche → */
.dashboard-more:hover { text-decoration: underline; }

/* Admin : grille 2 colonnes + conteneur élargi */
.dashboard--wide { max-width: 980px; }
.dashboard-grid { display: grid; gap: 10px; grid-template-columns: 1fr; }
@media (min-width: 861px) {
    .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
}


/* ====== Page "Ouvrir un ascenseur" — alignement maquette ====== */

.step-hint {
    margin: 0;
    text-align: center;
    color: var(--color-text-light);
    font-size: 13px;
    font-weight: 500;
}

/* Champ de recherche avec loupe intégrée */
.search-field { position: relative; min-width: 0; }
.search-field__icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    color: var(--color-muted);
    pointer-events: none;
}
.search-field input { min-height: 50px; padding-left: 44px; }
.ascenseur-search .search-field input { min-height: 50px; padding-left: 44px; }

/* Bouton scanner QR */
.qr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    min-height: 50px;
    flex: 0 0 auto;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    background: var(--color-bg);
    color: var(--color-primary);
    transition: background-color 140ms ease, border-color 140ms ease;
}
.qr-btn:hover { background: var(--color-row); }
.qr-btn svg { width: 24px; height: 24px; }
.qr-sheet__panel { max-width: 520px; }
.qr-scanner { display: flex; flex-direction: column; gap: 12px; }
.qr-scanner__video {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-card);
    background: #0F172A;
    object-fit: cover;
}
.qr-scanner__status {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 14px;
    line-height: 1.4;
}
.qr-scanner__manual {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}
.qr-scanner__manual input {
    min-width: 0;
    min-height: 44px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-btn);
    padding: 0 12px;
    background: var(--color-bg);
    color: var(--color-text);
}

/* Cartes ascenseur sur 3 lignes (comme la maquette) */
.ascenseur-row .list-row__sub {
    display: block;
    margin-top: 3px;
    font-size: 14px;
    color: var(--color-text-muted);
    overflow-wrap: anywhere;
}
.ascenseur-row .list-row__num {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    color: var(--color-text-light);
}
/* ====== Liste ascenseurs : tableau sur PC, cartes sur mobile ====== */
.ascenseur-cards { display: none; }   /* masqué par défaut → affiché en mobile */

.ascenseur-trow { cursor: pointer; }
.ascenseur-trow:hover { background: var(--color-bg-soft); }
.ascenseur-trow[hidden] { display: none; }
.ascenseur-trow__link { color: var(--color-text); font-weight: 600; }
.ascenseur-trow__link:hover { color: var(--color-primary); }

@media (max-width: 720px) {
    .ascenseur-table { display: none; }       /* on cache le tableau sur mobile */
    .ascenseur-cards { display: grid; gap: 8px; }
}

/* ====== Fiche ascenseur — alignement maquette ====== */

/* Carte identité */
.identity-card .card-body { padding: 16px; }
.identity-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.identity-card__title { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.identity-card__top .badge { flex: 0 0 auto; margin-top: 3px; }
.identity-card__address { margin: 6px 0 0; color: var(--color-text-muted); overflow-wrap: anywhere; }
.identity-card__meta { margin: 4px 0 0; color: var(--color-text-light); font-size: 13px; }

/* Bandeau urgence (carte rouge cliquable) */
.alert-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    border-radius: var(--radius-card);
    background: var(--color-danger-soft);
    color: #991B1B;
}
.alert-card:hover { background: #FBE0E0; }
.alert-card__icon, .alert-card__chev { flex: 0 0 auto; display: inline-flex; color: var(--color-danger); }
.alert-card__icon svg { width: 22px; height: 22px; }
.alert-card__chev svg { width: 18px; height: 18px; }
.alert-card svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.alert-card__text { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }

/* Fiche technique condensée */
.fiche-card .card-body { padding: 14px 16px; }
.fiche-card__label { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-text-light); }
.fiche-card__value { margin: 4px 0 0; font-size: 15px; font-weight: 500; color: var(--color-text); overflow-wrap: anywhere; }

/* Historique regroupé dans une seule carte */
.timeline-card { padding: 0; }
.timeline-entry {
    position: relative;
    display: block;
    padding: 13px 16px;
    border-top: 1px solid var(--color-border-soft);
    color: var(--color-text);
}
a.timeline-entry { padding-right: 42px; }
.timeline-entry:first-child,
.timeline-entry.is-first { border-top: 0; }
.timeline-entry[hidden] { display: none; }
a.timeline-entry:hover { background: var(--color-bg-soft); }
.timeline-entry__head { display: flex; align-items: baseline; gap: 6px; font-size: 13px; }
.timeline-entry__date { color: var(--color-text-light); }
.timeline-entry__sep { color: var(--color-text-light); }
.timeline-entry__type { font-weight: 600; }
.timeline-entry__text { display: block; margin-top: 3px; font-size: 15px; font-weight: 500; overflow-wrap: anywhere; white-space: pre-wrap; }
.timeline-entry__chev {
    position: absolute;
    right: 14px;
    top: 50%;
    display: inline-flex;
    color: var(--color-muted);
    transform: translateY(-50%);
}
.timeline-entry__chev svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Couleurs des types (cohérentes avec les badges de l'app) */
.type--urgence  { color: var(--color-danger); }
.type--afaire   { color: var(--color-warning); }
.type--interne  { color: var(--color-success); }
.type--securite { color: var(--color-primary); }


/* ====== Chantiers — kanban PC + liste filtrable mobile ====== */

/* Toolbar : recherche + bouton Tâches du jour */
.chantiers-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    margin-bottom: 6px;
}
.chantiers-toolbar .search-field {
    min-width: 0;
}
.chantiers-toolbar .search-field input {
    display: block;
    width: 100%;
    min-height: 50px;
    box-sizing: border-box;
    padding-left: 44px;
}
.chantiers-toolbar__cta { margin: 0; justify-self: end; }
.chantiers-toolbar__cta .btn {
    width: auto;
    min-height: 50px;
    min-width: 0;
    padding: 9px 12px;
    font-size: 13px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .chantiers-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
    .chantiers-toolbar__cta { justify-self: end; }
    .chantiers-toolbar__cta .btn {
        width: 54px;
        min-height: 50px;
        padding: 0;
        font-size: 0;
    }
    .chantiers-toolbar__cta .btn > span:not(.btn__icon) { display: none; }
    .chantiers-toolbar__cta .btn .btn__icon svg { width: 24px; height: 24px; }
}

/* Chips : mobile uniquement (sur PC, les colonnes font office de filtre) */
.chantiers-chips { display: none; }
@media (max-width: 860px) { .chantiers-chips { display: flex; } }

/* Kanban board */
.chantiers-board { display: grid; gap: 14px; grid-template-columns: 1fr; }

@media (min-width: 861px) {
    .chantiers-board {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: start;
        gap: 16px;
    }
    /* Ordre visuel PC : À préparer | En cours | Terminé */
    .chantiers-board .board__col[data-col="apreparer"] { order: 1; }
    .chantiers-board .board__col[data-col="encours"]   { order: 2; }
    .chantiers-board .board__col[data-col="termine"]   { order: 3; }
}

/* Colonnes (PC) */
.board__col {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    background: var(--color-bg-soft);
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
}
.board__col-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.board__col-title { margin: 0; font-size: 14px; font-weight: 600; color: var(--color-text-muted); }
.board__col-count { color: var(--color-text-light); font-size: 13px; font-weight: 500; }
.board__col-body { display: flex; flex-direction: column; gap: 10px; }
.board__empty { padding: 14px; font-size: 13px; }
.board__col[hidden] { display: none; }

/* Mobile : on enlève le chrome de colonne, les chantiers actifs forment une liste plate.
   "À préparer" reste visible avec son entête, tout en bas (ordre DOM). */
@media (max-width: 860px) {
    .chantiers-board { gap: 0; }
    .board__col {
        padding: 0;
        background: transparent;
        border: 0;
        gap: 8px;
    }
    .board__col-body { gap: 8px; }
    .board__col[data-col="termine"] { margin-top: 8px; }

    /* Pas d'entête pour En cours / Terminé sur mobile (les chips font le filtre) */
    .board__col[data-col="encours"] .board__col-head,
    .board__col[data-col="termine"] .board__col-head { display: none; }

    /* Bloc "À préparer" séparé visuellement, en bas */
    .board__col[data-col="apreparer"] { margin-top: 18px; }
    .board__col[data-col="apreparer"] .board__col-head {
        padding-top: 14px;
        border-top: 1px solid var(--color-border-soft);
    }
    .board__col[data-col="apreparer"] .board__col-title {
        font-size: 13px;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }
}

/* Cartes chantier */
.chantier-card {
    display: block;
    padding: 12px 14px;
    background: var(--color-bg);
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    color: var(--color-text);
    transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}
a.chantier-card:hover { border-color: var(--color-border); box-shadow: 0 4px 12px rgba(15,23,42,.07); }
.chantier-card[hidden] { display: none; }

.chantier-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.chantier-card__head { min-width: 0; flex: 1; }
.chantier-card__title { font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.chantier-card__sub { margin-top: 2px; font-size: 13px; color: var(--color-text-light); overflow-wrap: anywhere; }
.chantier-card__top > .badge { flex: 0 0 auto; margin-top: 2px; }

/* Barre de progression */
.chantier-progress {
    margin-top: 10px;
    height: 4px;
    background: var(--color-border-soft);
    border-radius: var(--radius-pill);
    overflow: hidden;
}
.chantier-progress__fill {
    height: 100%;
    background: var(--color-primary);
    border-radius: inherit;
    transition: width .3s ease;
}
.chantier-progress__fill--retard { background: var(--color-danger); }
.chantier-progress__fill--done   { background: var(--color-success); }

/* Pied : compteur termes + initiale technicien */
.chantier-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
    font-size: 13px;
    color: var(--color-text-light);
}
.chantier-card__metric { font-weight: 500; }
.chantier-card__tech {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px; height: 26px;
    border-radius: 50%;
    background: var(--color-primary-soft);
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 700;
}

/* Accent retard */
.chantier-card--retard { border-left: 3px solid var(--color-danger); }

/* Carte "À préparer" */
.chantier-card--prep { display: flex; flex-direction: column; gap: 10px; }
.chantier-card__prep-form { margin: 0; }
.btn-prep {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 40px;
    padding: 8px 12px;
    border: 0;
    border-radius: var(--radius-btn);
    background: var(--color-success-soft);
    color: #166534;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 140ms ease;
}
.btn-prep:hover { background: #D8F1E1; }
.btn-prep svg { width: 18px; height: 18px; }
/* ====== Dashboard — alignement maquette ====== */

/* Header : nom + sous-titre, CTA à droite */
.dashboard-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    padding-bottom: 4px;
}
.dashboard-header__body { min-width: 0; flex: 1 1 280px; }
.dashboard-header h1 { margin: 0 0 4px; font-size: clamp(1.4rem, 2.2vw, 1.8rem); }
.dashboard-subtitle { margin: 0; color: var(--color-text-muted); font-size: 14px; }
.dashboard-header__cta { margin: 0; flex: 0 0 auto; }

/* KPI : label au-dessus, valeur en gros en-dessous */
.kpi { padding: 16px 16px; padding-right: 36px; gap: 4px; }
.kpi__label {
    font-size: 12px;
    color: var(--color-text-light);
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}
.kpi__value { font-size: 24px; font-weight: 700; line-height: 1.1; }
.kpi--success .kpi__value { color: var(--color-success); }
.kpi--warning .kpi__value { color: var(--color-warning); }

/* En-tête de carte avec icône tintée à gauche */
.dashboard .card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px 6px;
    border-bottom: 0;
}
.dashboard .card-title { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; }
.dashboard .card-header .badge {
    background: transparent;
    border: 1px solid var(--color-border);
    color: var(--color-text-light);
    font-weight: 600;
    padding: 1px 9px;
}

.card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px; height: 30px;
    border-radius: 8px;
    background: var(--color-bg-soft);
    color: var(--color-text-light);
    flex: 0 0 auto;
}
.card-icon svg { width: 17px; height: 17px; }
.card--danger  .card-icon { background: var(--color-danger-soft);  color: var(--color-danger); }
.card--warning .card-icon { background: var(--color-warning-soft); color: var(--color-warning); }
.card--primary .card-icon { background: var(--color-primary-soft); color: var(--color-primary); }

/* Lignes compactes : nom à gauche, valeur/CTA à droite */
.dashboard-card { padding: 4px 16px 14px; }
.dash-row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 32px;
    padding: 4px 0;
}
.dash-row + .dash-row { border-top: 1px solid var(--color-border-soft); }
.dash-row__name {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dash-row__value {
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text-light);
    font-variant-numeric: tabular-nums;
}
.dash-row__form { margin: 0; flex: 0 0 auto; }

/* Bouton "Prêt" compact inline */
.btn-prep--xs {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px 12px;
    border: 0;
    border-radius: var(--radius-btn);
    background: var(--color-success-soft);
    color: #166534;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 140ms ease;
}
.btn-prep--xs:hover { background: #D8F1E1; }

/* Tuiles 2-up pour compteurs secondaires (Mes tâches / À faire) */
.tile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 14px;
    background: var(--color-bg);
    border: 1px solid var(--color-border-soft);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-card);
    color: var(--color-text);
    transition: background-color 140ms ease;
}
.tile:hover { background: var(--color-bg-soft); }
.tile__icon { color: var(--color-text-light); margin-bottom: 2px; }
.tile__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tile__label { font-size: 13px; color: var(--color-text-light); font-weight: 500; }
.tile__value { font-size: 22px; font-weight: 700; line-height: 1; color: var(--color-text); }

/* Boutons d'action en bas du dashboard mobile (Ouvrir ascenseur / Planning) */
.dashboard-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
}
.dashboard-actions .btn { flex: 1; min-width: 0; min-height: 50px; }
@media (min-width: 861px) {
    .dashboard-actions { justify-content: flex-start; }
    .dashboard-actions .btn { flex: 0 0 auto; min-width: 180px; }
}