/* /Components/AppIcon.razor.rz.scp.css */
.app-icon[b-lwunaf3mfm] {
    display: block;
    flex-shrink: 0;
}
/* /Components/ErrorNotice.razor.rz.scp.css */
.error-notice[b-cha9ih6sm1] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-3);
    padding: var(--mp-space-4);
    background-color: var(--mp-badge-rupture-bg);
    border: 0.5px solid var(--mp-danger);
    border-radius: var(--mp-radius-lg);
}

.err-icon[b-cha9ih6sm1] { font-size: 22px; }
.err-text[b-cha9ih6sm1] { display: flex; flex-direction: column; flex: 1; gap: 1px; }
.err-title[b-cha9ih6sm1] { font-weight: 600; color: var(--mp-badge-rupture-tx); }
/* /Components/MpBadge.razor.rz.scp.css */
.mp-badge[b-tj9k6xq7mu] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.mp-badge-icon[b-tj9k6xq7mu] { font-size: 1em; }

.mp-badge-stock[b-tj9k6xq7mu]    { background-color: var(--mp-badge-stock-bg);   color: var(--mp-badge-stock-tx); }
.mp-badge-promo[b-tj9k6xq7mu]    { background-color: var(--mp-badge-promo-bg);   color: var(--mp-badge-promo-tx); }
.mp-badge-verified[b-tj9k6xq7mu] { background-color: var(--mp-badge-verif-bg);   color: var(--mp-badge-verif-tx); }
.mp-badge-rupture[b-tj9k6xq7mu]  { background-color: var(--mp-badge-rupture-bg); color: var(--mp-badge-rupture-tx); }
.mp-badge-neutral[b-tj9k6xq7mu]  { background-color: var(--mp-surface-2);        color: var(--mp-text-muted); }
/* /Components/MpButton.razor.rz.scp.css */
.mp-btn[b-qizi0ro61x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--mp-space-2);
    font-family: var(--mp-font-sans);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    padding: 12px 20px;
    min-height: 44px; /* zone tactile minimale (charte) */
    border-radius: var(--mp-radius-md);
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
    text-decoration: none;
}

.mp-btn-block[b-qizi0ro61x] { width: 100%; }
.mp-btn-icon[b-qizi0ro61x] { font-size: 1.05em; line-height: 1; }

/* Action — vert d'achat */
.mp-btn-action[b-qizi0ro61x] { background-color: var(--mp-action); color: #fff; }
.mp-btn-action:hover[b-qizi0ro61x] { background-color: var(--mp-action-hover); }

/* Primaire — bleu de marque */
.mp-btn-primary[b-qizi0ro61x] { background-color: var(--mp-primary); color: #fff; }
.mp-btn-primary:hover[b-qizi0ro61x] { background-color: var(--mp-primary-hover); }

/* Secondaire — contour bleu */
.mp-btn-secondary[b-qizi0ro61x] { background-color: transparent; color: var(--mp-primary); border-color: var(--mp-primary); }
.mp-btn-secondary:hover[b-qizi0ro61x] { background-color: var(--mp-primary-light); }

/* Tertiaire — texte seul */
.mp-btn-tertiary[b-qizi0ro61x] { background-color: transparent; color: var(--mp-primary); padding-left: 8px; padding-right: 8px; min-height: auto; }
.mp-btn-tertiary:hover[b-qizi0ro61x] { color: var(--mp-primary-hover); text-decoration: underline; }

/* Danger — rouge */
.mp-btn-danger[b-qizi0ro61x] { background-color: var(--mp-danger); color: #fff; }
.mp-btn-danger:hover[b-qizi0ro61x] { background-color: #C53B3A; }

/* Désactivé */
.mp-btn:disabled[b-qizi0ro61x] {
    background-color: var(--mp-disabled);
    color: var(--mp-text-muted);
    border-color: transparent;
    cursor: not-allowed;
}
.mp-btn-tertiary:disabled[b-qizi0ro61x], .mp-btn-secondary:disabled[b-qizi0ro61x] { background-color: transparent; }
/* /Components/MpCard.razor.rz.scp.css */
.mp-card[b-o5tqf645k4] {
    background-color: var(--mp-surface);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-lg);
    overflow: hidden;
}

.mp-card-header[b-o5tqf645k4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--mp-space-4);
    padding: var(--mp-space-4) var(--mp-space-4) 0 var(--mp-space-4);
}

.mp-card-title[b-o5tqf645k4] { font-size: 18px; font-weight: 600; color: var(--mp-primary-dark); }
.mp-card-subtitle[b-o5tqf645k4] { font-size: 13px; color: var(--mp-text-muted); margin: 2px 0 0 0; }

.mp-card-body[b-o5tqf645k4] { padding: var(--mp-space-4); }

/* Variante sans padding interne (ex. tableaux pleine largeur) */
.mp-card-flush .mp-card-body[b-o5tqf645k4] { padding: 0; }
.mp-card-flush .mp-card-header[b-o5tqf645k4] { padding-bottom: var(--mp-space-4); border-bottom: 0.5px solid var(--mp-border); }
/* /Components/MpModal.razor.rz.scp.css */
.modal-overlay[b-1ws28j4xa1] {
    position: fixed;
    inset: 0;
    background-color: rgba(4, 44, 83, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--mp-space-4);
    z-index: 1000;
}

.modal-card[b-1ws28j4xa1] {
    background-color: var(--mp-surface);
    border-radius: var(--mp-radius-xl);
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(4, 44, 83, 0.25);
}

.modal-head[b-1ws28j4xa1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mp-space-4);
    padding: var(--mp-space-4) var(--mp-space-6);
    border-bottom: 0.5px solid var(--mp-border);
}
.modal-head h2[b-1ws28j4xa1] { font-size: 20px; font-weight: 600; color: var(--mp-primary-dark); }

.modal-close[b-1ws28j4xa1] {
    appearance: none;
    border: none;
    background: none;
    cursor: pointer;
    font-size: 18px;
    color: var(--mp-text-muted);
    width: 32px;
    height: 32px;
    border-radius: var(--mp-radius-md);
}
.modal-close:hover[b-1ws28j4xa1] { background-color: var(--mp-surface-2); color: var(--mp-text); }

.modal-body[b-1ws28j4xa1] {
    padding: var(--mp-space-6);
    overflow-y: auto;
}

.modal-foot[b-1ws28j4xa1] {
    display: flex;
    justify-content: flex-end;
    gap: var(--mp-space-2);
    padding: var(--mp-space-4) var(--mp-space-6);
    border-top: 0.5px solid var(--mp-border);
}
/* /Components/NotFoundView.razor.rz.scp.css */
.nf-wrap[b-udnkm2hfdk] {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--mp-space-6);
}
.nf-card[b-udnkm2hfdk] {
    width: 100%;
    max-width: 420px;
    text-align: center;
    background-color: var(--mp-surface);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-xl);
    padding: var(--mp-space-8);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mp-space-3);
}
.nf-badge[b-udnkm2hfdk] {
    font-size: 56px;
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1;
    color: var(--mp-primary);
}
.nf-card h1[b-udnkm2hfdk] { font-size: 22px; margin: 0; }
.nf-text[b-udnkm2hfdk] { color: var(--mp-text-muted); font-size: 15px; margin: 0; }
.nf-actions[b-udnkm2hfdk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mp-space-2);
    justify-content: center;
    margin-top: var(--mp-space-2);
}
.nf-btn[b-udnkm2hfdk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border-radius: var(--mp-radius-md);
    border: 1px solid var(--mp-border);
    background-color: var(--mp-surface);
    color: var(--mp-text);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
}
.nf-btn:hover[b-udnkm2hfdk] { border-color: var(--mp-primary); }
.nf-btn-primary[b-udnkm2hfdk] {
    background-color: var(--mp-primary);
    border-color: var(--mp-primary);
    color: #fff;
}
.nf-btn-primary:hover[b-udnkm2hfdk] { background-color: var(--mp-primary-dark); border-color: var(--mp-primary-dark); }
/* /Components/PageHeader.razor.rz.scp.css */
.page-header[b-5njvhcto8n] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--mp-space-4);
    flex-wrap: wrap;
    margin-bottom: var(--mp-space-6);
}

.page-subtitle[b-5njvhcto8n] {
    font-size: 16px;
    color: var(--mp-text-muted);
    margin: var(--mp-space-1) 0 0 0;
}

.page-actions[b-5njvhcto8n] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    flex-wrap: wrap;
}
/* /Components/SalesChart.razor.rz.scp.css */
.chart[b-3abzbu5t36] { width: 100%; }

.chart-bars[b-3abzbu5t36] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--mp-space-2);
    height: 200px;
}

.chart-col[b-3abzbu5t36] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mp-space-2);
    flex: 1;
    height: 100%;
}

.chart-bar-wrap[b-3abzbu5t36] {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
}

.chart-bar-value[b-3abzbu5t36] {
    font-size: 11px;
    color: var(--mp-text-muted);
}

.chart-bar[b-3abzbu5t36] {
    width: 70%;
    max-width: 42px;
    background-color: var(--mp-primary-light);
    border-radius: var(--mp-radius-md) var(--mp-radius-md) 0 0;
    transition: height .3s ease;
    min-height: 4px;
}

/* La meilleure journée ressort en bleu de marque */
.chart-bar.is-max[b-3abzbu5t36] { background-color: var(--mp-primary); }

.chart-label[b-3abzbu5t36] {
    font-size: 13px;
    color: var(--mp-text-muted);
}
/* /Components/StatCard.razor.rz.scp.css */
.stat-card[b-xd8gd7o8wc] {
    background-color: var(--mp-surface);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-lg);
    padding: var(--mp-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--mp-space-2);
    height: 100%;
}

.stat-top[b-xd8gd7o8wc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.stat-label[b-xd8gd7o8wc] { font-size: 13px; color: var(--mp-text-muted); }
.stat-icon[b-xd8gd7o8wc] { font-size: 18px; }

.stat-value[b-xd8gd7o8wc] {
    font-size: 28px;
    font-weight: 600;
    color: var(--mp-primary-dark);
}

.stat-foot[b-xd8gd7o8wc] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    flex-wrap: wrap;
}

.stat-trend[b-xd8gd7o8wc] { font-size: 13px; font-weight: 600; }
.stat-trend.up[b-xd8gd7o8wc]   { color: var(--mp-action); }
.stat-trend.down[b-xd8gd7o8wc] { color: var(--mp-danger); }
.stat-sub[b-xd8gd7o8wc] { font-size: 13px; color: var(--mp-text-muted); }
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-5ci9w5qbqp] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-5ci9w5qbqp] {
    flex: 1;
    min-width: 0;
    background-color: var(--mp-bg);
}

.sidebar[b-5ci9w5qbqp] {
    background-color: var(--mp-surface);
    border-right: 0.5px solid var(--mp-border);
}

/* ============================================================
   Topbar
   ============================================================ */
.top-row[b-5ci9w5qbqp] {
    background-color: var(--mp-surface);
    border-bottom: 0.5px solid var(--mp-border);
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mp-space-4);
    padding: 0 var(--mp-space-6);
}

/* --- Marque (affichée dans la topbar en mobile uniquement) --- */
.top-brand[b-5ci9w5qbqp] { display: none; align-items: center; gap: var(--mp-space-2); text-decoration: none; min-width: 0; }
.top-brand:hover[b-5ci9w5qbqp] { text-decoration: none; }
.top-brand-logo[b-5ci9w5qbqp] { width: 1.9rem; height: 1.9rem; border-radius: var(--mp-radius-md); flex-shrink: 0; }
.top-brand-name[b-5ci9w5qbqp] { font-size: 1rem; font-weight: 700; color: var(--mp-text); white-space: nowrap; }
.top-brand-pro[b-5ci9w5qbqp] { color: var(--mp-primary); margin-left: 4px; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; }

/* --- Recherche --- */
.top-search[b-5ci9w5qbqp] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    background-color: var(--mp-surface-2);
    border: 1px solid var(--mp-border);
    border-radius: 999px;
    padding: 0 var(--mp-space-3);
    height: 2.25rem;
    flex: 1;
    max-width: 420px;
}
.top-search-ico[b-5ci9w5qbqp] { font-size: 14px; color: var(--mp-text-muted); }
.top-search-input[b-5ci9w5qbqp] {
    border: none;
    outline: none;
    background: transparent;
    font-family: var(--mp-font-sans);
    font-size: 14px;
    color: var(--mp-text);
    width: 100%;
}
.top-search-input[b-5ci9w5qbqp]::placeholder { color: var(--mp-text-muted); }

/* --- Actions à droite --- */
.top-actions[b-5ci9w5qbqp] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-3);
    flex-shrink: 0;
}

.top-verif[b-5ci9w5qbqp] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    color: var(--mp-badge-verif-tx);
    background-color: var(--mp-badge-verif-bg);
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.top-icon[b-5ci9w5qbqp] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--mp-radius-md);
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1rem;
    color: var(--mp-text);
    text-decoration: none;
}
.top-icon:hover[b-5ci9w5qbqp] { background-color: var(--mp-surface-2); text-decoration: none; }

.top-dot[b-5ci9w5qbqp] {
    position: absolute;
    top: 5px;
    right: 6px;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background-color: var(--mp-danger);
    border: 1.5px solid var(--mp-surface);
}

.top-avatar[b-5ci9w5qbqp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background-color: var(--mp-primary);
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    text-decoration: none;
}
.top-avatar:hover[b-5ci9w5qbqp] { color: #fff; text-decoration: none; }

/* --- Panneau des notifications --- */
.notif-wrap[b-5ci9w5qbqp] { position: relative; display: inline-flex; }

.notif-backdrop[b-5ci9w5qbqp] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

.notif-panel[b-5ci9w5qbqp] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 50;
    width: 340px;
    max-width: calc(100vw - 2rem);
    background-color: var(--mp-surface);
    border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-lg);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.notif-head[b-5ci9w5qbqp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mp-space-2);
    padding: var(--mp-space-3) var(--mp-space-4);
    border-bottom: 0.5px solid var(--mp-border);
}
.notif-title[b-5ci9w5qbqp] { font-size: 14px; font-weight: 600; color: var(--mp-text); }
.notif-mark-all[b-5ci9w5qbqp] {
    border: none;
    background: transparent;
    color: var(--mp-primary);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
}
.notif-mark-all:hover[b-5ci9w5qbqp] { color: var(--mp-primary-hover); text-decoration: underline; }

.notif-list[b-5ci9w5qbqp] { max-height: 380px; overflow-y: auto; }

.notif-empty[b-5ci9w5qbqp] {
    padding: var(--mp-space-6) var(--mp-space-4);
    text-align: center;
    font-size: 13px;
    color: var(--mp-text-muted);
}

.notif-item[b-5ci9w5qbqp] {
    display: flex;
    align-items: flex-start;
    gap: var(--mp-space-2);
    width: 100%;
    text-align: left;
    border: none;
    background: transparent;
    cursor: pointer;
    padding: var(--mp-space-3) var(--mp-space-4);
    border-bottom: 0.5px solid var(--mp-border);
}
.notif-item:last-child[b-5ci9w5qbqp] { border-bottom: none; }
.notif-item:hover[b-5ci9w5qbqp] { background-color: var(--mp-surface-2); }
.notif-item.unread[b-5ci9w5qbqp] { background-color: var(--mp-primary-light); }
.notif-item.unread:hover[b-5ci9w5qbqp] { background-color: var(--mp-primary-light); }

.notif-item-dot[b-5ci9w5qbqp] {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    margin-top: 6px;
    border-radius: 999px;
    background-color: transparent;
}
.notif-item.unread .notif-item-dot[b-5ci9w5qbqp] { background-color: var(--mp-primary); }

.notif-item-body[b-5ci9w5qbqp] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.notif-item-title[b-5ci9w5qbqp] { font-size: 13px; font-weight: 600; color: var(--mp-text); }
.notif-item-msg[b-5ci9w5qbqp] {
    font-size: 12px;
    color: var(--mp-text);
    opacity: 0.85;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.notif-item-time[b-5ci9w5qbqp] { font-size: 11px; color: var(--mp-text-muted); }

/* ============================================================
   Zone de contenu
   ============================================================ */
.content[b-5ci9w5qbqp] {
    padding: var(--mp-space-6);
    max-width: 1280px;
}

@media (min-width: 641px) {
    .page[b-5ci9w5qbqp] { flex-direction: row; }

    .sidebar[b-5ci9w5qbqp] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        flex-shrink: 0;
    }

    .top-row[b-5ci9w5qbqp] {
        position: sticky;
        top: 0;
        z-index: 1;
    }
}

@media (max-width: 640.98px) {
    /* Mode « application mobile » : sidebar masquée, navigation en bas. */
    .sidebar[b-5ci9w5qbqp] { display: none; }

    .top-brand[b-5ci9w5qbqp] { display: flex; }
    .top-search[b-5ci9w5qbqp] { display: none; }
    .top-verif[b-5ci9w5qbqp] { display: none; }

    /* Topbar collante en haut de l'écran. */
    .top-row[b-5ci9w5qbqp] {
        position: sticky;
        top: 0;
        z-index: 20;
        padding: 0 var(--mp-space-4);
    }

    /* Contenu pleine largeur ; marge basse pour dégager la barre d'onglets. */
    .content[b-5ci9w5qbqp] {
        padding: var(--mp-space-4);
        padding-bottom: calc(4.5rem + env(safe-area-inset-bottom, 0));
        max-width: none;
    }
}
/* /Layout/MobileNav.razor.rz.scp.css */
/* Masqué par défaut (desktop) : la sidebar gère la navigation ≥641px. */
.mnav[b-k5ggpmlpeb], .msheet[b-k5ggpmlpeb], .msheet-backdrop[b-k5ggpmlpeb] { display: none; }

@media (max-width: 640.98px) {
    /* --- Barre d'onglets fixée en bas --- */
    .mnav[b-k5ggpmlpeb] {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 60;
        display: flex;
        justify-content: space-around;
        align-items: stretch;
        background-color: var(--mp-surface);
        border-top: 0.5px solid var(--mp-border);
        box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.05);
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    .mnav-item[b-k5ggpmlpeb] {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-height: 3.5rem;
        padding: 6px 2px;
        border: none;
        background: transparent;
        cursor: pointer;
        color: var(--mp-text-muted);
        font-family: var(--mp-font-sans);
        font-size: 11px;
        font-weight: 500;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }
    .mnav-item:hover[b-k5ggpmlpeb] { text-decoration: none; color: var(--mp-text-muted); }
    .mnav-ico[b-k5ggpmlpeb] { display: inline-flex; }
    .mnav-txt[b-k5ggpmlpeb] { white-space: nowrap; line-height: 1; }

    /* Onglet actif (NavLink ajoute .active) ou feuille ouverte */
    .mnav-item.active[b-k5ggpmlpeb],
    .mnav-more.is-open[b-k5ggpmlpeb] { color: var(--mp-primary); }
    .mnav-item.active .mnav-ico[b-k5ggpmlpeb] { color: var(--mp-primary); }

    /* --- Feuille « Plus » (bottom sheet) --- */
    .msheet-backdrop[b-k5ggpmlpeb] {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 65;
        background: rgba(0, 0, 0, 0.35);
    }

    .msheet[b-k5ggpmlpeb] {
        display: block;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 66;
        background-color: var(--mp-surface);
        border-top-left-radius: var(--mp-radius-xl);
        border-top-right-radius: var(--mp-radius-xl);
        box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.18);
        padding: var(--mp-space-3) var(--mp-space-4)
                 calc(var(--mp-space-4) + env(safe-area-inset-bottom, 0));
        animation: msheet-up-b-k5ggpmlpeb 0.18s ease-out;
    }
    @keyframes msheet-up-b-k5ggpmlpeb {
        from { transform: translateY(100%); }
        to   { transform: translateY(0); }
    }

    .msheet-grip[b-k5ggpmlpeb] {
        width: 36px;
        height: 4px;
        border-radius: 999px;
        background-color: var(--mp-border);
        margin: 2px auto var(--mp-space-3);
    }

    .msheet-grid[b-k5ggpmlpeb] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--mp-space-2);
    }

    .msheet-link[b-k5ggpmlpeb] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: var(--mp-space-3) 4px;
        border-radius: var(--mp-radius-md);
        color: var(--mp-text);
        font-size: 12px;
        font-weight: 500;
        text-align: center;
        text-decoration: none;
    }
    .msheet-link:hover[b-k5ggpmlpeb] { background-color: var(--mp-surface-2); text-decoration: none; color: var(--mp-text); }
    .msheet-ico[b-k5ggpmlpeb] { color: var(--mp-primary); display: inline-flex; }

    .msheet-logout[b-k5ggpmlpeb] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        margin-top: var(--mp-space-3);
        padding: 12px;
        border: 1px solid var(--mp-border);
        border-radius: var(--mp-radius-md);
        background: transparent;
        color: var(--mp-danger);
        font-family: var(--mp-font-sans);
        font-size: 14px;
        font-weight: 600;
        cursor: pointer;
    }
    .msheet-logout:hover[b-k5ggpmlpeb] { background-color: var(--mp-badge-rupture-bg); }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* ============================================================
   Sidebar HbaExpress Pro — surface claire, accents verts.
   ============================================================ */

/* --- En-tête / branding --- */
.sb-top[b-lho934w8ce] {
    height: 3.5rem;
    display: flex;
    align-items: center;
    background-color: var(--mp-surface);
    border-bottom: 0.5px solid var(--mp-border);
    padding: 0 var(--mp-space-4);
}

.sb-brand[b-lho934w8ce] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    text-decoration: none;
    flex: 1;
    min-width: 0;
}
.sb-brand:hover[b-lho934w8ce] { text-decoration: none; }

.sb-logo[b-lho934w8ce] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--mp-radius-md);
    overflow: hidden;
    color: #fff;
    font-size: 1rem;
    flex-shrink: 0;
}
.sb-logo img[b-lho934w8ce] { width: 100%; height: 100%; object-fit: cover; display: block; }

.sb-brand-text[b-lho934w8ce] {
    display: flex;
    align-items: baseline;
    gap: 4px;
    line-height: 1;
}
.sb-brand-name[b-lho934w8ce] { font-size: 1.05rem; font-weight: 700; color: var(--mp-text); }
.sb-brand-pro[b-lho934w8ce] {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--mp-primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* --- Bouton de repli mobile --- */
.navbar-toggler[b-lho934w8ce] {
    appearance: none;
    cursor: pointer;
    width: 2.75rem;
    height: 2.25rem;
    border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-md);
    background: var(--mp-surface-2) url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' width='24' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%232C2C2A' stroke-width='2' stroke-linecap='round' d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") no-repeat center / 1.4rem;
}

/* --- Corps : nav + profil --- */
.sb-body[b-lho934w8ce] {
    display: flex;
    flex-direction: column;
    background-color: var(--mp-surface);
}

.sb-nav[b-lho934w8ce] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--mp-space-3);
    flex: 1;
}

.nav-item[b-lho934w8ce] { font-size: 0.9rem; }

.nav-item[b-lho934w8ce]  a {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    color: var(--mp-text-muted);
    font-weight: 500;
    height: 2.6rem;
    padding: 0 var(--mp-space-3);
    border-radius: var(--mp-radius-md);
    position: relative;
}

.nav-item[b-lho934w8ce]  a:hover {
    background-color: var(--mp-surface-2);
    color: var(--mp-text);
    text-decoration: none;
}

.nav-item[b-lho934w8ce]  a.active {
    background-color: var(--mp-primary-light);
    color: var(--mp-primary-dark);
    font-weight: 600;
}

/* Indicateur vertical de l'élément actif */
.nav-item[b-lho934w8ce]  a.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background-color: var(--mp-primary);
}

.nav-ico[b-lho934w8ce] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.4rem;
    flex-shrink: 0;
}
.nav-ico svg[b-lho934w8ce], .sb-logo svg[b-lho934w8ce], .sb-logout svg[b-lho934w8ce] { display: block; }
.nav-txt[b-lho934w8ce] { white-space: nowrap; }

/* --- Bloc profil (bas de la sidebar) --- */
.sb-profile[b-lho934w8ce] {
    display: flex;
    align-items: center;
    gap: var(--mp-space-2);
    padding: var(--mp-space-3);
    margin: var(--mp-space-2);
    border-top: 0.5px solid var(--mp-border);
}

.sb-avatar[b-lho934w8ce] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background-color: var(--mp-primary);
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    flex-shrink: 0;
}

.sb-profile-meta[b-lho934w8ce] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    line-height: 1.2;
}
.sb-profile-name[b-lho934w8ce] {
    font-size: 14px;
    font-weight: 600;
    color: var(--mp-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sb-profile-role[b-lho934w8ce] { font-size: 12px; color: var(--mp-text-muted); }

.sb-logout[b-lho934w8ce] {
    appearance: none;
    cursor: pointer;
    border: none;
    background: transparent;
    color: var(--mp-text-muted);
    font-size: 1.1rem;
    width: 2rem;
    height: 2rem;
    border-radius: var(--mp-radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.sb-logout:hover[b-lho934w8ce] { background-color: var(--mp-badge-rupture-bg); color: var(--mp-danger); }

/* --- Responsive --- */
@media (min-width: 641px) {
    .navbar-toggler[b-lho934w8ce] { display: none; }
    .collapse[b-lho934w8ce] { display: flex; }
    .sb-body[b-lho934w8ce] {
        height: calc(100vh - 3.5rem);
    }
    .sb-nav[b-lho934w8ce] {
        overflow-y: auto;
    }
}

@media (max-width: 640.98px) {
    .sb-body[b-lho934w8ce] { padding-bottom: var(--mp-space-2); }
}
/* /Pages/Avis.razor.rz.scp.css */
.avis-grid[b-izku8b9fj0] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: var(--mp-space-4); align-items: start;
}

.avis-toolbar[b-izku8b9fj0] { display: flex; align-items: center; gap: var(--mp-space-4); flex-wrap: wrap; margin-bottom: var(--mp-space-3); }
.avis-filters[b-izku8b9fj0] { display: flex; gap: var(--mp-space-2); flex-wrap: wrap; }
.avis-chip[b-izku8b9fj0] { border: 0.5px solid var(--mp-border); background-color: var(--mp-surface); border-radius: 999px; padding: 5px 14px; font-size: 13px; cursor: pointer; color: var(--mp-text); transition: all .15s ease; }
.avis-chip:hover[b-izku8b9fj0] { border-color: var(--mp-primary); color: var(--mp-primary); }
.avis-chip.active[b-izku8b9fj0] { background-color: var(--mp-primary); border-color: var(--mp-primary); color: #fff; }
.avis-count[b-izku8b9fj0] { margin-left: auto; }
.avis-pager[b-izku8b9fj0] { display: flex; align-items: center; justify-content: center; gap: var(--mp-space-4); margin-top: var(--mp-space-4); }
.avis-page-btn[b-izku8b9fj0] { border: 0.5px solid var(--mp-border); background: var(--mp-surface); border-radius: var(--mp-radius-md); padding: 6px 16px; font-size: 13px; cursor: pointer; color: var(--mp-text); }
.avis-page-btn:hover:not(:disabled)[b-izku8b9fj0] { border-color: var(--mp-primary); color: var(--mp-primary); }
.avis-page-btn:disabled[b-izku8b9fj0] { opacity: .5; cursor: default; }

@media (max-width: 860px) { 
    .avis-grid[b-izku8b9fj0] { 
        grid-template-columns: 1fr; 
    } 
}

.rating-summary[b-izku8b9fj0] { 
    display: flex; 
    align-items: center; 
    gap: var(--mp-space-3); 
    margin-bottom: var(--mp-space-4); 
}

.rating-avg[b-izku8b9fj0] { 
    font-size: 40px; 
    font-weight: 700; 
    color: var(--mp-primary-dark); 
}

.rating-stars[b-izku8b9fj0], .rev-stars[b-izku8b9fj0] { 
    color: var(--mp-accent); 
    letter-spacing: 1px; 
}

.rating-breakdown[b-izku8b9fj0] { 
    display: flex; 
    flex-direction: column; 
    gap: var(--mp-space-2); 
}

.bd-row[b-izku8b9fj0] { 
    display: flex; 
    align-items: center; 
    gap: var(--mp-space-2); 
    font-size: 13px; 
}

.bd-star[b-izku8b9fj0] {
    width: 28px; 
    color: var(--mp-text-muted); 
}

.bd-track[b-izku8b9fj0] { 
    flex: 1; 
    height: 8px; 
    background-color: var(--mp-surface-2); 
    border-radius: 999px; 
    overflow: hidden; 
}

.bd-fill[b-izku8b9fj0] { 
    height: 100%; 
    background-color: var(--mp-accent); 
}
.bd-count[b-izku8b9fj0] { 
    width: 24px; 
    text-align: right; 
    color: var(--mp-text-muted); 
}

.review-list[b-izku8b9fj0] {
    display: flex;
    flex-direction: column;
    gap: var(--mp-space-3);
}
.avis-empty[b-izku8b9fj0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--mp-space-1);
    text-align: center;
    padding: var(--mp-space-6) var(--mp-space-4);
}
.avis-empty-ico[b-izku8b9fj0] {
    color: var(--mp-text-muted);
    display: inline-flex;
    margin-bottom: var(--mp-space-1);
}
.rev-head[b-izku8b9fj0] { 
    display: flex; 
    align-items: flex-start; 
    justify-content: space-between; 
    gap: var(--mp-space-3); 
    margin-bottom: var(--mp-space-2); 
}
.rev-author[b-izku8b9fj0] { 
    font-weight: 600; 
    margin-right: var(--mp-space-2); 
}
.rev-body[b-izku8b9fj0] { 
    margin: 0 0 var(--mp-space-3) 0; 
}
.rev-actions[b-izku8b9fj0], .reply-actions[b-izku8b9fj0] { 
    display: flex;
    gap: var(--mp-space-2); 
}
.rev-reply[b-izku8b9fj0] {
    margin-top: var(--mp-space-3);
    padding: var(--mp-space-3);
    background-color: var(--mp-surface-2);
    border-radius: var(--mp-radius-md);
    border-left: 3px solid var(--mp-primary);
}
.rev-reply p[b-izku8b9fj0] { 
    margin: var(--mp-space-1) 0 0 0; 
}
.reply-box[b-izku8b9fj0] { 
    display: flex; 
    flex-direction: column; 
    gap: var(--mp-space-2); 
    margin-top: var(--mp-space-2); 
}
.mp-input[b-izku8b9fj0] {
    font-family: var(--mp-font-sans); 
    font-size: 15px;
    padding: 10px 12px; 
    border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-md); 
    background-color: var(--mp-surface);
    color: var(--mp-text); 
    resize: vertical; 
    width: 100%;
}
.mp-input:focus[b-izku8b9fj0] { 
    outline: none; 
    border-color: var(--mp-primary); 
}
.reply-actions[b-izku8b9fj0] { 
    justify-content: flex-end; 
}
/* /Pages/Cgu.razor.rz.scp.css */
.cgu-card[b-4w9cno7c8d] {
    width: 100%;
    max-width: 720px;
    margin: var(--mp-space-6) auto;
    background-color: var(--mp-surface);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-xl);
    padding: var(--mp-space-8);
}
.cgu-head[b-4w9cno7c8d] { border-bottom: 0.5px solid var(--mp-border); padding-bottom: var(--mp-space-3); margin-bottom: var(--mp-space-3); }
.cgu-back[b-4w9cno7c8d] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--mp-primary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: var(--mp-space-3);
}
.cgu-back:hover[b-4w9cno7c8d] { text-decoration: underline; }
.cgu-card h1[b-4w9cno7c8d] { font-size: 24px; margin: 0; }
.cgu-updated[b-4w9cno7c8d] { color: var(--mp-text-muted); font-size: 13px; margin: var(--mp-space-1) 0 0 0; }
.cgu-body[b-4w9cno7c8d] { color: var(--mp-text); font-size: 15px; line-height: 1.65; }
.cgu-body h2[b-4w9cno7c8d] { font-size: 16px; margin: var(--mp-space-4) 0 var(--mp-space-1) 0; }
.cgu-body p[b-4w9cno7c8d] { margin: 0 0 var(--mp-space-2) 0; }
.cgu-note[b-4w9cno7c8d] {
    margin-top: var(--mp-space-4);
    padding: var(--mp-space-2) var(--mp-space-3);
    background-color: var(--mp-surface-alt, #f6f8f7);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-md);
    color: var(--mp-text-muted);
    font-size: 13px;
}
/* /Pages/Login.razor.rz.scp.css */
.login-card[b-9vw8vop47q] {
    width: 100%;
    max-width: 380px;
    background-color: var(--mp-surface);
    border: 0.5px solid var(--mp-border);
    border-radius: var(--mp-radius-xl);
    padding: var(--mp-space-8);
    display: flex;
    flex-direction: column;
    gap: var(--mp-space-3);
}
.login-brand[b-9vw8vop47q] { display: flex; justify-content: center; margin-bottom: var(--mp-space-2); }
.login-logo[b-9vw8vop47q] { width: 132px; height: 132px; border-radius: var(--mp-radius-xl); display: block; }
.brand-mark[b-9vw8vop47q] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2rem; height: 2rem;
    background: linear-gradient(135deg, var(--mp-primary), var(--mp-primary-dark));
    color: #fff;
    border-radius: var(--mp-radius-md);
    box-shadow: 0 2px 8px rgba(31,138,76,0.25);
}
.brand-text[b-9vw8vop47q] { font-size: 17px; letter-spacing: -0.2px; }
.brand-name[b-9vw8vop47q] { color: var(--mp-text); font-weight: 700; }
.brand-pro[b-9vw8vop47q] { color: var(--mp-primary); font-weight: 700; margin-left: 4px; }
.login-card h1[b-9vw8vop47q] { font-size: 22px; margin: var(--mp-space-2) 0 0 0; }
.field[b-9vw8vop47q] { display: flex; flex-direction: column; gap: var(--mp-space-1); margin-bottom: var(--mp-space-2); }
.field label[b-9vw8vop47q] { font-size: 14px; font-weight: 500; }
.mp-input[b-9vw8vop47q] {
    font-family: var(--mp-font-sans);
    font-size: 16px;
    padding: 10px 12px;
    border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-md);
    background-color: var(--mp-surface);
    color: var(--mp-text);
}
.mp-input:focus[b-9vw8vop47q] { outline: none; border-color: var(--mp-primary); }
.login-error[b-9vw8vop47q] { color: var(--mp-danger); font-size: 14px; margin: 0; }

/* Champ mot de passe + bouton afficher/masquer */
.pwd-wrap[b-9vw8vop47q] { position: relative; display: flex; }
.pwd-wrap .mp-input[b-9vw8vop47q] { flex: 1; padding-right: 42px; }
.pwd-toggle[b-9vw8vop47q] {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--mp-text-muted);
    cursor: pointer;
    border-radius: var(--mp-radius-md);
}
.pwd-toggle:hover[b-9vw8vop47q] { color: var(--mp-primary); }
.pwd-toggle:focus-visible[b-9vw8vop47q] { outline: 2px solid var(--mp-primary); outline-offset: 1px; }

/* Mention CGU en bas de la carte de connexion */
.login-legal[b-9vw8vop47q] {
    margin: var(--mp-space-2) 0 0 0;
    font-size: 13px;
    color: var(--mp-text-muted);
    text-align: center;
    line-height: 1.5;
}
.login-legal a[b-9vw8vop47q] { color: var(--mp-primary); text-decoration: none; font-weight: 500; }
.login-legal a:hover[b-9vw8vop47q] { text-decoration: underline; }
/* /Pages/Produits.razor.rz.scp.css */
.filter-bar[b-bcqf4bt6dt] {
    display: flex;
    gap: var(--mp-space-2);
    flex-wrap: wrap;
    margin-bottom: var(--mp-space-4);
}
.chip[b-bcqf4bt6dt] {
    appearance: none;
    cursor: pointer;
    font-family: var(--mp-font-sans);
    font-size: 13px;
    font-weight: 500;
    padding: 6px 14px;
    border-radius: 999px;
    border: 0.5px solid var(--mp-border);
    background-color: var(--mp-surface);
    color: var(--mp-text);
}
.chip:hover[b-bcqf4bt6dt] { border-color: var(--mp-primary); }
.chip-active[b-bcqf4bt6dt] {
    background-color: var(--mp-primary);
    color: #fff;
    border-color: var(--mp-primary);
}

.prod-cell[b-bcqf4bt6dt] { display: flex; align-items: center; gap: var(--mp-space-3); }
.prod-emoji[b-bcqf4bt6dt] { font-size: 22px; }
.prod-text[b-bcqf4bt6dt] { display: flex; flex-direction: column; gap: 1px; }
.prod-name[b-bcqf4bt6dt] { font-weight: 500; }

.price-cell[b-bcqf4bt6dt] { display: inline-flex; align-items: center; gap: var(--mp-space-2); justify-content: flex-end; }
.old-price[b-bcqf4bt6dt] { font-size: 13px; color: var(--mp-text-muted); text-decoration: line-through; }

.empty-state[b-bcqf4bt6dt] {
    padding: var(--mp-space-8);
    text-align: center;
    color: var(--mp-text-muted);
}

.form-error[b-bcqf4bt6dt] { color: var(--mp-danger); font-size: 14px; margin: 0; }

.img-editor[b-bcqf4bt6dt] { display: flex; flex-direction: column; gap: var(--mp-space-2); margin-bottom: var(--mp-space-2); }
.img-row[b-bcqf4bt6dt] { display: flex; align-items: center; gap: var(--mp-space-2); }
.img-row.is-primary .img-emoji[b-bcqf4bt6dt] { border-color: var(--mp-primary); }
.img-emoji[b-bcqf4bt6dt] {
    width: 52px; text-align: center; font-size: 22px;
    padding: 6px; border: 1px solid var(--mp-border);
    border-radius: var(--mp-radius-md); background-color: var(--mp-surface);
    flex-shrink: 0;
}
.img-alt[b-bcqf4bt6dt] { flex: 1; }
.img-btn[b-bcqf4bt6dt] {
    appearance: none; cursor: pointer;
    width: 38px; height: 38px; flex-shrink: 0;
    border: 1px solid var(--mp-border); border-radius: var(--mp-radius-md);
    background-color: var(--mp-surface); color: var(--mp-text-muted);
    font-size: 15px;
}
.img-btn:hover[b-bcqf4bt6dt] { border-color: var(--mp-primary); color: var(--mp-text); }
.img-btn.active[b-bcqf4bt6dt] { background-color: var(--mp-primary); border-color: var(--mp-primary); color: #fff; }
.img-btn.danger:hover[b-bcqf4bt6dt] { border-color: var(--mp-danger); color: var(--mp-danger); }
.img-btn:disabled[b-bcqf4bt6dt] { opacity: .4; cursor: not-allowed; }

/* Aperçu des fichiers images sélectionnés */
.upload-grid[b-bcqf4bt6dt] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mp-space-2);
    margin-top: var(--mp-space-2);
}
.upload-thumb[b-bcqf4bt6dt] {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: var(--mp-radius-md);
    overflow: hidden;
    border: 1px solid var(--mp-border);
}
.upload-thumb.is-primary[b-bcqf4bt6dt] { border: 2px solid var(--mp-primary); }
.upload-thumb img[b-bcqf4bt6dt] { width: 100%; height: 100%; object-fit: cover; display: block; }
.upload-thumb .thumb-x[b-bcqf4bt6dt],
.upload-thumb .thumb-star[b-bcqf4bt6dt] {
    position: absolute;
    top: 2px;
    width: 20px; height: 20px;
    border: none; cursor: pointer;
    border-radius: 999px;
    font-size: 11px; line-height: 1;
    display: flex; align-items: center; justify-content: center;
}
.upload-thumb .thumb-x[b-bcqf4bt6dt] { right: 2px; background: rgba(226, 75, 74, .9); color: #fff; }
.upload-thumb .thumb-star[b-bcqf4bt6dt] { left: 2px; background: rgba(4, 44, 83, .8); color: #fff; }

.prod-img[b-bcqf4bt6dt] {
    width: 34px; height: 34px;
    border-radius: var(--mp-radius-md);
    object-fit: cover;
    border: 0.5px solid var(--mp-border);
}