/* NQ Tenpin Booking System - Dark Theme */
/* This is the default theme - variables already set for dark mode */

/* Force dark mode */
:root {
    color-scheme: dark;
}

/* Dark mode scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bg-darker);
}

::-webkit-scrollbar-thumb {
    background: var(--bg-elevated);
    border-radius: var(--radius-full);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-muted);
}

/* Native form elements in dark mode */
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
    color-scheme: dark;
}

select {
    color-scheme: dark;
}

/* Dark mode images */
img {
    filter: brightness(0.95);
}

/* Ensure consistent dark backgrounds */
html {
    background: var(--bg-darkest);
}

body {
    background: var(--bg-darkest);
}

/* Code blocks */
code, pre {
    background: var(--bg-darker);
    color: var(--text-primary);
}

/* Blockquotes */
blockquote {
    border-left: 3px solid var(--primary);
    padding-left: var(--space-4);
    color: var(--text-secondary);
}

/* HR */
hr {
    border: none;
    border-top: 1px solid var(--border-subtle);
}

/* Tables */
table {
    border-color: var(--border-subtle);
}

th, td {
    border-color: var(--border-subtle);
}

/* Mark/Highlight */
mark {
    background: rgba(255, 170, 0, 0.3);
    color: var(--text-primary);
}

/* Details/Summary */
details {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
}

summary {
    cursor: pointer;
    font-weight: var(--font-medium);
}

/* Dialog */
dialog {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
}

dialog::backdrop {
    background: rgba(0, 0, 0, 0.7);
}

/* Progress */
progress {
    background: var(--bg-elevated);
    border-radius: var(--radius-full);
    height: 8px;
}

progress::-webkit-progress-bar {
    background: var(--bg-elevated);
    border-radius: var(--radius-full);
}

progress::-webkit-progress-value {
    background: var(--gradient-primary);
    border-radius: var(--radius-full);
}

progress::-moz-progress-bar {
    background: var(--gradient-primary);
    border-radius: var(--radius-full);
}

/* Meter */
meter {
    background: var(--bg-elevated);
    border-radius: var(--radius-full);
}

/* Autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-primary);
    -webkit-box-shadow: 0 0 0px 1000px var(--bg-input) inset;
    transition: background-color 5000s ease-in-out 0s;
}