:root,
html[data-theme="light"] {
    color-scheme: light;
    --tf-page-bg: #f3f6fb;
    --tf-page-bg-alt: #edf3fa;
    --tf-surface: #fcfcfe;
    --tf-surface-raised: #ffffff;
    --tf-surface-muted: #f5f7fb;
    --tf-input-bg: #ffffff;
    --tf-text: #172033;
    --tf-text-secondary: #667085;
    --tf-text-muted: #98a2b3;
    --tf-border: #dce3ed;
    --tf-border-strong: #cbd5e2;
    --tf-shadow: 0 12px 34px rgba(3, 9, 22, .10);
    --tf-shadow-raised: 0 18px 46px rgba(3, 9, 22, .14);
    --tf-purple: #7867ff;
    --tf-blue: #2478ff;
    --tf-cyan: #2aaee8;
    --tf-danger: #d92d4a;
    --tf-success: #16875b;
    --tf-focus-ring: rgba(120, 103, 255, .14);
    --tf-primary-gradient: linear-gradient(115deg, #9b43f4, #2478ff);
    --tf-page-gradient:
        radial-gradient(circle at 84% 8%, rgba(155, 67, 244, .08), transparent 30rem),
        radial-gradient(circle at 8% 68%, rgba(36, 120, 255, .07), transparent 32rem),
        linear-gradient(145deg, var(--tf-page-bg), var(--tf-page-bg-alt));
}

html[data-theme="dark"] {
    color-scheme: dark;
    --tf-page-bg: #030916;
    --tf-page-bg-alt: #071226;
    --tf-surface: #101a2d;
    --tf-surface-raised: #17243a;
    --tf-surface-muted: #0b1528;
    --tf-input-bg: #17243a;
    --tf-text: #f3f6fb;
    --tf-text-secondary: #a4b1c3;
    --tf-text-muted: #7f8ea4;
    --tf-border: rgba(148, 163, 184, .20);
    --tf-border-strong: rgba(148, 163, 184, .32);
    --tf-shadow: 0 14px 38px rgba(0, 0, 0, .25);
    --tf-shadow-raised: 0 22px 56px rgba(0, 0, 0, .34);
    --tf-purple: #9b8cff;
    --tf-blue: #4590ff;
    --tf-cyan: #45c5f1;
    --tf-danger: #ff778c;
    --tf-success: #4dd4a0;
    --tf-focus-ring: rgba(139, 124, 255, .18);
    --tf-primary-gradient: linear-gradient(115deg, #9b43f4, #2478ff);
    --tf-page-gradient:
        radial-gradient(circle at 82% 10%, rgba(123, 55, 232, .14), transparent 28rem),
        radial-gradient(circle at 8% 65%, rgba(16, 118, 255, .10), transparent 30rem),
        linear-gradient(145deg, var(--tf-page-bg), var(--tf-page-bg-alt));
}

html,
body {
    min-height: 100%;
    color: var(--tf-text);
    background-color: var(--tf-page-bg);
}

body,
.page-content,
.content-wrapper,
.content,
.page-container,
.page-wrapper-middle {
    color: var(--tf-text);
    background-color: var(--tf-page-bg) !important;
    background-image: var(--tf-page-gradient) !important;
}

body,
.card,
.modal-content,
.dropdown-menu,
.form-control,
.select2-selection,
.table {
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

h1, h2, h3, h4, h5, h6,
.page-title,
.card-title,
label {
    color: var(--tf-text);
}

p,
.text-muted,
small,
.help-block,
.form-text {
    color: var(--tf-text-secondary) !important;
}

a {
    color: var(--tf-blue);
}

a:hover,
a:focus {
    color: var(--tf-purple);
}

.card,
.modal-content,
.popover,
.dropdown-menu {
    border-color: var(--tf-border) !important;
    color: var(--tf-text);
    background: var(--tf-surface) !important;
    box-shadow: var(--tf-shadow);
}

.card-header,
.card-footer,
.modal-header,
.modal-footer,
.dropdown-divider {
    border-color: var(--tf-border) !important;
    color: var(--tf-text);
    background: transparent !important;
}

.dropdown-item {
    color: var(--tf-text);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active {
    color: var(--tf-text);
    background: var(--tf-surface-raised) !important;
}

.form-control,
select,
textarea,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-color: var(--tf-border) !important;
    color: var(--tf-text) !important;
    background: var(--tf-input-bg) !important;
}

.form-control::placeholder,
textarea::placeholder,
.select2-selection__placeholder {
    color: var(--tf-text-muted) !important;
}

.form-control:focus,
select:focus,
textarea:focus,
.select2-container--focus .select2-selection {
    border-color: var(--tf-purple) !important;
    color: var(--tf-text) !important;
    background: var(--tf-input-bg) !important;
    box-shadow: 0 0 0 3px var(--tf-focus-ring) !important;
}

.select2-dropdown,
.select2-results__option {
    border-color: var(--tf-border) !important;
    color: var(--tf-text) !important;
    background: var(--tf-surface-raised) !important;
}

.select2-results__option--highlighted {
    color: #fff !important;
    background: var(--tf-primary-gradient) !important;
}

.table {
    color: var(--tf-text);
    background: var(--tf-surface);
}

.table th,
.table td {
    border-color: var(--tf-border) !important;
}

.table-hover tbody tr:hover {
    color: var(--tf-text);
    background: var(--tf-surface-raised);
}

.btn-primary,
.tf-theme-primary {
    border-color: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
    background: var(--tf-primary-gradient) !important;
    box-shadow: 0 8px 24px rgba(86, 62, 242, .24);
}

.btn-light,
.btn-default,
.btn-outline-secondary {
    border-color: var(--tf-border-strong) !important;
    color: var(--tf-text) !important;
    background: var(--tf-surface-raised) !important;
}

.alert,
.pagination .page-link,
.list-group-item {
    border-color: var(--tf-border) !important;
    color: var(--tf-text);
    background: var(--tf-surface) !important;
}

.field-validation-error,
.validation-summary-errors {
    color: var(--tf-danger) !important;
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--tf-purple);
}

/* Header remains the stable Ticketflo brand anchor in both modes. */
.tf-booking-header,
.tf-header,
.navbar-dark {
    color-scheme: dark;
}

.tf-appearance-menu .dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.tf-global-appearance,
.tf-booking-header .tf-appearance-menu {
    position: absolute !important;
    z-index: 20;
    top: 50%;
    right: 22px;
    margin: 0 !important;
    transform: translateY(-50%);
}

.tf-appearance-trigger,
.tf-booking-header .tf-appearance-menu > .dropdown-toggle {
    width: 42px;
    height: 42px;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .18) !important;
    border-radius: 50% !important;
    color: #edf3ff !important;
    background: rgba(255, 255, 255, .07) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    cursor: pointer;
}

.tf-appearance-trigger:hover,
.tf-appearance-trigger:focus,
.tf-booking-header .tf-appearance-menu > .dropdown-toggle:hover,
.tf-booking-header .tf-appearance-menu > .dropdown-toggle:focus {
    outline: none;
    border-color: rgba(155, 140, 255, .7) !important;
    color: #fff !important;
    background: rgba(128, 86, 244, .2) !important;
}

.tf-appearance-trigger::after,
.tf-booking-header .tf-appearance-menu > .dropdown-toggle::after,
.tf-booking-header .tf-appearance-menu > .dropdown-toggle [data-tf-theme-label] {
    display: none !important;
}

.tf-appearance-menu .dropdown-toggle::after {
    margin-left: 3px;
}

.tf-appearance-menu .dropdown-menu {
    min-width: 176px;
    padding: 7px;
    border-radius: 12px;
}

.tf-theme-option {
    width: 100%;
    min-height: 39px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 8px;
    color: var(--tf-text);
    background: transparent;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
}

.tf-theme-option:hover,
.tf-theme-option:focus,
.tf-theme-option.is-active {
    outline: none;
    color: var(--tf-text);
    background: var(--tf-surface-raised);
}

.tf-theme-option .tf-theme-check {
    margin-left: auto;
    color: var(--tf-purple);
    opacity: 0;
}

.tf-theme-option.is-active .tf-theme-check {
    opacity: 1;
}

@media (max-width: 1350px) {
    .tf-global-appearance,
    .tf-booking-header .tf-appearance-menu {
        position: static !important;
        margin-left: 8px !important;
        transform: none;
    }
}

@media (max-width: 767.98px) {
    .tf-global-appearance {
        margin-left: 4px !important;
    }

    .tf-booking-header .tf-appearance-menu {
        margin: 8px 0 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}