/**
 * Bootstrap Overrides - map Bootstrap components to Design System tokens
 */

/* Buttons */
.btn-primary {
    --bs-btn-bg: var(--ds-color-primary);
    --bs-btn-border-color: var(--ds-color-primary);
    --bs-btn-hover-bg: var(--ds-color-primary-dark);
    --bs-btn-hover-border-color: var(--ds-color-primary-dark);
    --bs-btn-active-bg: var(--ds-color-primary-dark);
    --bs-btn-active-border-color: var(--ds-color-primary-dark);
    --bs-btn-focus-shadow-rgb: 0, 150, 52;
}

.btn-secondary {
    --bs-btn-bg: var(--ds-color-neutral-100);
    --bs-btn-border-color: var(--ds-border-color-light);
    --bs-btn-color: var(--ds-color-neutral-700);
    --bs-btn-hover-bg: var(--ds-color-neutral-200);
    --bs-btn-hover-border-color: var(--ds-border-color-medium);
    --bs-btn-hover-color: var(--ds-color-neutral-900);
}

.btn-success {
    --bs-btn-bg: var(--ds-color-success);
    --bs-btn-border-color: var(--ds-color-success);
    --bs-btn-hover-bg: var(--ds-color-success-dark);
    --bs-btn-hover-border-color: var(--ds-color-success-dark);
}

.btn-danger {
    --bs-btn-bg: var(--ds-color-error);
    --bs-btn-border-color: var(--ds-color-error);
    --bs-btn-hover-bg: var(--ds-color-error-dark);
    --bs-btn-hover-border-color: var(--ds-color-error-dark);
}

.btn {
    border-radius: var(--ds-radius-md);
    font-family: var(--ds-font-family);
    font-size: var(--ds-font-size-sm);
    font-weight: var(--ds-font-weight-semibold);
    padding: var(--ds-space-4) var(--ds-space-6);
    min-height: var(--ds-touch-target-min);
}

@media (max-width: 767px) {
    .modal-footer .btn,
    .modal-header .btn {
        min-height: var(--ds-touch-target-min);
    }
}

/* Forms */
.form-control,
.form-select {
    border-color: var(--ds-border-color-light);
    border-radius: var(--ds-radius-md);
    font-family: var(--ds-font-family);
    font-size: var(--ds-font-size-base);
    padding: var(--ds-space-3) var(--ds-space-4);
    color: var(--ds-color-neutral-900);
    background-color: var(--ds-color-surface);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--ds-color-primary);
    box-shadow: 0 0 0 3px var(--ds-color-primary-bg);
}

@media (max-width: 767px) {
    .form-control,
    .form-select {
        min-height: var(--ds-touch-target-min);
    }
}

/* Modals */
.modal-content {
    border-radius: var(--ds-radius-lg);
    border-color: var(--ds-border-color-light);
    box-shadow: var(--ds-shadow-xl);
    font-family: var(--ds-font-family);
}

.modal-header {
    border-bottom-color: var(--ds-border-color-light);
    padding: var(--ds-space-5) var(--ds-space-6);
}

.modal-body {
    padding: var(--ds-space-6);
}

.modal-footer {
    border-top-color: var(--ds-border-color-light);
    padding: var(--ds-space-4) var(--ds-space-6);
    gap: var(--ds-space-3);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.ds-modal-header-brand {
    background: linear-gradient(135deg, var(--ds-color-primary) 0%, var(--ds-color-primary-dark) 100%);
    color: var(--ds-color-hero-text);
    border-bottom: none;
}

.ds-modal-header-brand .modal-title,
.ds-modal-header-brand .btn-close {
    color: var(--ds-color-hero-text);
}

.ds-modal-header-brand .btn-close {
    filter: brightness(0) invert(1);
    opacity: 0.85;
}

.ds-modal-footer-muted {
    background: var(--ds-color-neutral-100);
}

.modal-title {
    font-size: var(--ds-font-size-lg);
    font-weight: var(--ds-font-weight-semibold);
    color: var(--ds-color-neutral-900);
}

/* Alerts */
.alert {
    border-radius: var(--ds-radius-md);
    font-family: var(--ds-font-family);
    border-width: var(--ds-border-width-thin);
}

.alert-success {
    background-color: var(--ds-color-success-bg);
    border-color: var(--ds-color-success-light);
    color: var(--ds-color-success-dark);
}

.alert-warning {
    background-color: var(--ds-color-warning-bg);
    border-color: var(--ds-color-warning-light);
    color: var(--ds-color-warning-dark);
}

.alert-danger {
    background-color: var(--ds-color-error-bg);
    border-color: var(--ds-color-error-light);
    color: var(--ds-color-error-dark);
}

.alert-info {
    background-color: var(--ds-color-info-bg);
    border-color: var(--ds-color-info-light);
    color: var(--ds-color-info-dark);
}

/* Progress */
.progress {
    height: 10px;
    border-radius: var(--ds-radius-md);
    background: var(--ds-color-neutral-200);
}

.progress-bar {
    background: var(--ds-color-primary);
    border-radius: var(--ds-radius-md);
}

/* Dropdown */
.dropdown-menu {
    border-radius: var(--ds-radius-md);
    border-color: var(--ds-border-color-light);
    box-shadow: var(--ds-shadow-lg);
    font-family: var(--ds-font-family);
    font-size: var(--ds-font-size-sm);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--ds-color-neutral-100);
    color: var(--ds-color-neutral-900);
}

/* Close button */
.btn-close:focus {
    box-shadow: 0 0 0 3px var(--ds-color-primary-bg);
}
