/* nbt-etiquettes — see tasks/nbt-crm/plans/dashboard-v2/PLAN.md
 * « Étiquettes des prospects » : valeurs recopiées de tasks/nbt-crm/mockups/gestion-etiquettes-v1.html
 * (.crumbs, .head, h1, .sub, .btn, .card, table, .pill.chip, .acts, .hint, .modal, .box).
 * Page : EtiquettesDesProspects (classe de page `nbt-etiquettes`), vue filament/pages/etiquettes-des-prospects.
 */

/* ── En-tête : .crumbs, h1 28px, .sub, .btn.primary ── */
.nbt-etiquettes .fi-page-header-main-ctn { row-gap: 16px; padding-top: 22px; }
.nbt-etiquettes .fi-header { align-items: flex-start; gap: 16px; }
.nbt-etiquettes .fi-header.fi-header-has-breadcrumbs .fi-header-actions-ctn { margin-top: 22px; }
.nbt-etiquettes .fi-breadcrumbs { margin-bottom: 6px; }
.nbt-etiquettes .fi-breadcrumbs ol, .nbt-etiquettes .fi-breadcrumbs ol li { column-gap: 0; }
.nbt-etiquettes .fi-breadcrumbs ol li { font-size: 13px; line-height: normal; font-weight: 400; color: #6B6875; }
.nbt-etiquettes .fi-breadcrumbs-item-separator { display: none; }
.nbt-etiquettes .fi-breadcrumbs-item + .fi-breadcrumbs-item::before { content: "›"; margin: 0 .3em; }
.nbt-etiquettes .fi-header-heading { font-size: 28px; line-height: normal; letter-spacing: normal; font-weight: 700; margin: 0 0 4px; color: #14121A; }
.nbt-etiquettes .fi-header-subheading { font-size: 14px; line-height: normal; color: #6B6875; margin: 0; }
.nbt-etiquettes .fi-header .fi-btn { border: 1px solid #C8102E; background: #C8102E; color: #FFFFFF; border-radius: 9px; padding: 8px 12px; font-size: 14px; font-weight: 500; line-height: normal; box-shadow: none; }
.nbt-etiquettes .fi-header .fi-btn:hover { background: #A50D26; border-color: #A50D26; }

/* ── Le contenu : .card, table, .pill.chip, .acts .btn, .hint ── */
.nbt-etq { font-size: 14px; line-height: normal; color: #14121A; max-width: 1064px; }
.nbt-etq-card { background: #FFFFFF; border: 1px solid #E7E5EA; border-radius: 14px; margin-bottom: 16px; overflow: hidden; }
.nbt-etq-card h3 { margin: 0; padding: 14px 18px; border-bottom: 1px solid #E7E5EA; font-size: 15px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; }
.nbt-etq table { width: 100%; border-collapse: collapse; }
.nbt-etq th, .nbt-etq td { text-align: left; padding: 11px 18px; border-bottom: 1px solid #E7E5EA; vertical-align: middle; }
.nbt-etq th { font-size: 12px; color: #6B6875; font-weight: 500; background: #FCFCFD; }
.nbt-etq tbody tr:last-child td { border-bottom: 0; }
.nbt-etq-grip { color: #B0ADB8; cursor: grab; width: 28px; user-select: none; }
.nbt-etq-pill { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600; background: #FDEEF1; color: #A50D26; }
.nbt-etq-g { background: #F2F4F7; color: #344054; }
.nbt-etq-arch { background: #FFFFFF; color: #6B6875; border: 1px dashed #C9C6CF; }
.nbt-etq-on { color: #15803D; font-weight: 500; }
.nbt-etq-off { color: #6B6875; }
.nbt-etq-acts { display: flex; gap: 6px; justify-content: flex-end; }
.nbt-etq-btn { border: 1px solid #E7E5EA; background: #FFFFFF; border-radius: 9px; padding: 5px 9px; font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; color: #14121A; }
.nbt-etq-btn:hover:not([disabled]) { background: #F7F7F8; }
.nbt-etq-danger { color: #C8102E; }
.nbt-etq-btn[disabled] { opacity: .45; cursor: not-allowed; }
.nbt-etq-hint { color: #6B6875; font-size: 12.5px; }
.nbt-etq-archivee td { background: #FCFCFD; }
.nbt-etq-archivee .nbt-etq-name { color: #6B6875; }
.nbt-etq-count a { color: #1D4ED8; font-weight: 500; text-decoration: none; }
.nbt-etq-count a:hover { text-decoration: underline; }
.nbt-etq-preview { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
/* Pendant le glissé (Sortable.js, classe fantôme de Filament). */
.nbt-etq .fi-sortable-ghost { opacity: .4; }

/* ── Les fenêtres : .modal 460px, h4 17px, p, input, .errmsg, .row, .box ── */
.fi-modal > .fi-modal-window-ctn:has(> .nbt-etq-modal) { grid-template-rows: 1fr auto 1fr; }
.nbt-etq-modal.fi-modal-window { max-width: 460px; border-radius: 14px; }
.nbt-etq-modal .fi-modal-header { padding: 22px 22px 0; }
.nbt-etq-modal .fi-modal-heading { font-size: 17px; font-weight: 700; line-height: normal; color: #14121A; }
.nbt-etq-modal .fi-modal-description { margin: 6px 0 8px; font-size: 14px; color: #3B3843; line-height: 1.5; }
.nbt-etq-modal .fi-modal-content { padding: 6px 22px 0; row-gap: 12px; }
.fi-modal > .fi-modal-window-ctn > .nbt-etq-modal .fi-modal-footer { margin-top: 0; padding: 16px 22px 22px; }
.nbt-etq-modal:not(.fi-modal-window-has-content) .fi-modal-description { margin-bottom: 0; }
.nbt-etq-modal .fi-modal-content .fi-sc { row-gap: 12px; gap: 12px; }
.nbt-etq-modal .fi-modal-footer-actions { gap: 8px; }
.nbt-etq-modal .fi-modal-footer .fi-btn { border: 1px solid #E7E5EA; background: #FFFFFF; color: #14121A; border-radius: 9px; padding: 8px 12px; font-size: 14px; font-weight: 500; line-height: normal; box-shadow: none; }
.nbt-etq-modal .fi-modal-footer .fi-btn.fi-color-primary { background: #C8102E; border-color: #C8102E; color: #FFFFFF; }
.nbt-etq-modal .fi-input-wrp { border-radius: 8px; box-shadow: none; border: 1px solid #E7E5EA; }
.nbt-etq-modal .fi-input-wrp.fi-invalid { border-color: #C8102E; }
.nbt-etq-modal .fi-input { padding: 9px 10px; font-size: 14px; line-height: normal; }
.nbt-etq-modal .fi-fo-field { row-gap: 6px; }
.nbt-etq-modal .fi-fo-field-wrp-error-message { color: #C8102E; font-size: 12.5px; margin: 0; }
/* « Nom déjà pris » : sans la phrase d'aide, et « Créer » grisé (`.btn[disabled]` de la maquette) ; le service refuse de toute façon. */
.nbt-etq-modal:has(.fi-invalid) .fi-modal-description { display: none; }
.nbt-etq-modal:has(.fi-invalid) .fi-modal-content { padding-top: 4px; }
.nbt-etq-modal:has(.fi-invalid) .fi-modal-footer .fi-btn.fi-color-primary { opacity: .45; cursor: not-allowed; pointer-events: none; }
.nbt-etq-box { margin: 0; border: 1px solid #E7E5EA; border-radius: 10px; padding: 10px 12px; background: #FCFCFD; font-size: 13px; color: #3B3843; line-height: 1.5; }

.dark .nbt-etq-card, .dark .nbt-etq-btn { background: var(--gray-900); border-color: rgb(255 255 255 / .1); color: #FFFFFF; }
.dark .nbt-etq th, .dark .nbt-etq-archivee td { background: transparent; }
.dark .nbt-etq { color: #FFFFFF; }