/* ------------------------------------------------------------------
   Facette · onglet « D'où viennent les calls » (10/10/2026)
   Que des variables de styles.css ; le thème clair est redit en bas
   (lignes html[data-theme="clair"]) pour ne pas dépendre de
   theme-clair.py.
   ------------------------------------------------------------------ */

#vue-origine{--or-violet:#8B66FA;--or-vert:#1FA884;--or-orange:#FF9A3D;--or-rose:#F4467E;--or-bleu:#3D86F0;--or-gris:rgba(246,242,255,.42);padding:0 var(--marge,16px) 24px}
#vue-origine .or-barre{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:flex-end;justify-content:space-between;margin:6px 0 14px}
#vue-origine .or-titre{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.4vw,28px);letter-spacing:-0.01em}
#vue-origine .or-sous{color:var(--texte-doux);font-size:14px;margin-top:2px}
#vue-origine .or-periodes{display:flex;flex-wrap:wrap;gap:6px}

/* ---- les tuiles ---- */
#vue-origine .or-tuiles{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:14px}
#vue-origine .or-tuile{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:var(--rayon);border:1px solid var(--trait);background:var(--carte);min-width:0}
#vue-origine .or-tuile-etiquette{font-size:12px;color:var(--texte-faible);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
#vue-origine .or-tuile-valeur{font-family:var(--display);font-weight:800;font-size:clamp(28px,3vw,38px);letter-spacing:-0.02em;line-height:1.1}
#vue-origine .or-tuile-valeur small{font-size:15px;font-weight:600;color:var(--texte-doux);letter-spacing:0}
#vue-origine .or-tuile-detail{font-size:12.5px;color:var(--texte-doux)}
#vue-origine .or-tuile-chiffres{font-size:13.5px;font-weight:600;margin-top:2px}
#vue-origine .or-tuile-chiffres a{color:inherit}
#vue-origine .or-tuile--violet{border-color:rgba(139,102,250,.50);background:linear-gradient(160deg,rgba(139,102,250,.18),var(--carte) 65%)}
#vue-origine .or-tuile--vert{border-color:rgba(31,168,132,.50);background:linear-gradient(160deg,rgba(31,168,132,.18),var(--carte) 65%)}
#vue-origine .or-tuile--orange{border-color:rgba(255,154,61,.45);background:linear-gradient(160deg,rgba(255,154,61,.14),var(--carte) 65%)}

/* ---- les cartes et tableaux ---- */
#vue-origine .or-carte{border:1px solid var(--trait);border-radius:var(--rayon);background:var(--carte);padding:16px 17px;margin-bottom:14px;min-width:0}
#vue-origine .or-carte h3{font-family:var(--display);font-size:17px;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:8px}
#vue-origine .or-compte{font-family:var(--corps);font-size:12.5px;font-weight:600;color:var(--texte-doux);border:1px solid var(--trait-fort);border-radius:999px;padding:1px 9px}
#vue-origine .or-table-defile{overflow-x:auto;-webkit-overflow-scrolling:touch}
#vue-origine .or-table{width:100%;border-collapse:collapse;font-size:14px}
#vue-origine .or-table th,#vue-origine .or-table td{text-align:left;padding:9px 10px;border-top:1px solid var(--trait);white-space:nowrap;vertical-align:middle}
#vue-origine .or-table thead th{border-top:0;font-size:12px;color:var(--texte-faible);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
#vue-origine .or-table tbody th{font-weight:600}
#vue-origine .or-table td i{font-style:normal;color:var(--texte-faible);font-size:12.5px;margin-left:4px}
#vue-origine .or-pastille{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px}
#vue-origine .or-pastille--violet{background:var(--or-violet)}
#vue-origine .or-pastille--vert{background:var(--or-vert)}
#vue-origine .or-pastille--gris{background:var(--or-gris)}
#vue-origine .or-etat{display:inline-block;font-size:12.5px;font-weight:600;border-radius:999px;padding:2px 10px;border:1px solid var(--trait-fort)}
#vue-origine .or-etat--vert{border-color:rgba(31,168,132,.55);background:rgba(31,168,132,.14)}
#vue-origine .or-etat--bleu{border-color:rgba(61,134,240,.55);background:rgba(61,134,240,.14)}
#vue-origine .or-etat--orange{border-color:rgba(255,154,61,.55);background:rgba(255,154,61,.14)}
#vue-origine .or-etat--rose{border-color:rgba(244,70,126,.55);background:rgba(244,70,126,.14)}
#vue-origine .or-etat--gris{color:var(--texte-doux)}
#vue-origine .or-tel{font-family:var(--mono);font-size:13px}
#vue-origine .or-note{font-size:12px;color:var(--texte-faible);margin-top:8px}
#vue-origine .or-note--haut{margin:-4px 0 8px}
#vue-origine .or-vide{color:var(--texte-doux);font-size:14px}
#vue-origine .or-calcul summary{cursor:pointer;font-weight:600}
#vue-origine .or-calcul ul{margin:10px 0 0 18px;font-size:13.5px;color:var(--texte-doux);display:grid;gap:6px}

/* ---- téléphone d'abord ---- */
@media (max-width:900px){#vue-origine .or-tuiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){
  #vue-origine .or-tuiles{grid-template-columns:minmax(0,1fr)}
  #vue-origine .or-table th,#vue-origine .or-table td{padding:8px 7px;font-size:13px}
}

/* ---- fond clair ---- */
html[data-theme="clair"] #vue-origine{--or-violet:#6E3AF7;--or-vert:#0F8A6A;--or-orange:#C76A00;--or-gris:rgba(43,33,24,.40)}
html[data-theme="clair"] #vue-origine .or-tuile--violet{background:linear-gradient(160deg,rgba(110,58,247,.10),var(--carte) 65%)}
html[data-theme="clair"] #vue-origine .or-tuile--vert{background:linear-gradient(160deg,rgba(15,138,106,.10),var(--carte) 65%)}
html[data-theme="clair"] #vue-origine .or-tuile--orange{background:linear-gradient(160deg,rgba(199,106,0,.10),var(--carte) 65%)}
