/* Commentaires des fiches (Guillaume, 01/10 au soir ; 13/10 : « en bas comme c'était à l'origine ») : commentaires et mails en
   bas de la fiche, la barre latérale de Frappe visible (étiquettes, personnes assignées, partage). Gardés : « Répondre », pièces
   jointes dans un commentaire, activité repliée par défaut (commentaires et mails restent visibles). */

/* Écrire un commentaire : le champ, puis une ligne « Joindre » … « Commenter » */

.fg-com-actions { display: flex; align-items: center; gap: 8px; margin: 6px 0 0 40px; }
.fg-com-actions .btn-comment { margin-left: auto; }
.fg-com-joindre { border: 1px solid var(--border-color); background: transparent; color: var(--text-color); border-radius: var(--gips-r-pilule);
	padding: 3px 10px; font-size: var(--gips-t-s); cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.fg-com-joindre:hover { border-color: var(--primary); }
.fg-com-joindre .icon { margin: 0 !important; }
.comment-box.fg-survol { outline: 2px dashed var(--primary); outline-offset: 4px; border-radius: var(--gips-r-s); }

/* L'historique : replié par défaut (commentaires et mails restent visibles) ; un seul interrupteur, le nôtre — celui d'ERPNext
   (« Afficher toute l'activité ») ferait doublon (02/10). */
body[data-route^="Form/"] .timeline-item.activity-title .show-all-activity,
body[data-route^="Form/"] .timeline-item.activity-title .switch { display: none !important; }
body:not(.fg-activite-visible) .new-timeline .timeline-items > .timeline-item:not([data-doctype="Comment"]):not([data-doctype="Communication"]):not(:has(.btn-load-more)) {
	display: none;
}
.fg-activite-bascule { border: 0; background: transparent; color: var(--gips-accent-texte, var(--primary)); font-size: var(--gips-t-s); padding: 0; margin-left: auto; cursor: pointer; }
.fg-activite-bascule:hover { text-decoration: underline; }
.fg-activite-bascule, .fg-mails-bascule { white-space: nowrap; flex: none; }   /* 22/10 (T14) : jamais coupé */
.fg-activite-bascule.actif { font-weight: 700; }
/* Mails en bas de la fiche, sur toute la largeur, repliables (13/10, public/js/commentaires_fiches.js) */
.fg-pied-large { width: 100%; }
.fg-pied-large .form-footer { max-width: none; }
.fg-mails-bascule { border: 0; background: transparent; color: var(--gips-accent-texte, var(--primary)); font-size: var(--gips-t-s); padding: 0; margin-left: auto; cursor: pointer; }
.fg-mails-bascule + .fg-activite-bascule { margin-left: 14px; }
.fg-mails-bascule:hover { text-decoration: underline; }
.fg-mail-tete { cursor: pointer; }
/* 14/10 (Guillaume : « tous les mails repliés par défaut, en conformité avec l'activité ; on clique pour montrer l'e-mail ») : replié,
   un mail est une ligne comme l'activité (commentaires_fiches.js : ligne_mail) ; la carte complète revient avec « Tout déplier ». */
/* 14/10 (Guillaume : « l'icône chevauche le texte ; aligne le texte avec les autres ; un pictogramme transparent plutôt qu'avec un
   fond blanc ») : la ligne est un .timeline-content de Frappe (retrait et marges de Frappe, rien d'écrit ici) ; l'enveloppe reste
   la .timeline-badge de Frappe, posée sur le trait comme le trombone d'une pièce jointe de l'activité, mais sans fond. */
.timeline-item .timeline-content.fg-mail-ligne { display: none; }
.fg-mail.fg-mail-replie .timeline-content.fg-mail-ligne { display: block; color: var(--text-muted); cursor: pointer; }
.fg-mail.fg-mail-replie .fg-mail-ligne:hover .fg-ml-txt { color: var(--primary); text-decoration: underline; }
.fg-mail.fg-mail-replie .fg-mail-ligne:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: var(--gips-r-s); }
.fg-mail.fg-mail-replie .timeline-content:not(.fg-mail-ligne) { display: none !important; }
.timeline-item.fg-mail.fg-mail-replie > .timeline-badge { background-color: transparent; box-shadow: none; border-color: transparent; }
.fg-com-repondre { font-size: var(--gips-t-s); color: var(--text-muted); cursor: pointer; margin-left: 8px; }
.fg-com-repondre:hover { color: var(--primary); text-decoration: underline; }

/* Onglets des fiches dans l'alignement du texte (Guillaume, 01/10 au soir : « tous les menus de Fiche Globale, alignés sur le
   texte ») : même colonne que le contenu de la fiche (largeur de page d'ERPNext, centrée), le premier onglet au bord du texte. */
body:not(.full-width)[data-route^="Form/"] .form-tabs-list .form-tabs {
	max-width: var(--page-max-width); margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 0;
}

/* Discussion de la fiche (13/10, public/js/discussion_fiche.js) : à droite, dans la barre latérale, sous Assigner / Étiquettes /
   Partager ; en bas, alors, seulement les mails et l'historique. Barre repliée ou téléphone : les commentaires restent en bas. */
body.fg-discussion-active .new-timeline .timeline-item[data-doctype="Comment"],
body.fg-discussion-active .form-footer .comment-box { display: none !important; }
/* 13/10 au soir (Guillaume : « dans l'axe du reste ») : les mêmes marges que les rubriques de Frappe au-dessus (Assigner, Pièces
   jointes, Étiquettes : .form-sidebar .sidebar-section). */
.fg-discussion { margin-top: 0; padding: var(--padding-md) var(--padding-md) var(--padding-md); border-top: 1px solid var(--border-color);
	display: flex; flex-direction: column; gap: 8px; }
.fg-disc-titre { display: flex; align-items: center; gap: 6px; font-size: var(--gips-t-s); font-weight: 600; color: var(--text-muted);
	text-transform: uppercase; letter-spacing: .05em; }
.fg-disc-titre .icon { margin: 0 !important; }
.fg-disc-fil { max-height: 46vh; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding-right: 2px; }
.fg-disc-vide { font-size: var(--gips-t-s); color: var(--text-muted); padding: 4px 0; }
.fg-bulle { max-width: 92%; align-self: flex-start; background: var(--control-bg); border-radius: var(--gips-r-m) var(--gips-r-m) var(--gips-r-m) var(--gips-r-xs);
	padding: 6px 9px; font-size: var(--gips-t-s); }
.fg-bulle.fg-bulle-moi { align-self: flex-end; background: var(--gips-bleu-fond, var(--control-bg));
	border-radius: var(--gips-r-m) var(--gips-r-m) var(--gips-r-xs) var(--gips-r-m); }
.fg-bulle-tete { display: flex; align-items: center; gap: 5px; color: var(--text-muted); font-size: var(--gips-t-xs); }
.fg-bulle-tete .avatar { width: 18px; height: 18px; }
.fg-bulle-nom { font-weight: 600; color: var(--text-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fg-bulle-quand { margin-left: auto; white-space: nowrap; }
.fg-bulle-texte { margin-top: 3px; color: var(--text-color); overflow-wrap: anywhere; line-height: 1.4; }
.fg-bulle-texte p { margin: 0 0 4px; }
.fg-bulle-texte blockquote { margin: 0 0 4px; padding-left: 8px; border-left: 2px solid var(--border-color); color: var(--text-muted); }
.fg-bulle-texte img { max-width: 100%; border-radius: var(--gips-r-s); }
.fg-bulle-repondre { font-size: var(--gips-t-xs); color: var(--text-muted); cursor: pointer; }
.fg-bulle-repondre:hover { color: var(--primary); text-decoration: underline; }
.fg-disc-saisie .ql-editor { min-height: 54px; max-height: 180px; overflow-y: auto; font-size: var(--gips-t-s); background: var(--control-bg);
	border-radius: var(--gips-r-s); }
.fg-disc-actions { display: flex; align-items: center; gap: 6px; }
.fg-disc-aide { font-size: var(--gips-t-xs); color: var(--text-muted); }
.fg-disc-envoyer { margin-left: auto; }
.fg-disc-joindre { border: 1px solid var(--border-color); background: transparent; border-radius: var(--gips-r-pilule); padding: 2px 7px; cursor: pointer;
	display: inline-flex; align-items: center; }
.fg-disc-joindre .icon { margin: 0 !important; }
.fg-disc-saisie .comment-input-header, .fg-disc-saisie .control-label, .fg-disc-saisie .comment-input-container > .avatar,
.fg-disc-saisie .frappe-control > .avatar { display: none !important; }
.fg-disc-saisie .frappe-control { margin: 0; }
.fg-disc-saisie .btn-comment { display: none !important; }       /* « Envoyer » suffit */

/* 13/10 au soir (Guillaume : « réduis l'espace entre la fin de la couleur claire et la couleur plus foncée, 20 ou 30 points pas plus,
   et colle « Mails et historique » à 20 ou 30 points maximum — sur tous les écrans ») : sur une fiche, la zone claire s'arrête 24 px
   sous le dernier élément, et le titre des mails est 24 px sous le début de la zone foncée. Les 200 px d'air des 08 et 09/10
   (theme_gips.css) restent pour les listes et les pages, qui n'ont pas de mails dessous. */
body[data-route^="Form/"] .form-layout .form-page { padding-bottom: 20px; }
body[data-route^="Form/"] .page-container .layout-main-section-wrapper { padding-bottom: 0 !important; }
body[data-route^="Form/"] .form-footer .new-timeline { padding-top: 20px !important; margin-top: 0 !important; }
/* 14/10 : « Mails et historique » à 20 px sous la zone claire, pas plus — rien d'autre au-dessus du titre. */
body[data-route^="Form/"] .form-footer, body[data-route^="Form/"] .form-footer .after-save { margin-top: 0 !important; padding-top: 0 !important; }
body[data-route^="Form/"] .form-footer .timeline-item.activity-title { min-height: 0; padding-top: 0; padding-bottom: 8px; margin-top: 0; }

/* Panneau de droite repliable (15/10, Guillaume : « replier cette zone si besoin en laissant des pictogrammes actifs qui rouvrent la
   zone, et un pictogramme d'ouverture / fermeture » — public/js/barre_laterale.js). Ouvert : la poignée « replier » en haut. Replié :
   une bande de 48 px, un pictogramme par rubrique avec son nombre ; la fiche prend la largeur rendue. */
.fg-barre-entete { display: flex; justify-content: flex-start; padding: 6px var(--padding-md) 0; }
.fg-rail { display: none; }
.layout-side-section.fg-barre-repliee { width: 48px !important; min-width: 48px !important; max-width: 48px !important;
	padding-left: 0 !important; padding-right: 0 !important; overflow: visible; }
.layout-side-section.fg-barre-repliee > :not(.fg-rail) { display: none !important; }
.layout-side-section.fg-barre-repliee > .fg-rail { display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 8px; }
.fg-rail-btn { position: relative; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
	border: 0; background: transparent; color: var(--text-muted); border-radius: var(--gips-r-s); cursor: pointer; }
.fg-rail-btn:hover, .fg-rail-btn:focus-visible { background: var(--control-bg); color: var(--text-color); outline: none; }
.fg-rail-btn .icon { margin: 0 !important; }
.fg-rail-deplier, .fg-barre-poignee { color: var(--gips-marine, var(--text-color)); }
.fg-rail-sep { width: 22px; height: 1px; background: var(--border-color); margin: 2px 0 4px; }
.fg-rail-nb { position: absolute; top: 0; right: -2px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--gips-r-pilule);
	background: var(--gips-orange); color: var(--gips-sur-couleur); font-size: var(--gips-t-xs); line-height: 16px; text-align: center; font-variant-numeric: tabular-nums; }
.fg-rail-nb[hidden] { display: none; }
.fg-rail-eclaire { background: var(--gips-bleu-fond, var(--control-bg)); border-radius: var(--gips-r-s); transition: background .4s; }

/* 16/10 (audit 3.001, MAI-11) : les fils de Mail rattachés à la fiche, dans « Mails et historique » (commentaires_fiches.js) — une ligne
   chacun, comme un e-mail replié ; un clic l'ouvre dans Mail. */
.fg-fils-mail { margin: 6px 0 10px; }
.fg-fils-mail .fg-fils-titre { margin: 0 0 2px; font-size: var(--gips-t-xs); }
.fg-fils-mail .fg-fil-ligne { display: block; padding: 3px 0; color: var(--text-muted); font-size: var(--gips-t-s); text-decoration: none; }
.fg-fils-mail .fg-fil-ligne:hover .fg-ml-txt { color: var(--primary); text-decoration: underline; }
.fg-fils-mail .fg-fil-ligne .indicator { margin-right: 4px; }
