/* ==========================================================================
   Cards, dropdowns, modales, formulaires
   ========================================================================== */

.card {
    background-color: var(--surface);
    border-color: var(--border);
    color: var(--text);
}

.card-header,
.card-footer {
    background-color: var(--bg-subtle);
    border-color: var(--border);
}

.dropdown-menu {
    background-color: var(--surface);
    border-color: var(--border);
    box-shadow: var(--shadow-sm);
}

.dropdown-item {
    color: var(--text);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--bg-subtle);
    color: var(--text);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--accent);
    color: var(--accent-contrast);
}

.dropdown-header {
    color: var(--text-muted);
}

.dropdown-divider {
    border-color: var(--border);
}

.modal-content {
    background-color: var(--surface);
    border-color: var(--border);
    color: var(--text);
    box-shadow: var(--shadow-md);
}

.modal-header,
.modal-footer {
    border-color: var(--border);
}

/* Bootstrap's close-icon SVG is baked in dark-on-transparent — invert it on a
   dark surface so it stays visible instead of near-disappearing. */
[data-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%);
}

.form-control,
.form-select {
    background-color: var(--surface);
    border-color: var(--border);
    color: var(--text);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--surface);
    color: var(--text);
    border-color: var(--accent);
}

[data-theme="dark"] .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23e8e9eb' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

.form-control::placeholder {
    color: var(--text-tertiary);
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--bg-subtle);
    color: var(--text-tertiary);
}