/*
 * TMS professional theme — light (default) and dark.
 *
 * The page sets <html data-theme="light|dark"> (see layouts/theme-init) and
 * this file restyles the bundled admin template (app.css +
 * bootstrap-extended.css, originally a dark glass theme over a photo) with
 * solid surfaces. Every rule is prefixed with [data-theme] so it wins over the
 * template without editing it. Workspace modules use the same --t-* tokens.
 */

/* ------------------------------------------------------------------ tokens */

:root,
[data-theme="light"] {
    color-scheme: light;
    --t-bg: #f3f5f9;
    --t-surface: #ffffff;
    --t-surface-2: #f1f4f9;
    --t-hover: #f5f7fb;
    --t-border: #e4e8ef;
    --t-border-strong: #cfd6e2;
    --t-text: #334155;
    --t-heading: #0f172a;
    --t-muted: #64748b;
    --t-input-bg: #ffffff;
    --t-popover: #ffffff;

    --t-primary: #2563eb;
    --t-primary-hover: #1d4ed8;
    --t-primary-soft: #e8efff;
    --t-teal: #0d9488;
    --t-teal-soft: #e0f5f2;
    --t-success: #16a34a;
    --t-success-soft: #e7f6ec;
    --t-warning: #c2780a;
    --t-warning-soft: #fdf2df;
    --t-danger: #dc2626;
    --t-danger-soft: #fdecec;

    --t-sidebar-bg: #0f172a;
    --t-sidebar-border: #1e293b;
    --t-sidebar-text: #aab6c8;
    --t-sidebar-hover: rgb(255 255 255 / 6%);
    --t-sidebar-active: #2563eb;
    --t-topbar-bg: #ffffff;

    --t-hero-from: #1e3a8a;
    --t-hero-to: #2563eb;
    --t-shadow: 0 1px 2px rgb(15 23 42 / 5%), 0 1px 3px rgb(15 23 42 / 6%);
    --t-shadow-lg: 0 10px 25px -5px rgb(15 23 42 / 12%), 0 4px 10px -6px rgb(15 23 42 / 8%);
}

[data-theme="dark"] {
    color-scheme: dark;
    --t-bg: #0b1120;
    --t-surface: #121a2b;
    --t-surface-2: #182236;
    --t-hover: #1a2539;
    --t-border: #223049;
    --t-border-strong: #31415f;
    --t-text: #cbd5e1;
    --t-heading: #f1f5f9;
    --t-muted: #8796ad;
    --t-input-bg: #0f1727;
    --t-popover: #16203a;

    --t-primary: #3b82f6;
    --t-primary-hover: #60a5fa;
    --t-primary-soft: rgb(59 130 246 / 16%);
    --t-teal: #2dd4bf;
    --t-teal-soft: rgb(45 212 191 / 14%);
    --t-success: #22c55e;
    --t-success-soft: rgb(34 197 94 / 14%);
    --t-warning: #f59e0b;
    --t-warning-soft: rgb(245 158 11 / 15%);
    --t-danger: #f87171;
    --t-danger-soft: rgb(248 113 113 / 14%);

    --t-sidebar-bg: #070c18;
    --t-sidebar-border: #172033;
    --t-sidebar-text: #94a3b8;
    --t-sidebar-hover: rgb(255 255 255 / 5%);
    --t-sidebar-active: #2563eb;
    --t-topbar-bg: #0e1626;

    --t-hero-from: #1e3a8a;
    --t-hero-to: #0f766e;
    --t-shadow: 0 1px 2px rgb(0 0 0 / 30%);
    --t-shadow-lg: 0 12px 28px rgb(0 0 0 / 45%);
}

/* ------------------------------------------------------------------ base */

[data-theme] body {
    background: var(--t-bg) !important;
    background-image: none !important;
    color: var(--t-text);
    font-family: Inter, Roboto, system-ui, -apple-system, "Segoe UI", sans-serif;
    letter-spacing: 0;
    transition: background-color .2s ease;
}
/* Element defaults use :where() (zero specificity) so component classes always win */
:where([data-theme]) h1, :where([data-theme]) h2, :where([data-theme]) h3, :where([data-theme]) h4, :where([data-theme]) h5, :where([data-theme]) h6,
:where([data-theme]) .h4, :where([data-theme]) .h5, :where([data-theme]) .h6 { color: var(--t-heading); }
:where([data-theme]) a { color: var(--t-primary); text-decoration: none; }
:where([data-theme]) a:hover { color: var(--t-primary-hover); }
[data-theme] hr { border-color: var(--t-border); opacity: 1; }
[data-theme] ::selection { background: var(--t-primary-soft); }
[data-theme] .text-muted, [data-theme] .text-secondary { color: var(--t-muted) !important; }
[data-theme] .text-light-1, [data-theme] .text-light-2, [data-theme] .text-light-3 { color: var(--t-muted) !important; }

/* The template writes text-white everywhere for its dark glass look. On
   solid surfaces it becomes the normal text colour; on coloured fills
   (buttons, badges, alerts, bg-*) it stays white. */
[data-theme="light"] .page-content .text-white,
[data-theme="light"] .section-authentication-signin .text-white { color: var(--t-heading) !important; }
[data-theme] .page-content .btn.text-white, [data-theme] .page-content .btn .text-white,
[data-theme] .page-content .badge.text-white, [data-theme] .page-content .alert .text-white,
[data-theme] .page-content [class*="bg-"] .text-white, [data-theme] .page-content [class*="bg-"].text-white,
[data-theme] .page-content .ws-hero .text-white { color: #fff !important; }

/* ------------------------------------------------------------------ layout */

[data-theme] .sidebar-wrapper,
[data-theme] .wrapper.toggled.sidebar-hovered .sidebar-wrapper { background: var(--t-sidebar-bg); border-right: 1px solid var(--t-sidebar-border); box-shadow: none; }
[data-theme] .sidebar-header,
[data-theme] .wrapper.toggled.sidebar-hovered .sidebar-header { background: var(--t-sidebar-bg); border-bottom: 1px solid var(--t-sidebar-border); border-right: 1px solid var(--t-sidebar-border); }
[data-theme] .sidebar-header .toggle-icon { color: var(--t-sidebar-text); }
[data-theme] .sidebar-wrapper .metismenu { padding: 8px 12px; }
[data-theme] .sidebar-wrapper .metismenu a { color: var(--t-sidebar-text); border-radius: 8px; font-size: 14.5px; padding: 9px 12px; }
[data-theme] .sidebar-wrapper .metismenu a .parent-icon { font-size: 20px; }
[data-theme] .sidebar-wrapper .metismenu a:hover,
[data-theme] .sidebar-wrapper .metismenu a:focus { color: #fff; background: var(--t-sidebar-hover); }
[data-theme] .sidebar-wrapper .metismenu .mm-active > a,
[data-theme] .sidebar-wrapper .metismenu a.ws-current { color: #fff; background: var(--t-sidebar-active); box-shadow: 0 4px 12px rgb(37 99 235 / 35%); }
[data-theme] .sidebar-wrapper .search-control { background: rgb(255 255 255 / 6%); border: 1px solid var(--t-sidebar-border); color: #e2e8f0; border-radius: 8px; }
[data-theme] .sidebar-wrapper .search-control::placeholder { color: var(--t-sidebar-text); }
[data-theme] .sidebar-wrapper .search-bar-box .search-show,
[data-theme] .sidebar-wrapper .search-bar-box .search-close { color: var(--t-sidebar-text); }

[data-theme] .topbar { background: var(--t-topbar-bg); border-bottom: 1px solid var(--t-border); box-shadow: var(--t-shadow) !important; }
[data-theme] .topbar .navbar .navbar-nav .nav-link,
[data-theme] .mobile-toggle-menu { color: var(--t-text); }
[data-theme] .user-box { border-left: 1px solid var(--t-border); }
[data-theme] .user-box .user-name { color: var(--t-heading); font-weight: 600; }
[data-theme] .user-box .designattion { color: var(--t-muted); font-size: 12.5px; }
[data-theme] .page-wrapper { background: transparent; }
[data-theme] .page-content { padding-bottom: 4rem; }
[data-theme] .page-footer { background: var(--t-surface); color: var(--t-muted); border-top: 1px solid var(--t-border); font-size: 13px; }
[data-theme] .page-footer a { color: var(--t-muted); }
[data-theme] .wrapper.toggled .overlay { background: #0f172a; opacity: .45; }

/* Breadcrumb bar → light page header strip */
[data-theme] .breadcrumb { background: transparent; padding: .25rem 0; margin-bottom: 1.25rem; border-radius: 0; font-size: 13.5px; }
[data-theme] .breadcrumb-item, [data-theme] .breadcrumb-item a { color: var(--t-muted) !important; }
[data-theme] .breadcrumb-item.active { color: var(--t-heading) !important; font-weight: 600; }
[data-theme] .breadcrumb-item + .breadcrumb-item::before { color: var(--t-border-strong); }

/* ------------------------------------------------------------------ components */

[data-theme] .card { background: var(--t-surface); border: 1px solid var(--t-border); border-radius: 14px; box-shadow: var(--t-shadow); color: var(--t-text); }
[data-theme] .card.border-top.border-4 { border-top: 3px solid var(--t-primary) !important; }
[data-theme] .card-header, [data-theme] .card-footer { background: transparent; border-color: var(--t-border); }
[data-theme] .card-title h5, [data-theme] .card h5 { color: var(--t-heading); }

[data-theme] .table { color: var(--t-text); border-color: var(--t-border); --bs-table-bg: transparent; --bs-table-color: var(--t-text);
    --bs-table-striped-bg: var(--t-surface-2); --bs-table-striped-color: var(--t-text); --bs-table-hover-bg: var(--t-hover); --bs-table-hover-color: var(--t-heading);
    --bs-table-active-bg: var(--t-hover); --bs-table-active-color: var(--t-heading); }
[data-theme] .table > :not(caption) > * > * { border-bottom-color: var(--t-border); }
[data-theme] .table thead th, [data-theme] .table-light, [data-theme] .table-light th { --bs-table-bg: var(--t-surface-2); background-color: var(--t-surface-2); color: var(--t-muted);
    border-color: var(--t-border); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; font-weight: 600; }
[data-theme] .table td { vertical-align: middle; }
[data-theme] .table .ws-col-highlight { background-color: var(--t-primary-soft); color: var(--t-heading); font-weight: 600; }

[data-theme] .form-control, [data-theme] .form-select, [data-theme] .input-group-text {
    background-color: var(--t-input-bg); color: var(--t-text); border: 1px solid var(--t-border-strong); border-radius: 8px; }
[data-theme] .input-group > .form-control, [data-theme] .input-group > .input-group-text { border-radius: 8px; }
[data-theme] .input-group > :not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
[data-theme] .input-group > :not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
[data-theme] .form-control::placeholder { color: var(--t-muted); opacity: .8; }
[data-theme] .form-control:focus, [data-theme] .form-select:focus { background-color: var(--t-input-bg); color: var(--t-heading); border-color: var(--t-primary); box-shadow: 0 0 0 3px var(--t-primary-soft); }
[data-theme] .form-control:disabled, [data-theme] .form-control[readonly] { background-color: var(--t-surface-2); color: var(--t-muted); }
[data-theme] .form-select option { background-color: var(--t-input-bg); color: var(--t-text); }
:where([data-theme]) .form-label, :where([data-theme]) label { color: var(--t-text); font-weight: 500; }
[data-theme] .form-check-input { background-color: var(--t-input-bg); border: 1px solid var(--t-border-strong); }
[data-theme] .form-check-input:checked { background-color: var(--t-primary); border-color: var(--t-primary); }
[data-theme] .form-check-input:focus { box-shadow: 0 0 0 3px var(--t-primary-soft); border-color: var(--t-primary); }
[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(.8); }
[data-theme] .invalid.cred, [data-theme] .invalid-feedback { color: var(--t-danger); }
/* Pages have their own show/hide button; hide Edge's built-in reveal eye */
[data-theme] input[type="password"]::-ms-reveal, [data-theme] input[type="password"]::-ms-clear { display: none; }

[data-theme] .btn { border-radius: 8px; font-weight: 500; }
[data-theme] .btn-primary { background: var(--t-primary); border-color: var(--t-primary); color: #fff; }
[data-theme] .btn-primary:hover, [data-theme] .btn-primary:focus { background: var(--t-primary-hover); border-color: var(--t-primary-hover); color: #fff; }
[data-theme] .btn-light { background: var(--t-surface); border: 1px solid var(--t-border-strong); color: var(--t-text); }
[data-theme] .btn-light:hover, [data-theme] .btn-light:focus { background: var(--t-hover); border-color: var(--t-border-strong); color: var(--t-heading); }
[data-theme] .btn-link { color: var(--t-primary); }
[data-theme] .page-content .btn.btn-link.text-white { color: var(--t-muted) !important; }
[data-theme] .page-content .btn.btn-link.text-white:hover { color: var(--t-primary) !important; }
[data-theme] .btn-close { filter: none; }
[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

[data-theme] .dropdown-menu { background: var(--t-popover); color: var(--t-text); border: 1px solid var(--t-border); box-shadow: var(--t-shadow-lg); }
[data-theme] .dropdown-item { color: var(--t-text); }
[data-theme] .dropdown-item:hover, [data-theme] .dropdown-item:focus { background: var(--t-hover); color: var(--t-heading); }
[data-theme] .dropdown-divider { border-top-color: var(--t-border); }
[data-theme] .topbar .navbar .dropdown-menu::after { background: var(--t-popover); border-color: var(--t-border); }
[data-theme] .dropdown-large .dropdown-menu .dropdown-item { border-bottom-color: var(--t-border); }

[data-theme] .modal-content { background: var(--t-surface); color: var(--t-text); border: 1px solid var(--t-border); border-radius: 14px; box-shadow: var(--t-shadow-lg); }
[data-theme] .modal-header, [data-theme] .modal-footer { border-color: var(--t-border); }
[data-theme] .modal-title { color: var(--t-heading); font-weight: 600; }

[data-theme] .page-link { background: var(--t-surface); color: var(--t-text); border: 1px solid var(--t-border); }
[data-theme] .page-link:hover { background: var(--t-hover); color: var(--t-heading); border-color: var(--t-border); }
[data-theme] .page-link:focus { box-shadow: 0 0 0 3px var(--t-primary-soft); background: var(--t-surface); color: var(--t-heading); }
[data-theme] .page-item.active .page-link { background: var(--t-primary); border-color: var(--t-primary); color: #fff; }
[data-theme] .page-item.disabled .page-link { background: var(--t-surface-2); color: var(--t-muted); border-color: var(--t-border); }
[data-theme] .dataTables_wrapper .dataTables_length, [data-theme] .dataTables_wrapper .dataTables_filter,
[data-theme] .dataTables_wrapper .dataTables_info { color: var(--t-muted); }
[data-theme] .dataTables_wrapper .form-select, [data-theme] .dataTables_wrapper .form-control { border-radius: 8px; }

[data-theme] .alert { border-radius: 12px; box-shadow: var(--t-shadow); }
[data-theme] .alert.success { background-color: var(--t-success); }
[data-theme] .alert.danger { background-color: var(--t-danger); }
[data-theme] .alert-info { background: var(--t-primary-soft); color: var(--t-heading); border: 1px solid var(--t-border); }
[data-theme] .alert-success { background: var(--t-success-soft); color: var(--t-success); border: 1px solid var(--t-border); }
[data-theme] .badge.bg-warning { color: #1f2937 !important; }

[data-theme] .list-group-item { background: var(--t-surface); color: var(--t-text); border-color: var(--t-border); }
[data-theme] .accordion-item { background: var(--t-surface); border-color: var(--t-border); }
[data-theme] .accordion-button { background: var(--t-surface); color: var(--t-heading); border-color: var(--t-border); }
[data-theme] .accordion-button:not(.collapsed) { background: var(--t-primary-soft); color: var(--t-heading); }
[data-theme] .progress { background: var(--t-surface-2); }
[data-theme] .progress-bar { background: var(--t-primary); }
[data-theme] .bg-light, [data-theme] .bg-body { background-color: var(--t-surface-2) !important; }
[data-theme] .border { border-color: var(--t-border) !important; }
[data-theme] .border-top { border-top-color: var(--t-border) !important; }
[data-theme] .border-bottom { border-bottom-color: var(--t-border) !important; }
[data-theme] .border-start { border-left-color: var(--t-border) !important; }
[data-theme] .border-end { border-right-color: var(--t-border) !important; }
[data-theme] .border-white { border-color: var(--t-border) !important; }

/* Select2 (bootstrap4 theme) */
[data-theme] .select2-container--bootstrap4 .select2-selection { background-color: var(--t-input-bg); border: 1px solid var(--t-border-strong); border-radius: 8px; color: var(--t-text); }
[data-theme] .select2-container--bootstrap4.select2-container--focus .select2-selection { border-color: var(--t-primary); box-shadow: 0 0 0 3px var(--t-primary-soft); }
[data-theme] .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered { color: var(--t-text); }
[data-theme] .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice { background: var(--t-primary-soft); border: 0; color: var(--t-heading); border-radius: 6px; }
[data-theme] .select2-container--bootstrap4 .select2-selection--multiple .select2-search__field { color: var(--t-text); }
[data-theme] .select2-container--bootstrap4 .select2-dropdown { background: var(--t-popover); border-color: var(--t-border); color: var(--t-text); box-shadow: var(--t-shadow-lg); }
[data-theme] .select2-container--bootstrap4 .select2-results__option { color: var(--t-text); }
[data-theme] .select2-container--bootstrap4 .select2-results__option--highlighted,
[data-theme] .select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] { background: var(--t-primary); color: #fff; }
[data-theme] .select2-container--bootstrap4 .select2-results__option[aria-selected=true] { background: var(--t-primary-soft); color: var(--t-heading); }
[data-theme] .select2-search--dropdown .select2-search__field { background: var(--t-input-bg); color: var(--t-text); border-color: var(--t-border-strong); }

/* flatpickr */
[data-theme="dark"] .flatpickr-calendar { background: var(--t-popover); box-shadow: var(--t-shadow-lg); }
[data-theme="dark"] .flatpickr-day, [data-theme="dark"] .flatpickr-weekday, [data-theme="dark"] .flatpickr-month,
[data-theme="dark"] .flatpickr-current-month, [data-theme="dark"] .flatpickr-monthDropdown-months { color: var(--t-text); fill: var(--t-text); }

/* Scrollbars */
[data-theme] ::-webkit-scrollbar { width: 10px; height: 10px; }
[data-theme] ::-webkit-scrollbar-thumb { background: var(--t-border-strong); border-radius: 10px; border: 2px solid transparent; background-clip: content-box; }
[data-theme] .sidebar-wrapper ::-webkit-scrollbar-thumb { background: #2a3650; background-clip: content-box; }

/* ------------------------------------------------------------------ login */

[data-theme] .section-authentication-signin { min-height: 100vh; }
[data-theme] .auth-brand { text-align: center; margin-bottom: 1.25rem; }
[data-theme] .auth-brand .auth-logo { display: inline-block; padding: .35rem .9rem; border-radius: 14px; background: #fff; box-shadow: var(--t-shadow-lg); }
[data-theme] .auth-brand .auth-logo img { width: 140px; display: block; }
[data-theme] .auth-brand h4 { margin: .9rem 0 .2rem; font-weight: 600; }
[data-theme] .auth-brand p { color: var(--t-muted); margin: 0; }
[data-theme] .section-authentication-signin .card { border-radius: 16px; box-shadow: var(--t-shadow-lg); }
[data-theme] .section-authentication-signin .border.p-4 { border: 0 !important; padding: .5rem !important; }
[data-theme] .auth-theme-toggle { position: fixed; top: 16px; right: 16px; }
