/* Colonne Quantity de la page Inventaire : saisie au clavier seulement.
 * Les flèches +/- du champ `type=number` n'ont pas d'usage ici — on encode une
 * quantité relevée, on ne l'incrémente pas — et elles rognent la largeur utile
 * de la cellule. Le type reste `number` : clavier numérique sur tablette et
 * refus des lettres sont conservés.
 *
 * Pas de préfixe d'identifiant : dash_tabulator ne pose pas l'`id` du composant
 * sur l'élément du DOM (il rend un <div ref className>), si bien qu'un
 * `#ag-grid-inventory …` ne correspond à rien. La classe `inv-qty` vient du
 * `cssClass` de la colonne, que Tabulator applique bien à la cellule. */
.tabulator-cell.inv-qty input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
    text-align: right;
    font-weight: 600;

    /* Le cadre noir est la bordure par défaut du navigateur : l'éditeur de
       Tabulator ne pose aucun style de bordure. La cellule elle-même porte
       déjà le contour de la grille, un second cadre à l'intérieur fait
       doublon. Le focus se signale par un liseré interne, qui ne déplace
       rien puisqu'il n'occupe pas de place. */
    border: 0;
    outline: 0;
    border-radius: 0;
    box-shadow: none;
    background: var(--surface);
    color: inherit;
    font-family: inherit;
    font-size: inherit;
}



.tabulator-cell.inv-qty input[type="number"]::-webkit-outer-spin-button,
.tabulator-cell.inv-qty input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

/* Tabulator injecte sa feuille de style à l'exécution (dans le bundle JS),
   donc APRÈS nos <link>. Ses règles sur la cellule en édition —
   `.tabulator-row .tabulator-cell.tabulator-editing input` — ont la même
   spécificité que les nôtres et l'emportent par ordre d'apparition. D'où le
   `!important` : c'est le seul moyen de reprendre la main sans dupliquer sa
   chaîne de sélecteurs, et il reste cantonné à la colonne Quantity. */
.tabulator-cell.inv-qty.tabulator-editing {
    border: 1px solid var(--brand-accent) !important;
    padding: 0 !important;
    background: var(--surface) !important;
}

.tabulator-cell.inv-qty.tabulator-editing input,
.tabulator-cell.inv-qty input[type="number"] {
    border: 0 !important;
    outline: 0 !important;          /* anneau de focus du navigateur */
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: 100% !important;
    padding: 0 12px !important;
    text-align: right !important;
    font: inherit !important;
    font-weight: 600 !important;
    color: inherit !important;
}
