/*
 * Doctsf / Grand Livre — fiche_form.css
 * Complément de appareil_recherche.css.
 * Les couleurs restent volontairement rattachées à la charte Doctsf.
 */

:root {
    --doctsf-form-accent: var(--accent, #315f78);
    --doctsf-form-soft: #f4f7f8;
    --doctsf-form-border: #d7e0e4;
}

.form-card {
    display: block;
}

.categories-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.btn-categorie,
.btn-plus-toggle,
.small-button {
    border: 1px solid var(--doctsf-form-border);
    border-radius: .45rem;
    background: #fff;
    padding: .48rem .72rem;
    cursor: pointer;
    font: inherit;
}

.btn-categorie.active {
    background: var(--doctsf-form-accent);
    color: #fff;
    border-color: var(--doctsf-form-accent);
}

.btn-categorie.hidden,
.btn-plus.hidden {
    display: none;
}

.form-row {
    display: grid;
    grid-template-columns: minmax(160px, 230px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    padding: .65rem 0;
    border-bottom: 1px solid var(--doctsf-form-border);
}

.form-row > label {
    font-weight: 600;
    padding-top: .4rem;
}

.field-wrap input[type="text"],
.field-wrap input[type="search"],
.field-wrap select,
.field-wrap textarea,
.groupe-input input[type="text"],
.groupe-input select {
    box-sizing: border-box;
    max-width: 100%;
}

.field-wrap input[type="text"],
.field-wrap input[type="search"],
.field-wrap select {
    min-height: 2.25rem;
}

.field-wrap textarea {
    width: 100%;
    resize: vertical;
}

.toggle-nullable,
.option-groupe,
.coche-groupe {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem 1rem;
}

.groupe-inputs {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem 1.25rem;
}

.groupe-input {
    min-width: 120px;
    flex: 1 1 140px;
}

.groupe-input-label {
    display: block;
    font-size: .9rem;
    margin-bottom: .25rem;
    font-weight: 600;
}

.label-suffixe {
    font-weight: 400;
    opacity: .7;
}

.marque-edit-wrap,
.modele-edit-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .65rem;
}

.marque-search-box {
    flex-basis: 100%;
    max-width: 520px;
    position: relative;
}

.autocomplete-results {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--doctsf-form-border);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .12);
    max-height: 320px;
    overflow-y: auto;
}

.autocomplete-item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: #fff;
    padding: .55rem .7rem;
    cursor: pointer;
}

.autocomplete-item:hover,
.autocomplete-item.active {
    background: var(--doctsf-form-soft);
}

.retour-appareil-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.retour-appareil-vignette img {
    width: 90px;
    max-height: 90px;
    object-fit: contain;
}

.retour-appareil-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
}

.fiche-numero {
    padding: .3rem .55rem;
    border-radius: .35rem;
    background: var(--doctsf-form-soft);
}

.notice.error {
    margin-bottom: 1rem;
    padding: .8rem 1rem;
    border: 1px solid #c36b6b;
    background: #fff3f3;
}

.champ-erreur {
    display: none;
    margin-top: .25rem;
    font-size: .85rem;
}

.champ-erreur.visible {
    display: block;
}

.champ-invalide {
    outline: 2px solid #b24b4b;
}

/* =========================
   Jeux de lampes
   ========================= */

#bloc-jeux-lampes {
    margin-top: 1rem;
}

.lampes-aide {
    margin: 0 0 1rem;
    font-size: .9rem;
    opacity: .75;
}

.jeu-lampes {
    padding: .8rem 0 1rem;
    border-bottom: 1px solid var(--doctsf-form-border);
}

.jeu-lampes:last-child {
    border-bottom: 0;
}

.jeu-lampes h3 {
    margin: 0 0 .6rem;
    font-size: 1rem;
}

.lampes-ligne {
    display: grid;
    grid-template-columns: 85px minmax(0, 1fr);
    gap: .8rem;
    align-items: start;
}

.lampes-ligne label,
.lampes-commentaire {
    display: block;
    font-size: .9rem;
}

.lampes-ligne input,
.lampes-commentaire input {
    box-sizing: border-box;
    width: 100%;
    min-height: 2.1rem;
    margin-top: .25rem;
}

.lampes-jeu {
    min-width: 0;
}

.lampes-controle {
    margin-top: .35rem;
    min-height: 0;
}

.lampes-resultats {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
}

.lampe-badge {
    display: inline-block;
    padding: .12rem .38rem;
    border-radius: .3rem;
    font-size: .8rem;
    line-height: 1.3;
    border: 1px solid transparent;
}

.lampe-ok {
    background: #edf7ef;
    border-color: #a8cfb0;
}

.lampe-inconnue {
    background: #fff0f0;
    border-color: #d8a0a0;
}

.lampes-message-ok,
.lampes-message-erreur,
.lampes-verification {
    margin-top: .25rem;
    font-size: .8rem;
}

.lampes-message-erreur {
    font-weight: 600;
}

.lampes-reference-input.lampes-inconnues {
    outline: 1px solid #c27676;
    outline-offset: 0;
}

.lampes-commentaire {
    margin-top: .6rem;
}

#ajouter-jeu-lampes {
    margin-top: .8rem;
}

@media (max-width: 720px) {
    .lampes-ligne {
        grid-template-columns: 1fr;
    }

    .lampes-ligne > label:first-child {
        max-width: 100px;
    }
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, .45);
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.modal-box {
    width: min(520px, 100%);
    background: #fff;
    border-radius: .6rem;
    padding: 1rem;
    box-shadow: 0 15px 45px rgba(0,0,0,.25);
}

.modal-input {
    width: 100%;
    box-sizing: border-box;
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: .65rem;
    margin-top: 1rem;
}

.modal-error {
    margin-top: .5rem;
}

@media (max-width: 720px) {
    .form-row {
        grid-template-columns: 1fr;
        gap: .25rem;
    }

    .form-row > label {
        padding-top: 0;
    }

    .lampes-ligne {
        grid-template-columns: 1fr;
    }
}


/* Assistance saisie des références de lampes */
.lampes-controle {
    margin-top: .4rem;
    min-height: 1.2rem;
}

.lampes-resultats {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.lampe-badge {
    display: inline-flex;
    align-items: center;
    padding: .18rem .42rem;
    border-radius: .35rem;
    font-size: .84rem;
    line-height: 1.25;
    border: 1px solid transparent;
}

.lampe-ok {
    background: #edf7ef;
    border-color: #a8cfb0;
}

.lampe-inconnue {
    background: #fff0f0;
    border-color: #d8a0a0;
}

.lampes-message-ok,
.lampes-message-erreur,
.lampes-verification {
    margin-top: .3rem;
    font-size: .84rem;
}

.lampes-message-erreur {
    font-weight: 600;
}

.lampes-reference-input.lampes-inconnues {
    outline: 2px solid #c27676;
    outline-offset: 1px;
}