/* Dark Theme Styles */
[data-theme="dark"] {
    --bg-primary: #1a1a2e;
    --bg-secondary: #16213e;
    --bg-card: #0f3460;
    --text-primary: #eaeaea;
    --text-secondary: #a0a0a0;
    --border-color: #2d4059;
    --shadow: rgba(0, 0, 0, 0.5);
}

/* Dark Theme - Body */
[data-theme="dark"] body {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    color: var(--text-primary);
}

/* Dark Theme - Modern Container */
[data-theme="dark"] .modern-container {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
}

/* Dark Theme - Modern Card */
[data-theme="dark"] .modern-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 20px var(--shadow);
}

[data-theme="dark"] .modern-card:hover {
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.7);
}

/* Dark Theme - Page Header */
[data-theme="dark"] .page-header {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%);
}

/* Dark Theme - Tables */
[data-theme="dark"] .modern-table {
    color: var(--text-primary);
}

[data-theme="dark"] .modern-table thead {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%);
}

[data-theme="dark"] .modern-table tbody tr {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .modern-table tbody tr:nth-child(even) {
    background: rgba(15, 52, 96, 0.7);
}

[data-theme="dark"] .modern-table tbody tr:hover {
    background: rgba(106, 27, 154, 0.2);
}

/* Dark Theme - Buttons */
[data-theme="dark"] .modern-btn-secondary {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .modern-btn-secondary:hover {
    background: #2d4059;
}

/* Dark Theme - Badges */
[data-theme="dark"] .modern-badge {
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .modern-badge-success {
    background: rgba(16, 185, 129, 0.2);
    color: #6ee7b7;
    border-color: #10b981;
}

[data-theme="dark"] .modern-badge-warning {
    background: rgba(245, 158, 11, 0.2);
    color: #fbbf24;
    border-color: #f59e0b;
}

[data-theme="dark"] .modern-badge-danger {
    background: rgba(239, 68, 68, 0.2);
    color: #fca5a5;
    border-color: #ef4444;
}

[data-theme="dark"] .modern-badge-info {
    background: rgba(59, 130, 246, 0.2);
    color: #93c5fd;
    border-color: #3b82f6;
}

[data-theme="dark"] .modern-badge-primary {
    background: rgba(147, 51, 234, 0.2);
    color: #c084fc;
    border-color: #9333ea;
}

[data-theme="dark"] .modern-badge-secondary {
    background: rgba(107, 114, 128, 0.2);
    color: #d1d5db;
    border-color: #6b7280;
}

/* Dark Theme - Empty State */
[data-theme="dark"] .modern-empty-state {
    color: var(--text-secondary);
}

[data-theme="dark"] .modern-empty-state i {
    color: var(--text-secondary);
}

/* Dark Theme - Forms */
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    background: var(--bg-card);
    border-color: #6a1b9a;
    color: var(--text-primary);
}

/* Dark Theme - Filter Section */
[data-theme="dark"] .filter-section {
    background: linear-gradient(135deg, #0f3460 0%, #16213e 100%) !important;
}

[data-theme="dark"] .filter-section h3 {
    color: #bb86fc !important;
}

[data-theme="dark"] .filter-section label {
    color: var(--text-primary) !important;
}

/* Dark Theme - Navbar */
[data-theme="dark"] .navbar {
    background: linear-gradient(135deg, #0f3460 0%, #16213e 100%) !important;
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .navbar-brand,
[data-theme="dark"] .navbar a {
    color: var(--text-primary) !important;
}

/* Dark Theme - Dropdown */
[data-theme="dark"] .dropdown-menu {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .dropdown-item {
    color: var(--text-primary);
}

[data-theme="dark"] .dropdown-item:hover {
    background: rgba(106, 27, 154, 0.2);
}

/* Dark Theme - Pagination */
[data-theme="dark"] .page-number {
    background: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border-color);
}

[data-theme="dark"] .page-number:hover:not(.active) {
    background: var(--bg-secondary);
    border-color: #6a1b9a;
}

/* Dark Theme - Modal */
[data-theme="dark"] .modal-content {
    background: var(--bg-card);
    color: var(--text-primary);
}

[data-theme="dark"] .modal-header {
    border-bottom-color: var(--border-color);
}

[data-theme="dark"] .modal-footer {
    border-top-color: var(--border-color);
}

/* Dark Theme - Text Colors */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: var(--text-primary);
}

[data-theme="dark"] p {
    color: var(--text-secondary);
}

/* Dark Theme Toggle Button */
.theme-toggle {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, #9333ea 0%, #a855f7 100%);
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    box-shadow: 0 4px 20px rgba(147, 51, 234, 0.4);
    transition: all 0.3s ease;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.theme-toggle:hover {
    transform: scale(1.1) rotate(180deg);
    box-shadow: 0 6px 30px rgba(147, 51, 234, 0.6);
}

[data-theme="dark"] .theme-toggle {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    box-shadow: 0 4px 20px rgba(251, 191, 36, 0.4);
}

[data-theme="dark"] .theme-toggle:hover {
    box-shadow: 0 6px 30px rgba(251, 191, 36, 0.6);
}

/* Dark Theme - Alerts */
[data-theme="dark"] .alert {
    border-color: var(--border-color);
}

[data-theme="dark"] .alert-success {
    background: rgba(16, 185, 129, 0.15);
    color: #6ee7b7;
    border-color: #10b981;
}

[data-theme="dark"] .alert-warning {
    background: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
    border-color: #f59e0b;
}

[data-theme="dark"] .alert-danger {
    background: rgba(239, 68, 68, 0.15);
    color: #fca5a5;
    border-color: #ef4444;
}

[data-theme="dark"] .alert-info {
    background: rgba(59, 130, 246, 0.15);
    color: #93c5fd;
    border-color: #3b82f6;
}

/* Dark Theme - Links */
[data-theme="dark"] a {
    color: #c084fc;
}

[data-theme="dark"] a:hover {
    color: #a855f7;
}

/* Dark Theme - Text Muted */
[data-theme="dark"] .text-muted {
    color: var(--text-secondary) !important;
}

/* Dark Theme - Borders */
[data-theme="dark"] .border,
[data-theme="dark"] hr {
    border-color: var(--border-color) !important;
}

/* Dark Theme - Navigation Cards (Grid Items) */
[data-theme="dark"] .modern-grid a.modern-card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .modern-grid a.modern-card:hover {
    background: rgba(15, 52, 96, 0.8);
    border-color: #6a1b9a;
}

/* Dark Theme - Stat Card Icons */
[data-theme="dark"] .modern-stat-card-icon {
    opacity: 0.9;
}

/* Dark Theme - Subtitles */
[data-theme="dark"] .subtitle {
    color: var(--text-secondary) !important;
}

/* Dark Theme - Table Cells */
[data-theme="dark"] .modern-table td,
[data-theme="dark"] .modern-table th {
    border-color: var(--border-color);
}

/* Dark Theme - Pagination Disabled */
[data-theme="dark"] .page-number.disabled {
    color: #4b5563 !important;
}

[data-theme="dark"] .pagination-btn.disabled {
    background: #374151;
    color: #6b7280;
}

/* Dark Theme - Form Labels */
[data-theme="dark"] .form-label,
[data-theme="dark"] label {
    color: var(--text-primary);
}

/* Dark Theme - Grid Container & Cards */
[data-theme="dark"] .grid-container {
    background: transparent;
}

[data-theme="dark"] .grid-item {
    background: linear-gradient(
        135deg,
        rgba(15, 52, 96, 0.8),
        rgba(22, 33, 62, 0.8)
    ) !important;
    border: 1px solid var(--border-color);
    color: var(--text-primary) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .grid-item::before {
    background: linear-gradient(
        90deg,
        #9333ea,
        #a855f7,
        #c084fc
    );
}

[data-theme="dark"] .grid-item::after {
    background: radial-gradient(
        circle at 50% 0%,
        rgba(147, 51, 234, 0.15),
        transparent 70%
    );
}

[data-theme="dark"] .grid-item:hover {
    background: linear-gradient(
        135deg,
        rgba(74, 20, 140, 0.4),
        rgba(106, 27, 154, 0.4)
    ) !important;
    border-color: #a855f7;
    box-shadow: 0 8px 32px rgba(147, 51, 234, 0.4);
}

[data-theme="dark"] .grid-item i {
    color: #c084fc !important;
    filter: drop-shadow(0 0 15px rgba(192, 132, 252, 0.4));
}

[data-theme="dark"] .grid-item:hover i {
    color: #e9d5ff !important;
    filter: drop-shadow(0 0 25px rgba(192, 132, 252, 0.6));
}

[data-theme="dark"] .grid-item h3 {
    color: var(--text-primary) !important;
}

/* Dark Theme - Livewire Invoices Component */
[data-theme="dark"] .invoice-card {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .invoice-header {
    background: rgba(106, 27, 154, 0.2) !important;
    border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] .invoice-detail {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .invoice-detail strong {
    color: #c084fc !important;
}

/* Dark Theme - Filter Section Labels */
[data-theme="dark"] .filter-section .form-label {
    color: var(--text-primary) !important;
}

/* Dark Theme - Custom Modals */
[data-theme="dark"] .custom-modal-content {
    background: var(--bg-card) !important;
    color: var(--text-primary);
}

[data-theme="dark"] .custom-modal-content h2,
[data-theme="dark"] .custom-modal-content h3 {
    color: var(--text-primary);
}

[data-theme="dark"] .custom-modal-content p {
    color: var(--text-secondary);
}

[data-theme="dark"] .custom-modal-content strong {
    color: #c084fc;
}

[data-theme="dark"] .custom-modal .close {
    color: var(--text-secondary);
}

[data-theme="dark"] .custom-modal .close:hover {
    color: var(--text-primary);
}

/* Dark Theme - Pagination Info Text */
[data-theme="dark"] .modern-pagination + div {
    color: var(--text-secondary) !important;
}

/* Dark Theme - Table Box */
[data-theme="dark"] .table-box {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .table-box h2 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .table-box table {
    color: var(--text-primary);
}

[data-theme="dark"] .table-box table thead {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%);
    color: white;
}

[data-theme="dark"] .table-box table thead th {
    color: white !important;
    border-color: var(--border-color);
}

[data-theme="dark"] .table-box table tbody tr {
    background: rgba(15, 52, 96, 0.3);
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .table-box table tbody tr:nth-child(even) {
    background: rgba(15, 52, 96, 0.5);
}

[data-theme="dark"] .table-box table tbody tr:hover {
    background: rgba(106, 27, 154, 0.2);
}

[data-theme="dark"] .table-box table tbody td {
    color: var(--text-primary);
    border-color: var(--border-color);
}

/* Dark Theme - Table Box with colored backgrounds */
[data-theme="dark"] .table-box.orange-bg {
    background: linear-gradient(135deg, rgba(234, 88, 12, 0.15), rgba(194, 65, 12, 0.15));
    border: 1px solid rgba(234, 88, 12, 0.3);
}

[data-theme="dark"] .table-box.orange-bg h2 {
    color: #fb923c !important;
}

[data-theme="dark"] .table-box.red-bg {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.15), rgba(185, 28, 28, 0.15));
    border: 1px solid rgba(220, 38, 38, 0.3);
}

[data-theme="dark"] .table-box.red-bg h2 {
    color: #fca5a5 !important;
}

/* Dark Theme - Late items highlight */
[data-theme="dark"] .table-box table tbody tr[style*="background-color: #f8d7da"] {
    background: rgba(220, 38, 38, 0.3) !important;
    color: #fca5a5 !important;
}

[data-theme="dark"] .table-box table tbody tr[style*="background-color: #f8d7da"] td {
    color: #fca5a5 !important;
}

/* Dark Theme - Balance Display in Navbar */
[data-theme="dark"] .balance-item {
    background: rgba(15, 52, 96, 0.5);
    border-color: var(--border-color);
}

[data-theme="dark"] .balance-label {
    color: var(--text-secondary);
}

[data-theme="dark"] .balance-value {
    color: var(--text-primary);
}

/* Dark Theme - User Profile */
[data-theme="dark"] .user-profile {
    color: var(--text-primary);
}

/* Dark Theme - Logo */
[data-theme="dark"] .logo {
    color: var(--text-primary) !important;
}

/* Dark Theme - Strong/Bold Text */
[data-theme="dark"] strong {
    color: #c084fc;
}

/* Dark Theme - Table Hover Effect Enhancement */
[data-theme="dark"] .modern-table tbody tr:hover td {
    color: var(--text-primary);
}

/* Dark Theme - Modern Actions */
[data-theme="dark"] .modern-actions {
    background: transparent;
}

/* Dark Theme - Welcome Page */
[data-theme="dark"] .welcome-page {
    background: transparent;
}

[data-theme="dark"] .quick-access-section {
    background: transparent;
}

[data-theme="dark"] .tables-wrapper {
    background: transparent;
}

/* Dark Theme - Admin Section */
[data-theme="dark"] .admin-section {
    background: transparent;
}

[data-theme="dark"] .bottom-bar {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
}

[data-theme="dark"] .register-button {
    background: linear-gradient(135deg, #9333ea 0%, #a855f7 100%);
    color: white;
    border: none;
}

[data-theme="dark"] .register-button:hover {
    background: linear-gradient(135deg, #7c3aed 0%, #9333ea 100%);
    box-shadow: 0 4px 20px rgba(147, 51, 234, 0.5);
}

/* Dark Theme - Text Colors in Tables */
[data-theme="dark"] .text-center {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .text-gray-500 {
    color: var(--text-secondary) !important;
}

/* Dark Theme - Table Scroll */
[data-theme="dark"] .table-scroll {
    background: transparent;
}

[data-theme="dark"] .table-scroll::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] .table-scroll::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: 4px;
}

[data-theme="dark"] .table-scroll::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 4px;
}

[data-theme="dark"] .table-scroll::-webkit-scrollbar-thumb:hover {
    background: #6a1b9a;
}

/* Dark Theme - Payment Items */
[data-theme="dark"] .payment-item {
    background: rgba(15, 52, 96, 0.5) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color);
}

/* Dark Theme - Invoice Cards in Livewire */
[data-theme="dark"] .invoice-card {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
}

/* Dark Theme - Payment History */
[data-theme="dark"] .payment-history {
    background: transparent !important;
}

[data-theme="dark"] .payment-history h4 {
    color: var(--text-secondary) !important;
}

/* Dark Theme - All Table Elements */
[data-theme="dark"] table {
    background: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] table thead {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%) !important;
}

[data-theme="dark"] table thead th {
    background: transparent !important;
    color: white !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] table tbody {
    background: transparent !important;
}

[data-theme="dark"] table tbody tr {
    background: rgba(15, 52, 96, 0.3) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] table tbody tr:nth-child(even) {
    background: rgba(15, 52, 96, 0.5) !important;
}

[data-theme="dark"] table tbody tr:hover {
    background: rgba(106, 27, 154, 0.3) !important;
}

[data-theme="dark"] table tbody td {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Dark Theme - Bootstrap Table Classes */
[data-theme="dark"] .table {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .table-bordered {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-bordered td,
[data-theme="dark"] .table-bordered th {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background: rgba(15, 52, 96, 0.3) !important;
}

[data-theme="dark"] .table-striped tbody tr:nth-of-type(even) {
    background: rgba(15, 52, 96, 0.5) !important;
}

[data-theme="dark"] .table-hover tbody tr:hover {
    background: rgba(106, 27, 154, 0.3) !important;
}

/* Dark Theme - Late Items Override */
[data-theme="dark"] tr[style*="background-color: #f8d7da"],
[data-theme="dark"] tr[style*="background-color:#f8d7da"] {
    background: rgba(220, 38, 38, 0.3) !important;
    color: #fca5a5 !important;
}

[data-theme="dark"] tr[style*="background-color: #f8d7da"] td,
[data-theme="dark"] tr[style*="background-color:#f8d7da"] td {
    background: transparent !important;
    color: #fca5a5 !important;
}

/* Dark Theme - Container Backgrounds */
[data-theme="dark"] .container {
    background: transparent !important;
}

[data-theme="dark"] .card {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card-header {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%) !important;
    border-color: var(--border-color) !important;
    color: white !important;
}

[data-theme="dark"] .card-body {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card-footer {
    background: rgba(15, 52, 96, 0.5) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* Dark Theme - List Groups */
[data-theme="dark"] .list-group-item {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .list-group-item:hover {
    background: rgba(106, 27, 154, 0.2) !important;
}

/* Dark Theme - Divs with bg-white or similar */
[data-theme="dark"] .bg-white {
    background: var(--bg-card) !important;
}

[data-theme="dark"] .bg-light {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background-color:white"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background: #ffffff"],
[data-theme="dark"] [style*="background:#ffffff"],
[data-theme="dark"] [style*="background-color: #ffffff"],
[data-theme="dark"] [style*="background-color:#ffffff"] {
    background: var(--bg-card) !important;
}

/* Dark Theme - Info boxes with light backgrounds */
[data-theme="dark"] [style*="background: #f7fafc"],
[data-theme="dark"] [style*="background:#f7fafc"],
[data-theme="dark"] [style*="background-color: #f7fafc"],
[data-theme="dark"] [style*="background-color:#f7fafc"] {
    background: rgba(15, 52, 96, 0.5) !important;
}

/* Dark Theme - Modal Content */
[data-theme="dark"] .modal-content {
    background: var(--bg-card) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .modal-header {
    background: linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%) !important;
    border-color: var(--border-color) !important;
    color: white !important;
}

[data-theme="dark"] .modal-body {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .modal-footer {
    background: rgba(15, 52, 96, 0.5) !important;
    border-color: var(--border-color) !important;
}

/* Dark Theme - Livewire Modal Overlay */
[data-theme="dark"] .modal-overlay .modal-content {
    background: var(--bg-card) !important;
}

/* Smooth transitions */
body,
.modern-container,
.modern-card,
.modern-table,
.form-control,
.navbar,
.modern-badge,
.page-number,
.pagination-btn,
.grid-item,
.table-box,
table,
.card,
.modal-content {
    transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}