/* Custom styles for HOA/PropertyLedger App */

/* ============================================================================
   Tabler Primary Color Override - Warm Coral/Terracotta (#e46a46)
   ============================================================================ */

:root,
[data-bs-theme="light"] {
    /* Primary color */
    --tblr-primary: #e46a46;
    --tblr-primary-rgb: 228, 106, 70;
    --tblr-primary-fg: #ffffff;
    --tblr-primary-darken: #ad5337;
    --tblr-primary-lighten: #f09880;

    /* Links */
    --tblr-link-color: #c85e3f;
    --tblr-link-hover-color: #934730;

    /* Bootstrap compatibility */
    --bs-primary: #e46a46;
    --bs-primary-rgb: 228, 106, 70;
    --bs-link-color: #c85e3f;
    --bs-link-hover-color: #934730;

    /* Status colors */
    --tblr-success: #1b7f5c;
    --tblr-success-rgb: 27, 127, 92;
    --tblr-warning: #b8871f;
    --tblr-warning-rgb: 184, 135, 31;
    --tblr-danger: #b13535;
    --tblr-danger-rgb: 177, 53, 53;
    --tblr-info: #1e56a3;
    --tblr-info-rgb: 30, 86, 163;
}

[data-bs-theme="dark"] {
    /* Lighter primary for dark mode visibility */
    --tblr-primary: #e46a46;
    --tblr-primary-rgb: 228, 106, 70;
    --tblr-primary-fg: #1f2937;
    --tblr-primary-darken: #c85e3f;
    --tblr-primary-lighten: #f09880;

    --tblr-link-color: #e46a46;
    --tblr-link-hover-color: #f09880;

    /* Bootstrap compatibility */
    --bs-primary: #e46a46;
    --bs-primary-rgb: 228, 106, 70;
    --bs-link-color: #e46a46;
    --bs-link-hover-color: #f09880;

    /* Status colors - lighter variants for dark mode */
    --tblr-success: #28be8a;
    --tblr-success-rgb: 40, 190, 138;
    --tblr-warning: #dfae44;
    --tblr-warning-rgb: 223, 174, 68;
    --tblr-danger: #d06262;
    --tblr-danger-rgb: 208, 98, 98;
    --tblr-info: #347ada;
    --tblr-info-rgb: 52, 122, 218;

    /* Improved secondary/muted text colors for better readability */
    --tblr-secondary: #a8b3c4;
    --tblr-secondary-rgb: 168, 179, 196;
    --tblr-secondary-color: #a8b3c4;
    --tblr-muted: #9ca3af;
    --bs-secondary-color: #a8b3c4;
}

/* Navbar with primary color */
.navbar {
    background-color: var(--tblr-primary) !important;
}

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

/* Button overrides */
.btn-primary {
    --tblr-btn-bg: var(--tblr-primary);
    --tblr-btn-border-color: var(--tblr-primary);
    --tblr-btn-hover-bg: var(--tblr-primary-darken);
    --tblr-btn-hover-border-color: var(--tblr-primary-darken);
    --tblr-btn-active-bg: var(--tblr-primary-darken);
    --tblr-btn-active-border-color: var(--tblr-primary-darken);
}

.btn-outline-primary {
    --tblr-btn-color: var(--tblr-primary);
    --tblr-btn-border-color: var(--tblr-primary);
    --tblr-btn-hover-bg: var(--tblr-primary);
    --tblr-btn-hover-border-color: var(--tblr-primary);
    --tblr-btn-active-bg: var(--tblr-primary-darken);
    --tblr-btn-active-border-color: var(--tblr-primary-darken);
}

.text-primary {
    color: var(--tblr-primary) !important;
}

.border-primary {
    border-color: var(--tblr-primary) !important;
}

.progress-bar {
    background-color: var(--tblr-primary);
}

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

/* Version badge styling */
.version-badge {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    margin-left: 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.version-badge:hover {
    background: rgba(255, 255, 255, 0.25);
    color: white;
    text-decoration: none;
}

/* Theme transition smoothing */
html.theme-transitioning,
html.theme-transitioning *,
html.theme-transitioning *::before,
html.theme-transitioning *::after {
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease !important;
}

/* ============================================================================
   Light Mode Text Color Improvements
   ============================================================================ */

/* Navbar links - white text on coral background */
[data-bs-theme="light"] .navbar .nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
}

[data-bs-theme="light"] .navbar .nav-link:hover,
[data-bs-theme="light"] .navbar .nav-link.active {
    color: #ffffff !important;
}

/* Navbar brand text */
[data-bs-theme="light"] .navbar .navbar-brand {
    color: #ffffff !important;
}

/* Form labels - black text for better readability */
[data-bs-theme="light"] .form-label,
[data-bs-theme="light"] label.form-label,
[data-bs-theme="light"] .card .form-label,
[data-bs-theme="light"] .card-body .form-label {
    color: #1f2937 !important;
}

/* Card subtitles and secondary text */
[data-bs-theme="light"] .card-subtitle,
[data-bs-theme="light"] .subheader {
    color: #4b5563 !important;
}

/* Badges with colored backgrounds - ensure white text */
[data-bs-theme="light"] .badge.bg-blue,
[data-bs-theme="light"] .badge.bg-yellow,
[data-bs-theme="light"] .badge.bg-green,
[data-bs-theme="light"] .badge.bg-orange,
[data-bs-theme="light"] .badge.bg-red,
[data-bs-theme="light"] .badge.bg-purple,
[data-bs-theme="light"] .badge.bg-cyan,
[data-bs-theme="light"] .badge.bg-azure,
[data-bs-theme="light"] .badge.bg-teal,
[data-bs-theme="light"] .badge.bg-lime,
[data-bs-theme="light"] .badge.bg-pink {
    color: #ffffff !important;
}

/* ============================================================================
   Dark Mode Secondary Text Readability Improvements
   ============================================================================ */
[data-bs-theme="dark"] .text-secondary,
[data-bs-theme="dark"] .text-muted {
    color: #a8b3c4 !important;
}

[data-bs-theme="dark"] .card-subtitle,
[data-bs-theme="dark"] .form-label {
    color: #9ca3af !important;
}

[data-bs-theme="dark"] small.text-secondary,
[data-bs-theme="dark"] small.text-muted {
    color: #b0bac9 !important;
}