/**
 * Dark Mode Theme Styles
 * Applied when html[data-theme="dark"] is set
 */

html[data-theme="dark"] {
    --og-green: #66bb6a;
    --og-dark-green: #4caf50;
    --og-text: #e0e0e0;
    --og-light-bg: #3a3f4b;
}

html[data-theme="dark"] body {
    background-color: #1a1d23;
    color: var(--og-text);
}

html[data-theme="dark"] .navbar {
    background-color: #2d2d2d !important;
    border-bottom: 1px solid #444;
}

html[data-theme="dark"] .navbar-brand {
    color: #ff8a65 !important;
}

html[data-theme="dark"] .nav-link {
    color: var(--og-text) !important;
}

html[data-theme="dark"] .nav-link:hover {
    color: var(--og-green) !important;
}

/* Make nav bars use full width and tighten link spacing to avoid truncating right-aligned controls */
.navbar .container {
    max-width: 100%;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.navbar .nav-link {
    margin: 0 0.65rem !important;
}

html[data-theme="dark"] .dropdown-menu {
    background-color: #2d2d2d;
    border-color: #444;
}

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

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
    background-color: #3a3f4b;
    color: var(--og-green);
}

html[data-theme="dark"] .hero-section {
    background-color: #1a1d23;
}

html[data-theme="dark"] .hero-section h1 {
    color: #e0e0e0;
}

html[data-theme="dark"] .hero-section p {
    color: #b0b0b0;
}

html[data-theme="dark"] .btn-join {
    background-color: #ff6b6b;
    box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3);
}

html[data-theme="dark"] .btn-join:hover {
    background-color: #ff5252;
    box-shadow: 0 6px 20px rgba(255, 107, 107, 0.4);
}

html[data-theme="dark"] .progress-tracker {
    background: linear-gradient(90deg, #2d3f5b 0%, #3a3f4b 50%, #2d3f5b 100%);
    box-shadow: 0 8px 20px rgba(0,0,0,0.6);
}

html[data-theme="dark"] .progress-header {
    color: #e0e0e0;
}

html[data-theme="dark"] .role-path::before {
    background: rgba(200,200,200,0.1);
}

html[data-theme="dark"] .role-icon {
    background: rgba(100,180,100,0.2);
}

html[data-theme="dark"] .role-step.completed .role-icon {
    background: #4caf50;
    border-color: #388e3c;
}

html[data-theme="dark"] .role-step.current .role-icon {
    background: #ffa726;
    border-color: #f57c00;
}

html[data-theme="dark"] .role-label {
    color: #090909;
}

html[data-theme="dark"] .progress-bar-container {
    background: rgba(200,200,200,0.1);
}

html[data-theme="dark"] .progress-bar-fill {
    background: linear-gradient(90deg, #66bb6a, #4caf50);
}

html[data-theme="dark"] .progress-stats {
    color: #000000;
}

html[data-theme="dark"] .next-goal {
    background: rgba(200,200,200,0.08);
    color: rgb(212, 208, 208);
    border-left-color: #66bb6a;
}

html[data-theme="dark"] .next-goal strong {
    color: #66bb6a;
}

html[data-theme="dark"] .tour-section {
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

html[data-theme="dark"] .section-title {
    color: #e0e0e0;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .video-card,
html[data-theme="dark"] .merch-card,
html[data-theme="dark"] .tournament-card,
html[data-theme="dark"] .quick-link-card {
    background-color: #242730;
    border-color: #3a3f4b;
    color: var(--og-text);
}

html[data-theme="dark"] .card-title {
    color: #e0e0e0;
}

html[data-theme="dark"] .handicap-display {
    background-color: #1a1d23 !important;
    border-color: #3a3f4b !important;
}

html[data-theme="dark"] .handicap-display .card-title {
    color: #ff6b6b !important;
}

html[data-theme="dark"] .video-placeholder {
    background: linear-gradient(135deg, #3a3f4b, #2d2d2d);
}

html[data-theme="dark"] .merch-img {
    background: #3a3f4b;
}

html[data-theme="dark"] .merch-card h5 {
    color: #e0e0e0;
}

html[data-theme="dark"] .tour-btn {
    background-color: #242730;
    color: var(--og-text);
    border-color: var(--og-green);
}

html[data-theme="dark"] .tour-btn:hover {
    background-color: var(--og-green);
    color: #1a1d23;
}

html[data-theme="dark"] .events-section {
    background-color: #242730;
}

html[data-theme="dark"] .calendar {
    background-color: #3a3f4b;
}

html[data-theme="dark"] .calendar-embed-wrapper {
    background-color: #242730;
}

html[data-theme="dark"] footer {
    background-color: #2d2d2d;
    color: #e0e0e0;
}

html[data-theme="dark"] .footer-links a {
    color: #e0e0e0;
}

html[data-theme="dark"] .footer-links a:hover {
    color: var(--og-green);
}

html[data-theme="dark"] .social-links a {
    color: #e0e0e0;
}

html[data-theme="dark"] .social-links a:hover {
    color: var(--og-green);
}

html[data-theme="dark"] .text-muted {
    color: #999 !important;
}

html[data-theme="dark"] .btn-outline-secondary {
    color: var(--og-text);
    border-color: #555;
}

html[data-theme="dark"] .btn-outline-secondary:hover {
    background-color: #3a3f4b;
    border-color: var(--og-green);
}

html[data-theme="dark"] .btn-danger {
    background-color: #931c1c;
    border-color: #ff6b6b;
}

html[data-theme="dark"] .btn-danger:hover {
    background-color: #941313;
    border-color: #ff5252;
}

html[data-theme="dark"] .btn-success {
    background-color: #315b33;
    border-color: #66bb6a;
}

html[data-theme="dark"] .btn-success:hover {
    background-color: #387f3a;
    border-color: #4caf50;
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    background-color: #242730;
    color: var(--og-text);
    border-color: #3a3f4b;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
    background-color: #2d2d2d;
    color: var(--og-text);
    border-color: var(--og-green);
    box-shadow: 0 0 0 0.2rem rgba(102, 187, 106, 0.25);
}

html[data-theme="dark"] .form-control {
    background-color: #242730;
    color: var(--og-text);
    border-color: #3a3f4b;
}

html[data-theme="dark"] .form-control:focus {
    background-color: #2d2d2d;
    color: var(--og-text);
    border-color: var(--og-green);
    box-shadow: 0 0 0 0.2rem rgba(102, 187, 106, 0.25);
}

html[data-theme="dark"] .form-label {
    color: var(--og-text);
}

html[data-theme="dark"] .alert-warning {
    background-color: #3d3d1a;
    border-color: #6b6b1a;
    color: #e0e0e0;
}

html[data-theme="dark"] .alert-danger {
    background-color: #3d1a1a;
    border-color: #6b1a1a;
    color: #e0e0e0;
}

html[data-theme="dark"] .alert-success {
    background-color: #1a3d1a;
    border-color: #1a6b1a;
    color: #e0e0e0;
}

html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .info-alert {
    background-color: #1a3d4a;
    border-color: #1a6b7d;
    color: #e0e0e0;
}

/* Tour page specific */
html[data-theme="dark"] .page-header {
    background-color: #2d2d2d;
    color: #e0e0e0;
}

html[data-theme="dark"] .stat-card {
    background-color: #242730;
    border-color: #3a3f4b;
}

html[data-theme="dark"] .leaderboard-row {
    background-color: #242730;
    border-bottom-color: #3a3f4b;
}

html[data-theme="dark"] .leaderboard-row:hover {
    background-color: #2d3a47;
}

/* Admin page specific */
html[data-theme="dark"] .admin-card {
    background-color: #242730;
}

html[data-theme="dark"] .admin-section {
    background-color: #242730;
    border-color: #3a3f4b;
}

html[data-theme="dark"] .stat-box {
    background-color: #2d2d2d;
    color: #e0e0e0;
}

/* Certified+ page specific */
html[data-theme="dark"] .certified-header {
    background: linear-gradient(135deg, #d97706, #b45309);
}

html[data-theme="dark"] .certified-blurb {
    background-color: #242730;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

html[data-theme="dark"] .certified-link {
    color: #ffa726;
    background-color: #2d2d2d;
    border-color: #ffa726;
}

html[data-theme="dark"] .certified-link:hover {
    background-color: #ffa726;
    color: #1a1d23;
}

/* Tour rank gradients for dark mode */
html[data-theme="dark"] body .tour-section[style*="9b6013"] {
    background: linear-gradient(90deg, #6b4423, #8b6f47) !important;
}

html[data-theme="dark"] body .tour-section[style*="41e216"] {
    background: linear-gradient(90deg, #4caf50, #66bb6a) !important;
}

html[data-theme="dark"] body .tour-section[style*="fed016"] {
    background: linear-gradient(90deg, #ffa726, #ffb74d) !important;
}

html[data-theme="dark"] body .tour-section[style*="b2b2b2"] {
    background: linear-gradient(90deg, #757575, #9e9e9e) !important;
}

html[data-theme="dark"] body .tour-section[style*="e91e63"] {
    background: linear-gradient(90deg, #c2185b, #ec407a) !important;
}

html[data-theme="dark"] body .tour-section[style*="5ec9ff"] {
    background: linear-gradient(90deg, #1e88e5, #42a5f5) !important;
}

/* Discord widget */
html[data-theme="dark"] .discord-widget {
    filter: invert(0.93) hue-rotate(180deg);
}

/* Scrollbar styling */
html[data-theme="dark"] ::-webkit-scrollbar {
    width: 12px;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #2d2d2d;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #666;
    border-radius: 6px;
}

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

/* Ensure text is readable on dark backgrounds */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 {
    color: #e0e0e0;
}

html[data-theme="dark"] a {
    color: #66bb6a;
}

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

/* Center navbar links on all pages */
.navbar .navbar-collapse {
    justify-content: flex-start;
}

.navbar .navbar-nav {
    margin-left: 2rem;
    justify-content: flex-start;
    align-items: center;
}