/* ===== COLOR CONTRAST FIX FOR READABILITY ===== */
/* Ensures all form elements have proper text contrast across all pages */
/* Priority: High Contrast + Consistent Colors */

:root {
    /* Base Text Colors - High Contrast (Darkened for better readability) */
    --text-primary: #0f172a;
    /* Slate 900 - Almost Black */
    --text-secondary: #334155;
    /* Slate 700 - Dark Grey */
    --text-muted: #64748b;
    /* Slate 500 - Medium Grey */
    --text-white: #ffffff;
    /* White on dark backgrounds */

    /* Background Colors */
    --bg-white: #ffffff;
    --bg-light: #f8fafc;
    --bg-input: #f1f5f9;
    --bg-disabled: #e2e8f0;

    /* Brand Colors */
    --color-primary: #6366f1;
    --color-primary-dark: #4f46e5;
    --color-secondary: #8b5cf6;
    --color-success: #10b981;
    --color-warning: #f59e0b;
    --color-danger: #ef4444;
    --color-info: #06b6d4;

    /* Border Colors */
    --border-light: #e2e8f0;
    --border-focus: #6366f1;
}

/* ===== GLOBAL TEXT FIXES ===== */

/* Body & Main Content */
body {
    color: var(--text-primary);
}

/* All headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-primary);
}

/* Paragraphs in light backgrounds */
p {
    color: var(--text-secondary);
}

/* Links */
a {
    color: var(--color-primary);
}

a:hover {
    color: var(--color-primary-dark);
}

/* ===== FORM INPUT FIXES ===== */

/* Text Inputs, Textareas, Selects */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="date"],
textarea,
select,
.form-control {
    color: var(--text-primary) !important;
    background-color: var(--bg-white) !important;
    border-color: var(--border-light);
}

/* Input Focus State */
input:focus,
textarea:focus,
select:focus,
.form-control:focus {
    color: var(--text-primary) !important;
    background-color: var(--bg-white) !important;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Placeholder Text - Must be visible but subtle */
input::placeholder,
textarea::placeholder,
.form-control::placeholder {
    color: var(--text-muted) !important;
    opacity: 1 !important;
}

/* Autofill Fix - WebKit */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill {
    -webkit-text-fill-color: var(--text-primary) !important;
    -webkit-box-shadow: 0 0 0px 1000px var(--bg-white) inset !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Disabled Inputs */
input:disabled,
textarea:disabled,
select:disabled,
.form-control:disabled {
    color: var(--text-muted) !important;
    background-color: var(--bg-disabled) !important;
    opacity: 1;
}

/* ===== LABELS ===== */
label,
.form-label {
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Required asterisk */
label .required,
.form-label .required {
    color: var(--color-danger);
}

/* ===== SELECT DROPDOWN ===== */
select option {
    color: var(--text-primary);
    background-color: var(--bg-white);
}

/* ===== BUTTONS WITH TEXT ===== */

/* Primary Button - White text on purple */
.btn-primary,
button[type="submit"],
.submit-btn {
    color: var(--text-white) !important;
    background: linear-gradient(135deg, var(--color-primary), var(--color-secondary));
}

/* Success Button - White text on green */
.btn-success {
    color: var(--text-white) !important;
}

/* Warning Button - Dark text on yellow/orange */
.btn-warning {
    color: var(--text-primary) !important;
}

/* Danger Button - White text on red */
.btn-danger {
    color: var(--text-white) !important;
}

/* Info Button - White text on cyan */
.btn-info {
    color: var(--text-white) !important;
}

/* Secondary/Light Button - Dark text */
.btn-secondary,
.btn-light {
    color: var(--text-primary) !important;
}

/* Outline Buttons */
.btn-outline-primary {
    color: var(--color-primary);
}

.btn-outline-success {
    color: var(--color-success);
}

.btn-outline-danger {
    color: var(--color-danger);
}

.btn-outline-warning {
    color: var(--text-primary);
}

.btn-outline-info {
    color: var(--color-info);
}

/* ===== CARD & CONTAINER TEXT ===== */

/* Cards with white background */
.card,
.card-body {
    color: var(--text-primary);
}

/* Card titles */
.card-title {
    color: var(--text-primary);
}

/* Card text */
.card-text {
    color: var(--text-secondary);
}

/* ===== INFO BOXES & ALERTS ===== */

/* Info box */
.info-box,
.alert-info {
    color: #0c4a6e;
    /* Dark blue for info */
}

/* Success box */
.alert-success {
    color: #065f46;
    /* Dark green */
}

/* Warning box */
.alert-warning {
    color: #78350f;
    /* Dark orange/brown */
}

/* Danger box */
.alert-danger {
    color: #7f1d1d;
    /* Dark red */
}

/* ===== MODAL TEXT ===== */

/* Modal body text */
.modal-body,
.modal-content {
    color: var(--text-primary);
}

/* Modal title */
.modal-title {
    color: var(--text-primary);
}

/* Modal on gradient background - white text */
.modal-header.bg-gradient-primary,
.modal-header.bg-primary {
    color: var(--text-white) !important;
}

.modal-header.bg-gradient-primary .modal-title,
.modal-header.bg-primary .modal-title,
.modal-header.bg-gradient-primary .btn-close {
    color: var(--text-white) !important;
}

/* ===== TABLE TEXT ===== */
.table {
    color: var(--text-primary);
}

.table th {
    color: var(--text-primary);
    font-weight: 600;
}

.table td {
    color: var(--text-secondary);
}

/* ===== BADGE TEXT ===== */
.badge.bg-primary,
.badge.bg-success,
.badge.bg-danger,
.badge.bg-info {
    color: var(--text-white) !important;
}

.badge.bg-warning,
.badge.bg-light {
    color: var(--text-primary) !important;
}

/* ===== DROPDOWN MENU ===== */
.dropdown-item {
    color: var(--text-primary);
}

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

/* ===== MENU ITEMS IN DRAWER ===== */
.drawer-menu-item,
.nav-link {
    color: var(--text-primary);
}

.drawer-menu-item:hover,
.nav-link:hover {
    color: var(--color-primary);
}

.drawer-menu-item.active,
.nav-link.active {
    color: var(--color-primary);
    font-weight: 600;
}

/* ===== PROFILE CARD TEXT (White on gradient) ===== */
.profile-card,
.profile-card * {
    color: var(--text-white);
}

.profile-card .profile-stat-value {
    color: var(--text-white);
}

.profile-card .profile-stat-label {
    color: rgba(255, 255, 255, 0.85);
}

/* ===== STAT ITEMS (on white background) ===== */
.stat-item .stat-value,
.profile-stat-item .stat-value {
    color: var(--text-primary);
}

.stat-item .stat-label,
.profile-stat-item .stat-label {
    color: var(--text-muted);
}

/* ===== ANNOUNCEMENT CARDS ===== */
.announcement-card .announcement-title {
    color: var(--text-primary);
}

.announcement-card .announcement-date {
    color: var(--text-muted);
}

.announcement-card .announcement-content {
    color: var(--text-secondary);
}

/* ===== STATUS BADGES ===== */
.status-badge.pending {
    background: #fef3c7;
    color: #92400e !important;
}

.status-badge.active,
.status-badge.approved {
    background: #d1fae5;
    color: #065f46 !important;
}

.status-badge.rejected {
    background: #fee2e2;
    color: #991b1b !important;
}

.status-badge.process,
.status-badge.processing {
    background: #e0e7ff;
    color: #3730a3 !important;
}

/* ===== CHATBOT TEXT ===== */
.chat-message.bot .message-bubble {
    color: var(--text-primary);
    background: var(--bg-white);
}

.chat-message.user .message-bubble {
    color: var(--text-white);
}

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

/* ===== FILE UPLOAD AREA ===== */
.file-upload-area,
.upload-box {
    color: var(--text-secondary);
}

.file-upload-area i,
.upload-box i {
    color: var(--color-primary);
}

/* ===== TABS ===== */
.tab-btn {
    color: var(--text-secondary);
}

.tab-btn.active {
    color: var(--color-primary);
}

/* ===== EMPTY STATE ===== */
.empty-state h3 {
    color: var(--text-primary);
}

.empty-state p {
    color: var(--text-muted);
}

/* ===== HERO/PAGE HEADER ON GRADIENT ===== */
.hero-section,
.page-header {
    /* Assume gradient background, use white text */
}

/* White text on gradient backgrounds */
[style*="gradient"] h1,
[style*="gradient"] h2,
[style*="gradient"] p,
.hero-section h1,
.hero-section p,
.page-header h1,
.page-header p {
    color: var(--text-white);
}

/* ===== SPECIFIC PAGE OVERRIDES ===== */

/* Lapor Aduan Page - Gradient background */
body[class*="gradient"] .container h1,
body[class*="gradient"] .page-header h1 {
    color: var(--text-white);
}

/* ===== HELPER CLASSES ===== */
.text-dark {
    color: var(--text-primary) !important;
}

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

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

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

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

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

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

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

/* Background helpers */
.bg-white {
    background-color: var(--bg-white) !important;
}

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

/* ===== ENHANCED WHITE TEXT ON DARK/GRADIENT BACKGROUNDS ===== */

/* App Bar and Header - Ensure white text */
.app-bar,
.app-bar *,
.app-header,
.app-header *,
.app-bar-title,
.app-bar-title h1,
.app-bar-title p,
.title-text,
.title-text h1,
.title-text p {
    color: #ffffff !important;
}

/* Navigation Drawer Header */
.drawer-header,
.drawer-header *,
.drawer-logo,
.drawer-logo *,
.drawer-logo-text,
.drawer-logo-text h2,
.drawer-logo-text p,
.drawer-user,
.drawer-user *,
.drawer-user-info,
.drawer-user-info h3,
.drawer-user-info p {
    color: #ffffff !important;
}

/* Drawer Clock */
.drawer-clock,
.drawer-clock *,
.clock-time,
.clock-date {
    color: #ffffff !important;
}

/* Make clock time slightly visible gradient */
.clock-time {
    background: linear-gradient(135deg, #c7d2fe, #e9d5ff) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* Drawer Menu Items - White text on dark drawer */
.drawer-menu-item,
.drawer-menu-item span,
.drawer-menu-item i {
    color: rgba(255, 255, 255, 0.85) !important;
}

.drawer-menu-item:hover,
.drawer-menu-item:hover span,
.drawer-menu-item:hover i {
    color: #ffffff !important;
}

.drawer-menu-item.active,
.drawer-menu-item.active span,
.drawer-menu-item.active i {
    color: #ffffff !important;
}

/* Menu Section Titles in Drawer ONLY */
.nav-drawer .menu-section-title {
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Marquee Ticker */
.marquee-ticker,
.marquee-ticker *,
.marquee-text,
.marquee-text * {
    color: #ffffff !important;
}

/* Profile Menu Header on gradient */
.profile-card,
.profile-card *,
.profile-card h1,
.profile-card h2,
.profile-card h3,
.profile-card p {
    color: #ffffff !important;
}

/* Slide content text on dark overlay */
.slide-content,
.slide-content *,
.slide-title,
.slide-desc {
    color: #ffffff !important;
}

/* PWA Install Banner Text */
.pwa-install-banner .banner-title,
.pwa-install-banner .banner-subtitle,
.pwa-install-banner .banner-note {
    color: #1e293b !important;
}

/* Profile Stat Items on gradient cards */
.profile-stat-value {
    color: #ffffff !important;
}

.profile-stat-label {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* Any element on gradient backgrounds */
[class*="bg-gradient"] h1,
[class*="bg-gradient"] h2,
[class*="bg-gradient"] h3,
[class*="bg-gradient"] h4,
[class*="bg-gradient"] h5,
[class*="bg-gradient"] h6,
[class*="bg-gradient"] p,
[class*="bg-gradient"] span,
[class*="bg-gradient"] i,
.bg-primary h1,
.bg-primary h2,
.bg-primary h3,
.bg-primary p,
.bg-primary span {
    color: #ffffff !important;
}

/* Status Bar (if visible) */
.status-bar,
.status-bar * {
    color: #ffffff !important;
}

/* Login Button Header Icon */
.login-btn-header,
.login-btn-header i {
    color: #ffffff !important;
}

/* Icon Buttons in App Bar */
.icon-btn,
.icon-btn i,
.hamburger-menu,
.hamburger-menu i {
    color: #ffffff !important;
}

/* Toast/Notification Messages */
.toast-message,
.notification-toast {
    color: #ffffff !important;
}

/* Hero Sections */
.hero-section,
.hero-section *,
.hero-section h1,
.hero-section h2,
.hero-section p {
    color: #ffffff !important;
}

/* Page Headers on gradient */
.page-header,
.page-header *,
.page-header h1,
.page-header h2,
.page-header p {
    color: #ffffff !important;
}

/* ===== MAINTENANCE BANNER FORCE FIX ===== */
/* Ensures banner text is always white regardless of other styles */
.maintenance-banner,
.maintenance-banner h4,
.maintenance-banner .maintenance-banner-title,
.maintenance-banner p,
.maintenance-banner .maintenance-banner-message,
.maintenance-banner i,
.maintenance-banner span {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}