/* ==========================================================================
   Recette V11 — mail de Romain du 28/10/2026
   ========================================================================== */

/* ---------- Fiche article : interrupteur « Afficher les prix » OUI / NON ---------- */
.prix-interrupteur {
    display: inline-flex; align-items: center; gap: .2rem;
    padding: .2rem; border-radius: 999px;
    background: var(--surface); border: 1px solid var(--line);
}
.prix-interrupteur__libelle { padding: 0 .5rem 0 .4rem; font-size: .8rem; font-weight: 600; color: var(--ink-soft); white-space: nowrap; }
.prix-interrupteur__choix {
    min-width: 3rem; padding: .25rem .7rem; border: 0; border-radius: 999px;
    font-size: .78rem; font-weight: 700; letter-spacing: .03em;
    color: var(--ink-soft); background: transparent;
    transition: background .15s, color .15s;
}
.prix-interrupteur__choix:hover { color: var(--v1); }
.prix-interrupteur__choix.is-actif { color: #fff; background: var(--grad); }
.prix-interrupteur__choix:focus-visible { outline: none; box-shadow: var(--ring); }

/* ---------- Agenda : prospection, coordonnées obligatoires ---------- */
.is-prospection .rdv-obligatoire .form-label::after { content: " *"; color: #e11d48; font-weight: 700; }

/* ---------- Agenda : pastille d'un RDV (urgent, important…) ---------- */
.rdv-pastille {
    display: inline-block; flex: 0 0 auto; width: .62rem; height: .62rem; border-radius: 50%;
    background: var(--pastille); box-shadow: 0 0 0 2px var(--surface);
    vertical-align: .05rem;
}
.planning-event.a-pastille, .pm-event.a-pastille { box-shadow: 0 0 0 2px var(--pastille), var(--sh-sm); }
.planning-event .rdv-pastille { position: absolute; top: 3px; right: 4px; }
.planning-event.a-pastille { padding-right: 1rem; }
.rdv-pastille-badge {
    display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; border-radius: 999px;
    font-size: .8rem; font-weight: 700; color: var(--pastille);
    background: color-mix(in srgb, var(--pastille) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--pastille) 35%, transparent);
}

/* ---------- Agenda : durée réglée en tirant le bas du RDV ---------- */
.planning-event .rdv-poignee {
    position: absolute; left: 0; right: 0; bottom: 0; height: 8px;
    cursor: ns-resize; touch-action: none;
}
.planning-event .rdv-poignee::after {
    content: ""; position: absolute; left: 50%; bottom: 2px; width: 22px; height: 3px; margin-left: -11px;
    border-radius: 2px; background: currentColor; opacity: 0; transition: opacity .12s;
}
.planning-event:hover .rdv-poignee::after, .planning-event.is-resizing .rdv-poignee::after { opacity: .45; }
.planning-event.is-resizing { z-index: 5; transition: none; transform: none; box-shadow: var(--sh-md); cursor: ns-resize; }
@media (pointer: coarse) {
    /* Au doigt : poignée plus haute, toujours visible. */
    .planning-event .rdv-poignee { height: 14px; }
    .planning-event .rdv-poignee::after { opacity: .45; }
}

/* ---------- Fiche RDV : Appeler / Y aller ---------- */
.rdv-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.rdv-actions .btn { flex: 1 1 10rem; }

/* ---------- Carte des clients : « Me localiser » ---------- */
.carte-localiser a { display: flex; align-items: center; justify-content: center; font-size: 1rem; color: #334155; }
.carte-localiser a.is-attente i { animation: carte-localiser 1s linear infinite; }
.carte-localiser a.is-actif { color: #2563eb; }
@keyframes carte-localiser { to { transform: rotate(360deg); } }

/* ---------- Campagnes de relance : sélection et compte-rendu commun ---------- */
.campagne-table__case { width: 2.2rem; padding-right: 0 !important; }
.campagne-selection-barre {
    position: sticky; bottom: .75rem; z-index: 5;
    display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
    margin: .5rem; padding: .5rem .75rem; border-radius: var(--r-lg);
    background: var(--surface); border: 1px solid rgba(124,92,255,.35); box-shadow: var(--sh-md);
}
.campagne-selection-barre__compte { font-weight: 700; font-size: .88rem; color: var(--v1); }
.campagne-cr-fiches li + li { margin-top: .2rem; }

/* ---------- Configurateur : prix d'une pièce ou du modèle changé à la main ---------- */
.conf-prix { display: flex; align-items: center; gap: .4rem; margin-top: .35rem; flex-wrap: wrap; }
.conf-prix[hidden] { display: none; }
.conf-prix__lbl { font-size: .72rem; font-weight: 600; color: var(--ink-faint); margin: 0; }
.conf-prix__champ { width: 6.5rem; text-align: right; }
.conf-prix--modele .conf-prix__champ { width: 9rem; }
.conf-prix__catalogue { font-size: .72rem; color: var(--ink-faint); }
.conf-prix.is-modifie .conf-prix__champ { border-color: #f97316; background: rgba(249,115,22,.06); font-weight: 700; }
.conf-prix.is-modifie .conf-prix__catalogue { text-decoration: line-through; }
.conf-prix__offert {
    margin-left: auto; padding: .1rem .55rem; border-radius: 999px; font-size: .7rem; font-weight: 700;
    color: #16a34a; background: rgba(22,163,74,.08); border: 1px dashed rgba(22,163,74,.45);
}
.conf-prix__offert:hover { border-style: solid; }

/* ---------- Configurateur : regrouper plusieurs configurations dans un devis ---------- */
.conf-regrouper { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .6rem; }
.conf-ligne-config { display: flex; align-items: center; gap: .6rem; }
.conf-ligne-config > .collection-item { flex: 1 1 auto; min-width: 0; }
.conf-regrouper__case { flex: 0 0 auto; width: 1.15rem; height: 1.15rem; margin: 0; }

/* ---------- Menu : commandes envoyées à l'ADV, à finaliser ---------- */
.sidebar-nav .nav-pastille {
    margin-left: auto; min-width: 1.3rem; padding: 0 .38rem; border-radius: 999px;
    font-size: .7rem; font-weight: 800; line-height: 1.3rem; text-align: center;
    color: #fff; background: #e11d48; box-shadow: 0 0 0 2px var(--surface);
}

/* ---------- Commande rapide (mobile) : le formulaire du document réduit à la
   maquette de Romain — client, interlocuteurs, société, type, lignes (article,
   quantité, prix, remise), total, commentaires. Les autres champs restent
   envoyés tels quels, masqués. ---------- */
.doc-form--rapide .doc-bandeau .card-body > .row {
    display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .55rem .6rem; margin: 0;
    /* La société d'abord : tant qu'elle est vide, le reste est voilé (D3). */
    grid-template-areas: "societe type" "client client" "interlocuteur interne";
}
.doc-form--rapide .doc-bandeau .card-body > .row > * { width: auto; max-width: none; min-width: 0; padding: 0; margin: 0; }
.doc-form--rapide .doc-bandeau .card-body > .row > :not(.rapide-garde) { display: none !important; }
/* Plus spécifiques que les « span » de la grille serrée du bon de commande (v6-form.css, v8-saisie.css). */
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde { grid-column: auto; }
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde.rapide-client { grid-area: client; }
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde.rapide-interlocuteur { grid-area: interlocuteur; }
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde.rapide-interne { grid-area: interne; }
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde.rapide-societe { grid-area: societe; }
.doc-form--rapide[data-doc-type] .doc-bandeau .card-body > .row > .rapide-garde.rapide-type { grid-area: type; }
.doc-form--rapide .rapide-garde .ts-wrapper, .doc-form--rapide .rapide-garde .form-control, .doc-form--rapide .rapide-garde .form-select { width: 100%; max-width: 100%; }
.doc-form--rapide .rapide-masque { display: none; }
.doc-form--rapide .rapide-interne .mt-2 { margin-top: 0 !important; }
.doc-form--rapide .doc-bandeau .form-label { white-space: normal; }
.doc-form--rapide .lignes-entete,
.doc-form--rapide .lignes-ajouter-sous-total,
.doc-form--rapide .lignes-totaux .text-muted { display: none; }
.doc-form--rapide .lignes-tableau .ligne-row {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    grid-template-areas: "article article article suppr" "qte pu remise .";
    padding: .55rem; row-gap: .45rem;
}
.doc-form--rapide .lignes-tableau .ligne-row > .lg-ordre,
.doc-form--rapide .lignes-tableau .ligne-row > [data-lg="Désignation"],
.doc-form--rapide .lignes-tableau .ligne-row > [data-lg="TVA %"],
.doc-form--rapide .lignes-tableau .ligne-row > [data-lg="Écotaxe"],
.doc-form--rapide .lignes-tableau .lg-inserer { display: none; }
.doc-form--rapide .lignes-tableau [data-lg="Article"] { grid-area: article; }
.doc-form--rapide .lignes-tableau [data-lg="Qté"] { grid-area: qte; }
.doc-form--rapide .lignes-tableau [data-lg="PU HT"] { grid-area: pu; }
.doc-form--rapide .lignes-tableau [data-lg="Remise %"] { grid-area: remise; }
.doc-form--rapide .lignes-tableau .lg-actions { grid-area: suppr; align-self: start; }
.doc-form--rapide .lignes-tableau .lg-cell::before { display: block; margin-bottom: .12rem; }
/* Champs à 16 px : iOS ne zoome plus à la saisie. */
.doc-form--rapide .form-control, .doc-form--rapide .form-select, .doc-form--rapide .ts-control { font-size: 16px !important; }
.doc-form--rapide .doc-actions { flex-wrap: wrap; }
.doc-form--rapide .doc-envoyer-adv { flex: 1 1 100%; order: 10; padding: .7rem; font-weight: 700; }

/* ---------- Mon menu / Mon tableau de bord : ordre par glisser-déposer ---------- */
.tri-poignee {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
    width: 1.6rem; height: 2rem; margin-left: -.4rem; border-radius: 6px;
    color: var(--ink-faint); cursor: grab; touch-action: none; user-select: none;
}
.tri-poignee:hover { color: var(--v1); background: var(--grad-soft); }
[data-tri-glisser-target="ligne"].is-glissee {
    position: relative; z-index: 2; cursor: grabbing;
    background: var(--surface); box-shadow: var(--sh-md), 0 0 0 2px rgba(124,92,255,.45);
}
[data-tri-glisser-target="ligne"].is-glissee .tri-poignee { cursor: grabbing; color: var(--v1); }
[data-tri-glisser-target="ligne"].is-deposee { opacity: .6; }