@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

body {
  font-family: 'Poppins', sans-serif;
  background-color: var(--bs-body-bg, #fafafa);
  color: var(--bs-body-color, #212529);
}

.overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(1px);
  display: none;
  z-index: 1030;
}
.overlay.show { display: block; }

.sidebar {
  width: 240px;
  background: #fff;
  transition: width 0.3s, left 0.3s;
  border-right: 1px solid #e5e5e5;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  padding-top: 60px;
  z-index: 1030;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sidebar-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding-bottom: 0.5rem;
  scroll-behavior: smooth;
}
.sidebar-body::-webkit-scrollbar {
  width: 5px;
}
.sidebar-body::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
.sidebar-footer {
  flex-shrink: 0;
  border-top: 1px solid #e5e5e5;
  background: #fff;
  padding: 0.35rem 0 0.5rem;
}
.sidebar-logout {
  margin-bottom: 0 !important;
}
.sidebar-logout:hover {
  background: #fef2f2 !important;
}
.sidebar .nav-link {
  color: #262626;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  margin: 1px 12px;
  border-radius: 8px;
}
.sidebar .nav-link:hover {
  color: #262626;
  background-color: #f5f5f5;
}
.sidebar .nav-link.active {
  color: #262626;
  font-weight: 600;
  background-color: #f8f9fa;
  border-left: 3px solid #E66239;
  margin-left: 9px;
  padding-left: 7px;
  scroll-margin-block: 12px;
}
.sidebar .nav-link .ti {
  font-size: 18px;
  color: #64748b;
}
.sidebar .nav-link:hover .ti,
.sidebar .nav-link.active .ti {
  color: #475569;
}
.sidebar .logo-area {
  position: absolute;
  top: 0;
  left: 0;
  height: 60px;
  width: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  padding: 0 14px;
  border-bottom: 1px solid #e5e5e5;
}
.sidebar-brand-lockup {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}
.sidebar-brand-unit {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  flex: 1;
}
.sidebar-brand-logo {
  width: 28px;
  height: 28px;
  object-fit: contain;
  border-radius: 7px;
  flex-shrink: 0;
  background: #f8fafc;
  border: 1px solid #eef2f7;
}
.sidebar-brand-short {
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  white-space: nowrap;
}
.sidebar-brand-om .sidebar-brand-short,
.sidebar-brand-de .sidebar-brand-short {
  color: #1e40af;
}
.sidebar-brand-divider {
  width: 1px;
  height: 26px;
  background: #e2e8f0;
  flex-shrink: 0;
}
.sidebar.collapsed .sidebar-brand-short,
.sidebar.collapsed .sidebar-brand-divider {
  display: none;
}
.sidebar.collapsed .sidebar-brand-lockup {
  justify-content: center;
  gap: 0.25rem;
}
.sidebar.collapsed .sidebar-brand-unit {
  flex: 0;
}
.sidebar.collapsed .sidebar-brand-logo {
  width: 24px;
  height: 24px;
  border-radius: 6px;
}

/* Legacy aliases (if referenced elsewhere) */
.sidebar-brand-names {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.15;
}
.sidebar-brand-names .brand-tag {
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.sidebar-brand-names .brand-omdei,
.sidebar-brand-names .brand-deinc { color: #1e40af; }
.sidebar.collapsed { width: 60px; }
.sidebar.collapsed .nav-text,
.sidebar.collapsed .sidebar-brand-names,
.sidebar.collapsed .sidebar-brand-lockup .sidebar-brand-short,
.sidebar.collapsed .sidebar-brand-divider,
.sidebar.collapsed .nav-section { display: none; }
.sidebar.collapsed .sidebar-footer .nav-text { display: none; }
.sidebar.collapsed .nav-link { padding: 8px 18px; margin: 0; }

.sidebar-nav-group {
  margin: 2px 8px 6px;
}
.sidebar-nav-group-toggle {
  width: calc(100% - 8px);
  margin: 1px 4px;
  border: none;
  background: #f8fafc;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: background 0.15s ease, color 0.15s ease;
}
.sidebar-nav-group-toggle:hover {
  background: #f1f5f9;
  color: #475569;
}
.sidebar-nav-group-toggle .ti:first-child {
  font-size: 17px;
  color: #94a3b8;
}
.sidebar-nav-group-chevron {
  font-size: 14px !important;
  color: #94a3b8;
  transition: transform 0.2s ease;
}
.sidebar-nav-group.is-open .sidebar-nav-group-chevron {
  transform: rotate(180deg);
}
.sidebar-nav-group-menu {
  display: none;
  padding: 4px 0 2px;
}
.sidebar-nav-group.is-open .sidebar-nav-group-menu {
  display: block;
}
.sidebar-nav-group-menu .nav-link {
  margin-left: 10px;
  margin-right: 6px;
  padding-left: 12px;
  font-size: 13px;
}
.sidebar-nav-group-menu .nav-link .ti {
  font-size: 16px;
}
.sidebar-nav-group.is-active > .sidebar-nav-group-toggle,
.sidebar-nav-group:has(.nav-link.active) > .sidebar-nav-group-toggle {
  color: #334155;
  background: #f1f5f9;
  border-left: 3px solid #E66239;
  padding-left: 7px;
  margin-left: 1px;
}
.sidebar.collapsed .sidebar-nav-group-menu,
.sidebar.collapsed .sidebar-nav-group-chevron,
.sidebar.collapsed .sidebar-nav-group-toggle .nav-text {
  display: none !important;
}
.sidebar.collapsed .sidebar-nav-group-toggle {
  justify-content: center;
  padding: 8px 18px;
  margin: 1px 0;
  width: 100%;
  border-left: 0;
  background: transparent;
}
[data-bs-theme="dark"] .sidebar-nav-group-toggle {
  background: rgba(255, 255, 255, 0.04);
  color: #94a3b8;
}
[data-bs-theme="dark"] .sidebar-nav-group-toggle:hover,
[data-bs-theme="dark"] .sidebar-nav-group:has(.nav-link.active) > .sidebar-nav-group-toggle {
  background: rgba(255, 255, 255, 0.08);
  color: #e2e8f0;
}

.topbar {
  height: 60px;
  margin-left: 240px;
  z-index: 1040;
}
.topbar.full { margin-left: 60px; }

.topbar-dual-clock {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.4rem 0.75rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  min-width: 11.5rem;
}
.topbar-clock-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  font-size: 0.75rem;
  line-height: 1.2;
}
.topbar-clock-label {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
  white-space: nowrap;
}
.topbar-clock-india .topbar-clock-label { color: #0f766e; }
.topbar-clock-usa .topbar-clock-label { color: #1d4ed8; }
.topbar-clock-time {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
}

.dual-time {
  display: inline-flex;
  flex-direction: column;
  gap: 0.15rem;
  font-size: 0.75rem;
  line-height: 1.25;
}
.dual-time-row {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  white-space: nowrap;
}
.dual-time-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.65rem;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
  font-size: 0.5625rem;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.dual-time-india .dual-time-tag {
  background: rgba(15, 118, 110, 0.12);
  color: #0f766e;
}
.dual-time-usa .dual-time-tag {
  background: rgba(29, 78, 216, 0.1);
  color: #1d4ed8;
}
.dual-time-compact .dual-time-tag { min-width: 1.35rem; }
.india-time {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  white-space: nowrap;
}
.india-time .dual-time-tag {
  background: rgba(15, 118, 110, 0.12);
  color: #0f766e;
}

.login-dual-clock {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem 1rem;
  margin-bottom: 1.25rem;
  width: 100%;
  max-width: 520px;
}
.login-clock-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  min-width: 11rem;
  padding: 0.65rem 0.9rem;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.85);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
}
.login-clock-india { border-color: rgba(15, 118, 110, 0.25); }
.login-clock-usa { border-color: rgba(29, 78, 216, 0.22); }
.login-clock-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}
.login-clock-india .login-clock-label { color: #0f766e; }
.login-clock-usa .login-clock-label { color: #1d4ed8; }
.login-clock-time {
  font-size: 0.8125rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}

.export-download-group:last-child { border-bottom: 0 !important; }
.export-download-group-head {
  border-bottom: 1px solid #eef2f6;
}

/* Topbar batch search */
.topbar-batch-search-wrap {
  max-width: 420px;
  min-width: 0;
}
.topbar-batch-search .topbar-batch-search-input {
  padding-left: 2.25rem;
  border-radius: 999px;
  background: var(--bs-body-bg);
}
.topbar-batch-search-icon {
  position: absolute;
  left: 0.85rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 0.95rem;
  pointer-events: none;
  z-index: 2;
}
.topbar-batch-search-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 1080;
  background: var(--bs-body-bg);
  border-radius: 0.75rem;
  overflow: hidden;
  max-height: 320px;
  overflow-y: auto;
}
.topbar-batch-search-item,
.topbar-batch-search-all {
  display: block;
  padding: 0.65rem 0.85rem;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid #eef2f6;
}
.topbar-batch-search-item:hover,
.topbar-batch-search-item.active,
.topbar-batch-search-all:hover {
  background: #f8fafc;
  color: inherit;
}
.topbar-batch-search-all {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--bs-primary);
  border-bottom: 0;
}
.topbar-batch-search-empty {
  padding: 0.75rem 0.85rem;
  font-size: 0.8125rem;
  color: #64748b;
}
[data-bs-theme="dark"] .topbar-batch-search-item:hover,
[data-bs-theme="dark"] .topbar-batch-search-item.active,
[data-bs-theme="dark"] .topbar-batch-search-all:hover {
  background: rgba(255, 255, 255, 0.06);
}

/* Admin team announcement */
.admin-announcement-banner {
  border-radius: 0.75rem;
  padding: 1rem 1.15rem;
  border: 1px solid transparent;
}
.admin-announcement-info {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1e3a5f;
}
.admin-announcement-success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}
.admin-announcement-warning {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}
.admin-announcement-danger {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}
.admin-announcement-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.65);
  font-size: 1.15rem;
}
[data-bs-theme="dark"] .admin-announcement-info {
  background: rgba(59, 130, 246, 0.15);
  border-color: rgba(59, 130, 246, 0.35);
  color: #dbeafe;
}
[data-bs-theme="dark"] .admin-announcement-success {
  background: rgba(16, 185, 129, 0.15);
  border-color: rgba(16, 185, 129, 0.35);
  color: #d1fae5;
}
[data-bs-theme="dark"] .admin-announcement-warning {
  background: rgba(245, 158, 11, 0.15);
  border-color: rgba(245, 158, 11, 0.35);
  color: #fef3c7;
}
[data-bs-theme="dark"] .admin-announcement-danger {
  background: rgba(239, 68, 68, 0.15);
  border-color: rgba(239, 68, 68, 0.35);
  color: #fee2e2;
}

/* Celebration mode */
/* Settings page */
.settings-page {
  width: 100%;
  max-width: 100%;
}
.settings-shell {
  display: flex;
  flex-direction: column;
  border-radius: 16px !important;
  overflow: hidden;
  border: 1px solid #e8edf3 !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.04) !important;
}
.settings-tabs {
  display: flex;
  flex-shrink: 0;
  flex-wrap: nowrap;
  gap: 0;
  padding: 0 1.5rem;
  background: #f8fafc;
  border-bottom: 1px solid #e8edf3;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.settings-tabs::-webkit-scrollbar {
  display: none;
}
.settings-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem 1.15rem;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  background: transparent;
  font-size: 0.9rem;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.settings-tab i {
  font-size: 1.15rem;
  opacity: 0.7;
}
.settings-tab:hover {
  color: #334155;
}
.settings-tab.active {
  color: #0f172a;
  border-bottom-color: #E66239;
  background: #fff;
}
.settings-tab.active i {
  opacity: 1;
  color: #E66239;
}
.settings-tab-danger.active {
  color: #b91c1c;
  border-bottom-color: #ef4444;
}
.settings-tab-danger.active i {
  color: #ef4444;
}
.settings-panels {
  flex: 1;
  background: #fff;
  min-height: 420px;
}
.settings-panel {
  display: none;
  min-height: 420px;
}
.settings-panel.active {
  display: block;
}
.settings-form {
  display: flex;
  flex-direction: column;
  min-height: 420px;
}
.settings-form-body {
  flex: 1;
  padding: 1.75rem 2rem 1.5rem;
}
.settings-form-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1.15rem 2rem 1.5rem;
  background: #fafbfc;
  border-top: 1px solid #eef2f6;
}
.settings-form-footer .btn {
  padding: 0.55rem 1.2rem;
  font-size: 0.9375rem;
}
.settings-group + .settings-group {
  margin-top: 1.75rem;
  padding-top: 1.75rem;
  border-top: 1px solid #f1f5f9;
}
.settings-group-title {
  margin: 0 0 1rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #94a3b8;
}
.settings-grid {
  display: grid;
  gap: 1.15rem 1.5rem;
}
.settings-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.settings-field-full {
  grid-column: 1 / -1;
}
.settings-label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #334155;
}
.settings-hint {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.45rem 0 0;
  font-size: 0.8125rem;
  color: #94a3b8;
}
.settings-hint i {
  font-size: 0.9rem;
}
.settings-form .form-control,
.settings-form .form-select,
.settings-panel .form-control,
.settings-panel .form-select {
  border-color: #e2e8f0;
  border-radius: 10px;
  font-size: 0.9375rem;
  min-height: 2.85rem;
  padding: 0.55rem 0.9rem;
}
.settings-form textarea.form-control {
  min-height: 5.5rem;
}
.settings-form .form-control:focus,
.settings-form .form-select:focus,
.settings-panel .form-control:focus,
.settings-panel .form-select:focus {
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.12);
}
.settings-form .input-group-text {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #64748b;
  font-size: 0.875rem;
  font-weight: 500;
  min-height: 2.85rem;
  padding: 0.55rem 0.85rem;
}
.settings-toggles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.settings-toggles-single {
  grid-template-columns: 1fr;
}
.settings-toggle {
  padding: 1rem 1.15rem;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 12px;
}
.settings-toggle .form-check-label {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e293b;
}
.settings-toggle-hint {
  margin: 0.4rem 0 0 2.75rem;
  font-size: 0.8125rem;
  color: #94a3b8;
  line-height: 1.45;
}
.settings-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  font-size: 0.875rem;
  font-weight: 600;
}
.settings-status-pill.is-live {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}
.settings-preview-box {
  padding: 1rem 1.15rem;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 12px;
}
.settings-panel-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.settings-panel-meta-label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #64748b;
}
.settings-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  background: #f1f5f9;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #475569;
}
.settings-stats-row {
  display: flex;
  gap: 1.15rem;
}
.settings-stat {
  flex: 1;
  padding: 1rem 1.15rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 12px;
  text-align: center;
}
.settings-stat-val {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  color: #b91c1c;
  line-height: 1.2;
}
.settings-stat-lbl {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}
.settings-checks {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.settings-checks .form-check-label {
  font-size: 0.9375rem;
}
.settings-danger-callout {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
  padding: 1rem 1.15rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 12px;
  color: #991b1b;
}
.settings-danger-callout i {
  font-size: 1.35rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
}
.settings-danger-callout p {
  font-size: 0.875rem;
  color: #b91c1c;
}
.settings-table {
  border: 1px solid #eef2f6;
  border-radius: 12px;
  overflow: hidden;
}
.settings-table thead th {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  font-weight: 700;
  background: #f8fafc;
  border-bottom: 1px solid #eef2f6;
  padding: 0.7rem 1.15rem;
}
.settings-table tbody td {
  padding: 0.75rem 1.15rem;
  font-size: 0.9375rem;
}
.settings-inline-alert {
  border-radius: 10px;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
}
.settings-inline-alert.is-success {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}
.settings-inline-alert.is-error {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}
@media (max-width: 768px) {
  .settings-grid-2,
  .settings-toggles {
    grid-template-columns: 1fr;
  }
  .settings-tabs {
    padding: 0 1rem;
  }
  .settings-tab {
    padding: 0.9rem 0.85rem;
    font-size: 0.85rem;
  }
  .settings-form-body {
    padding: 1.25rem 1.25rem 1.15rem;
  }
  .settings-form-footer {
    padding: 1rem 1.25rem 1.25rem;
  }
}
[data-bs-theme="dark"] .settings-shell {
  border-color: rgba(255, 255, 255, 0.08) !important;
}
[data-bs-theme="dark"] .settings-tabs {
  background: rgba(255, 255, 255, 0.04);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .settings-tab.active {
  background: transparent;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .settings-panels {
  background: transparent;
}
[data-bs-theme="dark"] .settings-group + .settings-group {
  border-top-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .settings-label {
  color: #cbd5e1;
}
[data-bs-theme="dark"] .settings-toggle {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .settings-form-footer {
  background: rgba(255, 255, 255, 0.03);
  border-top-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .settings-table {
  border-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .settings-table thead th {
  background: rgba(255, 255, 255, 0.04);
}
[data-bs-theme="dark"] .settings-danger-callout {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.25);
  color: #fca5a5;
}

/* Mail settings tab */
.mail-settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.9fr);
  gap: 1.5rem;
  align-items: start;
}
.mail-settings-preview {
  position: sticky;
  top: 1rem;
}
.mail-cron-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.85rem 1rem;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: 10px;
}
.mail-cron-url {
  display: block;
  min-width: 0;
  font-size: 0.75rem;
  line-height: 1.45;
  word-break: break-all;
  color: #334155;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.mail-cron-box .btn {
  white-space: nowrap;
  align-self: center;
}
.mail-report-preview-card {
  border: 1px solid #e8edf3;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
}
.mail-report-preview-head {
  padding: 1rem 1.15rem;
  background: linear-gradient(180deg, #fff7ed 0%, #fff 100%);
  border-bottom: 1px solid #fde68a;
}
.mail-report-preview-head strong {
  display: block;
  color: #E66239;
  font-size: 0.95rem;
}
.mail-report-preview-head span {
  font-size: 0.8125rem;
  color: #64748b;
}
.mail-report-preview-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.65rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #f1f5f9;
}
.mail-report-preview-stats div {
  text-align: center;
  padding: 0.65rem 0.5rem;
  background: #f8fafc;
  border-radius: 10px;
}
.mail-report-preview-stats span {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  font-weight: 700;
}
.mail-report-preview-stats strong {
  font-size: 1.25rem;
  color: #0f172a;
}
.mail-preview-table {
  table-layout: fixed;
  width: 100%;
}
.mail-preview-table thead th {
  font-size: 0.72rem;
  text-transform: uppercase;
  color: #64748b;
  background: #f8fafc;
  border-bottom: 1px solid #eef2f6;
}
.mail-preview-table tbody td {
  font-size: 0.875rem;
  padding: 0.55rem 0.75rem;
  vertical-align: middle;
}
.mail-preview-table tbody td.text-end {
  font-variant-numeric: tabular-nums;
}
.mail-report-attach {
  padding: 0.85rem 1.15rem;
  font-size: 0.8125rem;
  color: #64748b;
  background: #fafbfc;
  border-top: 1px solid #f1f5f9;
}
.mail-preview-period {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8125rem;
  color: #334155;
  font-weight: 600;
}
.mail-preview-shift-chip {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 1.15rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #b45309;
  background: linear-gradient(90deg, #fffbeb 0%, #fff 100%);
  border-bottom: 1px solid #fde68a;
}
.mail-preview-shift-chip i {
  font-size: 1rem;
  opacity: 0.85;
}
.mail-auto-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.mail-auto-card.is-on {
  border-color: #86efac;
  box-shadow: 0 4px 24px rgba(22, 163, 74, 0.08);
}
.mail-auto-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.2rem;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-bottom: 1px solid #f1f5f9;
}
.mail-auto-status {
  display: flex;
  gap: 0.85rem;
  align-items: flex-start;
}
.mail-auto-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 1.65rem;
  padding: 0 0.5rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  background: #f1f5f9;
  color: #64748b;
}
.mail-auto-card.is-on .mail-auto-badge {
  background: #dcfce7;
  color: #15803d;
}
.mail-auto-title {
  display: block;
  font-size: 0.95rem;
  color: #0f172a;
  margin-bottom: 0.2rem;
}
.mail-auto-desc {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.45;
}
.mail-auto-switch .form-check-input {
  width: 2.75rem;
  height: 1.4rem;
  cursor: pointer;
}
.mail-period-banner {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  padding: 0.95rem 1.2rem;
  background: linear-gradient(90deg, #fff7ed 0%, #fff 100%);
  border-bottom: 1px solid #ffedd5;
}
.mail-period-banner-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffedd5;
  color: #c2410c;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.mail-period-banner-label {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #94a3b8;
}
.mail-period-banner-range {
  display: block;
  font-size: 0.9rem;
  color: #0f172a;
  line-height: 1.35;
}
.mail-period-banner-hint {
  display: block;
  font-size: 0.75rem;
  color: #b45309;
  font-weight: 600;
  margin-top: 0.15rem;
}
.mail-auto-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
  padding: 1rem 1.2rem;
}
.mail-auto-meta-item span {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
  color: #94a3b8;
}
.mail-auto-meta-item strong {
  display: block;
  font-size: 0.9rem;
  color: #0f172a;
  margin-top: 0.15rem;
}
.mail-auto-meta-item small {
  display: block;
  font-size: 0.75rem;
  color: #64748b;
}
.mail-auto-meta-sent span {
  color: #15803d;
  font-size: 0.8125rem;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
}
.mail-send-modal .modal-content {
  border-radius: 18px;
  overflow: hidden;
}
.mail-send-modal-header {
  padding: 1.35rem 1.5rem 0;
  background: linear-gradient(180deg, #fff7ed 0%, #fff 55%);
}
.mail-send-modal-kicker {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #E66239;
  margin: 0;
}
.mail-send-modal-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}
.mail-send-modal-period {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  margin-bottom: 1rem;
}
.mail-send-modal-period span {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #94a3b8;
}
.mail-send-modal-period strong {
  display: block;
  font-size: 0.95rem;
  color: #0f172a;
  margin: 0.25rem 0;
}
.mail-send-modal-period small {
  color: #b45309;
  font-weight: 600;
}
.mail-send-modal-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.65rem;
  margin-bottom: 1rem;
}
.mail-send-modal-stats div {
  text-align: center;
  padding: 0.75rem 0.5rem;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #eef2f6;
}
.mail-send-modal-stats span {
  display: block;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  font-weight: 700;
}
.mail-send-modal-stats strong {
  display: block;
  font-size: 1.35rem;
  color: #0f172a;
  margin-top: 0.2rem;
}
.mail-send-modal-recipients {
  padding: 0.85rem 1rem;
  border-radius: 12px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  margin-bottom: 0.85rem;
}
.mail-send-modal-recipients span {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  color: #1d4ed8;
  margin-bottom: 0.35rem;
}
.mail-send-modal-recipients p {
  font-size: 0.875rem;
  color: #1e3a8a;
  word-break: break-word;
}
.mail-send-modal-note {
  font-size: 0.8125rem;
  color: #64748b;
}
.mail-send-modal-btn {
  min-width: 9rem;
  font-weight: 600;
}
.mail-send-modal-state {
  text-align: center;
  padding: 2rem 1rem 1.5rem;
}
.mail-send-modal-state.is-success .mail-send-state-icon {
  color: #16a34a;
}
.mail-send-modal-state.is-error .mail-send-state-icon {
  color: #dc2626;
}
.mail-send-state-icon {
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 0.75rem;
}
.mail-send-state-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.35rem;
}
.mail-send-state-hint {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.45;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
.mail-send-spinner {
  width: 3rem;
  height: 3rem;
  margin: 0 auto 1rem;
  border: 3px solid #fde68a;
  border-top-color: #E66239;
  border-radius: 50%;
  animation: mailSendSpin 0.75s linear infinite;
}
.mail-send-modal.is-sending .modal-content {
  min-height: 280px;
}
.mail-send-modal.is-done .mail-send-modal-header {
  background: linear-gradient(180deg, #ecfdf5 0%, #fff 55%);
}
.mail-send-modal.is-failed .mail-send-modal-header {
  background: linear-gradient(180deg, #fef2f2 0%, #fff 55%);
}
@keyframes mailSendSpin {
  to { transform: rotate(360deg); }
}
@media (max-width: 992px) {
  .mail-settings-layout {
    grid-template-columns: 1fr;
  }
  .mail-settings-preview {
    position: static;
  }
}
@media (max-width: 576px) {
  .mail-cron-box {
    grid-template-columns: 1fr;
  }
  .mail-cron-box .btn {
    width: 100%;
  }
  .mail-report-preview-stats {
    grid-template-columns: 1fr;
  }
  .mail-auto-card-top {
    flex-direction: column;
    align-items: stretch;
  }
  .mail-auto-switch {
    align-self: flex-start;
  }
}

#celebration-mode {
  scroll-margin-top: 5rem;
}
.celebration-settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 1.5rem;
  align-items: start;
}
.celebration-settings-compose .settings-grid-2 {
  grid-template-columns: 1fr;
}
.celebration-settings-preview {
  position: sticky;
  top: 1rem;
}
.celebration-preview-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
  padding: 1.5rem 1.25rem;
  background:
    radial-gradient(circle at 20% 20%, rgba(251, 191, 36, 0.14), transparent 45%),
    radial-gradient(circle at 80% 70%, rgba(230, 98, 57, 0.12), transparent 40%),
    #f8fafc;
  border-radius: 14px;
  border: 1px dashed #e2e8f0;
}
.celebration-preview-modal {
  width: 100%;
  max-width: 320px;
  background: linear-gradient(180deg, #fff 0%, #fffbeb 100%);
  border-radius: 20px;
  padding: 1.5rem 1.25rem 1.25rem;
  text-align: center;
  box-shadow: 0 20px 44px rgba(15, 23, 42, 0.14);
  border: 1px solid rgba(251, 191, 36, 0.35);
  position: relative;
}
.celebration-preview-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin: 0.85rem 0 0;
  font-size: 0.8125rem;
  color: #94a3b8;
  text-align: center;
}
.celebration-preview-title.is-placeholder,
.celebration-preview-stats.is-placeholder {
  opacity: 0.45;
}
@media (max-width: 900px) {
  .celebration-settings-layout {
    grid-template-columns: 1fr;
  }
  .celebration-settings-preview {
    position: static;
  }
}
.celebration-settings-card {
  position: relative;
  border-radius: 16px !important;
  overflow: visible;
}
.celebration-settings-accent {
  height: 5px;
  background: linear-gradient(90deg, #E66239 0%, #f59e0b 35%, #fbbf24 65%, #10b981 100%);
}
.celebration-settings-head {
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
}
.celebration-settings-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #b45309;
  font-size: 1.35rem;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.2);
}
.celebration-manual-badge {
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
  font-weight: 700;
  padding: 0.45rem 0.75rem;
}
.celebration-ref-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}
.celebration-ref-stat {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.75rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.celebration-ref-label {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  font-weight: 700;
}
.celebration-ref-stat strong {
  font-size: 0.95rem;
  color: #0f172a;
}
.celebration-ref-bar {
  height: 6px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
  margin: 0.15rem 0;
}
.celebration-ref-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #E66239);
}
.celebration-ref-bar-fill.is-complete {
  background: linear-gradient(90deg, #10b981, #059669);
}
.celebration-live-pill {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #ecfdf5, #d1fae5);
  border: 1px solid #a7f3d0;
  color: #065f46;
}
.celebration-live-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
  animation: celebrationPulse 1.4s ease-in-out infinite;
}
@keyframes celebrationPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.15); opacity: 0.75; }
}
.celebration-compose-panel,
.celebration-preview-panel,
.celebration-send-panel {
  background: #fff;
  border: 1px solid #e8edf3;
  border-radius: 14px;
  padding: 1.15rem 1.2rem;
}
.celebration-send-panel {
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
  border-color: #fde68a;
}
.celebration-step-head {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #334155;
}
.celebration-step-num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  font-weight: 800;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
}
.celebration-field-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.84rem;
  font-weight: 700;
  color: #334155;
  margin-bottom: 0.45rem;
}
.celebration-field-label .ti {
  color: #E66239;
  font-size: 1rem;
}
.celebration-input {
  border-radius: 10px !important;
  border-color: #dbe3ec !important;
  padding: 0.7rem 0.85rem !important;
}
.celebration-input:focus {
  border-color: #f59e0b !important;
  box-shadow: 0 0 0 0.2rem rgba(245, 158, 11, 0.15) !important;
}
.celebration-input-group .form-control {
  min-width: 0;
  flex: 1 1 180px;
}
.celebration-input-group .btn {
  flex: 0 0 auto;
}
.celebration-preview-ribbon,
.celebration-modal-ribbon {
  display: inline-block;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #92400e;
  background: #fef3c7;
  border: 1px solid #fde68a;
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  margin-bottom: 0.75rem;
}
.celebration-preview-emoji,
.celebration-modal-emoji {
  font-size: 2.4rem;
  line-height: 1;
  display: block;
}
.celebration-preview-title,
.celebration-modal-title {
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0.5rem 0 0.35rem;
  line-height: 1.35;
}
.celebration-preview-stats,
.celebration-modal-stats {
  display: inline-block;
  font-weight: 800;
  color: #b45309;
  font-size: 0.92rem;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  padding: 0.35rem 0.85rem;
  margin-bottom: 0.65rem;
}
.celebration-preview-message,
.celebration-modal-message {
  font-size: 0.82rem;
  color: #64748b;
  line-height: 1.45;
  margin-bottom: 0.85rem;
  min-height: 1.2rem;
}
.celebration-preview-message:empty,
.celebration-preview-message.d-none {
  display: none !important;
}
.celebration-preview-btn-mock {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #f59e0b, #E66239);
  border-radius: 999px;
  padding: 0.45rem 1.1rem;
}
.celebration-send-btn {
  color: #fff !important;
  font-weight: 700;
  border: 0;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #f59e0b 0%, #E66239 100%) !important;
  box-shadow: 0 8px 22px rgba(230, 98, 57, 0.28);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.celebration-send-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(230, 98, 57, 0.34);
  color: #fff !important;
}
.celebration-result-alert {
  border-radius: 12px;
  padding: 0.85rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
}
.celebration-result-alert.is-success {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}
.celebration-result-alert.is-error {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}
.celebration-dash-card {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  padding: 1.15rem 1.25rem;
  background: linear-gradient(135deg, #fffbeb 0%, #fff 55%, #fff7ed 100%);
  border: 1px solid #fde68a;
  box-shadow: 0 8px 24px rgba(245, 158, 11, 0.1);
}
.celebration-dash-card-glow {
  position: absolute;
  right: -30px;
  top: -30px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(251, 191, 36, 0.25), transparent 70%);
  pointer-events: none;
}
.celebration-dash-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #fef3c7, #fde68a);
  color: #b45309;
  font-size: 1.4rem;
  flex-shrink: 0;
}

.celebration-overlay {
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.62);
  backdrop-filter: blur(6px);
  padding: 1rem;
}
.celebration-overlay.d-none { display: none !important; }
body.celebration-active { overflow: hidden; }
.celebration-confetti-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.celebration-balloons {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.celebration-balloon {
  position: absolute;
  bottom: -120px;
  border-radius: 50% 50% 45% 45%;
  opacity: 0.92;
  animation: celebrationBalloonRise linear forwards;
  box-shadow: inset -8px -12px 0 rgba(0, 0, 0, 0.08);
}
.celebration-balloon-knot {
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 8px;
  height: 8px;
  margin-left: -4px;
  background: inherit;
  filter: brightness(0.85);
  border-radius: 2px;
  transform: rotate(45deg);
}
.celebration-balloon-string {
  position: absolute;
  left: 50%;
  top: 100%;
  width: 1px;
  height: 70px;
  margin-left: -0.5px;
  background: rgba(100, 116, 139, 0.55);
}
@keyframes celebrationBalloonRise {
  from { transform: translateY(0) translateX(0) rotate(-4deg); opacity: 0; }
  10% { opacity: 0.95; }
  to { transform: translateY(-115vh) translateX(30px) rotate(6deg); opacity: 0.2; }
}
.celebration-modal {
  position: relative;
  z-index: 2;
  max-width: min(480px, calc(100vw - 2rem));
  width: 100%;
  animation: celebrationModalPop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.celebration-modal-inner {
  position: relative;
  text-align: center;
  background: linear-gradient(180deg, #ffffff 0%, #fffbeb 100%);
  border-radius: 24px;
  padding: 2rem 1.75rem 1.65rem;
  border: 1px solid rgba(251, 191, 36, 0.45);
  box-shadow: 0 28px 60px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}
.celebration-modal-close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 3;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  color: #64748b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.celebration-modal-close:hover {
  background: #fff;
  color: #0f172a;
}
.celebration-modal-sparkle {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.celebration-modal-sparkle-a {
  width: 140px;
  height: 140px;
  top: -50px;
  right: -40px;
  background: radial-gradient(circle, rgba(251, 191, 36, 0.35), transparent 70%);
}
.celebration-modal-sparkle-b {
  width: 100px;
  height: 100px;
  bottom: -30px;
  left: -25px;
  background: radial-gradient(circle, rgba(230, 98, 57, 0.2), transparent 70%);
}
.celebration-modal-emoji-wrap {
  margin-bottom: 0.35rem;
}
.celebration-modal-emoji {
  animation: celebrationEmojiBounce 1.2s ease-in-out infinite alternate;
}
.celebration-modal .celebration-modal-title {
  font-size: clamp(1.25rem, 4vw, 1.55rem);
  margin: 0.35rem 0 0.5rem;
  padding: 0 0.35rem;
}
.celebration-modal-meta {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
  margin: 0 0 0.75rem;
  line-height: 1.35;
}
.celebration-modal .celebration-modal-stats {
  display: block;
  font-size: 1.05rem;
  border-radius: 12px;
  padding: 0.65rem 0.85rem;
  margin: 0 auto 0.85rem;
  max-width: 100%;
}
.celebration-modal .celebration-modal-message {
  font-size: 0.9375rem;
  color: #475569;
  margin-bottom: 1rem;
}
.celebration-modal-btn {
  font-weight: 800;
  border-radius: 999px !important;
  padding: 0.65rem 1.75rem !important;
  color: #fff !important;
  border: 0 !important;
  background: linear-gradient(135deg, #f59e0b, #E66239) !important;
  box-shadow: 0 10px 24px rgba(230, 98, 57, 0.3);
}
@keyframes celebrationModalPop {
  from { transform: scale(0.72) translateY(12px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}
@keyframes celebrationEmojiBounce {
  from { transform: translateY(0) scale(1); }
  to { transform: translateY(-8px) scale(1.05); }
}

[data-bs-theme="dark"] .celebration-settings-head {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.12), transparent);
}
[data-bs-theme="dark"] .celebration-compose-panel,
[data-bs-theme="dark"] .celebration-preview-panel,
[data-bs-theme="dark"] .celebration-send-panel,
[data-bs-theme="dark"] .celebration-ref-stat {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .celebration-send-panel {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.1), rgba(255, 255, 255, 0.03));
}
[data-bs-theme="dark"] .celebration-ref-stat strong,
[data-bs-theme="dark"] .celebration-modal-title,
[data-bs-theme="dark"] .celebration-preview-title {
  color: #f8fafc;
}
[data-bs-theme="dark"] .celebration-modal-meta {
  color: #94a3b8;
}
[data-bs-theme="dark"] .celebration-modal-close {
  background: rgba(30, 41, 59, 0.9);
  color: #cbd5e1;
}
[data-bs-theme="dark"] .celebration-modal-close:hover {
  background: #334155;
  color: #f8fafc;
}
[data-bs-theme="dark"] .celebration-modal .celebration-modal-stats {
  background: rgba(251, 191, 36, 0.1);
  border-color: rgba(251, 191, 36, 0.18);
  color: #fcd34d;
}
[data-bs-theme="dark"] .celebration-modal .celebration-modal-message {
  color: #cbd5e1;
}
[data-bs-theme="dark"] .celebration-preview-stage {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.1);
}
[data-bs-theme="dark"] .celebration-preview-modal,
[data-bs-theme="dark"] .celebration-modal-inner {
  background: linear-gradient(180deg, #1e293b, #0f172a);
  border-color: rgba(251, 191, 36, 0.25);
}
[data-bs-theme="dark"] .celebration-dash-card {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(15, 23, 42, 0.9));
  border-color: rgba(251, 191, 36, 0.25);
}

@media (max-width: 991.98px) {
  .celebration-ref-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.topbar-clock {
  gap: 0.5rem;
  padding: 0.35rem 0.85rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #334155;
  white-space: nowrap;
}
.topbar-clock .ti-clock {
  font-size: 1.05rem;
  color: #64748b;
  flex-shrink: 0;
}
.topbar-clock-time {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.topbar-user-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.75rem 0.35rem 0.45rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  text-decoration: none;
  color: #111827;
  font-size: 0.875rem;
  font-weight: 600;
  max-width: 220px;
  transition: background 0.2s, border-color 0.2s;
}
.topbar-user-btn:hover,
.topbar-user-btn.show {
  background: #fff;
  border-color: #d1d5db;
  color: #111827;
}
.topbar-user-btn::after {
  margin-left: 0.15rem;
  font-size: 0.65rem;
  color: #94a3b8;
}
.topbar-user-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: #fef3ef;
  color: #c45a35;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1rem;
}
.topbar-user-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 576px) {
  .topbar-user-name { max-width: 100px; }
  .topbar-clock-time { font-size: 0.75rem; }
}

/* Fixed topbar — content must start below it */
.content {
  margin-left: 240px;
  padding-top: 76px;
  padding-bottom: 1.5rem;
  min-height: 100vh;
}
.content.full { margin-left: 60px; }

@media (max-width: 992px) {
  .sidebar { left: -280px; }
  .sidebar.mobile-show { left: 0; }
  .topbar, .content { margin-left: 0 !important; }

  /* Compact single-row mobile topbar */
  #topbar.topbar.navbar {
    --mobile-topbar-h: 3.5rem;
    box-sizing: border-box;
    height: auto;
    min-height: calc(var(--mobile-topbar-h) + var(--app-safe-top, env(safe-area-inset-top, 0px)));
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.35rem;
    padding: var(--app-safe-top, env(safe-area-inset-top, 0px)) 0.65rem 0;
    z-index: 1060;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.07);
  }

  body.native-app:not(.statusbar-inset-native) #topbar.topbar.navbar {
    --app-safe-top: max(env(safe-area-inset-top, 0px), 32px);
    min-height: calc(var(--mobile-topbar-h) + max(env(safe-area-inset-top, 0px), 32px));
    padding-top: max(env(safe-area-inset-top, 0px), 32px);
  }

  #topbar .topbar-menu-btn {
    flex: 0 0 auto;
    order: 1;
    position: relative;
    z-index: 2;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  #topbar .topbar-menu-btn.is-open {
    background: #fef3ef;
    border-color: #E66239;
    color: #C75A3A;
  }

  #topbar .topbar-menu-btn.is-open .topbar-menu-icon-open { display: none; }
  #topbar .topbar-menu-btn.is-open .topbar-menu-icon-close { display: inline-block !important; }

  #topbar .topbar-batch-search-wrap {
    flex: 1 1 auto;
    order: 2;
    min-width: 0;
    max-width: none;
    margin: 0 !important;
  }

  #topbar .topbar-batch-search-input {
    height: 2.125rem;
    font-size: 0.8125rem;
    padding-left: 2rem;
  }

  #topbar .topbar-batch-search-icon {
    left: 0.7rem;
    font-size: 0.875rem;
  }

  #topbar .topbar-actions {
    flex: 0 0 auto;
    order: 3;
    width: auto;
    margin: 0 !important;
    padding: 0;
    border: 0;
  }

  #topbar .topbar-actions > ul {
    width: auto;
    justify-content: flex-end;
    gap: 0.2rem !important;
  }

  #topbar .topbar-actions .btn-icon.btn-sm {
    width: 2rem;
    height: 2rem;
  }

  .topbar-user-name {
    display: none;
  }

  .topbar-user-btn {
    padding: 0.2rem;
    max-width: none;
    border: 0;
    background: transparent;
  }

  .topbar-user-btn .topbar-user-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
  }

  /* Drawer sits below topbar — no header overlap */
  .sidebar {
    top: calc(var(--mobile-topbar-h, 3.5rem) + var(--app-safe-top, env(safe-area-inset-top, 0px)));
    width: min(280px, 86vw);
    height: calc(100dvh - var(--mobile-topbar-h, 3.5rem) - var(--app-safe-top, env(safe-area-inset-top, 0px)));
    padding-top: 0;
    z-index: 1050;
    box-shadow: 8px 0 28px rgba(15, 23, 42, 0.14);
  }

  body.native-app:not(.statusbar-inset-native) .sidebar {
    top: calc(var(--mobile-topbar-h, 3.5rem) + max(env(safe-area-inset-top, 0px), 32px));
    height: calc(100dvh - var(--mobile-topbar-h, 3.5rem) - max(env(safe-area-inset-top, 0px), 32px));
  }

  .sidebar .logo-area {
    display: none;
  }

  .sidebar-body {
    padding-top: 0.65rem;
  }

  .sidebar .nav-link {
    margin: 2px 10px;
    padding: 10px 12px;
    font-size: 0.9375rem;
  }

  .overlay {
    top: calc(var(--mobile-topbar-h, 3.5rem) + var(--app-safe-top, env(safe-area-inset-top, 0px)));
    z-index: 1045;
  }

  body.native-app:not(.statusbar-inset-native) .overlay {
    top: calc(var(--mobile-topbar-h, 3.5rem) + max(env(safe-area-inset-top, 0px), 32px));
  }

  .content {
    padding-top: calc(var(--mobile-topbar-h, 3.5rem) + var(--app-safe-top, env(safe-area-inset-top, 0px)) + 1rem);
  }

  body.native-app:not(.statusbar-inset-native) .content {
    padding-top: calc(var(--mobile-topbar-h, 3.5rem) + max(env(safe-area-inset-top, 0px), 32px) + 1rem);
  }

  body.sidebar-mobile-open {
    overflow: hidden;
    touch-action: none;
  }
}

@media (max-width: 576px) {
  #topbar.topbar.navbar {
    --mobile-topbar-h: 3.35rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    gap: 0.25rem;
  }

  #topbar .topbar-batch-search-input {
    font-size: 0.75rem;
  }

  #topbar .topbar-batch-search-input::placeholder {
    font-size: 0.75rem;
  }
}

.icon-shape {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.icon-md { width: 2.5rem; height: 2.5rem; }

.avatar { width: 2.25rem; height: 2.25rem; border-radius: 50%; object-fit: cover; }
.avatar-sm { width: 1.75rem; height: 1.75rem; }
.avatar-md { width: 2.5rem; height: 2.5rem; }

.btn-icon {
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

:root {
  --bs-primary: #C75A3A;
  --bs-primary-rgb: 199, 90, 58;
  --accent: #E66239;
  --bs-body-bg: #fafafa;
  --bs-body-color: #212529;
  --app-safe-top: env(safe-area-inset-top, 0px);
  --app-safe-bottom: env(safe-area-inset-bottom, 0px);
}
.btn-primary {
  --bs-btn-bg: #C75A3A;
  --bs-btn-border-color: #C75A3A;
  --bs-btn-hover-bg: #b04e32;
  --bs-btn-hover-border-color: #b04e32;
}
.btn-outline-primary {
  --bs-btn-color: #C75A3A;
  --bs-btn-border-color: #d4d4d4;
  --bs-btn-hover-bg: #f8f9fa;
  --bs-btn-hover-border-color: #C75A3A;
  --bs-btn-hover-color: #C75A3A;
}
.text-primary { color: #C75A3A !important; }

/* Stat cards — white base, soft icon tints only */
.stat-card { background: var(--bs-card-bg, #fff); }
.stat-card-label {
  font-size: 0.8125rem;
  color: #6b7280;
  font-weight: 500;
}
.stat-card-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}
.stat-card-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.stat-card-icon-slate { background: #f1f5f9; color: #475569; }
.stat-card-icon-primary { background: #fef3ef; color: #c45a35; }
.stat-card-icon-success { background: #ecfdf5; color: #059669; }
.stat-card-icon-info { background: #eff6ff; color: #2563eb; }
.stat-card-icon-warning { background: #fffbeb; color: #d97706; }
.stat-card-icon-danger { background: #fef2f2; color: #dc2626; }
.stat-card-link:hover {
  background: #fafafa;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

.card { border-color: var(--bs-border-color, #eee); }
.card-header {
  background: var(--bs-card-cap-bg, #fff) !important;
  border-bottom-color: var(--bs-border-color, #eee);
}

.table-hover tbody tr:hover { background-color: #fafafa; }
.duplicate-row { background-color: #fef2f2 !important; }

/* Report & list pages */
.report-type-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(8.75rem, 1fr));
  gap: 0.5rem;
}
.report-type-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.45rem 0.65rem;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  color: #475569;
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  line-height: 1.25;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.report-type-btn:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #0f172a;
}
.report-type-btn.is-active {
  background: linear-gradient(180deg, #1e293b 0%, #334155 100%);
  border-color: #1e293b;
  color: #fff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
}
.report-tabs .nav-link {
  color: #475569;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0.4rem 1rem;
  font-size: 0.875rem;
  font-weight: 500;
}
.report-tabs .nav-link:hover {
  background: #f8fafc;
  color: #111827;
}
.report-tabs .nav-link.active {
  background: #1e293b;
  border-color: #1e293b;
  color: #fff;
}
.report-summary-chip {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.85rem 1rem;
  height: 100%;
}
.report-summary-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.2rem;
}
.report-summary-chip strong {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}
.page-panel .card-body { padding: 1.25rem 1.5rem; }
.page-panel .card-header { padding: 0.875rem 1.5rem; }

.table-app thead th {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #6b7280;
  padding: 0.75rem 1.25rem;
  white-space: nowrap;
}
.table-app tbody td {
  padding: 0.875rem 1.25rem;
  vertical-align: middle;
}
.table-app tbody tr:last-child td { border-bottom: 0; }
.content .container-fluid { max-width: 100%; }
.page-title-block { margin-bottom: 1.25rem; }
.dashboard-section {
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #f0f0f0;
}
.dashboard-section:last-of-type { border-bottom: 0; }

/* Login page */
.login-page {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: calc(2rem + var(--app-safe-top, env(safe-area-inset-top, 0px))) 1rem calc(2rem + var(--app-safe-bottom, env(safe-area-inset-bottom, 0px)));
  background: linear-gradient(160deg, #f8fafc 0%, #f1f5f9 50%, #fafafa 100%);
}

body.native-app:not(.statusbar-inset-native) .login-page {
  padding-top: calc(2rem + max(env(safe-area-inset-top, 0px), 32px));
}
.login-page .login-card {
  max-width: 420px;
  width: 100%;
}
.brand-pair {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 1.25rem;
  max-width: 720px;
  width: 100%;
  margin-bottom: 2rem;
}
.brand-item {
  flex: 1 1 280px;
  max-width: 340px;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
  transition: box-shadow 0.2s, transform 0.2s;
}
.brand-item:hover {
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}
.brand-item img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  border-radius: 10px;
  flex-shrink: 0;
  background: #f8fafc;
}
.brand-item .name {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}
.brand-item .name .brand-short {
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: #111827;
  line-height: 1.2;
}
.brand-item .name .sub {
  font-size: 0.75rem;
  font-weight: 500;
  color: #6b7280;
  margin-top: 0.15rem;
  letter-spacing: 0.01em;
}
.brand-item.brand-item-om .brand-short,
.brand-item.brand-item-de .brand-short { color: #1e40af; }
@media (max-width: 576px) {
  .brand-pair { gap: 0.75rem; margin-bottom: 1.5rem; }
  .brand-item { flex: 1 1 100%; max-width: 100%; padding: 0.875rem 1rem; }
  .brand-item img { width: 48px; height: 48px; }
  .brand-item .name { font-size: 0.875rem; }
}

/* Bulk import page */
.import-steps {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.import-step {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #94a3b8;
}
.import-step i { font-size: 1rem; }
.import-step.active { color: #111827; font-weight: 600; }
.import-step.done { color: #059669; }
.import-step-meta {
  display: inline-block;
  margin-left: 0.15rem;
  padding: 0.1rem 0.45rem;
  font-size: 0.7rem;
  font-weight: 600;
  color: #64748b;
  background: #f1f5f9;
  border-radius: 999px;
  vertical-align: middle;
}
.import-step.active .import-step-meta {
  color: #b45309;
  background: #fffbeb;
}
.import-step.done .import-step-meta {
  color: #047857;
  background: #ecfdf5;
}
.import-filter-count {
  display: inline-block;
  min-width: 1.25rem;
  margin-left: 0.2rem;
  padding: 0 0.35rem;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.35;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.08);
}
.import-preview-filters .btn.active .import-filter-count {
  background: rgba(255, 255, 255, 0.28);
  color: inherit;
}
.import-step-line {
  flex: 1;
  min-width: 24px;
  max-width: 48px;
  height: 2px;
  background: #e2e8f0;
  border-radius: 1px;
}

.import-format-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0.25rem 0.65rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  color: #475569;
}
.import-format-chip i { font-size: 0.9rem; color: #64748b; }
.import-format-chip-muted {
  background: transparent;
  border-style: dashed;
  color: #94a3b8;
}

.import-dropzone {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2.5rem 1.5rem;
  border: 2px dashed #d1d5db;
  border-radius: 12px;
  background: #fafafa;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  margin-bottom: 0;
}
.import-dropzone:hover,
.import-dropzone-drag {
  border-color: #C75A3A;
  background: #fffbf9;
  box-shadow: 0 0 0 4px rgba(199, 90, 58, 0.08);
}
.import-dropzone-has-file {
  border-color: #059669;
  background: #f0fdf4;
  border-style: solid;
}
.import-dropzone-has-file.import-dropzone-pdf {
  border-color: #dc2626;
  background: #fef2f2;
}
.import-dropzone-has-file.import-dropzone-pdf .import-dropzone-icon {
  background: #fee2e2;
  border-color: #fecaca;
  color: #dc2626;
}
.import-dropzone-has-file .import-dropzone-title,
.import-dropzone-has-file .import-dropzone-hint {
  display: none !important;
}
.import-dropzone-file {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  width: 100%;
  max-width: 100%;
  padding: 0.5rem 0.75rem;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #bbf7d0;
  word-break: break-word;
}
.import-dropzone-has-file.import-dropzone-pdf .import-dropzone-file {
  border-color: #fecaca;
  background: #fff;
}
.import-dropzone-filename {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.35;
}
.import-dropzone-filemeta {
  font-size: 0.75rem;
  font-weight: 600;
  color: #059669;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.import-dropzone-has-file.import-dropzone-pdf .import-dropzone-filemeta {
  color: #dc2626;
}
.import-file-input {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
}
.import-dropzone-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: #fff;
  border: 1px solid #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  color: #C75A3A;
  font-size: 1.75rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.import-dropzone-title {
  font-size: 1rem;
  font-weight: 600;
  color: #111827;
  margin-bottom: 0.25rem;
}
.import-dropzone-hint {
  font-size: 0.8125rem;
  color: #6b7280;
}

.import-preview-check {
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  width: 100%;
}
.import-preview-check .form-check-input { margin-top: 0.35rem; }

.import-sample-btn {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 1rem;
  border-radius: 8px;
}
.import-sample-btn .ti-download { opacity: 0.5; font-size: 1rem; }
.import-sample-btn:hover .ti-download { opacity: 1; color: #C75A3A; }

.import-guide-tabs { margin-bottom: 0 !important; }

.import-example {
  background: #0f172a;
  color: #e2e8f0;
  border: none;
  border-radius: 10px;
  padding: 1.25rem;
  font-size: 0.8rem;
  line-height: 1.55;
  overflow-x: auto;
  margin-bottom: 0;
}
.import-example-table { font-size: 0.875rem; }
.import-example-table thead th {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.import-rules-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.import-rules-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.875rem;
  color: #374151;
}
.import-rules-list li i {
  font-size: 1.1rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.import-stat-card .import-stat-label {
  font-size: 0.75rem;
  color: #6b7280;
  font-weight: 500;
}
.import-stat-card .import-stat-value {
  font-size: 1.35rem;
  font-weight: 700;
  color: #111827;
}
.import-stat-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.import-stat-icon-total { background: #f1f5f9; color: #475569; }
.import-stat-icon-ok { background: #ecfdf5; color: #059669; }
.import-stat-icon-warn { background: #fffbeb; color: #d97706; }
.import-stat-icon-file { background: #fef3ef; color: #c45a35; }

.import-preview-table { max-height: 420px; overflow-y: auto; }
.import-row-warn { background-color: #fffbeb !important; }
.import-row-error,
.import-row-error > td,
tr.entry-row-error,
tr.entry-row-error > td,
.entry-onescreen-table tr.entry-row-error,
.entry-onescreen-table tr.entry-row-error > td {
  background-color: #fef2f2 !important;
}
tr.entry-row-error {
  box-shadow: inset 4px 0 0 #dc2626;
}
tr.entry-row-error.duplicate-row,
tr.entry-row-error.entry-was-query,
.import-row-error.import-row-warn {
  background-color: #fef2f2 !important;
}
.entry-row-error td {
  border-color: #fecaca !important;
}
.entry-error-batch {
  color: #dc2626 !important;
  font-weight: 700 !important;
}
.entry-error-badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff !important;
  background: #dc2626;
  border-radius: 4px;
  padding: 0.2rem 0.5rem;
  margin-right: 0.35rem;
  vertical-align: middle;
  line-height: 1.2;
}
.entry-error-msg {
  color: #dc2626 !important;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.35;
  max-width: 260px;
  word-break: break-word;
  display: inline;
}
.entry-error-alert {
  border-left: 4px solid #dc2626;
  background: #fef2f2;
  color: #991b1b;
}
.import-badge-ok {
  background: #ecfdf5 !important;
  color: #059669 !important;
  font-weight: 500;
}
.import-badge-db {
  background: #fffbeb !important;
  color: #b45309 !important;
  font-weight: 500;
}
.import-badge-file {
  background: #fef3ef !important;
  color: #c45a35 !important;
  font-weight: 500;
}
.import-badge-error {
  background: #fee2e2 !important;
  color: #dc2626 !important;
  font-weight: 600;
}

.upload-restore-panel {
  margin-top: 2.5rem !important;
  padding-top: 0.25rem;
}
.upload-restore-accordion .accordion-item {
  border-color: #e2e8f0 !important;
}
.upload-restore-accordion .accordion-button {
  font-size: 0.875rem;
  background: #f8fafc;
  box-shadow: none !important;
}
.upload-restore-accordion .accordion-button:not(.collapsed) {
  background: #eff6ff;
  color: #1e40af;
}
.upload-restore-month .accordion-body {
  border-top: 1px solid #e2e8f0;
}
.import-preview-top-actions {
  background: linear-gradient(180deg, #f0fdf4 0%, #fff 100%);
  border: 1px solid #bbf7d0 !important;
}
.import-preview-top-actions .btn-primary {
  font-weight: 600;
}

@media (max-width: 576px) {
  .import-dropzone { padding: 1.75rem 1rem; }
  .import-actions .btn { width: 100%; }
  .import-actions .btn-link { width: 100%; text-align: center; }
}

/* Import — easy layout */
.import-steps-easy {
  padding: 0.65rem 1rem;
}
.import-easy-layout {
  align-items: stretch;
}
.import-dropzone-easy {
  min-height: 10.5rem;
  padding: 1.5rem 1rem;
}
.import-options-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem 1rem;
}
.import-option-full {
  grid-column: 1 / -1;
}
.import-easy-steps {
  margin: 0;
  padding-left: 1.15rem;
  color: #475569;
  font-size: 0.875rem;
  line-height: 1.55;
}
.import-easy-steps li + li {
  margin-top: 0.35rem;
}
.import-example-compact {
  font-size: 0.68rem;
  line-height: 1.45;
  max-height: 9rem;
  overflow: auto;
}
.import-help-card {
  background: linear-gradient(180deg, #fffbeb 0%, #fff 45%);
  border: 1px solid #fde68a !important;
}
.import-help-accordion .accordion-button {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}
.import-preview-simple .import-col-extra {
  display: none;
}
.import-preview-simple.import-preview-show-extra .import-col-extra {
  display: table-cell;
}
.import-preview-card .import-preview-filters .btn {
  min-width: 4.5rem;
}
.import-preview-confirm {
  position: sticky;
  bottom: 0;
  z-index: 5;
  box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.06);
}
.import-preview-legend {
  background: #f8fafc !important;
}
.import-preview-batch-id {
  display: block;
  font-weight: 600;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
  color: #0f172a;
  word-break: break-all;
}
.import-preview-raw-input {
  display: block;
  font-size: 0.68rem;
  color: #64748b;
  margin-top: 0.2rem;
  line-height: 1.35;
  max-width: 22rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.import-preview-task {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
}
.import-preview-task-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #0f172a;
}
.import-badge-auto-task {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.import-preview-task-missing {
  min-width: 5.5rem;
}
.import-preview-task-missing-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  background: #fef3c7;
  color: #b45309;
  font-size: 0.6875rem;
  font-weight: 700;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  line-height: 1.2;
}
.import-preview-task-missing-badge-inline {
  font-size: 0.625rem;
  padding: 0.12rem 0.4rem;
}
.import-preview-task-missing-hint {
  font-size: 0.65rem;
  color: #94a3b8;
  line-height: 1.2;
}
.import-preview-simple tbody tr.import-row-missing-task {
  background: rgba(255, 251, 235, 0.85);
  box-shadow: inset 3px 0 0 #f59e0b;
}
.import-dup-panel-missing-task .import-row-missing-task {
  background: rgba(255, 251, 235, 0.5);
}
.import-preview-filters .btn-outline-warning.active {
  background: #fffbeb;
  border-color: #f59e0b;
  color: #b45309;
}
.import-preview-card .import-preview-table {
  max-height: 520px;
}
.import-preview-simple tbody tr.import-row-import {
  background: rgba(240, 253, 244, 0.55);
}
.import-preview-simple tbody tr.import-row-skip {
  background: rgba(254, 242, 242, 0.65);
}
.import-preview-simple tbody tr.import-row-error {
  box-shadow: inset 3px 0 0 #f59e0b;
}
.import-preview-line {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}
.import-preview-status .badge,
.import-preview-result {
  font-size: 0.75rem;
}
.import-preview-dup-detail {
  max-width: 16rem;
  line-height: 1.35;
}
.import-stat-card-easy .import-stat-value {
  font-size: 1.35rem;
}
@media (max-width: 575.98px) {
  .import-options-grid {
    grid-template-columns: 1fr;
  }
  .import-preview-confirm .btn-lg {
    width: 100%;
  }
}

/* Activity logs */
.activity-logs-table { overflow-x: auto; }
.activity-log-details {
  max-width: 280px;
  font-size: 0.8125rem;
  color: #475569;
  word-break: break-word;
}
.activity-log-pre {
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 8px;
  padding: 1rem;
  font-size: 0.75rem;
  line-height: 1.5;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Monthly sheet matrix (Excel-style) */
.matrix-report-card { overflow: hidden; }
.matrix-report-card .matrix-report-header {
  background: linear-gradient(180deg, #1b5e3b 0%, #14532d 100%) !important;
  border: none !important;
  border-bottom: none !important;
  padding: 0.875rem 1.25rem;
  color: #fff;
}
.matrix-report-card .matrix-report-header .h5,
.matrix-report-card .matrix-report-header h3,
.matrix-report-card .matrix-report-header .text-white {
  color: #fff !important;
}
.matrix-report-card .matrix-report-header .badge {
  background: #fff !important;
  color: #14532d !important;
  font-weight: 700;
}
.matrix-report-card-qc .matrix-report-header {
  background: linear-gradient(180deg, #0f766e 0%, #115e59 100%) !important;
}
.matrix-report-card-qc .matrix-report-header .badge {
  color: #115e59 !important;
}
.matrix-report-card-qc .matrix-report-table thead th {
  background: #115e59;
  border-color: #0f4c47;
}
.matrix-report-card-qc .matrix-report-table tbody tr:nth-child(even) { background: #ecfdf5; }
.matrix-report-card-qc .matrix-report-table tbody tr:hover { background: #ccfbf1 !important; }
.matrix-report-scroll {
  overflow: auto;
  max-height: 70vh;
}
.matrix-report-table {
  font-size: 0.8125rem;
  border-collapse: separate;
  border-spacing: 0;
}
.matrix-report-table thead th {
  background: #14532d;
  color: #fff;
  font-weight: 600;
  text-align: center;
  padding: 0.5rem 0.35rem;
  border: 1px solid #0f3d22;
  position: sticky;
  top: 0;
  z-index: 2;
  white-space: nowrap;
}
.matrix-report-table tbody tr:nth-child(even) { background: #f0f9ff; }
.matrix-report-table tbody tr:nth-child(odd) { background: #fff; }
.matrix-report-table tbody tr:hover { background: #e0f2fe !important; }
.matrix-row-you { background: #fff7ed !important; }
.matrix-row-you:hover { background: #ffedd5 !important; }
.matrix-sticky-name {
  position: sticky;
  left: 0;
  z-index: 3;
  background: inherit;
  min-width: 140px;
  max-width: 180px;
  text-align: left !important;
  padding-left: 0.75rem !important;
  border-right: 2px solid #cbd5e1;
  box-shadow: 4px 0 8px rgba(15, 23, 42, 0.06);
}
.matrix-report-table thead .matrix-sticky-name {
  background: #14532d;
  z-index: 4;
}
.matrix-day-col {
  min-width: 2.25rem;
  text-align: center;
  padding: 0.35rem 0.25rem !important;
  color: #334155;
}
.matrix-day-col.has-value {
  font-weight: 600;
  color: #0f172a;
}
.matrix-summary-col {
  font-weight: 600;
  text-align: center;
  min-width: 4.75rem;
  padding: 0.45rem 0.5rem !important;
  border-left: 2px solid #94a3b8;
}
.matrix-report-table thead .matrix-summary-col {
  background: #0f3d22 !important;
  color: #ffffff !important;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-left-color: #86efac;
  z-index: 5;
}
.matrix-report-table tbody .matrix-summary-col {
  background: #dbeafe !important;
  color: #0f172a !important;
  font-size: 0.875rem;
}
.matrix-report-table tbody .matrix-avg-value {
  color: #b45309 !important;
  font-weight: 700;
}
.matrix-total-row td {
  background: #bbf7d0 !important;
  color: #14532d !important;
  border-top: 2px solid #14532d;
  font-weight: 700;
}
.matrix-total-row .matrix-summary-col {
  background: #86efac !important;
  color: #14532d !important;
}
.matrix-total-row .matrix-sticky-name {
  background: #bbf7d0 !important;
  color: #14532d !important;
}

/* Dashboard sections */
.dashboard-section {
  padding-bottom: 2rem;
}

/* Dashboard leaderboards */
.leaderboard-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.leaderboard-section-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #111827;
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
.leaderboard-section-title .ti {
  color: #d97706;
}
.leaderboard-section-sub {
  font-size: 0.8125rem;
  color: #64748b;
  margin-top: 0.15rem;
}
.leaderboard-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
.leaderboard-card-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #f1f5f9;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}
.leaderboard-card-head-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #eef4f8;
  color: #5B7C99;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.leaderboard-card-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
}
.leaderboard-card-sub {
  font-size: 0.75rem;
  color: #94a3b8;
}
.leaderboard-empty {
  text-align: center;
  padding: 2.5rem 1rem;
  color: #94a3b8;
  font-size: 0.875rem;
}
.leaderboard-empty .ti {
  font-size: 2rem;
  display: block;
  margin-bottom: 0.5rem;
  opacity: 0.5;
}
.leaderboard-list {
  list-style: none;
  margin: 0;
  padding: 0.35rem 0;
}
.leaderboard-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 1rem;
  border-bottom: 1px solid #f8fafc;
  transition: background 0.15s ease;
}
.leaderboard-row:last-child {
  border-bottom: none;
}
.leaderboard-row:hover {
  background: #f8fafc;
}
.leaderboard-rank {
  width: 28px;
  flex-shrink: 0;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 800;
  color: #94a3b8;
}
.leaderboard-medal-icon {
  font-size: 1.25rem;
}
.leaderboard-row-gold .leaderboard-medal-icon { color: #eab308; }
.leaderboard-row-silver .leaderboard-medal-icon { color: #94a3b8; }
.leaderboard-row-bronze .leaderboard-medal-icon { color: #d97706; }
.leaderboard-row-gold {
  background: linear-gradient(90deg, rgba(234, 179, 8, 0.08) 0%, transparent 55%);
}
.leaderboard-row-silver {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.1) 0%, transparent 55%);
}
.leaderboard-row-bronze {
  background: linear-gradient(90deg, rgba(217, 119, 6, 0.08) 0%, transparent 55%);
}
.leaderboard-avatar {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(145deg, #5B7C99, #3d5568);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.leaderboard-row-gold .leaderboard-avatar {
  background: linear-gradient(145deg, #eab308, #ca8a04);
}
.leaderboard-row-silver .leaderboard-avatar {
  background: linear-gradient(145deg, #94a3b8, #64748b);
}
.leaderboard-row-bronze .leaderboard-avatar {
  background: linear-gradient(145deg, #d97706, #b45309);
}
.leaderboard-body {
  flex: 1;
  min-width: 0;
}
.leaderboard-name-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.2rem;
}
.leaderboard-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.leaderboard-you-badge {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.1rem 0.4rem;
  border-radius: 4px;
  background: #dbeafe;
  color: #1d4ed8;
}
.leaderboard-meta {
  display: block;
  font-size: 0.6875rem;
  color: #94a3b8;
  margin-bottom: 0.25rem;
}
.leaderboard-bar-track {
  height: 4px;
  background: #eef2f7;
  border-radius: 999px;
  overflow: hidden;
}
.leaderboard-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: #5B7C99;
  transition: width 0.4s ease;
}
.leaderboard-row-gold .leaderboard-bar-fill { background: #eab308; }
.leaderboard-row-silver .leaderboard-bar-fill { background: #94a3b8; }
.leaderboard-row-bronze .leaderboard-bar-fill { background: #d97706; }
.leaderboard-score {
  text-align: right;
  flex-shrink: 0;
  min-width: 3.5rem;
}
.leaderboard-score strong {
  display: block;
  font-size: 1rem;
  font-weight: 800;
  color: #111827;
  line-height: 1.1;
}
.leaderboard-score small {
  display: block;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #94a3b8;
}
.leaderboard-row-you {
  box-shadow: inset 3px 0 0 #3b82f6;
  background: linear-gradient(90deg, rgba(59, 130, 246, 0.06) 0%, transparent 60%) !important;
}
.leaderboard-row-you .leaderboard-you-badge {
  background: #3b82f6;
  color: #fff;
}

[data-bs-theme="dark"] .leaderboard-card {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .leaderboard-card-head {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .leaderboard-section-title,
[data-bs-theme="dark"] .leaderboard-card-title,
[data-bs-theme="dark"] .leaderboard-name,
[data-bs-theme="dark"] .leaderboard-score strong {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .leaderboard-row:hover {
  background: #334155;
}
[data-bs-theme="dark"] .leaderboard-bar-track {
  background: #334155;
}

/* Legacy class aliases */
.dashboard-leaderboard .leaderboard-rank {
  background: transparent;
  border: none;
  min-width: auto;
}
.dashboard-leaderboard .leaderboard-metric {
  background: transparent;
  border: none;
}
.dashboard-leaderboard .leaderboard-row-you {
  background: transparent !important;
}

/* Theme toggle — topbar */
.topbar-theme-btn .ti { font-size: 1.15rem; }

/* ========== Dark mode ========== */
[data-bs-theme="dark"] {
  color-scheme: dark;
  --bs-body-bg: #0b1120;
  --bs-body-color: #e2e8f0;
  --bs-emphasis-color: #f8fafc;
  --bs-secondary-color: #94a3b8;
  --bs-tertiary-color: #64748b;
  --bs-border-color: #2a3348;
  --bs-border-color-translucent: rgba(255, 255, 255, 0.08);
  --bs-card-bg: #161b2e;
  --bs-card-cap-bg: #121826;
  --bs-card-border-color: #2a3348;
  --bs-link-color: #93c5fd;
  --bs-link-hover-color: #bfdbfe;
  --bs-secondary-bg: #1e293b;
  --bs-tertiary-bg: #1a2236;
  --bs-light-bg-subtle: #1a2236;
  --bs-dark-bg-subtle: #0f172a;
  --bs-emphasis-bg: #334155;
  --bs-primary-bg-subtle: #1e3a5f;
  --bs-success-bg-subtle: #14532d;
  --bs-warning-bg-subtle: #422006;
  --bs-danger-bg-subtle: #450a0a;
  --bs-info-bg-subtle: #172554;
}

[data-bs-theme="dark"] body {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
}
[data-bs-theme="dark"] .content {
  background-color: var(--bs-body-bg);
}

[data-bs-theme="dark"] .sidebar {
  background: #1e293b;
  border-right-color: #334155;
}
[data-bs-theme="dark"] .sidebar .logo-area {
  background: #1e293b;
  border-bottom-color: #334155;
}
[data-bs-theme="dark"] .sidebar-brand-om .sidebar-brand-short,
[data-bs-theme="dark"] .sidebar-brand-de .sidebar-brand-short { color: #93c5fd; }
[data-bs-theme="dark"] .sidebar-brand-logo {
  background: #334155;
  border-color: #475569;
}
[data-bs-theme="dark"] .sidebar-brand-divider {
  background: #475569;
}
[data-bs-theme="dark"] .sidebar-brand-names .brand-omdei,
[data-bs-theme="dark"] .sidebar-brand-names .brand-deinc { color: #93c5fd; }
[data-bs-theme="dark"] .sidebar .nav-link {
  color: #e2e8f0;
}
[data-bs-theme="dark"] .sidebar .nav-link:hover {
  background-color: #334155;
  color: #fff;
}
[data-bs-theme="dark"] .sidebar .nav-link.active {
  background-color: #334155;
  color: #fff;
  border-left-color: #E66239;
}
[data-bs-theme="dark"] .sidebar .nav-link .ti { color: #94a3b8; }

[data-bs-theme="dark"] .sidebar-footer {
  background: #121826;
  border-top-color: #2a3348;
}
[data-bs-theme="dark"] .sidebar-body::-webkit-scrollbar-thumb {
  background: #475569;
}

[data-bs-theme="dark"] .topbar,
[data-bs-theme="dark"] #topbar.navbar {
  background-color: #121826 !important;
  border-bottom-color: #2a3348 !important;
}

@media (max-width: 992px) {
  [data-bs-theme="dark"] #topbar.topbar.navbar {
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
  }

  [data-bs-theme="dark"] .sidebar.mobile-show {
    box-shadow: 8px 0 28px rgba(0, 0, 0, 0.35);
  }

  [data-bs-theme="dark"] #topbar .topbar-menu-btn.is-open {
    background: rgba(230, 98, 57, 0.15);
    border-color: #E66239;
    color: #fb923c;
  }
}

[data-bs-theme="dark"] .page-title-block h1 {
  color: #f8fafc;
}
[data-bs-theme="dark"] .dashboard-section {
  border-bottom-color: #2a3348;
}
[data-bs-theme="dark"] .h6.text-secondary,
[data-bs-theme="dark"] .text-secondary {
  color: #94a3b8 !important;
}

[data-bs-theme="dark"] .table-light {
  --bs-table-bg: #1a2236;
  --bs-table-color: #94a3b8;
  --bs-table-border-color: #2a3348;
}
[data-bs-theme="dark"] .table-hover tbody tr:hover {
  background-color: #1a2236 !important;
}
[data-bs-theme="dark"] .bg-light {
  background-color: #1a2236 !important;
}
[data-bs-theme="dark"] .stat-card-link:hover {
  background: #1a2236;
}

[data-bs-theme="dark"] .topbar-dual-clock {
  background: #334155;
  border-color: #475569;
}
[data-bs-theme="dark"] .topbar-clock-time,
[data-bs-theme="dark"] .login-clock-time { color: #f1f5f9; }
[data-bs-theme="dark"] .login-clock-row {
  background: #1e293b;
  border-color: #475569;
}
[data-bs-theme="dark"] .topbar-clock {
  background: #334155;
  border-color: #475569;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .topbar-clock .ti-clock { color: #94a3b8; }

[data-bs-theme="dark"] .topbar-user-btn {
  background: #334155;
  border-color: #475569;
  color: #f8fafc;
}
[data-bs-theme="dark"] .topbar-user-btn:hover,
[data-bs-theme="dark"] .topbar-user-btn.show {
  background: #475569;
  color: #fff;
}
[data-bs-theme="dark"] .topbar-user-icon {
  background: #422006;
  color: #fb923c;
}

[data-bs-theme="dark"] .stat-card {
  background: var(--bs-card-bg);
}
[data-bs-theme="dark"] .stat-card-label { color: #94a3b8; }
[data-bs-theme="dark"] .stat-card-value { color: #f1f5f9; }
[data-bs-theme="dark"] .stat-card-icon-slate { background: #334155; color: #cbd5e1; }
[data-bs-theme="dark"] .stat-card-icon-primary { background: #422006; color: #fb923c; }
[data-bs-theme="dark"] .stat-card-icon-success { background: #052e16; color: #4ade80; }
[data-bs-theme="dark"] .stat-card-icon-info { background: #172554; color: #60a5fa; }
[data-bs-theme="dark"] .stat-card-icon-warning { background: #422006; color: #fbbf24; }
[data-bs-theme="dark"] .stat-card-icon-danger { background: #450a0a; color: #f87171; }

[data-bs-theme="dark"] .card-header.bg-white,
[data-bs-theme="dark"] .bg-white.card-header,
[data-bs-theme="dark"] .card-footer.bg-white,
[data-bs-theme="dark"] .bg-white.card-footer {
  background-color: var(--bs-card-cap-bg) !important;
  border-color: var(--bs-card-border-color) !important;
}

[data-bs-theme="dark"] .report-type-btn {
  background: #1e293b;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .report-type-btn:hover {
  background: #334155;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .report-type-btn.is-active {
  background: linear-gradient(180deg, #475569 0%, #334155 100%);
  border-color: #64748b;
  color: #fff;
}
[data-bs-theme="dark"] .report-tabs .nav-link {
  background: var(--bs-body-bg);
  border-color: #475569;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .report-tabs .nav-link.active {
  background: #334155;
  border-color: #64748b;
  color: #fff;
}
[data-bs-theme="dark"] .report-summary-chip {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .report-summary-chip strong {
  color: #f1f5f9;
}

[data-bs-theme="dark"] .import-format-chip {
  background: #334155;
  border-color: #475569;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .import-dropzone {
  background: #1e293b;
  border-color: #475569;
}
[data-bs-theme="dark"] .import-dropzone-title { color: #f1f5f9; }
[data-bs-theme="dark"] .import-preview-check {
  background: #334155;
  border-color: #475569;
}

[data-bs-theme="dark"] .matrix-report-table tbody tr:nth-child(even) { background: #1e293b; }
[data-bs-theme="dark"] .matrix-report-table tbody tr:nth-child(odd) { background: #0f172a; }
[data-bs-theme="dark"] .matrix-report-table tbody .matrix-summary-col {
  background: #1e3a5f !important;
  color: #e2e8f0 !important;
}
[data-bs-theme="dark"] .matrix-report-card .matrix-report-header {
  background: linear-gradient(180deg, #166534 0%, #14532d 100%) !important;
  color: #fff;
}
[data-bs-theme="dark"] .matrix-report-card-qc .matrix-report-table tbody tr:nth-child(even) { background: #134e4a; }
[data-bs-theme="dark"] .matrix-report-card-qc .matrix-report-table tbody tr:nth-child(odd) { background: #0f172a; }
[data-bs-theme="dark"] .matrix-report-card-qc .matrix-report-header {
  background: linear-gradient(180deg, #115e59 0%, #0f4c47 100%) !important;
}
[data-bs-theme="dark"] .matrix-report-card .matrix-report-header .h5,
[data-bs-theme="dark"] .matrix-report-card .matrix-report-header h3 {
  color: #fff !important;
}
[data-bs-theme="dark"] .matrix-row-you { background: #422006 !important; }
[data-bs-theme="dark"] .matrix-day-col.has-value { color: #f1f5f9; }

[data-bs-theme="dark"] .dashboard-leaderboard .leaderboard-metric {
  background: #334155;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .dashboard-leaderboard .leaderboard-row-you {
  background: #422006 !important;
}

[data-bs-theme="dark"] .import-steps {
  background: var(--bs-card-bg);
  border-color: #334155;
}
[data-bs-theme="dark"] .login-page .brand-item {
  background: var(--bs-card-bg);
  border-color: #334155;
}
[data-bs-theme="dark"] .login-page .brand-item .name { color: #f1f5f9; }

[data-bs-theme="dark"] .table-app thead th {
  color: #94a3b8;
}
[data-bs-theme="dark"] .duplicate-row {
  background-color: #450a0a !important;
}

.query-row-open { background-color: #fffbeb !important; }
.query-row-awaiting { background-color: #eff6ff !important; }
.entry-was-query { background-color: #f0fdf4 !important; }
[data-bs-theme="dark"] .query-row-open { background-color: #422006 !important; }
[data-bs-theme="dark"] .query-row-awaiting { background-color: #1e3a5f !important; }
[data-bs-theme="dark"] .entry-was-query { background-color: #14532d !important; }
.query-badge-ex { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; vertical-align: middle; }

.query-detail-row td {
  background: transparent !important;
  border-top: none !important;
}
.query-detail-collapse-inner {
  padding: 0.75rem 1rem 1rem;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
}
.query-detail-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 1rem 1.25rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.query-detail-dl dt {
  font-weight: 500;
}
.query-detail-footnote code {
  font-size: 0.85em;
  padding: 0.1em 0.35em;
  background: #f1f5f9;
  border-radius: 4px;
}
.query-table tbody tr.query-row-open + .query-detail-row td,
.query-table tbody tr + .query-detail-row td {
  border-top: none;
}
.query-details-btn.active {
  background: #E66239;
  border-color: #E66239;
  color: #fff;
}
.query-action-btns .btn {
  white-space: nowrap;
}
.query-stat-value {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.2;
}
.query-stat-pill .card-body {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
[data-bs-theme="dark"] .query-detail-collapse-inner {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .query-detail-card {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .query-detail-footnote code {
  background: #334155;
}

.query-complete-alert {
  border-left: 3px solid #E66239;
}

/* Query Tab page — full content width (same as Entries / Reports) */
.queries-page {
  width: 100%;
  max-width: 100%;
}
.queries-stats {
  margin-bottom: 0.5rem;
}
.queries-stat {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.85rem 1rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  height: 100%;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.queries-stat-num {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.queries-stat-lbl {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}
.queries-stat-open { border-left: 4px solid #f59e0b; }
.queries-stat-open .queries-stat-num { color: #b45309; }
.queries-stat-awaiting { border-left: 4px solid #0ea5e9; }
.queries-stat-awaiting .queries-stat-num { color: #0284c7; }
.queries-stat-done { border-left: 4px solid #22c55e; }
.queries-stat-done .queries-stat-num { color: #15803d; }
.queries-stat-yours { border-left: 4px solid #6366f1; }
.queries-stat-yours .queries-stat-num { color: #4f46e5; }
.queries-action-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.85rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  font-size: 0.8125rem;
  color: #92400e;
}
.queries-panel {
  overflow: hidden;
  border-radius: 12px !important;
}
.queries-toolbar {
  padding: 0.85rem 1rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.queries-search-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.queries-search-wrap {
  position: relative;
  flex: 1 1 220px;
  min-width: 0;
}
.queries-search-wrap > .ti-search {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 1rem;
  pointer-events: none;
}
.queries-search-input {
  width: 100%;
  padding: 0.5rem 2rem 0.5rem 2.25rem;
  font-size: 0.875rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
}
.queries-search-input:focus {
  outline: none;
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.15);
}
.queries-search-clear {
  position: absolute;
  right: 0.35rem;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 6px;
  color: #64748b;
  text-decoration: none;
}
.queries-search-clear:hover {
  background: #f1f5f9;
  color: #0f172a;
}
.queries-mine-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.4rem 0.65rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}
.queries-mine-toggle input {
  accent-color: #E66239;
}
.queries-user-select {
  width: auto;
  min-width: 9rem;
  max-width: 11rem;
}
.queries-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 0 0.5rem;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}
.queries-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.75rem 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color 0.15s, border-color 0.15s;
}
.queries-tab:hover {
  color: #0f172a;
}
.queries-tab.is-active {
  color: #E66239;
  border-bottom-color: #E66239;
}
.queries-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  padding: 0.1rem 0.4rem;
  font-size: 0.6875rem;
  font-weight: 700;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
}
.queries-tab.is-active .queries-tab-count {
  background: rgba(230, 98, 57, 0.12);
  color: #c2410c;
}
.queries-list-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  padding: 0.85rem 1rem;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}
.queries-list-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #0f172a;
}
.queries-list-meta {
  font-size: 0.75rem;
  color: #64748b;
  margin-top: 0.15rem;
}
.queries-flow-hint {
  font-size: 0.75rem;
  color: #94a3b8;
}
.queries-table thead th {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}
.queries-batch {
  font-weight: 700;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
}
.queries-you-badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.05rem 0.35rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #4f46e5;
  background: #eef2ff;
  border-radius: 4px;
  vertical-align: middle;
}
.queries-cell-muted {
  color: #64748b;
  font-size: 0.8125rem;
}
.queries-cell-truncate {
  display: inline-block;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}
.queries-empty {
  text-align: center;
  padding: 3rem 1.5rem !important;
  color: #64748b;
}
.queries-empty .ti {
  font-size: 2rem;
  color: #cbd5e1;
  display: block;
  margin-bottom: 0.5rem;
}
[data-bs-theme="dark"] .queries-stat {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .queries-stat-lbl,
[data-bs-theme="dark"] .queries-list-meta,
[data-bs-theme="dark"] .queries-cell-muted,
[data-bs-theme="dark"] .queries-flow-hint {
  color: #94a3b8;
}
[data-bs-theme="dark"] .queries-toolbar {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .queries-search-input,
[data-bs-theme="dark"] .queries-mine-toggle {
  background: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .queries-tabs,
[data-bs-theme="dark"] .queries-list-head {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .queries-list-title {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .queries-tab {
  color: #94a3b8;
}
[data-bs-theme="dark"] .queries-tab:hover {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .queries-table thead th {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .queries-action-bar {
  background: #422006;
  border-color: #92400e;
  color: #fde68a;
}
[data-bs-theme="dark"] .queries-you-badge {
  background: #312e81;
  color: #c7d2fe;
}

/* Add Entry — query mode banners */
.entry-query-banner {
  border-radius: 10px;
  padding: 1rem 1.25rem;
  border: 1px solid #e2e8f0;
  background: #fff;
}
.entry-query-banner-send {
  border-color: #f59e0b;
  background: #fffbeb;
}
.entry-query-banner-complete {
  border-color: #22c55e;
  background: #f0fdf4;
}
.entry-query-banner-pending {
  border-color: #f59e0b;
  background: #fff7ed;
}
.entry-query-banner-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fef3c7;
  color: #d97706;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.entry-form-card.entry-form-query-send {
  box-shadow: 0 0 0 2px #f59e0b33 !important;
}
.entry-form-card.entry-form-query-complete {
  box-shadow: 0 0 0 2px #22c55e33 !important;
}
.entry-form-card.entry-form-query-pending {
  box-shadow: 0 0 0 2px #f9731633 !important;
}
[data-bs-theme="dark"] .entry-query-banner {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .entry-query-banner-send { background: #422006; border-color: #92400e; }
[data-bs-theme="dark"] .entry-query-banner-complete { background: #14532d; border-color: #166534; }
[data-bs-theme="dark"] .entry-query-banner-pending { background: #431407; border-color: #9a3412; }
.query-history-panel {
  margin-bottom: 0;
  line-height: 1.5;
  border-left: 3px solid #E66239;
}
.query-history-row td {
  background: transparent !important;
  padding-top: 0 !important;
}
.query-history-row + tr td,
tr + .query-history-row td {
  border-top: none;
}
[data-bs-theme="dark"] .query-history-panel.alert-info {
  background: #1e3a5f;
  border-color: #3b82f6;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .query-history-panel.alert-warning {
  background: #422006;
  border-color: #f59e0b;
  color: #fef3c7;
}

/* Dashboard panels — My / Query / Team separation */
.dashboard-panel {
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}
.dashboard-panel-mine {
  border-top: 4px solid #2563eb;
}
.dashboard-panel-query {
  border-top: 4px solid #f59e0b;
}
.dashboard-panel-team {
  border-top: 4px solid #64748b;
}
.dashboard-panel-leaderboard {
  border-top: 4px solid #E66239;
  background: #fff;
}
.dashboard-panel-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid #f1f5f9;
  background: #fafbfc;
}
.dashboard-panel-body {
  padding: 1.25rem 1.5rem 1.5rem;
}

.dash-user-id-active {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  border: 1px solid rgba(15, 118, 110, 0.22);
  background: linear-gradient(135deg, rgba(15, 118, 110, 0.08) 0%, rgba(20, 184, 166, 0.06) 100%);
}
.dash-user-id-active-label {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  font-weight: 600;
}
.dash-user-id-active-name {
  display: block;
  font-size: 1.05rem;
  color: #0f766e;
}
.dash-user-id-active-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.5rem;
  font-size: 0.875rem;
  color: #334155;
}
.dash-user-id-active-stats strong { color: #0f766e; }
.dash-user-id-dot { color: #94a3b8; }
.dash-user-id-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.75rem;
}
.dash-user-id-card {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.85rem 0.95rem;
  background: #fafbfc;
}
.dash-user-id-card-active {
  border-color: rgba(15, 118, 110, 0.35);
  background: linear-gradient(180deg, rgba(15, 118, 110, 0.08) 0%, #fff 100%);
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.08);
}
.dash-user-id-card-name {
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 0.55rem;
  font-size: 0.9375rem;
}
.dash-user-id-card-counts {
  display: flex;
  gap: 0.75rem;
}
.dash-user-id-count {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.dash-user-id-count strong {
  font-size: 1.05rem;
  line-height: 1.1;
  color: #0f766e;
}
.dash-user-id-count small {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
}

.dashboard-panel-title {
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0.35rem 0 0;
  color: #0f172a;
}
.dashboard-panel-sub {
  font-size: 0.8125rem;
  color: #64748b;
}
.dashboard-panel-badge {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.2rem 0.55rem;
  border-radius: 6px;
}
.dashboard-panel-badge-mine {
  background: #dbeafe;
  color: #1d4ed8;
}
.dashboard-panel-badge-query {
  background: #fef3c7;
  color: #b45309;
}
.dashboard-panel-badge-team {
  background: #f1f5f9;
  color: #475569;
}
.dashboard-query-snippet {
  background: #fffbeb;
  border-color: #fde68a !important;
}
[data-bs-theme="dark"] .dashboard-panel {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .dashboard-panel-header {
  background: #0f172a;
  border-bottom-color: #334155;
}
[data-bs-theme="dark"] .dashboard-panel-title { color: #f1f5f9; }
[data-bs-theme="dark"] .dashboard-panel-sub { color: #94a3b8; }
[data-bs-theme="dark"] .dashboard-query-snippet {
  background: #422006;
  border-color: #92400e !important;
}

/* Notifications */
.notification-dropdown .dropdown-menu {
  margin-top: 0.5rem;
  display: none;
}
.notification-dropdown .dropdown-menu.show {
  display: flex;
}
.notification-panel {
  width: min(380px, calc(100vw - 1.5rem));
  max-height: min(480px, calc(100vh - 5rem));
  flex-direction: column;
  overflow: hidden;
  border-radius: 12px !important;
}
.notification-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  border-bottom: 1px solid #e5e7eb;
  background: #fafbfc;
}
.notification-panel-foot {
  padding: 0.65rem 1rem;
  border-top: 1px solid #e5e7eb;
  background: #fafbfc;
  text-align: center;
}
.notification-panel-foot a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #E66239;
  text-decoration: none;
}
.notification-panel-foot a:hover {
  text-decoration: underline;
}
.notification-mark-all {
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b !important;
  text-decoration: none;
  white-space: nowrap;
}
.notification-mark-all:hover {
  color: #E66239 !important;
}
.notification-list,
.notification-page-list {
  overflow-y: auto;
  max-height: 360px;
}
.notification-page-list {
  max-height: none;
}
.notification-item {
  display: flex;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s;
}
.notification-item:hover {
  background: #f8fafc;
  color: inherit;
}
.notification-item-unread {
  background: #fff7ed;
}
.notification-item-unread:hover {
  background: #ffedd5;
}
.notification-item-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.1rem;
}
.notification-icon-warning { background: #fef3c7; color: #d97706; }
.notification-icon-danger { background: #fee2e2; color: #dc2626; }
.notification-icon-info { background: #dbeafe; color: #2563eb; }
.notification-icon-slate { background: #f1f5f9; color: #64748b; }
.notification-item-body {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.notification-item-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
.notification-item-title {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.35;
}
.notification-type-badge {
  font-size: 0.625rem;
  font-weight: 600;
  padding: 0.2em 0.45em;
  flex-shrink: 0;
}
.notification-item-msg {
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.45;
  word-break: break-word;
}
.notification-item-time {
  font-size: 0.6875rem;
  color: #94a3b8;
}
.notification-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: #94a3b8;
}
.notification-empty .ti {
  font-size: 1.75rem;
  display: block;
  margin-bottom: 0.5rem;
  opacity: 0.7;
}
.notification-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #E66239;
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1.1rem;
  text-align: center;
  border: 2px solid #fff;
}
[data-bs-theme="dark"] .notification-panel-head,
[data-bs-theme="dark"] .notification-panel-foot {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .notification-item {
  border-bottom-color: #334155;
}
[data-bs-theme="dark"] .notification-item:hover {
  background: #1e293b;
}
[data-bs-theme="dark"] .notification-item-unread {
  background: #422006;
}
[data-bs-theme="dark"] .notification-item-title {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .notification-item-msg {
  color: #94a3b8;
}
[data-bs-theme="dark"] .notification-badge {
  border-color: #1e293b;
}

/* Settings — month end close */
.month-close-card {
  border-top: 3px solid #E66239;
}
.month-close-steps {
  margin-bottom: 1.25rem;
}
.month-close-step {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.65rem 0.75rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #475569;
  height: 100%;
}
.month-close-step .ti {
  font-size: 1.1rem;
  color: #E66239;
  flex-shrink: 0;
}
.month-close-form-panel {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 1.25rem;
}
.month-close-switch-row {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0.5rem 0.75rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.month-close-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.month-close-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #64748b;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
}
.month-close-tag .ti {
  font-size: 0.9rem;
  color: #94a3b8;
}
.month-close-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
[data-bs-theme="dark"] .month-close-step {
  background: #0f172a;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .month-close-form-panel {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .month-close-switch-row {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .month-close-tag {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}
.settings-form .form-check-label {
  font-size: 0.875rem;
}

/* Closed month report */
.closed-month-hero {
  border-top: 3px solid #E66239;
}
.closed-month-stat-icon {
  font-size: 1.25rem;
  display: block;
  margin-bottom: 0.35rem;
}
.closed-month-stat-value {
  font-size: 1.35rem;
  line-height: 1.2;
}

/* Month close status (Settings tab) */
.month-close-status-banner {
  padding: 1.1rem 1.25rem;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  margin-bottom: 1rem;
}
.month-close-status-banner.is-ok {
  background: #f0fdf4;
  border-color: #bbf7d0;
}
.month-close-status-banner.is-ready {
  background: #eff6ff;
  border-color: #bfdbfe;
}
.month-close-status-banner.is-approaching {
  background: #fffbeb;
  border-color: #fde68a;
}
.month-close-status-banner.is-overdue {
  background: #fef2f2;
  border-color: #fecaca;
}
.month-close-status-banner-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.35rem;
}
.month-close-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: #fff;
  color: #334155;
  border: 1px solid rgba(15, 23, 42, 0.08);
}
.month-close-status-banner.is-overdue .month-close-status-badge {
  background: #fee2e2;
  color: #b91c1c;
  border-color: #fecaca;
}
.month-close-status-banner.is-approaching .month-close-status-badge {
  background: #fef3c7;
  color: #b45309;
  border-color: #fde68a;
}
.month-close-status-banner.is-ready .month-close-status-badge {
  background: #dbeafe;
  color: #1d4ed8;
  border-color: #bfdbfe;
}
.month-close-status-banner.is-ok .month-close-status-badge {
  background: #dcfce7;
  color: #15803d;
  border-color: #bbf7d0;
}
.month-close-status-action {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e293b;
}
.month-close-status-tz {
  font-size: 0.8125rem;
  color: #64748b;
}
.month-close-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.month-close-status-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.1rem 1.15rem;
  border-radius: 12px;
  border: 1px solid #eef2f6;
  background: #fff;
  min-height: 8.5rem;
}
.month-close-status-card.is-running {
  border-color: #bbf7d0;
  background: linear-gradient(180deg, #f0fdf4 0%, #fff 100%);
}
.month-close-status-card.is-closed {
  border-color: #e2e8f0;
  background: #fafbfc;
}
.month-close-status-card.is-next.is-ok,
.month-close-status-card.is-next.is-approaching {
  border-color: #fde68a;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
}
.month-close-status-card.is-next.is-ready,
.month-close-status-card.is-next.is-overdue {
  border-color: #fecaca;
  background: linear-gradient(180deg, #fef2f2 0%, #fff 100%);
}
.month-close-status-card-label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}
.month-close-status-card-label i {
  font-size: 0.95rem;
}
.month-close-status-card-month {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
}
.month-close-status-card-month.is-muted {
  font-size: 0.9375rem;
  color: #64748b;
}
.month-close-status-card-meta {
  font-size: 0.8125rem;
  color: #64748b;
}
.month-close-status-card-countdown,
.month-close-status-card-date {
  margin-top: auto;
  padding-top: 0.45rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
}
.month-close-status-card-countdown.is-overdue {
  color: #b91c1c;
}
.month-close-status-card-countdown.is-ready {
  color: #1d4ed8;
}
.month-close-status-card-countdown.is-today {
  color: #b45309;
}
.month-close-status-card-date {
  font-weight: 500;
}
@media (max-width: 720px) {
  .month-close-status-grid {
    grid-template-columns: 1fr;
  }
  .month-close-status-card {
    min-height: 0;
  }
}
[data-bs-theme="dark"] .month-close-status-card {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
}
[data-bs-theme="dark"] .month-close-status-card-month {
  color: #f1f5f9;
}

/* Month close admin reminder */
.month-close-reminder-banner {
  border-radius: 10px;
  padding: 1rem 1.15rem;
  border: 1px solid transparent;
}
.month-close-reminder-approaching {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}
.month-close-reminder-overdue {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}
.month-close-reminder-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  background: rgba(255, 255, 255, 0.65);
}
[data-bs-theme="dark"] .month-close-reminder-approaching {
  background: #422006;
  border-color: #92400e;
  color: #fde68a;
}
[data-bs-theme="dark"] .month-close-reminder-overdue {
  background: #450a0a;
  border-color: #991b1b;
  color: #fecaca;
}
[data-bs-theme="dark"] .month-close-reminder-icon {
  background: rgba(0, 0, 0, 0.25);
}

.sidebar .nav-link.nav-link-month-due {
  background: rgba(245, 158, 11, 0.12);
  border-left: 3px solid #f59e0b;
  padding-left: calc(1rem - 3px);
}
.sidebar .nav-link.nav-link-month-due.active {
  background: rgba(245, 158, 11, 0.2);
}
.month-close-nav-badge {
  min-width: 1.25rem;
  font-weight: 700;
}

.month-close-month-tabs-wrap {
  padding-bottom: 0.25rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.month-close-month-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.85rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 999px;
  text-decoration: none;
  color: inherit;
  background: var(--bs-body-bg);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.month-close-month-tab:hover {
  border-color: rgba(37, 99, 235, 0.45);
  color: inherit;
}
.month-close-month-tab.is-selected {
  border-color: #2563eb;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.15);
}
.month-close-month-tab.is-due {
  border-color: #f59e0b;
  background: rgba(245, 158, 11, 0.08);
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.2);
}
.month-close-month-tab.is-due.is-selected {
  border-color: #d97706;
  background: rgba(245, 158, 11, 0.14);
}
.month-close-month-tab-label {
  font-size: 0.8125rem;
  font-weight: 600;
}
.month-close-month-tab-badge {
  font-size: 0.625rem;
  letter-spacing: 0.02em;
}
.month-close-popup-countdown {
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.25);
}
[data-bs-theme="dark"] .month-close-month-tab.is-due {
  background: rgba(245, 158, 11, 0.12);
}
[data-bs-theme="dark"] .sidebar .nav-link.nav-link-month-due {
  background: rgba(245, 158, 11, 0.1);
}

.month-user-close-progress {
  padding: 0.75rem 1rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  background: var(--bs-body-bg);
}

.month-user-close-progress .progress {
  background: rgba(0, 0, 0, 0.06);
}

[data-bs-theme="dark"] .month-user-close-progress {
  background: rgba(255, 255, 255, 0.03);
}

[data-bs-theme="dark"] .month-user-close-progress .progress {
  background: rgba(255, 255, 255, 0.08);
}

/* Entries page filters */
.entries-filter-block {
  padding-bottom: 0.25rem;
}
.entries-filter-block-title {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 0.65rem;
}
.entries-filter-switch {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0.5rem 0.75rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.entries-filter-footer {
  padding-top: 1rem;
  border-top: 1px solid #e5e7eb;
}
.entries-filter-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.entries-filter-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
}
.entries-bulk-col {
  width: 2.5rem;
  text-align: center;
  vertical-align: middle;
}
[data-bs-theme="dark"] .entries-filter-switch {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .entries-filter-footer {
  border-top-color: #334155;
}
[data-bs-theme="dark"] .entries-filter-block-title {
  color: #94a3b8;
}
[data-bs-theme="dark"] .entries-filter-tag {
  background: #1e293b;
  border-color: #334155;
  color: #cbd5e1;
}

/* Entries table — query detail sub-row */
tr.entry-has-query-detail > td {
  border-bottom: none;
}
tr.query-history-row > td.entry-query-detail-cell {
  padding: 0 1rem 0.75rem 1rem;
  border-top: none;
  background: #fafafa;
}
.entry-query-strip {
  margin-left: 1.75rem;
  padding: 0.7rem 0.9rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-left: 3px solid #E66239;
  border-radius: 0 8px 8px 0;
  font-size: 0.8125rem;
}
.entry-query-strip-done {
  border-left-color: #0ea5e9;
}
.entry-query-strip-open {
  border-left-color: #f59e0b;
  background: #fffbeb;
}
.entry-query-strip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 0.65rem 1.5rem;
}
.entry-query-strip-label {
  display: block;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #94a3b8;
  margin-bottom: 0.15rem;
}
.entry-query-strip-value {
  display: block;
  color: #334155;
  font-weight: 500;
  line-height: 1.35;
  word-break: break-word;
}
.entry-query-strip-note {
  margin-top: 0.55rem;
  padding-top: 0.55rem;
  border-top: 1px dashed #e5e7eb;
  color: #64748b;
  font-size: 0.75rem;
}
.query-badge-ex {
  font-size: 0.6875rem;
}
[data-bs-theme="dark"] tr.query-history-row > td.entry-query-detail-cell {
  background: #0f172a;
}
[data-bs-theme="dark"] .entry-query-strip {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .entry-query-strip-open {
  background: #422006;
}
[data-bs-theme="dark"] .entry-query-strip-value {
  color: #e2e8f0;
}
[data-bs-theme="dark"] .entry-query-strip-note {
  border-top-color: #334155;
  color: #94a3b8;
}

/* Team chat — WhatsApp-inspired */
.wa-chat {
  --wa-teal: #008069;
  --wa-teal-dark: #005c4b;
  --wa-green: #25d366;
  --wa-bg: #efeae2;
  --wa-sent: #d9fdd3;
  --wa-received: #ffffff;
  --wa-compose: #f0f2f5;
}
.chat-app {
  overflow: hidden;
  border-radius: 12px !important;
}
.chat-app-inner {
  display: flex;
  min-height: calc(100vh - 220px);
  max-height: calc(100vh - 180px);
}
.chat-sidebar {
  width: 340px;
  flex-shrink: 0;
  border-right: 1px solid #e9edef;
  display: flex;
  flex-direction: column;
  background: #fff;
}
.wa-sidebar-head {
  background: var(--wa-compose);
  border-bottom: 1px solid #e9edef;
  padding: 0.85rem 1rem !important;
}
.wa-sidebar-head-main h2 {
  color: #111b21;
}
.wa-sidebar-sub {
  color: #667781 !important;
}
.wa-unread-pill {
  background: var(--wa-teal) !important;
  color: #fff !important;
  border: none;
  font-weight: 600;
}
.chat-sidebar-search {
  padding: 0.5rem 0.75rem;
  background: #fff;
  border-bottom: 1px solid #f0f2f5;
}
.wa-search .input-group-text {
  background: #f0f2f5;
  border: none;
  color: #54656f;
  border-radius: 8px 0 0 8px;
}
.wa-search .form-control {
  background: #f0f2f5;
  border: none;
  border-radius: 0 8px 8px 0;
  font-size: 0.875rem;
}
.wa-search .form-control:focus {
  box-shadow: none;
  background: #fff;
}
.chat-user-list {
  max-height: 200px;
  overflow-y: auto;
  padding: 0.25rem 0.35rem;
}
.chat-user-item,
.chat-recent-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  border-radius: 0;
  text-decoration: none;
  color: inherit;
  transition: background 0.12s;
  border: none !important;
}
.chat-user-item:hover,
.chat-recent-item:hover {
  background: #f5f6f6;
  color: inherit;
}
.chat-user-item.active,
.chat-recent-item.active {
  background: #f0f2f5;
}
.wa-avatar {
  background: linear-gradient(135deg, #00a884, #008069) !important;
  color: #fff;
}
.wa-avatar-sm {
  width: 1.75rem;
  height: 1.75rem;
  font-size: 0.625rem;
  font-weight: 700;
  border-radius: 50%;
  background: linear-gradient(135deg, #00a884, #008069);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.chat-avatar {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  font-size: 0.875rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.chat-avatar-sm {
  width: 2.25rem;
  height: 2.25rem;
  font-size: 0.75rem;
}
.chat-avatar-wrap {
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
}
.chat-online-dot {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: #8696a0;
  border: 2px solid #fff;
}
.chat-online-dot.is-online {
  background: #25d366;
}
.chat-status-online {
  color: #8696a0;
  font-weight: 400;
  text-transform: lowercase;
}
.chat-status-offline {
  color: #8696a0;
  text-transform: lowercase;
}
.chat-status-typing {
  color: var(--wa-teal);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-transform: lowercase;
}
.chat-typing-dots {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.chat-typing-dots span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  animation: chatTypingBounce 1.2s infinite ease-in-out;
}
.chat-typing-dots span:nth-child(2) { animation-delay: 0.15s; }
.chat-typing-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes chatTypingBounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.45; }
  30% { transform: translateY(-3px); opacity: 1; }
}
.chat-typing-bar,
.wa-typing-bar {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  padding: 0 1rem 0.5rem;
  background: var(--wa-bg);
}
.chat-typing-bubble {
  padding: 0.55rem 0.85rem;
  background: var(--wa-received);
  border-radius: 8px 8px 8px 0;
  box-shadow: 0 1px 0.5px rgba(11, 20, 26, 0.13);
  color: #54656f;
}
.chat-bubble-avatar {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  font-size: 0.625rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  align-self: flex-end;
  margin-bottom: 0.35rem;
}
.chat-bubble-avatar-sm {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 0.5625rem;
  margin-bottom: 0;
}
.chat-bubble-col {
  max-width: min(72%, 480px);
  display: flex;
  flex-direction: column;
}
.chat-user-item-body,
.chat-recent-body {
  min-width: 0;
  flex: 1;
}
.chat-user-item-name,
.chat-recent-name {
  display: block;
  font-size: 1rem;
  font-weight: 400;
  color: #111b21;
}
.chat-user-item-meta {
  display: block;
  font-size: 0.8125rem;
  color: #667781;
  text-transform: lowercase;
}
.chat-recent-label {
  padding: 0.65rem 1rem 0.25rem;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #008069;
}
.chat-recent-list {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.chat-recent-top {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  align-items: baseline;
}
.chat-recent-time {
  font-size: 0.75rem;
  color: #667781;
  white-space: nowrap;
}
.chat-recent-preview {
  display: block;
  font-size: 0.8125rem;
  color: #667781;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chat-recent-unread,
.wa-unread-count {
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.35rem;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.chat-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--wa-bg);
}
.wa-chat-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  background: var(--wa-compose);
  border-bottom: 1px solid #e9edef;
}
.wa-head-name {
  color: #111b21;
  font-size: 1rem;
}
.wa-head-status {
  color: #667781 !important;
}
.wa-head-menu {
  color: #54656f;
  border: none;
  background: transparent;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.wa-head-menu:hover {
  background: rgba(0, 0, 0, 0.05);
  color: #111b21;
}
.wa-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 4%;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  background-color: var(--wa-bg);
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23d4cdc4' fill-opacity='0.35'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.chat-bubble-wrap {
  display: flex;
  align-items: flex-end;
  gap: 0.4rem;
  transition: opacity 0.18s, transform 0.18s;
}
.chat-bubble-wrap.chat-bubble-removing {
  opacity: 0;
  transform: scale(0.96);
}
.chat-bubble-wrap.mine {
  justify-content: flex-end;
}
.chat-bubble-wrap.theirs {
  justify-content: flex-start;
}
.chat-bubble {
  position: relative;
  padding: 0.4rem 0.55rem 0.3rem 0.65rem;
  border-radius: 8px;
  box-shadow: 0 1px 0.5px rgba(11, 20, 26, 0.13);
  border: none;
}
.chat-bubble-wrap.theirs .chat-bubble {
  background: var(--wa-received);
  border-radius: 0 8px 8px 8px;
}
.chat-bubble-wrap.mine .chat-bubble {
  background: var(--wa-sent);
  border-radius: 8px 0 8px 8px;
  color: #111b21;
}
.chat-bubble-text {
  font-size: 0.875rem;
  line-height: 1.4;
  word-break: break-word;
  padding-right: 0.25rem;
}
.chat-bubble-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.2rem;
  margin-top: 0.15rem;
  float: right;
  margin-left: 0.5rem;
  position: relative;
  top: 0.2rem;
}
.chat-bubble-time {
  font-size: 0.6875rem;
  color: #667781;
  white-space: nowrap;
  line-height: 1;
}
.chat-bubble-ticks {
  font-size: 0.875rem;
  color: #8696a0;
  line-height: 1;
  display: inline-flex;
}
.chat-bubble-ticks.read {
  color: #53bdeb;
}
.chat-msg-delete {
  border: none;
  background: transparent;
  color: #8696a0;
  padding: 0;
  width: 1.1rem;
  height: 1.1rem;
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  cursor: pointer;
  border-radius: 4px;
  margin-left: 0.1rem;
}
.chat-bubble-wrap.mine:hover .chat-msg-delete,
.chat-bubble-wrap.mine:focus-within .chat-msg-delete {
  display: inline-flex;
}
.chat-msg-delete:hover {
  color: #ea0038;
  background: rgba(234, 0, 56, 0.08);
}
.wa-compose {
  padding: 0.5rem 0.75rem;
  background: var(--wa-compose);
  border-top: 1px solid #e9edef;
}
.wa-compose-inner {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  background: #fff;
  border-radius: 8px;
  padding: 0.35rem 0.35rem 0.35rem 0.85rem;
}
.chat-compose-input {
  resize: none;
  min-height: 24px;
  max-height: 120px;
  border: none;
  background: transparent;
  padding: 0.45rem 0;
  font-size: 0.9375rem;
  box-shadow: none !important;
}
.chat-compose-input:focus {
  box-shadow: none;
}
.wa-send-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: var(--wa-teal);
  border: none;
  color: #fff;
}
.wa-send-btn:hover,
.wa-send-btn:focus {
  background: var(--wa-teal-dark);
  color: #fff;
}
.wa-send-btn:disabled {
  opacity: 0.6;
}
.chat-main-empty,
.chat-empty-thread,
.wa-main-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #667781;
  padding: 2rem;
  background: var(--wa-bg);
}
.wa-empty-logo,
.wa-empty-icon {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  background: rgba(0, 128, 105, 0.1);
  color: var(--wa-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  margin-bottom: 1.25rem;
}
.wa-main-empty .wa-empty-logo {
  font-size: 2.5rem;
}
#chatUnreadBadge:empty,
#chatUnreadBadge[data-zero="1"] {
  display: none;
}
@media (max-width: 768px) {
  .chat-app-inner {
    flex-direction: column;
    min-height: auto;
    max-height: none;
  }
  .chat-sidebar {
    width: 100%;
    max-height: 280px;
    border-right: none;
    border-bottom: 1px solid #e9edef;
  }
  .chat-main {
    min-height: 420px;
  }
  .wa-messages {
    padding: 0.75rem 3%;
  }
}
[data-bs-theme="dark"] .wa-chat {
  --wa-bg: #0b141a;
  --wa-compose: #202c33;
  --wa-sent: #005c4b;
  --wa-received: #202c33;
}
[data-bs-theme="dark"] .chat-sidebar,
[data-bs-theme="dark"] .wa-sidebar-head,
[data-bs-theme="dark"] .wa-compose,
[data-bs-theme="dark"] .wa-compose-inner {
  background: #111b21;
  border-color: #222d34;
}
[data-bs-theme="dark"] .wa-compose-inner {
  background: #2a3942;
}
[data-bs-theme="dark"] .chat-compose-input {
  color: #e9edef;
}
[data-bs-theme="dark"] .chat-user-item-name,
[data-bs-theme="dark"] .chat-recent-name,
[data-bs-theme="dark"] .wa-head-name {
  color: #e9edef;
}
[data-bs-theme="dark"] .chat-user-item.active,
[data-bs-theme="dark"] .chat-recent-item.active {
  background: #2a3942;
}
[data-bs-theme="dark"] .chat-bubble-wrap.mine .chat-bubble {
  color: #e9edef;
}
[data-bs-theme="dark"] .chat-bubble-wrap.theirs .chat-bubble {
  color: #e9edef;
}
[data-bs-theme="dark"] .wa-messages {
  background-color: #0b141a;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23182229' fill-opacity='0.8'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

/* Floating chat button — all pages */
.chat-fab {
  position: fixed;
  right: 1.35rem;
  bottom: 1.35rem;
  z-index: 1055;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 1.1rem 0.85rem 0.95rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #25d366, #008069);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0, 128, 105, 0.35), 0 2px 8px rgba(0, 0, 0, 0.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease, padding 0.2s ease;
  animation: chatFabIn 0.35s ease;
}
.chat-fab:hover,
.chat-fab:focus {
  color: #fff;
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 12px 28px rgba(0, 128, 105, 0.42), 0 4px 12px rgba(0, 0, 0, 0.14);
}
.chat-fab-icon-wrap {
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
}
.chat-fab-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.chat-fab-label {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.chat-fab-badge {
  position: absolute;
  top: -0.45rem;
  right: -0.55rem;
  min-width: 1.45rem;
  height: 1.45rem;
  padding: 0 0.4rem;
  border-radius: 999px;
  background: #ff3b30;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2.5px solid #fff;
  box-shadow: 0 2px 8px rgba(255, 59, 48, 0.45);
  z-index: 3;
  font-variant-numeric: tabular-nums;
}
.chat-fab-badge.is-hidden {
  display: none !important;
}
.chat-fab-badge-pop {
  animation: chatFabBadgePop 0.45s ease;
}
.chat-fab-has-unread {
  animation: chatFabPulse 2s ease-in-out infinite;
}
@keyframes chatFabBadgePop {
  0% { transform: scale(0.5); opacity: 0.5; }
  55% { transform: scale(1.25); }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes chatFabIn {
  from { opacity: 0; transform: translateY(12px) scale(0.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes chatFabPulse {
  0%, 100% { box-shadow: 0 8px 24px rgba(0, 128, 105, 0.35), 0 2px 8px rgba(0, 0, 0, 0.12); }
  50% { box-shadow: 0 8px 28px rgba(37, 211, 102, 0.55), 0 0 0 6px rgba(37, 211, 102, 0.12); }
}
@media (max-width: 576px) {
  .chat-fab {
    right: 1rem;
    bottom: 1rem;
    padding: 0.9rem;
    width: 3.5rem;
    height: 3.5rem;
    justify-content: center;
  }
  .chat-fab-label {
    display: none;
  }
  .chat-fab-icon {
    width: 1.5rem;
    height: 1.5rem;
    background: transparent;
    font-size: 1.35rem;
  }
  .chat-fab-badge {
    top: -0.35rem;
    right: -0.45rem;
    min-width: 1.35rem;
    height: 1.35rem;
    font-size: 0.6875rem;
  }
}
[data-bs-theme="dark"] .chat-fab {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), 0 2px 8px rgba(0, 0, 0, 0.25);
}
[data-bs-theme="dark"] .chat-fab-badge {
  border-color: #111b21;
}

/* Dashboard date filter chips */
.dashboard-range-chip {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 0.65rem 0.85rem;
}
.dashboard-range-chip .label {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 0.15rem;
}
/* Attendance — compact bar panel */
.attendance-pro {
  background: #fff;
  border: 1px solid #d1fae5;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.08);
  overflow: hidden;
}
.attendance-pro--working {
  background: linear-gradient(90deg, #ecfdf5 0%, #f0fdf4 45%, #fff 100%);
  border-color: #6ee7b7;
  box-shadow: 0 2px 10px rgba(16, 185, 129, 0.14);
}
.attendance-pro--idle {
  background: linear-gradient(90deg, #f8fafc 0%, #fff 100%);
  border-color: #e2e8f0;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05);
}
.attendance-pro--break {
  border-color: #fcd34d;
}
.attendance-pro--break .attendance-pro-status-dot {
  background: #f59e0b;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.25);
}
.attendance-pro--done {
  border-color: #cbd5e1;
}
.attendance-pro-bar {
  display: block;
  padding: 0;
}
.attendance-shift-box {
  background: #fff;
  border: 1px solid #d1fae5;
  border-radius: 8px;
  padding: 0.5rem 0.65rem;
  min-width: 0;
}
.attendance-pro--idle .attendance-shift-box {
  border-color: #e2e8f0;
}
.attendance-shift-box--dur {
  border-color: #86efac;
  background: #f0fdf4;
}
.attendance-shift-box-label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 0.15rem;
  line-height: 1.2;
}
.attendance-shift-box-label i {
  font-size: 0.75rem;
}
.attendance-shift-box-value {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  word-break: break-word;
}
.attendance-pro-bar-head {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex: 0 0 auto;
  min-width: 8.5rem;
}
.attendance-pro-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  flex: 1 1 320px;
  min-width: 0;
}
.attendance-pro-metrics--idle {
  grid-template-columns: minmax(9rem, 12rem) minmax(0, 1fr);
  align-items: center;
}
.attendance-stat {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.5rem 0.65rem;
  background: #fff;
  border: 1px solid #d1fae5;
  border-radius: 8px;
  min-width: 0;
}
.attendance-pro--idle .attendance-stat {
  border-color: #e2e8f0;
}
.attendance-stat-label {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  line-height: 1.2;
}
.attendance-stat-label i {
  font-size: 0.75rem;
  opacity: 0.85;
}
.attendance-stat-value {
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.25;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  word-break: break-word;
}
.attendance-stat--in .attendance-stat-value {
  color: #1e40af;
}
.attendance-stat--dur .attendance-stat-value {
  font-size: 1.125rem;
  color: #047857;
}
.attendance-stat-value--clock {
  font-size: 0.875rem;
  color: #334155;
}
.attendance-pro-idle-hint {
  font-size: 0.6875rem;
  color: #64748b;
  line-height: 1.35;
}
.attendance-pro-bar-status {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex: 1 1 160px;
  min-width: 0;
}
.attendance-pro-bar-status-text {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}
.attendance-pro-status-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #94a3b8;
}
.attendance-pro--working .attendance-pro-status-dot {
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.35);
  animation: attendance-pulse 2s ease-in-out infinite;
}
@keyframes attendance-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.35); }
  50% { box-shadow: 0 0 0 5px rgba(16, 185, 129, 0.15); }
}
.attendance-pro--done .attendance-pro-status-dot {
  background: #64748b;
}
.attendance-pro-status-label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}
.attendance-pro--working .attendance-pro-status-label {
  color: #047857;
}
.attendance-pro-status-meta {
  font-size: 0.6875rem;
  color: #64748b;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.attendance-pro--working .attendance-pro-status-meta {
  color: #059669;
}
.attendance-pro-bar-clock {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  padding: 0.35rem 0.65rem;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: 8px;
  flex: 0 1 auto;
}
.attendance-pro--idle .attendance-pro-bar-clock {
  border-color: #e2e8f0;
  background: #fff;
}
.attendance-pro-clock-label {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #059669;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  background: #d1fae5;
}
.attendance-pro--idle .attendance-pro-clock-label {
  color: #475569;
  background: #f1f5f9;
}
.attendance-pro-clock-value {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  color: #0f172a;
}
.attendance-pro--working .attendance-pro-clock-value {
  color: #047857;
  font-size: 1.05rem;
}
.attendance-pro-clock-note {
  font-size: 0.6875rem;
  color: #64748b;
  white-space: nowrap;
}
.attendance-pro-bar-actions {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex: 0 0 auto;
  margin-left: auto;
}
@media (max-width: 767.98px) {
  .attendance-pro-bar-actions {
    width: 100%;
    margin-left: 0;
  }
  .attendance-pro-metrics {
    grid-template-columns: 1fr;
    width: 100%;
  }
  .attendance-pro-metrics--idle {
    grid-template-columns: 1fr;
  }
  .attendance-pro-bar-head {
    width: 100%;
  }
}
.btn-attendance-in,
.btn-attendance-out {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.45rem 0.85rem;
  font-weight: 600;
  font-size: 0.8125rem;
  border-radius: 8px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.btn-attendance-in {
  background: #10b981;
  color: #fff;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.35);
}
.btn-attendance-in:hover {
  background: #059669;
  color: #fff;
}
.btn-attendance-out {
  background: #fff;
  color: #b45309;
  border-color: #fde68a;
  box-shadow: 0 1px 4px rgba(251, 191, 36, 0.2);
}
.btn-attendance-out:hover {
  background: #fffbeb;
  color: #92400e;
  border-color: #fbbf24;
}
.btn-attendance-report {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  font-size: 1rem;
  flex-shrink: 0;
}
.btn-attendance-report:hover {
  background: #f8fafc;
  color: #0f172a;
  border-color: #cbd5e1;
}
@media (max-width: 767.98px) {
  .btn-attendance-in,
  .btn-attendance-out {
    flex: 1;
  }
}
/* Legacy attendance blocks (team/metrics pages) */
.attendance-pro-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.35rem;
  border-bottom: 1px solid #eef2f6;
  background: #fafbfc;
}
.attendance-pro-header-main {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}
.attendance-pro-header-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  color: #475569;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.attendance-pro--working .attendance-pro-header-icon {
  background: #ecfdf5;
  color: #059669;
}
.attendance-pro-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.01em;
}
.attendance-pro-subtitle {
  font-size: 0.8125rem;
  color: #6b7280;
}
.attendance-pro-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.attendance-pro-session {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 1.25rem;
  align-items: center;
  padding: 1.35rem;
  border-bottom: 1px solid #eef2f6;
}
@media (max-width: 991.98px) {
  .attendance-pro-session {
    grid-template-columns: 1fr;
    text-align: center;
  }
}
.attendance-pro-session-status {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
@media (max-width: 991.98px) {
  .attendance-pro-session-status {
    justify-content: center;
    text-align: left;
  }
}
.attendance-pro-status-text {
  font-size: 0.8125rem;
  color: #6b7280;
  line-height: 1.45;
}
.attendance-pro-session-clock {
  text-align: center;
  padding: 0.85rem 1rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
}
.attendance-pro-session-action {
  max-width: 220px;
  width: 100%;
  justify-self: end;
}
@media (max-width: 991.98px) {
  .attendance-pro-session-action {
    justify-self: center;
    margin-inline: auto;
  }
}
.attendance-pro-action-note {
  margin-top: 0.55rem;
  font-size: 0.75rem;
  color: #6b7280;
  text-align: center;
}
.attendance-pro-finished {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.85rem 1rem;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}
.attendance-pro-finished i {
  font-size: 1.35rem;
  color: #059669;
}
.attendance-pro-finished strong {
  display: block;
  font-size: 0.875rem;
  color: #111827;
}
.attendance-pro-finished p {
  font-size: 0.75rem;
  color: #6b7280;
}
.attendance-pro-metrics-legacy {
  padding: 1.15rem 1.35rem 1.35rem;
}
.attendance-pro-metric {
  height: 100%;
  padding: 0.9rem 1rem;
  background: #fafbfc;
  border: 1px solid #eef2f6;
  border-radius: 10px;
}
.attendance-pro-metric-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6b7280;
  margin-bottom: 0.25rem;
}
.attendance-pro-metric strong {
  display: block;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  color: #111827;
}
.attendance-pro-metric-sub {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.75rem;
  color: #94a3b8;
}
.attendance-pro-team-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.attendance-pro-team-title {
  margin: 0 0 0.15rem;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
}
.attendance-pro-team-sub {
  font-size: 0.8125rem;
  color: #6b7280;
}
.attendance-pro-team-card {
  border-radius: 12px !important;
  border: 1px solid #e5e7eb !important;
}
.attendance-pro-team-user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.attendance-pro-team-avatar {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  color: #475569;
  font-size: 0.7rem;
  font-weight: 700;
  flex-shrink: 0;
}
.attendance-pro-badge {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.35em 0.65em;
  border-radius: 6px;
}
.attendance-pro-badge--away {
  background: #f1f5f9 !important;
  color: #64748b !important;
}
.attendance-pro-badge--live {
  background: #ecfdf5 !important;
  color: #047857 !important;
}
.attendance-pro-badge--done {
  background: #f8fafc !important;
  color: #475569 !important;
}
[data-bs-theme="dark"] .attendance-pro {
  background: #1e293b;
  border-color: #334155;
  box-shadow: none;
}
[data-bs-theme="dark"] .attendance-pro--working {
  background: linear-gradient(90deg, rgba(6, 78, 59, 0.45) 0%, #1e293b 100%);
  border-color: #059669;
}
[data-bs-theme="dark"] .attendance-shift-box {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-shift-box--dur {
  background: rgba(6, 78, 59, 0.35);
  border-color: #059669;
}
[data-bs-theme="dark"] .attendance-shift-box-value {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .attendance-shift-box--dur .attendance-shift-box-value.text-success {
  color: #6ee7b7 !important;
}
[data-bs-theme="dark"] .attendance-stat {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-stat-value {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .attendance-stat--dur .attendance-stat-value {
  color: #6ee7b7;
}
[data-bs-theme="dark"] .attendance-stat--in .attendance-stat-value {
  color: #93c5fd;
}
[data-bs-theme="dark"] .attendance-pro-bar-clock {
  background: rgba(15, 23, 42, 0.6);
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-pro-clock-label {
  background: rgba(16, 185, 129, 0.2);
  color: #6ee7b7;
}
[data-bs-theme="dark"] .attendance-pro-status-label {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .attendance-pro--working .attendance-pro-status-label {
  color: #6ee7b7;
}
[data-bs-theme="dark"] .attendance-pro-header,
[data-bs-theme="dark"] .attendance-pro-session {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-pro-title,
[data-bs-theme="dark"] .attendance-pro-metric strong,
[data-bs-theme="dark"] .attendance-pro-team-title,
[data-bs-theme="dark"] .attendance-pro-clock-value {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .attendance-pro--working .attendance-pro-clock-value {
  color: #6ee7b7;
}
[data-bs-theme="dark"] .attendance-pro-session-clock,
[data-bs-theme="dark"] .attendance-pro-metric,
[data-bs-theme="dark"] .attendance-pro-finished {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-pro-subtitle,
[data-bs-theme="dark"] .attendance-pro-status-text,
[data-bs-theme="dark"] .attendance-pro-status-meta,
[data-bs-theme="dark"] .attendance-pro-metric-label,
[data-bs-theme="dark"] .attendance-pro-team-sub {
  color: #94a3b8;
}
[data-bs-theme="dark"] .btn-attendance-report {
  background: #334155;
  border-color: #475569;
  color: #e2e8f0;
}
.attendance-checkout-summary--compact {
  margin-bottom: 0;
  gap: 0.5rem;
}
.attendance-checkout-summary--compact .attendance-checkout-summary-item {
  padding: 0.55rem 0.5rem;
}
.attendance-checkout-summary--compact .attendance-checkout-summary-value {
  font-size: 0.875rem;
}
.attendance-admin-card {
  border-radius: 12px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06) !important;
}
.attendance-admin-card .card-header {
  background: #f8fafc !important;
  padding: 1rem 1.25rem !important;
}
.attendance-admin-card .table thead th {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}
[data-bs-theme="dark"] .attendance-admin-card {
  border-color: #334155 !important;
  box-shadow: none !important;
}
[data-bs-theme="dark"] .attendance-admin-card .card-header {
  background: #0f172a !important;
}

/* Attendance report page */
.attendance-page {
  max-width: 1180px;
}
.att-report-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}
@media (min-width: 768px) {
  .att-report-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.att-report-stat {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.1rem 1.25rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}
.att-report-stat-num {
  display: block;
  font-size: 1.75rem;
  font-weight: 800;
  line-height: 1.1;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}
.att-report-stat-lbl {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
}
.att-report-stat--open { border-left: 4px solid #f59e0b; }
.att-report-stat--open .att-report-stat-num { color: #b45309; }
.att-report-stat--time { border-left: 4px solid #22c55e; }
.att-report-stat--time .att-report-stat-num { color: #15803d; font-size: 1.35rem; }
.att-report-stat--live { border-left: 4px solid #0ea5e9; }
.att-report-stat--live .att-report-stat-num { color: #0284c7; }
.att-report-stat--users { border-left: 4px solid #6366f1; }
.att-report-stat--users .att-report-stat-num { color: #4f46e5; }

.att-filter-panel {
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.25rem 1.35rem;
  margin-bottom: 1.25rem;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
}
.att-filter-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}
.att-filter-panel .form-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #475569;
}
.att-filter-panel .form-control,
.att-filter-panel .form-select {
  min-height: 42px;
  border-radius: 8px;
}
.att-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  padding-top: 0.25rem;
}
.att-filter-range {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid #e2e8f0;
  font-size: 0.875rem;
  color: #64748b;
}

.att-panel {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
  margin-bottom: 1.25rem;
}
.att-panel-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.35rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.att-panel-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}
.att-panel-sub {
  font-size: 0.8125rem;
  color: #64748b;
  margin: 0.15rem 0 0;
}

.att-user-table tbody td {
  padding: 1rem 1.25rem;
  vertical-align: middle;
}
.att-user-table tbody tr:hover {
  background: #f8fafc;
}
.att-user-link {
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  text-decoration: none;
  color: #0f172a;
  font-weight: 700;
  font-size: 1rem;
}
.att-user-link:hover { color: #E66239; }
.att-user-avatar {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #E66239 0%, #f59e0b 100%);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.att-time-big {
  font-size: 1.05rem;
  font-weight: 700;
  color: #15803d;
}
.att-btn-view {
  min-width: 6.5rem;
  padding: 0.5rem 1rem;
  font-weight: 600;
  border-radius: 8px;
}

.att-detail-hero {
  background: linear-gradient(135deg, #fff7ed 0%, #fff 45%, #f0fdf4 100%);
  border-bottom: 1px solid #e2e8f0;
  padding: 1.35rem 1.5rem;
}
.att-detail-hero .breadcrumb {
  font-size: 0.875rem;
}
.att-detail-profile {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  margin-top: 0.75rem;
}
.att-detail-avatar {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #E66239, #ea580c);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  box-shadow: 0 4px 14px rgba(230, 98, 57, 0.35);
}
.att-detail-name {
  font-size: 1.5rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 0.2rem;
}
.att-detail-range {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
}
.att-detail-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-left: auto;
}
.att-detail-stat {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.65rem 1.1rem;
  text-align: center;
  min-width: 7rem;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
}
.att-detail-stat strong {
  display: block;
  font-size: 1.25rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
}
.att-detail-stat span {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-top: 0.2rem;
}
.att-detail-stat--time strong { color: #15803d; }

.att-day-list {
  padding: 1.25rem 1.35rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.att-day-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.att-day-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 1.15rem;
  background: linear-gradient(90deg, #f8fafc 0%, #fff 100%);
  border-bottom: 1px solid #e2e8f0;
}
.att-day-date {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}
.att-day-meta {
  font-size: 0.875rem;
  color: #64748b;
}
.att-day-meta strong { color: #15803d; }

.att-shift-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
@media (min-width: 768px) {
  .att-shift-grid {
    grid-template-columns: 1fr 1fr 9rem auto;
    align-items: stretch;
  }
}
.att-shift-grid-head {
  display: none;
}
@media (min-width: 768px) {
  .att-shift-grid-head {
    display: grid;
    grid-template-columns: 1fr 1fr 9rem auto;
    gap: 0;
    padding: 0.55rem 1.15rem;
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
  }
}
.att-shift-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #f1f5f9;
}
@media (min-width: 768px) {
  .att-shift-row {
    grid-template-columns: 1fr 1fr 9rem auto;
    gap: 1rem;
    align-items: center;
    padding: 0.85rem 1.15rem;
  }
}
.att-shift-row:last-child { border-bottom: none; }
.att-shift-cell-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.2rem;
}
@media (min-width: 768px) {
  .att-shift-cell-label { display: none; }
}
.att-shift-in,
.att-shift-out {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
}
.att-shift-dur {
  font-size: 1.125rem;
  font-weight: 800;
  color: #15803d;
}
.att-shift-actions {
  display: flex;
  justify-content: flex-end;
}
.att-empty {
  text-align: center;
  padding: 3.5rem 1.5rem;
  color: #64748b;
}
.att-empty i {
  font-size: 3rem;
  color: #cbd5e1;
  display: block;
  margin-bottom: 0.75rem;
}

[data-bs-theme="dark"] .att-report-stat,
[data-bs-theme="dark"] .att-filter-panel,
[data-bs-theme="dark"] .att-panel,
[data-bs-theme="dark"] .att-day-card,
[data-bs-theme="dark"] .att-detail-stat {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .att-report-stat-num,
[data-bs-theme="dark"] .att-filter-title,
[data-bs-theme="dark"] .att-panel-title,
[data-bs-theme="dark"] .att-user-link,
[data-bs-theme="dark"] .att-detail-name,
[data-bs-theme="dark"] .att-day-date,
[data-bs-theme="dark"] .att-shift-in,
[data-bs-theme="dark"] .att-shift-out {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .att-filter-panel {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}
[data-bs-theme="dark"] .att-panel-head,
[data-bs-theme="dark"] .att-day-head,
[data-bs-theme="dark"] .att-shift-grid-head {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .att-detail-hero {
  background: linear-gradient(135deg, #422006 0%, #1e293b 50%, #14532d 100%);
}
[data-bs-theme="dark"] .att-user-table tbody tr:hover {
  background: #0f172a;
}
.attendance-checkout-modal .modal-content {
  border-radius: 14px;
  overflow: hidden;
}
.attendance-checkout-modal-header {
  padding: 1.35rem 1.35rem 0.5rem;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 55%);
}
.attendance-checkout-modal .modal-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #111827;
}
.attendance-checkout-modal-sub {
  font-size: 0.8125rem;
  color: #6b7280;
  margin-top: 0.2rem;
}
.attendance-checkout-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin-bottom: 1rem;
}
@media (max-width: 575.98px) {
  .attendance-checkout-summary {
    grid-template-columns: 1fr;
  }
}
.attendance-checkout-summary-item {
  padding: 0.85rem 0.9rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  text-align: center;
}
.attendance-checkout-summary-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #6b7280;
  margin-bottom: 0.25rem;
}
.attendance-checkout-summary-value {
  display: block;
  font-size: 1.25rem;
  line-height: 1.2;
  color: #111827;
}
.attendance-checkout-notice {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.9rem 1rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.attendance-checkout-notice-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffedd5;
  color: #c2410c;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.attendance-checkout-notice strong {
  display: block;
  font-size: 0.875rem;
  color: #9a3412;
  margin-bottom: 0.15rem;
}
.attendance-checkout-notice p {
  font-size: 0.8125rem;
  color: #9a3412;
  line-height: 1.45;
}
.attendance-checkout-modal-footer {
  padding: 0.5rem 1.35rem 1.35rem;
  gap: 0.5rem;
}
[data-bs-theme="dark"] .attendance-checkout-modal-header {
  background: linear-gradient(180deg, #422006 0%, #1e293b 55%);
}
[data-bs-theme="dark"] .attendance-checkout-modal .modal-title {
  color: #f8fafc;
}
[data-bs-theme="dark"] .attendance-checkout-summary-item {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .attendance-checkout-summary-value {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .attendance-checkout-notice {
  background: #422006;
  border-color: #9a3412;
}
[data-bs-theme="dark"] .attendance-checkout-notice strong,
[data-bs-theme="dark"] .attendance-checkout-notice p {
  color: #fdba74;
}
.font-monospace {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.dashboard-target-bar .progress-bar {
  transition: width 0.4s ease;
}
.dashboard-month-target {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 0.75rem 1rem;
  height: 100%;
}

/* Mini chat popup */
.chat-popup {
  position: fixed;
  right: 1.35rem;
  bottom: 5.5rem;
  z-index: 1056;
  width: min(380px, calc(100vw - 2rem));
  max-height: min(520px, calc(100vh - 7rem));
}
.chat-popup-panel {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: inherit;
  border: 1px solid #e5e7eb;
}
.chat-popup-head {
  background: linear-gradient(135deg, #008069, #005c4b);
  color: #fff;
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.chat-popup-tabs {
  display: flex;
  border-bottom: 1px solid #e5e7eb;
  background: #f0f2f5;
}
.chat-popup-tab {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0.55rem 0.5rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}
.chat-popup-tab.active {
  color: #008069;
  background: #fff;
  box-shadow: inset 0 -2px 0 #008069;
}
.chat-popup-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.chat-popup-pane {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 220px;
  max-height: 320px;
}
.chat-popup-messages {
  flex: 1;
  overflow-y: auto;
  padding: 0.75rem;
  min-height: 180px;
  max-height: 320px;
  background: #efeae2;
}
.chat-popup-users {
  overflow-y: auto;
  padding: 0.35rem;
  max-height: 320px;
}
.chat-popup-user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  border: none;
  background: transparent;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  text-align: left;
}
.chat-popup-user:hover {
  background: #f0f2f5;
}
.chat-popup-user-name {
  flex: 1;
  font-size: 0.875rem;
  font-weight: 500;
}
.chat-popup-dm {
  padding: 0.35rem 0.5rem 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.chat-popup-compose {
  border-top: 1px solid #e5e7eb;
  padding: 0.55rem 0.6rem 0.6rem;
  background: #f0f2f5;
  flex-shrink: 0;
}
.chat-popup-compose .wa-compose-inner {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  background: #fff;
  border-radius: 24px;
  padding: 0.35rem 0.4rem 0.35rem 0.55rem;
  border: 1px solid #e5e7eb;
  overflow: visible;
}
.chat-popup-compose .chat-compose-input {
  flex: 1;
  min-width: 0;
  min-height: 36px;
  padding: 0.5rem 0.25rem;
  font-size: 0.9375rem;
}
.chat-popup-compose #chatPopupAttach {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  text-decoration: none;
}
.chat-popup-compose #chatPopupAttach i {
  font-size: 1.25rem;
}
.chat-popup-send-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: none;
  border-radius: 50%;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #25d366, #008069);
  color: #fff !important;
  box-shadow: 0 2px 10px rgba(0, 128, 105, 0.4);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.chat-popup-send-btn i {
  font-size: 1.35rem;
  line-height: 1;
  margin-left: 2px;
}
.chat-popup-send-btn:hover,
.chat-popup-send-btn:focus {
  background: linear-gradient(135deg, #20bd5a, #006b58);
  color: #fff !important;
  transform: scale(1.05);
  box-shadow: 0 3px 12px rgba(0, 128, 105, 0.5);
}
.chat-popup-send-btn:active {
  transform: scale(0.96);
}
.chat-popup-reply {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.35rem 0.75rem;
  background: #f0f2f5;
  border-top: 1px solid #e5e7eb;
}
.chat-fab-open {
  transform: scale(0.95);
  opacity: 0.9;
}
.chat-reply-quote {
  border-left: 3px solid #008069;
  padding: 0.25rem 0.5rem;
  margin-bottom: 0.35rem;
  background: rgba(0, 0, 0, 0.04);
  border-radius: 4px;
}
.chat-msg-image {
  max-width: 100%;
  max-height: 180px;
  border-radius: 8px;
  display: block;
  margin-bottom: 0.25rem;
}
.chat-msg-file {
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;
  margin-bottom: 0.25rem;
}
.chat-msg-reply-btn {
  border: none;
  background: transparent;
  color: #8696a0;
  padding: 0;
  font-size: 0.75rem;
  margin-left: 0.25rem;
  cursor: pointer;
}

/* Full-page chat — Team Room + compose */
.chat-team-room-item .chat-avatar i {
  font-size: 1.25rem;
}
.chat-team-room-item.active {
  background: rgba(0, 128, 105, 0.08);
}
.chat-team-room-item.active .chat-user-item-name {
  color: #008069;
  font-weight: 600;
}
.chat-page-compose-inner {
  display: flex;
  align-items: flex-end;
  gap: 0.4rem;
  width: 100%;
}
.chat-page-compose-inner .chat-compose-input {
  flex: 1;
  min-width: 0;
}
.chat-page-compose-inner #chatAttachBtn {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.chat-page-compose-inner #chatAttachBtn i {
  font-size: 1.25rem;
}
.wa-compose .chat-popup-send-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}

/* ========== Add Entry page ========== */
.content.content-compact-entry {
  background: #e8edf2;
  padding-bottom: 0 !important;
  min-height: 100vh !important;
  height: 100vh;
  max-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}
.content-compact-entry .container-fluid {
  padding: 0.65rem 1rem 0.5rem;
  flex: 1 1 0;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  max-width: 100%;
}
.content-compact-entry .page-title-block {
  display: none !important;
}
.content-compact-entry .entry-page-onescreen {
  flex: 1 1 0;
  min-height: 0;
  height: 100%;
}
.content-compact-entry .entry-page-onescreen .ae-wrap {
  flex: 1 1 0;
  min-height: 0;
  height: 100%;
}
.content-compact-entry .ae-site-footer {
  flex-shrink: 0;
  margin-top: auto;
  padding: 0.35rem 0 0.15rem;
  text-align: center;
  font-size: 0.7rem;
  color: #94a3b8;
  background: transparent;
  border: none;
}

.entry-page {
  max-width: 960px;
  margin: 0 auto;
}
.entry-page-onescreen {
  width: 100%;
  max-width: none;
  margin: 0;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* ========== Add Entry — workspace ========== */
.entry-page-onescreen .ae-wrap {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  background: #fff;
  border: 1px solid #d0dae4;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.08);
}
.ae-wrap {
  display: flex;
  flex-direction: column;
  flex: 1;
  height: 100%;
  min-height: 0;
  max-width: 860px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #d5dee8;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.07);
}
.ae-wrap.entry-form-query-send { border-color: #fcd34d; box-shadow: 0 4px 20px rgba(245, 158, 11, 0.14); }
.ae-wrap.entry-form-query-complete { border-color: #86efac; }
.ae-wrap.entry-form-query-pending { border-color: #fdba74; }

.ae-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* Top bar — clean white */
.ae-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  padding: 0.85rem 1.15rem;
  background: #fff;
  border-bottom: 1px solid #e8edf2;
  font-size: 0.8125rem;
  color: #475569;
  flex-shrink: 0;
}
.ae-meta-user {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem 0.85rem;
  flex: 1 1 auto;
  min-width: 0;
}
.ae-meta-user-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #0f766e 0%, #14b8a6 100%);
  border: none;
  color: #fff;
  font-size: 1.2rem;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(15, 118, 110, 0.25);
}
.ae-meta-user-body {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0;
}
.ae-meta-user-label {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
}
.ae-meta-user-name {
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
  word-break: break-word;
}
.ae-meta-user-stats {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.4rem 0.7rem;
}
.ae-meta-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.05rem;
  min-width: 3.25rem;
}
.ae-meta-stat strong {
  font-size: 1rem;
  font-weight: 800;
  color: #0f766e;
  line-height: 1;
}
.ae-meta-stat span {
  font-size: 0.5625rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  font-weight: 600;
}
.ae-meta-stat-div {
  width: 1px;
  align-self: stretch;
  background: #e2e8f0;
}
.ae-meta-change-form { flex-shrink: 0; }
.ae-meta-change-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #475569;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.4rem 0.7rem;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.ae-meta-change-btn:hover {
  background: #f8fafc;
  border-color: #94a3b8;
  color: #0f172a;
}
.ae-meta-left { display: flex; align-items: center; gap: 0.55rem; }
.ae-worker-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  padding: 0.3rem 0.75rem 0.3rem 0.55rem;
  font-weight: 700;
  font-size: 0.875rem;
  color: #fff;
}
.ae-worker-pill i { font-size: 1rem; opacity: 0.9; }
.ae-user-id-stats {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.82);
  background: rgba(0, 0, 0, 0.12);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
}
.ae-user-id-stats strong { color: #fff; font-weight: 700; }
.ae-meta-change {
  border: none;
  background: none;
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ae-meta-change:hover { color: #fff; }
.ae-meta-goals {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.ae-goal-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.3rem 0.6rem;
  font-size: 0.8125rem;
  color: #64748b;
}
.ae-goal-chip-lbl {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
}
.ae-goal-chip strong { color: #0f172a; font-weight: 800; }
.ae-goal-chip-team { background: #fff7ed; border-color: #fed7aa; }
.ae-goal-chip-team .ae-goal-chip-lbl { color: #c2410c; }
.ae-meta-hint {
  margin-left: auto;
  font-size: 0.75rem;
  color: #94a3b8;
}
.ae-meta-hint kbd {
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
  padding: 0.1rem 0.35rem;
  font-size: 0.6875rem;
  font-family: inherit;
  color: #64748b;
}

.ae-note {
  padding: 0.55rem 1.1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.ae-note-query { background: #fffbeb; color: #b45309; border-left: 3px solid #f59e0b; }
.ae-note-ok { background: #ecfdf5; color: #047857; border-left: 3px solid #22c55e; }
.ae-note-warn { background: #fff7ed; color: #c2410c; border-left: 3px solid #f97316; }

/* Form area */
.ae-form {
  padding: 1.15rem 1.25rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  flex-shrink: 0;
  background: #fff;
}

.ae-panel {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}
.ae-panel-batch {
  padding-bottom: 0.85rem;
  border-bottom: 1px solid #f1f5f9;
}
.ae-panel-fields { padding-bottom: 0; }
.ae-panel-actions {
  padding: 0.85rem 0 0;
  margin-top: 0.15rem;
  border-top: 1px solid #f1f5f9;
  background: transparent;
}

.ae-field { display: flex; flex-direction: column; }
.ae-lbl {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 0.4rem;
}
.ae-inp {
  width: 100%;
  border: 1px solid #d0dae4;
  border-radius: 10px;
  padding: 0.65rem 0.85rem;
  font-size: 0.9375rem;
  color: #0f172a;
  background: #fff;
  font-family: inherit;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.ae-inp:hover { border-color: #94a3b8; }
.ae-inp:focus {
  outline: none;
  border-color: #0f766e;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}
.ae-inp-batch {
  font-size: 1.05rem;
  font-weight: 600;
  padding: 0.8rem 0.9rem;
  background: #f8fafc;
  border-color: #cbd5e1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.ae-inp-area { resize: vertical; min-height: 64px; }
.ae-field-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px dashed #e8edf2;
}
.ae-hint { font-size: 0.75rem; color: #94a3b8; }
.ae-status {
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
}
.ae-status-ok { background: #ecfdf5; color: #059669; }
.ae-status-warn { background: #fffbeb; color: #d97706; }
.ae-status-bad { background: #fef2f2; color: #dc2626; }
.ae-status-muted { background: #f1f5f9; color: #64748b; }

.ae-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.ae-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.ae-query {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #475569;
  cursor: pointer;
  margin: 0;
  flex-shrink: 0;
  user-select: none;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.45rem 0.75rem;
}
.ae-query input { width: 16px; height: 16px; accent-color: #f59e0b; cursor: pointer; }
.ae-query-link {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #d97706;
  text-decoration: none;
  white-space: nowrap;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  padding: 0.4rem 0.65rem;
}
.ae-query-link:hover { background: #fef3c7; }

.ae-save {
  flex: 1;
  min-height: 48px;
  padding: 0.7rem 1.25rem;
  border: none;
  border-radius: 10px;
  background: linear-gradient(180deg, #f07040 0%, #E66239 100%);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(230, 98, 57, 0.28);
  transition: transform 0.1s, box-shadow 0.12s, filter 0.12s;
}
.ae-save:hover:not(:disabled) {
  filter: brightness(1.05);
  box-shadow: 0 4px 14px rgba(230, 98, 57, 0.35);
  transform: translateY(-1px);
}
.ae-save:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; }
.ae-save-ok { background: #16a34a; box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3); }
.ae-save-ok:hover:not(:disabled) { background: #15803d; }
.ae-save-query { background: #d97706; box-shadow: 0 2px 8px rgba(217, 119, 6, 0.3); }
.ae-save-query:hover:not(:disabled) { background: #b45309; }
.ae-save-locked { background: #94a3b8; box-shadow: none; }
.ae-save-block { width: 100%; flex: none; }

.ae-msg {
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0.55rem 0.85rem;
  border-radius: 8px;
  border-left: 3px solid transparent;
}
.ae-msg-warn { background: #fffbeb; color: #b45309; border-left-color: #f59e0b; }
.ae-msg-info { background: #eff6ff; color: #1d4ed8; border-left-color: #3b82f6; }
.ae-msg-err { background: #fef2f2; color: #dc2626; border-left-color: #ef4444; }
.ae-msg-muted { background: #f1f5f9; color: #475569; border-left-color: #94a3b8; }
.ae-msg-ok { background: #ecfdf5; color: #047857; border-left-color: #22c55e; }
.ae-save-claim { background: #0ea5e9; border-color: #0ea5e9; }
.ae-save-claim:hover { background: #0284c7; border-color: #0284c7; }
.entry-form-claim .ae-save,
.entry-form-claim .entry-save-btn { box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.2); }

.entry-claim-success-modal .modal-content {
  border-radius: 1rem;
  overflow: hidden;
}
.entry-claim-success-header {
  padding: 1.25rem 1.25rem 0;
}
.entry-claim-success-sub {
  font-size: 0.875rem;
  color: #64748b;
}
.entry-claim-success-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 999px;
  background: #dcfce7;
  color: #16a34a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  margin: 0 auto 1rem;
}
.entry-claim-success-batch {
  text-align: center;
  font-size: 0.95rem;
  color: #0f172a;
  word-break: break-all;
}
.entry-claim-success-text {
  text-align: center;
  color: #475569;
  font-size: 0.95rem;
}
.entry-claim-success-footer {
  padding: 0 1.25rem 1.25rem;
  justify-content: center;
}
.entry-claim-confirm-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 999px;
  background: #e0f2fe;
  color: #0284c7;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  margin: 0 auto 1rem;
}
.entry-claim-confirm-text {
  text-align: center;
  color: #475569;
  font-size: 0.95rem;
}
[data-bs-theme="dark"] .entry-claim-confirm-text { color: #94a3b8; }
[data-bs-theme="dark"] .entry-claim-confirm-icon { background: rgba(2, 132, 199, 0.2); }
[data-bs-theme="dark"] .entry-claim-success-batch { color: #e2e8f0; }
[data-bs-theme="dark"] .entry-claim-success-text { color: #94a3b8; }
[data-bs-theme="dark"] .entry-claim-success-icon { background: rgba(22, 163, 74, 0.2); }

.claim-timeline {
  position: relative;
  padding-left: 0.25rem;
}
.claim-timeline-item {
  position: relative;
  padding: 0.45rem 0 0.45rem 1.35rem;
  font-size: 0.875rem;
  color: #334155;
}
.claim-timeline-item:not(.is-last)::before {
  content: '';
  position: absolute;
  left: 0.35rem;
  top: 1.15rem;
  bottom: -0.15rem;
  width: 2px;
  background: #e2e8f0;
}
.claim-timeline-dot {
  position: absolute;
  left: 0;
  top: 0.65rem;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #94a3b8;
}
.claim-timeline-original .claim-timeline-dot { border-color: #64748b; background: #f1f5f9; }
.claim-timeline-claim .claim-timeline-dot { border-color: #0ea5e9; background: #e0f2fe; }
.claim-timeline-current .claim-timeline-dot { border-color: #16a34a; background: #dcfce7; }
.claim-timeline-when {
  display: block;
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 0.1rem;
}
.claim-timeline-compact .claim-timeline-item {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
  font-size: 0.8125rem;
}
.entry-claim-success-history {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.85rem 1rem;
}
.claim-batch-history-card .card-body {
  padding: 1.15rem 1.25rem;
}
.claim-report-table td {
  vertical-align: top;
}
[data-bs-theme="dark"] .claim-timeline-item { color: #cbd5e1; }
[data-bs-theme="dark"] .claim-timeline-item:not(.is-last)::before { background: #334155; }
[data-bs-theme="dark"] .claim-timeline-dot { background: #1e293b; }
[data-bs-theme="dark"] .claim-timeline-original .claim-timeline-dot { background: #334155; }
[data-bs-theme="dark"] .claim-timeline-claim .claim-timeline-dot { background: #0c4a6e; border-color: #38bdf8; }
[data-bs-theme="dark"] .claim-timeline-current .claim-timeline-dot { background: #14532d; border-color: #4ade80; }
[data-bs-theme="dark"] .entry-claim-success-history {
  background: #0f172a;
  border-color: #334155;
}

/* Recent entries panel */
.ae-recent {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-top: 1px solid #e8edf2;
  background: #f8fafc;
}
.ae-recent-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1.15rem;
  flex-shrink: 0;
  background: #fff;
  border-bottom: 1px solid #e8edf2;
}
.ae-recent-head-main {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.ae-recent-title {
  font-size: 0.875rem;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.2;
}
.ae-recent-title i {
  margin-right: 0.3rem;
  color: #0f766e;
}
.ae-recent-sub {
  font-size: 0.75rem;
  color: #94a3b8;
  line-height: 1.3;
}
.ae-recent-count {
  background: #0f766e;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  min-width: 1.65rem;
  text-align: center;
  flex-shrink: 0;
}
.ae-recent-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background: #f8fafc;
  -webkit-overflow-scrolling: touch;
}
.ae-recent-cols {
  display: grid;
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 0.8fr) minmax(0, 1fr) minmax(8.5rem, 1.15fr) 2.5rem;
  align-items: center;
  gap: 0.5rem;
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 0.5rem 1rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
}
.ae-recent-cols span:nth-child(n+4) { text-align: center; }
.ae-recent-list {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0.65rem 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.ae-recent-item {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
.ae-recent-item:hover {
  border-color: #cbd5e1;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.ae-recent-item.is-err {
  border-color: #fecaca;
  box-shadow: inset 3px 0 0 #ef4444;
}
.ae-recent-item-foot {
  display: grid;
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 0.8fr) minmax(0, 1fr) minmax(8.5rem, 1.15fr) 2.5rem;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 0.75rem;
}
.ae-recent-task {
  margin: 0;
  grid-column: 1;
  font-size: 0.75rem;
  font-weight: 700;
  color: #475569;
  line-height: 1.25;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.ae-recent-batch {
  margin: 0;
  grid-column: 2;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.35;
  word-break: break-all;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.ae-recent-meta {
  grid-column: 3;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  color: #64748b;
  min-width: 0;
}
.ae-recent-invoice,
.ae-recent-worker {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  font-weight: 600;
  font-size: 0.6875rem;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ae-recent-worker {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}
.ae-recent-err-badge {
  display: inline-flex;
  align-items: center;
  color: #dc2626;
  font-size: 0.875rem;
}
.ae-recent-time {
  grid-column: 4;
  justify-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12rem;
  min-width: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  font-variant-numeric: tabular-nums;
}
.ae-recent-dual-time {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12rem;
}
.ae-recent-dual-time .dual-time-row {
  font-size: 0.6875rem;
  line-height: 1.2;
}
.ae-recent-delete-form {
  grid-column: 5;
  justify-self: center;
  margin: 0;
}
.ae-recent-delete-btn {
  width: 2.1rem;
  height: 2.1rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #94a3b8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
  transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease;
}
.ae-recent-delete-btn:hover {
  color: #dc2626;
  border-color: #fecaca;
  background: #fef2f2;
}
.ae-recent-empty {
  text-align: center;
  padding: 1.75rem 1rem;
  font-size: 0.8125rem;
  color: #94a3b8;
  margin: 0;
  background: #fafbfc;
}

/* Add Entry — wide screen: form left, recent right */
@media (min-width: 1100px) {
  .entry-page-onescreen .ae-wrap {
    display: flex;
    flex-direction: column;
  }
  .entry-page-onescreen .ae-body {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(380px, 1fr) minmax(420px, 1.1fr);
    align-items: stretch;
  }
  .entry-page-onescreen .ae-form {
    border-right: 1px solid #e8edf2;
    overflow-y: auto;
    min-height: 0;
    height: 100%;
    align-self: stretch;
  }
  .entry-page-onescreen .ae-recent {
    border-top: none;
    min-height: 0;
    height: 100%;
    align-self: stretch;
  }
}

.ae-table {
  width: 100%;
  font-size: 0.8125rem;
  border-collapse: collapse;
}
.ae-table thead th {
  position: sticky;
  top: 0;
  background: #e8edf2;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  padding: 0.5rem 0.85rem;
  text-align: left;
  border-bottom: 1px solid #d5dee8;
  z-index: 1;
}
.ae-table tbody td {
  padding: 0.5rem 0.85rem;
  border-bottom: 1px solid #eef2f7;
  vertical-align: middle;
  color: #475569;
  background: #fff;
}
.ae-table tbody tr:nth-child(even) td { background: #f8fafc; }
.ae-table tbody tr:hover td { background: #f1f5f9; }
.ae-table tbody tr.is-err td { background: #fef2f2 !important; }
.ae-td-batch {
  font-weight: 600;
  color: #0f172a;
  word-break: break-all;
  font-size: 0.75rem;
  max-width: 200px;
}
.ae-td-err { font-size: 0.75rem; color: #dc2626; }
.ae-td-time { white-space: nowrap; color: #94a3b8; font-size: 0.75rem; }

.ae-gate {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 160px);
  padding: 1.25rem 1rem 2rem;
}
.ae-gate-shell {
  width: 100%;
  max-width: 640px;
  background: #fff;
  border: 1px solid #d5dee8;
  border-radius: 16px;
  padding: 1.5rem;
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.08);
}
.ae-gate-shell.ae-gate-empty {
  max-width: 420px;
  text-align: center;
  padding: 2rem 1.5rem;
}
.ae-gate-head {
  text-align: center;
  margin-bottom: 1.25rem;
}
.ae-gate-icon {
  width: 3.25rem;
  height: 3.25rem;
  margin: 0 auto 0.85rem;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(15, 118, 110, 0.12) 0%, rgba(20, 184, 166, 0.08) 100%);
  border: 1px solid rgba(15, 118, 110, 0.18);
  color: #0f766e;
  font-size: 1.5rem;
}
.ae-gate-icon-warn {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.22);
  color: #d97706;
}
.ae-gate-title {
  font-size: 1.25rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 0.35rem;
}
.ae-gate-sub {
  font-size: 0.875rem;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
}
.ae-gate-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.ae-gate-shell--picker {
  max-width: 520px;
  padding: 1.1rem 1.15rem 1.15rem;
}
.ae-gate-head--compact {
  text-align: left;
  margin-bottom: 0.65rem;
}
.ae-gate-head--compact .ae-gate-title {
  font-size: 1.05rem;
  margin-bottom: 0.2rem;
}
.ae-gate-head--compact .ae-gate-sub {
  font-size: 0.8125rem;
  margin-left: 0;
  margin-right: 0;
  max-width: none;
}
.ae-picker-toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ae-picker-search-wrap {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
  padding: 0.35rem 0.65rem;
  margin: 0;
}
.ae-picker-search-wrap i {
  color: #94a3b8;
  font-size: 0.95rem;
  flex-shrink: 0;
}
.ae-picker-search {
  border: 0;
  background: transparent;
  width: 100%;
  font-size: 0.875rem;
  color: #0f172a;
  outline: none;
  padding: 0.1rem 0;
}
.ae-picker-search::placeholder { color: #94a3b8; }
.ae-picker-badge {
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 0.28rem 0.55rem;
}
.ae-picker-table-head,
.ae-picker-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 3.25rem 3.5rem 1.5rem;
  align-items: center;
  gap: 0.35rem;
}
.ae-picker-table-head {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  padding: 0 0.55rem 0.2rem;
}
.ae-picker-table-head span:not(:first-child) {
  text-align: center;
}
.ae-picker-list {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  max-height: min(52vh, 340px);
  overflow-y: auto;
  padding: 0.15rem 0.1rem 0.15rem 0;
  margin-right: -0.15rem;
}
.ae-picker-row {
  width: 100%;
  text-align: left;
  border: 1px solid #e8edf2;
  border-radius: 9px;
  background: #fff;
  padding: 0.42rem 0.55rem;
  cursor: pointer;
  transition: border-color 0.12s ease, background 0.12s ease, box-shadow 0.12s ease;
}
.ae-picker-row:hover {
  border-color: rgba(15, 118, 110, 0.35);
  background: #f8fffe;
}
.ae-picker-row:focus {
  outline: none;
  border-color: #0f766e;
  box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.16);
}
.ae-picker-row.is-selected {
  border-color: #0f766e;
  background: linear-gradient(90deg, rgba(15, 118, 110, 0.1) 0%, #fff 55%);
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.1);
}
.ae-picker-row.is-hidden { display: none; }
.ae-picker-name {
  font-size: 0.875rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.ae-picker-num {
  text-align: center;
  font-size: 0.875rem;
  font-weight: 800;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.ae-picker-num--today { color: #0f766e; }
.ae-picker-num--month { color: #334155; }
.ae-picker-radio {
  width: 1.2rem;
  height: 1.2rem;
  margin-left: auto;
  border-radius: 999px;
  border: 1.5px solid #cbd5e1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  font-size: 0.65rem;
  transition: all 0.12s ease;
}
.ae-picker-row.is-selected .ae-picker-radio {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}
.ae-picker-empty {
  margin: 0;
  text-align: center;
  font-size: 0.8125rem;
  color: #94a3b8;
  padding: 0.75rem 0.5rem;
}
.ae-id-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 0.75rem;
}
.ae-id-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  width: 100%;
  text-align: left;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  background: #fafbfc;
  padding: 0.85rem 0.9rem 0.9rem;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}
.ae-id-card:hover {
  border-color: rgba(15, 118, 110, 0.35);
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 118, 110, 0.08);
}
.ae-id-card:focus {
  outline: none;
  border-color: #0f766e;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.18);
}
.ae-id-card.is-selected {
  border-color: #0f766e;
  background: linear-gradient(180deg, rgba(15, 118, 110, 0.1) 0%, #fff 100%);
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.12), 0 6px 18px rgba(15, 118, 110, 0.12);
}
.ae-id-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.ae-id-card-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 118, 110, 0.1);
  color: #0f766e;
  font-size: 1.1rem;
}
.ae-id-card-check {
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 999px;
  border: 1.5px solid #cbd5e1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  font-size: 0.75rem;
  transition: all 0.15s ease;
}
.ae-id-card.is-selected .ae-id-card-check {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}
.ae-id-card-name {
  font-size: 0.975rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.25;
  word-break: break-word;
}
.ae-id-card-stats {
  display: flex;
  gap: 0.65rem;
  padding-top: 0.15rem;
  border-top: 1px dashed #e2e8f0;
}
.ae-id-stat {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  flex: 1;
}
.ae-id-stat strong {
  font-size: 1rem;
  font-weight: 800;
  color: #0f766e;
  line-height: 1.1;
}
.ae-id-stat small {
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
  font-weight: 600;
}
.ae-gate-foot {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding-top: 0.25rem;
  border-top: 1px solid #eef2f6;
}
.ae-gate-hint {
  margin: 0;
  text-align: center;
  font-size: 0.8125rem;
  color: #64748b;
}

@media (max-width: 767.98px) {
  .content.content-compact-entry {
    height: auto;
    max-height: none;
    min-height: 100vh !important;
    overflow: visible;
  }
  .content-compact-entry .container-fluid {
    height: auto;
    min-height: calc(100vh - 72px);
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .content-compact-entry .entry-page-onescreen {
    min-height: calc(100vh - 96px);
    height: auto;
  }
  .content-compact-entry .entry-page-onescreen .ae-wrap {
    min-height: calc(100vh - 96px);
    height: auto;
  }
  .ae-recent-cols { display: none; }
  .ae-recent-item-foot {
    grid-template-columns: 1fr auto auto;
    grid-template-rows: auto auto;
  }
  .ae-recent-task { grid-column: 1 / -1; grid-row: 1; }
  .ae-recent-batch { grid-column: 1 / -1; grid-row: 2; }
  .ae-recent-meta { grid-column: 1; grid-row: 3; }
  .ae-recent-time { grid-column: 2; grid-row: 3; }
  .ae-recent-delete-form { grid-column: 3; grid-row: 3; }
  .ae-row { grid-template-columns: 1fr; }
  .ae-meta-hint { display: none !important; }
  .ae-meta-user { width: 100%; }
  .ae-meta-change-form { margin-left: auto; }
  .ae-meta-change-btn span { display: none; }
  .ae-picker-table-head,
  .ae-picker-row {
    grid-template-columns: minmax(0, 1fr) 2.75rem 3rem 1.35rem;
  }
  .ae-gate { min-height: 0; padding-top: 0.5rem; }
  .ae-actions { flex-wrap: wrap; }
  .ae-save { width: 100%; }
}

[data-bs-theme="dark"] .content-compact-entry { background: #0f172a; }
[data-bs-theme="dark"] .ae-wrap {
  background: #1e293b;
  border-color: #334155;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
}
[data-bs-theme="dark"] .ae-meta {
  background: #1e293b;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .ae-meta-user-name { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-meta-user-stats {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-meta-stat strong { color: #5eead4; }
[data-bs-theme="dark"] .ae-meta-change-btn {
  background: #0f172a;
  border-color: #475569;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .ae-goal-chip {
  background: #0f172a;
  border-color: #334155;
  color: #94a3b8;
}
[data-bs-theme="dark"] .ae-goal-chip strong { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-form { background: #1e293b; }
[data-bs-theme="dark"] .ae-panel {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-inp {
  background: #0f172a;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .ae-inp:focus { background: #1e293b; }
[data-bs-theme="dark"] .ae-inp-batch { background: #1e293b; }
[data-bs-theme="dark"] .ae-recent { background: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .ae-recent-head {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-recent-cols {
  background: #0f172a;
  border-color: #334155;
  color: #64748b;
}
[data-bs-theme="dark"] .ae-recent-title { color: #e2e8f0; }
[data-bs-theme="dark"] .ae-recent-sub { color: #64748b; }
[data-bs-theme="dark"] .ae-recent-scroll { background: #0f172a; }
[data-bs-theme="dark"] .ae-recent-item {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-recent-item:hover {
  border-color: #475569;
  box-shadow: none;
}
[data-bs-theme="dark"] .ae-recent-item.is-err {
  box-shadow: inset 3px 0 0 #f87171;
  border-color: #7f1d1d;
  background: #1e293b;
}
[data-bs-theme="dark"] .ae-recent-batch { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-recent-time {
  background: #0f172a;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .ae-recent-invoice {
  background: #0f172a;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .ae-recent-worker {
  background: rgba(20, 184, 166, 0.12);
  border-color: rgba(20, 184, 166, 0.22);
  color: #5eead4;
}
[data-bs-theme="dark"] .ae-recent-delete-btn {
  background: #0f172a;
  border-color: #334155;
  color: #64748b;
}
[data-bs-theme="dark"] .ae-recent-delete-btn:hover {
  color: #fca5a5;
  border-color: #7f1d1d;
  background: rgba(127, 29, 29, 0.25);
}
[data-bs-theme="dark"] .ae-recent-empty { background: #0f172a; color: #64748b; }
[data-bs-theme="dark"] .ae-table thead th { background: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .ae-table tbody td { background: #1e293b; border-color: #334155; color: #cbd5e1; }
[data-bs-theme="dark"] .ae-table tbody tr:nth-child(even) td { background: #172033; }
[data-bs-theme="dark"] .ae-td-batch { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-gate-shell { background: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .ae-gate-title { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-gate-sub { color: #94a3b8; }
[data-bs-theme="dark"] .ae-gate-foot { border-top-color: #334155; }
[data-bs-theme="dark"] .ae-gate-hint { color: #94a3b8; }
[data-bs-theme="dark"] .ae-picker-search-wrap {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-picker-search { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-picker-badge {
  background: #0f172a;
  border-color: #334155;
  color: #94a3b8;
}
[data-bs-theme="dark"] .ae-picker-table-head { color: #64748b; }
[data-bs-theme="dark"] .ae-picker-row {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-picker-row:hover,
[data-bs-theme="dark"] .ae-picker-row.is-selected {
  background: #1e293b;
  border-color: #14b8a6;
}
[data-bs-theme="dark"] .ae-picker-name { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-picker-num--month { color: #cbd5e1; }
[data-bs-theme="dark"] .ae-id-card {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .ae-id-card:hover,
[data-bs-theme="dark"] .ae-id-card.is-selected {
  background: #1e293b;
  border-color: #14b8a6;
}
[data-bs-theme="dark"] .ae-id-card-name { color: #f1f5f9; }
[data-bs-theme="dark"] .ae-id-card-stats { border-top-color: #334155; }
[data-bs-theme="dark"] .ae-id-stat small { color: #94a3b8; }
[data-bs-theme="dark"] .ae-query { background: #0f172a; border-color: #475569; color: #cbd5e1; }
[data-bs-theme="dark"] .ae-field-foot { border-color: #334155; }

/* Bulk import / error upload preview — full row list, scrollable */
.import-preview-table {
  max-height: min(75vh, 960px);
  overflow: auto;
}
.import-preview-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: inset 0 -1px 0 #e2e8f0;
}

/* Bulk import preview — duplicate visibility */
.import-row-skip {
  background: #fef2f2 !important;
}
.import-row-skip td {
  opacity: 0.92;
}
.import-action-import {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #059669;
}
.import-action-skip {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #dc2626;
}
.import-action-warn {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #d97706;
}
.import-badge-ok { background: #ecfdf5 !important; color: #047857 !important; }
.import-badge-skip { background: #fef2f2 !important; color: #b91c1c !important; }
.import-badge-warn { background: #fffbeb !important; color: #b45309 !important; }
.import-badge-db { background: #fef2f2 !important; color: #b91c1c !important; }
.import-badge-file { background: #fff7ed !important; color: #c2410c !important; }
.import-dup-panel .card-header {
  background: #fef2f2 !important;
}
.import-dup-panel-file .card-header {
  background: #fff7ed !important;
  border-color: #fed7aa !important;
}
.import-dup-panel-database .card-header {
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}
.import-preview-filters .btn.active {
  font-weight: 700;
}
.import-dup-tabs .nav-link {
  font-size: 0.8125rem;
  font-weight: 600;
  border-radius: 999px;
  padding: 0.4rem 0.85rem;
}
.import-dup-tabs .nav-link.active {
  background: #C75A3A;
  color: #fff;
}
.import-dup-tabs .nav-link .badge {
  font-size: 0.65rem;
  vertical-align: middle;
}
.import-dup-tabs .nav-link.active .badge {
  background: rgba(255,255,255,0.25) !important;
  color: #fff !important;
}
[data-bs-theme="dark"] .import-row-skip {
  background: #3f1d1d !important;
}
[data-bs-theme="dark"] .import-preview-table thead th {
  background: #1e293b;
  box-shadow: inset 0 -1px 0 #334155;
}

.dcp-report-banner { border-left: 4px solid #2563eb; }
.ea-report-banner { border-left: 4px solid #E66239; }
.ea-upload-section {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1rem 1.15rem;
  border: 1px solid #e8edf3;
  border-radius: 12px;
  background: #fafbfc;
}
.ea-section-num {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  margin: 0;
  border-radius: 50%;
  background: #E66239;
  color: #fff;
  font-weight: 800;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ea-variation-banner { border-radius: 12px; }
.ea-variation-pill {
  display: inline-block;
  padding: 0.45rem 1rem;
  border-radius: 999px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #c2410c;
  font-weight: 800;
  font-size: 1.1rem;
}
.ea-minus-panel { border-left: 4px solid #dc2626; }
.ea-minus-table thead th {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.ea-minus-table tbody td,
.ea-minus-table tfoot td {
  font-size: 0.875rem;
}
.ea-persons-uploaded-table {
  max-height: min(70vh, 640px);
  overflow-y: auto;
}
.dcp-badge-cross { background: #fef2f2 !important; color: #b91c1c !important; }
.dcp-row-cross { background: #fef2f2 !important; }
.dcp-sir-note { background: #f8fafc; }
.dcp-person-row .dcp-file-name { display: block; margin-top: 0.25rem; }
[data-bs-theme="dark"] .dcp-sir-note { background: #1e293b; }
[data-bs-theme="dark"] .dcp-row-cross { background: #3f1d1d !important; }

/* Duplicate verification */
.dv-report-banner { border-left: 4px solid #E66239; }
.dv-badge-ok { background: #ecfdf5 !important; color: #047857 !important; }
.dv-badge-file { background: #fff7ed !important; color: #c2410c !important; }
.dv-badge-db { background: #fef2f2 !important; color: #b91c1c !important; }
.dv-badge-both { background: #450a0a !important; color: #fecaca !important; }
.dv-badge-missing { background: #fefce8 !important; color: #a16207 !important; }
.dv-badge-dup-first { background: #ffedd5 !important; color: #9a3412 !important; }
.dv-row-file { background: #fff7ed !important; }
.dv-row-dup-first { background: #fffbeb !important; }
.dv-row-db { background: #fef2f2 !important; }
.dv-row-both { background: #fee2e2 !important; }
.dv-row-missing { background: #fefce8 !important; }
.dv-breakdown-list li { padding: 0.2rem 0; display: flex; align-items: center; gap: 0.5rem; }
.dv-dot { width: 0.55rem; height: 0.55rem; border-radius: 50%; display: inline-block; }
.dv-dot-file { background: #ea580c; }
.dv-dot-db { background: #dc2626; }
.dv-dot-both { background: #991b1b; }
.dv-dot-missing { background: #ca8a04; }
.dv-sir-note { background: #f8fafc; }
.dv-instructions summary { list-style: none; cursor: pointer; }
.dv-instructions summary::-webkit-details-marker { display: none; }
.dv-instructions-compact summary::after {
  content: '▾';
  float: right;
  color: #64748b;
  font-size: 0.875rem;
}
.dv-instructions-compact[open] summary::after { transform: rotate(180deg); display: inline-block; }
.dv-steps-list li { margin-bottom: 0.45rem; }
.dv-tip-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 0.75rem 1rem;
  height: 100%;
}
[data-bs-theme="dark"] .dv-tip-box { background: #1e293b; border-color: #334155; }
[data-bs-theme="dark"] .dv-sir-note { background: #1e293b; }
@media print {
  .sidebar, .topbar, .dv-steps, .btn, .import-preview-filters, .card-footer { display: none !important; }
  .content-area { margin: 0 !important; padding: 0 !important; }
  .dv-report-banner { border: 1px solid #ccc; }
}

/* Legacy entry form (edit mode) */
.entry-form-layout {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.entry-form-row {
  display: grid;
  gap: 0.75rem;
  align-items: start;
}
.entry-form-row-primary {
  grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) 118px;
}
.entry-form-row-secondary {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}
.entry-form-label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.35rem;
  line-height: 1.2;
}
.entry-form-label-opt {
  font-weight: 500;
  color: #94a3b8;
  font-size: 0.75rem;
}
.entry-form-label-spacer {
  display: block;
  min-height: 1rem;
  margin-bottom: 0.35rem;
  visibility: hidden;
}
.entry-form-input {
  border-radius: 10px;
  border-color: #cbd5e1;
  font-size: 1rem;
  min-height: 48px;
  padding: 0.55rem 0.85rem;
}
.entry-form-input:focus {
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.12);
}
.entry-form-cell-save .entry-save-btn {
  width: 100%;
  min-height: 48px;
  height: 48px;
  border-radius: 10px;
  font-weight: 700;
  font-size: 0.9375rem;
  padding: 0.5rem 0.75rem;
  white-space: nowrap;
}
.entry-form-meta {
  padding: 0 0.1rem;
}
.entry-form-hint {
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.35;
}
.entry-batch-status {
  font-size: 0.8125rem;
  font-weight: 600;
  margin-top: 0.25rem;
}
.entry-form-cell-query {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.entry-form-cell-query .entry-query-toggle {
  min-height: 48px;
  width: 100%;
  justify-content: space-between;
}
.entry-form-cell-query-tab {
  align-self: end;
  min-height: 48px;
}

.entry-goal-strip {
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  padding: 0.65rem 1.25rem 0.75rem;
}
.entry-goal-strip .user-goals-wrap-compact .user-goal-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.entry-goal-strip .user-goals-wrap-compact .user-goal-title,
.entry-goal-strip .user-goals-wrap-compact .user-goal-counts {
  color: #334155;
}
.entry-goal-strip .user-goals-wrap-compact .user-goal-counts strong {
  color: #0f172a;
}
.entry-goal-strip .user-goals-dual {
  --bs-gutter-x: 0.75rem;
  --bs-gutter-y: 0.5rem;
}

.entry-fast-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr auto;
  gap: 0.85rem;
  align-items: end;
}
.entry-fast-field .form-label {
  font-size: 0.875rem;
  font-weight: 600;
  margin-bottom: 0.35rem;
  color: #334155;
}
.entry-fast-field .form-control {
  border-radius: 10px;
  border-color: #cbd5e1;
  font-size: 1.0625rem;
  padding: 0.65rem 0.85rem;
  min-height: 48px;
  font-weight: 500;
}
.entry-fast-field .form-control:focus {
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.15);
}
.entry-fast-save {
  min-width: 110px;
}
.entry-fast-save .btn {
  padding: 0.65rem 1.25rem;
  font-weight: 700;
  font-size: 1rem;
  border-radius: 10px;
  min-height: 48px;
  height: auto;
}
.entry-fast-row2 {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: 0.75rem;
  flex-wrap: wrap;
}
.entry-fast-row2 .form-control,
.entry-fast-row2 .entry-fast-remarks {
  flex: 1;
  min-width: 180px;
  border-radius: 10px;
  font-size: 0.9375rem;
  padding: 0.5rem 0.75rem;
  min-height: 42px;
}
.entry-fast-query {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.entry-query-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0.45rem 0.85rem 0.45rem 1rem;
  min-height: 42px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.15s, background 0.15s;
}
.entry-query-toggle-text {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
}
.entry-query-toggle-text i {
  font-size: 1.125rem;
  color: #94a3b8;
}
.entry-query-switch {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 26px;
  flex-shrink: 0;
}
.entry-query-switch-input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.entry-query-switch-slider {
  position: absolute;
  inset: 0;
  background: #cbd5e1;
  border-radius: 999px;
  transition: background 0.2s;
}
.entry-query-switch-slider::before {
  content: '';
  position: absolute;
  width: 20px;
  height: 20px;
  left: 3px;
  top: 3px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s;
}
.entry-query-switch-input:checked + .entry-query-switch-slider {
  background: #f59e0b;
}
.entry-query-switch-input:checked + .entry-query-switch-slider::before {
  transform: translateX(22px);
}
.entry-query-switch-input:focus-visible + .entry-query-switch-slider {
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.35);
}
.entry-query-toggle:has(.entry-query-switch-input:checked) {
  border-color: #fcd34d;
  background: #fffbeb;
}
.entry-query-toggle:has(.entry-query-switch-input:checked) .entry-query-toggle-text {
  color: #b45309;
}
.entry-query-toggle:has(.entry-query-switch-input:checked) .entry-query-toggle-text i {
  color: #f59e0b;
}
.entry-query-tab-btn {
  min-height: 42px;
  padding: 0.5rem 1rem;
  font-weight: 600;
  border-radius: 10px;
  font-size: 0.9375rem;
  white-space: nowrap;
}

.entry-onescreen-last {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #f8fafc;
}
.entry-onescreen-last-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.6rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #475569;
  border-bottom: 1px solid #e2e8f0;
  background: #f1f5f9;
  flex-shrink: 0;
}
.entry-onescreen-last-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.entry-onescreen-table {
  font-size: 0.875rem;
  table-layout: fixed;
  width: 100%;
}
.entry-onescreen-table .entry-col-batch { width: 36%; }
.entry-onescreen-table .entry-col-invoice { width: 11%; }
.entry-onescreen-table .entry-col-worker { width: 14%; }
.entry-onescreen-table .entry-col-error { width: 26%; }
.entry-onescreen-table .entry-col-time { width: 13%; }
.entry-onescreen-table thead th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  padding: 0.55rem 1.25rem;
  border-bottom: 1px solid #e2e8f0;
  z-index: 1;
}
.entry-onescreen-table tbody td {
  padding: 0.5rem 1rem;
  vertical-align: middle;
  border-color: #f1f5f9;
  overflow: hidden;
  text-overflow: ellipsis;
}
.entry-onescreen-table tbody td:first-child {
  word-break: break-all;
  font-size: 0.8125rem !important;
  line-height: 1.3;
  font-weight: 600 !important;
}
.entry-onescreen-table tbody td.fw-semibold {
  font-size: 0.8125rem;
}
.entry-onescreen-empty {
  padding: 1.5rem;
  text-align: center;
  color: #94a3b8;
  font-size: 0.8125rem;
}

.entry-page-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.entry-form-card-main {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #e2e8f0 !important;
}
.entry-form-compact-meta {
  background: #f8fafc;
  border-bottom: 1px solid #f1f5f9;
}

.entry-worker-active {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  background: linear-gradient(135deg, #0f766e 0%, #115e59 100%);
  color: #fff;
  border-radius: 14px;
  padding: 1rem 1.35rem;
  box-shadow: 0 8px 24px rgba(15, 118, 110, 0.22);
}
.entry-worker-active-main {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.entry-worker-active-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.15);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}
.entry-worker-active-label {
  display: block;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.85;
  margin-bottom: 0.1rem;
}
.entry-worker-active-name {
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.entry-worker-change-btn {
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.1) !important;
}
.entry-worker-change-btn:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
}

.entry-worker-setup {
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px;
  overflow: hidden;
}
.entry-setup-step {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #E66239;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  padding: 0.2rem 0.65rem;
  margin-bottom: 0.65rem;
}
.entry-worker-setup-form .input-group-text {
  border-color: #cbd5e1;
  color: #64748b;
}
.entry-worker-setup-form .form-select {
  border-color: #cbd5e1;
}
.entry-worker-setup-form .btn-primary {
  background: #E66239;
  border-color: #E66239;
}
.entry-worker-setup-form .btn-primary:hover {
  background: #c9512d;
  border-color: #c9512d;
}
.entry-worker-select-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.5rem;
}
.entry-worker-select-row .form-select {
  flex: 1;
  min-width: 0;
}
.entry-worker-continue-btn {
  flex-shrink: 0;
  border-radius: 8px !important;
  font-weight: 600;
  white-space: nowrap;
}
.entry-worker-setup-form .form-select.entry-input-field {
  height: calc(3.5rem + 2px);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.entry-alert-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  background: #fef3c7;
  color: #d97706;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.25rem;
}

.entry-form-placeholder {
  border-radius: 14px;
  border: 1px dashed #cbd5e1 !important;
  background: #f8fafc;
}
.entry-placeholder-icon {
  width: 4rem;
  height: 4rem;
  margin: 0 auto;
  border-radius: 50%;
  background: #e2e8f0;
  color: #64748b;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
}

.entry-form-card {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #e2e8f0 !important;
}
.entry-form-card .card-header {
  border-radius: 0 !important;
}

.entry-meta-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: flex-end;
}
.entry-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 0.3rem 0.75rem;
  white-space: nowrap;
}
.entry-meta-chip i {
  font-size: 0.875rem;
  opacity: 0.75;
}
.entry-meta-chip.is-primary {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
  font-weight: 600;
}

.entry-form-section {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #f1f5f9;
}
.entry-form-section:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.entry-form-section-title {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #94a3b8;
  margin-bottom: 0.85rem;
}

.entry-input-wrap {
  position: relative;
}
.entry-input-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 1.1rem;
  pointer-events: none;
  z-index: 2;
}
.entry-input-field {
  padding-left: 2.75rem !important;
  border-color: #cbd5e1;
  border-radius: 10px !important;
  font-weight: 500;
}
.entry-input-field:focus {
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.12);
}
.entry-remarks {
  border-radius: 10px;
  border-color: #cbd5e1;
  resize: vertical;
  min-height: 72px;
}
.entry-remarks:focus {
  border-color: #E66239;
  box-shadow: 0 0 0 3px rgba(230, 98, 57, 0.12);
}

.entry-query-toggle {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  padding: 0.85rem 1rem;
}
.entry-query-toggle .form-check-input {
  width: 2.5em;
  height: 1.25em;
  cursor: pointer;
}
.entry-query-toggle .form-check-input:checked {
  background-color: #f59e0b;
  border-color: #f59e0b;
}
.entry-query-fields {
  padding-top: 0.25rem;
}

.entry-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid #f1f5f9;
}
.entry-save-btn {
  min-width: 10rem;
  border-radius: 10px;
  font-weight: 600;
}

.entry-recent-card {
  border-radius: 12px;
  border: 1px solid #e2e8f0 !important;
  overflow: hidden;
}
.entry-recent-below {
  margin-top: 1.25rem;
}
.entry-recent-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
  color: #475569;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.entry-recent-toggle:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}
.entry-recent-toggle:not(.collapsed) {
  border-radius: 10px 10px 0 0;
  border-bottom-color: transparent;
  background: #fff;
}
.entry-recent-toggle:not(.collapsed) + .collapse .entry-recent-card {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: 0 !important;
  border-top: none;
}
.entry-recent-chevron {
  transition: transform 0.2s;
  font-size: 1rem;
  opacity: 0.6;
}
.entry-recent-toggle:not(.collapsed) .entry-recent-chevron {
  transform: rotate(180deg);
}
.month-close-admin-toggle {
  cursor: pointer;
  border-radius: 10px;
  padding: 0.35rem 0.5rem !important;
  transition: background 0.15s;
}

/* Active month — topbar, page header, settings, entry */
.active-month-bar-kicker {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
  line-height: 1.1;
}
.active-month-bar-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(13, 110, 253, 0.1);
  color: #0d6efd;
  flex-shrink: 0;
}
.active-month-bar-icon .ti { font-size: 1.1rem; }

.active-month-bar-topbar {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.85);
  max-width: 20rem;
}
.active-month-bar-topbar .active-month-bar-main,
.active-month-bar-topbar .active-month-bar-sub {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.active-month-bar-topbar .active-month-bar-value {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.active-month-bar-topbar .active-month-bar-divider {
  width: 1px;
  align-self: stretch;
  background: rgba(15, 23, 42, 0.12);
}

.active-month-bar-page {
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}
.active-month-bar-page .active-month-bar-inline {
  gap: 0.4rem;
}
.entries-page-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1rem;
}
.entries-page-month {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}
.entries-page-month .active-month-bar-inline {
  margin: 0;
}

.active-month-bar-page-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
}
.active-month-bar-page-main {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}
.active-month-bar-page-month {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--bs-body-color);
}
.active-month-bar-page-meta,
.active-month-bar-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.active-month-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.9);
  white-space: nowrap;
}
.active-month-pill .ti { font-size: 0.95rem; opacity: 0.85; }
.active-month-pill.is-calendar { border-color: rgba(13, 110, 253, 0.2); background: rgba(13, 110, 253, 0.08); color: #0a58ca; }
.active-month-pill.is-work { border-color: rgba(255, 193, 7, 0.35); background: rgba(255, 193, 7, 0.12); color: #997404; }
.active-month-pill.is-viewing { border-color: rgba(255, 193, 7, 0.45); background: rgba(255, 193, 7, 0.14); color: #997404; }
.active-month-pill.is-status.is-success { border-color: rgba(25, 135, 84, 0.25); background: rgba(25, 135, 84, 0.1); color: #146c43; }
.active-month-pill.is-status.is-warning { border-color: rgba(255, 193, 7, 0.35); background: rgba(255, 193, 7, 0.12); color: #997404; }
.active-month-pill.is-status.is-danger { border-color: rgba(220, 53, 69, 0.25); background: rgba(220, 53, 69, 0.1); color: #b02a37; }

.active-month-bar-banner {
  border: 1px solid rgba(13, 110, 253, 0.18);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(13, 110, 253, 0.07), rgba(25, 135, 84, 0.04));
  padding: 1rem 1.15rem;
}
.active-month-bar-banner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}
.active-month-bar-banner-item.is-primary {
  padding-right: 1rem;
  border-right: 1px solid rgba(15, 23, 42, 0.08);
}
.active-month-bar-banner-month {
  display: block;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  margin: 0.15rem 0 0.25rem;
}
@media (max-width: 767.98px) {
  .active-month-bar-banner-item.is-primary {
    border-right: 0;
    padding-right: 0;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  }
}

.active-month-bar-entry {
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}
.active-month-bar-entry .active-month-bar-inline {
  gap: 0.4rem;
}

.dashboard-title-month-filter .active-month-bar-inline {
  margin-right: auto;
}

.dashboard-stats-picker {
  padding: 0.35rem 0.65rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 999px;
  background: var(--bs-body-bg);
}
.dashboard-stats-picker-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--bs-secondary-color);
  white-space: nowrap;
}
.dashboard-stats-picker-select {
  width: auto;
  min-width: 9.5rem;
  border: 0;
  background: transparent;
  box-shadow: none !important;
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
  font-weight: 600;
  font-size: 0.8125rem;
}
.dashboard-stats-viewing-badge {
  font-size: 0.6875rem;
  letter-spacing: 0.02em;
}
@media (max-width: 575.98px) {
  .dashboard-title-month-filter {
    width: 100%;
  }
  .dashboard-stats-picker {
    width: 100%;
    border-radius: 12px;
  }
  .dashboard-stats-picker-select {
    flex: 1;
    min-width: 0;
  }
}

.active-month-bar-topbar.is-attention {
  border-color: rgba(245, 158, 11, 0.55);
  background: rgba(245, 158, 11, 0.08);
}
.active-month-bar-topbar.is-attention .active-month-bar-kicker {
  color: #b45309;
}
a.active-month-bar-topbar:hover {
  color: inherit;
  border-color: rgba(37, 99, 235, 0.45);
}

[data-bs-theme="dark"] .active-month-bar-topbar,
[data-bs-theme="dark"] .active-month-pill {
  background: rgba(15, 23, 42, 0.65);
  border-color: rgba(148, 163, 184, 0.18);
}
[data-bs-theme="dark"] .active-month-bar-page,
[data-bs-theme="dark"] .active-month-bar-entry,
[data-bs-theme="dark"] .active-month-bar-banner {
  background: rgba(15, 23, 42, 0.55);
  border-color: rgba(96, 165, 250, 0.22);
}
[data-bs-theme="dark"] .active-month-bar-icon {
  background: rgba(96, 165, 250, 0.15);
  color: #93c5fd;
}
[data-bs-theme="dark"] .active-month-pill.is-calendar { color: #93c5fd; background: rgba(59, 130, 246, 0.12); }
[data-bs-theme="dark"] .active-month-pill.is-work,
[data-bs-theme="dark"] .active-month-pill.is-viewing { color: #fcd34d; background: rgba(251, 191, 36, 0.12); }

.month-close-admin-toggle:hover {
  background: rgba(15, 23, 42, 0.04);
}
.month-close-admin-chevron {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  transition: transform 0.2s, background 0.15s;
}
.month-close-admin-toggle:not(.collapsed) .month-close-admin-chevron {
  transform: rotate(180deg);
  background: #e0e7ff;
  color: #4338ca;
}
.dashboard-title-month-filter .form-select {
  min-width: 11.5rem;
}
.entry-recent-table thead th {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  white-space: nowrap;
}
.entry-recent-table td {
  font-size: 0.8125rem;
  vertical-align: middle;
}
.entry-recent-empty {
  text-align: center;
  color: #94a3b8;
}

@media (max-width: 767px) {
  .entry-form-row-primary {
    grid-template-columns: 1fr;
  }
  .entry-form-row-secondary {
    grid-template-columns: 1fr;
  }
  .entry-form-cell-save .entry-save-btn {
    width: 100%;
  }
  .entry-form-label-spacer {
    display: none;
  }
  .entry-fast-row {
    grid-template-columns: 1fr;
  }
  .entry-fast-save {
    min-width: 0;
  }
  .entry-fast-save .btn {
    width: 100%;
    height: 42px;
  }
  .entry-onescreen-last {
    max-height: 280px;
  }
}

@media (max-width: 991px) {
  .entry-page {
    max-width: 100%;
  }
  .entry-worker-select-row {
    flex-direction: column;
  }
  .entry-worker-continue-btn {
    width: 100%;
  }
}

[data-bs-theme="dark"] .entry-worker-setup {
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  border-color: #334155 !important;
}
[data-bs-theme="dark"] .entry-form-card,
[data-bs-theme="dark"] .entry-recent-card {
  border-color: #334155 !important;
}
[data-bs-theme="dark"] .entry-meta-chip {
  background: #334155;
  border-color: #475569;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .entry-meta-chip.is-primary {
  background: #064e3b;
  border-color: #047857;
  color: #6ee7b7;
}
[data-bs-theme="dark"] .entry-input-field,
[data-bs-theme="dark"] .entry-remarks {
  background: #0f172a;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .entry-recent-item:hover {
  background: #1e293b;
}
[data-bs-theme="dark"] .entry-recent-batch {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .entry-form-placeholder {
  background: #1e293b;
  border-color: #475569 !important;
}

@media (max-width: 576px) {
  .chat-popup {
    right: 0.5rem;
    left: 0.5rem;
    width: auto;
    bottom: 5rem;
  }
}

/* ========== Goal analytics panel (charts) ========== */
.goal-analytics-wrap {
  background: #f8fafc;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  padding: 1.25rem;
}
.goal-analytics-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1.15rem;
}
.goal-analytics-month {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}
.goal-analytics-head-sub {
  font-size: 0.8125rem;
  color: #64748b;
}
.goal-chart-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1rem 1.15rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.goal-chart-card-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.goal-chart-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
}
.goal-chart-sub {
  font-size: 0.75rem;
  color: #94a3b8;
}
.goal-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 0.75rem;
  color: #64748b;
}
.goal-legend-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 3px;
  margin-right: 0.25rem;
  vertical-align: -1px;
}
.goal-legend-my { background: #5B7C99; }
.goal-legend-team { background: #94a3b8; }
.goal-chart-area { min-height: 200px; }
.goal-chart-area-sm { min-height: 180px; }
.goal-daily-legend {
  display: flex;
  gap: 1.25rem;
  padding-top: 0.5rem;
  border-top: 1px solid #f1f5f9;
  margin-top: 0.25rem;
}
.goal-daily-stat {
  font-size: 0.8125rem;
  color: #64748b;
}
.goal-daily-stat strong {
  color: #111827;
  font-weight: 700;
}
.goal-analytics-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1rem 1.1rem;
  height: 100%;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.goal-analytics-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.goal-analytics-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
}
.goal-analytics-sub {
  font-size: 0.75rem;
  color: #64748b;
  margin-top: 0.1rem;
}
.goal-analytics-badge {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.25rem 0.55rem;
  border-radius: 6px;
  background: #f1f5f9;
  color: #475569;
  white-space: nowrap;
}
.goal-status-completed .goal-analytics-badge { background: #ecfdf5; color: #059669; }
.goal-status-on-track .goal-analytics-badge { background: #ecfdf5; color: #047857; }
.goal-status-slight .goal-analytics-badge { background: #fffbeb; color: #b45309; }
.goal-status-behind .goal-analytics-badge { background: #fef2f2; color: #dc2626; }
.goal-status-unset .goal-analytics-badge { background: #f1f5f9; color: #94a3b8; }
.goal-analytics-body {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.85rem;
}
.goal-radial-wrap {
  width: 140px;
  flex-shrink: 0;
}
.goal-analytics-meta {
  flex: 1;
  min-width: 0;
}
.goal-analytics-counts {
  font-size: 1.35rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}
.goal-analytics-remaining {
  color: #64748b;
}
.goal-spark-wrap {
  height: 48px;
  margin-top: 0.25rem;
}
.goal-metric-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.55rem;
  margin-bottom: 0.65rem;
}
.goal-metric-tile {
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  padding: 0.55rem 0.65rem 0.35rem;
}
.goal-metric-val {
  display: block;
  font-size: 1.05rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.2;
}
.goal-metric-lbl {
  display: block;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #94a3b8;
  margin-bottom: 0.15rem;
}
.goal-metric-mini {
  height: 32px;
  margin: 0 -0.15rem;
}
.goal-analytics-tip {
  color: #64748b;
  padding: 0.5rem 0.65rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 2px solid #5B7C99;
}
.user-goal-card-admin .goal-analytics-tip {
  border-left-color: #64748b;
}
.goal-analytics-live {
  font-size: 0.75rem;
}

/* Compact fallback (entry form strip) */
.user-goals-wrap-compact {
  background: transparent;
  border: none;
  padding: 0;
  box-shadow: none;
}
.user-goals-wrap-compact .user-goal-card {
  padding: 0.5rem 0.65rem;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  border-radius: 8px;
}
.user-goals-wrap-compact .user-goal-title,
.user-goals-wrap-compact .user-goal-counts {
  color: rgba(255, 255, 255, 0.9);
}
.user-goal-card {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 1rem;
  background: #fff;
}
.user-goal-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}
.user-goal-title {
  font-size: 0.875rem;
  font-weight: 700;
}
.user-goal-status-badge {
  font-size: 0.625rem;
  font-weight: 600;
  padding: 0.2rem 0.45rem;
  border-radius: 5px;
  background: #f1f5f9;
  color: #475569;
}

.user-goal-panel {
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  background: #fff;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}
.user-goal-panel-inner {
  padding: 1.25rem 1.35rem 1.15rem;
}
.user-goal-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.user-goal-progress-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
  margin-bottom: 1rem;
}
.user-goal-progress-meta {
  flex: 1;
  min-width: 200px;
}
.user-goal-bar {
  height: 10px;
  border-radius: 999px;
  background: #f1f5f9;
}
.user-goal-ring-sm {
  width: 56px;
  height: 56px;
  flex-shrink: 0;
}
.user-goal-ring-sm .user-goal-ring-inner {
  width: 44px;
  height: 44px;
}
.user-goal-ring-sm .user-goal-pct {
  font-size: 0.8rem;
}

/* Compact — Add Entry strip */
.user-goal-panel-compact {
  border: none;
  box-shadow: none;
  background: transparent;
}
.user-goal-panel-compact .user-goal-panel-inner {
  padding: 0.5rem 0 0.75rem;
}
.user-goal-panel-compact .user-goal-head {
  margin-bottom: 0.5rem;
}
.user-goal-panel-compact .user-goal-progress-wrap {
  margin-bottom: 0.5rem;
  gap: 0.75rem;
}
.user-goal-panel-compact .user-goal-ring {
  width: 64px;
  height: 64px;
}
.user-goal-panel-compact .user-goal-ring-inner {
  width: 52px;
  height: 52px;
}
.user-goal-panel-compact .user-goal-stats-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 0.4rem;
}
.user-goal-panel-compact .user-goal-footnote,
.user-goal-panel-compact .user-goal-live {
  display: none;
}
.entry-goal-strip {
  border-bottom: 1px solid #e2e8f0;
}

[data-bs-theme="dark"] .entry-goal-strip {
  background: #0f172a;
  border-bottom-color: #334155;
}
[data-bs-theme="dark"] .entry-goal-strip .user-goals-wrap-compact .user-goal-card {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .entry-goal-strip .user-goals-wrap-compact .user-goal-title,
[data-bs-theme="dark"] .entry-goal-strip .user-goals-wrap-compact .user-goal-counts {
  color: #e2e8f0;
}
[data-bs-theme="dark"] .entry-form-input {
  background: #0f172a;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .entry-form-label {
  color: #cbd5e1;
}
[data-bs-theme="dark"] .entry-form-hint {
  color: #94a3b8;
}

[data-bs-theme="dark"] .goal-analytics-wrap {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .goal-chart-card,
[data-bs-theme="dark"] .goal-analytics-card {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .goal-analytics-month,
[data-bs-theme="dark"] .goal-chart-title,
[data-bs-theme="dark"] .goal-analytics-title,
[data-bs-theme="dark"] .goal-analytics-counts,
[data-bs-theme="dark"] .goal-metric-val {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .goal-metric-tile {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .goal-analytics-tip {
  background: #0f172a;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .user-goals-wrap,
[data-bs-theme="dark"] .user-goal-card {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .user-goal-month,
[data-bs-theme="dark"] .user-goal-counts strong,
[data-bs-theme="dark"] .user-goal-pct,
[data-bs-theme="dark"] .user-goal-stat-val {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .user-goal-stat {
  background: #0f172a;
  border-color: #334355;
}
[data-bs-theme="dark"] .user-goal-footnote {
  background: #0f172a;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .user-goal-panel {
  background: #1e293b;
  border-color: #334155;
}

@media (max-width: 768px) {
  .goal-analytics-body {
    flex-direction: column;
    align-items: stretch;
  }
  .goal-radial-wrap {
    width: 100%;
    max-width: 180px;
    margin: 0 auto;
  }
  .goal-metric-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* User Insights — admin user-wise dashboard */
.user-insights-shell {
  display: grid;
  grid-template-columns: minmax(260px, 300px) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

/* Sidebar picker */
.user-insights-picker {
  position: sticky;
  top: 5.5rem;
  max-height: calc(100vh - 6.5rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 16px !important;
}
.user-insights-picker-accent {
  height: 4px;
  background: linear-gradient(90deg, #E66239, #5B7C99, #6366f1);
  flex-shrink: 0;
}
.user-insights-picker-head {
  padding: 1.1rem 1.1rem 0.85rem;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}
.user-insights-picker-title-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.user-insights-picker-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(145deg, #5B7C99, #3d5568);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(91, 124, 153, 0.35);
}
.user-insights-picker-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #0f172a;
}
.user-insights-picker-sub {
  font-size: 0.75rem;
  color: #64748b;
  margin-top: 0.1rem;
}
.user-insights-search-wrap {
  position: relative;
}
.user-insights-search-wrap .ti-search {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 0.95rem;
  pointer-events: none;
  z-index: 2;
}
.user-insights-search-wrap .form-control {
  padding-left: 2.25rem;
  border-radius: 10px;
  border-color: #e2e8f0;
  background: #fff;
}
.user-insights-search-wrap .form-control:focus {
  border-color: #5B7C99;
  box-shadow: 0 0 0 3px rgba(91, 124, 153, 0.15);
}
.user-insights-picker-list {
  overflow-y: auto;
  flex: 1;
  padding: 0.5rem;
}
.user-insights-picker-empty {
  text-align: center;
  padding: 2.5rem 1rem;
  color: #94a3b8;
  font-size: 0.8125rem;
}
.user-insights-picker-empty .ti {
  font-size: 2rem;
  display: block;
  margin-bottom: 0.5rem;
  opacity: 0.45;
}
.user-insights-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.6rem 0.65rem;
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
  margin-bottom: 0.2rem;
  border: 1px solid transparent;
}
.user-insights-item:hover {
  background: #f1f5f9;
  transform: translateX(2px);
}
.user-insights-item.is-active {
  background: linear-gradient(135deg, rgba(91, 124, 153, 0.16), rgba(230, 98, 57, 0.06));
  border-color: rgba(91, 124, 153, 0.35);
  box-shadow: 0 2px 8px rgba(91, 124, 153, 0.12);
}
.user-insights-item.is-inactive {
  opacity: 0.65;
}
.user-insights-avatar,
.user-insights-hero-avatar {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
  background: linear-gradient(145deg, #5B7C99, #3d5568);
  color: #fff;
  box-shadow: 0 2px 6px rgba(61, 85, 104, 0.25);
}
.user-insights-item-body {
  min-width: 0;
  flex: 1;
}
.user-insights-item-name {
  display: block;
  font-weight: 600;
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #0f172a;
}
.user-insights-item-bar {
  display: block;
  height: 3px;
  background: #eef2f7;
  border-radius: 999px;
  margin: 0.3rem 0 0.25rem;
  overflow: hidden;
}
.user-insights-item-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #5B7C99, #6366f1);
  transition: width 0.35s ease;
}
.user-insights-item.is-active .user-insights-item-bar-fill {
  background: linear-gradient(90deg, #E66239, #5B7C99);
}
.user-insights-item-meta {
  display: block;
  font-size: 0.6875rem;
  color: #94a3b8;
}
.user-insights-item-badges {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-end;
  flex-shrink: 0;
}
.user-insights-entry-pill {
  font-size: 0.6875rem;
  font-weight: 800;
  padding: 0.15rem 0.45rem;
  border-radius: 6px;
  background: #eef4f8;
  color: #3d5568;
  min-width: 2rem;
  text-align: center;
}
.user-insights-item.is-active .user-insights-entry-pill {
  background: #5B7C99;
  color: #fff;
}
.user-insights-query-pill {
  font-size: 0.625rem;
  font-weight: 700;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #b45309;
}
.user-insights-off-pill {
  font-size: 0.625rem;
  font-weight: 600;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
}

/* Hero profile banner */
.user-insights-hero {
  border-radius: 16px !important;
  overflow: hidden;
  border: 1px solid #e2e8f0 !important;
}
.user-insights-hero-banner {
  height: 88px;
  background: linear-gradient(135deg, #3d5568 0%, #5B7C99 40%, #E66239 100%);
  position: relative;
}
.user-insights-hero-banner::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.15) 0%, transparent 50%);
}
.user-insights-hero-body {
  margin-top: -36px;
  position: relative;
  z-index: 1;
}
.user-insights-hero-avatar-wrap {
  position: relative;
  flex-shrink: 0;
}
.user-insights-hero-avatar {
  width: 80px;
  height: 80px;
  border-radius: 20px;
  font-size: 1.5rem;
  border: 4px solid #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.15);
}
.user-insights-hero-status {
  position: absolute;
  bottom: 4px;
  right: 4px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #fff;
}
.user-insights-hero-status-on { background: #22c55e; }
.user-insights-hero-status-off { background: #ef4444; }
.user-insights-hero-name {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.user-insights-role-pill {
  font-size: 0.6875rem;
  font-weight: 700;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: #eef4f8;
  color: #5B7C99;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.user-insights-role-admin {
  background: linear-gradient(135deg, #1e293b, #334155);
  color: #fff;
}
.user-insights-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.25rem;
  font-size: 0.8125rem;
  color: #64748b;
  margin: 0.35rem 0 0.85rem;
}
.user-insights-hero-meta span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.user-insights-hero-meta .ti {
  font-size: 0.95rem;
  opacity: 0.7;
}
.user-insights-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.user-insights-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  transition: background 0.15s, border-color 0.15s, color 0.15s, transform 0.12s;
}
.user-insights-action-btn:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #0f172a;
  transform: translateY(-1px);
}
.user-insights-action-primary {
  background: #5B7C99;
  border-color: #5B7C99;
  color: #fff;
}
.user-insights-action-primary:hover {
  background: #4a6578;
  border-color: #4a6578;
  color: #fff;
}
.user-insights-action-danger {
  border-color: #fecaca;
  color: #dc2626;
  background: #fef2f2;
}
.user-insights-action-danger:hover {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #b91c1c;
}
.user-insights-month-form {
  min-width: 160px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.65rem 0.85rem;
}
.user-insights-month-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.35rem;
}

/* KPI row */
.user-insights-kpi {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1rem 1.1rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  height: 100%;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.user-insights-kpi:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}
.user-insights-kpi-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
  background: #f1f5f9;
  color: #64748b;
}
.user-insights-kpi-today .user-insights-kpi-icon { background: #fff7ed; color: #ea580c; }
.user-insights-kpi-success .user-insights-kpi-icon { background: #ecfdf5; color: #059669; }
.user-insights-kpi-info .user-insights-kpi-icon { background: #eff6ff; color: #2563eb; }
.user-insights-kpi-danger .user-insights-kpi-icon { background: #fef2f2; color: #dc2626; }
.user-insights-kpi strong {
  display: block;
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.15;
  color: #0f172a;
}
.user-insights-kpi small {
  display: block;
  font-size: 0.6875rem;
  color: #94a3b8;
  margin-top: 0.05rem;
}
.user-insights-kpi-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #64748b;
  margin-bottom: 0.15rem;
}
.user-insights-kpi-success strong { color: #059669; }
.user-insights-kpi-info strong { color: #0284c7; }
.user-insights-kpi-danger strong { color: #dc2626; }

/* Panels (goal, perf, workers, tabs) */
.user-insights-panel {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
  overflow: hidden;
}
.user-insights-panel-head {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1.15rem 1.35rem;
  border-bottom: 1px solid #f1f5f9;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}
.user-insights-panel-head-compact {
  padding: 1rem 1.25rem;
}
.user-insights-panel-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}
.ui-panel-icon-goal { background: #eef4f8; color: #5B7C99; }
.ui-panel-icon-perf { background: #eff6ff; color: #2563eb; }
.ui-panel-icon-worker { background: #f0fdf4; color: #059669; }
.user-insights-panel-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #0f172a;
}
.user-insights-panel-sub {
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 0.1rem;
}
.user-insights-panel-body {
  padding: 1.25rem 1.35rem 1.35rem;
}
.user-insights-panel-body-compact {
  padding: 1rem 1.25rem 1.15rem;
}
.user-insights-section-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
  margin-bottom: 0.1rem;
}
.user-insights-status-pill {
  margin-left: auto;
  font-size: 0.6875rem;
  font-weight: 700;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
}
.ui-goal-status-done { background: #ecfdf5; color: #059669; }
.ui-goal-status-ok { background: #ecfdf5; color: #047857; }
.ui-goal-status-warn { background: #fffbeb; color: #b45309; }
.ui-goal-status-bad { background: #fef2f2; color: #dc2626; }
.ui-goal-status-muted { background: #f1f5f9; color: #94a3b8; }

.user-insights-goal-row {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  margin-bottom: 1.15rem;
}
.user-insights-goal-count {
  font-size: 1.5rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}
.user-insights-goal-count span {
  font-size: 1rem;
  font-weight: 500;
  color: #94a3b8;
}
.user-insights-goal-caption {
  font-size: 0.8125rem;
  color: #64748b;
}
.user-insights-goal-empty {
  text-align: center;
  padding: 1.5rem 1rem;
  color: #64748b;
}
.user-insights-goal-empty .ti {
  font-size: 2rem;
  display: block;
  margin-bottom: 0.5rem;
  opacity: 0.4;
}

.user-insights-mini-stat {
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 12px;
  padding: 0.65rem 0.4rem;
  text-align: center;
  height: 100%;
}
.user-insights-mini-stat strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 800;
  color: #0f172a;
}
.user-insights-mini-stat span {
  display: block;
  font-size: 0.625rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-top: 0.1rem;
}
.user-insights-mini-stat-lg strong { font-size: 1.4rem; }
.user-insights-mini-accent strong { color: #2563eb; }
.user-insights-mini-warn strong { color: #d97706; }

.user-insights-chart-wrap {
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
}
.user-insights-chart-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.35rem;
}

.user-insights-worker-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.user-insights-worker-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.85rem 0.4rem 0.65rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #334155;
  transition: background 0.12s, border-color 0.12s;
}
.user-insights-worker-chip:hover {
  background: #eef4f8;
  border-color: #cbd5e1;
}
.user-insights-worker-chip .ti {
  font-size: 0.9rem;
  color: #94a3b8;
}
.user-insights-worker-chip strong {
  background: linear-gradient(135deg, #5B7C99, #3d5568);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 800;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  margin-left: 0.15rem;
}

/* Pill tabs */
.user-insights-tabs-panel {
  border-radius: 16px;
}
.user-insights-tabs-head {
  padding: 0.85rem 1rem 0;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
  border-bottom: 1px solid #f1f5f9;
}
.user-insights-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  border: none;
}
.user-insights-tabs .nav-item { margin: 0; }
.user-insights-tabs .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid transparent;
  border-radius: 999px !important;
  color: #64748b;
  font-weight: 600;
  font-size: 0.8125rem;
  padding: 0.45rem 0.95rem;
  background: transparent;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.user-insights-tabs .nav-link .ti {
  font-size: 1rem;
}
.user-insights-tabs .nav-link em {
  font-style: normal;
  font-size: 0.6875rem;
  font-weight: 800;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  min-width: 1.35rem;
  text-align: center;
}
.user-insights-tabs .nav-link em.is-danger {
  background: #fef2f2;
  color: #dc2626;
}
.user-insights-tabs .nav-link em.is-warn {
  background: #fef3c7;
  color: #b45309;
}
.user-insights-tabs .nav-link:hover {
  background: #f1f5f9;
  color: #334155;
}
.user-insights-tabs .nav-link.active {
  background: #5B7C99;
  border-color: #5B7C99;
  color: #fff;
  box-shadow: 0 4px 12px rgba(91, 124, 153, 0.3);
}
.user-insights-tabs .nav-link.active em {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}
.user-insights-tab-content {
  min-height: 120px;
}
.user-insights-tab-foot {
  padding: 0.65rem 1.25rem;
  border-top: 1px solid #f1f5f9;
  background: #fafbfc;
}
.user-insights-tab-foot a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #5B7C99;
  text-decoration: none;
}
.user-insights-tab-foot a:hover {
  color: #E66239;
  text-decoration: underline;
}

.user-insights-empty {
  border-radius: 16px;
}
.user-insights-empty-inner {
  text-align: center;
  padding: 4rem 2rem;
}
.user-insights-empty-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto;
  border-radius: 20px;
  background: linear-gradient(145deg, #eef4f8, #f1f5f9);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  color: #94a3b8;
}

/* Dark mode */
[data-bs-theme="dark"] .user-insights-picker-head {
  background: linear-gradient(180deg, #1a2236 0%, #161b2e 100%);
  border-color: #2a3348;
}
[data-bs-theme="dark"] .user-insights-picker-title { color: #f1f5f9; }
[data-bs-theme="dark"] .user-insights-search-wrap .form-control {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .user-insights-item:hover { background: #1a2236; }
[data-bs-theme="dark"] .user-insights-item.is-active {
  background: linear-gradient(135deg, rgba(91, 124, 153, 0.28), rgba(230, 98, 57, 0.1));
  border-color: rgba(91, 124, 153, 0.45);
}
[data-bs-theme="dark"] .user-insights-item-name { color: #f1f5f9; }
[data-bs-theme="dark"] .user-insights-item-bar { background: #334155; }
[data-bs-theme="dark"] .user-insights-entry-pill { background: #334155; color: #cbd5e1; }
[data-bs-theme="dark"] .user-insights-item.is-active .user-insights-entry-pill {
  background: #5B7C99;
  color: #fff;
}

[data-bs-theme="dark"] .user-insights-hero {
  border-color: #2a3348 !important;
  background: #161b2e;
}
[data-bs-theme="dark"] .user-insights-hero-avatar {
  border-color: #161b2e;
}
[data-bs-theme="dark"] .user-insights-hero-name { color: #f8fafc; }
[data-bs-theme="dark"] .user-insights-hero-meta { color: #94a3b8; }
[data-bs-theme="dark"] .user-insights-action-btn {
  background: #1a2236;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .user-insights-action-btn:hover {
  background: #334155;
  color: #fff;
}
[data-bs-theme="dark"] .user-insights-action-danger {
  background: #450a0a;
  border-color: #7f1d1d;
  color: #fca5a5;
}
[data-bs-theme="dark"] .user-insights-month-form {
  background: #0f172a;
  border-color: #334155;
}

[data-bs-theme="dark"] .user-insights-kpi,
[data-bs-theme="dark"] .user-insights-panel {
  background: #161b2e;
  border-color: #2a3348;
}
[data-bs-theme="dark"] .user-insights-kpi strong,
[data-bs-theme="dark"] .user-insights-panel-title,
[data-bs-theme="dark"] .user-insights-goal-count,
[data-bs-theme="dark"] .user-insights-mini-stat strong {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .user-insights-panel-head,
[data-bs-theme="dark"] .user-insights-tabs-head {
  background: linear-gradient(180deg, #1a2236 0%, #161b2e 100%);
  border-color: #2a3348;
}
[data-bs-theme="dark"] .user-insights-mini-stat {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .user-insights-chart-wrap {
  border-color: #334155;
}
[data-bs-theme="dark"] .user-insights-worker-chip {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .user-insights-tabs .nav-link:hover {
  background: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .user-insights-tabs .nav-link.active {
  background: #5B7C99;
  color: #fff;
}
[data-bs-theme="dark"] .user-insights-tab-foot {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .user-insights-empty-icon {
  background: linear-gradient(145deg, #1a2236, #0f172a);
}

@media (max-width: 991.98px) {
  .user-insights-shell {
    grid-template-columns: 1fr;
  }
  .user-insights-picker {
    position: static;
    max-height: 340px;
  }
  .user-insights-hero-name {
    font-size: 1.15rem;
  }
  .user-insights-tabs .nav-link span {
    display: none;
  }
  .user-insights-tabs .nav-link {
    padding: 0.45rem 0.75rem;
  }
}

.reset-stat-pill {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  padding: 0.65rem 0.75rem;
  text-align: center;
}
.reset-stat-num {
  display: block;
  font-size: 1.25rem;
  font-weight: 800;
  color: #b91c1c;
  line-height: 1.2;
}
.reset-stat-lbl {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
  margin-top: 0.15rem;
}

/* Dark mode — additional component polish */
[data-bs-theme="dark"] .goal-analytics-head-sub,
[data-bs-theme="dark"] .goal-chart-sub,
[data-bs-theme="dark"] .goal-analytics-sub,
[data-bs-theme="dark"] .goal-chart-legend,
[data-bs-theme="dark"] .goal-daily-stat,
[data-bs-theme="dark"] .goal-analytics-remaining {
  color: #94a3b8;
}
[data-bs-theme="dark"] .goal-daily-stat strong {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .goal-daily-legend {
  border-top-color: #334155;
}
[data-bs-theme="dark"] .goal-analytics-badge {
  background: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .goal-status-completed .goal-analytics-badge { background: #052e16; color: #4ade80; }
[data-bs-theme="dark"] .goal-status-on-track .goal-analytics-badge { background: #064e3b; color: #6ee7b7; }
[data-bs-theme="dark"] .goal-status-slight .goal-analytics-badge { background: #422006; color: #fbbf24; }
[data-bs-theme="dark"] .goal-status-behind .goal-analytics-badge { background: #450a0a; color: #f87171; }
[data-bs-theme="dark"] .goal-status-unset .goal-analytics-badge { background: #334155; color: #94a3b8; }

[data-bs-theme="dark"] .leaderboard-section-sub,
[data-bs-theme="dark"] .leaderboard-card-sub,
[data-bs-theme="dark"] .leaderboard-meta,
[data-bs-theme="dark"] .leaderboard-score small {
  color: #94a3b8;
}
[data-bs-theme="dark"] .leaderboard-row {
  border-bottom-color: #334155;
}
[data-bs-theme="dark"] .leaderboard-card-head-icon {
  background: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .leaderboard-row-gold {
  background: linear-gradient(90deg, rgba(234, 179, 8, 0.12) 0%, transparent 55%);
}
[data-bs-theme="dark"] .leaderboard-row-silver {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.12) 0%, transparent 55%);
}
[data-bs-theme="dark"] .leaderboard-row-bronze {
  background: linear-gradient(90deg, rgba(217, 119, 6, 0.12) 0%, transparent 55%);
}
[data-bs-theme="dark"] .leaderboard-row-you {
  background: linear-gradient(90deg, rgba(59, 130, 246, 0.12) 0%, transparent 60%) !important;
  box-shadow: inset 3px 0 0 #3b82f6;
}

[data-bs-theme="dark"] .dashboard-panel-leaderboard {
  background: #1e293b;
}
[data-bs-theme="dark"] .dashboard-panel-badge-mine { background: #1e3a5f; color: #93c5fd; }
[data-bs-theme="dark"] .dashboard-panel-badge-query { background: #422006; color: #fbbf24; }
[data-bs-theme="dark"] .dashboard-panel-badge-team { background: #334155; color: #cbd5e1; }

[data-bs-theme="dark"] .reset-stat-pill {
  background: #450a0a;
  border-color: #7f1d1d;
}
[data-bs-theme="dark"] .reset-stat-num {
  color: #fca5a5;
}
[data-bs-theme="dark"] .reset-stat-lbl {
  color: #94a3b8;
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  background-color: #0f172a;
  border-color: #475569;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
  background-color: #0f172a;
  border-color: #64748b;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .form-control::placeholder {
  color: #64748b;
}
[data-bs-theme="dark"] .input-group-text {
  background-color: #334155;
  border-color: #475569;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .input-group-text.bg-white {
  background-color: #334155 !important;
}

[data-bs-theme="dark"] .dropdown-menu {
  background-color: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .dropdown-item {
  color: #e2e8f0;
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
  background-color: #334155;
  color: #fff;
}
[data-bs-theme="dark"] .dropdown-divider {
  border-color: #334155;
}

[data-bs-theme="dark"] .modal-content {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .modal-footer {
  border-color: #334155;
}

[data-bs-theme="dark"] .list-group-item {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .list-group-item-action:hover {
  background-color: #334155;
}

[data-bs-theme="dark"] .text-dark {
  color: #f1f5f9 !important;
}
[data-bs-theme="dark"] .text-muted {
  color: #94a3b8 !important;
}
[data-bs-theme="dark"] .border,
[data-bs-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-bottom {
  border-color: #334155 !important;
}

[data-bs-theme="dark"] .entry-recent-toggle {
  background: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .entry-recent-toggle:hover {
  background: #334155;
  border-color: #475569;
}
[data-bs-theme="dark"] .entry-recent-toggle:not(.collapsed) {
  background: #0f172a;
}

[data-bs-theme="dark"] .apexcharts-tooltip.apexcharts-theme-light {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-bs-theme="dark"] .apexcharts-xaxistooltip,
[data-bs-theme="dark"] .apexcharts-yaxistooltip {
  background: #334155 !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}

/* ========== Dark mode polish — utilities & remaining components ========== */

[data-bs-theme="dark"] .login-page {
  background: linear-gradient(160deg, #0b1120 0%, #121826 45%, #0f172a 100%);
}
[data-bs-theme="dark"] .login-page .brand-item img {
  background: #1e293b;
}
[data-bs-theme="dark"] .login-page .brand-item .name .brand-short {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .login-page .brand-item .name .sub {
  color: #94a3b8;
}

[data-bs-theme="dark"] .bg-white:not(.btn):not(.badge):not(.nav-link) {
  background-color: var(--bs-card-bg) !important;
}
[data-bs-theme="dark"] .nav-tabs.bg-white,
[data-bs-theme="dark"] .table.bg-white {
  background-color: var(--bs-card-bg) !important;
}
[data-bs-theme="dark"] .modal-footer.bg-light {
  background-color: var(--bs-card-cap-bg) !important;
  border-color: var(--bs-border-color) !important;
}
[data-bs-theme="dark"] .alert-light {
  background-color: #1e293b;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .badge.bg-white,
[data-bs-theme="dark"] .badge.bg-white.text-dark {
  background-color: #334155 !important;
  color: #f1f5f9 !important;
}
[data-bs-theme="dark"] .text-bg-light {
  background-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-bs-theme="dark"] .export-download-group-head {
  background-color: #1a2236 !important;
  border-color: #334155 !important;
}

[data-bs-theme="dark"] .mail-send-modal-header {
  background: linear-gradient(180deg, #1a2236 0%, #161b2e 55%);
}
[data-bs-theme="dark"] .mail-send-modal.is-done .mail-send-modal-header {
  background: linear-gradient(180deg, #14532d 0%, #161b2e 55%);
}
[data-bs-theme="dark"] .mail-send-modal.is-failed .mail-send-modal-header {
  background: linear-gradient(180deg, #450a0a 0%, #161b2e 55%);
}
[data-bs-theme="dark"] .mail-send-modal-title,
[data-bs-theme="dark"] .mail-send-modal-period strong,
[data-bs-theme="dark"] .mail-send-modal-stats strong,
[data-bs-theme="dark"] .mail-send-state-title {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .mail-send-modal-period {
  background: #0f172a;
  border-color: #334155;
}
[data-bs-theme="dark"] .mail-send-modal-stats div {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .mail-send-modal-recipients {
  background: #172554;
  border-color: #1e40af;
}
[data-bs-theme="dark"] .mail-send-modal-recipients span {
  color: #93c5fd;
}
[data-bs-theme="dark"] .mail-send-modal-recipients p {
  color: #bfdbfe;
}
[data-bs-theme="dark"] .mail-send-modal-note,
[data-bs-theme="dark"] .mail-send-state-hint {
  color: #94a3b8;
}

[data-bs-theme="dark"] .chat-popup-panel {
  background: #111b21;
  border-color: #222d34;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
[data-bs-theme="dark"] .chat-popup-tabs {
  background: #111b21;
  border-color: #222d34;
}
[data-bs-theme="dark"] .chat-popup-tab {
  color: #8696a0;
}
[data-bs-theme="dark"] .chat-popup-tab.active {
  color: #25d366;
  background: #111b21;
}
[data-bs-theme="dark"] .chat-popup-messages {
  background-color: #0b141a;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23182229' fill-opacity='0.8'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
[data-bs-theme="dark"] .chat-popup-user:hover {
  background: #2a3942;
}
[data-bs-theme="dark"] .chat-popup-user-name {
  color: #e9edef;
}
[data-bs-theme="dark"] .chat-popup-compose,
[data-bs-theme="dark"] .chat-popup-reply {
  background: #111b21;
  border-color: #222d34;
}
[data-bs-theme="dark"] .chat-popup-compose .wa-compose-inner {
  background: #2a3942;
  border-color: #3b4a54;
}

[data-bs-theme="dark"] .ea-upload-section {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .ea-variation-pill {
  background: #422006;
  border-color: #92400e;
  color: #fdba74;
}

[data-bs-theme="dark"] .import-stat-icon-total { background: #334155; color: #cbd5e1; }
[data-bs-theme="dark"] .import-stat-icon-ok { background: #14532d; color: #4ade80; }
[data-bs-theme="dark"] .import-stat-icon-warn { background: #422006; color: #fbbf24; }
[data-bs-theme="dark"] .import-stat-icon-file { background: #431407; color: #fb923c; }
[data-bs-theme="dark"] .import-stat-card .import-stat-label { color: #94a3b8; }
[data-bs-theme="dark"] .import-stat-card .import-stat-value { color: #f1f5f9; }
[data-bs-theme="dark"] .import-help-card {
  background: linear-gradient(180deg, #422006 0%, #1e293b 45%);
  border-color: #78350f !important;
}
[data-bs-theme="dark"] .import-easy-steps { color: #cbd5e1; }
[data-bs-theme="dark"] .import-preview-confirm {
  background: #1e293b;
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.25);
}

[data-bs-theme="dark"] .dv-badge-ok { background: #14532d !important; color: #6ee7b7 !important; }
[data-bs-theme="dark"] .dv-badge-file { background: #431407 !important; color: #fdba74 !important; }
[data-bs-theme="dark"] .dv-badge-db { background: #450a0a !important; color: #fca5a5 !important; }
[data-bs-theme="dark"] .dv-badge-missing { background: #422006 !important; color: #fcd34d !important; }
[data-bs-theme="dark"] .dv-badge-dup-first { background: #431407 !important; color: #fdba74 !important; }
[data-bs-theme="dark"] .dv-row-file { background: #431407 !important; }
[data-bs-theme="dark"] .dv-row-dup-first { background: #422006 !important; }
[data-bs-theme="dark"] .dv-row-db { background: #450a0a !important; }
[data-bs-theme="dark"] .dv-row-both { background: #3f1d1d !important; }
[data-bs-theme="dark"] .dv-row-missing { background: #422006 !important; }

[data-bs-theme="dark"] .user-insights-kpi-icon { background: #334155; color: #94a3b8; }
[data-bs-theme="dark"] .user-insights-kpi-today .user-insights-kpi-icon { background: #431407; color: #fb923c; }
[data-bs-theme="dark"] .user-insights-kpi-success .user-insights-kpi-icon { background: #14532d; color: #4ade80; }
[data-bs-theme="dark"] .user-insights-kpi-info .user-insights-kpi-icon { background: #172554; color: #60a5fa; }
[data-bs-theme="dark"] .user-insights-kpi-danger .user-insights-kpi-icon { background: #450a0a; color: #f87171; }
[data-bs-theme="dark"] .user-insights-nav-search {
  border-color: #334155;
}

[data-bs-theme="dark"] .dashboard-section {
  border-bottom-color: #2a3348;
}
[data-bs-theme="dark"] .card {
  background-color: var(--bs-card-bg);
  border-color: var(--bs-card-border-color);
  color: var(--bs-body-color);
}
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer {
  background-color: var(--bs-card-cap-bg);
  border-color: var(--bs-card-border-color);
  color: var(--bs-body-color);
}
[data-bs-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}
[data-bs-theme="dark"] hr,
[data-bs-theme="dark"] .hr {
  border-color: #334155;
  opacity: 1;
}
[data-bs-theme="dark"] code:not(pre code) {
  background: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] pre {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .pagination .page-link {
  background: #1e293b;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .pagination .page-link:hover {
  background: #334155;
  color: #fff;
}
[data-bs-theme="dark"] .pagination .page-item.active .page-link {
  background: #475569;
  border-color: #64748b;
  color: #fff;
}
[data-bs-theme="dark"] .pagination .page-item.disabled .page-link {
  background: #121826;
  color: #64748b;
}
[data-bs-theme="dark"] .nav-tabs .nav-link {
  color: #94a3b8;
}
[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
  color: #e2e8f0;
  border-color: #334155;
}
[data-bs-theme="dark"] .nav-tabs .nav-link.active {
  background: #1e293b;
  border-color: #334155 #334155 #1e293b;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .offcanvas {
  background-color: #1e293b;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .toast {
  background-color: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .accordion-item {
  background: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .accordion-button {
  background: #161b2e;
  color: #e2e8f0;
}
[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
  background: #1a2236;
  color: #f1f5f9;
}
[data-bs-theme="dark"] .topbar-batch-search-item,
[data-bs-theme="dark"] .topbar-batch-search-all {
  border-color: #334155;
}

[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-color-type: var(--bs-table-striped-color);
  --bs-table-bg-type: #1a2236;
  color: var(--bs-table-striped-color);
  background-color: #1a2236;
}

/* User Insights v2 — dashboard-aligned layout */
.ui-insights-layout {
  display: grid;
  grid-template-columns: 272px minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}
.ui-insights-nav {
  position: sticky;
  top: 5.5rem;
  max-height: calc(100vh - 6.5rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ui-insights-nav .dashboard-panel-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0;
  flex: 1;
}
.ui-insights-nav-search {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
}
.ui-insights-nav-list {
  overflow-y: auto;
  flex: 1;
  padding: 0.5rem;
}
.ui-insights-user {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  margin-bottom: 0.15rem;
  border: 1px solid transparent;
  transition: background 0.12s ease;
}
.ui-insights-user:hover {
  background: #f8fafc;
}
.ui-insights-user.is-active {
  background: #f1f5f9;
  border-color: #e2e8f0;
  box-shadow: inset 3px 0 0 #5B7C99;
}
.ui-insights-user.is-off {
  opacity: 0.65;
}
.ui-insights-user-text {
  flex: 1;
  min-width: 0;
}
.ui-insights-user-name {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #0f172a;
}
.ui-insights-user-meta {
  display: block;
  font-size: 0.6875rem;
  color: #94a3b8;
}
.ui-insights-profile-avatar {
  width: 52px;
  height: 52px;
  font-size: 1rem;
  border-radius: 12px;
}
.ui-insights-month-form {
  min-width: 150px;
}
.ui-insights-profile-actions {
  padding-top: 0.25rem;
}
[data-bs-theme="dark"] .ui-insights-user:hover {
  background: #1a2236;
}
[data-bs-theme="dark"] .ui-insights-user.is-active {
  background: #1e293b;
  border-color: #334155;
}
[data-bs-theme="dark"] .ui-insights-user-name {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .ui-insights-nav-search {
  border-color: #334155;
}
@media (max-width: 991.98px) {
  .ui-insights-layout {
    grid-template-columns: 1fr;
  }
  .ui-insights-nav {
    position: static;
    max-height: 300px;
  }
}

/* Snapshot — rank, health, compare */
.ui-insights-snapshot {
  border-top: 3px solid #5B7C99;
}
.ui-insights-health {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}
.ui-insights-health-ring {
  --health-pct: 0;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: conic-gradient(#5B7C99 calc(var(--health-pct) * 1%), #eef2f7 0);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.ui-insights-health-ring::before {
  content: '';
  position: absolute;
  inset: 6px;
  border-radius: 50%;
  background: var(--bs-card-bg, #fff);
}
.ui-insights-health-score {
  position: relative;
  z-index: 1;
  font-size: 1.125rem;
  font-weight: 800;
  color: #0f172a;
}
.ui-insights-chip {
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  padding: 0.55rem 0.75rem;
  height: 100%;
}
.ui-insights-chip-label {
  display: block;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.15rem;
}
.ui-insights-user-rank {
  width: 24px;
  flex-shrink: 0;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 800;
  color: #94a3b8;
}
.ui-insights-user-rank.is-top {
  color: #d97706;
}
.ui-insights-user-rank .ti-medal {
  font-size: 1rem;
  color: #eab308;
}

[data-bs-theme="dark"] .ui-insights-health-ring {
  background: conic-gradient(#5B7C99 calc(var(--health-pct) * 1%), #334155 0);
}
[data-bs-theme="dark"] .ui-insights-health-ring::before {
  background: var(--bs-card-bg, #161b2e);
}
[data-bs-theme="dark"] .ui-insights-health-score {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .ui-insights-chip {
  background: #0f172a;
  border-color: #334155;
}

/* User Management page */
.users-stat-card {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 1rem 1.1rem;
  background: var(--bs-card-bg, #fff);
  border: 1px solid #eef2f7;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  height: 100%;
}
.users-stat-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #94a3b8;
  margin-bottom: 0.15rem;
}
.users-stat-value {
  font-size: 1.35rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}
.users-stat-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.users-stat-icon-total { background: #f1f5f9; color: #475569; }
.users-stat-icon-active { background: #ecfdf5; color: #059669; }
.users-stat-icon-admin { background: #eff6ff; color: #2563eb; }
.users-stat-icon-off { background: #f8fafc; color: #94a3b8; }

.users-mgmt-card .card-header {
  padding-bottom: 1rem !important;
}
.users-toolbar .input-group-text {
  border-color: #e2e8f0;
}
.users-table-row.is-inactive {
  opacity: 0.72;
}
.users-table-row.is-editing {
  background: #fffbeb !important;
  box-shadow: inset 3px 0 0 #f59e0b;
}
.users-table-row.is-self {
  background: #f8fafc;
}
.users-cell-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}
.users-avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 10px;
  background: linear-gradient(135deg, #5B7C99, #3d5a73);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.users-cell-text {
  min-width: 0;
}
.users-cell-name {
  display: block;
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.users-cell-sub,
.users-cell-meta {
  display: block;
  font-size: 0.6875rem;
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.users-username {
  font-size: 0.8125rem;
  color: #475569;
  background: #f8fafc;
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
}
.users-role-badge {
  font-weight: 600;
  font-size: 0.6875rem;
  padding: 0.35em 0.55em;
}
.users-role-admin {
  background: #1e293b !important;
  color: #f8fafc !important;
}
.users-role-leader {
  background: #ecfdf5 !important;
  color: #0f766e !important;
  border: 1px solid #99f6e4;
}
.users-role-user {
  background: #e2e8f0 !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1;
}
.users-status-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #94a3b8;
  margin-right: 0.25rem;
  vertical-align: middle;
}
.users-status-dot.is-on {
  background: #22c55e;
}
.users-actions-toggle {
  width: 2rem;
  height: 2rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.users-actions-dropdown {
  position: static;
}
.users-actions-dropdown .dropdown-menu {
  z-index: 1080;
}
.users-mgmt-card .table-responsive {
  overflow: visible;
}
@media (max-width: 1199.98px) {
  .users-mgmt-card .table-responsive {
    overflow-x: auto;
  }
}
.users-empty-icon {
  width: 4rem;
  height: 4rem;
  margin: 0 auto 1rem;
  border-radius: 50%;
  background: #f1f5f9;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
}
.users-form-section-title {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #64748b;
  margin-bottom: 0.75rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid #f1f5f9;
}

[data-bs-theme="dark"] .users-stat-card {
  background: var(--bs-card-bg, #161b2e);
  border-color: #334155;
}
[data-bs-theme="dark"] .users-stat-value,
[data-bs-theme="dark"] .users-cell-name {
  color: #f1f5f9;
}
[data-bs-theme="dark"] .users-table-row.is-self {
  background: #1a2236;
}
[data-bs-theme="dark"] .users-table-row.is-editing {
  background: #422006 !important;
}
[data-bs-theme="dark"] .users-username {
  background: #0f172a;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .users-role-user {
  background: #334155 !important;
  color: #f1f5f9 !important;
  border-color: #475569;
}
[data-bs-theme="dark"] .users-role-leader {
  background: #134e4a !important;
  color: #99f6e4 !important;
  border-color: #0f766e;
}
[data-bs-theme="dark"] .users-form-section-title {
  border-color: #334155;
  color: #94a3b8;
}

.entry-scope-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.entry-scope-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.entry-scope-tab:hover {
  border-color: #cbd5e1;
  color: #1e293b;
}
.entry-scope-tab.is-active {
  background: #1e293b;
  border-color: #1e293b;
  color: #fff;
}
.entry-scope-tab-qc.is-active {
  background: #0f766e;
  border-color: #0f766e;
}
.entry-scope-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.08);
  font-size: 0.6875rem;
  font-weight: 700;
}
.entry-scope-tab.is-active .entry-scope-tab-count {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}
.ae-wrap-qc .ae-meta-user-stats .ae-meta-stat strong {
  color: #0f766e;
}
.ae-recent-item.is-qc .ae-recent-batch {
  color: #0f766e;
}
[data-bs-theme="dark"] .entry-scope-tab {
  background: #161b2e;
  border-color: #334155;
  color: #cbd5e1;
}
[data-bs-theme="dark"] .entry-scope-tab.is-active {
  background: #e2e8f0;
  color: #0f172a;
}
[data-bs-theme="dark"] .entry-scope-tab-qc.is-active {
  background: #14b8a6;
  color: #042f2e;
}
[data-bs-theme="dark"] .users-empty-icon {
  background: #1e293b;
}

@media print {
  .sidebar, #topbar, .ui-insights-nav, .ui-insights-profile-actions, footer {
    display: none !important;
  }
  .content, .ui-insights-layout, .ui-insights-main {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
  }
}