/* Adresseopslag — autocomplete + etage/dør + hjemløs */

/* Autocomplete suggestions dropdown */
.adresse-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1050;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    border: 2px solid var(--bs-primary, #0d6efd);
    border-top: none;
    border-radius: 0 0 0.375rem 0.375rem;
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
    max-height: 280px;
    overflow-y: auto;
    display: none;
}
.adresse-suggestions.active { display: block; }

.adresse-suggestion-item {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.92rem;
    color: var(--bs-body-color, #212529);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    transition: background 0.1s;
}
.adresse-suggestion-item:last-child { border-bottom: none; }
.adresse-suggestion-item:hover,
.adresse-suggestion-item.active {
    background: var(--bs-tertiary-bg, #f0f0f0);
}
.adresse-suggestion-item .match {
    font-weight: 700;
    color: var(--bs-primary, #0d6efd);
}
.adresse-suggestion-empty {
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    color: var(--bs-secondary-color, #6c757d);
    font-style: italic;
}

/* Wrapper til adresse-input med spinner og suggestions */
.adresse-input-wrap { position: relative; }

/* Loading spinner */
.adresse-spinner {
    display: none;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    border: 2px solid var(--bs-border-color, #dee2e6);
    border-top-color: var(--bs-primary, #0d6efd);
    border-radius: 50%;
    animation: adresse-spin 0.6s linear infinite;
}
.adresse-input-wrap.loading .adresse-spinner { display: block; }
@keyframes adresse-spin { to { transform: translateY(-50%) rotate(360deg); } }

/* Etage/dør sektion */
.adresse-etage-section { display: none; }
.adresse-etage-section.active { display: block; animation: adresse-fadeIn 0.25s ease; }

.adresse-etage-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.5rem;
}
.adresse-etage-btn {
    padding: 0.4rem 0.8rem;
    border: 2px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.375rem;
    background: var(--bs-body-bg, #fafafa);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.15s;
    color: var(--bs-body-color, #212529);
}
.adresse-etage-btn:hover {
    border-color: var(--bs-primary, #0d6efd);
    background: var(--bs-tertiary-bg, #f0f0f0);
}
.adresse-etage-btn.selected {
    border-color: var(--bs-primary, #0d6efd);
    background: var(--bs-primary, #0d6efd);
    color: #fff;
}

/* Valgt adresse-boks */
.adresse-selected {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: var(--bs-success-bg-subtle, #d1e7dd);
    border: 1px solid var(--bs-success-border-subtle, #a3cfbb);
    border-radius: 0.375rem;
    display: none;
}
.adresse-selected.visible { display: block; animation: adresse-fadeIn 0.25s ease; }
.adresse-selected-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-success, #198754);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.25rem;
}
.adresse-selected-text {
    font-size: 1rem;
    font-weight: 600;
    color: var(--bs-body-color, #212529);
}
.adresse-selected-details {
    font-size: 0.85rem;
    color: var(--bs-secondary-color, #6c757d);
    margin-top: 0.15rem;
}
.adresse-clear-btn {
    margin-top: 0.5rem;
    background: none;
    border: 1.5px solid var(--bs-danger, #dc3545);
    color: var(--bs-danger, #dc3545);
    padding: 0.25rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s;
}
.adresse-clear-btn:hover {
    background: var(--bs-danger, #dc3545);
    color: #fff;
}

/* Manuel adresse-knap (vises ved ingen match) */
.adresse-manual-btn {
    display: none;
    margin-top: 0.5rem;
}
.adresse-manual-btn.active { display: inline-block; }

/* Hjemløs checkbox */
.adresse-hjemløs-wrap {
    margin-bottom: 0.5rem;
}
.adresse-hjemløs-wrap .form-check-label {
    font-weight: 500;
}

@keyframes adresse-fadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------------------------------------------------------------------
   Ugyldige Select2-felter (Y-05)
   
   Select2 skjuler det oprindelige <select> og tegner sin egen boks. Uden
   dette fik brugeren kun fejlteksten, mens feltet selv så helt normalt ud —
   og på en side med mange felter er teksten alene svær at få øje på.
   Bootstrap viser stadig .invalid-feedback via ~-selektoren.
   --------------------------------------------------------------------- */
select.is-invalid + .select2-container .select2-selection {
    border-color: var(--bs-form-invalid-border-color, #dc3545);
}

select.is-invalid + .select2-container.select2-container--focus .select2-selection,
select.is-invalid + .select2-container.select2-container--open .select2-selection {
    border-color: var(--bs-form-invalid-border-color, #dc3545);
    box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .25);
}

select.is-valid + .select2-container .select2-selection {
    border-color: var(--bs-form-valid-border-color, #198754);
}