@charset "UTF-8";

/* ═══════════════════════════════════════════════════════════════════
   ZNK Registry — Modern Design System
   ═══════════════════════════════════════════════════════════════════ */

/* ── CSS Custom Properties ── */
:root {
  /* Primary — refined steel blue */
  --znk-primary: #5B7FAF;
  --znk-primary-hover: #4A6E9E;
  --znk-primary-light: #D4DFF0;
  --znk-primary-subtle: #E5EBF4;

  /* Accent — soft teal */
  --znk-accent: #4DA8B8;
  --znk-accent-light: #D8F0F4;

  /* Neutrals — cool blue-grey palette */
  --znk-bg: #E8ECEF;
  --znk-surface: #F2F4F7;
  --znk-surface-hover: #DDE3EA;
  --znk-border: #C9D3E1;
  --znk-border-light: #DDE3EA;
  --znk-text: #2D3E52;
  --znk-text-secondary: #6C7E9B;
  --znk-text-muted: #9EABC4;

  /* Sidebar — deep blue-grey */
  --znk-sidebar-bg: #2D3E52;
  --znk-sidebar-hover: rgba(255, 255, 255, 0.08);
  --znk-sidebar-active: rgba(91, 127, 175, 0.25);
  --znk-sidebar-text: #AAB9CF;
  --znk-sidebar-text-active: #ffffff;
  --znk-sidebar-width: 260px;

  /* Semantic colors — softened to match the palette */
  --znk-success: #3DA87A;
  --znk-success-light: #DCF0E7;
  --znk-warning: #D4993A;
  --znk-warning-light: #F8EDD4;
  --znk-danger: #D45B5B;
  --znk-danger-light: #F8DEDE;
  --znk-info: #5B8FC7;
  --znk-info-light: #D8E6F4;

  /* Shadows — cool-tinted */
  --znk-shadow-xs: 0 1px 2px rgba(44, 62, 82, 0.06);
  --znk-shadow-sm: 0 1px 3px rgba(44, 62, 82, 0.08), 0 1px 2px rgba(44, 62, 82, 0.05);
  --znk-shadow-md: 0 4px 6px -1px rgba(44, 62, 82, 0.09), 0 2px 4px -2px rgba(44, 62, 82, 0.06);
  --znk-shadow-lg: 0 10px 15px -3px rgba(44, 62, 82, 0.1), 0 4px 6px -4px rgba(44, 62, 82, 0.06);

  /* Radius */
  --znk-radius-sm: 6px;
  --znk-radius: 10px;
  --znk-radius-lg: 14px;
  --znk-radius-xl: 20px;

  /* Transitions */
  --znk-transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --znk-transition-slow: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Dark Theme ── */
[data-bs-theme="dark"] {
  /* Core palette: warm dark with purple accents */
  --znk-bg: #0F0F14;
  --znk-surface: #1C1F2A;
  --znk-surface-hover: #2C3140;
  --znk-border: #3B3F4A;
  --znk-border-light: #252A36;

  /* Warm text hierarchy */
  --znk-text: #E8D8C8;
  --znk-text-secondary: #8C8F99;
  --znk-text-muted: #5A5F6B;

  /* Sidebar */
  --znk-sidebar-bg: #0A0A0F;
  --znk-sidebar-hover: rgba(122, 106, 143, 0.12);
  --znk-sidebar-active: rgba(122, 106, 143, 0.22);
  --znk-sidebar-text: #8C8F99;
  --znk-sidebar-text-active: #E8D8C8;

  /* Primary — muted purple */
  --znk-primary: #7A6A8F;
  --znk-primary-hover: #8E7FA3;
  --znk-primary-light: #2A2338;
  --znk-primary-subtle: #1E1828;

  /* Accent */
  --znk-accent: #6BA3BE;
  --znk-accent-light: #1A2A33;

  /* Semantic — softened for dark bg */
  --znk-success: #5CAD7E;
  --znk-success-light: rgba(92, 173, 126, 0.12);
  --znk-warning: #C9A24D;
  --znk-warning-light: rgba(201, 162, 77, 0.12);
  --znk-danger: #C46464;
  --znk-danger-light: rgba(196, 100, 100, 0.12);
  --znk-info: #6B8FC7;
  --znk-info-light: rgba(107, 143, 199, 0.12);

  /* Shadows — deeper for true dark */
  --znk-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
  --znk-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);
  --znk-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.45);
  --znk-shadow-lg: 0 12px 24px rgba(0, 0, 0, 0.5);
}

/* ── Global Reset & Base ── */
* { box-sizing: border-box; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: var(--znk-bg);
  color: var(--znk-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

::selection {
  background: var(--znk-primary);
  color: #fff;
}

a {
  color: var(--znk-primary);
  text-decoration: none;
  transition: color var(--znk-transition);
}
a:hover { color: var(--znk-primary-hover); }

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--znk-text-muted);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--znk-text-secondary); }


/* ═══════════════════════════════════════════════════════════════════
   SIDEBAR
   ═══════════════════════════════════════════════════════════════════ */

.sidebar {
  width: var(--znk-sidebar-width);
  min-width: var(--znk-sidebar-width);
  min-height: 100vh;
  height: 100vh;
  position: sticky;
  top: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--znk-sidebar-bg);
  transition: all var(--znk-transition-slow);
  z-index: 1050;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

[data-bs-theme="dark"] .sidebar {
  border-right-color: #1C1F2A;
}

.sidebar.collapsed {
  width: 0;
  min-width: 0;
  overflow: hidden;
  border-right: none;
}

.sidebar-header {
  padding: 1.25rem 1.25rem 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-header .logo-text {
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.sidebar-header .logo-icon {
  width: 32px;
  height: 32px;
  background: linear-gradient(135deg, var(--znk-primary), #7A6A8F);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  flex-shrink: 0;
}

.sidebar-header .logo-sub {
  font-size: 0.7rem;
  color: var(--znk-text-muted);
  margin-top: 2px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sidebar .nav { padding: 0.75rem 0.75rem; }

.sidebar .nav-link {
  padding: 0.5rem 0.75rem;
  margin-bottom: 2px;
  border-radius: var(--znk-radius-sm);
  font-size: 0.85rem;
  font-weight: 450;
  color: var(--znk-sidebar-text);
  transition: all var(--znk-transition);
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.sidebar .nav-link i {
  font-size: 1.05rem;
  width: 20px;
  text-align: center;
  opacity: 0.7;
  transition: opacity var(--znk-transition);
}

.sidebar .nav-link:hover {
  background: var(--znk-sidebar-hover);
  color: #fff;
}
.sidebar .nav-link:hover i { opacity: 1; }

.sidebar .nav-link.active {
  background: var(--znk-sidebar-active);
  color: var(--znk-sidebar-text-active);
  font-weight: 600;
}
.sidebar .nav-link.active i { opacity: 1; color: #8DB4DD; }

.sidebar .nav-section {
  font-size: 0.65rem;
  font-weight: 600;
  color: var(--znk-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0.75rem 0.75rem 0.35rem;
  margin-top: 0.25rem;
}

.sidebar .nav-divider {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  margin: 0.5rem 0;
}

/* Art inspiration credit — near theme toggle */
.art-credit {
  text-align: right;
  line-height: 1.2;
}
.art-credit-title {
  display: block;
  font-size: 0.62rem;
  color: var(--znk-text-muted);
  font-style: italic;
  font-weight: 500;
  letter-spacing: 0.01em;
}
.art-credit-work {
  display: block;
  font-size: 0.55rem;
  color: var(--znk-text-muted);
  opacity: 0.7;
  letter-spacing: 0.02em;
}


/* ═══════════════════════════════════════════════════════════════════
   TOP NAVBAR
   ═══════════════════════════════════════════════════════════════════ */

.top-navbar {
  background: var(--znk-surface);
  border-bottom: 1px solid var(--znk-border);
  padding: 0 1.25rem;
  height: 56px;
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 1040;
  backdrop-filter: blur(12px);
  background: rgba(242, 244, 247, 0.88);
}

[data-bs-theme="dark"] .top-navbar {
  background: rgba(28, 31, 42, 0.92);
  border-bottom-color: #2C3140;
  backdrop-filter: blur(16px);
}

.top-navbar .page-title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--znk-text);
  letter-spacing: -0.01em;
}

.sidebar-toggle {
  width: 36px;
  height: 36px;
  border-radius: var(--znk-radius-sm);
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--znk-transition);
  margin-right: 1rem;
  flex-shrink: 0;
}
.sidebar-toggle:hover {
  background: var(--znk-surface-hover);
  color: var(--znk-text);
  border-color: var(--znk-text-muted);
}

.theme-toggle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--znk-transition);
  font-size: 1rem;
}
.theme-toggle:hover {
  background: var(--znk-surface-hover);
  color: var(--znk-warning);
  border-color: var(--znk-warning);
}


/* ═══════════════════════════════════════════════════════════════════
   MAIN CONTENT AREA
   ═══════════════════════════════════════════════════════════════════ */

.main-content {
  padding: 1.5rem;
  max-width: 1600px;
  animation: fadeInUp 0.3s ease-out;
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}


/* ═══════════════════════════════════════════════════════════════════
   CARDS
   ═══════════════════════════════════════════════════════════════════ */

.znk-card {
  background: var(--znk-surface);
  border: 1px solid var(--znk-border);
  border-radius: var(--znk-radius-lg);
  box-shadow: var(--znk-shadow-xs);
  overflow: hidden;
  transition: box-shadow var(--znk-transition);
}

.znk-card:hover {
  box-shadow: var(--znk-shadow-md);
}

.znk-card-header {
  padding: 0.85rem 1.15rem;
  border-bottom: 1px solid var(--znk-border);
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--znk-text);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--znk-surface);
}

.znk-card-header i {
  color: var(--znk-primary);
  font-size: 1rem;
}

.znk-card-body {
  padding: 1.15rem;
}

.znk-card-body.p-0 { padding: 0; }

/* ═══════════════════════════════════════════════════════════════════
   COMPACT FORM STYLES
   ═══════════════════════════════════════════════════════════════════ */

form .znk-card {
  margin-bottom: 0.75rem;
  border: 1px solid var(--znk-border);
  box-shadow: var(--znk-shadow-xs);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  background: var(--znk-surface);
  overflow: hidden;
}

form .znk-card:hover {
  box-shadow: var(--znk-shadow-md);
  transform: translateY(-2px);
  border-color: var(--znk-primary-subtle);
}

form .znk-card-header {
  padding: 0.65rem 1rem;
  font-size: 0.8rem;
  font-weight: 600;
  background: linear-gradient(135deg, var(--znk-surface) 0%, var(--znk-surface-hover) 100%);
  border-bottom: 1px solid var(--znk-border);
  color: var(--znk-text);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  position: relative;
}

form .znk-card-header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--znk-primary-light), transparent);
  opacity: 0.5;
}

form .znk-card-header i {
  margin-right: 0.5rem;
  opacity: 0.9;
  font-size: 0.9rem;
  color: var(--znk-primary);
}

form .znk-card-body {
  padding: 1rem;
  background: var(--znk-surface);
}

form .form-label {
  font-size: 0.75rem;
  margin-bottom: 0.35rem;
  font-weight: 500;
  color: var(--znk-text-secondary);
  letter-spacing: 0.015em;
  display: block;
}

form .form-control-sm,
form .form-select-sm {
  font-size: 0.8rem;
  padding: 0.45rem 0.7rem;
  line-height: 1.45;
  max-width: 100%;
  border: 1.5px solid var(--znk-border);
  border-radius: var(--znk-radius-sm);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  background: #fff;
  color: var(--znk-text);
}

form .form-control-sm:hover,
form .form-select-sm:hover {
  border-color: var(--znk-primary-light);
}

form .form-control-sm:focus,
form .form-select-sm:focus {
  border-color: var(--znk-primary);
  box-shadow: 0 0 0 4px rgba(91, 127, 175, 0.1);
  outline: none;
  background: #fff;
}

form .form-control,
form .form-select {
  max-width: 100%;
}

form .date-field-wrapper {
  max-width: 150px;
  position: relative;
}

form .date-field-wrapper input {
  border-radius: var(--znk-radius-sm);
  width: 100%;
}

[data-bs-theme="dark"] form .znk-card {
  background: #1C1F2A;
  border-color: #2C3140;
}

[data-bs-theme="dark"] form .znk-card-header {
  background: linear-gradient(135deg, #1C1F2A 0%, #252A36 100%);
  border-bottom-color: #2C3140;
}

[data-bs-theme="dark"] form .znk-card-body {
  background: #1C1F2A;
}

[data-bs-theme="dark"] form .form-control-sm,
[data-bs-theme="dark"] form .form-select-sm {
  background: #252A36;
  border-color: #2C3140;
  color: var(--znk-text);
}

[data-bs-theme="dark"] form .form-control-sm:hover,
[data-bs-theme="dark"] form .form-select-sm:hover {
  border-color: #3B3F4A;
}

[data-bs-theme="dark"] form .form-control-sm:focus,
[data-bs-theme="dark"] form .form-select-sm:focus {
  background: #2C3140;
  border-color: var(--znk-primary);
  box-shadow: 0 0 0 4px rgba(122, 106, 143, 0.15);
}


/* ═══════════════════════════════════════════════════════════════════
   STAT CARDS (Dashboard)
   ═══════════════════════════════════════════════════════════════════ */

.stat-card {
  background: var(--znk-surface);
  border: 1px solid var(--znk-border);
  border-radius: var(--znk-radius-lg);
  padding: 1.15rem;
  text-align: center;
  transition: all var(--znk-transition);
  position: relative;
  overflow: hidden;
}

.stat-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--znk-primary);
  opacity: 0;
  transition: opacity var(--znk-transition);
}

.stat-card:hover {
  box-shadow: var(--znk-shadow-md);
  transform: translateY(-2px);
}
.stat-card:hover::before { opacity: 1; }

.stat-card .stat-value {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.03em;
}

.stat-card .stat-label {
  font-size: 0.75rem;
  color: var(--znk-text-muted);
  font-weight: 500;
  margin-top: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.stat-card.stat-primary { border-color: var(--znk-primary); }
.stat-card.stat-primary .stat-value { color: var(--znk-primary); }
.stat-card.stat-primary::before { background: var(--znk-primary); opacity: 1; }

.stat-card.stat-success { border-color: var(--znk-success); }
.stat-card.stat-success .stat-value { color: var(--znk-success); }
.stat-card.stat-success::before { background: var(--znk-success); opacity: 1; }

.stat-card-clickable {
  cursor: pointer;
  text-decoration: none !important;
}
.stat-card-clickable:hover .stat-value { color: var(--znk-primary) !important; }


/* ═══════════════════════════════════════════════════════════════════
   REGISTRY TABLE
   ═══════════════════════════════════════════════════════════════════ */

.registry-table-wrap {
  overflow: auto;
  border-radius: var(--znk-radius-lg);
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  max-height: calc(100vh - 210px);
}

.registry-table {
  width: 100%;
  font-size: 0.8rem;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.registry-table thead th {
  background: var(--znk-sidebar-bg);
  color: #C9D3E1;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.6rem 0.5rem;
  white-space: nowrap;
  border-bottom: 2px solid var(--znk-primary);
  position: sticky;
  top: 0;
  z-index: 10;
}

.registry-table thead th:first-child { border-radius: 0; }
.registry-table thead th:last-child { border-radius: 0; }

.registry-table thead th a {
  color: #C9D3E1 !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.registry-table thead th a:hover { color: #fff !important; }

.registry-table tbody td {
  padding: 0.45rem 0.5rem;
  vertical-align: middle;
  border-bottom: 1px solid var(--znk-border-light);
  transition: background var(--znk-transition);
}

.registry-table tbody tr:hover td {
  background: var(--znk-primary-subtle) !important;
}

.registry-table tbody tr.row-group-alt td {
  background: rgba(91, 127, 175, 0.04);
}

.registry-table tbody tr.row-warning td {
  background: var(--znk-warning-light) !important;
}

.registry-table tbody tr.row-danger td {
  background: var(--znk-danger-light) !important;
}

[data-bs-theme="dark"] .registry-table thead th {
  background: #0F0F14;
  color: #C9C3B8;
  border-bottom-color: #5B4A6E;
}
[data-bs-theme="dark"] .registry-table thead th a {
  color: #C9C3B8 !important;
}
[data-bs-theme="dark"] .registry-table thead th a:hover {
  color: #E8D8C8 !important;
}
[data-bs-theme="dark"] .registry-table tbody tr.row-group-alt td {
  background: rgba(91, 74, 110, 0.05);
}
[data-bs-theme="dark"] .registry-table tbody tr:hover td {
  background: rgba(122, 106, 143, 0.1) !important;
}
[data-bs-theme="dark"] .registry-table tbody tr.row-warning td {
  background: rgba(201, 162, 77, 0.1) !important;
}
[data-bs-theme="dark"] .registry-table tbody tr.row-danger td {
  background: rgba(196, 100, 100, 0.1) !important;
}

.registry-table .cell-znk a {
  font-weight: 600;
  color: var(--znk-primary);
}

.registry-table .cell-btx a {
  color: var(--znk-accent);
  font-size: 0.75rem;
}

.registry-table .cell-task {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--znk-text-secondary);
}

.registry-table .cell-cost {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}

.registry-table .cell-date {
  font-variant-numeric: tabular-nums;
  color: var(--znk-text-secondary);
  white-space: nowrap;
}

.registry-table .cell-actions {
  width: 40px;
  text-align: center;
}


/* ═══════════════════════════════════════════════════════════════════
   STATUS BADGES
   ═══════════════════════════════════════════════════════════════════ */

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.6rem;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
  letter-spacing: 0.01em;
}

.status-badge.status-created {
  background: #E5EBF4;
  color: #6C7E9B;
  border: 1px solid #C9D3E1;
}
.status-badge.status-agreed {
  background: #EDE8F4;
  color: #6B5A8E;
  border: 1px solid #D4CBE4;
}
.status-badge.status-tickets {
  background: #E0F2F5;
  color: #3A8E9E;
  border: 1px solid #B3DDE5;
}
.status-badge.status-in-progress {
  background: #DCF0E7;
  color: #2E8A5E;
  border: 1px solid #B0DCC3;
}
.status-badge.status-closing {
  background: #F8EDD4;
  color: #B07D28;
  border: 1px solid #E8D5A0;
}
.status-badge.status-archive {
  background: #E8ECEF;
  color: #9EABC4;
  border: 1px solid #C9D3E1;
}

[data-bs-theme="dark"] .status-badge.status-created {
  background: #2C3140; color: #8C8F99; border-color: #3B3F4A;
}
[data-bs-theme="dark"] .status-badge.status-agreed {
  background: rgba(91, 74, 110, 0.25); color: #B8A3D0; border-color: rgba(91, 74, 110, 0.4);
}
[data-bs-theme="dark"] .status-badge.status-tickets {
  background: rgba(107, 163, 190, 0.15); color: #7FBDD6; border-color: rgba(107, 163, 190, 0.3);
}
[data-bs-theme="dark"] .status-badge.status-in-progress {
  background: rgba(92, 173, 126, 0.15); color: #7BC49A; border-color: rgba(92, 173, 126, 0.3);
}
[data-bs-theme="dark"] .status-badge.status-closing {
  background: rgba(201, 162, 77, 0.15); color: #D4B76A; border-color: rgba(201, 162, 77, 0.3);
}
[data-bs-theme="dark"] .status-badge.status-archive {
  background: #1C1F2A; color: #5A5F6B; border-color: #2C3140;
}

/* Person badges (MT/ME) */
.person-badge {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 50px;
  font-size: 0.72rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}

/* Check/X marks */
.check-yes {
  color: var(--znk-success);
  font-weight: 600;
}
.check-yes i { margin-right: 2px; }

.check-no {
  color: var(--znk-text-muted);
  font-size: 0.85rem;
}


/* ═══════════════════════════════════════════════════════════════════
   FILTER BAR
   ═══════════════════════════════════════════════════════════════════ */

.filter-bar {
  background: var(--znk-surface);
  border: 1px solid var(--znk-border);
  border-radius: var(--znk-radius-lg);
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.status-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 1rem;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.85rem;
  border-radius: 50px;
  font-size: 0.78rem;
  font-weight: 500;
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text-secondary);
  transition: all var(--znk-transition);
  text-decoration: none !important;
  cursor: pointer;
}

.status-pill:hover {
  border-color: var(--znk-primary);
  color: var(--znk-primary);
  background: var(--znk-primary-subtle);
}

.status-pill.active {
  background: var(--znk-primary);
  color: #fff;
  border-color: var(--znk-primary);
}

.status-pill .pill-count {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50px;
  padding: 0 0.4rem;
  font-size: 0.7rem;
  font-weight: 700;
}

.status-pill.active .pill-count {
  background: rgba(255, 255, 255, 0.25);
}


/* ═══════════════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════════════ */

.btn-znk {
  padding: 0.4rem 1rem;
  font-size: 0.8rem;
  font-weight: 500;
  border-radius: var(--znk-radius-sm);
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text);
  transition: all var(--znk-transition);
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  cursor: pointer;
}

.btn-znk:hover {
  background: var(--znk-surface-hover);
  border-color: var(--znk-text-muted);
}

.btn-znk-primary {
  background: var(--znk-primary);
  color: #fff;
  border-color: var(--znk-primary);
}
.btn-znk-primary:hover {
  background: var(--znk-primary-hover);
  border-color: var(--znk-primary-hover);
  color: #fff;
}

.btn-znk-success {
  background: var(--znk-success);
  color: #fff;
  border-color: var(--znk-success);
}
.btn-znk-success:hover {
  background: #059669;
  border-color: #059669;
  color: #fff;
}

.btn-znk-danger {
  background: transparent;
  color: var(--znk-danger);
  border-color: var(--znk-danger);
}
.btn-znk-danger:hover {
  background: var(--znk-danger);
  color: #fff;
}

.btn-znk-sm {
  padding: 0.25rem 0.6rem;
  font-size: 0.75rem;
}

.btn-znk-icon {
  width: 32px;
  height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--znk-radius-sm);
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text-secondary);
  transition: all var(--znk-transition);
  cursor: pointer;
}
.btn-znk-icon:hover {
  background: var(--znk-primary-subtle);
  color: var(--znk-primary);
  border-color: var(--znk-primary);
}


/* ═══════════════════════════════════════════════════════════════════
   FORMS
   ═══════════════════════════════════════════════════════════════════ */

.form-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--znk-text-secondary);
  margin-bottom: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.form-control, .form-select {
  border-radius: var(--znk-radius-sm);
  border-color: var(--znk-border);
  font-size: 0.85rem;
  transition: all var(--znk-transition);
}

.form-control:focus, .form-select:focus {
  border-color: var(--znk-primary);
  box-shadow: 0 0 0 3px rgba(91, 127, 175, 0.15);
}

[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  background: #1C1F2A;
  color: #E8D8C8;
  border-color: #3B3F4A;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
  background: #252A36;
  border-color: #7A6A8F;
  box-shadow: 0 0 0 3px rgba(122, 106, 143, 0.2);
}

[data-bs-theme="dark"] .form-control::placeholder {
  color: #5A5F6B;
}


/* ═══════════════════════════════════════════════════════════════════
   DETAIL PAGE
   ═══════════════════════════════════════════════════════════════════ */

.detail-table {
  width: 100%;
  font-size: 0.85rem;
}

.detail-table th {
  padding: 0.5rem 0.75rem;
  font-weight: 500;
  color: var(--znk-text-muted);
  width: 40%;
  border-bottom: 1px solid var(--znk-border-light);
}

.detail-table td {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--znk-border-light);
  font-weight: 500;
}

.detail-table tr:last-child th,
.detail-table tr:last-child td {
  border-bottom: none;
}

.detail-table .total-row {
  background: var(--znk-primary-subtle);
  font-weight: 700;
}

.detail-table .total-row th,
.detail-table .total-row td {
  color: var(--znk-text);
}


/* ═══════════════════════════════════════════════════════════════════
   PAGINATION
   ═══════════════════════════════════════════════════════════════════ */

.znk-pagination {
  display: flex;
  justify-content: center;
  gap: 0.25rem;
  padding: 1.25rem 0;
}

.znk-pagination a, .znk-pagination span {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--znk-radius-sm);
  font-size: 0.8rem;
  font-weight: 500;
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text-secondary);
  transition: all var(--znk-transition);
  text-decoration: none;
}

.znk-pagination a:hover {
  background: var(--znk-primary-subtle);
  border-color: var(--znk-primary);
  color: var(--znk-primary);
}

.znk-pagination .active {
  background: var(--znk-primary);
  border-color: var(--znk-primary);
  color: #fff;
}


/* ═══════════════════════════════════════════════════════════════════
   GANTT / TIMELINE
   ═══════════════════════════════════════════════════════════════════ */

.gantt-container {
  overflow: auto;
  position: relative;
  min-height: 400px;
  max-height: 78vh;
  background: var(--znk-surface);
}

.gantt-row {
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid var(--znk-border-light);
  min-height: 58px;
  transition: background var(--znk-transition);
}
.gantt-row:hover { background: var(--znk-surface-hover); }

.gantt-label {
  width: 150px;
  min-width: 150px;
  padding: 8px 10px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--znk-text);
  background: var(--znk-surface);
  border-right: 2px solid var(--znk-border);
  position: sticky;
  left: 0;
  z-index: 3;
  display: flex;
  align-items: center;
}
.gantt-row:hover .gantt-label {
  background: var(--znk-surface-hover);
}

.gantt-bars {
  flex: 1;
  position: relative;
  min-height: 56px;
  /* Убеждаемся, что z-index работает для дочерних элементов */
  isolation: isolate;
}

.gantt-bar {
  position: absolute;
  height: 36px;
  /* top устанавливается динамически в JavaScript для разных этапов */
  border-radius: 5px;
  font-size: 0.65rem;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2px 6px;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  transition: all var(--znk-transition);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  z-index: 2;
  line-height: 1.2;
}
.gantt-bar.work {
  overflow: visible; /* Разрешаем тексту выходить за границы для работы */
}
.gantt-bar:hover {
  filter: brightness(1.1);
  transform: scaleY(1.08);
  z-index: 5;
}
.gantt-bar.road { 
  background: #8D9BB5; 
  z-index: 1; /* Полоски дороги ниже */
}
.gantt-bar.work { 
  background: var(--znk-success); 
  z-index: 3; /* Полоски работы выше полосок дороги */
}
.gantt-bar.vacation { 
  background: var(--znk-danger); 
  opacity: 0.8; 
  z-index: 2; /* Отпуск между дорогой и работой */
}

/* Bar inner text — two lines */
.gantt-bar .bar-city {
  font-weight: 600;
  font-size: 0.68rem;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}
.gantt-bar.road .bar-city {
  text-align: center;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}
.gantt-bar .bar-dates {
  opacity: 0.8;
  font-size: 0.58rem;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}


.gantt-header {
  display: flex;
  border-bottom: 2px solid var(--znk-border);
  font-size: 0.7rem;
  font-weight: 600;
  background: var(--znk-surface);
  position: sticky;
  top: 0;
  z-index: 5;
}

.gantt-header-label {
  width: 150px;
  min-width: 150px;
  padding: 6px 10px;
  background: var(--znk-surface);
  border-right: 2px solid var(--znk-border);
  position: sticky;
  left: 0;
  z-index: 6;
  color: var(--znk-text-secondary);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.gantt-header-dates {
  flex: 1;
  display: flex;
  position: relative;
}

.gantt-month-marker {
  border-left: 1px solid var(--znk-border);
  padding: 6px 8px;
  font-size: 0.7rem;
  position: absolute;
  top: 0;
  color: var(--znk-text-secondary);
  pointer-events: none;
}

.gantt-today {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--znk-danger);
  z-index: 1;
  opacity: 0.6;
  pointer-events: none;
}

#gantt-scroll {
  /* scroll handled by .gantt-container */
}


/* ═══════════════════════════════════════════════════════════════════
   ANALYTICS
   ═══════════════════════════════════════════════════════════════════ */

.analytics-summary-card {
  background: var(--znk-surface);
  border: 1px solid var(--znk-border);
  border-radius: var(--znk-radius-lg);
  padding: 1.5rem;
  text-align: center;
}

.analytics-summary-card .big-number {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.analytics-summary-card .big-label {
  font-size: 0.75rem;
  color: var(--znk-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 0.25rem;
}


/* ═══════════════════════════════════════════════════════════════════
   ALERTS
   ═══════════════════════════════════════════════════════════════════ */

.znk-alert {
  border-radius: var(--znk-radius);
  padding: 0.75rem 1rem;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1rem;
  border: 1px solid;
  animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.znk-alert-success {
  background: var(--znk-success-light);
  border-color: #B0DCC3;
  color: #1E6B46;
}
.znk-alert-danger {
  background: var(--znk-danger-light);
  border-color: #E8B4B4;
  color: #8B3030;
}
.znk-alert-warning {
  background: var(--znk-warning-light);
  border-color: #E8D5A0;
  color: #7A5A15;
}
.znk-alert-info {
  background: var(--znk-info-light);
  border-color: #A8C5E0;
  color: #2E5A8A;
}

[data-bs-theme="dark"] .znk-alert-success {
  background: rgba(92, 173, 126, 0.1); border-color: rgba(92, 173, 126, 0.25); color: #7BC49A;
}
[data-bs-theme="dark"] .znk-alert-danger {
  background: rgba(196, 100, 100, 0.1); border-color: rgba(196, 100, 100, 0.25); color: #D98A8A;
}
[data-bs-theme="dark"] .znk-alert-warning {
  background: rgba(201, 162, 77, 0.1); border-color: rgba(201, 162, 77, 0.25); color: #D4B76A;
}
[data-bs-theme="dark"] .znk-alert-info {
  background: rgba(107, 143, 199, 0.1); border-color: rgba(107, 143, 199, 0.25); color: #8EB0D6;
}


/* ═══════════════════════════════════════════════════════════════════
   QUICK ACTIONS
   ═══════════════════════════════════════════════════════════════════ */

.quick-action {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: var(--znk-radius);
  border: 1px solid var(--znk-border);
  background: var(--znk-surface);
  color: var(--znk-text);
  font-size: 0.8rem;
  font-weight: 500;
  transition: all var(--znk-transition);
  text-decoration: none !important;
  cursor: pointer;
}

.quick-action:hover {
  border-color: var(--znk-primary);
  color: var(--znk-primary);
  background: var(--znk-primary-subtle);
  transform: translateY(-1px);
  box-shadow: var(--znk-shadow-sm);
}

.quick-action i {
  font-size: 1rem;
}


/* ═══════════════════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════════════════ */

.empty-state {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--znk-text-muted);
}

.empty-state i {
  font-size: 3rem;
  margin-bottom: 1rem;
  opacity: 0.4;
}

.empty-state p {
  font-size: 0.9rem;
  margin: 0;
}


/* ═══════════════════════════════════════════════════════════════════
   CONFIRM DELETE PAGE
   ═══════════════════════════════════════════════════════════════════ */

.delete-confirm {
  max-width: 440px;
  margin: 3rem auto;
  text-align: center;
}

.delete-confirm .delete-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--znk-danger-light);
  color: var(--znk-danger);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  margin: 0 auto 1.25rem;
}


/* ═══════════════════════════════════════════════════════════════════
   DARK THEME — Component overrides
   ═══════════════════════════════════════════════════════════════════ */

/* Scrollbar */
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #3B3F4A;
}
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #5A5F6B;
}
[data-bs-theme="dark"] ::-webkit-scrollbar-track {
  background: #0F0F14;
}

/* Body & selection */
[data-bs-theme="dark"] ::selection {
  background: #5B4A6E;
  color: #E8D8C8;
}

/* Links */
[data-bs-theme="dark"] a { color: #7A6A8F; }
[data-bs-theme="dark"] a:hover { color: #8E7FA3; }

/* Sidebar logo & sections */
[data-bs-theme="dark"] .sidebar-header {
  border-bottom-color: #1C1F2A;
}
[data-bs-theme="dark"] .sidebar-header .logo-icon {
  background: linear-gradient(135deg, #5B4A6E, #7A6A8F);
}
[data-bs-theme="dark"] .sidebar-header .logo-sub {
  color: #5A5F6B;
}
[data-bs-theme="dark"] .sidebar .nav-link.active i {
  color: #B8A3D0;
}
[data-bs-theme="dark"] .sidebar .nav-divider {
  border-top-color: #1C1F2A;
}
[data-bs-theme="dark"] .sidebar .nav-section {
  color: #5A5F6B;
}

/* Stat cards */
[data-bs-theme="dark"] .stat-card {
  background: #1C1F2A;
  border-color: #2C3140;
}
[data-bs-theme="dark"] .stat-card:hover {
  border-color: #3B3F4A;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}
[data-bs-theme="dark"] .stat-card::before {
  background: #7A6A8F;
}
[data-bs-theme="dark"] .stat-card .stat-label {
  color: #5A5F6B;
}
[data-bs-theme="dark"] .stat-card.stat-primary {
  border-color: #5B4A6E;
}
[data-bs-theme="dark"] .stat-card.stat-primary .stat-value {
  color: #8E7FA3;
}
[data-bs-theme="dark"] .stat-card.stat-primary::before {
  background: #7A6A8F;
}
[data-bs-theme="dark"] .stat-card.stat-success {
  border-color: rgba(92, 173, 126, 0.4);
}
[data-bs-theme="dark"] .stat-card.stat-success .stat-value {
  color: #5CAD7E;
}
[data-bs-theme="dark"] .stat-card.stat-success::before {
  background: #5CAD7E;
}
[data-bs-theme="dark"] .stat-card-clickable:hover .stat-value {
  color: #8E7FA3 !important;
}

/* Cards */
[data-bs-theme="dark"] .znk-card {
  background: #1C1F2A;
  border-color: #2C3140;
}
[data-bs-theme="dark"] .znk-card-header {
  background: #1A1D28;
  border-bottom-color: #2C3140;
}
[data-bs-theme="dark"] .znk-card-header i {
  color: #7A6A8F;
}

/* Filter bar */
[data-bs-theme="dark"] .filter-bar {
  background: #1C1F2A;
  border-color: #2C3140;
}

/* Status pills */
[data-bs-theme="dark"] .status-pill {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #8C8F99;
}
[data-bs-theme="dark"] .status-pill:hover {
  border-color: #7A6A8F;
  color: #B8A3D0;
  background: rgba(122, 106, 143, 0.1);
}
[data-bs-theme="dark"] .status-pill.active {
  background: #5B4A6E;
  border-color: #5B4A6E;
  color: #E8D8C8;
}

/* Buttons */
[data-bs-theme="dark"] .btn-znk {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #C9C3B8;
}
[data-bs-theme="dark"] .btn-znk:hover {
  background: #2C3140;
  border-color: #5A5F6B;
  color: #E8D8C8;
}
[data-bs-theme="dark"] .btn-znk-primary {
  background: #5B4A6E;
  border-color: #5B4A6E;
  color: #E8D8C8;
}
[data-bs-theme="dark"] .btn-znk-primary:hover {
  background: #7A6A8F;
  border-color: #7A6A8F;
  color: #fff;
}
[data-bs-theme="dark"] .btn-znk-success {
  background: rgba(92, 173, 126, 0.8);
  border-color: rgba(92, 173, 126, 0.8);
}
[data-bs-theme="dark"] .btn-znk-success:hover {
  background: #5CAD7E;
  border-color: #5CAD7E;
}
[data-bs-theme="dark"] .btn-znk-danger {
  color: #C46464;
  border-color: rgba(196, 100, 100, 0.5);
}
[data-bs-theme="dark"] .btn-znk-danger:hover {
  background: #C46464;
  border-color: #C46464;
  color: #E8D8C8;
}
[data-bs-theme="dark"] .btn-znk-icon {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #8C8F99;
}
[data-bs-theme="dark"] .btn-znk-icon:hover {
  background: rgba(122, 106, 143, 0.12);
  color: #B8A3D0;
  border-color: #5B4A6E;
}

/* Theme toggle button */
[data-bs-theme="dark"] .theme-toggle {
  border-color: #3B3F4A;
  background: #1C1F2A;
  color: #8C8F99;
}
[data-bs-theme="dark"] .theme-toggle:hover {
  background: rgba(201, 162, 77, 0.12);
  color: #C9A24D;
  border-color: rgba(201, 162, 77, 0.4);
}
[data-bs-theme="dark"] .sidebar-toggle {
  border-color: #3B3F4A;
  background: #1C1F2A;
  color: #8C8F99;
}
[data-bs-theme="dark"] .sidebar-toggle:hover {
  background: #2C3140;
  color: #E8D8C8;
}

/* Quick actions */
[data-bs-theme="dark"] .quick-action {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #C9C3B8;
}
[data-bs-theme="dark"] .quick-action:hover {
  border-color: #5B4A6E;
  color: #B8A3D0;
  background: rgba(91, 74, 110, 0.1);
}

/* Detail table */
[data-bs-theme="dark"] .detail-table th {
  color: #5A5F6B;
}
[data-bs-theme="dark"] .detail-table .total-row {
  background: rgba(91, 74, 110, 0.12);
}
[data-bs-theme="dark"] .detail-table .total-row th,
[data-bs-theme="dark"] .detail-table .total-row td {
  color: #E8D8C8;
}

/* Pagination */
[data-bs-theme="dark"] .znk-pagination a,
[data-bs-theme="dark"] .znk-pagination span {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #8C8F99;
}
[data-bs-theme="dark"] .znk-pagination a:hover {
  background: rgba(122, 106, 143, 0.12);
  border-color: #5B4A6E;
  color: #B8A3D0;
}
[data-bs-theme="dark"] .znk-pagination .active {
  background: #5B4A6E;
  border-color: #5B4A6E;
  color: #E8D8C8;
}

/* Gantt / Timeline */
[data-bs-theme="dark"] .gantt-container {
  background: #1C1F2A;
}
[data-bs-theme="dark"] .gantt-label {
  background: #1C1F2A;
  color: #C9C3B8;
  border-right-color: #3B3F4A;
}
[data-bs-theme="dark"] .gantt-row {
  border-bottom-color: #252A36;
}
[data-bs-theme="dark"] .gantt-row:hover {
  background: rgba(122, 106, 143, 0.06);
}
[data-bs-theme="dark"] .gantt-header {
  background: #0F0F14;
  border-bottom-color: #3B3F4A;
}
[data-bs-theme="dark"] .gantt-header-label {
  background: #0F0F14;
  color: #5A5F6B;
  border-right-color: #3B3F4A;
}
[data-bs-theme="dark"] .gantt-month-marker {
  border-left-color: #2C3140;
  color: #5A5F6B;
}
[data-bs-theme="dark"] .gantt-today {
  background: #C46464;
  opacity: 0.5;
}
[data-bs-theme="dark"] .gantt-bar {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
[data-bs-theme="dark"] .gantt-bar.road {
  background: #5A5F6B;
}
[data-bs-theme="dark"] .gantt-bar.work {
  background: #4A9268;
}
[data-bs-theme="dark"] .gantt-bar.vacation {
  background: #A45656;
}

/* Analytics */
[data-bs-theme="dark"] .analytics-summary-card {
  background: #1C1F2A;
  border-color: #2C3140;
}
[data-bs-theme="dark"] .analytics-summary-card .big-label {
  color: #5A5F6B;
}

/* Delete confirm */
[data-bs-theme="dark"] .delete-confirm .delete-icon {
  background: rgba(196, 100, 100, 0.15);
  color: #C46464;
}

/* Empty state */
[data-bs-theme="dark"] .empty-state {
  color: #5A5F6B;
}

/* Table cell specific */
[data-bs-theme="dark"] .registry-table .cell-znk a {
  color: #8E7FA3;
}
[data-bs-theme="dark"] .registry-table .cell-btx a {
  color: #6BA3BE;
}

/* Bootstrap table overrides */
[data-bs-theme="dark"] .table {
  color: #C9C3B8;
  border-color: #2C3140;
}
[data-bs-theme="dark"] .table > :not(caption) > * > * {
  background-color: transparent;
  color: #C9C3B8;
  border-bottom-color: #252A36;
}
[data-bs-theme="dark"] .table > thead > tr > th {
  background: #0F0F14;
  color: #8C8F99;
}

/* Bootstrap Modal overrides */
[data-bs-theme="dark"] .modal-content {
  background: #1C1F2A;
  border-color: #3B3F4A;
  color: #E8D8C8;
}
[data-bs-theme="dark"] .modal-header {
  border-bottom-color: #2C3140;
}
[data-bs-theme="dark"] .modal-footer {
  border-top-color: #2C3140;
}
[data-bs-theme="dark"] .modal-backdrop {
  background: #0A0A0F;
}
[data-bs-theme="dark"] .btn-close {
  filter: invert(0.7) sepia(0.1) hue-rotate(220deg);
}

/* Bootstrap dropdown overrides */
[data-bs-theme="dark"] .dropdown-menu {
  background: #1C1F2A;
  border-color: #3B3F4A;
}
[data-bs-theme="dark"] .dropdown-item {
  color: #C9C3B8;
}
[data-bs-theme="dark"] .dropdown-item:hover {
  background: #2C3140;
  color: #E8D8C8;
}

/* Tooltips */
[data-bs-theme="dark"] .tooltip-inner {
  background: #2C3140;
  color: #E8D8C8;
}


/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .sidebar {
    position: fixed;
    transform: translateX(-100%);
    z-index: 1060;
  }
  .sidebar.show { transform: translateX(0); }

  .sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1055;
    backdrop-filter: blur(2px);
  }
  .sidebar-backdrop.show { display: block; }

  [data-bs-theme="dark"] .sidebar-backdrop {
    background: rgba(10, 10, 15, 0.7);
    backdrop-filter: blur(4px);
  }

  .main-content { padding: 1rem; }
  .stat-card .stat-value { font-size: 1.25rem; }
}


/* ═══════════════════════════════════════════════════════════════════
   PRINT
   ═══════════════════════════════════════════════════════════════════ */

@media print {
  .sidebar, .top-navbar, .btn-znk, .quick-action, .filter-bar, .status-pills {
    display: none !important;
  }
  .main-content { padding: 0; }
  .registry-table { font-size: 0.7rem; }
  .registry-table thead th { position: static; }
}


/* ═══════════════════════════════════════════════════════════════════
   UTILITY
   ═══════════════════════════════════════════════════════════════════ */

.text-truncate-custom {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.font-mono {
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
  font-variant-numeric: tabular-nums;
}

.gap-xs { gap: 0.25rem; }
.gap-sm { gap: 0.5rem; }
.gap-md { gap: 0.75rem; }