/* =====================================================================
   MANIÈRE CUT PLUS — COUCHE V6
   ---------------------------------------------------------------------
   À charger APRÈS mc-v5.css :
       <link rel="stylesheet" href="mc-v6.css">

   Contenu :
     1. Barre d'actions compacte (Plan / Vitrage)
     2. Centre d'informations & avis, accessible DANS l'application
     3. Blocs repliables du module Devis
     4. Historique des devis
     5. Partage du devis au client
   ===================================================================== */

/* ─────────────────────────────────────────────────────────────────
   1. BARRE D'ACTIONS COMPACTE
   -----------------------------------------------------------------
   « Nouvelle dimension » est le geste répété : il garde toute la
   largeur. « Plan » et « Vitrage » sont des gestes de fin de saisie :
   ils passent en pastilles, à droite, et ne mangent plus l'écran.
   ───────────────────────────────────────────────────────────────── */
.action-bar.mc6-actions {
    display: flex;
    align-items: stretch;
    gap: 8px;
    flex-wrap: nowrap;
    margin-bottom: 26px;
}
.action-bar.mc6-actions .btn-add {
    flex: 1 1 auto;
    min-width: 0;
    padding: 13px 14px;
    font-size: .95rem;
    border-radius: 10px;
}
.action-bar.mc6-actions .btn-optimize.mc6-compact {
    flex: 0 0 auto;
    padding: 0 14px;
    min-height: 46px;
    gap: 7px;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: none;
    border-radius: 10px;
    box-shadow: none;
    white-space: nowrap;
}
.action-bar.mc6-actions .btn-optimize.mc6-compact:hover {
    transform: none;
    box-shadow: 0 6px 14px -8px rgba(225, 45, 45, .8);
}
.action-bar.mc6-actions .btn-optimize.mc6-compact svg {
    width: 17px; height: 17px; flex: none;
}
.mc6-compact.mc6-bleu {
    background: transparent;
    color: #0EA5E9;
    border: 1px solid rgba(14, 165, 233, .45);
}
.mc6-compact.mc6-bleu:hover {
    background: rgba(14, 165, 233, .1);
    box-shadow: none;
}

/* Sous 560 px on ne garde que l'icône : le libellé passe en info-bulle. */
@media (max-width: 560px) {
    .action-bar.mc6-actions { gap: 6px; }
    .action-bar.mc6-actions .btn-optimize.mc6-compact { padding: 0 12px; }
    .action-bar.mc6-actions .btn-optimize.mc6-compact .mc6-lbl {
        font-size: .72rem;
    }
}
@media (max-width: 400px) {
    .action-bar.mc6-actions .btn-optimize.mc6-compact .mc6-lbl { display: none; }
    .action-bar.mc6-actions .btn-optimize.mc6-compact { padding: 0 13px; }
}

/* La barre du calepinage suit la même règle. */
.mc6-actions-vitrage { align-items: center; gap: 8px; flex-wrap: nowrap; }

/* ─────────────────────────────────────────────────────────────────
   2. CENTRE D'INFORMATIONS & AVIS (dans l'application)
   ───────────────────────────────────────────────────────────────── */
.mc6-modal {
    position: fixed; inset: 0; z-index: 13000;
    display: none; align-items: flex-end; justify-content: center;
    background: rgba(4, 5, 7, .74);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.mc6-modal.is-on { display: flex; animation: mc6Fade .2s ease-out; }
@keyframes mc6Fade { from { opacity: 0 } to { opacity: 1 } }
body.mc6-modal-open { overflow: hidden; }

.mc6-box {
    position: relative;
    width: min(620px, 100%);
    max-height: 92vh;
    display: flex; flex-direction: column;
    background: linear-gradient(180deg, var(--mc-steel-2, #191C23), var(--mc-steel, #121419));
    border: 1px solid var(--mc-line, #2C313B);
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -30px 80px -30px rgba(0, 0, 0, .9);
    animation: mc6Rise .28s cubic-bezier(.2, .8, .3, 1);
    overflow: hidden;
}
@keyframes mc6Rise { from { transform: translateY(24px); opacity: 0 } to { transform: none; opacity: 1 } }
@media (min-width: 720px) {
    .mc6-modal { align-items: center; }
    .mc6-box { border-radius: 18px; max-height: 88vh; }
}

.mc6-poignee {
    width: 40px; height: 4px; border-radius: 999px;
    background: var(--mc-line, #2C313B);
    margin: 9px auto 0; flex: none;
}
.mc6-tete {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 20px 12px;
    border-bottom: 1px solid var(--mc-line, #2C313B);
    flex: none;
}
.mc6-tete h3 {
    font-family: var(--mc-display, sans-serif);
    font-size: 1.1rem; font-weight: 800; margin: 0;
    color: var(--mc-ink, #F3F5F8);
}
.mc6-fermer {
    margin-left: auto; background: none; border: 0;
    color: var(--mc-mute, #8C94A3); font-size: 1.7rem;
    line-height: 1; cursor: pointer; padding: 0 4px;
}
.mc6-fermer:hover { color: var(--mc-ink, #F3F5F8); }

.mc6-onglets {
    display: flex; gap: 4px; padding: 10px 14px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    border-bottom: 1px solid var(--mc-line, #2C313B);
    flex: none; scrollbar-width: none;
}
.mc6-onglets::-webkit-scrollbar { display: none; }
.mc6-onglet {
    flex: none; padding: 8px 14px; border-radius: 999px;
    background: transparent; border: 1px solid var(--mc-line, #2C313B);
    color: var(--mc-mute, #8C94A3);
    font-size: .82rem; font-weight: 700; cursor: pointer;
    white-space: nowrap; transition: .16s;
}
.mc6-onglet:hover { color: var(--mc-ink, #F3F5F8); }
.mc6-onglet.is-on {
    background: var(--mc-cut, #E12D2D); border-color: var(--mc-cut, #E12D2D);
    color: #fff;
}
.mc6-onglet .mc6-pastille {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: var(--mc-brass, #D9A441); margin-left: 6px; vertical-align: middle;
}

.mc6-corps {
    padding: 18px 20px calc(22px + env(safe-area-inset-bottom));
    overflow-y: auto; -webkit-overflow-scrolling: touch;
}
.mc6-corps h4 {
    font-family: var(--mc-display, sans-serif);
    font-size: .98rem; font-weight: 700; margin: 0 0 6px;
    color: var(--mc-ink, #F3F5F8);
}
.mc6-corps p { color: var(--mc-mute, #8C94A3); font-size: .9rem; line-height: 1.6; }

.mc6-liste-info { display: grid; gap: 10px; margin: 0 0 18px; padding: 0; list-style: none; }
.mc6-liste-info li {
    padding: 14px 16px; border-radius: 11px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
    border-left: 2px solid var(--mc-brass, #D9A441);
}
.mc6-liste-info strong { display: block; font-size: .93rem; color: var(--mc-ink, #F3F5F8); margin-bottom: 4px; }
.mc6-liste-info span { font-size: .86rem; color: var(--mc-mute, #8C94A3); line-height: 1.55; }

.mc6-etat {
    display: flex; align-items: center; gap: 10px;
    padding: 13px 15px; border-radius: 11px; margin-bottom: 16px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
}
.mc6-etat-puce {
    width: 9px; height: 9px; border-radius: 50%; flex: none;
    background: var(--mc-mute, #8C94A3);
}
.mc6-etat-puce.ok { background: var(--mc-mint, #17C08A); box-shadow: 0 0 0 4px rgba(23, 192, 138, .16); }
.mc6-etat-puce.essai { background: var(--mc-brass, #D9A441); box-shadow: 0 0 0 4px rgba(217, 164, 65, .16); }
.mc6-etat-txt { font-size: .88rem; color: var(--mc-ink, #F3F5F8); line-height: 1.5; }
.mc6-etat-txt small { display: block; color: var(--mc-mute, #8C94A3); font-size: .78rem; margin-top: 2px; }

.mc6-actions-pile { display: grid; gap: 9px; margin-top: 4px; }
.mc6-btn {
    width: 100%; padding: 13px 16px; border-radius: 11px;
    border: 1px solid var(--mc-line, #2C313B); background: transparent;
    color: var(--mc-ink, #F3F5F8);
    font-family: inherit; font-size: .9rem; font-weight: 700;
    cursor: pointer; transition: .16s;
    display: flex; align-items: center; justify-content: center; gap: 9px;
}
.mc6-btn:hover { border-color: var(--mc-brass, #D9A441); color: var(--mc-brass, #D9A441); }
.mc6-btn-plein {
    background: var(--mc-cut, #E12D2D); border-color: var(--mc-cut, #E12D2D); color: #fff;
}
.mc6-btn-plein:hover { background: var(--primary-dark, #A81C1C); border-color: var(--primary-dark, #A81C1C); color: #fff; }
.mc6-btn-wa { background: #25D366; border-color: #25D366; color: #05310F; }
.mc6-btn-wa:hover { background: #1FB855; border-color: #1FB855; color: #05310F; }
.mc6-btn:disabled { opacity: .45; cursor: not-allowed; }

/* ---- Note moyenne + avis ---- */
.mc6-note-globale {
    display: flex; align-items: center; gap: 14px;
    padding: 15px 17px; border-radius: 12px; margin-bottom: 16px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
}
.mc6-note-chiffre {
    font-family: var(--mc-data, monospace);
    font-size: 2rem; font-weight: 700; line-height: 1;
    color: var(--mc-brass, #D9A441);
}
.mc6-note-detail { font-size: .8rem; color: var(--mc-mute, #8C94A3); margin-top: 3px; }
.mc6-etoiles span { color: var(--mc-line, #2C313B); font-size: 1rem; }
.mc6-etoiles span.on { color: var(--mc-brass, #D9A441); }

.mc6-avis-liste { display: grid; gap: 10px; margin-bottom: 18px; }
.mc6-avis {
    padding: 14px 16px; border-radius: 11px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
}
.mc6-avis p { color: var(--mc-ink, #F3F5F8); font-size: .89rem; line-height: 1.55; margin: 8px 0 9px; }
.mc6-avis footer {
    font-family: var(--mc-data, monospace); font-size: .68rem;
    letter-spacing: .08em; text-transform: uppercase;
    color: var(--mc-mute, #8C94A3);
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.mc6-avis-moi { color: var(--mc-brass, #D9A441); }
.mc6-vide { color: var(--mc-mute, #8C94A3); font-size: .88rem; padding: 16px 0; }

.mc6-form {
    padding: 17px; border-radius: 12px;
    background: var(--mc-steel, #121419);
    border: 1px solid var(--mc-line, #2C313B);
}
.mc6-form h4 { margin-bottom: 10px; }
.mc6-notes { display: flex; gap: 3px; margin-bottom: 12px; }
.mc6-notes button {
    background: none; border: 0; cursor: pointer; font-size: 1.75rem;
    color: var(--mc-line, #2C313B); padding: 0 2px; line-height: 1;
    transition: color .14s, transform .14s;
}
.mc6-notes button:hover { transform: scale(1.14); }
.mc6-notes button.on { color: var(--mc-brass, #D9A441); }
.mc6-champ {
    width: 100%; background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B); border-radius: 9px;
    color: var(--mc-ink, #F3F5F8);
    padding: 11px 13px; margin-bottom: 10px;
    font-family: inherit; font-size: .9rem; resize: vertical;
}
.mc6-champ:focus { border-color: var(--mc-brass, #D9A441); outline: none; }
.mc6-fine { color: var(--mc-mute, #8C94A3); font-size: .78rem; margin-top: 10px; line-height: 1.5; }
.mc6-fine.err { color: var(--mc-cut, #E12D2D); }
.mc6-fine.ok { color: var(--mc-mint, #17C08A); }

/* ---- Bouton d'accès dans la barre supérieure ---- */
.mc6-cloche { position: relative; }
.mc6-cloche.a-du-neuf::after {
    content: ""; position: absolute; top: 6px; right: 6px;
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--mc-brass, #D9A441);
    box-shadow: 0 0 0 2px var(--surface, #16161A);
}

/* ─────────────────────────────────────────────────────────────────
   3. BLOCS REPLIABLES DU MODULE DEVIS
   ───────────────────────────────────────────────────────────────── */
.mc6-repli {
    border: 1px solid var(--dv-bord, #2E2E36);
    border-radius: 12px;
    background: var(--dv-surface, #16161A);
    overflow: hidden;
}
.mc6-repli + .mc6-repli { margin-top: 12px; }
.mc6-repli > summary {
    list-style: none; cursor: pointer;
    display: flex; align-items: center; gap: 10px;
    padding: 13px 15px;
    transition: background .16s;
}
.mc6-repli > summary::-webkit-details-marker { display: none; }
.mc6-repli > summary:hover { background: rgba(255, 255, 255, .025); }
.mc6-repli > summary .dv-section-titre { margin: 0; flex: 1; min-width: 0; }
.mc6-repli-fleche {
    flex: none; width: 22px; height: 22px; border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    color: var(--dv-gris, #9A9AA5); font-size: 11px;
    border: 1px solid var(--dv-bord, #2E2E36);
    transition: transform .2s;
}
.mc6-repli-fleche::before { content: "\25BE"; }
.mc6-repli[open] > summary .mc6-repli-fleche { transform: rotate(180deg); }
.mc6-repli > summary .mc6-repli-aide {
    font-size: 11px; color: var(--dv-gris, #9A9AA5); font-weight: 500;
    text-transform: none; letter-spacing: 0;
}
.mc6-repli > .dv-carte {
    border: 0; border-top: 1px solid var(--dv-bord, #2E2E36);
    border-radius: 0; background: transparent;
}

/* ─────────────────────────────────────────────────────────────────
   4. HISTORIQUE DES DEVIS
   ───────────────────────────────────────────────────────────────── */
.mc6-hist-barre {
    display: flex; gap: 8px; margin-bottom: 13px; flex-wrap: wrap;
}
.mc6-hist-barre .mc6-recherche {
    flex: 1 1 160px; min-width: 0;
    background: var(--dv-bg, #0C0C0E);
    border: 1px solid var(--dv-bord, #2E2E36);
    border-radius: 9px; color: var(--dv-texte, #F5F5F7);
    padding: 10px 12px; font-family: inherit; font-size: 13px;
}
.mc6-hist-barre .mc6-recherche:focus { border-color: var(--dv-rouge, #E12D2D); outline: none; }

.mc6-hist-liste { display: grid; gap: 9px; }
.mc6-devis {
    border: 1px solid var(--dv-bord, #2E2E36);
    border-radius: 11px; padding: 13px 14px;
    background: var(--dv-bg, #0C0C0E);
}
.mc6-devis-tete { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.mc6-devis-num {
    font-family: var(--mc-data, monospace); font-size: 12px; font-weight: 700;
    letter-spacing: .04em; color: var(--dv-rouge, #E12D2D);
}
.mc6-devis-total {
    margin-left: auto; font-family: var(--mc-data, monospace);
    font-size: 14px; font-weight: 700; color: var(--dv-texte, #F5F5F7);
    white-space: nowrap;
}
.mc6-devis-client { font-size: 14px; font-weight: 700; margin-top: 6px; color: var(--dv-texte, #F5F5F7); }
.mc6-devis-meta { font-size: 11.5px; color: var(--dv-gris, #9A9AA5); margin-top: 3px; line-height: 1.5; }
.mc6-devis-actions {
    display: flex; gap: 6px; margin-top: 11px; flex-wrap: wrap;
    padding-top: 11px; border-top: 1px solid var(--dv-bord, #2E2E36);
}
.mc6-devis-actions .dv-btn { flex: 1 1 auto; justify-content: center; }

.mc6-statut {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 9px; border-radius: 999px;
    font-size: 10px; font-weight: 800; letter-spacing: .05em;
    text-transform: uppercase;
    border: 1px solid var(--dv-bord, #2E2E36); color: var(--dv-gris, #9A9AA5);
}
.mc6-st-brouillon { color: var(--dv-gris, #9A9AA5); }
.mc6-st-envoye { color: #0EA5E9; border-color: rgba(14, 165, 233, .45); }
.mc6-st-accepte { color: var(--dv-vert, #10B981); border-color: rgba(16, 185, 129, .45); }
.mc6-st-refuse { color: var(--dv-rouge, #E12D2D); border-color: rgba(225, 45, 45, .45); }

.mc6-hist-resume {
    display: flex; gap: 16px; flex-wrap: wrap;
    padding: 11px 13px; margin-bottom: 12px;
    border-radius: 10px; background: var(--dv-surface-2, #202027);
    font-size: 11.5px; color: var(--dv-gris, #9A9AA5);
}
.mc6-hist-resume b {
    display: block; font-family: var(--mc-data, monospace);
    font-size: 15px; color: var(--dv-texte, #F5F5F7); font-weight: 700;
}

/* ─────────────────────────────────────────────────────────────────
   5. PARTAGE DU DEVIS
   ───────────────────────────────────────────────────────────────── */
.mc6-partage-resume {
    padding: 14px 16px; border-radius: 12px; margin-bottom: 16px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
}
.mc6-partage-resume .mc6-pr-num {
    font-family: var(--mc-data, monospace); font-size: .74rem;
    letter-spacing: .08em; color: var(--mc-brass, #D9A441);
}
.mc6-partage-resume .mc6-pr-client {
    font-size: 1.05rem; font-weight: 700; margin: 4px 0 2px;
    color: var(--mc-ink, #F3F5F8);
}
.mc6-partage-resume .mc6-pr-total {
    font-family: var(--mc-data, monospace); font-size: 1.25rem;
    font-weight: 700; color: var(--mc-ink, #F3F5F8); margin-top: 8px;
}
.mc6-apercu-msg {
    width: 100%; min-height: 122px;
    background: var(--input-bg, #0B0D11);
    border: 1px solid var(--mc-line, #2C313B);
    border-radius: 10px; color: var(--mc-mute, #8C94A3);
    padding: 12px 13px; font-family: inherit; font-size: .84rem;
    line-height: 1.55; resize: vertical; margin-bottom: 12px;
}

/* ─────────────────────────────────────────────────────────────────
   6. NAVIGATION — 5e entrée « Infos »
   ───────────────────────────────────────────────────────────────── */
.mobile-bottom-nav .mbn-item.mc6-mbn { position: relative; }
.mobile-bottom-nav .mbn-item.mc6-mbn.a-du-neuf::after {
    content: ""; position: absolute; top: 6px; right: 22%;
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--mc-brass, #D9A441);
}

/* ─────────────────────────────────────────────────────────────────
   7. RÉPONSE DE L'ÉDITEUR SOUS UN AVIS + AVIS ÉPINGLÉ
   ───────────────────────────────────────────────────────────────── */
.mc6-reponse, .mc-avis-reponse {
    border-left: 2px solid var(--mc-brass, #D9A441);
    background: rgba(217, 164, 65, .06);
    border-radius: 0 9px 9px 0;
    padding: 10px 13px;
    margin: 0 0 10px;
    font-size: .85rem;
    line-height: 1.55;
    color: var(--mc-mute, #8C94A3);
    white-space: pre-wrap;
}
.mc6-reponse strong, .mc-avis-reponse strong {
    display: block;
    font-family: var(--mc-data, monospace);
    font-size: .64rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mc-brass, #D9A441);
    margin-bottom: 5px;
    white-space: normal;
}
.mc6-avis-epingle, .mc-avis-epingle {
    border-color: color-mix(in srgb, var(--mc-brass, #D9A441) 45%, transparent);
}