/* ===== Bootstrap Component Overrides ===== */
/* This file ensures your custom styles take precedence over Bootstrap defaults */

/* ===== Button Overrides ===== */
/* Preserve your custom button styles from base.css and main.css */

/* Primary button - Keep your custom blue */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--primary-blue) !important;
    border-color: var(--primary-blue) !important;
    color: white !important;
}

.btn-primary:hover {
    background-color: var(--primary-blue-dark) !important;
    border-color: var(--primary-blue-dark) !important;
}

/* Outline button - Keep your custom style */
.btn-outline,
.btn-outline:hover,
.btn-outline:focus {
    /* Your custom outline button styles are preserved */
}

/* Ensure your custom .btn base class isn't overridden */
.btn {
    /* Inherit from your base.css */
    font-weight: 600;
    transition: all 0.2s;
}

/* ===== Form Control Overrides ===== */
/* Preserve your custom form styling while using Bootstrap validation */
.form-control:focus {
    /* Your custom focus styles can override Bootstrap's */
    border-color: var(--primary-blue);
    box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, 0.1);
}

/* ===== Table Overrides ===== */
/* Ensure tables use your color scheme */
.table {
    color: var(--gray-800);
}

.table-bordered {
    border-color: var(--gray-200);
}

.table-bordered th,
.table-bordered td {
    border-color: var(--gray-200);
}

/* Cost table styles moved to mobile-property-detail.css for better organization */

/* ===== Alert Overrides ===== */
/* Use your color scheme for alerts */
.alert-primary {
    background-color: var(--primary-blue-50);
    border-color: var(--primary-blue-100);
    color: var(--primary-blue-dark);
}

.alert-success {
    background-color: var(--success-50, #d1e7dd);
    border-color: var(--success-100, #badbcc);
    color: var(--success-dark, #0a3622);
}

/* ===== Modal Overrides ===== */
/* Ensure modals match your design system */
.modal-content {
    border-radius: var(--radius-xl);
    border: 1px solid var(--gray-200);
}

.modal-header {
    background-color: var(--gray-50);
    border-bottom: 1px solid var(--gray-200);
}

.modal-footer {
    background-color: var(--gray-50);
    border-top: 1px solid var(--gray-200);
}

/* ===== Navbar Overrides ===== */
/* Your custom navbar styles from main.css take precedence */
.navbar {
    /* Your styles are already more specific, no override needed */
}

/* ===== Card Component Overrides ===== */
/* If you use Bootstrap cards, match your design system */
.card {
    border: 1px solid var(--gray-100);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
}

/* ===== Utility Overrides ===== */
/* Ensure your custom spacing and colors are used */
.text-primary {
    color: var(--primary-blue) !important;
}

.bg-primary {
    background-color: var(--primary-blue) !important;
}

.text-secondary {
    color: var(--secondary-indigo) !important;
}

.bg-secondary {
    background-color: var(--secondary-indigo) !important;
}

/* ===== Specific Component Protection ===== */
/* Protect your custom components from Bootstrap interference */

/* Search bar components */
.search-input,
.search-btn-primary {
    /* Your custom styles are preserved */
}

/* Property cards */
.property-card,
.property-title,
.property-price {
    /* Your custom styles are preserved */
}

/* Dashboard items */
.dashboard-card,
.dashboard-item {
    /* Your custom styles are preserved */
}

/* ===== Bootstrap-Specific Fixes ===== */
/* Fix any Bootstrap components that conflict with your design */

/* Remove Bootstrap's default button shadows if not wanted */
.btn:focus,
.btn:active {
    box-shadow: none !important;
}

/* Ensure your custom transitions are used */
* {
    transition-duration: var(--transition-fast, 0.15s) !important;
}

/* ===== Z-Index Management ===== */
/* Ensure your z-index scale is respected */
.modal-backdrop {
    z-index: var(--z-modal-backdrop, 1040);
}

.modal {
    z-index: var(--z-modal, 1050);
}

.dropdown-menu {
    z-index: var(--z-dropdown, 1000);
}

/* ===== Print Styles ===== */
@media print {
    /* Ensure your print styles aren't overridden */
    .btn,
    .navbar,
    .sidebar {
        /* Your print styles */
    }
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 600;
    line-height: 1.2;
    color: var(--gray-900);
}

h1 { font-size: var(--text-4xl); margin-bottom: var(--space-6); }
h2 { font-size: var(--text-3xl); margin-bottom: var(--space-5); }
h3 { font-size: var(--text-2xl); margin-bottom: var(--space-4); }
h4 { font-size: var(--text-xl); margin-bottom: var(--space-3); }
h5 { font-size: var(--text-lg); margin-bottom: var(--space-3); }
h6 { font-size: var(--text-base); margin-bottom: var(--space-2); }

a {
    text-decoration: none;
}