/* Fiche ticket (Ticket/edit.html.twig) : colonne de gauche en cartes simples (client, suivi, note
interne), fil de messages pleine largeur, zone de réponse repliée puis dépliée et collante au
défilement, activité en petites lignes grises. Jetons du thème central. */
@layer components {
/* Page : colonne de gauche à largeur fixe, fil à droite (empilés sous 1280 px). 340 px, puis 360 px dès
1536 px de large (le 1920 px de la version validée donnait 360 px). */
[data-stamina-turbo-region] .ticket-page { --ticket-side: 340px; }
@media (min-width: 1280px) { [data-stamina-turbo-region] .ticket-page { grid-template-columns: var(--ticket-side) minmax(0, 1fr); } }
@media (min-width: 1536px) { [data-stamina-turbo-region] .ticket-page { --ticket-side: 360px; } }
/* ---------- Colonne de gauche : cartes simples (Ticket/toolbar.html.twig) ----------
Qui écrit, le suivi, la note interne : une carte chacun, peu d'éléments, pas de cadres
intérieurs. Les réglages s'éditent en place et s'enregistrent au changement. */
/* L'espacement entre cartes vient du socle (marge d'empilement des cartes d'un formulaire). */
[data-stamina-turbo-region] .ticket-side { display: flex; flex-direction: column; }
/* Titre et outil (Changer, Équipe) restent sur une ligne, même sur une carte étroite. */
[data-stamina-turbo-region] .ticket-card > .card-head { flex-wrap: nowrap; }
[data-stamina-turbo-region] .ticket-card > .card-head .disclosure-title { flex-basis: 0; }
/* Le contenu de la carte sert d'ancre au widget masqué d'un champ en place (menu, recherche). */
[data-stamina-turbo-region] .ticket-card > .card-body { position: relative; }
[data-stamina-turbo-region] .ticket-client { position: relative; }
/* Nom du client en titre de carte : lien discret vers la fiche, tronqué si trop long. */
[data-stamina-turbo-region] .ticket-card__name { color: inherit; &:hover { color: var(--color-accent); } }
[data-stamina-turbo-region] .ticket-card__hint { display: inline-flex; align-items: center; gap: .375rem; color: var(--color-muted); font-size: .78125rem }
/* Adresse e-mail copiable au clic : discrète, soulignée au survol. */
[data-stamina-turbo-region] .ticket-copy {
max-width: 100%;
padding: 0;
border: 0;
background: none;
color: var(--color-muted);
font-size: inherit;
cursor: pointer;
}
[data-stamina-turbo-region] .ticket-copy:hover { color: var(--color-accent); text-decoration: underline; text-underline-offset: 2px; }
/* ---------- Fil : zone de réponse puis messages, tous frères (les flux Turbo insèrent les
nouveaux éléments juste après la zone de réponse) ---------- */
[data-stamina-turbo-region] .ticket-thread { position: relative; display: flex; flex-direction: column; gap: .875rem; }
/* Repère invisible posé par le contrôleur de réponse en tête du fil, observé pour savoir si la zone est collée. */
[data-stamina-turbo-region] .ticket-thread__sentinel { position: absolute; top: 0; left: 0; width: 1px; height: 1px; pointer-events: none; }
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-message-add { display: block; margin-bottom: .375rem; }
/* Collante au défilement, sur grand écran seulement. Une fois collée (is-stuck, posée par le
contrôleur), un bandeau couleur de page masque les cartes qui défilent au-dessus d'elle ; il
s'arrête à mi-hauteur de la carte pour que les messages passent sous la carte flottante. */
@media (min-width: 1024px) {
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-message-add {
position: sticky;
top: 1.25rem;
z-index: 20;
}
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-message-add.is-stuck::before {
content: "";
position: absolute;
z-index: -1;
left: -.75rem;
right: -.75rem;
top: -1.25rem;
bottom: 50%;
background: var(--color-canvas);
pointer-events: none;
}
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-message-add.is-stuck .ticket-reply {
box-shadow: 0 12px 32px -12px rgb(29 21 49 / .28), var(--shadow-card);
}
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-message-add.is-stuck .ticket-reply.is-open {
box-shadow: 0 12px 32px -12px rgb(29 21 49 / .28), var(--shadow-card);
}
}
/* ---------- Zone de réponse : repliée, s'agrandit en douceur au clic ----------
Astuce grid-template-rows 0fr → 1fr : la hauteur s'anime sans la connaître à l'avance.
La barre repliée s'efface, puis les blocs de l'éditeur apparaissent l'un après l'autre. */
[data-stamina-turbo-region] .ticket-reply {
--ticket-ease: cubic-bezier(.2, .8, .2, 1);
position: relative;
margin-bottom: 0;
transition: box-shadow .3s var(--ticket-ease);
}
/* Ouverte : la carte se soulève (ombre portée), sans liseré de couleur. */
[data-stamina-turbo-region] .ticket-reply.is-open { box-shadow: 0 10px 30px -12px rgb(29 21 49 / .22), var(--shadow-card); }
/* Barre repliée et zone dépliée occupent la MÊME cellule : la barre s'estompe pendant que la zone grandit et que
ses blocs apparaissent (fondu enchaîné, la hauteur suit le plus haut des deux : aucun trou, « Répondre » ne
disparaît jamais avant que le contenu arrive). */
[data-stamina-turbo-region] .ticket-reply { display: grid; }
/* Un fichier survole la page : la réponse s'entoure pour montrer qu'on peut l'y lâcher. */
[data-stamina-turbo-region] .ticket-reply.is-file-drop-target { outline: 2px solid var(--color-accent); outline-offset: 2px; }
[data-stamina-turbo-region] .ticket-reply > :is(.ticket-reply__fold, .ticket-reply__open) { grid-area: 1 / 1; min-width: 0; }
[data-stamina-turbo-region] .ticket-reply__fold { transition: opacity .3s ease .08s, visibility 0s; }
[data-stamina-turbo-region] .ticket-reply__fold > div { overflow: hidden; border-radius: inherit; }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__fold { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .22s ease, visibility 0s .22s; }
[data-stamina-turbo-region] .ticket-reply__closed { display: flex; align-items: center; gap: .75rem; padding: .875rem 1rem; cursor: text; }
[data-stamina-turbo-region] .ticket-reply__me { display: none; flex: none; }
@media (min-width: 768px) { [data-stamina-turbo-region] .ticket-reply__me { display: inline-flex; } }
[data-stamina-turbo-region] .ticket-reply__me img,
[data-stamina-turbo-region] .ticket-reply__me .avatar { width: 2.25rem; height: 2.25rem; border-radius: 50%; }
[data-stamina-turbo-region] .ticket-reply__placeholder {
flex: 1;
min-width: 0;
padding: .5625rem 1rem;
border: 0;
border-radius: 999px;
background: var(--color-tile);
box-shadow: inset 0 0 0 1px var(--color-field);
color: var(--color-muted);
font-size: .875rem;
text-overflow: ellipsis;
transition: box-shadow .15s;
}
[data-stamina-turbo-region] .ticket-reply__placeholder::placeholder { color: var(--color-ink-2); opacity: .7; }
/* Réponse en cours repliée : l'invite le dit, en appuyé. */
[data-stamina-turbo-region] .ticket-reply.has-draft .ticket-reply__placeholder::placeholder { color: var(--color-ink); font-weight: 600; opacity: 1; }
[data-stamina-turbo-region] .ticket-reply__placeholder:focus { outline: none; box-shadow: inset 0 0 0 1px var(--color-field-hover); }
[data-stamina-turbo-region] .ticket-reply__closed:hover .ticket-reply__placeholder { box-shadow: inset 0 0 0 1px var(--color-field-hover); }
[data-stamina-turbo-region] .ticket-reply__cta-label { display: none; }
@media (min-width: 768px) { [data-stamina-turbo-region] .ticket-reply__cta-label { display: inline; } }
[data-stamina-turbo-region] .ticket-reply__open { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .42s var(--ticket-ease), visibility 0s .42s; }
[data-stamina-turbo-region] .ticket-reply__inner { min-height: 0; overflow: hidden; border-radius: inherit; }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__open { grid-template-rows: 1fr; transition: grid-template-rows .42s var(--ticket-ease), visibility 0s; }
/* Une fois dépliée, on lève le overflow:hidden pour que les menus (modèles, temps passé…) débordent. */
[data-stamina-turbo-region] .ticket-reply.is-settled .ticket-reply__inner { overflow: visible; }
[data-stamina-turbo-region] .ticket-reply__inner > * { opacity: 0; transform: translateY(-8px); transition: opacity .3s ease, transform .35s var(--ticket-ease); }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__inner > * { opacity: 1; transform: none; }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__inner > * { transition-delay: .06s; }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__inner > :nth-child(3) { transition-delay: .1s; }
[data-stamina-turbo-region] .ticket-reply.is-open .ticket-reply__inner > :nth-child(4) { transition-delay: .14s; }
@media (prefers-reduced-motion: reduce) {
[data-stamina-turbo-region] .ticket-reply,
[data-stamina-turbo-region] .ticket-reply * { transition: none !important; }
}
/* Pliée, la partie ouverte ne doit ni se voir ni se tabuler. */
[data-stamina-turbo-region] .ticket-reply:not(.is-open) .ticket-reply__open { visibility: hidden; }
/* Destinataires : champ intégré à la ligne, façon messagerie, sans aplat ni marge. */
[data-stamina-turbo-region] .ticket-reply__row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .25rem .5rem;
min-height: 3.125rem;
padding: .25rem 1rem .25rem 1.25rem;
border-bottom: 1px solid var(--color-line);
}
[data-stamina-turbo-region] .ticket-reply__row.hidden { display: none; }
[data-stamina-turbo-region] .ticket-reply__label { flex: none; width: 2.5rem; color: var(--color-muted); font-size: .8125rem; }
[data-stamina-turbo-region] .ticket-reply__field { flex: 1 1 0; min-width: 8rem; }
[data-stamina-turbo-region] .ticket-reply__field :is(.form-row, .field, .form-group) { margin: 0; }
/* Destinataires : le sélecteur se fond dans la ligne (ni cadre, ni flèche). */
[data-stamina-turbo-region] .ticket-reply__field :is(.input-group, .stamina-ui-select-box) { min-height: 0; border: 0; background: transparent; box-shadow: none; }
[data-stamina-turbo-region] .ticket-reply__field .stamina-ui-select-search { padding-left: 0; border: 0; background: transparent; box-shadow: none; }
[data-stamina-turbo-region] .ticket-reply__field .stamina-ui-select-search::placeholder { color: var(--color-muted); }
[data-stamina-turbo-region] .ticket-reply__field .stamina-ui-select-caret { display: none; }
[data-stamina-turbo-region] .ticket-reply__row-tools { display: flex; flex: none; align-items: center; gap: .75rem; margin-left: auto; }
[data-stamina-turbo-region] .ticket-reply__cc { padding: 0; border: 0; background: none; color: var(--color-muted); font-size: .75rem; font-weight: 600; cursor: pointer; }
[data-stamina-turbo-region] .ticket-reply__cc:hover { color: var(--color-accent); }
[data-stamina-turbo-region] .ticket-reply__cc.hidden { display: none; }
/* Éditeur : un seul bord gauche à 20 px pour toute la carte. */
[data-stamina-turbo-region] .ticket-reply__editor { padding: .25rem 0 0; }
[data-stamina-turbo-region] .ticket-reply__editor .tox-tinymce { border: 0 !important; border-radius: 0; }
[data-stamina-turbo-region] .ticket-reply__hint { padding: 0 1.25rem .5rem; font-size: .75rem; }
/* Fichiers joints : pastilles sous l'éditeur. Une ligne de collection sans fichier (prototype vide) n'est pas montrée. */
[data-stamina-turbo-region] .ticket-reply__files { display: flex; flex-wrap: wrap; gap: .375rem; padding: 0 1.25rem .625rem; }
[data-stamina-turbo-region] .ticket-reply__files:not(:has(.ticket-reply__chip, .file-picker [data-stamina-ui-file-input-target="clearButton"]:not([hidden]), [id*="_error"])) { display: none; }
[data-stamina-turbo-region] :is(.ticket-reply__attachments, .ticket-reply__old-chips, .ticket-reply__draft-files) { display: contents; }
[data-stamina-turbo-region] .ticket-reply__attachments > * { display: contents; }
[data-stamina-turbo-region] .ticket-reply__attachments .file-picker:has([data-stamina-ui-file-input-target="clearButton"][hidden]) { display: none; }
[data-stamina-turbo-region] :is(.ticket-reply__attachments .file-picker, .ticket-reply__chip) {
display: inline-flex; align-items: center; gap: .375rem; width: auto; max-width: 16rem; height: 1.875rem; min-height: 0;
padding: 0 .25rem 0 .625rem; border: 0; border-radius: .5rem; background: var(--color-tile); box-shadow: none;
color: var(--color-ink); font-size: .78125rem; font-weight: 600;
}
[data-stamina-turbo-region] .ticket-reply__attachments .file-picker {
> .addon:first-child { display: none; }
> .input { flex: 1; min-width: 0; height: auto; padding: 0; border: 0; background: none; box-shadow: none; font: inherit; color: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
> .input::before { content: "\f0c6"; margin-right: .375rem; font: var(--fa-font-light); color: var(--color-muted); }
> button.addon { display: grid; place-items: center; width: 1.375rem; height: 1.375rem; padding: 0; border: 0; border-radius: .375rem; background: none; color: var(--color-muted); }
> button.addon:hover { background: var(--color-tile-2); color: var(--color-ink); }
}
[data-stamina-turbo-region] .ticket-reply__chip > .fal { color: var(--color-muted); }
[data-stamina-turbo-region] .ticket-reply__chip-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[data-stamina-turbo-region] .ticket-reply__chip-remove { display: grid; flex: none; place-items: center; width: 1.375rem; height: 1.375rem; border-radius: .375rem; color: var(--color-muted); cursor: pointer; }
[data-stamina-turbo-region] .ticket-reply__chip-remove:hover { background: var(--color-tile-2); color: var(--color-ink); }
/* Pied : outils nommés à gauche, messages cités et envoi à droite. Sous la largeur utile, l'envoi passe
à la ligne (calé à droite) et les libellés secondaires se replient sur leur icône. */
[data-stamina-turbo-region] .ticket-reply__foot {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .5rem;
padding: .625rem .75rem .625rem .625rem;
border-top: 1px solid var(--color-line);
}
[data-stamina-turbo-region] .ticket-reply__tools { display: flex; flex-wrap: wrap; align-items: center; gap: .125rem; min-width: 0; }
[data-stamina-turbo-region] .ticket-reply__tool {
display: inline-flex;
align-items: center;
gap: .4375rem;
height: 2.125rem;
padding: 0 .625rem;
border: 0;
border-radius: .5rem;
background: none;
color: var(--color-ink-2);
font-size: .78125rem;
font-weight: 600;
white-space: nowrap;
cursor: pointer;
transition: background-color .12s, color .12s;
}
[data-stamina-turbo-region] .ticket-reply__tool > .fal { color: var(--color-muted); font-size: .875rem; }
[data-stamina-turbo-region] .ticket-reply__tool > .ticket-reply__caret { margin-left: -.125rem; font-size: .625rem; }
[data-stamina-turbo-region] .ticket-reply__tool:is(:hover, [aria-expanded="true"]) { background: var(--color-tile); color: var(--color-ink); > .fal { color: var(--color-ink-2); } }
[data-stamina-turbo-region] .ticket-reply__tool .badge { min-width: 1.125rem; height: 1.125rem; padding: 0 .3125rem; font-size: .625rem; line-height: 1; justify-content: center; }
/* Messages cités (ligne des destinataires, avant Cc / Cci) : discret, à hauteur de la ligne. */
[data-stamina-turbo-region] .ticket-reply__history > .ticket-reply__tool { height: 1.75rem; padding-inline: .5rem; color: var(--color-muted); font-size: .75rem; font-weight: 500; }
[data-stamina-turbo-region] .ticket-reply__send { display: flex; flex: none; align-items: center; gap: .5rem; margin-left: auto; }
/* Recherche ajoutée par un bundle (pièce commerciale) : déclencheur invisible, ouvert depuis le menu Fichiers. */
[data-stamina-turbo-region] .ticket-reply__lookup { position: relative; width: 0; height: 0; }
[data-stamina-turbo-region] .ticket-reply__lookup-trigger { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Menus du pied : intitulé + explication sur deux lignes, cases et boutons radio du socle. */
[data-stamina-turbo-region] .ticket-reply__menu { min-width: 17.5rem; max-width: 22rem; }
[data-stamina-turbo-region] .ticket-reply__menu .menu-title { display: grid; min-width: 0; }
[data-stamina-turbo-region] .ticket-reply__menu .menu-title > small { color: var(--color-muted); font-size: .71875rem; font-weight: 400; line-height: 1.35; }
[data-stamina-turbo-region] .ticket-reply__menu label.menu-link:has(:checked) { background: var(--color-tile); color: var(--color-ink); }
[data-stamina-turbo-region] .ticket-reply__check { flex: none; width: 1rem; height: 1rem; margin: 0; accent-color: var(--color-accent); cursor: pointer; }
[data-stamina-turbo-region] .ticket-reply__old { max-height: 14rem; overflow-y: auto; }
[data-stamina-turbo-region] .ticket-reply__old .menu-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
[data-stamina-turbo-region] .ticket-reply__time { width: 19rem; }
[data-stamina-turbo-region] .ticket-reply__time-body { padding: .25rem .625rem .625rem; }
@media (max-width: 1023.98px) {
[data-stamina-turbo-region] .ticket-reply__private-label { display: none; }
}
/* ---------- Messages : une carte par message ----------
Largeur resserrée (--ticket-msg-width) : 65 % du fil, plafonnée à 46 rem ; 82 % sous 1400 px où le fil
est étroit. Reçus, envoyés et notes ont la même largeur : reçus à gauche du fil, envoyés et notes à droite.
Empreinte verticale réduite : en-tête d'une ligne, corps sans hauteur minimale (l'iframe suit son
contenu), pièces jointes et pied sur une ligne compacte. */
[data-stamina-turbo-region] .ticket-thread { --ticket-msg-width: 82%; }
@media (min-width: 1400px) { [data-stamina-turbo-region] .ticket-thread { --ticket-msg-width: 65%; } }
[data-stamina-turbo-region] .ticket-msg { width: 100%; min-width: 0; margin: 0; overflow: hidden; scroll-margin-top: 5.5rem; }
@media (min-width: 768px) {
[data-stamina-turbo-region] .ticket-msg { width: var(--ticket-msg-width); max-width: 46rem; }
[data-stamina-turbo-region] .ticket-msg--us,
[data-stamina-turbo-region] .ticket-msg--private { margin-left: auto; }
}
[data-stamina-turbo-region] .ticket-msg__head { display: flex; align-items: center; gap: .75rem; padding: .625rem .5rem .625rem 1rem; }
[data-stamina-turbo-region] .ticket-msg__avatar { flex: none; line-height: 0; }
[data-stamina-turbo-region] .ticket-msg__avatar .avatar { --size-avatar: 2.25rem; }
[data-stamina-turbo-region] .ticket-msg__avatar img { width: 2.25rem; height: 2.25rem; border-radius: 50%; object-fit: cover; }
[data-stamina-turbo-region] .ticket-msg__who { flex: 1; min-width: 0; }
[data-stamina-turbo-region] .ticket-msg__name { display: flex; align-items: center; flex-wrap: wrap; gap: .125rem .5rem; overflow: hidden; color: var(--color-ink); font-size: .875rem; font-weight: 700; line-height: 1.4; }
[data-stamina-turbo-region] .ticket-msg__badge { gap: .25rem; font-size: .6875rem; }
[data-stamina-turbo-region] .ticket-msg__badge .fas { font-size: .5625rem; }
[data-stamina-turbo-region] .ticket-msg__sub { display: flex; flex-wrap: wrap; align-items: center; gap: .0625rem .375rem; color: var(--color-muted); font-size: .75rem; line-height: 1.4; }
[data-stamina-turbo-region] .ticket-msg__sub .ticket-copy { font-size: .75rem; }
[data-stamina-turbo-region] .ticket-msg__date { flex: none; color: var(--color-muted); font-size: .75rem; line-height: 1.4; text-align: right; }
[data-stamina-turbo-region] .ticket-msg__date strong { display: block; color: var(--color-ink-2); font-weight: 600; }
[data-stamina-turbo-region] .ticket-msg__body { padding: .625rem 1rem .75rem; border-top: 1px solid var(--color-line); font-size: .875rem; }
[data-stamina-turbo-region] .ticket-msg__body iframe { display: block; width: 100%; border: 0; }
[data-stamina-turbo-region] .ticket-msg__files { display: flex; flex-wrap: wrap; gap: .375rem; padding: .5rem 1rem .625rem; border-bottom: 1px solid var(--color-line); }
[data-stamina-turbo-region] .ticket-file {
display: inline-flex;
align-items: center;
gap: .375rem;
max-width: 100%;
padding: .1875rem .625rem .1875rem .25rem;
border-radius: .5rem;
box-shadow: inset 0 0 0 1px var(--color-field);
color: var(--color-ink-2);
font-size: .75rem;
font-weight: 600;
}
[data-stamina-turbo-region] a.ticket-file:hover { background: var(--color-tile); color: var(--color-ink); }
[data-stamina-turbo-region] .ticket-file__icon { display: grid; place-items: center; width: 1.375rem; height: 1.375rem; border-radius: .375rem; background: var(--color-info-soft); color: var(--color-info); font-size: .6875rem; }
[data-stamina-turbo-region] .ticket-file--blocked { box-shadow: inset 0 0 0 1px var(--color-danger); color: var(--color-danger); }
[data-stamina-turbo-region] .ticket-file--blocked .ticket-file__icon { background: var(--color-danger-soft); color: var(--color-danger); }
/* Pied : envoi, temps passé, historique, accusé — discret, sous le contenu. */
[data-stamina-turbo-region] .ticket-msg__foot { display: flex; flex-wrap: wrap; align-items: center; gap: .125rem 1rem; padding: .375rem 1rem .5rem; border-top: 1px solid var(--color-line); color: var(--color-muted); font-size: .75rem; }
[data-stamina-turbo-region] .ticket-msg__fact { display: inline-flex; align-items: center; gap: .375rem; cursor: default; }
[data-stamina-turbo-region] .ticket-msg__fact .fal { font-size: .75rem; }
[data-stamina-turbo-region] .ticket-msg__fact--ok .fal { color: var(--color-success); }
/* État d'envoi : texte à gauche, action à droite, sans cadre. */
[data-stamina-turbo-region] .ticket-msg__state { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; padding: .25rem .75rem .25rem 1rem; border-top: 1px solid var(--color-line); font-size: .75rem; font-weight: 600; }
[data-stamina-turbo-region] .ticket-msg__state-text { color: var(--color-muted); }
[data-stamina-turbo-region] .ticket-msg__state-text.is-primary { color: var(--color-accent); }
[data-stamina-turbo-region] .ticket-msg__state-text.is-danger { color: var(--color-danger); }
[data-stamina-turbo-region] .ticket-msg__state-action.is-primary { color: var(--color-accent); }
[data-stamina-turbo-region] .ticket-msg__state-action.is-danger { color: var(--color-danger); }
/* Note interne : clairement autre chose qu'un message envoyé. Fond de tuile (grisé), bordure en pointillé
discrète, texte atténué, pas d'ombre de carte ; badge cadenas neutre. */
[data-stamina-turbo-region] .ticket-msg--private { border: 1px dashed var(--color-field-hover); background: var(--color-tile); box-shadow: none; }
[data-stamina-turbo-region] .ticket-msg--private .ticket-msg__name { color: var(--color-ink-2); }
[data-stamina-turbo-region] .ticket-msg--private .ticket-msg__body { color: var(--color-ink-2); opacity: .85; }
[data-stamina-turbo-region] .ticket-msg--private .ticket-msg__avatar { opacity: .8; }
/* Brouillons (Message/drafts.html.twig) : sous la zone de réponse, à droite comme nos réponses, bordure en
pointillé de la couleur d'accent ; ils attendent d'être relus puis envoyés. Le frame ne fait pas de boîte :
ses cartes sont des éléments du fil comme les autres. */
[data-stamina-turbo-region] .ticket-thread > turbo-frame#stamina-ticket-drafts { display: contents; }
[data-stamina-turbo-region] .ticket-msg--draft { border: 1px dashed var(--color-accent); box-shadow: none; }
[data-stamina-turbo-region] .ticket-draft__ai { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--color-accent-soft); color: var(--color-accent); font-size: .9375rem; line-height: 1; }
[data-stamina-turbo-region] .ticket-draft__missing { color: var(--color-danger); font-weight: 600; }
[data-stamina-turbo-region] .ticket-draft__state { padding-top: .375rem; padding-bottom: .375rem; background: var(--color-accent-soft); }
[data-stamina-turbo-region] .ticket-draft__state .ticket-msg__state-text { display: inline-flex; align-items: center; gap: .375rem; }
[data-stamina-turbo-region] .ticket-draft__actions { display: inline-flex; align-items: center; gap: .375rem; }
[data-stamina-turbo-region] .ticket-draft__actions form { display: contents; }
@media (max-width: 767.98px) {
[data-stamina-turbo-region] .ticket-msg__head { flex-wrap: wrap; }
[data-stamina-turbo-region] .ticket-msg__date { order: 3; width: 100%; padding-left: 3rem; text-align: left; }
[data-stamina-turbo-region] .ticket-msg__date strong { display: inline; }
[data-stamina-turbo-region] .ticket-msg__date strong::after { content: " · "; font-weight: 400; color: var(--color-muted); }
}
/* ---------- Activité : petite ligne grise alignée à droite, sans filets ---------- */
[data-stamina-turbo-region] .ticket-activity { display: flex; justify-content: flex-end; margin: -.25rem 0; color: var(--color-muted-2); font-size: .6875rem; line-height: 1.4; }
[data-stamina-turbo-region] .ticket-activity__pill { display: inline-flex; align-items: center; gap: .375rem; max-width: 85%; }
[data-stamina-turbo-region] .ticket-activity__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[data-stamina-turbo-region] .ticket-activity__icon { flex: none; font-size: .625rem; }
[data-stamina-turbo-region] .ticket-activity__icon--primary { color: var(--color-accent); }
[data-stamina-turbo-region] .ticket-activity__icon--success { color: var(--color-success); }
[data-stamina-turbo-region] .ticket-activity__icon--danger { color: var(--color-danger); }
[data-stamina-turbo-region] .ticket-activity strong { color: var(--color-muted); font-weight: 500; }
[data-stamina-turbo-region] .ticket-activity time { flex: none; }
[data-stamina-turbo-region] .ticket-activity time::before { content: "·"; margin-right: .375rem; }
[data-stamina-turbo-region] .ticket-activity__repeat { flex: none; font-weight: 500; }
}