/* Global theme tokens + time-based dark mode helpers */

:root{
  --ks-surface: #ffffff;
  --ks-surface-2: #f8fafc;
  --ks-text: #0f172a;
  --ks-muted: #64748b;
  --ks-border: rgba(15, 23, 42, .10);
  --ks-shadow: 0 14px 30px rgba(2, 6, 23, .10);
  --ks-radius: 18px;
  --ks-radius-sm: 14px;
  --ks-primary: #2563eb;
  --ks-success: #16a34a;
  --ks-danger: #dc2626;
  --ks-warning: #f59e0b;

  --ks-page-bg: #f6f7fb;
  --ks-page-text: #0f172a;
}

html.ks-theme-dark{
  --ks-surface: rgba(15, 23, 42, .70);
  --ks-surface-2: rgba(15, 23, 42, .55);
  --ks-text: #e5e7eb;
  --ks-muted: rgba(226, 232, 240, .72);
  --ks-border: rgba(148, 163, 184, .18);
  --ks-shadow: 0 20px 60px rgba(0,0,0,.55);
  --ks-primary: #3b82f6;
  --ks-success: #22c55e;
  --ks-danger: #fb7185;
  --ks-warning: #fbbf24;

  --ks-page-bg: #050b16;
  --ks-page-text: #e5e7eb;
}

body{
  background: var(--ks-page-bg);
  color: var(--ks-page-text);
}

/* KPI privacy (hide/reveal) */
.ks-kpi-private{
  position: relative;
  padding-inline-end: 44px;
}
.ks-kpi-private-toggle{
  position: absolute;
  inset-inline-end: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid var(--ks-border);
  background: rgba(255,255,255,.08);
  color: rgba(226,232,240,.90);
  display: inline-grid;
  place-items: center;
}
html:not(.ks-theme-dark) .ks-kpi-private-toggle{
  background: rgba(2,6,23,.05);
  color: rgba(15,23,42,.82);
}
.ks-kpi-private-toggle:hover{ filter: brightness(1.08); }
.ks-kpi-private-toggle:active{ transform: translateY(-50%) scale(.98); }

/* Floating top user menu (glass) */
.ks-floatbar{
  position: fixed;
  top: 12px;
  inset-inline-end: 12px;
  z-index: 1035;
}
.ks-floatbar-inner{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid var(--ks-border);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(14px);
  box-shadow: var(--ks-shadow);
}
.ks-float-btn{
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(2,6,23,.10);
  background: rgba(255,255,255,.85);
  display:grid;
  place-items:center;
  color: rgba(15,23,42,.84);
  text-decoration:none;
}
.ks-avatar-btn{ display:block; text-decoration:none; }
.ks-avatar-btn .avatar{
  width: 38px;
  height: 38px;
}
.ks-avatar-btn .avatar img{
  width: 38px;
  height: 38px;
  object-fit: cover;
}

html.ks-theme-dark .ks-floatbar-inner{
  border-color: rgba(148,163,184,.18);
  background: rgba(2,6,23,.55);
  box-shadow: 0 20px 60px rgba(0,0,0,.55);
}
html.ks-theme-dark .ks-float-btn{
  border-color: rgba(148,163,184,.18);
  background: rgba(15,23,42,.55);
  color: rgba(226,232,240,.92);
}

/* Keep dropdown readable in dark */
html.ks-theme-dark .dropdown-menu{
  background: rgba(15,23,42,.92) !important;
  border-color: rgba(148,163,184,.22) !important;
}
html.ks-theme-dark .dropdown-item{ color: rgba(226,232,240,.86) !important; }
html.ks-theme-dark .dropdown-item:hover{ background: rgba(59,130,246,.12) !important; }

html.ks-theme-dark :focus-visible{
  outline: 2px solid rgba(59,130,246,.9);
  outline-offset: 2px;
}

html.ks-theme-dark .text-muted{ color: var(--ks-muted) !important; }

html.ks-theme-dark .form-control,
html.ks-theme-dark .form-select,
html.ks-theme-dark input,
html.ks-theme-dark textarea{
  background-color: rgba(2,6,23,.35) !important;
  color: rgba(226,232,240,.92) !important;
  border-color: rgba(148,163,184,.22) !important;
}
html.ks-theme-dark .form-control::placeholder,
html.ks-theme-dark input::placeholder,
html.ks-theme-dark textarea::placeholder{
  color: rgba(226,232,240,.55) !important;
}
html.ks-theme-dark .dropdown-menu{
  background: rgba(15,23,42,.92) !important;
  border-color: rgba(148,163,184,.22) !important;
}
html.ks-theme-dark .dropdown-item{ color: rgba(226,232,240,.86) !important; }
html.ks-theme-dark .dropdown-item:hover{ background: rgba(59,130,246,.12) !important; }
html.ks-theme-dark .modal-content{
  background: rgba(15,23,42,.92) !important;
  color: rgba(226,232,240,.92) !important;
  border-color: rgba(148,163,184,.22) !important;
}

/* Dark surfaces for cards, lists, tabs, and badges */
html.ks-theme-dark .card{
  background: var(--ks-surface);
  color: var(--ks-text);
  border-color: var(--ks-border);
  box-shadow: var(--ks-shadow);
}
html.ks-theme-dark .card-header:not([class*="bg-"]),
html.ks-theme-dark .card-footer:not([class*="bg-"]),
html.ks-theme-dark .card-body{
  background: var(--ks-surface);
  color: var(--ks-text);
  border-color: var(--ks-border);
}
html.ks-theme-dark .list-group-item{
  background: rgba(15,23,42,.6);
  color: var(--ks-text);
  border-color: var(--ks-border);
}
html.ks-theme-dark .table,
html.ks-theme-dark .table thead,
html.ks-theme-dark .table tbody,
html.ks-theme-dark .table tr,
html.ks-theme-dark .table th,
html.ks-theme-dark .table td{
  color: var(--ks-text);
  border-color: var(--ks-border);
}
html.ks-theme-dark .bg-light{
  background: rgba(15,23,42,.5) !important;
  color: var(--ks-text) !important;
}
html.ks-theme-dark .bg-light-subtle{
  background: rgba(15,23,42,.45) !important;
  color: var(--ks-text) !important;
}
html.ks-theme-dark .bg-white,
html.ks-theme-dark .bg-body,
html.ks-theme-dark .bg-body-secondary,
html.ks-theme-dark .bg-body-tertiary{
  background: var(--ks-surface) !important;
  color: var(--ks-text) !important;
}
html.ks-theme-dark .nav-pills .nav-link{
  background: rgba(15,23,42,.45);
  color: rgba(226,232,240,.82);
  border: 1px solid rgba(148,163,184,.2);
}
html.ks-theme-dark .nav-pills .nav-link.active{
  background: rgba(59,130,246,.2);
  color: #e2e8f0;
  border-color: rgba(59,130,246,.45);
}
html.ks-theme-dark .badge{
  background: rgba(148,163,184,.2);
  color: #e2e8f0;
  border: 1px solid rgba(148,163,184,.35);
}
html.ks-theme-dark .bg-label-primary{
  background: rgba(56,189,248,.2) !important;
  color: #7dd3fc !important;
  border: 1px solid rgba(56,189,248,.35) !important;
}
html.ks-theme-dark .bg-label-success{
  background: rgba(34,197,94,.2) !important;
  color: #86efac !important;
  border: 1px solid rgba(34,197,94,.35) !important;
}
html.ks-theme-dark .bg-label-danger{
  background: rgba(244,63,94,.2) !important;
  color: #fda4af !important;
  border: 1px solid rgba(244,63,94,.35) !important;
}
html.ks-theme-dark .bg-label-warning{
  background: rgba(245,158,11,.2) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(245,158,11,.35) !important;
}
html.ks-theme-dark .bg-light-primary{
  background: rgba(59,130,246,.16) !important;
  color: #bfdbfe !important;
}
html.ks-theme-dark .bg-light-success{
  background: rgba(34,197,94,.16) !important;
  color: #bbf7d0 !important;
}
html.ks-theme-dark .bg-light-secondary{
  background: rgba(148,163,184,.16) !important;
  color: #e2e8f0 !important;
}
html.ks-theme-dark .bg-light-info{
  background: rgba(14,165,233,.16) !important;
  color: #bae6fd !important;
}
html.ks-theme-dark .bg-light-warning{
  background: rgba(245,158,11,.18) !important;
  color: #fde68a !important;
}
html.ks-theme-dark .bg-light-danger{
  background: rgba(244,63,94,.16) !important;
  color: #fecdd3 !important;
}

html.ks-theme-dark .panel,
html.ks-theme-dark .panel-back,
html.ks-theme-dark .panel-default,
html.ks-theme-dark .jumbotron,
html.ks-theme-dark .well{
  background: var(--ks-surface) !important;
  color: var(--ks-text) !important;
  border-color: var(--ks-border) !important;
}
html.ks-theme-dark .panel-default > .panel-heading,
html.ks-theme-dark .panel-heading{
  background: rgba(15,23,42,.7) !important;
  color: var(--ks-text) !important;
  border-color: var(--ks-border) !important;
}

/* Guest/auth pages */
.ks-auth-body{ background: var(--ks-page-bg); color: var(--ks-page-text); }
.ks-auth-shell{
  min-height: 100vh;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.ks-auth-card{
  width: 100%;
  max-width: 420px;
  border-radius: 18px;
  border: 1px solid var(--ks-border);
  background: var(--ks-surface);
  box-shadow: var(--ks-shadow);
  padding: 18px 16px;
}

/* Hide template customizer panel/gear everywhere */
html.customizer-hide #template-customizer,
html.customizer-hide .template-customizer-open-btn{
  display: none !important;
}

/* Sidebar/menu theme alignment */
html.ks-theme-dark .bg-menu-theme,
html.ks-theme-dark #layout-menu{
  background: rgba(5,11,22,.82) !important;
  border-inline-end: 1px solid rgba(148,163,184,.14);
  backdrop-filter: blur(14px);
}
html.ks-theme-dark .menu-inner-shadow{ background: transparent !important; }
html.ks-theme-dark .menu-link,
html.ks-theme-dark .menu-item a,
html.ks-theme-dark .menu-header-text{
  color: rgba(226,232,240,.82) !important;
}
html.ks-theme-dark .menu-item.active > .menu-link,
html.ks-theme-dark .menu-item.open > .menu-link{
  background: rgba(59,130,246,.14) !important;
  color: rgba(226,232,240,.92) !important;
}
html.ks-theme-dark .menu-item .menu-link:hover{
  background: rgba(59,130,246,.10) !important;
  color: rgba(226,232,240,.92) !important;
}

/* Footer bar (mobile) alignment */
html.ks-theme-dark .ks-footerbar{
  background: rgba(2,6,23,.70) !important;
  border-top: 1px solid rgba(148,163,184,.14) !important;
  backdrop-filter: blur(14px);
}
html.ks-theme-dark .ks-footerbar .btn{
  border-radius: 14px;
}
html.ks-theme-dark .ks-footerbar .btn-outline-secondary{
  border-color: rgba(148,163,184,.28) !important;
  color: rgba(226,232,240,.86) !important;
  background: rgba(2,6,23,.18) !important;
}
html.ks-theme-dark .ks-footerbar .btn-outline-secondary:hover{
  background: rgba(59,130,246,.10) !important;
  border-color: rgba(59,130,246,.22) !important;
  color: rgba(226,232,240,.92) !important;
}

/* Default template footer area (unused, keep dark) */
html.ks-theme-dark .bg-footer-theme,
html.ks-theme-dark .content-footer{
  background: transparent !important;
  border-top-color: rgba(148,163,184,.12) !important;
}