/* Global sayfa teması — layout sidebar sayfaları dark/light uyumu */

/* ===== CSS değişkenleri (sayfa içi :root override'larını geçersiz kıl) ===== */
html[data-theme="dark"] {
    --dark-color: #e0e0e0 !important;
    --light-color: #b0b0b0 !important;
    --text-color: #e0e0e0 !important;
    --card-bg: rgba(30, 30, 45, 0.95) !important;
    --surface-color: #1e1e2d !important;
    --bg-secondary: #252536 !important;
    --border-color: #3d3d5c !important;
    --text-primary: #e0e0e0 !important;
    --text-secondary: #a0a0a0 !important;
    --text-muted: #707070 !important;
    --input-bg: #252536 !important;
    --input-border: #3d3d5c !important;
    --table-header-bg: #252536 !important;
    --table-hover-bg: #2d2d45 !important;
}

/* ===== Zorla açık metin renkleri (sayfa !important kuralları) ===== */
html[data-theme="dark"] .main-content h1,
html[data-theme="dark"] .main-content h2,
html[data-theme="dark"] .main-content h3,
html[data-theme="dark"] .main-content h4,
html[data-theme="dark"] .main-content h5,
html[data-theme="dark"] .main-content h6,
html[data-theme="dark"] .main-content p,
html[data-theme="dark"] .main-content label,
html[data-theme="dark"] .main-content .page-title,
html[data-theme="dark"] .main-content .page-title i,
html[data-theme="dark"] .main-content .stat-card h3,
html[data-theme="dark"] .main-content .stat-card p,
html[data-theme="dark"] .main-content .table-header h2,
html[data-theme="dark"] .main-content .empty-message,
html[data-theme="dark"] .main-content .form-text,
html[data-theme="dark"] .page-content-root h1,
html[data-theme="dark"] .page-content-root h2,
html[data-theme="dark"] .page-content-root h3,
html[data-theme="dark"] .page-content-root h4,
html[data-theme="dark"] .page-content-root label,
html[data-theme="dark"] .contractors-container h1,
html[data-theme="dark"] .contractors-container h2,
html[data-theme="dark"] .contractors-container h3,
html[data-theme="dark"] .contractors-container h4,
html[data-theme="dark"] .contractors-container p,
html[data-theme="dark"] .contractors-container label,
html[data-theme="dark"] .contractors-container span:not(.badge):not(.btn):not(.status-badge) {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .main-content .text-muted,
html[data-theme="dark"] .header-info p,
html[data-theme="dark"] .text-gray-800 {
    color: var(--text-secondary) !important;
}

/* ===== Ortak yüzeyler ===== */
html[data-theme="dark"] .page-header,
html[data-theme="dark"] .toolbar-section,
html[data-theme="dark"] .project-selector,
html[data-theme="dark"] .expenses-section,
html[data-theme="dark"] .collapsible-section,
html[data-theme="dark"] .tabs-container,
html[data-theme="dark"] .page-tabs-container,
html[data-theme="dark"] .tab-navigation,
html[data-theme="dark"] .nav-tabs,
html[data-theme="dark"] .table-container,
html[data-theme="dark"] .filters,
html[data-theme="dark"] .filter-panel,
html[data-theme="dark"] .pdf-loading-content,
html[data-theme="dark"] .export-options,
html[data-theme="dark"] .contractors-container,
html[data-theme="dark"] .hakedis-container,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .settings-container,
html[data-theme="dark"] .vehicle-container,
html[data-theme="dark"] .storage-container,
html[data-theme="dark"] .yazisma-container,
html[data-theme="dark"] .teminat-container,
html[data-theme="dark"] .sarfiyat-container,
html[data-theme="dark"] .calisanlar-container,
html[data-theme="dark"] .admin-container,
html[data-theme="dark"] .projects-container,
html[data-theme="dark"] .dashboard,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .detail-card,
html[data-theme="dark"] .list-panel,
html[data-theme="dark"] .search-box,
html[data-theme="dark"] .action-bar {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: var(--shadow-sm) !important;
}

html[data-theme="dark"] .page-header h1,
html[data-theme="dark"] .page-header h2,
html[data-theme="dark"] .page-header p,
html[data-theme="dark"] .header-info h1 {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .content-section,
html[data-theme="dark"] .employees-section,
html[data-theme="dark"] .main-content-grid,
html[data-theme="dark"] .tab-pane,
html[data-theme="dark"] #defteriTabsContent .tab-pane,
html[data-theme="dark"] .tab-content {
    background: transparent !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .toolbar-section[style],
html[data-theme="dark"] .stat-card[style],
html[data-theme="dark"] div[style*="background: white"],
html[data-theme="dark"] div[style*="background:#fff"],
html[data-theme="dark"] div[style*="background: #fff"],
html[data-theme="dark"] div[style*="background: #ffffff"],
html[data-theme="dark"] section[style*="background: white"],
html[data-theme="dark"] .card[style*="background: white"] {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
}

/* ===== Sekmeler ===== */
html[data-theme="dark"] .tabs-container .tab-link,
html[data-theme="dark"] .tab-navigation .tab-btn:not(.active),
html[data-theme="dark"] .page-tabs .tab-btn:not(.active) {
    color: var(--text-secondary) !important;
    background: transparent !important;
    border-bottom-color: transparent !important;
}

html[data-theme="dark"] .tabs-container .tab-link:hover,
html[data-theme="dark"] .tab-navigation .tab-btn:not(.active):hover {
    background: var(--hover-bg) !important;
    color: var(--primary-color) !important;
}

html[data-theme="dark"] .tabs-container .tab-link.active {
    color: var(--primary-color) !important;
    border-bottom-color: var(--primary-color) !important;
    background: linear-gradient(to bottom, rgba(255, 123, 92, 0.12) 0%, var(--surface-color) 100%) !important;
}

html[data-theme="dark"] .nav-tabs a,
html[data-theme="dark"] .nav-tabs .nav-link {
    color: var(--text-secondary) !important;
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .nav-tabs a:hover,
html[data-theme="dark"] .nav-tabs a.active,
html[data-theme="dark"] .nav-tabs .nav-link:hover,
html[data-theme="dark"] .nav-tabs .nav-link.active {
    color: var(--primary-color) !important;
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .nav-tabs .nav-link.completed {
    background: rgba(78, 204, 163, 0.15) !important;
    color: #4ecca3 !important;
    border-color: rgba(78, 204, 163, 0.35) !important;
}

html[data-theme="dark"] .nav-tabs .nav-link.disabled {
    color: var(--text-muted) !important;
    background: var(--bg-secondary) !important;
    opacity: 0.55;
}

/* ===== Kartlar ve özet alanları ===== */
html[data-theme="dark"] .summary-card:not(#contractorDetailModal .summary-card),
html[data-theme="dark"] .expense-card,
html[data-theme="dark"] .meal-card,
html[data-theme="dark"] .meal-type-card,
html[data-theme="dark"] .meal-record-item,
html[data-theme="dark"] .loading-card,
html[data-theme="dark"] .record-card,
html[data-theme="dark"] .defter-item,
html[data-theme="dark"] .filter-section,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .stats-card,
html[data-theme="dark"] .request-card,
html[data-theme="dark"] .section-card,
html[data-theme="dark"] .wizard-card,
html[data-theme="dark"] .imalat-item,
html[data-theme="dark"] .card.border-primary,
html[data-theme="dark"] .info-card,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .program-card,
html[data-theme="dark"] .hakedis-card,
html[data-theme="dark"] .teminat-card,
html[data-theme="dark"] .yazisma-card {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .summary-card h3,
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .project-selector h3,
html[data-theme="dark"] .empty-state h3,
html[data-theme="dark"] .expense-description,
html[data-theme="dark"] .meal-company,
html[data-theme="dark"] .meal-date,
html[data-theme="dark"] .stats-card h3,
html[data-theme="dark"] .stats-card h4,
html[data-theme="dark"] .stats-card p {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .expense-subcategory,
html[data-theme="dark"] .expense-vendor,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .meal-people {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .expense-card-body,
html[data-theme="dark"] .meal-card-body,
html[data-theme="dark"] .meal-card-footer,
html[data-theme="dark"] .expense-card-footer,
html[data-theme="dark"] .record-body,
html[data-theme="dark"] .defter-body,
html[data-theme="dark"] .collapsible-content,
html[data-theme="dark"] .request-body,
html[data-theme="dark"] .request-header {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .collapsible-header,
html[data-theme="dark"] .collapsible-header *,
html[data-theme="dark"] .collapsible-title,
html[data-theme="dark"] .collapsible-title i,
html[data-theme="dark"] .collapsible-icon {
    color: #fff !important;
}

html[data-theme="dark"] .expense-category {
    background: rgba(59, 130, 246, 0.18) !important;
    color: #93c5fd !important;
}

html[data-theme="dark"] .expense-payment,
html[data-theme="dark"] .meal-stats,
html[data-theme="dark"] .category-badge {
    background: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .meal-type.company {
    background: rgba(59, 130, 246, 0.18) !important;
    color: #93c5fd !important;
}

html[data-theme="dark"] .meal-type.restaurant {
    background: rgba(245, 158, 11, 0.18) !important;
    color: #fcd34d !important;
}

html[data-theme="dark"] .meal-type-card {
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .meal-type-card.selected {
    border-color: var(--primary-color) !important;
    background: rgba(255, 123, 92, 0.1) !important;
}

/* ===== Tablolar ===== */
html[data-theme="dark"] .table,
html[data-theme="dark"] .data-table,
html[data-theme="dark"] .puantaj-table,
html[data-theme="dark"] .expenses-table,
html[data-theme="dark"] .table tbody tr,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .data-table td,
html[data-theme="dark"] .data-table th {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .table th,
html[data-theme="dark"] .data-table thead th,
html[data-theme="dark"] .puantaj-header {
    background: var(--table-header-bg) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .table tbody tr:hover,
html[data-theme="dark"] .data-table tbody tr:hover {
    background: var(--table-hover-bg) !important;
}

html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) td {
    background: var(--bg-secondary) !important;
}

html[data-theme="dark"] .puantaj-cell {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* ===== Formlar ===== */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-group input,
html[data-theme="dark"] .form-group select,
html[data-theme="dark"] .form-group textarea,
html[data-theme="dark"] .pdf-email-input,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background: var(--input-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .photo-drop-zone {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] .photo-drop-zone:hover {
    background: rgba(59, 130, 246, 0.12) !important;
    border-color: #60a5fa !important;
}

/* ===== Bootstrap modallar ===== */
html[data-theme="dark"] .modal-content {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .modal-header {
    background: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .modal-body,
html[data-theme="dark"] .modal-footer {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .btn-close {
    filter: invert(1);
}

html[data-theme="dark"] .dropdown-menu {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .dropdown-item {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .dropdown-item:hover {
    background: var(--bg-secondary) !important;
}

/* ===== Özel modallar (Bootstrap dışı) ===== */
html[data-theme="dark"] .modal .modal-content:not(.modal-dialog .modal-content),
html[data-theme="dark"] .worklog-modal-content,
html[data-theme="dark"] #contractorDetailModal .modal-content,
html[data-theme="dark"] .receipt-warning-content,
html[data-theme="dark"] .stats-modal-content,
html[data-theme="dark"] .filter-modal-content,
html[data-theme="dark"] .delete-modal .modal-content,
html[data-theme="dark"] .custom-modal-content {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .worklog-modal-content .modal-body,
html[data-theme="dark"] #contractorDetailModal .tab-content {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] #contractorDetailModal .contractor-info-section {
    background: var(--bg-secondary) !important;
    border-left-color: var(--primary-color) !important;
}

html[data-theme="dark"] #contractorDetailModal .info-label {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] #contractorDetailModal .info-value {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] #contractorDetailModal .tab-navigation {
    background: var(--bg-secondary) !important;
}

html[data-theme="dark"] #contractorDetailModal .tab-btn:not(.active) {
    color: var(--text-secondary) !important;
}

html[data-theme="dark"] #contractorDetailModal .data-table-wrapper,
html[data-theme="dark"] #contractorDetailModal .worklog-table-wrapper,
html[data-theme="dark"] #contractorDetailModal .deduction-table-wrapper {
    background: var(--surface-color) !important;
}

html[data-theme="dark"] .modal-content h2 + .export-options,
html[data-theme="dark"] .modal-content .export-options {
    background: var(--surface-color) !important;
}

html[data-theme="dark"] .pdf-status-text {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .pdf-progress-bar {
    background: var(--bg-secondary) !important;
}

html[data-theme="dark"] .pdf-email-section {
    border-top-color: var(--border-color) !important;
}

html[data-theme="dark"] #toggleSummaryBtn {
    background: var(--surface-color) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* ===== Şantiye defteri detay ===== */
html[data-theme="dark"] .detay-header,
html[data-theme="dark"] .detay-header-top {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .detay-title,
html[data-theme="dark"] .detay-title .tarih {
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .meta-item {
    background: var(--bg-secondary) !important;
}

html[data-theme="dark"] .header-section {
    box-shadow: var(--shadow-md) !important;
}

/* ===== Hakediş / taşeron özel ===== */
html[data-theme="dark"] .contractor-row,
html[data-theme="dark"] .hakedis-row,
html[data-theme="dark"] .program-item,
html[data-theme="dark"] .deduction-controls,
html[data-theme="dark"] .worklog-item {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

html[data-theme="dark"] .list-group-item {
    background: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* ===== Light mode yüzey tutarlılığı ===== */
html[data-theme="light"] .page-header,
html[data-theme="light"] .tabs-container,
html[data-theme="light"] .toolbar-section,
html[data-theme="light"] .tab-navigation,
html[data-theme="light"] .expenses-section,
html[data-theme="light"] .filter-section {
    border: 1px solid var(--border-light, #e9ecef);
}

html[data-theme="light"] .main-content,
html[data-theme="light"] .page-content-root {
    color: var(--dark-color, #2d3436);
}

/* ===== Mobil ===== */
@media (max-width: 768px) {
    html[data-theme="dark"] .tabs-container .tab-link,
    html[data-theme="dark"] .tab-navigation .tab-btn {
        min-height: 44px;
    }

    html[data-theme="dark"] .toolbar-section .btn,
    html[data-theme="dark"] .header-actions .btn,
    html[data-theme="dark"] .page-header .btn {
        min-height: 40px;
    }

    html[data-theme="dark"] #contractorDetailModal .modal-content,
    html[data-theme="dark"] .worklog-modal-content {
        max-height: 95vh !important;
        border-radius: 12px !important;
    }
}

@media (max-width: 480px) {
    html[data-theme="dark"] .summary-card,
    html[data-theme="dark"] .expense-card,
    html[data-theme="dark"] .meal-card,
    html[data-theme="dark"] .stat-card {
        border-radius: 10px;
    }

    html[data-theme="dark"] .tabs-container .tab-link {
        font-size: 13px;
        min-height: 40px;
    }

    html[data-theme="dark"] .page-header h1 {
        font-size: 15px;
    }
}
