/* ═══════════════════════════════════════════════════════════════════════════ CTIERP — Composants réutilisables site-wide (c) CTI-Ouest 2026 · Bootstrap 3.3.7 + Font Awesome 4.7 Inclus via erp/index.php dans ════════════════════════════════════════════════════════════════════════════ */ /* ── Palette documents FACTIZY ──────────────────────────────────────────── */ /* Source : image palette FACTIZY fournie par l'utilisateur DV Devis → orange #e67e22 BC Bon de commande → bleu/teal #17a2b8 BL Bon livraison → bleu marine #1a3a6b FA Facture → rouge #c0392b FAR Facture réglée → rouge foncé #922b21 AV Avoir → vert #27ae60 FPF / CF → violet #8e44ad */ :root { --doc-dv: #e67e22; --doc-dv-d: #cf6d17; --doc-bc: #17a2b8; --doc-bc-d: #148398; --doc-bl: #1a3a6b; --doc-bl-d: #12294d; --doc-fa: #c0392b; --doc-fa-d: #a93226; --doc-fa-r: #922b21; --doc-fa-rd: #7b241c; --doc-av: #27ae60; --doc-av-d: #1e8449; --doc-fpf: #8e44ad; --doc-fpf-d: #7d3c98; } /* ── Paire de boutons document : [Édition FACTIZY] [PDF] ────────────────── * * * * Usage HTML : * *
* * * * BL376 * * * * * * * * * *
* * * * Modificateurs : * * .fldoc-block → prend toute la largeur du conteneur * * .fldoc-ico → bouton éditeur aussi en icône seule (pas de texte) * * ──────────────────────────────────────────────────────────────────────── */ .fldoc-pair { display: inline-flex; align-items: stretch; border-radius: 4px; overflow: hidden; vertical-align: middle; font-size: 11px; font-weight: 600; line-height: 1; box-shadow: 0 1px 3px rgba(0,0,0,.2); flex-shrink: 0; } .fldoc-pair .fldoc-edit, .fldoc-pair .fldoc-pdf { display: inline-flex; align-items: center; justify-content: center; height: 22px; padding: 0 8px; color: #fff !important; text-decoration: none !important; white-space: nowrap; gap: 4px; transition: filter .1s; border: none; cursor: pointer; font-family: inherit; font-size: inherit; font-weight: inherit; } /* Séparateur visuel entre les deux boutons */ .fldoc-pair .fldoc-edit { border-right: 1px solid rgba(255,255,255,.28); } /* Bouton PDF : icône seule, largeur fixe */ .fldoc-pair .fldoc-pdf { padding: 0; width: 26px; } .fldoc-pair .fldoc-edit:hover, .fldoc-pair .fldoc-pdf:hover { filter: brightness(1.15); color: #fff !important; text-decoration: none !important; } /* ── Paires dans cellules de tableau : largeur fixe pour ne pas étirer les colonnes ── */ .table td > .fldoc-pair { width: 86px; max-width: 86px; } .table td > .fldoc-pair .fldoc-edit { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; } /* ── Modificateur : full-width (dans cti-transport-bl, etc.) ── */ .fldoc-pair.fldoc-block { display: flex; width: 100%; } .fldoc-pair.fldoc-block .fldoc-edit { flex: 1; } /* ── Modificateur : icône seule pour l'éditeur (espaces très limités) ── */ .fldoc-pair.fldoc-ico .fldoc-edit { padding: 0; width: 26px; flex: 0 0 26px; overflow: hidden; } .fldoc-pair.fldoc-ico .fldoc-label { display: none; } /* ── Groupe droit dans la timeline événements : prix + boutons ── */ .fl-event-actions { float: right; display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; flex-shrink: 0; } /* ── Couleurs par type de document ──────────────────────────────────────── */ .fldoc-dv .fldoc-edit { background: var(--doc-dv); } .fldoc-dv .fldoc-pdf { background: var(--doc-dv-d); } .fldoc-bc .fldoc-edit { background: var(--doc-bc); } .fldoc-bc .fldoc-pdf { background: var(--doc-bc-d); } .fldoc-bl .fldoc-edit { background: var(--doc-bl); } .fldoc-bl .fldoc-pdf { background: var(--doc-bl-d); } .fldoc-fa .fldoc-edit { background: var(--doc-fa); } .fldoc-fa .fldoc-pdf { background: var(--doc-fa-d); } .fldoc-fa-r .fldoc-edit { background: var(--doc-fa-r); } .fldoc-fa-r .fldoc-pdf { background: var(--doc-fa-rd); } .fldoc-av .fldoc-edit { background: var(--doc-av); } .fldoc-av .fldoc-pdf { background: var(--doc-av-d); } .fldoc-fpf .fldoc-edit { background: var(--doc-fpf); } .fldoc-fpf .fldoc-pdf { background: var(--doc-fpf-d); } /* ── Bloc financier collé au bas de son conteneur ───────────────────────── */ /* La row devient flex pour que les deux colonnes s'étirent à la même hauteur */ .fl-row-main { display: flex !important; align-items: stretch; flex-wrap: wrap; } .fl-row-main > [class*="col-"] { float: none !important; /* annule le float Bootstrap */ } /* Colonne droite : flex-colonne pour empiler box + marge basse */ .fl-fin-col { display: flex; flex-direction: column; padding-bottom: 10px; /* les 10 px demandés */ } /* Le box s'étire pour remplir la colonne */ .fl-fin-box { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; } /* Le corps du box prend toute la hauteur restante et devient scrollable */ .fl-fin-box .cti-box-mini-body { flex: 1 1 0; min-height: 0; overflow-y: auto; }