﻿
/* GARAGEMANAGEMENT V2 — thème sur mesure, sans framework additionnel.
   Chargé APRES Bootstrap et site.css dans _Layout.cshtml. */
:root {
    --gm-ink: #131f33;
    --gm-muted: #7a8aa0;
    --gm-line: #e5ebf5;
    --gm-blue: #4e76ff;
    --gm-bg: #f3f6fb;
    --gm-sidebar: #0b1425;
}

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    font-size: 15px;
}

body {
    margin: 0;
    min-width: 320px;
    background: var(--gm-bg);
    color: var(--gm-ink);
    font-family: 'Segoe UI Variable','Segoe UI',system-ui,sans-serif;
}

a {
    transition: color .18s ease;
}

/* APPLICATION & SIDEBAR */
.gm-app {
    min-height: 100vh;
}

.gm-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 256px;
    display: flex;
    flex-direction: column;
    padding: 28px 15px 20px;
    z-index: 20;
    overflow-y: auto;
    background: radial-gradient(circle at -30% -15%,rgba(49,83,162,.24),transparent 47%), #0b1425;
    border-right: 1px solid rgba(255,255,255,.065);
}

.gm-brand {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 2px 11px 44px;
    text-decoration: none;
    color: white;
}

    .gm-brand:hover {
        color: white;
    }

.gm-brand-icon {
    display: grid;
    place-items: center;
    flex: none;
    height: 44px;
    width: 44px;
    border-radius: 13px;
    background: linear-gradient(140deg,#6ca5ff,#315ad7);
    box-shadow: 0 6px 22px rgba(44,97,226,.27);
    font-size: 15px;
    font-weight: 850;
    letter-spacing: -.6px;
}

.gm-brand-text {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

    .gm-brand-text strong {
        font-size: 11px;
        white-space: nowrap;
        letter-spacing: -.45px;
    }

        .gm-brand-text strong span {
            color: #a8c4ff;
        }

    .gm-brand-text small {
        color: #8097bc;
        font-size: 9px;
        letter-spacing: 2.3px;
        margin-top: 5px;
    }

.gm-nav-label {
    padding: 0 13px 17px;
    color: #6e839e;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 1.8px;
}

.gm-nav {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.gm-nav-link {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 14px;
    text-decoration: none;
    color: #9daec9;
    border-radius: 12px;
    border: 1px solid transparent;
    font-weight: 600;
    font-size: 13px;
    transition: background .2s,color .2s,border-color .2s,transform .2s;
}

    .gm-nav-link svg {
        flex: none;
        width: 19px;
        height: 19px;
    }

    .gm-nav-link:hover {
        color: #fff;
        background: rgba(255,255,255,.065);
        transform: translateX(2px);
    }

    .gm-nav-link.is-active {
        background: linear-gradient(100deg,#27448a,#244b9f);
        color: #fff;
        border-color: rgba(133,169,255,.20);
        box-shadow: inset 3px 0 0 #90b4ff,0 7px 20px rgba(14,38,98,.18);
    }

.gm-sidebar-bottom {
    margin-top: auto;
    border-top: 1px solid rgba(255,255,255,.08);
    padding: 22px 12px 0;
    font-size: 11px;
    color: #667e9e;
}

.gm-system-status {
    color: #9db2ce;
    margin-bottom: 11px;
}

.gm-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 7px;
    border-radius: 50%;
    background: #3bd9a0;
    box-shadow: 0 0 0 4px rgba(59,217,160,.10);
}

.gm-workspace {
    margin-left: 256px;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.gm-topbar {
    min-height: 88px;
    padding: 18px clamp(20px,3.2vw,50px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--gm-line);
    background: rgba(255,255,255,.95);
}

.gm-eyebrow {
    display: block;
    color: #92a0b2;
    font-size: 10px;
    letter-spacing: 1.9px;
    font-weight: 800;
}

.gm-topbar h2 {
    margin: 6px 0 0;
    color: #142037;
    font-weight: 780;
    letter-spacing: -.7px;
    font-size: 20px;
}

.gm-top-action {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 11px 16px;
    border-radius: 10px;
    background: #3e68eb;
    box-shadow: 0 6px 14px rgba(62,104,235,.17);
    color: white;
    text-decoration: none;
    font-size: 12px;
    font-weight: 750;
}

    .gm-top-action:hover {
        color: white;
        background: #2951ce;
        transform: translateY(-1px);
    }

    .gm-top-action svg {
        width: 17px;
        height: 17px;
    }

.gm-content {
    width: 100%;
    max-width: 1920px;
    flex: 1;
    padding: 26px clamp(20px,3.2vw,50px) 54px;
}

    .gm-content > .container {
        max-width: none;
        margin-top: 0 !important;
    }

.gm-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px clamp(20px,3.2vw,50px);
    font-size: 11px;
    color: #90a0b5;
    border-top: 1px solid var(--gm-line);
}

    .gm-footer a {
        color: #70849f;
        text-decoration: none;
    }

        .gm-footer a:hover {
            color: #3f65d6;
        }

/* VUES CRUD EXISTANTES — harmonisation sans changement de HTML */
.gm-content .card {
    border: 1px solid var(--gm-line) !important;
    border-radius: 19px !important;
    box-shadow: 0 8px 24px rgba(20,37,69,.035) !important;
}

.gm-content .table {
    font-size: 13px;
}

    .gm-content .table thead th {
        background: #f6f8fc;
        color: #71819a;
        padding: 15px 12px;
        font-size: 11px;
        letter-spacing: .35px;
        border-bottom: 1px solid var(--gm-line);
    }

    .gm-content .table tbody td {
        padding: 15px 12px;
        color: #31425a;
        border-color: #ebeff6;
    }

.gm-content .table-hover tbody tr:hover td {
    background: #f8faff;
}

.gm-content .btn {
    border-radius: 9px;
    font-weight: 600;
}

.gm-content .btn-primary {
    background: #426ef1;
    border-color: #426ef1;
}

    .gm-content .btn-primary:hover {
        background: #2d55d1;
        border-color: #2d55d1;
    }

.gm-content .form-control, .gm-content .form-select {
    padding: 11px 13px;
    border: 1px solid #dce5f1;
    border-radius: 10px;
}

    .gm-content .form-control:focus, .gm-content .form-select:focus {
        border-color: #6990fe;
        box-shadow: 0 0 0 3px rgba(70,114,249,.12);
    }

/* DASHBOARD V2 */
.dash-v2 {
    --text: #17243b;
    --muted: #8996a9;
}

.dash-page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 2px 0 26px;
}

.dash-kicker {
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: 1.7px;
    font-size: 10px;
    font-weight: 850;
    color: #758eae;
}

.dash-live-dot {
    width: 7px;
    height: 7px;
    flex: none;
    border-radius: 50%;
    background: #24bd90;
    box-shadow: 0 0 0 4px rgba(36,189,144,.1);
}

.dash-page-heading h1 {
    margin: 10px 0 7px;
    color: var(--text);
    font-size: clamp(25px,2.55vw,36px);
    font-weight: 780;
    line-height: 1.18;
    letter-spacing: -1.4px;
}

    .dash-page-heading h1 span {
        color: #6481b7;
    }

.dash-page-heading p {
    color: #8390a5;
    font-size: 13px;
    margin: 0;
}

.dash-today {
    flex: none;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #6a7e9b;
    border: 1px solid #e6ebf3;
    background: #fff;
    padding: 11px 15px;
    border-radius: 11px;
    font-size: 12px;
    text-transform: capitalize;
}

    .dash-today svg {
        width: 17px;
        height: 17px;
        color: #577eec;
    }

/* BANNIÈRE PREMIUM */
.dash-banner {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0,1.18fr) minmax(260px,.82fr);
    overflow: hidden;
    border-radius: 23px;
    min-height: 285px;
    background: linear-gradient(115deg,#101c30 6%,#1d365d 72%,#254884 100%);
    color: white;
    box-shadow: 0 18px 38px rgba(21,48,93,.14);
}

    .dash-banner::after {
        content: "";
        pointer-events: none;
        position: absolute;
        inset: 0;
        z-index: -1;
        opacity: .20;
        background: radial-gradient(circle at 82% 25%,#4b8efe,transparent 37%);
    }

.dash-banner-pattern {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .19;
    background-image: linear-gradient(rgba(220,235,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(220,235,255,.12) 1px,transparent 1px);
    background-size: 35px 35px;
    mask-image: linear-gradient(to left,#000,transparent 70%);
}

.dash-banner-content {
    position: relative;
    padding: 33px 20px 35px clamp(26px,3vw,44px);
    z-index: 1;
}

.dash-banner-eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 23px;
    color: #b8d2fd;
    font-size: 10px;
    letter-spacing: 1.5px;
    font-weight: 800;
}

    .dash-banner-eyebrow span {
        width: 18px;
        height: 2px;
        background: #76e4b3;
    }

.dash-banner h2 {
    max-width: 700px;
    font-size: clamp(27px,2.8vw,42px);
    line-height: 1.15;
    letter-spacing: -1.2px;
    margin: 0 0 14px;
    font-weight: 800;
}

    .dash-banner h2 em {
        color: #a8ebce;
        font-style: normal;
    }

.dash-banner p {
    max-width: 475px;
    font-size: 13px;
    line-height: 1.65;
    color: #b7c8df;
    margin: 0 0 25px;
}

.dash-banner-buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.dash-cta-main, .dash-cta-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 11px 15px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 780;
    transition: transform .18s,background .18s;
}

.dash-cta-main {
    background: #c3f3da;
    color: #123c35;
}

    .dash-cta-main:hover {
        background: #e0fff0;
        color: #123c35;
        transform: translateY(-2px);
    }

.dash-cta-ghost {
    border: 1px solid rgba(231,241,255,.30);
    color: #dce7fd;
    background: rgba(255,255,255,.05);
}

    .dash-cta-ghost:hover {
        background: rgba(255,255,255,.13);
        color: #fff;
    }

    .dash-cta-main svg, .dash-cta-ghost svg {
        width: 15px;
        height: 15px;
    }

.dash-banner-aside {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 35px 27px;
    min-width: 0;
}

.dash-car-art {
    position: absolute;
    right: 2%;
    top: 14px;
    width: min(96%,405px);
    height: auto;
    color: #8ab3f2;
    opacity: .24;
}

.dash-mini-overview {
    position: relative;
    margin-top: 110px;
    width: min(100%,320px);
    padding: 17px 20px;
    border-radius: 15px;
    background: rgba(255,255,255,.095);
    border: 1px solid rgba(224,237,255,.16);
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 25px rgba(0,0,0,.07);
}

.dash-mini-caption {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 9px;
    font-weight: 780;
    letter-spacing: 1.3px;
    color: #afc6e8;
}

.dash-mini-pulse {
    width: 7px;
    height: 7px;
    background: #6de5ad;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(109,229,173,.14);
}

.dash-mini-number {
    font-weight: 800;
    font-size: 34px;
    letter-spacing: -1.4px;
    line-height: 1.4;
}

    .dash-mini-number span {
        font-size: 13px;
        font-weight: 500;
        color: #b6c6e1;
        letter-spacing: 0;
    }

.dash-mini-divider {
    height: 1px;
    background: rgba(255,255,255,.17);
    margin: 8px 0 13px;
}

.dash-mini-bottom {
    display: flex;
    justify-content: space-between;
    color: #bdd0eb;
    font-size: 11px;
}

    .dash-mini-bottom strong {
        color: #bff4d9;
        font-size: 13px;
    }

/* STATISTIQUES */
.dash-kpi-section, .dash-actions-section {
    margin-top: 33px;
}

.dash-section-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 16px;
}

    .dash-section-title h2 {
        margin: 0;
        color: #1b2a41;
        font-size: 17px;
        font-weight: 800;
        letter-spacing: -.45px;
    }

    .dash-section-title > span {
        color: #91a0b1;
        font-size: 11px;
    }

.dash-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 15px;
}

.dash-kpi {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 160px;
    padding: 20px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    border: 1px solid #e6ebf3;
    border-radius: 17px;
    box-shadow: 0 6px 18px rgba(23,45,77,.035);
    transition: transform .2s,border-color .2s,box-shadow .2s;
}

    .dash-kpi:hover {
        color: inherit;
        transform: translateY(-3px);
        border-color: #c4d5fa;
        box-shadow: 0 15px 28px rgba(23,45,77,.09);
    }

.dash-kpi-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    color: #74849b;
    font-size: 12px;
    font-weight: 620;
}

.dash-kpi-icon {
    display: grid;
    place-items: center;
    flex: none;
    width: 36px;
    height: 36px;
    border-radius: 11px;
}

    .dash-kpi-icon svg {
        width: 19px;
        height: 19px;
    }

.dash-kpi-blue .dash-kpi-icon {
    background: #e8efff;
    color: #4770ef;
}

.dash-kpi-purple .dash-kpi-icon {
    background: #f1ebff;
    color: #8c68e5;
}

.dash-kpi-amber .dash-kpi-icon {
    background: #fff1db;
    color: #d78b20;
}

.dash-kpi-green .dash-kpi-icon {
    background: #e0f7ec;
    color: #1faa7c;
}

.dash-kpi-value {
    font-size: 37px;
    font-weight: 800;
    line-height: 1.1;
    color: #14223a;
    margin: 7px 0 14px;
    letter-spacing: -1.3px;
}

.dash-kpi-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f0f3f8;
    font-size: 11px;
    color: #8798ad;
}

    .dash-kpi-foot span {
        font-size: 16px;
        color: #557af0;
    }

/* PANNEAUX ET TABLEAU */
.dash-main-grid {
    margin-top: 23px;
    display: grid;
    grid-template-columns: minmax(0,1.65fr) minmax(290px,.9fr);
    gap: 18px;
    align-items: start;
}

.dash-panel {
    min-width: 0;
    background: #fff;
    border: 1px solid #e7ecf4;
    border-radius: 19px;
    box-shadow: 0 6px 20px rgba(23,45,77,.035);
}

.dash-panel-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 24px 25px 16px;
}

.dash-panel-kicker {
    font-size: 9px;
    font-weight: 850;
    color: #8a9cba;
    letter-spacing: 1.8px;
    margin-bottom: 7px;
}

.dash-panel-heading h2, .dash-finance-panel h2 {
    margin: 0 0 5px;
    font-size: 17px;
    font-weight: 810;
    letter-spacing: -.55px;
    color: #1b2b42;
}

.dash-panel-heading p {
    margin: 0;
    font-size: 11px;
    color: #93a0b2;
}

.dash-subtle-link {
    flex: none;
    padding: 8px 10px;
    color: #456eec;
    font-size: 11px;
    font-weight: 750;
    text-decoration: none;
    background: #f0f5ff;
    border-radius: 9px;
}

    .dash-subtle-link:hover {
        color: #234bc9;
        background: #e4edff;
    }

    .dash-subtle-link span {
        margin-left: 4px;
    }

.dash-table-scroll {
    overflow-x: auto;
    padding: 0 15px 20px;
}

.dash-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 570px;
}

    .dash-table th {
        padding: 13px 10px;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .5px;
        color: #8b9bb1;
        text-align: left;
        border-bottom: 1px solid #e8eef5;
        background: #f8fafd;
    }

    .dash-table td {
        padding: 16px 10px;
        border-bottom: 1px solid #edf1f7;
        font-size: 12px;
        vertical-align: middle;
    }

    .dash-table tbody tr:last-child td {
        border-bottom: none;
    }

.dash-table-primary {
    font-weight: 730;
    color: #243650;
}

.dash-table-secondary {
    margin-top: 4px;
    font-size: 10px;
    color: #98a5b8;
}

.dash-table-price {
    text-align: right;
    font-weight: 820;
    white-space: nowrap;
    color: #273850;
}

.dash-table th:last-child {
    text-align: right;
}

.dash-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 9px;
    white-space: nowrap;
    border-radius: 7px;
    font-weight: 750;
    font-size: 10px;
}

    .dash-status > span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: currentColor;
    }

    .dash-status.is-done {
        color: #128262;
        background: #e0f7ed;
    }

    .dash-status.is-active {
        color: #ac7018;
        background: #fff1d9;
    }

    .dash-status.is-waiting {
        color: #748298;
        background: #eef2f7;
    }

.dash-empty {
    text-align: center;
    padding: 35px 18px 45px;
    color: #7e90a7;
}

.dash-empty-icon {
    font-size: 37px;
    color: #aebcd0;
}

.dash-empty strong {
    display: block;
    color: #34445c;
    margin: 7px 0;
}

.dash-empty p {
    font-size: 12px;
}

.dash-empty a {
    color: #4069df;
    font-size: 12px;
    font-weight: 700;
}

/* DONUT ET VALORISATION */
.dash-side-stack {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}

.dash-status-layout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    padding: 5px 19px 25px;
}

.dash-donut {
    flex: none;
    display: grid;
    place-items: center;
    width: 142px;
    height: 142px;
    border-radius: 50%;
    box-shadow: 0 5px 15px rgba(29,49,78,.055);
}

.dash-donut-core {
    width: 106px;
    height: 106px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #fff;
}

    .dash-donut-core strong {
        color: #1e2c45;
        font-size: 28px;
        line-height: 1.05;
        font-weight: 850;
    }

    .dash-donut-core span {
        font-size: 10px;
        color: #8797ae;
        margin-top: 4px;
    }

.dash-status-legend {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 13px;
    min-width: 110px;
}

    .dash-status-legend > div {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 11px;
        color: #75849b;
    }

    .dash-status-legend strong {
        margin-left: auto;
        color: #263c56;
        font-size: 12px;
    }

.dash-legend-mark {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 3px;
}

    .dash-legend-mark.is-green {
        background: #29b994;
    }

    .dash-legend-mark.is-blue {
        background: #5d83ff;
    }

    .dash-legend-mark.is-grey {
        background: #d5deeb;
    }

.dash-finance-panel {
    padding: 24px 25px;
    background: linear-gradient(145deg,#fff 0%,#f9fbff 100%);
}

    .dash-finance-panel h2 {
        margin-bottom: 17px;
    }

.dash-finance-value {
    font-size: clamp(25px,2vw,35px);
    font-weight: 850;
    letter-spacing: -1.2px;
    color: #1c3150;
    white-space: nowrap;
}

    .dash-finance-value span {
        font-size: 19px;
        color: #7a92b4;
    }

.dash-finance-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border-top: 1px solid #e8edf5;
    padding-top: 17px;
    margin-top: 18px;
}

    .dash-finance-note svg {
        flex: none;
        width: 17px;
        height: 17px;
        color: #8099c1;
    }

    .dash-finance-note p {
        margin: 0;
        font-size: 11px;
        line-height: 1.55;
        color: #8c9bb0;
    }

/* ACTIONS RAPIDES */
.dash-actions-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 15px;
}

.dash-action {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 18px 17px;
    background: #fff;
    border: 1px solid #e7ecf4;
    border-radius: 15px;
    text-decoration: none;
    color: #1c2e46;
    transition: transform .2s,border-color .2s,box-shadow .2s;
}

    .dash-action:hover {
        color: #1c2e46;
        transform: translateY(-2px);
        border-color: #b8c9f1;
        box-shadow: 0 10px 22px rgba(26,52,93,.07);
    }

.dash-action-symbol {
    display: grid;
    place-items: center;
    flex: none;
    width: 42px;
    height: 42px;
    border: 1px solid #e1e9f9;
    border-radius: 12px;
    background: #f4f7ff;
    color: #5174d5;
    font-size: 12px;
    font-weight: 850;
}

.dash-action > span:nth-child(2) {
    min-width: 0;
}

.dash-action strong, .dash-action small {
    display: block;
}

.dash-action strong {
    font-size: 12px;
    font-weight: 780;
}

.dash-action small {
    margin-top: 5px;
    color: #8c9bb0;
    line-height: 1.4;
    font-size: 10px;
}

.dash-action-arrow {
    margin-left: auto;
    font-size: 16px;
    color: #839bcb;
}

@media(max-width:1280px) {
    .dash-kpi-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .dash-banner {
        grid-template-columns: minmax(0,1fr) minmax(250px,.7fr);
    }

    .dash-main-grid {
        grid-template-columns: minmax(0,1.2fr) minmax(285px,.8fr);
    }

    .dash-status-layout {
        flex-direction: column;
    }

    .dash-status-legend {
        width: 100%;
    }
}

@media(max-width:1080px) {
    .dash-banner {
        grid-template-columns: 1fr;
    }

    .dash-banner-aside {
        display: none;
    }

    .dash-main-grid {
        grid-template-columns: 1fr;
    }

    .dash-status-layout {
        flex-direction: row;
    }

    .dash-actions-grid {
        grid-template-columns: 1fr;
    }
}

@media(max-width:900px) {
    .gm-sidebar {
        position: relative;
        inset: auto;
        width: 100%;
        padding: 13px 15px;
    }

    .gm-brand {
        padding: 5px 7px 13px;
    }

    .gm-nav-label, .gm-sidebar-bottom {
        display: none;
    }

    .gm-nav {
        flex-direction: row;
        gap: 5px;
        overflow-x: auto;
    }

    .gm-nav-link {
        white-space: nowrap;
        padding: 10px 11px;
        font-size: 11px;
    }

        .gm-nav-link svg {
            width: 16px;
            height: 16px;
        }

    .gm-workspace {
        margin-left: 0;
    }

    .gm-topbar {
        min-height: 72px;
        padding: 15px 20px;
    }

    .gm-content {
        padding: 22px 16px 42px;
    }

    .gm-footer {
        padding: 20px 16px;
    }

    .dash-banner-aside {
        display: flex;
    }

    .dash-banner {
        grid-template-columns: minmax(0,1.15fr) minmax(230px,.85fr);
    }
}

@media(max-width:720px) {
    .dash-page-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dash-banner {
        display: block;
    }

    .dash-banner-aside {
        display: none;
    }

    .dash-banner-content {
        padding: 27px 23px 30px;
    }

    .dash-kpi-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .dash-section-title {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}

@media(max-width:500px) {
    .gm-topbar h2 {
        font-size: 16px;
    }

    .gm-top-action {
        padding: 10px;
    }

        .gm-top-action span {
            display: none;
        }

    .dash-page-heading h1 {
        font-size: 26px;
    }

    .dash-banner h2 {
        font-size: 28px;
    }

    .dash-kpi {
        padding: 15px;
        min-height: 140px;
    }

    .dash-kpi-top {
        font-size: 11px;
    }

    .dash-kpi-icon {
        width: 29px;
        height: 29px;
    }

        .dash-kpi-icon svg {
            width: 16px;
            height: 16px;
        }

    .dash-kpi-value {
        font-size: 30px;
    }

    .dash-kpi-foot {
        font-size: 10px;
    }

    .dash-status-layout {
        flex-direction: column;
    }

    .dash-panel-heading {
        padding: 21px 18px 12px;
    }

    .dash-table-scroll {
        padding: 0 10px 15px;
    }
}

@media(prefers-reduced-motion:reduce) {
    *, *::before, *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* =========================================
   GARAGEMANAGEMENT - MODE DEMONSTRATION
========================================= */

.gm-demo-notice {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 15px 35px;
    background: #eaf2ff;
    border-bottom: 1px solid #d5e3fa;
    color: #40618f;
    font-size: 12px;
    line-height: 1.6;
}

    .gm-demo-notice strong {
        display: inline-flex;
        align-items: center;
        padding: 5px 11px;
        border-radius: 7px;
        background: #d6e6ff;
        color: #2353a0;
        font-weight: 800;
        white-space: nowrap;
    }

/* Masquer les actions d'administration */

.gm-public-demo .gm-top-action,
.gm-public-demo .dash-cta-main,
.gm-public-demo .dash-actions-section,
.gm-public-demo a[href*="/Create" i],
.gm-public-demo a[href*="/Edit" i],
.gm-public-demo a[href*="/Delete" i] {
    display: none !important;
}

@media (max-width: 600px) {
    .gm-demo-notice {
        padding: 13px 18px;
    }
}

