/*
  Recruiter — Vue Talent (R12). The recruiter consults a talent's full public
  profile. Reuses talent_profile.css (.tp-* structure) for the middle sections;
  this file carries only the recruiter-side deltas: hide the owner edit
  affordances (the recruiter consults, never edits) and style the recruiter hero
  CTAs + the future-brick (Brique 3) annotation. Zero inline CSS.
*/

/* The recruiter consults: hide every owner edit/add affordance. */
.rtv-page .tp-edit-btn,
.rtv-page .tp-add-btn,
.rtv-page .tp-cover-edit { display: none !important; }

/* R15 — la barre « Profil complet » est une jauge destinée au talent lui-même :
   sans intérêt pour le recruteur qui consulte → masquée dans la vue recruteur. */
.rtv-page #tp-completeness { display: none !important; }

/* Recruiter hero action cluster.
   Retour client 06/08 — « le positionnement des boutons sous la bannière n'est
   pas identique » : la rangée reprend trait pour trait .tp-recr-actions /
   .tp-recr-btn de la maquette (mockups/talent/_profile_body, mode recruteur).
   Le point qui se voyait le plus : le CTA doré (.ds-btn-gold) n'avait PAS de
   bordure là où les boutons fantômes en ont une, donc 38 px contre 40 px et une
   rangée décalée d'un pixel. Toute la boîte est donc redéfinie ici, bordure
   transparente comprise, pour que les trois boutons aient la même hauteur. */
.rtv-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; flex-wrap: wrap; }
.rtv-cta-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 16px; border: 1.5px solid transparent; border-radius: 100px;
  font-family: inherit; font-size: 12px; font-weight: 700; line-height: 18px;
  white-space: nowrap; cursor: pointer;
  transition: transform .15s, box-shadow .15s, background .15s, border-color .15s;
}
.rtv-cta-btn svg { width: 15px; height: 15px; flex: none; }

/* CTA principal (sollicitation / conversation) = .tp-recr-primary de la maquette.
   Dégradé doré RESATURÉ (--gold-fill-deep) + liseré : sur fond blanc et en petite
   taille, la fin du dégradé clair ne se lisait plus. */
.rtv-actions .ds-btn-gold.rtv-cta-btn {
  background: var(--gold-fill-deep); color: var(--on-gold); text-shadow: var(--on-gold-shadow);
  border-color: rgba(138, 107, 31, .35); box-shadow: 0 3px 12px rgba(163, 133, 67, .34);
}
.rtv-actions .ds-btn-gold.rtv-cta-btn:hover { opacity: 1; transform: translateY(-1px); box-shadow: 0 6px 18px rgba(163, 133, 67, .42); }

/* Boutons fantômes (shortlist, comparer) = .tp-recr-ghost de la maquette. */
.rtv-actions .ds-btn-outline.rtv-cta-btn { color: #4a4a4a; background: #fff; border-color: rgba(0, 0, 0, .08); }
.rtv-actions .ds-btn-outline.rtv-cta-btn:hover { border-color: var(--gold-primary); color: var(--gold-500); background: var(--gold-50); }

/* Arbitrage Loïc 06/08 — « Comparer » est un POST (il range le talent dans la
   sélection de comparaison) : le form de button_to ne doit pas casser la rangée. */
.rtv-actions form { display: inline-flex; margin: 0; }
.rtv-compare-btn { background: #fff; }

/* Functional shortlist button reflects state */
.rtv-actions .rtv-cta-btn.is-shortlisted,
.rtv-cta-btn.is-shortlisted { background: #E9F6EE; border-color: #1F7A4A; color: #1F7A4A; }

/* Future-brick (Brique 3): contact / proposal = real contact, grayed + annotated */
.rtv-future { display: inline-flex; align-items: center; gap: 8px; }
.rtv-future-badge { font-size: 9px; font-weight: 800; letter-spacing: 0.5px; text-transform: uppercase; color: var(--gold-600); background: #F8F4ED; border: 1px solid #E8DDC4; border-radius: 6px; padding: 3px 7px; }
.rtv-cta-btn[disabled] { opacity: 0.5; cursor: not-allowed; filter: grayscale(0.4); }

/* Shortlisted confirmation strip in the sidebar */
.rtv-shortlist-card { border-radius: 16px; padding: 18px; background: #fffdfa; border: 1px solid #f8f4ed; }
.rtv-shortlist-card h3 { font-family: 'Playfair Display', serif; font-size: 18px; color: #131313; margin-bottom: 6px; }
.rtv-shortlist-card p { font-size: 12.5px; color: #6B6560; line-height: 1.5; margin-bottom: 12px; }
.rtv-shortlist-card .rtv-cta-btn { width: 100%; justify-content: center; }
.rtv-shortlist-future { margin-top: 12px; padding-top: 12px; border-top: 1px solid #f0ece2; }
.rtv-shortlist-future .rtv-cta-btn { width: 100%; justify-content: center; margin-top: 8px; }

/* B2 tâche 013 — R17/AC17.4 : composeur de sollicitation dans la sidebar Vue Talent. */
.rtv-cta-btn.rtv-cta-full { width: 100%; justify-content: center; margin-top: 12px; }
.rtv-cta-btn.rtv-cta-full[href], .rtv-cta-btn.rtv-cta-full:link { text-decoration: none; }
.rtv-contact-form { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.rtv-contact-label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-600); margin-top: 4px; }
.rtv-contact-select { width: 100%; height: 40px; border: 1px solid #E8DDC4; border-radius: 10px; padding: 0 12px; font-family: inherit; font-size: 13px; color: #131313; background: #fff; }
.rtv-contact-select:focus { outline: none; border-color: var(--gold-primary); }
.rtv-contact-textarea { width: 100%; border: 1px solid #E8DDC4; border-radius: 10px; padding: 10px 12px; font-family: inherit; font-size: 13px; color: #131313; resize: vertical; min-height: 76px; }
.rtv-contact-textarea:focus { outline: none; border-color: var(--gold-primary); }
.rtv-contact-note { font-size: 11px; color: #8A857A; line-height: 1.5; margin-top: 4px; text-align: center; }
.rtv-badge-row { margin-top: 14px; }

/* Passerelle vers /recruiter/solicitations/new — reprise de .pm-full-link
   (modale « Proposer un poste » du mockup talent_view v37). */
.rtv-full-link { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 12px; padding: 12px 14px; border: 1px solid rgba(0,0,0,.08); border-radius: 12px; background: #fff; color: #333; text-decoration: none; transition: border-color .18s, background .18s; }
.rtv-full-link:hover { border-color: var(--gold-primary); background: rgba(196,165,89,.06); }
.rtv-full-link > svg { flex-shrink: 0; color: var(--gold-500); }
.rtv-full-link span { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.rtv-full-link b { font-size: 13px; font-weight: 700; color: #333; }
.rtv-full-link small { font-size: 11px; line-height: 1.4; color: #8a8a8a; }
.rtv-full-link .rtv-full-chev { color: var(--gold-primary); }

/* ═══════════════════════════════════════════════════════════════════════════
   Modale « Proposer un poste » — transposition du bloc #tvwContact de
   mockups/recruiter/talent_view (v37). La maquette écrivait ses dorés en dur ;
   ici ils passent tous par les jetons de design_tokens.css (--gold-primary,
   --gold-500, --gold-deep, --gold-200, --gold-100, --gold-50, --on-gold).
   Tout est scopé sous .tvw-modal, comme dans la maquette.
   ═══════════════════════════════════════════════════════════════════════════ */
.tvw-modal { --line: rgba(0,0,0,.08); }

/* Collision de noms : talent_messages.css et recruiter_messages.css déclarent
   .pm-eyebrow / .pm-av / .pm-sub / .pm-head-row SANS les scoper, et les deux
   feuilles sont servies sur cette page. Leurs déclarations que la maquette
   ne porte pas (largeur max-content, texte en dégradé, anneau blanc, marges)
   passaient par-dessous les nôtres. On les neutralise ici plutôt que de
   renommer les classes : garder les noms du mockup, c'est pouvoir continuer à
   comparer la vue et la maquette ligne à ligne.
   .pm-av n'a plus sa ligne ici depuis #3051 : l'en-tête la redéfinit
   entièrement, ombre et anneau compris. */
.tvw-modal .pm-head-row { justify-content: flex-start; flex-wrap: nowrap; margin-bottom: 0; }
.tvw-modal .pm-eyebrow { width: auto; background: none; -webkit-background-clip: border-box; background-clip: border-box; -webkit-text-fill-color: currentColor; padding-right: 0; margin-right: 0; }
.tvw-modal .pm-sub { max-width: none; line-height: 1.4; }
.tvw-modal { position: fixed; inset: 0; z-index: 120; display: none; align-items: flex-start; justify-content: center; padding: 36px 16px; overflow-y: auto; background: rgba(20,18,14,.55); backdrop-filter: blur(3px); }
.tvw-modal.active { display: flex; }
.tvw-modal * { box-sizing: border-box; }
.tvw-modal .pm { position: relative; width: 100%; max-width: 560px; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 30px 90px rgba(20,18,14,.32); }
.tvw-modal .pm-close { position: absolute; top: 14px; right: 14px; z-index: 3; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: #666; cursor: pointer; font-size: 15px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.tvw-modal .pm-close:hover { background: #1a1a1a; color: var(--gold-200); border-color: #1a1a1a; }

/* ── En-tête ──
   #3051 — Kevin, 13/08 : « ce ne sont pas les mêmes dimensions que la contact
   flow talent vers recruteurs. Le header doit être identique. » Le parcours
   symétrique, c'est la modale de candidature (.page-candidature .pm-head, dans
   talent_candidature.css) : elle fait autorité, ses valeurs sont reprises ici
   telles quelles (paddings, dégradé et ses deux reflets, eyebrow, vignette
   ronde de 56 px, nom 16/800, sous-titre Playfair italique). Le filet vertical
   entre les deux colonnes, que la référence n'a pas, disparaît.
   Les dorés passent par les jetons ; les crèmes du fond sont celles de la
   référence. */
.tvw-modal .pm-head { position: relative; overflow: hidden; padding: 26px 26px 22px; background: linear-gradient(135deg, #FDFBF4 0%, #F8F0DC 42%, var(--gold-200) 100%); border-bottom: 1px solid #E9DDBC; }
.tvw-modal .pm-head::before { content: ''; position: absolute; top: -80%; left: -15%; width: 65%; height: 260%; background: linear-gradient(115deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.8) 50%, rgba(255,255,255,0) 100%); transform: rotate(10deg); pointer-events: none; }
.tvw-modal .pm-head::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 85% -20%, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 55%); pointer-events: none; }
.tvw-modal .pm-head > * { position: relative; z-index: 1; }
.tvw-modal .pm-head-row { display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; gap: 20px; }
.tvw-modal .pm-head-col { display: flex; flex-direction: column; gap: 13px; min-width: 0; }
.tvw-modal .pm-head-col-right { text-align: right; align-items: flex-end; min-width: min-content; padding-right: 38px; }
.tvw-modal .pm-eyebrow { font-size: 10px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 0; }
.tvw-modal .pm-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.tvw-modal .pm-head-col-right .pm-id { flex-direction: row-reverse; }
.tvw-modal .pm-av { width: 56px; height: 56px; border-radius: 50%; overflow: hidden; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-family: inherit; font-style: normal; font-weight: 800; font-size: 15px; color: var(--on-gold); text-shadow: var(--on-gold-shadow); background: var(--gold-fill); border: 2px solid var(--n-0); box-shadow: 0 0 0 2px var(--gold-300), 0 4px 12px rgba(146,113,32,.28); }
.tvw-modal .pm-av img { width: 100%; height: 100%; object-fit: cover; }
.tvw-modal .pm-name { font-size: 16px; font-weight: 800; letter-spacing: .2px; color: var(--ink); }
.tvw-modal .pm-sub { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 12px; color: var(--gold-deep); margin-top: 2px; }

/* ── Corps ── */
.tvw-modal .pm-body { padding: 20px 24px 24px; max-height: 66vh; overflow-y: auto; }
.tvw-modal .pm-label { font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: #8a8a8a; margin: 0 0 9px; }
.tvw-modal .pm-label.serif { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 14px; text-transform: none; letter-spacing: 0; color: #2f2f2f; font-weight: 600; }
.tvw-modal .pm-label-spaced { margin-top: 18px; }

/* ── Bandeaux à défilement (point de recrutement, poste, démarrage) ── */
.tvw-modal .band { position: relative; display: flex; align-items: center; gap: 6px; margin-bottom: 16px; }
.tvw-modal .band-arrow { width: 26px; height: 26px; flex: 0 0 auto; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: #8a8a8a; cursor: pointer; font-size: 14px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.tvw-modal .band-arrow:hover { border-color: var(--gold-primary); color: var(--gold-500); }
.tvw-modal .band-track { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px; flex: 1; }
.tvw-modal .band-track::-webkit-scrollbar { display: none; }
.tvw-modal .vcard { flex: 0 0 auto; padding: 9px 16px; border-radius: 100px; border: 1.5px solid var(--line); background: #fff; color: #555; font-size: 12.5px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: all .15s; font-family: inherit; }
.tvw-modal .vcard:hover { border-color: var(--gold-primary); }
.tvw-modal .vcard.on { background: linear-gradient(135deg, var(--gold-primary), var(--gold-200)); border-color: transparent; color: var(--on-gold); text-shadow: var(--on-gold-shadow); box-shadow: 0 2px 8px rgba(196,165,89,.24); }
/* Aucune annonce sur ce point de recrutement : on le dit, on n'invente pas. */
.tvw-modal .band-empty { font-size: 12px; color: #8a8a8a; padding: 9px 2px; }

/* ── Carte de l'annonce rattachée ── */
.tvw-modal .am-intro { font-size: 12px; color: #8a8a8a; margin-bottom: 8px; }
.tvw-modal .am { display: block; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; margin-bottom: 22px; }
.tvw-modal .am-cover { height: 74px; background: linear-gradient(120deg, #2a2118, var(--gold-700) 55%, var(--gold-primary)); }
.tvw-modal .am-headrow { display: flex; gap: 12px; align-items: center; padding: 12px 14px 0; }
.tvw-modal .am-medal { width: 40px; height: 40px; border-radius: 11px; margin-top: -30px; border: 2px solid #fff; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', Georgia, serif; font-weight: 700; font-style: italic; color: var(--gold-100); background: linear-gradient(135deg, #2a2118, var(--gold-700)); box-shadow: 0 3px 10px rgba(0,0,0,.18); }
.tvw-modal .am-idcol { min-width: 0; }
.tvw-modal .am-estab { font-size: 13px; font-weight: 700; color: #222; }
.tvw-modal .am-estab span { color: #9a9a9a; font-weight: 500; }
.tvw-modal .am-title { font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-size: 16px; color: #181818; margin-top: 1px; }
.tvw-modal .am-foot { display: flex; gap: 8px; padding: 12px 14px 14px; }
.tvw-modal .am-btn { display: inline-flex; align-items: center; gap: 5px; padding: 7px 12px; border-radius: 100px; border: 1px solid var(--line); background: #fff; color: #5a5a5a; font-size: 11.5px; font-weight: 600; cursor: pointer; font-family: inherit; text-decoration: none; }
.tvw-modal .am-btn:hover { border-color: var(--gold-primary); color: var(--gold-500); }
/* Repli « Aperçu » : les champs de l'annonce publiée, dépliés sur place. */
.tvw-modal .am-detail { padding: 12px 14px 0; border-top: 1px dashed var(--line); margin-top: 12px; }
.tvw-modal .am-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 14px; margin: 0; }
.tvw-modal .am-rows dt { font-size: 10px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #a5a5a5; }
.tvw-modal .am-rows dd { font-size: 12.5px; color: #333; margin: 2px 0 0; }
.tvw-modal .am-desc { font-size: 12.5px; line-height: 1.55; color: #5a5a5a; margin: 12px 0 0; }

/* ── Gabarits de message ── */
.tvw-modal .pm-tpl { display: flex; gap: 12px; width: 100%; text-align: left; padding: 14px 15px; border-radius: 13px; border: 1.5px solid var(--line); background: #fff; cursor: pointer; margin-bottom: 10px; font-family: inherit; transition: all .15s; }
.tvw-modal .pm-tpl:hover { border-color: var(--gold-primary); }
/* `display: flex` bat le `display: none` de l'attribut [hidden] (feuille UA) :
   sans ce rappel, les gabarits repliés derrière « Personnaliser le message »
   s'affichent quand même. */
.tvw-modal .pm-tpl[hidden] { display: none; }
.tvw-modal .pm-tpl.on { border-color: var(--gold-primary); background: linear-gradient(135deg, var(--gold-50), #FBF3E1); box-shadow: 0 2px 10px rgba(196,165,89,.16); }
.tvw-modal .pm-radio { width: 17px; height: 17px; border-radius: 50%; border: 2px solid #cfcfcf; flex: 0 0 auto; margin-top: 2px; position: relative; }
.tvw-modal .pm-tpl.on .pm-radio { border-color: var(--gold-primary); }
.tvw-modal .pm-tpl.on .pm-radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--gold-primary); }
.tvw-modal .pm-tpl-tag { display: block; font-size: 11px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 4px; }
.tvw-modal .pm-tpl-txt { display: block; font-size: 13px; line-height: 1.5; color: #4a4a4a; }
.tvw-modal .pm-tpl-grow { flex: 1; min-width: 0; }

.tvw-modal .pm-custom-toggle { display: inline-flex; align-items: center; gap: 7px; padding: 0; border: none; background: none; color: var(--gold-500); font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; margin: 2px 0 4px; }
.tvw-modal .pm-custom-toggle .chev { transition: transform .2s; }
.tvw-modal .pm-custom-toggle.open .chev { transform: rotate(180deg); }
.tvw-modal .pm-free-textarea { width: 100%; margin-top: 10px; padding: 11px 13px; border-radius: 11px; border: 1.5px solid var(--line); font-size: 13px; font-family: inherit; resize: vertical; min-height: 78px; outline: none; }
.tvw-modal .pm-free-textarea:focus { border-color: var(--gold-primary); box-shadow: 0 0 0 3px rgba(196,165,89,.12); }
.tvw-modal .pm-free-meta { text-align: right; font-size: 11px; color: #a5a5a5; margin-top: 4px; }

/* ── Pièces jointes ── */
.tvw-modal .pm-attach-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 16px 0 8px; }
.tvw-modal .pm-attach { display: flex; align-items: center; gap: 9px; padding: 11px 13px; border-radius: 13px; border: 1px solid var(--line); background: #fff; }
.tvw-modal .pm-attach.gold { background: linear-gradient(135deg, var(--gold-50), #FBF3E1); border-color: var(--gold-200); }
.tvw-modal .pm-attach.gold > svg { color: var(--gold-deep); }
.tvw-modal .pm-attach-name { font-size: 12.5px; font-weight: 600; color: #333; flex: 1; min-width: 0; }
.tvw-modal .pm-attach-state { font-size: 10.5px; font-weight: 700; color: var(--green); }
.tvw-modal .pm-attach-state.off { color: #b0b0b0; }
.tvw-modal .pm-switch { position: relative; width: 34px; height: 19px; flex: 0 0 auto; cursor: pointer; }
.tvw-modal .pm-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.tvw-modal .pm-switch-track { position: absolute; inset: 0; border-radius: 100px; background: #d6d6d6; transition: background .2s; }
.tvw-modal .pm-switch-thumb { position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .2s; }
.tvw-modal .pm-switch input:checked + .pm-switch-track { background: var(--gold-primary); }
.tvw-modal .pm-switch input:checked + .pm-switch-track .pm-switch-thumb { transform: translateX(15px); }

/* ── Envoi, passerelle, quota ── */
.tvw-modal .btn-main { display: flex; flex-direction: column; align-items: center; gap: 2px; width: 100%; padding: 14px; border: none; border-radius: 13px; cursor: pointer; font-family: inherit; color: var(--on-gold); text-shadow: var(--on-gold-shadow); margin-top: 16px; background: var(--gold-fill); box-shadow: 0 6px 18px rgba(196,165,89,.3); transition: transform .15s; }
.tvw-modal .btn-main:hover { transform: translateY(-1px); }
.tvw-modal .btn-main span { font-size: 14px; font-weight: 700; text-shadow: var(--on-gold-shadow); }
.tvw-modal .btn-main small { font-size: 10.5px; color: rgba(255,255,255,.9); }
.tvw-modal .pm-full-link { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: #333; text-decoration: none; transition: border-color .18s, background .18s; }
.tvw-modal .pm-full-link:hover { border-color: var(--gold-primary); background: rgba(196,165,89,.06); }
.tvw-modal .pm-full-link > svg { flex-shrink: 0; color: var(--gold-500); }
.tvw-modal .pm-full-link span { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.tvw-modal .pm-full-link b { font-size: 13px; font-weight: 700; color: #333; }
.tvw-modal .pm-full-link small { font-size: 11px; line-height: 1.4; color: #8a8a8a; }
.tvw-modal .pm-full-chev { color: #bdbdbd; }
.tvw-modal .pm-full-link:hover .pm-full-chev { color: var(--gold-500); }
.tvw-modal .pm-note { text-align: center; font-size: 11.5px; color: #9a9a9a; margin-top: 12px; }
.tvw-modal .pm-note b { color: var(--gold-deep); }

/* #3051 — mobile : la référence (talent_candidature.css, media 640px) empile
   les deux colonnes et remet la seconde à gauche. Sans cette règle, à 390px les
   noms se cassaient en trois lignes de part et d'autre. */
@media (max-width: 640px) {
  .tvw-modal .pm-head-row { flex-direction: column; gap: 16px; }
  .tvw-modal .pm-head-col-right { align-items: flex-start; text-align: left; padding-right: 0; }
  .tvw-modal .pm-head-col-right .pm-id { flex-direction: row; }
}

@media (max-width: 560px) {
  .tvw-modal { padding: 16px 10px; }
  .tvw-modal .pm-attach-row, .tvw-modal .am-rows { grid-template-columns: 1fr; }
}