/*
 * Paramètres › Objectifs des agents — valeurs recopiées de
 * tasks/nbt-crm/mockups/objectifs-agents-v1.html (.crumbs, .head, .b, .card,
 * .month, .past, table, .ag, .in, .hint, .foot). Karim : pixel par pixel.
 * Le mode sombre garde la mise en page et prend les teintes de Filament.
 */
.nbt-obj { color: #14121A; font-size: 14px; line-height: normal; }
:where(.nbt-obj) button, :where(.nbt-obj) input { font: inherit; color: inherit; }
.nbt-obj-crumbs { color: #6B6875; font-size: 13px; }
.nbt-obj-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 6px 0 16px; flex-wrap: wrap; }
.nbt-obj-h1 { font-size: 28px; font-weight: 700; margin: 0 0 4px; letter-spacing: -.01em; }
.nbt-obj-sub { color: #6B6875; }
.nbt-obj-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.nbt-obj-b { border: 1px solid #E7E5EA; background: #fff; border-radius: 9px; padding: 8px 14px; font-weight: 500; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.nbt-obj-b:hover { border-color: #cfccd4; }
.nbt-obj-b.nbt-obj-p { background: #C8102E; border-color: #C8102E; color: #fff; }
.nbt-obj-b.nbt-obj-p:hover { background: #A50D26; }
.nbt-obj-card { background: #fff; border: 1px solid #E7E5EA; border-radius: 14px; overflow: hidden; margin: 0; }
.nbt-obj-card-h { margin: 0; padding: 12px 18px; border-bottom: 1px solid #E7E5EA; font-size: 15px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.nbt-obj-gauche { display: flex; gap: 10px; align-items: center; }
.nbt-obj-month { display: inline-flex; align-items: center; border: 1px solid #E7E5EA; border-radius: 9px; overflow: hidden; }
.nbt-obj-month button { border: 0; background: #fff; padding: 6px 11px; cursor: pointer; font-size: 15px; color: #6B6875; }
.nbt-obj-month button:hover { background: #F7F7F8; color: #14121A; }
.nbt-obj-month span { padding: 6px 14px; font-weight: 600; border-left: 1px solid #E7E5EA; border-right: 1px solid #E7E5EA; min-width: 150px; text-align: center; }
.nbt-obj-past { display: inline-block; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 2px 9px; background: #FFF7E6; color: #B45309; }
.nbt-obj-tw { overflow-x: auto; }
.nbt-obj-table { width: 100%; border-collapse: collapse; }
.nbt-obj-table th { text-align: left; font-weight: 500; color: #6B6875; font-size: 12px; padding: 10px 14px; border-bottom: 1px solid #E7E5EA; white-space: nowrap; }
.nbt-obj-table td { padding: 12px 14px; border-bottom: 1px solid #E7E5EA; vertical-align: top; }
.nbt-obj-table tr:last-child td { border-bottom: 0; }
.nbt-obj-table th:first-child, .nbt-obj-table td:first-child { padding-left: 18px; }
.nbt-obj-table th:last-child, .nbt-obj-table td:last-child { padding-right: 18px; }
.nbt-obj-ag { display: flex; gap: 10px; align-items: center; font-weight: 600; white-space: nowrap; }
.nbt-obj-av { width: 30px; height: 30px; border-radius: 50%; font-size: 11.5px; font-weight: 700; display: grid; place-items: center; background: #F2F4F7; color: #344054; flex: none; }
.nbt-obj-ag small { display: block; font-weight: 400; color: #6B6875; font-size: 12px; }
.nbt-obj-in { position: relative; max-width: 170px; }
.nbt-obj-in input[type=number] { width: 100%; border: 1px solid #E7E5EA; border-radius: 8px; padding: 7px 10px; background: #fff; font-variant-numeric: tabular-nums; -moz-appearance: textfield; box-shadow: none; }
.nbt-obj-in input[type=number]::-webkit-inner-spin-button { opacity: .4; }
.nbt-obj-in input[type=number]:focus { outline: 2px solid #FDEEF1; border-color: #C8102E; }
.nbt-obj-in input[type=number]:placeholder-shown { background: #F7F7F8; border-style: dashed; }
.nbt-obj-in input[type=number]::placeholder { color: #6B6875; opacity: 1; }
.nbt-obj-dh input[type=number] { padding-right: 34px; }
.nbt-obj-dh::after { content: "DH"; position: absolute; right: 10px; top: 8px; color: #6B6875; font-size: 12.5px; }
.nbt-obj-hint { color: #6B6875; font-size: 12.5px; margin-top: 4px; }
.nbt-obj-hint-seul { margin: 0; }
.nbt-obj-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 18px; border-top: 1px solid #E7E5EA; background: #FCFCFD; flex-wrap: wrap; }
/*
 * Sous le menu de Filament (320 px contre 240 dans la maquette), la carte est
 * plus étroite : « Enregistrer » reste à droite et c'est la ligne des
 * définitions qui passe à la ligne ; et quand les colonnes ne tiennent plus,
 * le chiffre réalisé passe sous son libellé dans les quatre colonnes à la fois,
 * jamais « 18 400 » d'un côté et « DH » de l'autre.
 */
@media (min-width: 640px) { .nbt-obj-foot { flex-wrap: nowrap; } .nbt-obj-foot > span { flex: 1 1 auto; min-width: 0; } .nbt-obj-foot > button { flex: none; } }
.nbt-obj-tw { container-type: inline-size; }
.nbt-obj-n { white-space: nowrap; }
@container (max-width: 1000px) { .nbt-obj-n { display: block; } }

.dark .nbt-obj { color: var(--gray-100); }
.dark .nbt-obj-card, .dark .nbt-obj-b:not(.nbt-obj-p), .dark .nbt-obj-month button, .dark .nbt-obj-in input[type=number] { background: var(--gray-900); color: var(--gray-100); border-color: rgb(255 255 255 / .1); }
.dark .nbt-obj-card-h, .dark .nbt-obj-month, .dark .nbt-obj-month span, .dark .nbt-obj-table th, .dark .nbt-obj-table td, .dark .nbt-obj-foot { border-color: rgb(255 255 255 / .1); }
.dark .nbt-obj-foot, .dark .nbt-obj-in input[type=number]:placeholder-shown { background: var(--gray-800); }
.dark .nbt-obj-crumbs, .dark .nbt-obj-sub, .dark .nbt-obj-hint, .dark .nbt-obj-table th, .dark .nbt-obj-ag small { color: var(--gray-400); }

/* Téléphone (Karim 5 oct) : le tableau garde ses colonnes et défile de côté. */
@media (max-width: 767px) { .nbt-obj-table { min-width: 720px; } .nbt-obj-month span { min-width: 120px; } }