/**
 * KKT Times admin theme.
 * Tokens come from <x-brand-theme /> (:root --primary, --sidebar, …).
 */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
:root {
  --page-header-offset: 56px;
  --kkt-sidebar-width: 265px;
}
body,
.page-wrapper,
.dd-app-shell {
  color: var(--text-primary, #101828);
  background-color: var(--background, #F5F7FA) !important;
  font-family: var(--font-ui), var(--font-hindi), sans-serif;
  font-size: 14px;
  font-weight: 400;
}
h1, .dd-page-header h1 { font-size: 28px; font-weight: 700; color: var(--text-primary) !important; }
h2, .dd-page-header h2 { font-size: 20px; font-weight: 600; color: var(--text-primary) !important; }
h3, .dd-page-header h3 { font-size: 16px; font-weight: 600; color: var(--text-primary) !important; }
.dd-page-header h4,
.page-title h4 {
  font-size: 20px;
  font-weight: 600;
  color: var(--text-primary) !important;
}

/* Header */
.page-header {
  background: var(--surface, #fff) !important;
  color: var(--text-primary);
  border-bottom: 1px solid var(--border, #EAECF0) !important;
  box-shadow: none !important;
  z-index: 1050 !important;
}
.page-header h4,
.page-header .f-w-600,
.page-header .welcome-content,
.page-header .header-wrapper {
  color: var(--text-primary) !important;
  font-family: var(--font-ui), var(--font-hindi), sans-serif;
}
.page-header .welcome-content span {
  color: var(--text-secondary, #667085) !important;
  font-size: 12px;
  font-weight: 500;
}

/* Canvas */
.page-body.dd-page-body {
  min-height: 100%;
  background-color: var(--background, #F5F7FA) !important;
  color: var(--text-primary);
}
.dd-app-slot h1,
.dd-app-slot h2,
.dd-app-slot h3,
.dd-page-header h1,
.dd-page-header h2,
.dd-page-header h3 {
  color: var(--text-primary) !important;
}
.dd-app-slot p,
.dd-app-slot .text-gray-800,
.dd-app-slot .text-gray-600 {
  color: var(--text-primary) !important;
}
.dd-app-slot .text-muted,
.dd-app-slot .text-gray-500,
.dd-app-slot .text-gray-400 {
  color: var(--text-secondary, #667085) !important;
}
.dd-app-slot .bg-white {
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #EAECF0);
}

/* Cards */
.page-body .card,
.card {
  color: var(--text-primary);
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #EAECF0) !important;
  border-radius: var(--radius, 10px) !important;
  box-shadow: none !important;
}
.page-body .card h4,
.page-body .card h5,
.page-body .card h6,
.page-title h4,
.breadcrumb {
  color: var(--text-primary) !important;
}
.card-header {
  background: var(--surface, #fff) !important;
  border-bottom: 1px solid var(--border, #EAECF0) !important;
  font-size: 16px;
  font-weight: 600;
}
.breadcrumb-item a { color: var(--primary) !important; }
.breadcrumb-item.active { color: var(--text-secondary) !important; }

/* Footer */
.footer {
  background: var(--surface, #fff) !important;
  color: var(--text-secondary) !important;
  border-top: 1px solid var(--border, #EAECF0);
  box-shadow: none !important;
}
.footer a { color: var(--primary); }

/* Sidebar: 265px navy, square edge, white type, red active */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper {
  width: var(--kkt-sidebar-width, 265px);
  background: var(--sidebar, #101828) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.page-wrapper.compact-wrapper .page-header {
  margin-left: var(--kkt-sidebar-width, 265px);
  width: calc(100% - var(--kkt-sidebar-width, 265px));
}
.page-wrapper.compact-wrapper .page-body-wrapper .page-body,
.page-wrapper.compact-wrapper .page-body-wrapper footer {
  margin-left: var(--kkt-sidebar-width, 265px);
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ .page-body,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon ~ footer,
.page-wrapper.compact-wrapper .page-header.close_icon {
  margin-left: 0;
  width: 100%;
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main,
.page-wrapper.compact-wrapper .sidebar-links,
.page-wrapper.compact-wrapper #sidebar-menu {
  background: var(--sidebar, #101828) !important;
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-icon-wrapper {
  background: var(--sidebar, #101828) !important;
  box-shadow: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0 !important;
  padding: 16px 20px;
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-icon-wrapper {
  align-items: center;
  min-height: 0;
  overflow: hidden;
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-wrapper a,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .logo-icon-wrapper a {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  text-decoration: none;
}
.kkt-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.kkt-sidebar-brand__mark {
  width: 36px;
  height: 36px;
  object-fit: contain;
  flex-shrink: 0;
}
.kkt-sidebar-brand__name {
  font-family: var(--font-ui), sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #fff;
  line-height: 1.2;
  white-space: nowrap;
}
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper .logo-wrapper img,
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper .logo-icon-wrapper img,
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper li.back-btn a img {
  max-width: 36px;
  max-height: 36px;
  width: 36px;
  height: 36px;
  object-fit: contain;
}
.page-wrapper.compact-wrapper .page-body-wrapper .sidebar-wrapper.close_icon .logo-icon-wrapper img {
  max-height: 32px;
  max-width: 32px;
  margin-left: auto;
}
.page-header .header-logo-wrapper .logo-wrapper img {
  max-height: 36px;
  max-width: 160px;
  width: auto;
  object-fit: contain;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-content > li .sidebar-link,
.page-wrapper.compact-wrapper .sidebar-link,
.page-wrapper.compact-wrapper .sidebar-title {
  color: rgba(255, 255, 255, 0.82) !important;
  font-family: var(--font-ui), var(--font-hindi), sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.01em;
  border-radius: 8px;
}
.page-wrapper.compact-wrapper .sidebar-main-title {
  margin-top: 14px;
}
.page-wrapper.compact-wrapper .sidebar-main-title h6 {
  color: rgba(255, 255, 255, 0.42) !important;
  font-family: var(--font-ui), sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a svg,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a svg.stroke-icon,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a svg.fill-icon {
  stroke: rgba(255, 255, 255, 0.82) !important;
  fill: rgba(255, 255, 255, 0.82) !important;
}
.page-wrapper.compact-wrapper .sidebar-list:hover > .sidebar-link,
.page-wrapper.compact-wrapper .sidebar-link:hover {
  background: var(--sidebar-hover, #1D2939) !important;
  color: #fff !important;
}
.page-wrapper.compact-wrapper .sidebar-list.active > .sidebar-link,
.page-wrapper.compact-wrapper .sidebar-link.active,
.page-wrapper.compact-wrapper .sidebar-title.active {
  background: color-mix(in srgb, var(--primary, #C8102E) 18%, var(--sidebar, #101828)) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 var(--primary, #C8102E);
}
.page-wrapper.compact-wrapper .sidebar-list.active > .sidebar-link svg,
.page-wrapper.compact-wrapper .sidebar-link.active svg {
  stroke: #fff !important;
  fill: #fff !important;
}
.page-wrapper.compact-wrapper .sidebar-submenu {
  background: rgba(0, 0, 0, 0.18) !important;
}
.page-wrapper.compact-wrapper .sidebar-submenu a {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 13px;
}
.page-wrapper.compact-wrapper .sidebar-submenu a:hover,
.page-wrapper.compact-wrapper .sidebar-submenu a.active {
  color: #fff !important;
  background: var(--sidebar-hover, #1D2939) !important;
}
.page-wrapper.compact-wrapper .toggle-sidebar,
.page-wrapper.compact-wrapper .back-btn i,
.page-wrapper.compact-wrapper .logo-wrapper .back-btn,
.page-wrapper.compact-wrapper .logo-wrapper .toggle-sidebar {
  color: #fff !important;
}
.page-wrapper.compact-wrapper .logo-wrapper .toggle-sidebar svg,
.page-wrapper.compact-wrapper .logo-wrapper .back-btn i {
  stroke: #fff !important;
  color: #fff !important;
}

/* Buttons */
.btn {
  font-size: 14px;
  font-weight: 600;
  border-radius: 8px;
}
.btn-primary,
.login-page .login-page__btn,
.login-page button[type="submit"].btn {
  background: var(--primary, #C8102E) !important;
  background-color: var(--primary, #C8102E) !important;
  border-color: var(--primary, #C8102E) !important;
  color: #fff !important;
}
.login-page .login-page__btn,
.login-page button[type="submit"].btn {
  display: block;
  width: 100%;
}
.btn-primary:hover,
.btn-primary:focus {
  background: var(--primary-hover, #A50D26) !important;
  border-color: var(--primary-hover, #A50D26) !important;
  color: #fff !important;
}
.btn-light,
.btn-outline-secondary,
.btn-outline-primary {
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #EAECF0) !important;
  color: var(--text-primary, #101828) !important;
}
.btn-outline-primary:hover,
.btn-light:hover,
.btn-outline-secondary:hover {
  background: var(--background, #F5F7FA) !important;
  border-color: var(--border, #EAECF0) !important;
  color: var(--text-primary) !important;
}
.btn-outline-danger,
.btn-danger {
  color: var(--error, #D92D20) !important;
}
.btn-outline-danger {
  background: var(--surface, #fff) !important;
  border-color: color-mix(in srgb, var(--error, #D92D20) 35%, white) !important;
}
.btn-danger {
  background: var(--error, #D92D20) !important;
  border-color: var(--error, #D92D20) !important;
  color: #fff !important;
}

/* Tables */
.table,
.dd-admin-table {
  font-size: 14px;
  font-weight: 400;
  color: var(--text-primary);
}
.table thead th {
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-color: var(--border, #EAECF0) !important;
  background: var(--surface, #fff) !important;
}
.form-label {
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary);
}
.form-control,
.form-select {
  font-size: 14px;
  border-color: var(--border, #EAECF0);
  border-radius: 8px;
  color: var(--text-primary);
}
.form-control:focus,
.form-select:focus {
  border-color: var(--primary, #C8102E);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #C8102E) 18%, transparent);
}

/* Status badges */
.kkt-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.01em;
}
.kkt-badge--published { background: color-mix(in srgb, var(--success, #12B76A) 16%, white); color: #027a48; }
.kkt-badge--draft { background: #F2F4F7; color: var(--text-secondary, #667085); }
.kkt-badge--scheduled { background: color-mix(in srgb, var(--info, #2E90FA) 16%, white); color: #175cd3; }
.kkt-badge--pending { background: color-mix(in srgb, var(--warning, #F79009) 16%, white); color: #b54708; }
.kkt-badge--breaking { background: var(--primary, #C8102E); color: #fff; }
.badge.text-bg-success,
.badge.bg-success { background: color-mix(in srgb, var(--success, #12B76A) 16%, white) !important; color: #027a48 !important; }
.badge.text-bg-warning,
.badge.bg-warning { background: color-mix(in srgb, var(--warning, #F79009) 16%, white) !important; color: #b54708 !important; }
.badge.text-bg-primary { background: var(--primary, #C8102E) !important; color: #fff !important; }

/* Breadcrumbs */
.dd-breadcrumbs .breadcrumb {
  background: transparent;
  padding-left: 0;
  padding-right: 0;
}
.dd-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
  color: var(--text-secondary, #667085);
}
.dd-breadcrumbs-bar {
  border-color: var(--border, #EAECF0) !important;
}
.dd-guest-breadcrumb {
  background: var(--surface, #fff) !important;
  border-color: var(--border, #EAECF0) !important;
}

@media (max-width: 991.98px) {
  .page-wrapper.compact-wrapper .page-header,
  .page-wrapper.compact-wrapper .page-body-wrapper .page-body,
  .page-wrapper.compact-wrapper .page-body-wrapper footer {
    margin-left: 0;
    width: 100%;
  }
}

/* Theme toggle */
.page-header .mode {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  color: var(--text-primary);
}
.page-header .mode:hover { background: var(--background); }
.page-header .mode svg {
  width: 18px;
  height: 18px;
  stroke: var(--text-primary);
}
.kkt-theme-sun { display: none; }
html.kkt-dark .kkt-theme-moon { display: none; }
html.kkt-dark .kkt-theme-sun { display: inline-flex; }

/* Dark theme surfaces the light tokens do not cover */
html.kkt-dark .form-control,
html.kkt-dark .form-select,
html.kkt-dark textarea,
html.kkt-dark .input-group-text {
  background-color: var(--surface) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
html.kkt-dark .form-control::placeholder { color: var(--text-secondary); }
html.kkt-dark .form-control:disabled,
html.kkt-dark .form-select:disabled { background-color: var(--background) !important; }
html.kkt-dark .dropdown-menu,
html.kkt-dark .onhover-show-div,
html.kkt-dark .modal-content,
html.kkt-dark .list-group-item,
html.kkt-dark .page-link,
html.kkt-dark .offcanvas {
  background-color: var(--surface) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
html.kkt-dark .dropdown-item { color: var(--text-primary); }
html.kkt-dark .dropdown-item:hover,
html.kkt-dark .dropdown-item:focus {
  background: var(--background);
  color: var(--text-primary);
}
html.kkt-dark .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--text-primary);
  --bs-table-border-color: var(--border);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
  --bs-table-hover-bg: rgba(255, 255, 255, 0.05);
  --bs-table-hover-color: var(--text-primary);
  color: var(--text-primary);
}
html.kkt-dark .table > :not(caption) > * > *,
html.kkt-dark body.dark-only .page-body .table td,
html.kkt-dark body.dark-only .page-body .table th {
  background-color: var(--surface) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
html.kkt-dark .table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: #243044 !important;
}
html.kkt-dark .table-hover > tbody > tr:hover > * {
  background-color: #344054 !important;
  color: var(--text-primary) !important;
}
html.kkt-dark .table a:not(.btn) { color: var(--primary); }
html.kkt-dark .text-dark:not(.badge),
html.kkt-dark .text-body { color: var(--text-primary) !important; }
html.kkt-dark .bg-white,
html.kkt-dark .bg-light,
html.kkt-dark .bg-body,
html.kkt-dark .bg-body-tertiary,
html.kkt-dark .bg-body-secondary {
  background-color: var(--surface) !important;
  color: var(--text-primary) !important;
}
html.kkt-dark .kkt-badge--published { background: color-mix(in srgb, var(--success) 24%, var(--surface)); color: #6CE9A6; }
html.kkt-dark .kkt-badge--draft { background: #344054; color: #D0D5DD; }
html.kkt-dark .kkt-badge--scheduled { background: color-mix(in srgb, var(--info) 24%, var(--surface)); color: #84CAFF; }
html.kkt-dark .kkt-badge--pending { background: color-mix(in srgb, var(--warning) 24%, var(--surface)); color: #FEC84B; }
html.kkt-dark .badge.text-bg-success,
html.kkt-dark .badge.bg-success { background: color-mix(in srgb, var(--success) 24%, var(--surface)) !important; color: #6CE9A6 !important; }
html.kkt-dark .badge.text-bg-warning,
html.kkt-dark .badge.bg-warning { background: color-mix(in srgb, var(--warning) 24%, var(--surface)) !important; color: #FEC84B !important; }
html.kkt-dark .alert {
  background: var(--surface);
  color: var(--text-primary);
  border-color: var(--border);
}
html.kkt-dark .tap-top {
  background: var(--surface) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border);
}