/*
 * dark-theme.css — Travel dark overrides for buttons, print, and tg-btn.
 * Applied via .theme-dark on <html> / <body> (Travel.Theme cookie).
 * Loaded last so 23px sizes and dark colors beat site/output CSS.
 */

/* --------------------------------------------------------------------------
   0. Size lock (light + dark) — last-loaded so Tailwind p-0 / h-8 cannot win
   -------------------------------------------------------------------------- */
.tg-btn,
ul.tg-btn {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    box-sizing: border-box;
    height: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    padding: 2px;
    border-radius: 999px;
}

.tg-btn li a {
    box-sizing: border-box;
    height: 17px;
    min-height: 17px;
    min-width: 56px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
}

.btn-print,
.btn.btn-print,
button.btn-print,
a.btn-print,
.pv-btn,
.property-list-page .btn,
.pv-wrapper .btn,
.booking-page .btn,
.edit-booking-page .btn {
    box-sizing: border-box;
    height: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    max-height: var(--btn-height, 25px);
    padding: 1px 9px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
}

.pv-btn.h-8,
.pv-btn.w-8,
.pv-btn.min-w-8 {
    width: var(--btn-height, 25px);
    height: var(--btn-height, 25px);
    min-width: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    padding: 0;
}

.k-grid-add.k-button,
.k-grid-toolbar .k-grid-add,
a.k-button.k-grid-add,
.k-button.k-button-md.k-grid-add,
.k-button.k-rounded-md.k-grid-add,
.k-button.k-button-md.k-rounded-md.k-grid-add,
.k-button.k-button-solid.k-button-solid-base.k-grid-add {
    --kendo-button-md-padding-x: 9px;
    --kendo-button-md-padding-y: 1px;
    --kendo-border-radius-md: var(--btn-border-radius, 7px);
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px;
    box-sizing: border-box;
    height: var(--btn-height, 25px) !important;
    min-height: var(--btn-height, 25px) !important;
    max-height: var(--btn-height, 25px) !important;
    padding: 1px 9px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    border: 1px solid var(--btn-add-bg, #24af54) !important;
    border-radius: var(--btn-border-radius, 7px) !important;
    background-color: var(--btn-add-bg, #24af54) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.k-grid-add.k-button:hover,
.k-grid-add.k-button.k-hover,
.k-grid-toolbar .k-grid-add:hover,
.k-button.k-button-md.k-rounded-md.k-grid-add:hover,
.k-button.k-button-solid.k-button-solid-base.k-grid-add:hover {
    border-color: var(--btn-add-hover, #1e9a49) !important;
    background-color: var(--btn-add-hover, #1e9a49) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.k-grid-add.k-button .k-icon,
.k-grid-add.k-button .k-svg-icon,
.k-grid-toolbar .k-grid-add .k-button-text {
    color: #ffffff !important;
}

.k-grid-save-changes.k-button,
.k-grid-toolbar .k-grid-save-changes,
a.k-button.k-grid-save-changes,
.k-button.k-button-md.k-grid-save-changes,
.k-button.k-rounded-md.k-grid-save-changes,
.k-button.k-button-md.k-rounded-md.k-grid-save-changes,
.k-button.k-button-solid.k-button-solid-base.k-grid-save-changes {
    --kendo-button-md-padding-x: 9px;
    --kendo-button-md-padding-y: 1px;
    --kendo-border-radius-md: var(--btn-border-radius, 7px);
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px;
    box-sizing: border-box;
    height: var(--btn-height, 25px) !important;
    min-height: var(--btn-height, 25px) !important;
    max-height: var(--btn-height, 25px) !important;
    padding: 1px 9px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    border: 1px solid var(--btn-primary-color, #0053E9) !important;
    border-radius: var(--btn-border-radius, 7px) !important;
    background-color: var(--btn-primary-color, #0053E9) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.k-grid-save-changes.k-button:hover,
.k-grid-save-changes.k-button.k-hover,
.k-grid-toolbar .k-grid-save-changes:hover,
.k-button.k-button-md.k-rounded-md.k-grid-save-changes:hover,
.k-button.k-button-solid.k-button-solid-base.k-grid-save-changes:hover {
    border-color: var(--btn-primary-hover-color, #0243b9) !important;
    background-color: var(--btn-primary-hover-color, #0243b9) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.k-grid-save-changes.k-button .k-icon,
.k-grid-save-changes.k-button .k-svg-icon,
.k-grid-toolbar .k-grid-save-changes .k-button-text {
    color: #ffffff !important;
}

.theme-dark {
    color-scheme: dark;
}

/* --------------------------------------------------------------------------
   0b. Global layered surfaces, chrome, forms, tables (semantic tokens)
   -------------------------------------------------------------------------- */
.theme-dark body,
html.theme-dark body {
    background-color: var(--bg-page, var(--app-bg)) !important;
    color: var(--text-primary, var(--font-color)) !important;
}

.theme-dark .header,
.theme-dark .header.navbar,
.theme-dark .header--dashboard {
    background-color: var(--bg-header, var(--top-bar-bg)) !important;
    color: var(--top-bar-color, #ffffff);
    border-color: var(--border-default, var(--surface-border));
}

.theme-dark .side-nav,
.theme-dark .app-side-nav,
.theme-dark .sidebar {
    background-color: var(--bg-sidebar, var(--side-bar-bg)) !important;
    color: var(--side-bar-color, #f8fafc);
    border-color: var(--border-default, var(--surface-border));
}

.theme-dark .side-nav .nav-item > a:hover,
.theme-dark .side-nav a:hover {
    background-color: var(--bg-hover, var(--side-bar-hover-bg)) !important;
    color: var(--side-bar-hover-color, #ffffff) !important;
}

.theme-dark .side-nav .nav-item.active > a,
.theme-dark .side-nav .open > a,
.theme-dark .side-nav a.active {
    background-color: var(--bg-active, var(--side-bar-active-bg)) !important;
    color: var(--side-bar-active-color, #ffffff) !important;
}

.theme-dark .content-container,
.theme-dark .edit-resort .tm-workspace-main.content-container {
    background: transparent !important;
    color: var(--text-primary, #f8fafc);
}

.theme-dark .edit-resort .photo-gallery-scroll-box,
.theme-dark .edit-resort .er-overview-preview,
.theme-dark .edit-resort .galleryPhotosBox {
    background: var(--bg-card, #1a2438) !important;
    border-color: var(--border-default, #3a4d6a) !important;
    color: var(--text-primary, #f8fafc);
}

.theme-dark .edit-resort .galleryPhotosBox:hover {
    background: var(--bg-hover, #2a3c57) !important;
}

.theme-dark .edit-resort .form-group label,
.theme-dark .edit-resort .er-overview-preview-label,
.theme-dark .edit-resort .tm-workspace-summary-sub {
    color: var(--text-secondary, #cbd5e1);
}

.theme-dark .edit-resort .tm-workspace-summary-name {
    color: var(--text-heading, #f8fafc);
}

.theme-dark .tabs-container {
    background-color: var(--bg-card, #1a2438);
}

.theme-dark .card,
.theme-dark .panel,
.theme-dark .box,
.theme-dark .content-card,
.theme-dark .main-content .card {
    background-color: var(--bg-card, var(--surface-bg)) !important;
    color: var(--text-primary, #ffffff);
    border-color: var(--border-default, var(--surface-border)) !important;
}

.theme-dark .card .card,
.theme-dark .card-body .card,
.theme-dark .nested-panel {
    background-color: var(--bg-card-secondary, var(--surface-muted-bg)) !important;
    border-color: var(--border-subtle, var(--surface-border)) !important;
}

.theme-dark .modal-content,
.theme-dark .dropdown-menu,
.theme-dark .popover,
.theme-dark .offcanvas,
.theme-dark .menu-drawer-offcanvas {
    background-color: var(--bg-elevated, var(--menu-bg)) !important;
    color: var(--text-primary, #ffffff) !important;
    border: 1px solid var(--border-default, var(--surface-border)) !important;
    box-shadow: 0 12px 32px var(--shadow-color, rgba(0, 0, 0, 0.45));
}

.theme-dark .modal-header,
.theme-dark .modal-footer,
.theme-dark .popover-header,
.theme-dark .offcanvas-header {
    background-color: var(--bg-card-secondary, var(--surface-muted-bg)) !important;
    color: var(--text-heading, #ffffff) !important;
    border-color: var(--border-default, var(--surface-border)) !important;
}

.theme-dark .modal-title,
.theme-dark .offcanvas-title,
.theme-dark .popover-header {
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark .modal-body,
.theme-dark .offcanvas-body,
.theme-dark .popover-body,
.theme-dark .dropdown-item {
    color: var(--text-primary, #ffffff) !important;
}

.theme-dark .dropdown-item:hover,
.theme-dark .dropdown-item:focus,
.theme-dark .dropdown-item.active {
    background-color: var(--bg-hover) !important;
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: 0.85;
}

.theme-dark .btn-close:hover {
    opacity: 1;
}

.theme-dark .modal-backdrop,
.theme-dark .offcanvas-backdrop {
    background-color: #020617;
    opacity: 0.72;
}

.theme-dark .tooltip .tooltip-inner,
.theme-dark .bs-tooltip-auto .tooltip-inner {
    background-color: var(--chart-tooltip-bg, #243247) !important;
    color: var(--chart-tooltip-color, #ffffff) !important;
    border: 1px solid var(--chart-tooltip-border, #4b6284);
}

.theme-dark .tooltip .tooltip-arrow::before {
    border-top-color: var(--chart-tooltip-bg, #243247);
    border-bottom-color: var(--chart-tooltip-bg, #243247);
}

.theme-dark .k-animation-container .k-popup,
.theme-dark .k-list-container,
.theme-dark .k-calendar-container,
.theme-dark .k-window,
.theme-dark .k-dialog {
    background-color: var(--bg-elevated, #243247) !important;
    color: var(--text-primary, #ffffff) !important;
    border-color: var(--border-default, #3a4d6a) !important;
}

.theme-dark a.link-accent,
.theme-dark .content-link,
.theme-dark .text-link {
    color: var(--text-accent, #93c5fd) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.theme-dark a.link-accent:hover,
.theme-dark .content-link:hover,
.theme-dark .text-link:hover {
    color: var(--bar-hover-color, #bfdbfe) !important;
}

.theme-dark .badge.bg-success,
.theme-dark .badge.bg-danger,
.theme-dark .badge.bg-info,
.theme-dark .badge.bg-primary,
.theme-dark .badge.bg-secondary {
    color: #ffffff !important;
}

.theme-dark .badge.bg-warning,
.theme-dark .badge.bg-warning.text-dark {
    background-color: #fbbf24 !important;
    color: #111827 !important;
}

.theme-dark .badge.bg-success { background-color: #059669 !important; }
.theme-dark .badge.bg-danger { background-color: #dc2626 !important; }
.theme-dark .badge.bg-info { background-color: #0284c7 !important; }

/* --------------------------------------------------------------------------
   0c. Forms, tables, badges (continued semantic token wiring)
   -------------------------------------------------------------------------- */
.theme-dark .form-control,
.theme-dark .form-select,
.theme-dark .k-textbox,
.theme-dark .k-input,
.theme-dark .k-textarea,
.theme-dark .k-picker,
.theme-dark .k-dropdownlist,
.theme-dark .k-combobox,
.theme-dark .k-datepicker,
.theme-dark .k-numerictextbox {
    background-color: var(--bg-input, var(--input-bg)) !important;
    color: var(--text-primary, #ffffff) !important;
    border-color: var(--input-border, var(--border-default)) !important;
}

.theme-dark .form-control::placeholder,
.theme-dark .k-input-inner::placeholder,
.theme-dark .k-input::placeholder {
    color: var(--placeholder-color, #94a3b8) !important;
    opacity: 1 !important;
}

.theme-dark .form-control:focus,
.theme-dark .form-select:focus,
.theme-dark .k-input:focus-within,
.theme-dark .k-textbox:focus,
.theme-dark .k-picker:focus-within {
    border-color: var(--border-focus, var(--color-primary)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--border-focus, #60a5fa) 30%, transparent) !important;
}

.theme-dark .table,
.theme-dark .table > :not(caption) > * > * {
    border-color: var(--border-default, var(--surface-border)) !important;
    color: var(--text-primary, #ffffff);
}

.theme-dark .table thead th,
.theme-dark .table > thead {
    background-color: var(--bg-card-secondary, var(--surface-muted-bg)) !important;
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: color-mix(in srgb, var(--bg-card-secondary) 55%, transparent) !important;
    color: var(--text-primary, #ffffff);
}

.theme-dark .table-hover > tbody > tr:hover > * {
    background-color: var(--bg-hover) !important;
    color: var(--text-primary, #ffffff);
}

.theme-dark .text-muted,
.theme-dark .text-secondary,
.theme-dark .small.text-muted {
    color: var(--text-muted, #cbd5e1) !important;
}

.theme-dark .page-title,
.theme-dark .section-title,
.theme-dark .card-title,
.theme-dark .modal-title {
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark .breadcrumb,
.theme-dark .breadcrumb-item,
.theme-dark .breadcrumb-item a {
    color: var(--breadcrumb-color, #ffffff);
}

.theme-dark .breadcrumb-item.active {
    color: var(--breadcrumb-active-color, #93c5fd);
}

.theme-dark .list-group-item {
    background-color: var(--bg-card, var(--surface-bg)) !important;
    color: var(--text-primary, #ffffff) !important;
    border-color: var(--border-default, var(--surface-border)) !important;
}

.theme-dark .list-group-item:hover,
.theme-dark .list-group-item-action:hover {
    background-color: var(--bg-hover) !important;
}

.theme-dark .list-group-item.active {
    background-color: var(--bg-active) !important;
    border-color: var(--border-focus) !important;
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark .nav-tabs .nav-link {
    color: var(--text-secondary, #e2e8f0);
    border-color: transparent;
}

.theme-dark .nav-tabs .nav-link:hover {
    background-color: var(--bg-hover);
    color: var(--text-heading, #ffffff);
    border-color: var(--border-subtle);
}

.theme-dark .nav-tabs .nav-link.active {
    background-color: var(--bg-card) !important;
    color: var(--text-heading, #ffffff) !important;
    border-color: var(--border-default) !important;
}

.theme-dark .alert {
    border-color: var(--border-default);
}

.theme-dark .badge {
    color: var(--text-on-accent, #ffffff);
}

.theme-dark .progress {
    background-color: var(--bg-card-secondary);
}

.theme-dark .progress-bar {
    background-color: var(--btn-primary-color, #3b82f6);
}

.theme-dark .card-header {
    background-color: var(--bg-card-secondary, var(--surface-muted-bg)) !important;
    border-color: var(--border-default, var(--surface-border)) !important;
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark #dashboard-app .card {
    background-color: var(--bg-card, var(--surface-bg)) !important;
    border: 1px solid var(--border-default, var(--surface-border)) !important;
    box-shadow: none;
}

.theme-dark #dashboard-app .text-muted {
    color: var(--text-muted, #cbd5e1) !important;
}

.theme-dark #dashboard-app h4,
.theme-dark #dashboard-app .card-title,
.theme-dark #dashboard-app .fw-bold {
    color: var(--text-heading, #ffffff) !important;
}

.theme-dark #dashboard-app .table {
    color: var(--text-primary, #ffffff);
}

/* --------------------------------------------------------------------------
   1. Shared 23px action buttons (matches HRMetricS Site.css / btn-system)
   -------------------------------------------------------------------------- */
.theme-dark .btn,
.theme-dark a.btn,
.theme-dark button.btn,
.theme-dark .pv-btn,
.theme-dark .btn-print,
.theme-dark .toggle-btn,
.theme-dark a.toggle-btn {
    box-sizing: border-box;
    height: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    padding: 1px 9px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    border-radius: var(--btn-border-radius, 7px);
}

.theme-dark .login-page .btn-custom,
.theme-dark .login-page .btn-otp,
.theme-dark .login-page .btn-signup {
    height: 40px;
    min-height: 40px;
    padding: 0 16px;
    font-size: 14px;
}

/* Print */
.theme-dark .btn-print,
.theme-dark .btn.btn-print,
.theme-dark button.btn-print,
.theme-dark a.btn-print {
    background-color: var(--btn-print-bg, #38bdf8);
    border-color: var(--btn-print-bg, #38bdf8);
    color: #ffffff;
}

.theme-dark .btn-print:hover,
.theme-dark .btn.btn-print:hover,
.theme-dark button.btn-print:hover,
.theme-dark a.btn-print:hover {
    background-color: var(--btn-primary-hover-color, #2563eb);
    border-color: var(--btn-primary-hover-color, #2563eb);
    color: #ffffff;
}

.theme-dark .btn-print i,
.theme-dark .btn.btn-print i,
.theme-dark .pv-btn .fa-print {
    color: inherit;
}

.theme-dark .pv-btn-primary {
    background-color: var(--btn-primary-color, #3b82f6);
    border-color: var(--btn-primary-color, #3b82f6);
    color: #ffffff;
}

.theme-dark .pv-btn-primary:hover {
    background-color: var(--btn-primary-hover-color, #2563eb);
    border-color: var(--btn-primary-hover-color, #2563eb);
    color: #ffffff;
}

.theme-dark .pv-btn-secondary {
    background-color: var(--surface-muted-bg, #212e45);
    border-color: var(--surface-border, #3a4d6a);
    color: var(--font-color, #f8fafc);
}

.theme-dark .pv-btn.h-8,
.theme-dark .pv-btn.w-8,
.theme-dark .pv-btn.min-w-8 {
    width: var(--btn-height, 25px);
    height: var(--btn-height, 25px);
    min-width: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    padding: 0;
}

.theme-dark .export-icon.excel {
    width: var(--btn-height, 25px);
    height: var(--btn-height, 25px);
    min-width: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    border-color: var(--surface-border, #3a4d6a);
    background-color: var(--surface-bg, #1a2438);
    color: #34d399;
}

/* --------------------------------------------------------------------------
   2. Segmented tabs (.tg-btn) — 23px track, readable dark contrast
   -------------------------------------------------------------------------- */
.theme-dark .tg-btn,
.theme-dark ul.tg-btn,
html.theme-dark .tg-btn,
html.theme-dark ul.tg-btn {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    box-sizing: border-box;
    height: var(--btn-height, 25px);
    min-height: var(--btn-height, 25px);
    padding: 2px;
    background: var(--toggle-track-bg, #1c283c);
    border: 1px solid var(--toggle-track-border, #3a4d6a);
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.theme-dark .tg-btn li,
html.theme-dark .tg-btn li {
    background: transparent;
    border: none;
}

.theme-dark .tg-btn li a,
html.theme-dark .tg-btn li a {
    height: 17px;
    min-height: 17px;
    min-width: 56px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--toggle-view-color, #e2e8f0);
    background: transparent;
    opacity: 1;
}

.theme-dark .tg-btn li:not(.tg-active) a:hover,
.theme-dark .tg-btn li:not(.tg-active) a:focus,
html.theme-dark .tg-btn li:not(.tg-active) a:hover,
html.theme-dark .tg-btn li:not(.tg-active) a:focus {
    color: var(--toggle-view-hover-color, #93c5fd);
    background: var(--toggle-view-hover-bg, rgba(59, 130, 246, 0.22));
    text-decoration: none;
}

.theme-dark .tg-btn li.tg-active,
html.theme-dark .tg-btn li.tg-active {
    background: var(--toggle-view-active-bg, #2a3c57);
    box-shadow: none;
}

.theme-dark .tg-btn li.tg-active a,
.theme-dark .tg-btn .tg-active > a,
html.theme-dark .tg-btn li.tg-active a,
.theme-dark .tg-btn li.tg-active a:hover,
.theme-dark .tg-btn li.tg-active a:focus {
    color: #ffffff;
    background: var(--toggle-view-active-bg, #2a3c57);
}

.theme-dark .booking-page .booking-toolbar {
    background-color: var(--surface-bg, #1a2438) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
    color: var(--font-color, #f8fafc) !important;
}

.theme-dark .booking-page .booking-page-title,
.theme-dark .booking-page .booking-toolbar h4 {
    color: var(--font-color, #f8fafc) !important;
}

.theme-dark .booking-page .booking-print-menu,
.theme-dark .booking-page .dropdown-menu {
    background-color: var(--surface-bg, #1a2438) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
}

.theme-dark .booking-page .booking-print-menu a,
.theme-dark .booking-page .dropdown-menu a {
    color: var(--font-color, #f8fafc) !important;
}

.theme-dark .booking-page .booking-print-menu a:hover,
.theme-dark .booking-page .dropdown-menu a:hover {
    background-color: var(--menu-hover-bg, #2a3c57) !important;
    color: var(--font-color, #f8fafc) !important;
}

/* --------------------------------------------------------------------------
   Rights tabs (#userRightsTab)
   -------------------------------------------------------------------------- */
html.theme-dark #userRightsTab.tab,
html.theme-dark ul.tab#userRightsTab,
html.theme-dark .main-content > ul.tab,
.theme-dark #userRightsTab,
.theme-dark ul.tab {
    background-color: var(--title-bar-bg, #212e45) !important;
    border-bottom-color: var(--surface-border, #3a4d6a) !important;
}

html.theme-dark #userRightsTab.tab a,
html.theme-dark ul.tab a,
.theme-dark #userRightsTab a,
.theme-dark ul.tab a {
    color: var(--menu-muted-color, #cbd5e1) !important;
}

html.theme-dark #userRightsTab.tab li:hover a,
html.theme-dark ul.tab li:hover a,
.theme-dark #userRightsTab li:hover a {
    color: var(--breadcrumb-hover-color, #93c5fd) !important;
}

html.theme-dark #userRightsTab.tab li.active,
html.theme-dark ul.tab li.active,
.theme-dark #userRightsTab li.active {
    border-bottom-color: var(--tab-active-bg, #3b82f6) !important;
}

html.theme-dark #userRightsTab.tab li.active a,
html.theme-dark #userRightsTab.tab a.active,
html.theme-dark ul.tab li.active a,
.theme-dark #userRightsTab li.active a {
    color: var(--breadcrumb-active-color, #93c5fd) !important;
}

/* --------------------------------------------------------------------------
   3. Grid page toolbar (.g-title / .g-text / .g-left / .g-right)
   -------------------------------------------------------------------------- */
html.theme-dark .g-title,
.theme-dark .g-title {
    background-color: var(--title-bar-bg, #212e45) !important;
    border-bottom-color: var(--surface-border, #3a4d6a) !important;
    color: var(--title-bar-color, #f8fafc) !important;
}

html.theme-dark .g-title .g-text,
html.theme-dark .g-title .gt-icon,
html.theme-dark .g-title h4,
html.theme-dark .g-title .g-center h4,
.theme-dark .g-text,
.theme-dark .gt-icon,
.theme-dark .g-title .g-left,
.theme-dark .g-title .g-right,
.theme-dark .g-title .g-center {
    color: var(--title-bar-color, #f8fafc) !important;
}

html.theme-dark .g-cnt,
.theme-dark .g-cnt {
    background-color: var(--surface-bg, #1a2438) !important;
    color: var(--font-color, #f8fafc) !important;
}

html.theme-dark .g-title .tg-btn,
html.theme-dark .g-left .tg-btn,
html.theme-dark .g-title ul.tg-btn {
    background: var(--toggle-track-bg, #1c283c) !important;
    border-color: var(--toggle-track-border, #3a4d6a) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

html.theme-dark .g-title .tg-btn li.tg-active,
html.theme-dark .g-title .tg-btn li.tg-active a {
    background: var(--toggle-view-active-bg, #2a3c57) !important;
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   4. Kendo Grid — beat Fiori #fff on every grid (locked/virtual/pager)
   -------------------------------------------------------------------------- */
html.theme-dark .k-grid,
html.theme-dark .k-grid.k-widget,
html.theme-dark .k-treelist,
html.theme-dark .main-content .k-grid,
html.theme-dark .booking-grid-card .k-grid {
    background-color: var(--kendo-grid-bg, #172033) !important;
    border-color: var(--kendo-grid-border-color, #334155) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-grid-header,
html.theme-dark .k-grid-header-wrap,
html.theme-dark .k-grid-header-locked,
html.theme-dark .k-grid-header .k-header,
html.theme-dark .k-grid th.k-header,
html.theme-dark .k-grid .k-table-th,
html.theme-dark .k-grouping-header,
html.theme-dark .k-grid-footer {
    background-color: var(--kendo-grid-header-bg, #1f2a3d) !important;
    background-image: none !important;
    border-color: var(--kendo-grid-border-color, #334155) !important;
    color: var(--kendo-grid-header-color, #e5e7eb) !important;
}

html.theme-dark .k-grid-header .k-link,
html.theme-dark .k-grid-header .k-header .k-link,
html.theme-dark .k-grid .k-column-title {
    color: var(--kendo-grid-header-color, #e5e7eb) !important;
}

html.theme-dark .k-grid-content,
html.theme-dark .k-grid-content-locked,
html.theme-dark .k-grid-container,
html.theme-dark .k-virtual-scrollable-wrap,
html.theme-dark .k-grid table,
html.theme-dark .k-grid .k-table,
html.theme-dark .k-grid-header table,
html.theme-dark .k-grid-content table,
html.theme-dark .k-grid-content-locked table {
    background-color: var(--kendo-grid-bg, #172033) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-grid td,
html.theme-dark .k-grid .k-table-td,
html.theme-dark .k-grid .k-master-row > td,
html.theme-dark .k-grid tbody > tr > td {
    background-color: var(--kendo-grid-bg, #172033) !important;
    border-color: var(--kendo-grid-border-color, #334155) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-grid tr.k-alt,
html.theme-dark .k-grid tr.k-alt > td,
html.theme-dark .k-grid tr.k-table-alt-row,
html.theme-dark .k-grid tr.k-table-alt-row > td {
    background-color: var(--kendo-grid-alt-bg, #1a2438) !important;
}

html.theme-dark .k-grid tbody > tr:not(.k-detail-row):hover > td,
html.theme-dark .k-grid tr:hover td,
html.theme-dark .k-grid .k-table-row:hover > td,
html.theme-dark .k-grid .k-hover > td {
    background-color: var(--kendo-grid-row-hover-bg, #25324a) !important;
}

html.theme-dark .k-grid tr.k-selected > td,
html.theme-dark .k-grid tr.k-state-selected > td {
    background-color: var(--kendo-grid-selected-bg, rgba(59, 130, 246, 0.28)) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-filter-row,
html.theme-dark .k-filter-row > th,
html.theme-dark .k-filter-row > td {
    background-color: var(--kendo-filter-row-bg, #1f2a3d) !important;
    border-color: var(--kendo-grid-border-color, #334155) !important;
    color: var(--kendo-grid-header-color, #e5e7eb) !important;
}

html.theme-dark .k-grid-pager,
html.theme-dark .k-pager,
html.theme-dark .k-pager-wrap,
html.theme-dark .k-grid .k-pager-wrap,
html.theme-dark .booking-grid-card .k-grid-pager {
    background-color: var(--kendo-grid-toolbar-bg, #1f2a3d) !important;
    border-color: var(--kendo-grid-toolbar-border, #334155) !important;
    color: var(--kendo-grid-footer-color, #e5e7eb) !important;
}

html.theme-dark .k-pager-numbers .k-link,
html.theme-dark .k-pager-nav.k-link,
html.theme-dark .k-pager-info {
    color: var(--kendo-grid-color, #e5e7eb) !important;
    background-color: transparent !important;
}

html.theme-dark .k-pager-numbers .k-link.k-selected,
html.theme-dark .k-pager-numbers .k-state-selected {
    background-color: var(--kendo-color-primary, #3b82f6) !important;
    color: #ffffff !important;
}

html.theme-dark .k-grid-norecords,
html.theme-dark .k-grid-norecords-template,
html.theme-dark .k-grid .k-no-data {
    background-color: var(--kendo-grid-norecords-bg, #172033) !important;
    color: var(--kendo-grid-norecords-color, #a8b3c5) !important;
}

html.theme-dark .k-grid-toolbar,
html.theme-dark #TransferDetails .k-grid-toolbar {
    background-color: var(--kendo-grid-toolbar-bg, #1f2a3d) !important;
    border-color: var(--kendo-grid-toolbar-border, #334155) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-grid-toolbar .k-grid-add {
    border-color: var(--btn-add-bg, #24af54) !important;
    background-color: var(--btn-add-bg, #24af54) !important;
    color: #ffffff !important;
}

html.theme-dark .k-grid-toolbar .k-grid-add:hover,
html.theme-dark .k-grid-toolbar .k-grid-add.k-hover {
    border-color: var(--btn-add-hover, #1e9a49) !important;
    background-color: var(--btn-add-hover, #1e9a49) !important;
    color: #ffffff !important;
}

html.theme-dark .k-grid-toolbar .k-grid-save-changes,
html.theme-dark .k-grid-save-changes.k-button,
html.theme-dark .k-button.k-button-md.k-rounded-md.k-grid-save-changes {
    border-color: var(--btn-primary-color, #3b82f6) !important;
    background-color: var(--btn-primary-color, #3b82f6) !important;
    color: #ffffff !important;
}

html.theme-dark .k-grid-toolbar .k-grid-save-changes:hover,
html.theme-dark .k-grid-toolbar .k-grid-save-changes.k-hover,
html.theme-dark .k-grid-save-changes.k-button:hover,
html.theme-dark .k-button.k-button-md.k-rounded-md.k-grid-save-changes:hover {
    border-color: var(--btn-primary-hover-color, #2563eb) !important;
    background-color: var(--btn-primary-hover-color, #2563eb) !important;
    color: #ffffff !important;
}

html.theme-dark .k-grid .btn-grid,
html.theme-dark .k-grid .k-grid-filter,
html.theme-dark .k-grid .k-header-column-menu,
html.theme-dark .k-grid .k-icon,
html.theme-dark .k-grid .k-svg-icon {
    color: var(--kendo-gird-filter-color, #93c5fd) !important;
}

html.theme-dark .k-grouping-row td,
html.theme-dark .k-group-footer td,
html.theme-dark .k-grid-footer td {
    background-color: var(--kendo-grid-header-bg, #1f2a3d) !important;
    color: var(--kendo-grid-header-color, #e5e7eb) !important;
}

html.theme-dark .offcanvas tbody,
html.theme-dark .table-custom td {
    background-color: var(--kendo-grid-bg, #172033) !important;
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark,
html.theme-dark body {
    --bs-dropdown-bg: var(--surface-bg, #1a2438);
    --bs-dropdown-color: var(--font-color, #f8fafc);
    --bs-dropdown-border-color: var(--surface-border, #3a4d6a);
    --bs-dropdown-link-color: var(--font-color, #f8fafc);
    --bs-dropdown-link-hover-bg: var(--menu-hover-bg, #2a3c57);
    --bs-dropdown-link-hover-color: var(--font-color, #f8fafc);
    --bs-dropdown-link-active-bg: var(--menu-hover-bg, #2a3c57);
    --bs-dropdown-link-active-color: var(--font-color, #f8fafc);
}

html.theme-dark .dropdown .dropdown-menu,
html.theme-dark .dropdown-menu,
html.theme-dark .dropdown-menu.dropdown,
html.theme-dark .dropdown-menu.dropdown-md,
html.theme-dark .btn-group .dropdown-menu,
html.theme-dark .btn-group > .dropdown-menu,
html.theme-dark ul.dropdown-menu,
html.theme-dark .booking-print-menu,
html.theme-dark .header--travel .travel-header-profile > .dropdown-menu,
html.theme-dark .header--dashboard .user-profile > .dropdown-menu {
    background-color: var(--surface-bg, #1a2438) !important;
    background-image: none !important;
    color: var(--font-color, #f8fafc) !important;
    border: 1px solid var(--surface-border, #3a4d6a) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.4) !important;
}

html.theme-dark .dropdown-menu > li > a,
html.theme-dark .dropdown-menu a,
html.theme-dark .dropdown-menu .dropdown-item,
html.theme-dark .booking-print-menu a {
    color: var(--font-color, #f8fafc) !important;
    background-color: transparent !important;
}

html.theme-dark .dropdown-menu > li > a:hover,
html.theme-dark .dropdown-menu > li > a:focus,
html.theme-dark .dropdown-menu a:hover,
html.theme-dark .dropdown-menu .dropdown-item:hover,
html.theme-dark .booking-print-menu a:hover {
    background-color: var(--menu-hover-bg, #2a3c57) !important;
    color: #ffffff !important;
}

html.theme-dark .offcanvas.offcanvas-center,
html.theme-dark .offcanvas.offcanvas-center.draggable-offcanvas,
html.theme-dark .offcanvas.offcanvas-center.show {
    background: var(--surface-bg, #1a2438) !important;
    color: var(--font-color, #f8fafc) !important;
    border-left-color: var(--surface-border, #3a4d6a) !important;
    box-shadow: -12px 0 32px rgba(0, 0, 0, 0.45);
}

html.theme-dark .offcanvas.offcanvas-center .offcanvas-header,
html.theme-dark .offcanvas.offcanvas-center .draggable-handle,
html.theme-dark .offcanvas.offcanvas-center .offcanvas-body {
    background: var(--surface-bg, #1a2438) !important;
    color: var(--font-color, #f8fafc) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
}

html.theme-dark .offcanvas.offcanvas-center .offcanvas-header h5,
html.theme-dark .offcanvas.offcanvas-center .draggable-handle h5,
html.theme-dark .offcanvas.offcanvas-center .btn-close {
    color: var(--font-color, #f8fafc) !important;
}

html.theme-dark .offcanvas.offcanvas-center .btn-close {
    filter: invert(1) grayscale(1);
}

.k-grid .dropdown-btn .fa,
.k-grid .dropdown-btn [class*="text-slate-"] {
    color: inherit !important;
}

html.theme-dark .k-grid .dropdown-btn,
html.theme-dark .grp-btn.dropdown-btn {
    color: var(--kendo-grid-color, #e5e7eb) !important;
}

html.theme-dark .k-grid .dropdown-btn:hover,
html.theme-dark .k-grid .dropdown-btn.active {
    background: var(--kendo-grid-row-hover-bg, #25324a) !important;
    border-color: var(--kendo-grid-border-color, #334155) !important;
    color: #f1f5f9 !important;
}

html.theme-dark #kendo-grid-kebab-float.dropdown-btn-content,
html.theme-dark .k-column-menu,
html.theme-dark .k-popup.k-column-menu,
html.theme-dark .k-grid-columnmenu-popup {
    background: var(--kendo-popup-bg, #1e293b) !important;
    border-color: var(--kendo-grid-border-color, #3f536e) !important;
    color: var(--kendo-popup-color, #e2e8f0) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}

html.theme-dark #kendo-grid-kebab-float a {
    color: #e2e8f0 !important;
}

html.theme-dark #kendo-grid-kebab-float a:hover,
html.theme-dark #kendo-grid-kebab-float a:focus {
    background: rgba(59, 130, 246, 0.16) !important;
    color: #f8fafc !important;
}

html.theme-dark .k-column-menu .k-menu-item:hover,
html.theme-dark .k-column-menu .k-item:hover,
html.theme-dark .k-column-menu .k-column-list-item:hover {
    background: rgba(59, 130, 246, 0.16) !important;
    color: #f8fafc !important;
}

/* --------------------------------------------------------------------------
   Edit Booking — no gray text; white on dark surfaces
   -------------------------------------------------------------------------- */
html.theme-dark .edit-booking-page .edit-booking-search .k-dropdownlist,
html.theme-dark .edit-booking-page .edit-booking-search .k-picker,
html.theme-dark .edit-booking-page .edit-booking-search .k-datepicker,
html.theme-dark .edit-booking-page .edit-booking-search .k-dateinput {
    background: var(--input-bg, #243247) !important;
    border-color: var(--input-border, #4b6284) !important;
    color: #ffffff !important;
}

html.theme-dark .edit-booking-page .edit-booking-search .k-input-inner,
html.theme-dark .edit-booking-page .edit-booking-search .k-input-value-text,
html.theme-dark .edit-booking-page .edit-booking-search .k-input-button {
    color: #ffffff !important;
}

html.theme-dark .edit-booking-page .property-price,
html.theme-dark .edit-booking-page .text-white {
    color: #ffffff !important;
}

html.theme-dark .edit-booking-page .eb-rooms-stack-icon {
    color: #60a5fa !important;
}

html.theme-dark .edit-booking-page .eb-rooms-stack-count {
    background: rgba(37, 99, 235, 0.2) !important;
    color: #93c5fd !important;
}

html.theme-dark .edit-booking-page .eb-room-card {
    background: var(--surface-bg, #1a2438) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
}

html.theme-dark .edit-booking-page .eb-room-card:hover {
    border-color: rgba(96, 165, 250, 0.45) !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.35) !important;
}

html.theme-dark .edit-booking-page .eb-room-card-property {
    color: #f8fafc !important;
}

html.theme-dark .edit-booking-page .eb-room-card-dates {
    color: #94a3b8 !important;
}

html.theme-dark .edit-booking-page .eb-room-card-place {
    background: rgba(15, 23, 42, 0.74) !important;
    color: #f8fafc !important;
}

html.theme-dark .edit-booking-page .eb-room-card-rating {
    background: rgba(30, 41, 59, 0.92) !important;
    color: #f8fafc !important;
}

html.theme-dark .edit-booking-page .eb-room-card-meta-item {
    background: var(--bg-card-secondary, var(--surface-muted-bg, #243247)) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
}

html.theme-dark .edit-booking-page .eb-booking-option-amount,
html.theme-dark .edit-booking-page .eb-booking-option-discount {
    background: rgba(16, 185, 129, 0.16) !important;
    color: #6ee7b7 !important;
}

html.theme-dark .edit-booking-page .eb-booking-option-group-title,
html.theme-dark .edit-booking-page .eb-booking-option-choice .form-check-label,
html.theme-dark .edit-booking-page .eb-booking-option-selected,
html.theme-dark .edit-booking-page .eb-booking-service-toggle,
html.theme-dark .edit-booking-page .eb-booking-service-label {
    color: #e2e8f0 !important;
}

html.theme-dark .edit-booking-page .sticky-column::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.35);
}

html.theme-dark .k-widget.k-window.k-alert-window,
html.theme-dark .k-widget.k-window.k-confirm-wnd,
html.theme-dark .k-widget.k-window.k-prompt-wnd {
    background: var(--surface-bg, #1a2438) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
    color: #f8fafc !important;
}

html.theme-dark .k-prompt .w-content label,
html.theme-dark .k-alert .w-content,
html.theme-dark .k-confirm .w-content {
    color: #f8fafc !important;
}

html.theme-dark .k-widget.k-window .prompt-txt,
html.theme-dark .k-prompt .prompt-txt,
html.theme-dark .k-prompt #txtPrompt {
    background: var(--input-bg, #243247) !important;
    border-color: var(--input-border, #4b6284) !important;
    color: #ffffff !important;
}

html.theme-dark .booking-doc-page,
html.theme-dark #booking-confirmation-container,
html.theme-dark #booking-invoice-container,
html.theme-dark .booking-document-container {
    color: #f8fafc;
}

html.theme-dark .company-header,
html.theme-dark .reference-section,
html.theme-dark .card-section,
html.theme-dark .table-section,
html.theme-dark .info-section,
html.theme-dark .footer-section,
html.theme-dark .info-card,
html.theme-dark .booking-offer-card,
html.theme-dark .booking-offer-empty {
    background: var(--bg-card-secondary, var(--surface-muted-bg, #243247)) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
}

html.theme-dark .contact-item,
html.theme-dark .info-item {
    background: var(--surface-bg, #1a2438) !important;
    border-color: var(--surface-border, #3a4d6a) !important;
    color: #cbd5e1 !important;
}

html.theme-dark .info-label,
html.theme-dark .info-sublabel {
    background: var(--surface-bg, #1a2438) !important;
    color: #e2e8f0 !important;
}

html.theme-dark .info-value,
html.theme-dark .card-value,
html.theme-dark .company-name,
html.theme-dark .document-title h2 {
    color: #f8fafc !important;
}

html.theme-dark .card-label,
html.theme-dark .contact-item,
html.theme-dark .footer-section p,
html.theme-dark .remarks-content p {
    color: #94a3b8 !important;
}