/* ========================================
   THEME STYLES (Light Mode & Admin Mode)
   ======================================== */

/* Admin Mode - Yellow/Gold Theme */
[data-admin="true"] {
	--accent-admin: #fbbf24;
}

[data-admin="true"] .navbar {
	background: linear-gradient(135deg, #1a1a0a 0%, #2a2a1a 100%);
	border-bottom: 2px solid var(--accent-admin);
	box-shadow: 0 2px 12px rgba(251, 191, 36, 0.2);
}

[data-admin="true"] .users-panel {
	border: 2px solid var(--accent-admin);
	box-shadow: 0 4px 16px rgba(251, 191, 36, 0.15);
}

[data-admin="true"] .panel-title i {
	color: var(--accent-admin);
}

/* Show a red accent around the filters dropdown when admin mode is active */
[data-admin="true"] .filter-panel {
	border: 2px solid var(--accent-danger);
	box-shadow: 0 4px 16px rgba(255, 71, 87, 0.15);
}

/* Also show red border for filter panel for all users */
.filter-panel {
	border: 2px solid var(--accent-danger);
	box-shadow: 0 4px 16px rgba(255, 71, 87, 0.08);
}

[data-admin="true"][data-theme="light"] .navbar {
	background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
	border-bottom: 2px solid #f59e0b;
}

/* ========================================
   LIGHT MODE
   ======================================== */

[data-theme="light"] {
	--bg-primary: #f0f2f5;
	--bg-secondary: #ffffff;
	--bg-card: #ffffff;
	--bg-elevated: #f8f9fa;

	--text-primary: #1a1a1a;
	--text-secondary: #4a4a4a;
	--text-muted: #6b7280;

	--border-color: #d1d5db;
	--border-light: #e5e7eb;

	/* Darker accents for light mode readability */
	--accent-primary: #059669;
	--accent-secondary: #0284c7;
	--accent-warning: #d97706;
	--accent-danger: #dc2626;
	--accent-info: #6d28d9;
}

/* Light mode specific overrides */
[data-theme="light"] .modal-backdrop {
	background: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .form-control:focus {
	box-shadow: 0 0 0 3px rgba(0, 204, 106, 0.2) !important;
}

[data-theme="light"] .modal-content,
[data-theme="light"] .custom-modal {
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .block-card {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .block-card:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .users-panel {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .navbar {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* Light mode role badge overrides for readability */
[data-theme="light"] .role-badge-full {
	background: rgba(5, 150, 105, 0.15) !important;
	color: #047857 !important;
	border-color: rgba(5, 150, 105, 0.4) !important;
}

[data-theme="light"] .role-badge-partial {
	background: rgba(217, 119, 6, 0.15) !important;
	color: #b45309 !important;
	border-color: rgba(217, 119, 6, 0.4) !important;
}

[data-theme="light"] .role-badge-user {
	background: rgba(5, 150, 105, 0.2) !important;
	color: #047857 !important;
	border-color: rgba(5, 150, 105, 0.5) !important;
}

[data-theme="light"] .user-role-badge {
	background: rgba(5, 150, 105, 0.1);
	border-color: var(--accent-primary);
	color: var(--accent-primary);
}

[data-theme="light"] .user-role-badge strong {
	color: var(--accent-primary);
}

[data-theme="light"] .filter-toggle.active {
	background: rgba(5, 150, 105, 0.15);
	border-color: var(--accent-primary);
	color: var(--accent-primary);
}

[data-theme="light"] .filter-toggle-green.active {
	background: rgba(5, 150, 105, 0.15);
	border-color: #059669;
	color: #059669;
}

[data-theme="light"] .filter-toggle-cyan.active {
	background: rgba(2, 132, 199, 0.15);
	border-color: #0284c7;
	color: #0284c7;
}

[data-theme="light"] .filter-role-tag.active {
	background: rgba(2, 132, 199, 0.1);
	border-color: var(--accent-secondary);
	color: var(--accent-secondary);
}

[data-theme="light"] .day-header {
	box-shadow: 0 4px 12px rgba(2, 132, 199, 0.15);
}

[data-theme="light"] .day-header:hover {
	box-shadow: 0 6px 20px rgba(5, 150, 105, 0.2);
}

/* Light mode venue role badges */
[data-theme="light"] .role-badge-venue,
[data-theme="light"] .role-badge-venue-partial {
	background: rgba(168, 85, 247, 0.15) !important;
	color: #9333ea !important;
	border-color: rgba(168, 85, 247, 0.4) !important;
}

[data-theme="light"] .role-badge-venue-empty {
	background: rgba(139, 92, 246, 0.1) !important;
	color: #7c3aed !important;
	border-color: rgba(139, 92, 246, 0.3) !important;
}

[data-theme="light"] .role-badge-venue-full {
	background: rgba(147, 51, 234, 0.2) !important;
	color: #7e22ce !important;
	border-color: rgba(147, 51, 234, 0.5) !important;
	font-weight: 600;
}

[data-theme="light"] .badge-venue {
	background: rgba(168, 85, 247, 0.15) !important;
	color: #9333ea !important;
}

[data-theme="light"] .venue-user-name {
	color: #9333ea;
}

[data-theme="light"] .moderator-user-name {
	color: #d97706;
}

[data-theme="light"] .admin-date {
	color-scheme: light;
}

[data-theme="light"] .admin-date::-webkit-calendar-picker-indicator {
	filter: none;
	opacity: 1;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000000'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v13c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 15H5V10h14v9zm0-11H5V6h14v2z'/%3E%3C/svg%3E")
		center/1rem 1rem no-repeat;
	color: transparent;
}

/* Light mode stats */
[data-theme="light"] .stat-item.stat-summary {
	background: rgba(16, 185, 129, 0.1);
	border-color: rgba(16, 185, 129, 0.3);
}

[data-theme="light"] .stat-item.stat-open {
	background: rgba(245, 158, 11, 0.1);
	border-color: rgba(245, 158, 11, 0.3);
}

[data-theme="light"] .stat-item.stat-summary-incomplete {
	background: rgba(220, 38, 38, 0.1);
	border-color: rgba(220, 38, 38, 0.3);
}

[data-theme="light"] .stat-item.stat-summary-incomplete i,
[data-theme="light"] .stat-item.stat-summary-incomplete .stat-value {
	color: #dc2626;
}

[data-theme="light"] .stat-item.stat-user-assigned {
	background: rgba(109, 40, 217, 0.1);
	border-color: rgba(109, 40, 217, 0.3);
}

[data-theme="light"] .stat-item.stat-user-assigned i,
[data-theme="light"] .stat-item.stat-user-assigned .stat-value {
	color: #6d28d9;
}

[data-theme="light"] .stat-available-btn {
	background: rgba(16, 185, 129, 0.1);
	border-color: rgba(16, 185, 129, 0.4);
	color: #059669;
}

[data-theme="light"] .stat-available-btn i,
[data-theme="light"] .stat-available-btn .stat-value,
[data-theme="light"] .stat-available-btn .stat-label {
	color: #059669;
}

[data-theme="light"] .stat-available-btn:hover {
	background: rgba(16, 185, 129, 0.2);
	box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

[data-theme="light"] .stat-available-btn.pulse {
	animation: none;
	background: linear-gradient(
		135deg,
		rgba(16, 185, 129, 0.3),
		rgba(2, 132, 199, 0.2)
	);
	border: 2px solid rgba(16, 185, 129, 1);
	box-shadow: 0 0 15px rgba(16, 185, 129, 0.5);
}

[data-theme="light"] .stat-available-btn.pulse::before,
[data-theme="light"] .stat-available-btn.pulse::after {
	background: rgba(16, 185, 129, 1);
	box-shadow: 0 0 6px rgba(16, 185, 129, 0.8);
}

@keyframes pulse-green-light {
	0% {
		box-shadow:
			0 0 0 0 rgba(16, 185, 129, 0.8),
			0 0 20px rgba(16, 185, 129, 0.4);
	}
	50% {
		box-shadow:
			0 0 0 12px rgba(16, 185, 129, 0),
			0 0 35px rgba(16, 185, 129, 0.6);
	}
	100% {
		box-shadow:
			0 0 0 0 rgba(16, 185, 129, 0),
			0 0 20px rgba(16, 185, 129, 0.4);
	}
}

@keyframes pulse-glow-light {
	0%,
	100% {
		filter: brightness(1) drop-shadow(0 0 3px rgba(16, 185, 129, 0.5));
	}
	50% {
		filter: brightness(1.2) drop-shadow(0 0 8px rgba(16, 185, 129, 0.8));
	}
}

/* Fade overlay used when switching themes: covers page, then theme switches while covered */
.theme-fade-overlay {
	position: fixed;
	inset: 0;
	background: var(--bg-primary, #fff);
	opacity: 0;
	transition:
		opacity 420ms ease,
		background-color 420ms ease !important;
	z-index: 9999;
	pointer-events: none;
	will-change: opacity, background;
}

.theme-fade-overlay.show {
	opacity: 1;
	pointer-events: auto;
}

/* When switching theme, temporarily disable page transitions so styles jump instantly
   while the overlay covers the page. Keep overlay transitions enabled. */
[data-theme-changing="true"] *:not(.theme-fade-overlay) {
	transition: none !important;
}