/* Unified SimplyQuiz Theme System */
/* This file consolidates all theme-related styles and works with DaisyUI */

:root {
  /* Brand Colors */
  --brand-primary: #000000;
  --brand-accent: #EFBD3F;
  --brand-white: #FFFFFF;
  
  /* Light Theme Colors */
  --light-bg-primary: #FFFFFF;
  --light-bg-secondary: #F9FAFB;
  --light-text-primary: #000000;
  --light-text-secondary: #4B5563;
  --light-border: #E5E7EB;
  
  /* Dark Theme Colors */
  --dark-bg-primary: #0B0B0B;
  --dark-bg-secondary: #151515;
  --dark-text-primary: #FFFFFF;
  --dark-text-secondary: #9CA3AF;
  --dark-border: #374151;
}

/* Light Theme */
[data-theme="light"] {
  --bg-primary: var(--light-bg-primary);
  --bg-secondary: var(--light-bg-secondary);
  --text-primary: var(--light-text-primary);
  --text-secondary: var(--light-text-secondary);
  --border-color: var(--light-border);
  --accent: var(--brand-accent);
}

/* Dark Theme */
[data-theme="dark"] {
  --bg-primary: var(--dark-bg-primary);
  --bg-secondary: var(--dark-bg-secondary);
  --text-primary: var(--dark-text-primary);
  --text-secondary: var(--dark-text-secondary);
  --border-color: var(--dark-border);
  --accent: var(--brand-accent);
}

/* DaisyUI Theme Overrides */
[data-theme="light"] {
  --p: 0 0% 0%; /* Primary - Black */
  --pf: 0 0% 0%; /* Primary focus */
  --s: 49 100% 62%; /* Secondary - Logo color */
  --a: 49 100% 62%; /* Accent - Logo color */
  --n: 0 0% 95%; /* Neutral */
  --b1: 0 0% 100%; /* Base-100 - White */
  --b2: 0 0% 98%; /* Base-200 */
  --b3: 0 0% 96%; /* Base-300 */
  --bc: 0 0% 0%; /* Base content - Black */
}

[data-theme="dark"] {
  --p: 0 0% 100%; /* Primary - White */
  --pf: 0 0% 90%; /* Primary focus */
  --s: 49 100% 62%; /* Secondary - Logo color */
  --a: 49 100% 62%; /* Accent - Logo color */
  --n: 0 0% 10%; /* Neutral */
  --b1: 0 0% 4%; /* Base-100 - #0B0B0B */
  --b2: 0 0% 8%; /* Base-200 - #151515 */
  --b3: 0 0% 12%; /* Base-300 */
  --bc: 0 0% 100%; /* Base content - White */
}

/* Bootstrap-style utilities for dark mode */
[data-bs-theme="dark"] {
  --bs-body-bg: var(--dark-bg-primary);
  --bs-body-color: var(--dark-text-primary);
  --bs-border-color: var(--dark-border);
  --bs-secondary-bg: var(--dark-bg-secondary);
  --bs-secondary-color: var(--dark-text-secondary);
}

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

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus {
  background-color: var(--dark-bg-secondary);
  color: var(--dark-text-primary);
  border-color: var(--brand-accent);
  box-shadow: 0 0 0 0.2rem rgba(239, 189, 63, 0.25);
  outline: none;
}

/* Buttons */
.btn-primary,
.btn-black {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: var(--brand-white) !important;
}

.btn-primary:hover,
.btn-black:hover {
  background-color: #333333 !important;
  border-color: #333333 !important;
}

.btn-accent {
  background-color: var(--brand-accent) !important;
  border-color: var(--brand-accent) !important;
  color: var(--brand-primary) !important;
}

.btn-accent:hover {
  background-color: #E6AD26 !important;
  border-color: #E6AD26 !important;
}

/* Dark mode button variations */
[data-theme="dark"] .btn-outline-primary {
  color: var(--dark-text-primary);
  border-color: var(--dark-text-primary);
}

[data-theme="dark"] .btn-outline-primary:hover {
  background-color: var(--dark-text-primary);
  color: var(--dark-bg-primary);
}

/* Cards */
[data-theme="dark"] .card,
[data-theme="dark"] .bg-base-100 {
  background-color: var(--dark-bg-secondary);
  border-color: var(--dark-border);
}

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

/* Navigation */
[data-theme="dark"] .navbar {
  background-color: var(--dark-bg-secondary);
  border-bottom-color: var(--dark-border);
}

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

[data-theme="dark"] .navbar-nav .nav-link:hover {
  color: var(--brand-accent);
}

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

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.03);
}

[data-theme="dark"] .table-hover tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] thead,
[data-theme="dark"] .table thead th {
  background-color: var(--dark-bg-primary);
  color: var(--dark-text-primary);
  border-color: var(--dark-border);
}

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

[data-theme="dark"] .badge-primary {
  background-color: var(--brand-accent);
  color: var(--brand-primary);
  border: none;
}

/* Alerts */
[data-theme="dark"] .alert {
  background-color: var(--dark-bg-secondary);
  color: var(--dark-text-primary);
  border-color: var(--dark-border);
}

[data-theme="dark"] .alert-info {
  background-color: rgba(96, 165, 250, 0.1);
  border-color: rgba(96, 165, 250, 0.2);
  color: #93C5FD;
}

[data-theme="dark"] .alert-success {
  background-color: rgba(74, 222, 128, 0.1);
  border-color: rgba(74, 222, 128, 0.2);
  color: #86EFAC;
}

[data-theme="dark"] .alert-warning {
  background-color: rgba(251, 191, 36, 0.1);
  border-color: rgba(251, 191, 36, 0.2);
  color: #FDE047;
}

[data-theme="dark"] .alert-danger {
  background-color: rgba(248, 113, 113, 0.1);
  border-color: rgba(248, 113, 113, 0.2);
  color: #FCA5A5;
}

/* Modals */
[data-theme="dark"] .modal-content {
  background-color: var(--dark-bg-secondary);
  color: var(--dark-text-primary);
  border-color: var(--dark-border);
}

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

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

/* Dropdowns */
[data-theme="dark"] .dropdown-menu {
  background-color: var(--dark-bg-secondary);
  border-color: var(--dark-border);
}

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

[data-theme="dark"] .dropdown-item:hover {
  background-color: rgba(255, 255, 255, 0.05);
  color: var(--brand-accent);
}

/* Breadcrumbs */
[data-theme="dark"] .breadcrumb {
  background-color: var(--dark-bg-secondary);
}

[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
  color: var(--dark-text-secondary);
}

[data-theme="dark"] .breadcrumb-item.active {
  color: var(--dark-text-secondary);
}

/* Checkboxes and Radio buttons */
[data-theme="dark"] .form-check-input {
  background-color: var(--dark-bg-secondary);
  border-color: var(--dark-border);
}

[data-theme="dark"] .form-check-input:checked {
  background-color: var(--brand-accent);
  border-color: var(--brand-accent);
}

/* Progress bars */
[data-theme="dark"] .progress {
  background-color: var(--dark-bg-secondary);
}

[data-theme="dark"] .progress-bar {
  background-color: var(--brand-accent);
}

/* Pagination */
[data-theme="dark"] .pagination .page-link {
  background-color: var(--dark-bg-secondary);
  border-color: var(--dark-border);
  color: var(--dark-text-primary);
}

[data-theme="dark"] .pagination .page-link:hover {
  background-color: var(--dark-bg-primary);
  border-color: var(--brand-accent);
  color: var(--brand-accent);
}

[data-theme="dark"] .pagination .page-item.active .page-link {
  background-color: var(--brand-accent);
  border-color: var(--brand-accent);
  color: var(--brand-primary);
}

/* Tooltips */
[data-theme="dark"] .tooltip-inner {
  background-color: var(--dark-bg-secondary);
  color: var(--dark-text-primary);
}

/* Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar {
  background-color: var(--dark-bg-primary);
}

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

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background-color: #333333;
}

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

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

/* Hr divider */
[data-theme="dark"] hr {
  border-color: var(--dark-border);
  opacity: 1;
}

/* Code blocks */
[data-theme="dark"] code {
  background-color: rgba(239, 189, 63, 0.1);
  color: var(--brand-accent);
}

[data-theme="dark"] pre {
  background-color: var(--dark-bg-secondary);
  color: var(--dark-text-primary);
  border-color: var(--dark-border);
}

/* Custom utility classes */
.bg-accent {
  background-color: var(--brand-accent) !important;
}

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

.border-accent {
  border-color: var(--brand-accent) !important;
}

/* Animations for theme transitions */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Disable transitions on page load */
.no-transitions * {
  transition: none !important;
}