/*
 * Écran Ajouter des cartes (T61) — saisie en masse par extension, sans JavaScript :
 * un seul formulaire, chaque bouton d'action enregistre le brouillon.
 */
.rb-inventory-add {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 1080px;
}

.rb-inventory-add__back {
    width: max-content;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--rb-text-subdued);
}

.rb-inventory-add__back:hover {
    color: var(--rb-accent-cyan);
}

.rb-inventory-add__title {
    margin: 8px 0;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.025em;
}

.rb-inventory-add__help {
    margin: 0;
    font-size: 14px;
    color: var(--rb-text-subdued);
}

.rb-inventory-add__controls {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.rb-inventory-add__select,
.rb-inventory-add__filter {
    height: 40px;
    padding: 0 14px;
    border-radius: var(--rb-radius-md);
    border: 1px solid var(--rb-border-chip);
    background-color: var(--rb-bg-inset);
    color: var(--rb-text-heading);
    font-size: 13px;
}

.rb-inventory-add__filter {
    flex: 1;
    min-width: 180px;
}

.rb-inventory-add__apply,
.rb-inventory-add__clear,
.rb-inventory-add__submit {
    padding: 11px 16px;
    border-radius: var(--rb-radius-md);
    border: 1px solid var(--rb-border-chip);
    background: transparent;
    color: var(--rb-text-muted);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.rb-inventory-add__submit {
    padding: 11px 20px;
    border: none;
    background: linear-gradient(100deg, var(--rb-accent-cyan), var(--rb-accent-cyan-dark));
    color: var(--rb-text-on-accent);
    font-weight: 700;
}

.rb-inventory-add__submit:disabled {
    background: #152136;
    color: var(--rb-text-faint);
    cursor: not-allowed;
}

.rb-inventory-add__count {
    font-family: var(--rb-font-mono);
    font-size: 11.5px;
    color: var(--rb-text-faint);
}

.rb-inventory-add__list {
    border: 1px solid var(--rb-border-default);
    border-radius: 14px;
    background-color: var(--rb-bg-surface);
    overflow: hidden;
}

.rb-inventory-add__head,
.rb-inventory-add__row {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 110px 70px 130px 44px;
    gap: 14px;
    align-items: center;
    padding: 9px 18px;
}

.rb-inventory-add__head {
    padding: 11px 18px;
    border-bottom: 1px solid var(--rb-border-subtle);
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rb-text-faint);
    font-weight: 700;
}

.rb-inventory-add__row {
    border-left: 2px solid transparent;
    border-bottom: 1px solid var(--rb-border-row);
}

.rb-inventory-add__row--selected {
    border-left-color: var(--rb-accent-cyan);
    background-color: var(--rb-bg-hover);
}

.rb-inventory-add__row--variant .rb-thumb {
    visibility: hidden;
}

.rb-inventory-add__card-name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--rb-text-heading);
}

.rb-inventory-add__card-meta {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    font-size: 11px;
    color: var(--rb-text-label);
}

.rb-inventory-add__number {
    font-family: var(--rb-font-mono);
    font-size: 12px;
    color: var(--rb-text-muted);
}

.rb-inventory-add__foil {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 44px;
    cursor: pointer;
}

.rb-inventory-add__foil input {
    width: 18px;
    height: 18px;
    accent-color: var(--rb-accent-cyan);
}

.rb-inventory-add__stepper {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    justify-self: end;
    border-radius: var(--rb-radius-md);
    border: 1px solid var(--rb-border-chip);
    background-color: var(--rb-bg-inset);
}

.rb-inventory-add__stepper button {
    width: 32px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--rb-text-muted);
    font-family: var(--rb-font-mono);
    font-size: 16px;
    cursor: pointer;
}

.rb-inventory-add__quantity {
    width: 48px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--rb-text-heading);
    text-align: center;
    font-family: var(--rb-font-mono);
    font-size: 13.5px;
    font-weight: 700;
    -moz-appearance: textfield;
}

.rb-inventory-add__icon-button {
    width: 36px;
    height: 36px;
    border-radius: var(--rb-radius-md);
    border: 1px solid var(--rb-border-chip);
    background-color: var(--rb-bg-inset);
    color: var(--rb-text-muted);
    cursor: pointer;
}

.rb-inventory-add__empty {
    padding: 36px 18px;
    text-align: center;
    font-size: 13px;
    color: var(--rb-text-label);
}

.rb-inventory-add__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 18px;
    background-color: var(--rb-bg-inset);
    border-top: 1px solid var(--rb-border-strong);
}

.rb-inventory-add__summary-headline {
    display: block;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--rb-text-heading);
}

.rb-inventory-add__summary-detail {
    display: block;
    margin-top: 3px;
    font-size: 11.5px;
    color: var(--rb-text-label);
}

.rb-inventory-add__actions {
    display: flex;
    gap: 10px;
}

/* Téléphone : la colonne Numéro disparaît, le numéro passe sous le nom de la carte. */
.rb-inventory-add__meta-number {
    display: none;
}

.rb-inventory-add__success,
.rb-inventory-add__error {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    padding: 12px 16px;
    border-radius: var(--rb-radius-md);
    border: 1px solid var(--rb-accent-green);
    font-size: 13.5px;
    font-weight: 600;
}

.rb-inventory-add__error {
    border-color: var(--rb-accent-red);
}

.rb-inventory-add__success a {
    color: var(--rb-accent-cyan);
}

.rb-inventory-add__row--missing-price {
    outline: 2px solid var(--rb-accent-red);
    outline-offset: -2px;
}

.rb-inventory-add__row-error {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--rb-accent-red);
}

@media (max-width: 759px) {
    .rb-inventory-add__head,
    .rb-inventory-add__row {
        grid-template-columns: 34px minmax(0, 1fr) 36px 120px 36px;
        gap: 10px;
    }

    .rb-inventory-add__col-number {
        display: none;
    }

    .rb-inventory-add__meta-number {
        display: inline;
    }
}