/* ========================================================================== 
   Taskify V16 — 3D Control Center UI
   Theme values are provided by AppearanceSettings. The layer is visual only.
   ========================================================================== */

:root {
  --ui-primary: #5b6cff;
  --ui-secondary: #8b5cf6;
  --ui-accent: #06b6d4;
  --ui-page-background: #eef3ff;
  --ui-sidebar-color: #16213e;
  --ui-card-radius: 22px;
  --ui-shadow-depth: 18px;
  --ui-sidebar-width: 280px;
  --ui-font-scale: 1;
  --ui-text: #162033;
  --ui-heading: #0d1729;
  --ui-muted: #68758d;
  --ui-card: #f8fbff;
  --ui-card-2: #eef3fb;
  --ui-border: rgba(255,255,255,.72);
  --ui-line: rgba(22,32,51,.09);
  --ui-white: #fff;
  --ui-shadow-color: rgba(36, 48, 86, .18);
  --ui-shadow: 0 calc(var(--ui-shadow-depth) * .55) calc(var(--ui-shadow-depth) * 1.55) var(--ui-shadow-color);
  --ui-shadow-soft: 0 8px 22px rgba(35,47,82,.1);
  --ui-inset: inset 0 1px 0 rgba(255,255,255,.88), inset 0 -1px 0 rgba(35,47,82,.06);
}

html.dark-style {
  --ui-text: #d9e5fb;
  --ui-heading: #f6f9ff;
  --ui-muted: #9baccc;
  --ui-card: #131e33;
  --ui-card-2: #0f182a;
  --ui-border: rgba(255,255,255,.08);
  --ui-line: rgba(255,255,255,.08);
  --ui-shadow-color: rgba(0,0,0,.42);
  --ui-inset: inset 0 1px 0 rgba(255,255,255,.07), inset 0 -1px 0 rgba(0,0,0,.25);
}

html { font-size: calc(16px * var(--ui-font-scale)); }
body.tm-theme-v16 {
  color: var(--ui-text);
  background-color: var(--ui-page-background) !important;
  background-image:
    radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--ui-primary) 18%, transparent), transparent 31rem),
    radial-gradient(circle at 98% 18%, color-mix(in srgb, var(--ui-accent) 14%, transparent), transparent 29rem),
    linear-gradient(145deg, color-mix(in srgb, var(--ui-page-background) 94%, #fff), var(--ui-page-background));
  background-attachment: fixed;
}
body.tm-theme-v16.gradients-disabled { background-image: none !important; }
body.tm-theme-v16 *, body.tm-theme-v16 *::before, body.tm-theme-v16 *::after { box-sizing: border-box; }
body.tm-theme-v16 h1, body.tm-theme-v16 h2, body.tm-theme-v16 h3, body.tm-theme-v16 h4, body.tm-theme-v16 h5, body.tm-theme-v16 h6 { color: var(--ui-heading); }
body.tm-theme-v16 .text-muted { color: var(--ui-muted) !important; }
body.tm-theme-v16 a { color: var(--ui-primary); }
body.tm-theme-v16 .layout-wrapper,
body.tm-theme-v16 .layout-container,
body.tm-theme-v16 .layout-page,
body.tm-theme-v16 .content-wrapper { min-width: 0 !important; background: transparent !important; }

/* ---------- shell ---------- */
body.tm-theme-v16 .layout-menu.menu-vertical {
  width: var(--ui-sidebar-width) !important;
  color: #eef4ff !important;
  background:
    radial-gradient(circle at 16% 6%, color-mix(in srgb, var(--ui-primary) 25%, transparent), transparent 15rem),
    linear-gradient(155deg, color-mix(in srgb, var(--ui-sidebar-color) 88%, #27375f), var(--ui-sidebar-color)) !important;
  border: 0 !important;
  border-inline-end: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 18px 0 48px rgba(9,17,36,.18), inset -1px 0 0 rgba(255,255,255,.04) !important;
  padding: 0 12px 18px !important;
  overflow: hidden !important;
}
body.tm-theme-v16.sidebar-glass .layout-menu.menu-vertical {
  background: color-mix(in srgb, var(--ui-sidebar-color) 78%, transparent) !important;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}
body.tm-theme-v16.sidebar-solid .layout-menu.menu-vertical { background: var(--ui-sidebar-color) !important; }

@media (min-width:1200px) {
  body.tm-theme-v16 .layout-menu.menu-vertical {
    position: fixed !important;
    inset-block: 0 !important;
    inset-inline-start: 0 !important;
    height: 100vh !important;
    z-index: 1095 !important;
  }
  body.tm-theme-v16 .layout-page,
  body.tm-theme-v16.layout-menu-fixed:not(.layout-menu-collapsed) .layout-page,
  body.tm-theme-v16.layout-menu-fixed-offcanvas:not(.layout-menu-collapsed) .layout-page {
    width: calc(100% - var(--ui-sidebar-width)) !important;
    margin-inline-start: var(--ui-sidebar-width) !important;
    min-height: 100vh !important;
    padding: 0 !important;
  }
  html.layout-menu-collapsed body.tm-theme-v16 .layout-menu.menu-vertical { width: 86px !important; }
  html.layout-menu-collapsed body.tm-theme-v16 .layout-page { width: calc(100% - 86px) !important; margin-inline-start: 86px !important; }
}

body.tm-theme-v16 .layout-menu .app-brand {
  height: 90px !important;
  min-height: 90px !important;
  padding: 17px 12px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
body.tm-theme-v16 .layout-menu .app-brand-logo img { max-width: 184px !important; max-height: 48px !important; object-fit: contain; }
body.tm-theme-v16 .layout-menu .layout-menu-toggle {
  width: 36px; height: 36px; border-radius: 13px;
  color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.08);
}
body.tm-theme-v16 .layout-menu .btn-group > .btn {
  min-height: 58px !important;
  padding: 10px 14px !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.055)) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  box-shadow: 0 12px 22px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.08) !important;
  color:#fff !important;
}
body.tm-theme-v16 .tm-menu-search {
  min-height: 48px; display:flex; align-items:center; gap:9px; padding:0 14px;
  border-radius:16px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
body.tm-theme-v16 .tm-menu-search i { color:rgba(255,255,255,.76); }
body.tm-theme-v16 .tm-menu-search .form-control { padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; color:#f3f7ff !important; }
body.tm-theme-v16 .tm-menu-search .form-control::placeholder { color:rgba(243,247,255,.55); }
body.tm-theme-v16 .menu-inner { padding: 10px 0 24px !important; }
body.tm-theme-v16 .menu-inner > .dropdown-divider { display:none; }
body.tm-theme-v16 .menu-vertical .menu-item { margin:4px 0; }
body.tm-theme-v16 .menu-vertical .menu-link {
  min-height:48px; padding:11px 14px !important; border-radius:16px !important;
  color:rgba(239,245,255,.78) !important; gap:11px; transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
body.tm-theme-v16 .menu-vertical .menu-link .menu-icon { color:rgba(244,248,255,.9) !important; font-size:1.25rem !important; }
body.tm-theme-v16 .menu-vertical .menu-item.active > .menu-link,
body.tm-theme-v16 .menu-vertical .menu-item.open > .menu-link,
body.tm-theme-v16 .menu-vertical .menu-link:hover {
  color:#fff !important;
  background:linear-gradient(135deg, color-mix(in srgb,var(--ui-primary) 54%, transparent), color-mix(in srgb,var(--ui-secondary) 34%, transparent)) !important;
  box-shadow:0 10px 22px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.1);
  transform:translateY(-1px);
}
body.tm-theme-v16 .menu-sub .menu-link { min-height:41px; padding-inline-start:18px !important; background:transparent !important; border-radius:13px !important; }
body.tm-theme-v16 .menu-sub .menu-item.active > .menu-link,
body.tm-theme-v16 .menu-sub .menu-link:hover { background:rgba(255,255,255,.07) !important; }

/* ---------- top navigation ---------- */
body.tm-theme-v16 #layout-navbar {
  min-height:78px; margin:18px 22px 16px !important; padding:13px 16px !important;
  border-radius:24px !important;
  background:linear-gradient(145deg, color-mix(in srgb,var(--ui-card) 96%,#fff), color-mix(in srgb,var(--ui-card-2) 90%,transparent)) !important;
  border:1px solid var(--ui-border) !important;
  box-shadow:var(--ui-shadow-soft), var(--ui-inset) !important;
}
body.tm-theme-v16 .tm-global-search {
  min-height:52px; flex:1; display:flex; align-items:center; gap:10px; padding:0 16px;
  border-radius:17px; background:color-mix(in srgb,var(--ui-card-2) 74%,#fff); border:1px solid var(--ui-border); box-shadow:var(--ui-inset);
}
body.tm-theme-v16 .tm-header-actions { margin-inline-start:auto; }
body.tm-theme-v16 .tm-nav-icon,
body.tm-theme-v16 .tm-language-button,
body.tm-theme-v16 .tm-user-trigger {
  min-height:52px; border-radius:17px !important; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important;
  border:1px solid var(--ui-border) !important; box-shadow:0 8px 17px rgba(34,46,80,.1), var(--ui-inset) !important;
}
body.tm-theme-v16 .tm-nav-icon { width:52px; display:grid !important; place-items:center; }
body.tm-theme-v16 .tm-language-button, body.tm-theme-v16 .tm-user-trigger { padding:9px 13px !important; display:flex !important; align-items:center; gap:10px; }
body.tm-theme-v16 .tm-nav-icon:hover, body.tm-theme-v16 .tm-language-button:hover, body.tm-theme-v16 .tm-user-trigger:hover { transform:translateY(-2px); box-shadow:0 12px 24px rgba(34,46,80,.14), var(--ui-inset) !important; }

/* ---------- content ---------- */
body.tm-theme-v16 .content-wrapper { padding:0 22px 30px !important; }
body.tm-theme-v16 .container-fluid, body.tm-theme-v16 .container-xxl { padding-inline:0 !important; }
body.tm-theme-v16 .breadcrumb { padding:0; }

/* ---------- universal dimensional surfaces ---------- */
body.tm-theme-v16 .card,
body.tm-theme-v16 .modal-content,
body.tm-theme-v16 .dropdown-menu,
body.tm-theme-v16 .offcanvas,
body.tm-theme-v16 .accordion-item,
body.tm-theme-v16 .statisticsDiv,
body.tm-theme-v16 .kanban-item,
body.tm-theme-v16 .appearance-control-card {
  border-radius:var(--ui-card-radius) !important;
  border:1px solid var(--ui-border) !important;
  background:linear-gradient(145deg, var(--ui-card), var(--ui-card-2)) !important;
  box-shadow:var(--ui-shadow), var(--ui-inset) !important;
}
body.tm-theme-v16.cards-floating .card,
body.tm-theme-v16.cards-floating .statisticsDiv { transform:translateY(-3px); box-shadow:0 calc(var(--ui-shadow-depth) * .8) calc(var(--ui-shadow-depth) * 2) var(--ui-shadow-color), var(--ui-inset) !important; }
body.tm-theme-v16.cards-glass .card,
body.tm-theme-v16.cards-glass .statisticsDiv,
body.tm-theme-v16.cards-glass .modal-content,
body.tm-theme-v16.cards-glass .dropdown-menu { background:color-mix(in srgb,var(--ui-card) 68%,transparent) !important; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
body.tm-theme-v16.cards-flat .card,
body.tm-theme-v16.cards-flat .statisticsDiv { box-shadow:0 2px 8px rgba(34,46,80,.07) !important; }
body.tm-theme-v16.theme-soft3d .card { box-shadow:10px 10px 25px rgba(34,46,80,.11), -8px -8px 22px rgba(255,255,255,.68) !important; }
body.tm-theme-v16.theme-glass3d .card { background:color-mix(in srgb,var(--ui-card) 64%,transparent) !important; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
body.tm-theme-v16.theme-minimal .card { box-shadow:0 8px 18px rgba(34,46,80,.07) !important; }
body.tm-theme-v16 .card-header, body.tm-theme-v16 .card-body, body.tm-theme-v16 .card-footer { background:transparent !important; }
body.tm-theme-v16 .card-header { border-bottom-color:var(--ui-line) !important; }

/* ---------- dashboard 3D ---------- */
body.tm-theme-v16 .tm-dashboard { perspective:1200px; padding-top:4px; }
body.tm-theme-v16 .tm-dashboard-hero {
  position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px;
  padding:29px 31px; border-radius:calc(var(--ui-card-radius) + 5px) !important;
  background:
    radial-gradient(circle at 92% 12%, color-mix(in srgb,var(--ui-primary) 23%,transparent), transparent 19rem),
    radial-gradient(circle at 6% 100%, color-mix(in srgb,var(--ui-accent) 16%,transparent), transparent 17rem),
    linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important;
  border:1px solid var(--ui-border); box-shadow:0 23px 50px rgba(34,46,80,.15), var(--ui-inset);
  transform-style:preserve-3d;
}
body.tm-theme-v16 .tm-dashboard-hero::before {
  content:""; position:absolute; width:210px; height:210px; inset-inline-end:-75px; inset-block-start:-85px; border-radius:50%;
  background:linear-gradient(145deg,color-mix(in srgb,var(--ui-primary) 36%,#fff),color-mix(in srgb,var(--ui-secondary) 28%,transparent));
  filter:blur(1px); box-shadow:0 35px 55px color-mix(in srgb,var(--ui-primary) 18%,transparent); transform:translateZ(-20px);
}
body.tm-theme-v16 .tm-dashboard-copy, body.tm-theme-v16 .tm-dashboard-actions { position:relative; z-index:1; }
body.tm-theme-v16 .tm-dashboard-eyebrow { display:inline-flex; align-items:center; gap:8px; padding:8px 13px; border-radius:999px; background:color-mix(in srgb,var(--ui-card) 78%,transparent); border:1px solid var(--ui-border); color:var(--ui-muted); font-weight:700; }
body.tm-theme-v16 .tm-dashboard-copy h2 { margin:14px 0 9px; font-size:clamp(1.55rem,1.2rem + 1.1vw,2.3rem); font-weight:800; line-height:1.25; }
body.tm-theme-v16 .tm-dashboard-copy p { margin:0; color:var(--ui-muted); max-width:760px; font-size:1rem; }
body.tm-theme-v16 .tm-dashboard-actions { display:flex; align-items:flex-start; gap:11px; flex-wrap:wrap; }

body.tm-theme-v16 .tm-kpi-grid { margin-top:22px; }
body.tm-theme-v16 .tm-metric-card {
  position:relative; overflow:hidden; transform-style:preserve-3d; transition:transform .22s ease, box-shadow .22s ease;
  background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important;
}
body.tm-theme-v16 .tm-metric-card::before {
  content:""; position:absolute; inset-inline-start:0; inset-block-start:0; width:7px; height:100%;
  background:linear-gradient(180deg,var(--ui-primary),var(--ui-accent)); box-shadow:2px 0 13px color-mix(in srgb,var(--ui-primary) 22%,transparent);
}
body.tm-theme-v16 .tm-metric-card::after {
  content:""; position:absolute; width:120px; height:120px; border-radius:50%; inset-inline-end:-48px; inset-block-start:-48px;
  background:radial-gradient(circle,color-mix(in srgb,var(--ui-primary) 16%,transparent),transparent 69%); transform:translateZ(-15px);
}
body.tm-theme-v16.motion-3d-enabled .tm-metric-card:hover { transform:translateY(-7px) rotateX(1.4deg); box-shadow:0 27px 52px rgba(34,46,80,.18), var(--ui-inset) !important; }
body.tm-theme-v16 .tm-metric-card .card-body { padding:24px 22px 20px !important; }
body.tm-theme-v16 .tm-metric-head { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; }
body.tm-theme-v16 .tm-kpi-label { color:var(--ui-muted); font-weight:700; }
body.tm-theme-v16 .tm-metric-main h3 { margin:8px 0 0; font-size:clamp(1.9rem,1.25rem + 1.2vw,2.55rem); font-weight:800; }
body.tm-theme-v16 .tm-kpi-icon { width:60px; height:60px; border-radius:20px; display:grid; place-items:center; background:linear-gradient(145deg,color-mix(in srgb,var(--ui-primary) 14%,var(--ui-card)),var(--ui-card)); border:1px solid var(--ui-border); box-shadow:8px 9px 18px rgba(34,46,80,.1),-5px -5px 15px rgba(255,255,255,.55); transform:translateZ(16px); }
body.tm-theme-v16 .tm-kpi-icon i { color:var(--ui-primary) !important; font-size:1.55rem !important; }
body.tm-theme-v16 .tm-metric-footer { display:flex; align-items:center; justify-content:space-between; margin-top:22px; padding-top:16px; border-top:1px solid var(--ui-line); }
body.tm-theme-v16 .tm-kpi-link { display:inline-flex; align-items:center; gap:6px; color:var(--ui-primary) !important; font-weight:700; }
body.tm-theme-v16 .tm-metric-status { width:34px; height:34px; display:grid; place-items:center; border-radius:12px; background:color-mix(in srgb,var(--ui-card-2) 80%,#fff); color:var(--ui-muted); }

/* ---------- buttons ---------- */
body.tm-theme-v16 .btn { min-height:42px; border-radius:14px !important; font-weight:700; transition:transform .18s ease,box-shadow .18s ease,filter .18s ease; }
body.tm-theme-v16.buttons-pill .btn { border-radius:999px !important; }
body.tm-theme-v16.buttons-square .btn { border-radius:8px !important; }
body.tm-theme-v16 .btn-primary, body.tm-theme-v16 .btn.btn-primary {
  color:#fff !important; border:0 !important;
  background:linear-gradient(145deg,var(--ui-primary),var(--ui-secondary)) !important;
  box-shadow:0 12px 22px color-mix(in srgb,var(--ui-primary) 28%,transparent), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
body.tm-theme-v16 .btn-primary:hover { transform:translateY(-2px); filter:saturate(1.08); box-shadow:0 16px 28px color-mix(in srgb,var(--ui-primary) 32%,transparent) !important; }
body.tm-theme-v16 .btn-outline-primary, body.tm-theme-v16 .btn-outline-secondary, body.tm-theme-v16 .btn-light, body.tm-theme-v16 .btn-secondary, body.tm-theme-v16 .tm-ghost {
  color:var(--ui-heading) !important; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important; border:1px solid var(--ui-border) !important; box-shadow:0 7px 15px rgba(34,46,80,.09),var(--ui-inset) !important;
}

/* ---------- forms ---------- */
body.tm-theme-v16 .form-control,
body.tm-theme-v16 .form-select,
body.tm-theme-v16 .input-group-text,
body.tm-theme-v16 .select2-container--default .select2-selection--single,
body.tm-theme-v16 .select2-container--default .select2-selection--multiple,
body.tm-theme-v16 .dropzone {
  min-height:46px; color:var(--ui-text) !important; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important;
  border:1px solid var(--ui-border) !important; border-radius:14px !important; box-shadow:inset 2px 2px 5px rgba(34,46,80,.07),inset -2px -2px 5px rgba(255,255,255,.65) !important;
}
body.tm-theme-v16 textarea.form-control { min-height:110px; }
body.tm-theme-v16 .form-control:focus,
body.tm-theme-v16 .form-select:focus,
body.tm-theme-v16 .select2-container--default.select2-container--focus .select2-selection--multiple,
body.tm-theme-v16 .select2-container--default.select2-container--open .select2-selection--single {
  border-color:color-mix(in srgb,var(--ui-primary) 60%,#fff) !important; box-shadow:0 0 0 4px color-mix(in srgb,var(--ui-primary) 14%,transparent),inset 1px 1px 3px rgba(34,46,80,.05) !important;
}
body.tm-theme-v16 .form-check-input:checked { background-color:var(--ui-primary); border-color:var(--ui-primary); }

/* ---------- tables ---------- */
body.tm-theme-v16 .table-responsive, body.tm-theme-v16 .fixed-table-container { border-radius:calc(var(--ui-card-radius) - 5px); overflow:hidden; }
body.tm-theme-v16 .table, body.tm-theme-v16 table { color:var(--ui-text) !important; }
body.tm-theme-v16 .table thead th, body.tm-theme-v16 table thead th { padding-top:15px; padding-bottom:15px; color:var(--ui-heading) !important; background:color-mix(in srgb,var(--ui-card-2) 82%,#fff) !important; border-bottom:1px solid var(--ui-line) !important; font-weight:800; white-space:nowrap; }
body.tm-theme-v16 .table > :not(caption) > * > *, body.tm-theme-v16 table > :not(caption) > * > * { border-bottom-color:var(--ui-line) !important; }
body.tm-theme-v16 .table tbody tr { transition:background .16s ease,transform .16s ease; }
body.tm-theme-v16 .table tbody tr:hover { background:color-mix(in srgb,var(--ui-primary) 5%,transparent) !important; }

/* ---------- popovers, dropdowns, modal ---------- */
body.tm-theme-v16 .dropdown-menu, body.tm-theme-v16 .modal-content { background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)) !important; }
body.tm-theme-v16 .dropdown-menu { padding:8px; }
body.tm-theme-v16 .dropdown-item { width:auto; margin:3px 0; padding:10px 12px; border-radius:12px; }
body.tm-theme-v16 .dropdown-item:hover, body.tm-theme-v16 .dropdown-item:focus { color:var(--ui-heading) !important; background:color-mix(in srgb,var(--ui-primary) 10%,transparent) !important; }
body.tm-theme-v16 .modal-header, body.tm-theme-v16 .modal-footer { border-color:var(--ui-line) !important; }
body.tm-theme-v16 .nav-pills .nav-link, body.tm-theme-v16 .nav-tabs .nav-link { border-radius:13px !important; color:var(--ui-muted); }
body.tm-theme-v16 .nav-pills .nav-link.active, body.tm-theme-v16 .nav-tabs .nav-link.active { color:#fff !important; background:linear-gradient(145deg,var(--ui-primary),var(--ui-secondary)) !important; box-shadow:0 9px 17px color-mix(in srgb,var(--ui-primary) 22%,transparent); }
body.tm-theme-v16 .badge.bg-primary, body.tm-theme-v16 .bg-primary { background-color:var(--ui-primary) !important; }

/* ---------- floating tools ---------- */
body.tm-theme-v16 .chat-img, body.tm-theme-v16 .timer-img { width:56px !important; height:56px !important; padding:10px; border-radius:19px; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)); border:1px solid var(--ui-border); box-shadow:0 15px 29px rgba(34,46,80,.16),var(--ui-inset); }
html[dir="rtl"] body.tm-theme-v16 .chat-img, html[dir="rtl"] body.tm-theme-v16 .timer-img { left:18px; right:auto; }

/* ---------- density ---------- */
body.tm-theme-v16.density-compact .card-body { padding-block:16px !important; }
body.tm-theme-v16.density-compact .menu-vertical .menu-link { min-height:42px; padding-block:8px !important; }
body.tm-theme-v16.density-spacious .card-body { padding-block:28px !important; }
body.tm-theme-v16.density-spacious .menu-vertical .menu-link { min-height:54px; }

/* ---------- appearance settings ---------- */
body.tm-theme-v16 .appearance-page-head { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; margin:8px 0 22px; }
body.tm-theme-v16 .appearance-page-head h3 { margin:0 0 7px; font-weight:800; }
body.tm-theme-v16 .appearance-page-head p { margin:0; color:var(--ui-muted); }
body.tm-theme-v16 .appearance-section-title { display:flex; align-items:flex-start; gap:13px; margin-bottom:20px; }
body.tm-theme-v16 .appearance-section-title h5 { margin:0 0 4px; font-weight:800; }
body.tm-theme-v16 .appearance-section-title p { margin:0; color:var(--ui-muted); }
body.tm-theme-v16 .appearance-section-icon { width:44px; height:44px; flex:0 0 44px; display:grid; place-items:center; border-radius:15px; color:var(--ui-primary); background:linear-gradient(145deg,color-mix(in srgb,var(--ui-primary) 13%,var(--ui-card)),var(--ui-card)); border:1px solid var(--ui-border); box-shadow:5px 6px 13px rgba(34,46,80,.09),-4px -4px 11px rgba(255,255,255,.6); font-size:1.25rem; }
body.tm-theme-v16 .theme-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
body.tm-theme-v16 .theme-choice { position:relative; cursor:pointer; min-height:140px; padding:18px; display:flex; flex-direction:column; align-items:flex-start; gap:7px; border-radius:18px; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)); border:1px solid var(--ui-border); box-shadow:7px 8px 16px rgba(34,46,80,.09),-5px -5px 13px rgba(255,255,255,.58); transition:.18s ease; }
body.tm-theme-v16 .theme-choice:hover { transform:translateY(-3px); }
body.tm-theme-v16 .theme-choice.is-selected { border-color:color-mix(in srgb,var(--ui-primary) 55%,#fff); box-shadow:0 0 0 4px color-mix(in srgb,var(--ui-primary) 12%,transparent),8px 12px 22px rgba(34,46,80,.12); }
body.tm-theme-v16 .theme-choice input { position:absolute; opacity:0; pointer-events:none; }
body.tm-theme-v16 .theme-choice-icon { width:43px; height:43px; display:grid; place-items:center; border-radius:14px; color:#fff; background:linear-gradient(145deg,var(--ui-primary),var(--ui-secondary)); box-shadow:0 8px 16px color-mix(in srgb,var(--ui-primary) 24%,transparent); }
body.tm-theme-v16 .theme-choice strong { color:var(--ui-heading); font-size:1rem; }
body.tm-theme-v16 .theme-choice small { color:var(--ui-muted); line-height:1.6; }
body.tm-theme-v16 .appearance-color-input { display:grid; grid-template-columns:52px minmax(0,1fr); gap:9px; }
body.tm-theme-v16 .appearance-color-input .form-control-color { width:52px; padding:5px !important; }
body.tm-theme-v16 .appearance-range-row { display:grid; grid-template-columns:minmax(150px,1fr) minmax(180px,1.4fr) 64px; align-items:center; gap:15px; padding:15px 0; border-bottom:1px solid var(--ui-line); }
body.tm-theme-v16 .appearance-range-row label { display:block; color:var(--ui-heading); font-weight:700; }
body.tm-theme-v16 .appearance-range-row small { color:var(--ui-muted); }
body.tm-theme-v16 .appearance-range-row output { padding:7px 8px; border-radius:10px; text-align:center; background:var(--ui-card-2); color:var(--ui-heading); font-weight:700; }
body.tm-theme-v16 input[type="range"] { accent-color:var(--ui-primary); }
body.tm-theme-v16 .appearance-switch-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.tm-theme-v16 .appearance-switch-card { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px; border-radius:17px; background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2)); border:1px solid var(--ui-border); box-shadow:var(--ui-shadow-soft),var(--ui-inset); }
body.tm-theme-v16 .appearance-switch-card strong, body.tm-theme-v16 .appearance-switch-card small { display:block; }
body.tm-theme-v16 .appearance-switch-card small { margin-top:4px; color:var(--ui-muted); line-height:1.5; }
body.tm-theme-v16 .appearance-preview-sticky { position:sticky; top:18px; }
body.tm-theme-v16 .appearance-preview-label { display:flex; justify-content:space-between; gap:10px; margin-bottom:12px; color:var(--ui-muted); }
body.tm-theme-v16 .appearance-preview-label span { color:var(--ui-heading); font-weight:800; }
body.tm-theme-v16 .appearance-live-preview { --preview-primary:var(--ui-primary); --preview-secondary:var(--ui-secondary); --preview-accent:var(--ui-accent); display:grid; grid-template-columns:80px minmax(0,1fr); min-height:470px; overflow:hidden; border-radius:28px; background:var(--ui-page-background); border:1px solid var(--ui-border); box-shadow:0 30px 60px rgba(34,46,80,.2),var(--ui-inset); perspective:900px; }
body.tm-theme-v16 .preview-sidebar { padding:18px 11px; background:linear-gradient(160deg,var(--ui-sidebar-color),color-mix(in srgb,var(--ui-sidebar-color) 76%,var(--ui-primary))); box-shadow:10px 0 24px rgba(20,28,55,.2); }
body.tm-theme-v16 .preview-logo { display:flex; align-items:center; gap:6px; margin-bottom:26px; }
body.tm-theme-v16 .preview-logo span { width:25px;height:25px;border-radius:9px;background:linear-gradient(145deg,var(--ui-primary),var(--ui-accent));box-shadow:0 7px 13px color-mix(in srgb,var(--ui-primary) 30%,transparent); }
body.tm-theme-v16 .preview-logo b { width:26px;height:7px;border-radius:999px;background:rgba(255,255,255,.75); }
body.tm-theme-v16 .preview-menu-item { height:36px;margin:8px 0;border-radius:12px;display:flex;align-items:center;gap:7px;padding:8px;background:transparent; }
body.tm-theme-v16 .preview-menu-item.active { background:rgba(255,255,255,.13);box-shadow:0 8px 13px rgba(0,0,0,.12); }
body.tm-theme-v16 .preview-menu-item i { width:11px;height:11px;border-radius:4px;background:rgba(255,255,255,.75); }
body.tm-theme-v16 .preview-menu-item span { width:30px;height:5px;border-radius:999px;background:rgba(255,255,255,.48); }
body.tm-theme-v16 .preview-main { padding:16px; min-width:0; }
body.tm-theme-v16 .preview-topbar { display:flex;align-items:center;justify-content:space-between;margin-bottom:15px; }
body.tm-theme-v16 .preview-search { width:52%;height:27px;border-radius:10px;background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2));box-shadow:4px 5px 9px rgba(34,46,80,.08); }
body.tm-theme-v16 .preview-avatar { width:29px;height:29px;border-radius:10px;background:linear-gradient(145deg,var(--ui-primary),var(--ui-secondary));box-shadow:0 7px 13px color-mix(in srgb,var(--ui-primary) 22%,transparent); }
body.tm-theme-v16 .preview-hero { display:flex;justify-content:space-between;gap:12px;min-height:104px;padding:17px;border-radius:18px;background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2));box-shadow:8px 11px 20px rgba(34,46,80,.12),-5px -5px 13px rgba(255,255,255,.56); }
body.tm-theme-v16 .preview-hero small,body.tm-theme-v16 .preview-hero h4,body.tm-theme-v16 .preview-hero p { display:block;border-radius:999px;background:color-mix(in srgb,var(--ui-primary) 12%,var(--ui-card-2)); }
body.tm-theme-v16 .preview-hero small { width:52px;height:6px; }.preview-hero h4{width:112px;height:12px;margin:10px 0 8px}.preview-hero p{width:145px;height:6px}.preview-hero button{width:42px;height:34px;border:0;border-radius:12px;background:linear-gradient(145deg,var(--ui-primary),var(--ui-secondary));box-shadow:0 8px 13px color-mix(in srgb,var(--ui-primary) 22%,transparent)}
body.tm-theme-v16 .preview-kpis { display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0; }
body.tm-theme-v16 .preview-kpi { min-width:0;padding:11px 9px;border-radius:14px;background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2));box-shadow:5px 7px 12px rgba(34,46,80,.1),-3px -3px 9px rgba(255,255,255,.55); }
body.tm-theme-v16 .preview-kpi span{display:block;width:19px;height:19px;border-radius:7px;background:linear-gradient(145deg,var(--ui-primary),var(--ui-accent));}.preview-kpi strong{display:block;margin:8px 0 5px;color:var(--ui-heading);font-size:12px}.preview-kpi small{display:block;width:80%;height:4px;border-radius:999px;background:var(--ui-line)}
body.tm-theme-v16 .preview-panels { display:grid;grid-template-columns:1.3fr .7fr;gap:9px; }
body.tm-theme-v16 .preview-chart,body.tm-theme-v16 .preview-list { min-height:150px;padding:13px;border-radius:15px;background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2));box-shadow:5px 7px 12px rgba(34,46,80,.1),-3px -3px 9px rgba(255,255,255,.55); }
body.tm-theme-v16 .preview-chart { display:flex;align-items:flex-end;gap:6px;position:relative; }.preview-chart b{position:absolute;top:13px;left:13px;width:55px;height:6px;border-radius:999px;background:var(--ui-line)}.preview-chart i{display:block;flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--ui-primary),var(--ui-accent));opacity:.75}.preview-list span{display:flex;align-items:center;gap:7px;padding:8px 0;border-bottom:1px solid var(--ui-line)}.preview-list span:last-child{border:0}.preview-list i{width:18px;height:18px;border-radius:7px;background:color-mix(in srgb,var(--ui-primary) 18%,var(--ui-card))}.preview-list b{width:55%;height:5px;border-radius:999px;background:var(--ui-line)}
body.tm-theme-v16 .appearance-save-bar { display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:15px;padding:16px 18px;border-radius:19px;background:linear-gradient(145deg,var(--ui-card),var(--ui-card-2));border:1px solid var(--ui-border);box-shadow:var(--ui-shadow-soft),var(--ui-inset); }.appearance-save-bar strong,.appearance-save-bar small{display:block}.appearance-save-bar small{margin-top:3px;color:var(--ui-muted)}

/* ---------- RTL ---------- */
html[dir="rtl"] body.tm-theme-v16 .tm-header-actions { margin-inline-start:0; margin-inline-end:auto; }
html[dir="rtl"] body.tm-theme-v16 .tm-kpi-link i, html[dir="rtl"] body.tm-theme-v16 .bx-right-arrow-alt { transform:rotate(180deg); }

/* ---------- responsive ---------- */
@media (max-width:1199.98px) {
  body.tm-theme-v16 #layout-navbar { margin:14px 14px 15px !important; }
  body.tm-theme-v16 .content-wrapper { padding:0 14px 24px !important; }
  body.tm-theme-v16 .tm-dashboard-hero { grid-template-columns:1fr; padding:24px; }
  body.tm-theme-v16 .appearance-preview-sticky { position:static; }
}
@media (max-width:767.98px) {
  body.tm-theme-v16 #layout-navbar { min-height:68px; padding:10px 12px !important; border-radius:19px !important; }
  body.tm-theme-v16 .tm-global-search { display:none; }
  body.tm-theme-v16 .tm-user-meta, body.tm-theme-v16 .tm-language-button .language-name { display:none !important; }
  body.tm-theme-v16 .content-wrapper { padding-inline:12px !important; }
  body.tm-theme-v16 .tm-dashboard-hero { padding:21px 18px; border-radius:21px !important; }
  body.tm-theme-v16 .tm-dashboard-actions { width:100%; }
  body.tm-theme-v16 .tm-dashboard-actions .btn { flex:1; }
  body.tm-theme-v16 .appearance-page-head { align-items:flex-start; flex-direction:column; }
  body.tm-theme-v16 .theme-choice-grid,body.tm-theme-v16 .appearance-switch-grid { grid-template-columns:1fr; }
  body.tm-theme-v16 .appearance-range-row { grid-template-columns:1fr 62px; }
  body.tm-theme-v16 .appearance-range-row input { grid-column:1/-1; grid-row:2; }
  body.tm-theme-v16 .appearance-live-preview { grid-template-columns:65px minmax(0,1fr); min-height:390px; }
  body.tm-theme-v16 .preview-kpis { grid-template-columns:repeat(2,1fr); }
  body.tm-theme-v16 .preview-panels { grid-template-columns:1fr; }
  body.tm-theme-v16 .preview-list { display:none; }
  body.tm-theme-v16 .appearance-save-bar { align-items:stretch; flex-direction:column; }
  body.tm-theme-v16 .appearance-save-bar .btn { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  body.tm-theme-v16 *,body.tm-theme-v16 *::before,body.tm-theme-v16 *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}
