/* ============================================================
   HELPDESK MODERN DESIGN SYSTEM
   Clean, minimalist design system — Notion/Linear inspired
   ============================================================ */

/* --- Google Fonts Import --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* --- CSS Custom Properties (Design Tokens) --- */
:root {
  /* Primary — professional slate blue */
  --hdk-primary: #3b6eb5;
  --hdk-primary-light: #5b8fd4;
  --hdk-primary-dark: #2b5a9e;
  --hdk-primary-rgb: 59, 110, 181;

  /* Accent */
  --hdk-accent: #3b82f6;
  --hdk-accent-light: #60a5fa;
  --hdk-accent-dark: #2563eb;

  /* Neutrals */
  --hdk-bg-page: #f5f5f7;
  --hdk-bg-card: #ffffff;
  --hdk-bg-hover: #f1f5f9;
  --hdk-bg-subtle: #f8fafc;
  --hdk-border: #e2e8f0;
  --hdk-border-light: #f1f5f9;
  --hdk-bg-body: #f9fafb;

  /* Text */
  --hdk-text: #1e293b;
  --hdk-text-muted: #475569;
  --hdk-text-light: #64748b;

  /* Status */
  --hdk-success: #10b981;
  --hdk-success-bg: #ecfdf5;
  --hdk-warning: #f59e0b;
  --hdk-warning-bg: #fffbeb;
  --hdk-danger: #ef4444;
  --hdk-danger-bg: #fef2f2;
  --hdk-info: #3b82f6;
  --hdk-info-bg: #eff6ff;

  /* Shadows */
  --hdk-shadow-sm: 0 1px 2px rgba(0,0,0,0.03);
  --hdk-shadow: 0 1px 3px rgba(0,0,0,0.04);
  --hdk-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --hdk-shadow-lg: 0 8px 24px rgba(0,0,0,0.1);
  --hdk-shadow-hover: 0 4px 12px rgba(0,0,0,0.08);

  /* Radius */
  --hdk-radius-sm: 6px;
  --hdk-radius: 10px;
  --hdk-radius-lg: 12px;
  --hdk-radius-xl: 16px;
  --hdk-radius-full: 9999px;

  /* Transitions */
  --hdk-transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);

  /* Sidebar */
  --hdk-sidebar-width: 270px;
  --hdk-sidebar-collapsed-width: 64px;
  --hdk-sidebar-bg: #1a2744;
  --hdk-sidebar-text: rgba(255,255,255,0.7);
  --hdk-sidebar-text-active: #ffffff;
  --hdk-sidebar-hover: rgba(255,255,255,0.08);
  --hdk-sidebar-active: rgba(255,255,255,0.12);
  --hdk-sidebar-active-border: #60a5fa;
  --hdk-sidebar-divider: rgba(255,255,255,0.1);
  --hdk-sidebar-accent: #60a5fa;

  /* Topbar */
  --hdk-topbar-height: 56px;
  --hdk-topbar-bg: #1a2744;
  --hdk-topbar-text: #ffffff;
  --hdk-topbar-border: rgba(255,255,255,0.1);

  /* Typography Scale */
  --hdk-font-xs: 0.75rem;
  --hdk-font-sm: 0.8125rem;
  --hdk-font-base: 0.875rem;
  --hdk-font-md: 1rem;
  --hdk-font-lg: 1.125rem;
  --hdk-font-xl: 1.25rem;
  --hdk-font-2xl: 1.5rem;
  --hdk-font-3xl: 1.875rem;

  /* Spacing Scale (4px base) */
  --hdk-space-1: 4px;
  --hdk-space-2: 8px;
  --hdk-space-3: 12px;
  --hdk-space-4: 16px;
  --hdk-space-5: 20px;
  --hdk-space-6: 24px;
  --hdk-space-8: 32px;
  --hdk-space-10: 40px;
  --hdk-space-12: 48px;

  /* Component Tokens */
  --hdk-input-height: 40px;
  --hdk-input-padding: 8px 12px;
  --hdk-input-radius: 8px;
  --hdk-btn-height: 40px;
  --hdk-btn-padding: 8px 16px;
  --hdk-card-padding: 24px;
  --hdk-card-header-padding: 16px 20px;
  --hdk-table-row-height: 44px;
  --hdk-table-header-height: 40px;
  --hdk-table-cell-padding: 12px 16px;
  --hdk-modal-header-height: 56px;
}

/* --- Base Reset & Typography --- */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 14px !important;
  color: var(--hdk-text) !important;
  background-color: var(--hdk-bg-page) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.5;
}

* {
  box-sizing: border-box;
}

a {
  color: var(--hdk-accent);
  text-decoration: none;
  transition: color var(--hdk-transition);
}

a:hover {
  color: var(--hdk-accent-dark);
  text-decoration: none;
}

/* ============================================================
   LAYOUT: Topbar + Sidebar + Main Content
   ============================================================ */

/* --- Topbar --- */
.hdk-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--hdk-topbar-height);
  background: var(--hdk-topbar-bg);
  color: var(--hdk-topbar-text);
  display: flex;
  align-items: center;
  padding: 0 var(--hdk-space-4);
  z-index: 1040;
  box-shadow: none;
  border-bottom: 1px solid var(--hdk-topbar-border);
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

.hdk-topbar-brand {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-3);
  margin-right: var(--hdk-space-4);
  flex-shrink: 0;
}

.hdk-topbar-brand img {
  height: 28px;
  width: auto;
}

.hdk-topbar-toggle {
  background: none;
  border: none;
  color: var(--hdk-topbar-text);
  font-size: 20px;
  padding: var(--hdk-space-2);
  cursor: pointer;
  border-radius: var(--hdk-radius);
  transition: background var(--hdk-transition);
  display: flex;
  align-items: center;
  justify-content: center;
}

.hdk-topbar-toggle:hover {
  background: rgba(255,255,255,0.1);
}

.hdk-topbar-search {
  flex: 1;
  max-width: 480px;
  position: relative;
  margin: 0 var(--hdk-space-4);
}

.hdk-topbar-search input {
  width: 100%;
  height: 36px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 20px;
  padding: 0 var(--hdk-space-4) 0 36px;
  color: #ffffff;
  font-size: var(--hdk-font-sm);
  transition: all var(--hdk-transition);
}

.hdk-topbar-search input::placeholder {
  color: rgba(255,255,255,0.5);
}

.hdk-topbar-search input:focus {
  outline: none;
  background: rgba(255,255,255,0.15);
  border-color: var(--hdk-accent);
  box-shadow: 0 0 0 3px rgba(59,130,246,0.2);
}

.hdk-topbar-search .search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,0.5);
  font-size: 14px;
  pointer-events: none;
}

.hdk-topbar-search .search-shortcut {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,0.4);
  font-size: 11px;
  background: rgba(255,255,255,0.08);
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.15);
  pointer-events: none;
}

.hdk-topbar-actions {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-2);
  margin-left: auto;
  flex-shrink: 0;
}

.hdk-topbar-actions .hdk-theme-toggle {
  background: none;
  border: none;
  color: rgba(255,255,255,0.7);
  padding: var(--hdk-space-2);
  cursor: pointer;
  border-radius: var(--hdk-radius);
  transition: background var(--hdk-transition);
  font-size: 16px;
}

.hdk-topbar-actions .hdk-theme-toggle:hover {
  background: rgba(255,255,255,0.1);
}

.hdk-topbar-user {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-2);
  color: rgba(255,255,255,0.85);
  font-size: var(--hdk-font-sm);
  padding: var(--hdk-space-1) var(--hdk-space-2);
  border-radius: var(--hdk-radius);
  cursor: pointer;
  transition: background var(--hdk-transition);
}

.hdk-topbar-user:hover {
  background: rgba(255,255,255,0.1);
  color: #ffffff;
  text-decoration: none;
}

.hdk-topbar-user .user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
}

.hdk-topbar-logout {
  background: none;
  border: none;
  color: rgba(255,255,255,0.7);
  padding: var(--hdk-space-2);
  cursor: pointer;
  border-radius: var(--hdk-radius);
  transition: all var(--hdk-transition);
  font-size: 16px;
  display: flex;
  align-items: center;
}

.hdk-topbar-logout:hover {
  background: rgba(239,68,68,0.15);
  color: #fca5a5;
}

/* --- Sidebar --- */
.hdk-sidebar {
  position: fixed;
  top: var(--hdk-topbar-height);
  left: 0;
  bottom: 0;
  width: var(--hdk-sidebar-width);
  background: var(--hdk-sidebar-bg);
  border-right: 1px solid var(--hdk-sidebar-divider);
  overflow-y: auto;
  overflow-x: hidden;
  z-index: 1035;
  transition: width 0.3s cubic-bezier(0.4,0,0.2,1), transform 0.3s cubic-bezier(0.4,0,0.2,1), background-color 0.3s;
  display: flex;
  flex-direction: column;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.1) transparent;
}

.hdk-sidebar::-webkit-scrollbar {
  width: 4px;
}

.hdk-sidebar::-webkit-scrollbar-track {
  background: transparent;
}

.hdk-sidebar::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.1);
  border-radius: 4px;
}

.hdk-sidebar-nav {
  flex: 1;
  padding: var(--hdk-space-2) 0;
}

.hdk-sidebar-section {
  margin-bottom: var(--hdk-space-1);
}

.hdk-sidebar-section-title {
  padding: 16px 16px 6px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.4);
  opacity: 0.6;
  white-space: nowrap;
  overflow: hidden;
}

.hdk-sidebar-link {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-3);
  padding: var(--hdk-space-2) var(--hdk-space-4);
  color: var(--hdk-sidebar-text);
  font-size: var(--hdk-font-sm);
  text-decoration: none;
  transition: all var(--hdk-transition);
  margin: 1px 8px;
  border-radius: var(--hdk-radius);
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}

.hdk-sidebar-link:hover {
  background: var(--hdk-sidebar-hover);
  color: var(--hdk-sidebar-text-active);
  text-decoration: none;
}

.hdk-sidebar-link.active {
  background: var(--hdk-sidebar-active);
  color: var(--hdk-sidebar-text-active);
}

.hdk-sidebar-link.active::before {
  content: '';
  position: absolute;
  left: -8px;
  top: 4px;
  bottom: 4px;
  width: 3px;
  background: var(--hdk-sidebar-active-border);
  border-radius: 0 3px 3px 0;
}

.hdk-sidebar-link i {
  font-size: 17px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
  opacity: 0.55;
  transition: opacity 0.2s ease;
}

.hdk-sidebar-link:hover i {
  opacity: 0.85;
}

.hdk-sidebar-link.active i {
  opacity: 1;
}

.hdk-sidebar-link .link-text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hdk-sidebar-badge {
  background: var(--hdk-accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: var(--hdk-radius-full);
  min-width: 18px;
  text-align: center;
  flex-shrink: 0;
  letter-spacing: 0.02em;
}

/* Sidebar submenu (collapsible) */
.hdk-sidebar-submenu {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.hdk-sidebar-submenu.show {
  max-height: 2000px;
}

.hdk-sidebar-submenu .hdk-sidebar-link {
  padding-left: var(--hdk-space-12);
  font-size: var(--hdk-font-xs);
}

.hdk-sidebar-toggle {
  cursor: pointer;
}

.hdk-sidebar-toggle .toggle-arrow {
  font-size: 11px;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  flex-shrink: 0;
  opacity: 0.4;
}

.hdk-sidebar-toggle:hover .toggle-arrow {
  opacity: 0.7;
}

.hdk-sidebar-toggle[aria-expanded="true"] .toggle-arrow {
  transform: rotate(90deg);
  opacity: 0.6;
}

/* ============================================================
   HIERARCHY: Parent → Children → Grandchildren
   ============================================================ */

/* Parent group wrapper */
.hdk-sidebar-group {
  margin-bottom: 2px;
}

/* Parent item (expandable section header) */
.hdk-sidebar-parent {
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.01em;
  color: var(--hdk-sidebar-text) !important;
  padding: 9px 14px !important;
  margin: 2px 8px !important;
  border-radius: 6px;
  cursor: pointer;
}

.hdk-sidebar-parent:hover {
  background: var(--hdk-sidebar-hover) !important;
  color: var(--hdk-sidebar-text-active) !important;
}

.hdk-sidebar-parent[aria-expanded="true"] {
  color: var(--hdk-sidebar-text-active) !important;
}

/* Children container (first level) */
.hdk-sidebar-children {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  margin-left: 4px;
}

.hdk-sidebar-children.show {
  max-height: 2000px;
}

/* Tree connector line */
.hdk-sidebar-children::before {
  content: '';
  position: absolute;
  left: 26px;
  top: 2px;
  bottom: 10px;
  width: 1px;
  background: var(--hdk-sidebar-divider);
  opacity: 0.5;
  pointer-events: none;
}

/* Child item */
.hdk-sidebar-child {
  padding: 6px 14px 6px 42px !important;
  font-size: 12.5px !important;
  color: var(--hdk-sidebar-text) !important;
  opacity: 0.75;
  margin: 0 8px !important;
  position: relative;
}

.hdk-sidebar-child:hover {
  color: var(--hdk-sidebar-text-active) !important;
  opacity: 1;
  background: var(--hdk-sidebar-hover) !important;
}

.hdk-sidebar-child.active {
  color: var(--hdk-sidebar-text-active) !important;
  opacity: 1;
  background: var(--hdk-sidebar-active) !important;
}

/* Dot indicator for children */
.child-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--hdk-sidebar-text);
  opacity: 0.3;
  flex-shrink: 0;
  transition: all 0.2s ease;
}

.hdk-sidebar-child:hover .child-dot {
  opacity: 0.55;
  transform: scale(1.2);
}

.hdk-sidebar-child.active .child-dot {
  background: var(--hdk-sidebar-accent);
  opacity: 1;
  transform: scale(1.3);
}

/* Sub-children (2nd level, e.g., items under Cadastros/Servicos) */
.hdk-sidebar-subchildren {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  margin-left: 8px;
}

.hdk-sidebar-subchildren.show {
  max-height: 2000px;
}

.hdk-sidebar-subchildren::before {
  content: '';
  position: absolute;
  left: 34px;
  top: 0;
  bottom: 8px;
  width: 1px;
  background: var(--hdk-sidebar-divider);
  opacity: 0.5;
}

/* Sub-parent (e.g., Cadastros toggle inside Administração) */
.hdk-sidebar-subparent {
  padding: 7px 14px 7px 42px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--hdk-sidebar-text) !important;
  cursor: pointer;
}

.hdk-sidebar-subparent:hover {
  color: var(--hdk-sidebar-text-active) !important;
  background: var(--hdk-sidebar-hover) !important;
}

/* Grandchild item */
.hdk-sidebar-grandchild {
  padding: 5px 14px 5px 56px !important;
  font-size: 12px !important;
  color: var(--hdk-sidebar-text) !important;
  opacity: 0.75;
  margin: 0 8px !important;
}

.hdk-sidebar-grandchild:hover {
  color: var(--hdk-sidebar-text-active) !important;
  opacity: 1;
  background: var(--hdk-sidebar-hover) !important;
}

.hdk-sidebar-grandchild.active {
  color: var(--hdk-sidebar-text-active) !important;
  opacity: 1;
  background: var(--hdk-sidebar-active) !important;
}

/* Sidebar divider */
.hdk-sidebar-divider {
  height: 1px;
  background: var(--hdk-sidebar-divider);
  margin: 6px 16px;
}

/* Sidebar header (Nova Solicitacao button) */
.hdk-sidebar-header {
  padding: 14px;
  border-bottom: 1px solid var(--hdk-sidebar-divider);
  flex-shrink: 0;
}

.hdk-sidebar-header .btn-new-ticket {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--hdk-space-2);
  width: 100%;
  padding: 10px var(--hdk-space-4);
  background: var(--hdk-accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  text-decoration: none;
  letter-spacing: 0.01em;
}

.hdk-sidebar-header .btn-new-ticket:hover {
  background: var(--hdk-accent-dark);
  color: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  text-decoration: none;
}

.hdk-sidebar-header .btn-new-ticket i {
  font-size: 16px;
}

/* Sidebar collapsed state */
.hdk-sidebar.collapsed {
  width: var(--hdk-sidebar-collapsed-width);
}

.hdk-sidebar.collapsed .hdk-sidebar-section-title,
.hdk-sidebar.collapsed .link-text,
.hdk-sidebar.collapsed .hdk-sidebar-badge,
.hdk-sidebar.collapsed .toggle-arrow,
.hdk-sidebar.collapsed .btn-new-ticket span {
  display: none;
}

.hdk-sidebar.collapsed .hdk-sidebar-link {
  justify-content: center;
  padding: var(--hdk-space-3) 0;
  margin: 1px var(--hdk-space-2);
}

.hdk-sidebar.collapsed .hdk-sidebar-link i {
  font-size: 20px;
  margin: 0;
}

.hdk-sidebar.collapsed .hdk-sidebar-submenu {
  display: none;
}

.hdk-sidebar.collapsed .hdk-sidebar-header .btn-new-ticket {
  padding: 10px;
}

/* Sidebar backdrop (mobile) */
.hdk-sidebar-backdrop {
  display: none;
  position: fixed;
  top: var(--hdk-topbar-height);
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 1034;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.hdk-sidebar-backdrop.show {
  display: block;
  opacity: 1;
}

/* --- Protect Sidebar & Topbar from page-specific CSS bleeding ---
   Pages like relatorio use broad selectors (input[type="text"],
   table td, etc.) with !important that leak into the sidebar/topbar.
   These rules ensure consistent appearance across all pages. */
.hdk-sidebar,
.hdk-sidebar * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  box-sizing: border-box !important;
}

.hdk-sidebar .hdk-sidebar-link {
  font-size: var(--hdk-font-sm) !important;
  color: var(--hdk-sidebar-text) !important;
  border: none !important;
  box-shadow: none !important;
  height: auto !important;
  line-height: 1.5 !important;
  background: transparent !important;
  text-decoration: none !important;
}

.hdk-sidebar .hdk-sidebar-link:hover {
  background: var(--hdk-sidebar-hover) !important;
  color: var(--hdk-sidebar-text-active) !important;
  text-decoration: none !important;
}

.hdk-sidebar .hdk-sidebar-link.active {
  background: var(--hdk-sidebar-active) !important;
  color: var(--hdk-sidebar-text-active) !important;
}

.hdk-sidebar .hdk-sidebar-link i {
  font-size: 18px !important;
  color: inherit !important;
}

.hdk-sidebar .hdk-sidebar-section-title {
  font-size: 10px !important;
  color: rgba(255,255,255,0.45) !important;
}

.hdk-sidebar .hdk-sidebar-badge {
  font-size: 11px !important;
  background: var(--hdk-danger) !important;
  color: #fff !important;
}

.hdk-topbar,
.hdk-topbar * {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  box-sizing: border-box !important;
}

.hdk-topbar .hdk-topbar-search input[type="text"],
.hdk-topbar .hdk-topbar-search input {
  height: 36px !important;
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: var(--hdk-radius-full) !important;
  padding: 0 40px 0 36px !important;
  color: #e2e8f0 !important;
  font-size: var(--hdk-font-sm) !important;
  box-shadow: none !important;
}

.hdk-topbar .hdk-topbar-search input:focus {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(59,130,246,0.5) !important;
  box-shadow: none !important;
}

.hdk-topbar a {
  text-decoration: none !important;
}

/* --- Main Content Area --- */
.hdk-main {
  margin-left: var(--hdk-sidebar-width);
  margin-top: var(--hdk-topbar-height);
  padding: var(--hdk-space-6);
  min-height: calc(100vh - var(--hdk-topbar-height));
  transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.hdk-sidebar.collapsed ~ .hdk-main,
body.sidebar-collapsed .hdk-main {
  margin-left: var(--hdk-sidebar-collapsed-width);
}

/* Breadcrumb (inside main) */
.hdk-breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-2);
  font-size: var(--hdk-font-xs);
  color: var(--hdk-text-muted);
  margin-bottom: var(--hdk-space-4);
  padding: 0;
  background: none;
  border: none;
}

.hdk-breadcrumb a {
  color: var(--hdk-text-muted);
  text-decoration: none;
  transition: color var(--hdk-transition);
}

.hdk-breadcrumb a:hover {
  color: var(--hdk-accent);
}

.hdk-breadcrumb .separator {
  color: var(--hdk-border);
  font-size: 10px;
}

.hdk-breadcrumb .current {
  color: var(--hdk-text);
  font-weight: 500;
}

/* ============================================================
   COMPONENTS: Data Tables
   ============================================================ */

.hdk-data-table {
  background: var(--hdk-bg-card);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--hdk-radius-lg);
  overflow: hidden;
}

.hdk-data-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--hdk-space-3) var(--hdk-space-4);
  border-bottom: 1px solid var(--hdk-border);
  gap: var(--hdk-space-3);
  flex-wrap: wrap;
}

.hdk-data-table-toolbar .table-title {
  font-size: var(--hdk-font-base);
  font-weight: 600;
  color: var(--hdk-text);
}

.hdk-data-table-toolbar .table-actions {
  display: flex;
  align-items: center;
  gap: var(--hdk-space-2);
}

.hdk-data-table-filter {
  height: 32px;
  padding: 0 var(--hdk-space-3);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius);
  font-size: var(--hdk-font-sm);
  background: var(--hdk-bg-page);
  color: var(--hdk-text);
  min-width: 200px;
  transition: border-color var(--hdk-transition);
}

.hdk-data-table-filter:focus {
  outline: none;
  border-color: var(--hdk-accent);
}

.hdk-data-table-export {
  height: 32px;
  padding: 0 var(--hdk-space-3);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius);
  font-size: var(--hdk-font-sm);
  background: var(--hdk-bg-card);
  color: var(--hdk-text-muted);
  cursor: pointer;
  transition: all var(--hdk-transition);
  display: flex;
  align-items: center;
  gap: var(--hdk-space-1);
}

.hdk-data-table-export:hover {
  background: var(--hdk-bg-hover);
  color: var(--hdk-text);
}

.hdk-data-table table {
  width: 100%;
  border-collapse: collapse;
}

.hdk-data-table thead th {
  padding: var(--hdk-table-cell-padding);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--hdk-text-muted);
  background: transparent;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: color var(--hdk-transition);
}

.hdk-data-table thead th:hover {
  color: var(--hdk-text);
}

.hdk-data-table thead th .sort-icon {
  display: inline-block;
  margin-left: 4px;
  font-size: 10px;
  opacity: 0.4;
}

.hdk-data-table thead th.sort-asc .sort-icon,
.hdk-data-table thead th.sort-desc .sort-icon {
  opacity: 1;
  color: var(--hdk-accent);
}

.hdk-data-table tbody td {
  padding: 12px 16px;
  font-size: var(--hdk-font-sm);
  color: var(--hdk-text);
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}

.hdk-data-table tbody tr {
  transition: background-color var(--hdk-transition);
}

.hdk-data-table tbody tr:hover {
  background-color: #f8fafc;
}

.hdk-data-table tbody tr:last-child td {
  border-bottom: none;
}

.hdk-data-table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--hdk-space-3) var(--hdk-space-4);
  border-top: 1px solid var(--hdk-border);
  font-size: var(--hdk-font-xs);
  color: var(--hdk-text-muted);
}

.hdk-data-table-footer .table-info {
  white-space: nowrap;
}

/* ============================================================
   COMPONENTS: Form Groups (collapsible sections)
   ============================================================ */

.hdk-form-group {
  background: var(--hdk-bg-card);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--hdk-radius-lg);
  margin-bottom: 20px;
  overflow: hidden;
}

.hdk-form-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--hdk-card-header-padding);
  background: transparent;
  border-bottom: 1px solid #f1f5f9;
  cursor: pointer;
  user-select: none;
  transition: background var(--hdk-transition);
}

.hdk-form-group-header:hover {
  background: var(--hdk-bg-hover);
}

.hdk-form-group-header h3 {
  margin: 0;
  font-size: var(--hdk-font-base);
  font-weight: 600;
  color: var(--hdk-text);
  display: flex;
  align-items: center;
  gap: var(--hdk-space-2);
}

.hdk-form-group-header .collapse-icon {
  font-size: 12px;
  color: var(--hdk-text-muted);
  transition: transform 0.2s ease;
}

.hdk-form-group-header[aria-expanded="false"] .collapse-icon {
  transform: rotate(-90deg);
}

.hdk-form-group-body {
  padding: var(--hdk-card-padding);
}

.hdk-form-group-body.collapsed {
  display: none;
}

.hdk-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.hdk-form-label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0.04em;
  color: var(--hdk-text-muted);
  margin-bottom: var(--hdk-space-1);
}

.hdk-form-field {
  margin-bottom: 20px;
}

.hdk-form-field .campo,
.hdk-form-field .form-control,
.hdk-form-field .form-select,
.hdk-form-field input,
.hdk-form-field select,
.hdk-form-field textarea {
  height: var(--hdk-input-height);
  padding: var(--hdk-input-padding);
  border-radius: var(--hdk-input-radius);
}

.hdk-form-field textarea {
  height: auto;
  min-height: 80px;
}

/* ============================================================
   COMPONENTS: Enhanced Toast Styles
   ============================================================ */

#hdk-toast-container .toast {
  border-radius: var(--hdk-radius-lg) !important;
  box-shadow: var(--hdk-shadow-lg) !important;
  min-width: 300px;
}

#hdk-toast-container .toast .toast-body {
  font-size: var(--hdk-font-sm);
  padding: var(--hdk-space-3) var(--hdk-space-4);
}

#hdk-toast-container .toast .toast-body i {
  font-size: 18px;
}

/* --- Card hover elevation --- */
.card, .hdk-card {
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--hdk-radius-lg);
  transition: transform 0.2s cubic-bezier(0.4,0,0.2,1), box-shadow 0.2s cubic-bezier(0.4,0,0.2,1);
}

.card:hover, .hdk-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--hdk-shadow-hover);
}

/* ============================================================
   COMPONENTS: AJAX Modal styles
   ============================================================ */

.hdk-ajax-modal .modal-content {
  border: none;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
}

.hdk-ajax-modal .modal-dialog {
  max-height: calc(100vh - 40px);
}

/* Fullscreen modal adjustments */
.hdk-ajax-modal .modal-fullscreen {
  max-height: 100vh;
  margin: 0;
}
.hdk-ajax-modal .modal-fullscreen .modal-content {
  border-radius: 0;
  box-shadow: none;
  min-height: 100vh;
}
.hdk-ajax-modal .modal-fullscreen .modal-body {
  max-height: calc(100vh - 56px);
  padding: 0;
  background: #fff;
}

.hdk-ajax-modal .modal-header {
  min-height: var(--hdk-modal-header-height);
  padding: 16px 24px;
  display: flex;
  align-items: center;
  background: var(--hdk-bg-card);
  border-bottom: 1px solid var(--hdk-border);
}

.hdk-ajax-modal .modal-header .modal-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--hdk-text);
  letter-spacing: 0.01em;
}

.hdk-ajax-modal .modal-header .btn-close {
  opacity: 0.5;
}
.hdk-ajax-modal .modal-header .btn-close:hover {
  opacity: 1;
}

.hdk-ajax-modal .modal-body {
  padding: 0;
  max-height: calc(100vh - 140px);
  overflow-y: auto;
  background: var(--hdk-bg-page);
}

/* Loading spinner */
.hdk-ajax-modal .modal-body .hdk-modal-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 0;
  color: var(--hdk-text-muted);
  gap: var(--hdk-space-3);
}

.hdk-ajax-modal .modal-body .hdk-modal-loading .spinner-border {
  width: 36px;
  height: 36px;
  color: var(--hdk-primary);
}

/* ── Legacy content inside modal ─────────────── */

/* Reset body styles when inside modal */
.hdk-ajax-modal .modal-body body,
.hdk-ajax-modal .modal-body > body {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Legacy tables inside modal - make them fit */
.hdk-ajax-modal .modal-body table {
  max-width: 100% !important;
}

.hdk-ajax-modal .modal-body > table,
.hdk-ajax-modal .modal-body > form > table {
  width: 100% !important;
}

/* Clean up legacy bgcolor inside modal */
.hdk-ajax-modal .modal-body td[bgcolor="#E5E5E5"] {
  background: #fff !important;
  padding: 12px 20px !important;
}

.hdk-ajax-modal .modal-body table[bgcolor="#666666"] {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Hide redundant header row inside modal (title is already in modal-header) */
.hdk-ajax-modal .modal-body table[bgcolor="#666666"] > tbody > tr:first-child > td,
.hdk-ajax-modal .modal-body table[bgcolor="#666666"] > tr:first-child > td {
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  display: none;
}

.hdk-ajax-modal .modal-body table[bgcolor="#CCCCCC"] {
  background: #fff !important;
  border: none !important;
}

/* Form inputs inside modal */
.hdk-ajax-modal .modal-body input.campo,
.hdk-ajax-modal .modal-body select.campo,
.hdk-ajax-modal .modal-body textarea.campo,
.hdk-ajax-modal .modal-body .form-control {
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  background: #fff !important;
}

.hdk-ajax-modal .modal-body input.campo:focus,
.hdk-ajax-modal .modal-body select.campo:focus,
.hdk-ajax-modal .modal-body textarea.campo:focus,
.hdk-ajax-modal .modal-body .form-control:focus {
  border-color: var(--hdk-primary) !important;
  box-shadow: 0 0 0 3px rgba(59, 110, 181, 0.1) !important;
  outline: none !important;
}

/* Buttons inside modal */
.hdk-ajax-modal .modal-body input.btn_verde,
.hdk-ajax-modal .modal-body input[type="submit"].btn_verde {
  background: linear-gradient(135deg, var(--hdk-primary), var(--hdk-primary-dark, #162447)) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: 8px 24px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: transform 0.15s, box-shadow 0.15s !important;
}
.hdk-ajax-modal .modal-body input.btn_verde:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(59, 110, 181, 0.3) !important;
}

/* Bottom action bar in modal */
.hdk-ajax-modal .modal-body table[bgcolor="#666666"] > tbody > tr:last-child > td,
.hdk-ajax-modal .modal-body table[bgcolor="#666666"] > tr:last-child > td {
  display: table-cell !important;
  background: #f8fafc !important;
  border-top: 1px solid #e2e8f0 !important;
  padding: 16px 20px !important;
  border-radius: 0 !important;
}

/* Label cells inside modal */
.hdk-ajax-modal .modal-body .texto11,
.hdk-ajax-modal .modal-body .texto12 {
  font-size: 13px !important;
  padding: 8px 12px !important;
}

.hdk-ajax-modal .modal-body .txtLabel {
  font-size: 13px !important;
  padding: 8px 12px !important;
}

/* Section title inside modal */
.hdk-ajax-modal .modal-body td[bgcolor="#999999"] {
  background: linear-gradient(135deg, #64748b, #475569) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 8px 14px !important;
}

/* ── solicita_nova_gerada.php inside modal ───── */
.hdk-ajax-modal .modal-body #content {
  margin: 0 !important;
  border: none !important;
  padding: 32px !important;
  background: #fff;
}

.hdk-ajax-modal .modal-body .botao_fechar {
  display: none !important;
}

.hdk-ajax-modal .modal-body .logo_empresa {
  display: none !important;
}

.hdk-ajax-modal .modal-body .conteudo_num_chamado {
  font-size: 48px !important;
  color: var(--hdk-primary) !important;
  font-weight: 700 !important;
}

.hdk-ajax-modal .modal-body .conteudo_num_chamado a {
  color: var(--hdk-primary) !important;
  text-decoration: none !important;
}

.hdk-ajax-modal .modal-body .novo_chamado {
  text-align: center !important;
  margin-top: 24px !important;
}

.hdk-ajax-modal .modal-body .novo_chamado a {
  display: inline-block;
  background: linear-gradient(135deg, var(--hdk-primary), var(--hdk-primary-dark, #162447)) !important;
  color: #fff !important;
  padding: 10px 28px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  transition: transform 0.15s, box-shadow 0.15s !important;
}
.hdk-ajax-modal .modal-body .novo_chamado a:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(59, 110, 181, 0.3) !important;
}

/* ── Modal backdrop ──────────────────────────── */
.modal-backdrop.show {
  opacity: 0.4;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* ── Modal enter animation ───────────────────── */
.hdk-ajax-modal.fade .modal-dialog {
  transform: scale(0.95) translateY(20px);
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
}

.hdk-ajax-modal.show .modal-dialog {
  transform: scale(1) translateY(0);
}

/* ── Responsive: fullscreen on small screens ─── */
@media (max-width: 768px) {
  .hdk-ajax-modal .modal-dialog {
    margin: 8px;
    max-width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }
  .hdk-ajax-modal .modal-content {
    border-radius: 12px;
  }
  .hdk-ajax-modal .modal-body {
    max-height: calc(100vh - 100px);
  }
}

/* ── Scrollbar inside modal body ─────────────── */
.hdk-ajax-modal .modal-body::-webkit-scrollbar {
  width: 6px;
}
.hdk-ajax-modal .modal-body::-webkit-scrollbar-track {
  background: transparent;
}
.hdk-ajax-modal .modal-body::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}
.hdk-ajax-modal .modal-body::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ── Iframe fallback inside modal ────────────── */
.hdk-ajax-modal .modal-body iframe {
  width: 100% !important;
  min-height: 70vh;
  border: none !important;
  border-radius: 0;
}

/* --- Legacy Fixed Header (hidden when sidebar layout active) --- */
.hdk-fixed-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
}

/* Normalize body/html when sidebar layout is active — overrides
   admin-modern.css, relatorio-modern.css, admin-list.css, etc. */
html.hdk-sidebar-layout {
  margin: 0 !important;
  padding: 0 !important;
}

html.hdk-sidebar-layout body,
html body.hdk-sidebar-layout,
body.hdk-sidebar-layout {
  margin: 0 !important;
  padding: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 14px !important;
  color: var(--hdk-text) !important;
  background-color: var(--hdk-bg-page) !important;
  overflow-x: hidden;
}

body.hdk-sidebar-layout .hdk-fixed-header {
  display: none;
}

body.hdk-sidebar-layout .hdk-header-spacer {
  display: none;
}

body.hdk-sidebar-layout .breadcrumb {
  display: none;
}

/* ============================================================
   RESPONSIVE: Mobile (<992px)
   ============================================================ */

@media (max-width: 991.98px) {
  .hdk-sidebar {
    transform: translateX(-100%);
    width: var(--hdk-sidebar-width);
    box-shadow: none;
  }

  .hdk-sidebar.mobile-open {
    transform: translateX(0);
    box-shadow: 4px 0 20px rgba(0,0,0,0.3);
  }

  .hdk-sidebar.collapsed {
    width: var(--hdk-sidebar-width);
    transform: translateX(-100%);
  }

  .hdk-sidebar.collapsed.mobile-open {
    transform: translateX(0);
  }

  .hdk-main {
    margin-left: 0;
    padding: var(--hdk-space-4);
  }

  body.sidebar-collapsed .hdk-main {
    margin-left: 0;
  }

  .hdk-topbar-search {
    display: none;
  }

  /* Data table mobile: cards layout */
  .hdk-data-table table,
  .hdk-data-table thead,
  .hdk-data-table tbody,
  .hdk-data-table th,
  .hdk-data-table td,
  .hdk-data-table tr {
    display: block;
  }

  .hdk-data-table thead {
    display: none;
  }

  .hdk-data-table tbody tr {
    border: 1px solid var(--hdk-border);
    border-radius: var(--hdk-radius);
    margin-bottom: var(--hdk-space-2);
    padding: var(--hdk-space-3);
    background: var(--hdk-bg-card);
  }

  .hdk-data-table tbody td {
    border-bottom: none;
    padding: var(--hdk-space-1) 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--hdk-font-sm);
  }

  .hdk-data-table tbody td::before {
    content: attr(data-label);
    font-weight: 600;
    font-size: var(--hdk-font-xs);
    text-transform: uppercase;
    color: var(--hdk-text-muted);
    margin-right: var(--hdk-space-2);
    flex-shrink: 0;
  }

  /* Forms: single column */
  .hdk-form-grid {
    grid-template-columns: 1fr;
  }

  /* Full-width buttons on mobile */
  .hdk-form-group-body .btn {
    width: 100%;
    margin-bottom: var(--hdk-space-2);
  }
}

/* Tablet: sidebar collapsed by default */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .hdk-sidebar {
    width: var(--hdk-sidebar-collapsed-width);
  }

  .hdk-sidebar .hdk-sidebar-section-title,
  .hdk-sidebar .link-text,
  .hdk-sidebar .hdk-sidebar-badge,
  .hdk-sidebar .toggle-arrow,
  .hdk-sidebar .btn-new-ticket span {
    display: none;
  }

  .hdk-sidebar .hdk-sidebar-link {
    justify-content: center;
    padding: var(--hdk-space-3) 0;
    margin: 1px var(--hdk-space-2);
  }

  .hdk-sidebar .hdk-sidebar-link i {
    font-size: 20px;
    margin: 0;
  }

  .hdk-sidebar .hdk-sidebar-submenu {
    display: none;
  }

  .hdk-sidebar .hdk-sidebar-footer .btn-new-ticket {
    padding: 10px;
  }

  .hdk-main {
    margin-left: var(--hdk-sidebar-collapsed-width);
  }

  .hdk-sidebar:hover {
    width: var(--hdk-sidebar-width);
    box-shadow: 4px 0 20px rgba(0,0,0,0.2);
  }

  .hdk-sidebar:hover .hdk-sidebar-section-title,
  .hdk-sidebar:hover .link-text,
  .hdk-sidebar:hover .hdk-sidebar-badge,
  .hdk-sidebar:hover .toggle-arrow,
  .hdk-sidebar:hover .btn-new-ticket span {
    display: inline;
  }

  .hdk-sidebar:hover .hdk-sidebar-link {
    justify-content: flex-start;
    padding: var(--hdk-space-2) var(--hdk-space-4);
    margin: 1px 8px;
  }

  .hdk-sidebar:hover .hdk-sidebar-submenu {
    display: block;
  }

  .hdk-sidebar:hover .hdk-sidebar-footer .btn-new-ticket {
    padding: 10px var(--hdk-space-4);
  }
}

/* --- Navbar (Top Navigation) --- */
.navbar {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: 56px !important;
  background-color: var(--hdk-primary) !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  z-index: 1040;
}

.navbar .container-fluid {
  padding: 0 16px;
}

.navbar-brand {
  padding: 8px 16px 8px 0 !important;
  height: auto !important;
  display: flex;
  align-items: center;
}

.navbar-brand img {
  height: 36px;
  width: auto;
  filter: brightness(0) invert(1);
}

/* Nav links */
.navbar .nav > li > a,
.navbar .navbar-nav > li > a {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 16px 14px !important;
  transition: all var(--hdk-transition) !important;
  border-radius: 0 !important;
  letter-spacing: 0.01em;
}

.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus,
.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
}

.navbar .nav > li.open > a,
.navbar .nav > li.active > a {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Dropdown menus */
.navbar .dropdown-menu {
  background-color: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius-lg) !important;
  box-shadow: var(--hdk-shadow-lg) !important;
  padding: 8px 0 !important;
  margin-top: 0 !important;
  min-width: 220px;
  animation: hdk-dropdown-in 0.15s ease-out;
}

@keyframes hdk-dropdown-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.navbar .dropdown-menu > li > a,
.dropdown-menu > li > a {
  color: var(--hdk-text) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  padding: 8px 16px !important;
  transition: all var(--hdk-transition);
}

.navbar .dropdown-menu > li > a:hover,
.dropdown-menu > li > a:hover {
  background-color: var(--hdk-bg-hover) !important;
  color: var(--hdk-accent) !important;
}

.navbar .nav li li a {
  color: var(--hdk-text) !important;
}

/* Dropdown chevron icon */
.navbar .fa-chevron-down {
  font-size: 9px !important;
  opacity: 0.7;
  margin-left: 2px;
}

/* Navbar right section (logo, user, logout) */
.navbar .navbar-right,
.navbar .nav.navbar-nav.navbar-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.navbar .navbar-right a.navbar-link {
  opacity: 0.9;
}

.navbar .navbar-right a.navbar-link:hover {
  opacity: 1;
}

.navbar .navbar-right .btn-danger {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
  border-radius: var(--hdk-radius) !important;
  padding: 8px 16px !important;
  transition: all var(--hdk-transition);
  font-size: 16px;
}

.navbar .navbar-right .btn-danger:hover {
  background-color: var(--hdk-danger) !important;
  border-color: var(--hdk-danger) !important;
}

/* --- Toolbar (nav-pills quick action bar) --- */
.nav.nav-pills {
  padding: 6px 12px !important;
  background-color: var(--hdk-bg-card) !important;
  border-bottom: 1px solid var(--hdk-border);
  box-shadow: var(--hdk-shadow);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  width: 100%;
  list-style: none;
  margin: 0;
}

.nav.nav-pills > li > a {
  font-size: 22px !important;
  padding: 10px 14px !important;
  color: var(--hdk-text-muted) !important;
  border: none !important;
  border-radius: var(--hdk-radius) !important;
  opacity: 1 !important;
  transition: all var(--hdk-transition) !important;
  line-height: 1;
}

.nav.nav-pills > li > a:hover {
  color: var(--hdk-accent) !important;
  background-color: var(--hdk-bg-hover) !important;
  border-color: transparent !important;
}

.nav.nav-pills > li > a.inline {
  font-size: 13px !important;
  color: var(--hdk-accent) !important;
  text-decoration: none !important;
  background: none !important;
  padding: 0 !important;
}

.nav.nav-pills > li > a.inline:hover {
  color: var(--hdk-accent-dark) !important;
  text-decoration: underline !important;
}

.nav.nav-pills > li.pull-right,
.nav.nav-pills > li.float-end {
  margin-left: auto;
  display: flex;
  align-items: center;
  font-size: 13px;
  color: var(--hdk-text);
  gap: 4px;
}

.nav.nav-pills > li.pull-right ~ li.pull-right,
.nav.nav-pills > li.float-end ~ li.float-end {
  margin-left: 16px;
}

.nav.nav-pills > li.pull-right > a,
.nav.nav-pills > li.float-end > a {
  font-size: 13px !important;
  color: var(--hdk-accent) !important;
  padding: 0 !important;
  background: none !important;
  line-height: inherit !important;
}

.nav.nav-pills > li.pull-right > a:hover,
.nav.nav-pills > li.float-end > a:hover {
  color: var(--hdk-accent-dark) !important;
  text-decoration: underline !important;
  background: none !important;
}

.nav.nav-pills .badge {
  background-color: var(--hdk-danger) !important;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: var(--hdk-radius-full);
  margin-left: 6px;
}

/* --- Breadcrumb --- */
.breadcrumb {
  background-color: transparent !important;
  border-bottom: 1px solid var(--hdk-border);
  border-radius: 0 !important;
  padding: 10px 16px !important;
  margin-bottom: 0 !important;
  font-size: 12px;
  color: var(--hdk-text-muted);
}

.breadcrumb a,
.breadcrumb .linkMenu {
  color: var(--hdk-text-muted) !important;
  font-size: 12px !important;
  text-decoration: none;
}

.breadcrumb a:hover,
.breadcrumb .linkMenu:hover {
  color: var(--hdk-accent) !important;
}

/* --- Page Content Area --- */
.hdk-right {
  padding: 20px;
}

/* --- Data Tables --- */
table {
  border-collapse: collapse !important;
}

td {
  box-sizing: border-box !important;
}

/* Table header row */
.rowTitulo,
.rowTitulo td {
  background-color: transparent !important;
  color: var(--hdk-text-muted) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  padding: 10px 12px !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-bottom: 1px solid #e2e8f0 !important;
}

.rowTitulo a,
.rowTitulo .linkColuna {
  color: var(--hdk-text-muted) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 12px !important;
}

.rowTitulo a:hover,
.rowTitulo .linkColuna:hover {
  color: var(--hdk-text) !important;
}

/* Table data rows */
.row1,
.row1 td {
  background-color: var(--hdk-bg-card) !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
  transition: background-color 0.15s;
}

.row2,
.row2 td {
  background-color: var(--hdk-bg-card) !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
  transition: background-color 0.15s;
}

.row1:hover td,
.row2:hover td,
tr.row1:hover td,
tr.row2:hover td {
  background-color: #f8fafc !important;
}

/* Column links in tables */
.linkColuna {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-accent) !important;
  text-decoration: none !important;
  font-weight: 500;
}

.linkColuna:hover {
  color: var(--hdk-accent-dark) !important;
  text-decoration: underline !important;
}

/* Table cell */
.col {
  padding: 10px 12px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
}

/* Special row highlights — removed cell-background tints, ownership shown via badge + left border */
.colGrupo {}
.colMinha {}

/* Table container wrapper (for tables inside pages) */
table[width="100%"],
table.table {
  border-radius: var(--hdk-radius-lg);
  overflow: hidden;
  box-shadow: var(--hdk-shadow-sm);
}

/* --- Form Elements --- */
.campo,
.campo12 {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: 8px !important;
  background-color: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  transition: border-color var(--hdk-transition), box-shadow var(--hdk-transition);
  outline: none;
  height: auto !important;
  width: 100%;
  box-sizing: border-box;
}

.campo:focus,
.campo12:focus {
  border-color: var(--hdk-accent) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

.campoAlerta {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  padding: 8px 12px !important;
  border: 1px solid var(--hdk-danger) !important;
  border-radius: var(--hdk-radius) !important;
  background-color: var(--hdk-danger-bg) !important;
  color: var(--hdk-danger) !important;
  height: auto !important;
}

.campoff {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  padding: 8px 12px !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  background-color: var(--hdk-bg-hover) !important;
  color: var(--hdk-text-muted) !important;
  height: auto !important;
}

select.campo,
select.campo12 {
  appearance: auto;
  padding-right: 28px !important;
}

textarea.campo,
textarea.campo12 {
  min-height: 80px;
  resize: vertical;
}

/* Form labels */
.txtLabel {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--hdk-text-muted) !important;
  text-transform: none;
  letter-spacing: 0.03em;
  padding: 8px 12px !important;
}

/* --- Buttons --- */
.btn_verde,
input[type="button"],
input[type="submit"] {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 10px 20px !important;
  border: 1px solid var(--hdk-accent) !important;
  border-radius: 8px !important;
  background: var(--hdk-accent) !important;
  color: #ffffff !important;
  cursor: pointer;
  transition: all var(--hdk-transition);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-image: none !important;
  min-height: 40px;
}

.btn_verde:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  background: var(--hdk-accent-dark) !important;
  border-color: var(--hdk-accent-dark) !important;
  box-shadow: none;
}

.btn-primary {
  background-color: var(--hdk-accent) !important;
  border-color: var(--hdk-accent) !important;
  border-radius: 8px !important;
  font-weight: 500;
}

.btn-primary:hover {
  background-color: var(--hdk-accent-dark) !important;
  border-color: var(--hdk-accent-dark) !important;
}

.btn-danger {
  background-color: var(--hdk-danger) !important;
  border-color: var(--hdk-danger) !important;
  border-radius: 8px !important;
}

.btn-success {
  background-color: var(--hdk-success) !important;
  border-color: var(--hdk-success) !important;
  border-radius: 8px !important;
}

.btn-warning {
  background-color: var(--hdk-warning) !important;
  border-color: var(--hdk-warning) !important;
  border-radius: 8px !important;
  color: #fff !important;
}

.btn {
  border-radius: 8px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: all var(--hdk-transition) !important;
  min-height: 40px;
}

/* --- Status Badges / Pills --- */
.hdk-badge, .badge {
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  display: inline-flex;
  align-items: center;
  line-height: 1.4;
}

.badge-success, .hdk-badge-success { background: #ecfdf5 !important; color: #065f46 !important; }
.badge-warning, .hdk-badge-warning { background: #fffbeb !important; color: #92400e !important; }
.badge-danger, .hdk-badge-danger { background: #fef2f2 !important; color: #991b1b !important; }
.badge-info, .hdk-badge-info { background: #eff6ff !important; color: #1e40af !important; }
.badge-purple, .hdk-badge-purple { background: #f5f3ff !important; color: #6b21a8 !important; }

/* --- Text Classes (Legacy Override) --- */
.texto,
.texto11,
.texto12 {
  font-family: 'Inter', sans-serif !important;
  color: var(--hdk-text) !important;
}

.texto {
  font-size: 13px !important;
}

.texto11 {
  font-size: 13px !important;
}

.texto12 {
  font-size: 13px !important;
}

/* --- Link Styles (Legacy Override) --- */
.linkMenu {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
  text-decoration: none !important;
  transition: color var(--hdk-transition);
}

.linkMenu:hover {
  color: var(--hdk-accent) !important;
}

.linkMenu1 {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
  text-decoration: none !important;
}

.linkSimples {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-accent) !important;
  text-decoration: none !important;
}

.linkSimples:hover {
  color: var(--hdk-accent-dark) !important;
}

.linkActive {
  background-color: var(--hdk-accent) !important;
  color: #ffffff !important;
  padding: 4px 12px !important;
  border-radius: var(--hdk-radius) !important;
  font-size: 12px !important;
  font-weight: 500;
}

.linkVencidas {
  color: var(--hdk-danger) !important;
  font-weight: 600 !important;
}

.linkVencerDia {
  color: var(--hdk-warning) !important;
  font-weight: 600 !important;
}

/* --- Menu Styles --- */
.linkPai,
.linkFilho,
.linkSubMenu {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
}

.linkColuna {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-accent) !important;
  text-decoration: underline !important;
}

.linkColuna:hover {
  color: var(--hdk-accent-dark) !important;
}

.linkSolicita {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
}

.txtLabel {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--hdk-text) !important;
}

.linkMenuApont {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 8px 12px !important;
  background-color: var(--hdk-primary) !important;
  color: #ffffff !important;
  border-radius: var(--hdk-radius) var(--hdk-radius) 0 0 !important;
}

/* --- Legacy Content Modernization (inside .hdk-main) ---
   Automatically upgrades old table-based pages to look modern
   without modifying each PHP file individually. */

/* Admin sub-nav links */
.linkMenuAdmin {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--hdk-accent) !important;
  text-decoration: none !important;
  padding: 6px 12px !important;
  border-radius: var(--hdk-radius) !important;
  transition: all var(--hdk-transition);
  display: inline-block;
}

.linkMenuAdmin:hover {
  color: var(--hdk-accent-dark) !important;
  background: var(--hdk-bg-hover) !important;
}

/* Legacy header bars — turn gray bars into clean section headers */
.hdk-main td[bgcolor="#E5E5E5"],
.hdk-main td[bgcolor="#e5e5e5"] {
  background: var(--hdk-bg-card) !important;
  border-bottom: 1px solid var(--hdk-border) !important;
  padding: 10px 16px !important;
}

/* Legacy separator bars — turn dark bars into subtle dividers */
.hdk-main td[bgcolor="#666666"],
.hdk-main td[bgcolor="#999999"] {
  background: var(--hdk-border) !important;
  height: 1px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  padding: 0 !important;
}

.hdk-main td[bgcolor="#666666"] img[src*="spacer"],
.hdk-main td[bgcolor="#999999"] img[src*="spacer"] {
  display: none !important;
}

/* Legacy data grid tables — clean up row backgrounds */
.hdk-main table[bgcolor="#CCCCCC"],
.hdk-main table[bgcolor="#cccccc"] {
  background: transparent !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  overflow: hidden;
}

.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr[bgcolor="#FFFFFF"],
.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr[bgcolor="#ffffff"],
.hdk-main table[bgcolor="#cccccc"] > tbody > tr[bgcolor="#FFFFFF"],
.hdk-main table[bgcolor="#cccccc"] > tbody > tr[bgcolor="#ffffff"] {
  background: var(--hdk-bg-card) !important;
  transition: background var(--hdk-transition);
}

.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr[bgcolor="#FFFFFF"]:hover,
.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr[bgcolor="#ffffff"]:hover,
.hdk-main table[bgcolor="#cccccc"] > tbody > tr[bgcolor="#FFFFFF"]:hover,
.hdk-main table[bgcolor="#cccccc"] > tbody > tr[bgcolor="#ffffff"]:hover {
  background: var(--hdk-bg-hover) !important;
}

/* Legacy grid header rows */
.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr:first-child[bgcolor="#CCCCCC"],
.hdk-main table[bgcolor="#CCCCCC"] > tbody > tr:first-child[bgcolor="#cccccc"],
.hdk-main table[bgcolor="#cccccc"] > tbody > tr:first-child[bgcolor="#CCCCCC"],
.hdk-main table[bgcolor="#cccccc"] > tbody > tr:first-child[bgcolor="#cccccc"],
.hdk-main tr[bgcolor="#CCCCCC"],
.hdk-main tr[bgcolor="#cccccc"] {
  background: var(--hdk-bg-hover) !important;
}

.hdk-main tr[bgcolor="#CCCCCC"] td,
.hdk-main tr[bgcolor="#cccccc"] td {
  font-weight: 600 !important;
  color: var(--hdk-text) !important;
  padding: 10px 8px !important;
  border-bottom: 2px solid var(--hdk-border) !important;
  font-size: 13px !important;
}

/* Legacy alternating row colors */
.hdk-main tr[bgcolor="#FFFFEE"],
.hdk-main tr[bgcolor="#ffffee"],
.hdk-main tr[bgcolor="#f5f5f5"],
.hdk-main tr[bgcolor="#F5F5F5"] {
  background: var(--hdk-bg) !important;
}

/* Legacy table cells — consistent padding and borders */
.hdk-main table[bgcolor="#CCCCCC"] td,
.hdk-main table[bgcolor="#cccccc"] td {
  padding: 8px !important;
  border-bottom: 1px solid var(--hdk-border) !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}

/* Hide spacer.gif images — they add unwanted gaps */
.hdk-main img[src*="spacer.gif"] {
  display: none !important;
}

/* Legacy body bgcolor cleanup */
.hdk-main td[bgcolor="#FFFFFF"],
.hdk-main td[bgcolor="#ffffff"] {
  background: var(--hdk-bg-card) !important;
}

/* --- Info/Status Box --- */
.informacoes {
  background-color: var(--hdk-accent) !important;
  color: #ffffff;
  padding: 10px 16px;
  border-radius: var(--hdk-radius);
  font-size: 13px;
  font-weight: 500;
}

/* --- Tab Navigation --- */
.nav-tabs {
  border-bottom: 2px solid var(--hdk-border) !important;
  margin-bottom: 0 !important;
}

.nav-tabs > li > a,
.nav-tabs > .nav-item > .nav-link {
  color: var(--hdk-text-muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 10px 20px !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  margin-bottom: -2px;
  transition: all var(--hdk-transition);
}

.nav-tabs > li > a:hover,
.nav-tabs > .nav-item > .nav-link:hover {
  color: var(--hdk-accent) !important;
  background-color: transparent !important;
  border-bottom-color: var(--hdk-accent) !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover,
.nav-tabs > .nav-item > .nav-link.active {
  color: var(--hdk-accent) !important;
  background-color: transparent !important;
  border-bottom: 2px solid var(--hdk-accent) !important;
  font-weight: 600 !important;
}

/* --- Cards --- */
.hdk-card {
  background: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  box-shadow: var(--hdk-shadow-sm);
  padding: 20px;
  margin-bottom: 16px;
}

.hdk-card-header {
  font-size: 16px;
  font-weight: 600;
  color: var(--hdk-text);
  padding-bottom: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--hdk-border);
}

/* --- Status Badges --- */
.hdk-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: var(--hdk-radius-full);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.hdk-badge-success {
  background-color: var(--hdk-success-bg);
  color: var(--hdk-success);
}

.hdk-badge-warning {
  background-color: var(--hdk-warning-bg);
  color: var(--hdk-warning);
}

.hdk-badge-danger {
  background-color: var(--hdk-danger-bg);
  color: var(--hdk-danger);
}

.hdk-badge-info {
  background-color: var(--hdk-info-bg);
  color: var(--hdk-info);
}

/* --- Metric Cards (Dashboard) --- */
.hdk-metric {
  background: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  box-shadow: var(--hdk-shadow-sm);
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: box-shadow var(--hdk-transition);
}

.hdk-metric:hover {
  box-shadow: var(--hdk-shadow-md);
}

.hdk-metric-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--hdk-radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  flex-shrink: 0;
}

.hdk-metric-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--hdk-text);
  line-height: 1.1;
}

.hdk-metric-label {
  font-size: 12px;
  color: var(--hdk-text-muted);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* --- Dashboard Grid --- */
.hdk-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--hdk-space-4);
  margin-bottom: var(--hdk-space-6);
}

.hdk-dashboard-chart {
  background: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  padding: var(--hdk-card-padding);
  min-height: 300px;
}

.hdk-dashboard-chart-title {
  font-size: var(--hdk-font-base);
  font-weight: 600;
  color: var(--hdk-text);
  margin-bottom: var(--hdk-space-4);
}

/* --- Pagination --- */
.pagination {
  display: flex;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 16px 0;
}

.pagination a,
.pagination span,
.pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius);
  font-size: 13px;
  font-weight: 500;
  color: var(--hdk-text);
  text-decoration: none;
  transition: all var(--hdk-transition);
  background: var(--hdk-bg-card);
}

.pagination a:hover,
.pagination .page-link:hover {
  background-color: var(--hdk-bg-hover);
  color: var(--hdk-accent);
  border-color: var(--hdk-accent);
}

.pagination .active a,
.pagination .active .page-link,
.pagination .current {
  background-color: var(--hdk-accent) !important;
  color: #fff !important;
  border-color: var(--hdk-accent) !important;
}

/* --- Login Page --- */
.form-login {
  background: var(--hdk-bg-card) !important;
  border-radius: var(--hdk-radius-xl) !important;
  box-shadow: var(--hdk-shadow-lg) !important;
  padding: 40px !important;
  max-width: 420px;
  width: 100%;
  border: 1px solid var(--hdk-border);
}

.label-form-input {
  background-color: var(--hdk-bg-page) !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  padding: 10px 16px !important;
  box-shadow: none !important;
  transition: border-color var(--hdk-transition), box-shadow var(--hdk-transition);
}

.label-form-input:focus-within {
  border-color: var(--hdk-accent) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

.label-form-input .fa {
  color: var(--hdk-text-light) !important;
  font-size: 14px;
}

.form-input {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  color: var(--hdk-text) !important;
}

.form-input::placeholder {
  color: var(--hdk-text-light);
}

.btn-login {
  border-radius: var(--hdk-radius) !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
  font-size: 14px !important;
  width: 100% !important;
  transition: all var(--hdk-transition);
}

.btn-login.btn-primary {
  background-color: var(--hdk-primary) !important;
  border-color: var(--hdk-primary) !important;
}

.btn-login.btn-primary:hover {
  background-color: var(--hdk-primary-light) !important;
  border-color: var(--hdk-primary-light) !important;
}

.btn-login.btn-secondary {
  background-color: transparent !important;
  border: 1px solid var(--hdk-border) !important;
  color: var(--hdk-text) !important;
}

.btn-login.btn-secondary:hover {
  background-color: var(--hdk-bg-hover) !important;
  border-color: var(--hdk-text-light) !important;
}

.img-entrada {
  width: 200px !important;
  margin-bottom: 8px;
}

.form-check-label-entrar {
  font-size: 13px !important;
  color: var(--hdk-text-muted);
}

.versao {
  font-size: 11px !important;
  color: var(--hdk-text-light) !important;
}

/* Login body background */
body.login-page {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 50%, #1e3a5f 100%) !important;
}

body.login-page .img-entrada {
  max-width: 200px;
  margin-bottom: var(--hdk-space-6);
}

body.login-page .btn-login {
  background: var(--hdk-primary) !important;
  border-color: var(--hdk-primary) !important;
  border-radius: var(--hdk-radius) !important;
  font-weight: 500;
  padding: 10px 24px !important;
  transition: all var(--hdk-transition);
}

body.login-page .btn-login:hover {
  background: var(--hdk-primary-dark) !important;
  border-color: var(--hdk-primary-dark) !important;
}

/* --- Modals --- */
.modal-content {
  border-radius: var(--hdk-radius-lg) !important;
  border: 1px solid var(--hdk-border) !important;
  box-shadow: var(--hdk-shadow-lg) !important;
}

.modal-header {
  border-bottom: 1px solid var(--hdk-border) !important;
  padding: 16px 20px !important;
}

.modal-body {
  padding: 20px !important;
}

.modal-footer {
  border-top: 1px solid var(--hdk-border) !important;
  padding: 12px 20px !important;
}

/* --- Scrollbar (Webkit) --- */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--hdk-bg-page);
}

::-webkit-scrollbar-thumb {
  background: var(--hdk-text-light);
  border-radius: var(--hdk-radius-full);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--hdk-text-muted);
}

/* --- Utility Classes --- */
.hdk-mt-0 { margin-top: 0 !important; }
.hdk-mt-1 { margin-top: 8px !important; }
.hdk-mt-2 { margin-top: 16px !important; }
.hdk-mb-0 { margin-bottom: 0 !important; }
.hdk-mb-1 { margin-bottom: 8px !important; }
.hdk-mb-2 { margin-bottom: 16px !important; }
.hdk-p-2 { padding: 16px !important; }
.hdk-p-3 { padding: 24px !important; }

/* --- Sidebar (preserved from style-new.css but modernized) --- */
.hdk-left {
  background-color: var(--hdk-bg-card) !important;
  border-right: 1px solid var(--hdk-border);
}

.hdk-left .hkd-left_link {
  color: var(--hdk-text-muted) !important;
  font-size: 14px;
  padding: 10px 16px;
  transition: all var(--hdk-transition);
}

.hdk-left .hkd-left_link:hover {
  background-color: var(--hdk-bg-hover) !important;
  color: var(--hdk-accent) !important;
}

/* --- Chosen Select Override --- */
.chosen-container .chosen-single {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  height: 36px !important;
  line-height: 36px !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  background: var(--hdk-bg-card) !important;
  box-shadow: none !important;
  color: var(--hdk-text) !important;
}

.chosen-container .chosen-drop {
  border: 1px solid var(--hdk-border) !important;
  border-radius: 0 0 var(--hdk-radius) var(--hdk-radius) !important;
  box-shadow: var(--hdk-shadow-md) !important;
}

.chosen-container .chosen-results li.highlighted {
  background-color: var(--hdk-accent) !important;
  background-image: none !important;
}

/* --- Background table header override --- */
td[bgcolor],
tr[bgcolor],
table[bgcolor] {
  border-radius: var(--hdk-radius) !important;
}

/* Section headers that use bgcolor with PHP vars */
.linkMenuApont {
  border-radius: var(--hdk-radius) var(--hdk-radius) 0 0 !important;
}

/* --- Print Styles --- */
@media print {
  .navbar, .nav.nav-pills, .breadcrumb {
    display: none !important;
  }
  body {
    background: #fff !important;
    font-size: 12px !important;
  }
  .row1 td, .row2 td {
    padding: 4px 8px !important;
  }
}

/* --- Responsive Adjustments --- */
@media (max-width: 768px) {
  .navbar .nav > li > a,
  .navbar .navbar-nav > li > a {
    padding: 10px 12px !important;
    font-size: 12px !important;
  }

  .nav.nav-pills {
    padding: 4px 8px !important;
  }

  .nav.nav-pills > li > a {
    font-size: 16px !important;
    padding: 4px 6px !important;
  }

  .form-login {
    padding: 24px !important;
    margin: 16px;
  }

  .col {
    padding: 6px 8px !important;
    font-size: 12px !important;
  }

  .rowTitulo td {
    padding: 8px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 576px) {
  .navbar-brand img {
    height: 28px;
  }
}

/* --- Header Spacer (pushes content below fixed header) --- */
.hdk-header-spacer {
  height: 140px; /* navbar 56px + pills ~40px + breadcrumb ~36px + 8px buffer */
}

/* --- Navbar Flexbox (replaces removed BS3 float rules) --- */
.navbar-nav {
  display: flex !important;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}

/* Dropdown z-index fix */
.navbar .dropdown-menu {
  z-index: 1050;
  position: absolute;
}

/* --- Nav-pills focus & active states --- */
.nav.nav-pills > li > a:focus {
  outline: 2px solid var(--hdk-accent);
  outline-offset: -2px;
}

.nav.nav-pills > li.active > a,
.nav.nav-pills > li > a.active {
  color: var(--hdk-accent) !important;
  background-color: rgba(59, 130, 246, 0.1) !important;
}

/* --- BS3 Legacy Class Aliases --- */
.btn-default {
  background-color: var(--hdk-bg-card) !important;
  border: 1px solid var(--hdk-border) !important;
  color: var(--hdk-text) !important;
  border-radius: var(--hdk-radius) !important;
  font-weight: 500;
}

.btn-default:hover {
  background-color: var(--hdk-bg-hover) !important;
  border-color: var(--hdk-text-muted) !important;
}

.btn-xs {
  padding: 2px 8px !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  border-radius: var(--hdk-radius) !important;
}

.btn-sm {
  padding: 4px 10px !important;
  font-size: 12px !important;
  border-radius: var(--hdk-radius) !important;
}

/* pull-right BS3 compatibility */
.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

/* --- Body margin override (legacy reset) --- */
body {
  margin: 0 !important;
}

/* --- Breadcrumb improvements --- */
.breadcrumb > li + li::before,
.breadcrumb-item + .breadcrumb-item::before {
  content: "›" !important;
  color: var(--hdk-text-muted);
  padding: 0 6px;
}

.breadcrumb > .active,
.breadcrumb-item.active {
  color: var(--hdk-text) !important;
  font-weight: 500;
}

/* --- Legacy .campo form fields modernization --- */
.campo,
.campoAlerta,
.campoff,
.campo12,
.campo_apont {
  height: auto !important;
  min-height: 32px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  padding: 4px 8px !important;
  transition: border-color var(--hdk-transition), box-shadow var(--hdk-transition);
  box-sizing: border-box;
}

.campo:focus,
.campoAlerta:focus,
.campoff:focus,
.campo12:focus,
.campo_apont:focus {
  border-color: var(--hdk-accent) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
  outline: none !important;
}

.campoAlerta {
  border-color: var(--hdk-danger) !important;
  color: var(--hdk-danger) !important;
}

/* --- Legacy table row/column classes --- */
.rowTitulo {
  background-color: var(--hdk-bg-hover) !important;
}

.rowTitulo td,
.rowTitulo .col {
  font-weight: 600 !important;
  color: var(--hdk-text) !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 10px 12px !important;
  border-bottom: 2px solid var(--hdk-border) !important;
}

.row1 {
  background-color: var(--hdk-bg-card) !important;
}

.row2 {
  background-color: var(--hdk-bg-body) !important;
}

.row1 td,
.row2 td,
.row1 .col,
.row2 .col {
  padding: 8px 12px !important;
  font-size: 13px !important;
  border-bottom: 1px solid var(--hdk-border) !important;
  vertical-align: middle !important;
}

.row1:hover,
.row2:hover {
  background-color: rgba(59, 130, 246, 0.04) !important;
}

/* Protect legacy .col from BS5 grid conflicts (scoped to table context) */
table .col {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  padding: 8px 12px !important;
  width: auto !important;
  flex: none !important;
  max-width: none !important;
}

/* --- Table HTML attribute overrides (bgcolor, cellspacing) --- */
table[bgcolor],
table[cellspacing],
table[cellpadding] {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  width: 100% !important;
}

/* BS3 table-condensed alias */
.table-condensed > thead > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > th,
.table-condensed > tfoot > tr > td {
  padding: 4px 8px !important;
}

/* --- linkMenu pagination modernization --- */
a.linkMenu {
  padding: 4px 10px;
  border-radius: var(--hdk-radius);
}

a.linkMenu:hover {
  background-color: var(--hdk-bg-hover) !important;
  color: var(--hdk-accent) !important;
}

/* --- Animation (preserved) --- */
.fadeIn {
  animation: fadeIn 0.4s ease-out;
}

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

/* ============================================================
   PHASE 3 — UI/UX MODERNIZATION
   Panel shim, Status pills, Dashboard KPI cards,
   Skeleton loader, Chart containers, Toast
   ============================================================ */

/* ─── Bootstrap 3 Panel → Card shim ──────────────────────────────────────── */

.panel {
  background: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  box-shadow: var(--hdk-shadow-sm);
  margin-bottom: 20px;
  overflow: hidden;
  transition: box-shadow var(--hdk-transition);
}

.panel:hover {
  box-shadow: var(--hdk-shadow-md);
}

.panel-heading {
  padding: 12px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  display: flex;
  align-items: center;
  gap: 8px;
}

.panel-title {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
  line-height: 1.4;
}

.panel-body {
  padding: 20px;
}

.panel-footer {
  padding: 10px 20px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  font-size: 13px;
  background: var(--hdk-bg-subtle);
}

/* Colored panel variants */
.panel-primary .panel-heading { background: var(--hdk-accent);   color: #fff; border-bottom-color: rgba(255,255,255,0.15); }
.panel-success  .panel-heading { background: var(--hdk-success);  color: #fff; border-bottom-color: rgba(255,255,255,0.15); }
.panel-warning  .panel-heading { background: var(--hdk-warning);  color: #fff; border-bottom-color: rgba(255,255,255,0.15); }
.panel-info     .panel-heading { background: var(--hdk-info);     color: #fff; border-bottom-color: rgba(255,255,255,0.15); }
.panel-danger   .panel-heading { background: var(--hdk-danger);   color: #fff; border-bottom-color: rgba(255,255,255,0.15); }

.panel-primary .panel-title,
.panel-success  .panel-title,
.panel-warning  .panel-title,
.panel-info     .panel-title,
.panel-danger   .panel-title { color: #fff; }

.panel-primary .panel-footer { background: var(--hdk-accent);   color: rgba(255,255,255,0.9); border-top-color: rgba(255,255,255,0.15); }
.panel-success  .panel-footer { background: var(--hdk-success);  color: rgba(255,255,255,0.9); border-top-color: rgba(255,255,255,0.15); }
.panel-warning  .panel-footer { background: var(--hdk-warning);  color: rgba(255,255,255,0.9); border-top-color: rgba(255,255,255,0.15); }
.panel-info     .panel-footer { background: var(--hdk-info);     color: rgba(255,255,255,0.9); border-top-color: rgba(255,255,255,0.15); }
.panel-danger   .panel-footer { background: var(--hdk-danger);   color: rgba(255,255,255,0.9); border-top-color: rgba(255,255,255,0.15); }

/* ─── Dashboard KPI announcement cards ───────────────────────────────────── */

.announcement-heading {
  font-size: 2.75rem;
  font-weight: 700;
  margin: 0;
  line-height: 1;
  color: #fff;
}

.announcement-text {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.75);
  margin: 0;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.announcement-bottom {
  display: block;
  text-decoration: none !important;
  color: rgba(255, 255, 255, 0.9) !important;
  transition: background var(--hdk-transition);
}

.announcement-bottom:hover {
  background: rgba(0, 0, 0, 0.12) !important;
  color: #fff !important;
}

/* ─── Ticket status pills ─────────────────────────────────────────────────── */

.hdk-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: var(--hdk-radius-full);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.hdk-status::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.7;
}

.hdk-status-nova     { background: #eff6ff; color: #2563eb; }
.hdk-status-andamento{ background: #ecfdf5; color: #059669; }
.hdk-status-espera   { background: #fffbeb; color: #d97706; }
.hdk-status-encerrada{ background: #f1f5f9; color: #475569; }
.hdk-status-rejeitada{ background: #fef2f2; color: #dc2626; }
.hdk-status-aprovacao{ background: #faf5ff; color: #7c3aed; }

/* Table cell status — legacy bg color class overrides */
td.danger  { background: var(--hdk-danger-bg)  !important; color: var(--hdk-danger)  !important; font-weight: 600; }
td.success { background: var(--hdk-success-bg) !important; color: var(--hdk-success) !important; font-weight: 600; }
td.warning { background: var(--hdk-warning-bg) !important; color: var(--hdk-warning) !important; font-weight: 600; }
td.active  { background: var(--hdk-info-bg)    !important; color: var(--hdk-info)    !important; font-weight: 600; }

/* ─── Chart containers ────────────────────────────────────────────────────── */

.flot-chart-content,
[id^="grafico"],
[id^="gaugeContainer"] {
  min-height: 220px;
  position: relative;
}

canvas {
  max-width: 100%;
}

/* ─── Skeleton loading state ─────────────────────────────────────────────── */

@keyframes hdk-shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}

.hdk-skeleton {
  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
  background-size: 400px 100%;
  animation: hdk-shimmer 1.4s infinite linear;
  border-radius: var(--hdk-radius);
}

.hdk-skeleton-text  { height: 14px; margin: 8px 0; }
.hdk-skeleton-title { height: 20px; width: 60%; margin: 12px 0; }
.hdk-skeleton-block { height: 80px; }

/* ─── Form section card ───────────────────────────────────────────────────── */

.hdk-form-section {
  background: var(--hdk-bg-card);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  padding: 20px 24px;
  margin-bottom: 16px;
}

.hdk-form-section-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--hdk-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--hdk-border);
}

/* ─── Alert improvements ──────────────────────────────────────────────────── */

.alert {
  border-radius: var(--hdk-radius-lg) !important;
  border: none !important;
  font-size: 13px !important;
  font-family: 'Inter', sans-serif !important;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px !important;
}

.alert-success { background: var(--hdk-success-bg) !important; color: #065f46 !important; }
.alert-danger  { background: var(--hdk-danger-bg)  !important; color: #991b1b !important; }
.alert-warning { background: var(--hdk-warning-bg) !important; color: #92400e !important; }
.alert-info    { background: var(--hdk-info-bg)    !important; color: #1e40af !important; }

/* ─── Input group modernization ──────────────────────────────────────────── */

.input-group-addon,
.input-group-text {
  background: var(--hdk-bg-hover) !important;
  border: 1px solid var(--hdk-border) !important;
  border-radius: var(--hdk-radius) !important;
  color: var(--hdk-text-muted) !important;
  font-size: 13px !important;
  padding: 6px 12px !important;
}

.input-group .campo,
.input-group .form-control {
  border-radius: 0 !important;
}

.input-group .campo:first-child,
.input-group .form-control:first-child {
  border-radius: var(--hdk-radius) 0 0 var(--hdk-radius) !important;
}

.input-group .campo:last-child,
.input-group .form-control:last-child {
  border-radius: 0 var(--hdk-radius) var(--hdk-radius) 0 !important;
}

/* ─── Page section header (replaces inline bgcolor= headers) ─────────────── */

.hdk-section-header {
  background: var(--hdk-primary) !important;
  color: #fff !important;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 600;
  border-radius: var(--hdk-radius) var(--hdk-radius) 0 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Inline bgColor overrides from PHP for section headers */
td[bgcolor="#991b1b"],
td[bgcolor="#991B1B"],
td[bgcolor="#1e3a5f"],
td[bgcolor="#1E3A5F"],
td[bgcolor="#224472"],
td[bgcolor="#003366"],
td[bgcolor="#336699"] {
  background-color: var(--hdk-primary) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 10px 12px !important;
  border-radius: 0 !important;
}

/* ─── Dropdown menu improvements ─────────────────────────────────────────── */

.dropdown-divider {
  border-color: var(--hdk-border) !important;
  margin: 4px 0 !important;
}

.dropdown-header {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--hdk-text-muted) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 6px 16px !important;
}

/* ─── Badge BS3 → BS5 compat ─────────────────────────────────────────────── */

.badge {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-radius: var(--hdk-radius-full) !important;
  font-size: 11px !important;
  padding: 3px 8px !important;
}

/* ─── Well (BS3) → card shim ─────────────────────────────────────────────── */

.well {
  background: var(--hdk-bg-subtle);
  border: 1px solid var(--hdk-border);
  border-radius: var(--hdk-radius-lg);
  padding: 16px 20px;
  box-shadow: none;
  margin-bottom: 16px;
}

.well-sm { padding: 8px 12px; }
.well-lg { padding: 24px 28px; }

/* ─── Progress bars ──────────────────────────────────────────────────────── */

.progress {
  background: var(--hdk-border) !important;
  border-radius: var(--hdk-radius-full) !important;
  height: 8px !important;
  box-shadow: none !important;
  overflow: hidden;
}

.progress-bar {
  border-radius: var(--hdk-radius-full) !important;
  transition: width 0.6s ease !important;
}

/* ─── List group ─────────────────────────────────────────────────────────── */

.list-group-item {
  border-color: var(--hdk-border) !important;
  font-size: 13px !important;
  color: var(--hdk-text) !important;
  padding: 10px 16px !important;
  transition: background var(--hdk-transition);
}

.list-group-item:hover,
.list-group-item.active {
  background: var(--hdk-bg-hover) !important;
}

.list-group-item.active {
  color: var(--hdk-accent) !important;
  border-color: var(--hdk-border) !important;
  font-weight: 600;
}

/* ─── SB-Admin header bar (dashboard sb-admin.css compat) ───────────────── */

.navbar-top-links .dropdown-menu { min-width: 280px; }

.sb-admin-topnav { background: var(--hdk-primary) !important; }

/* ─── Dashboard "trip" sections (fade animation) ─────────────────────────── */

#main .trip { display: none; }

/* ─── Responsive table wrapper ───────────────────────────────────────────── */

.hdk-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--hdk-radius-lg);
}

/* ─── Toast container (fallback if not in topo.php) ─────────────────────── */

#hdk-toast-container {
  z-index: 9999;
}

/* ─── Page-level loading overlay ─────────────────────────────────────────── */

#hdk-page-loader {
  position: fixed;
  inset: 0;
  background: rgba(248, 250, 252, 0.8);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9998;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}

#hdk-page-loader.active {
  opacity: 1;
  pointer-events: all;
}

/* ─── Ticket list / solicita_consulta ───────────────────────────────────── */

.hdk-filter-bar {
  background: #f8fafc;
  border-bottom: 1px solid var(--hdk-border);
  min-height: 46px;
}

.hdk-filter-bar .form-select,
.hdk-filter-bar .form-control {
  font-size: .8125rem;
}

/* Row colouring */
.row1 { background-color: #fff; }
.row2 { background-color: #f9fafb; }

/* Ticket table compact hover */
.table-hover > tbody > tr:hover > * {
  background-color: rgba(59,130,246,.06);
}

/* ─── Responsive print ───────────────────────────────────────────────────── */

@media print {
  .panel { box-shadow: none !important; border: 1px solid #ccc !important; }
  .panel-heading { background: #f8fafc !important; color: #000 !important; }
}

/* ─── Ticket list — no horizontal overflow ───────────────────────────────── */

/* Prevent any horizontal overflow — everything must fit the viewport */
.hdk-page-content {
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
}

/* Clip any overflow — never show horizontal scrollbar */
.hdk-page-content .table-responsive {
  overflow-x: hidden !important;
}

/* Table uses auto layout — columns size to their content naturally */
.hdk-page-content .table {
  width: 100% !important;
}

/* Header cells: allow text to wrap so column names are always fully visible */
.hdk-page-content .table th {
  white-space: normal !important;
  overflow: hidden !important;
}

/* Data cells: truncate with ellipsis when content overflows */
.hdk-page-content .table td {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 220px !important;
}

/* Subject column gets more space since it's the most important */
.hdk-page-content .table td.col-assunto,
.hdk-page-content .table th.col-assunto {
  max-width: 350px !important;
}

/* Expand row (ver mais) — content flows normally */
.hdk-page-content .table td.taskImage {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  max-width: none !important;
}

/* Very short fixed-width icon/flag columns — keep them tight */
.hdk-page-content .table th[style*="width:20px"],
.hdk-page-content .table th[style*="width:15px"],
.hdk-page-content .table td:first-child,
.hdk-page-content .table td:nth-child(2),
.hdk-page-content .table td:nth-child(3) {
  max-width: 30px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

/* ─── Row ownership — badge on ticket number + left accent ──────────────── */

/* Base ticket number badge */
a.hdk-ticket-num {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 0.01em;
  transition: filter 0.15s;
}
a.hdk-ticket-num:hover {
  filter: brightness(0.88);
  text-decoration: none;
}

/* Mine — blue */
tr.tr-mine > td:first-child { border-left: 3px solid #3b82f6 !important; }
tr.tr-mine a.hdk-ticket-num {
  background: #dbeafe;
  color: #1d4ed8 !important;
}

/* Group — emerald */
tr.tr-group > td:first-child { border-left: 3px solid #10b981 !important; }
tr.tr-group a.hdk-ticket-num {
  background: #d1fae5;
  color: #065f46 !important;
}

/* Unassigned — amber */
tr.tr-unassigned > td:first-child { border-left: 3px solid #f59e0b !important; }
tr.tr-unassigned a.hdk-ticket-num {
  background: #fef3c7;
  color: #92400e !important;
}

/* Other — neutral slate */
tr.tr-other > td:first-child { border-left: 3px solid #cbd5e1 !important; }
tr.tr-other a.hdk-ticket-num {
  background: #f1f5f9;
  color: #475569 !important;
}

/* ============================================================
   MICRO-ANIMATIONS — subtle transitions for interactive elements
   ============================================================ */

/* Button press feedback */
.btn:active,
.btn_verde:active,
input[type="button"]:active,
input[type="submit"]:active {
  transform: scale(0.98);
  transition: transform 0.1s;
}

/* Theme switch smooth transition */
body,
.hdk-topbar,
.hdk-sidebar,
.hdk-main {
  transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

/* Dropdown menu entrance */
@keyframes hdk-fade-in-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.dropdown-menu.show {
  animation: hdk-fade-in-up 0.15s ease-out;
}

/* Fade-in for page content */
@keyframes hdk-page-enter {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.hdk-main {
  animation: hdk-page-enter 0.3s ease-out;
}

/* ============================================================
   DARK MODE
   Activated by [data-theme="dark"] on <html>
   ============================================================ */

/* --- Dark Mode Toggle Button --- */
.hdk-theme-toggle {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  border-radius: var(--hdk-radius);
  padding: 6px 10px;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  transition: all var(--hdk-transition);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hdk-theme-toggle:hover {
  background: rgba(255,255,255,0.2);
}
.hdk-theme-toggle .bi-moon-fill { display: inline; }
.hdk-theme-toggle .bi-sun-fill  { display: none; }

[data-theme="dark"] .hdk-theme-toggle .bi-moon-fill { display: none; }
[data-theme="dark"] .hdk-theme-toggle .bi-sun-fill  { display: inline; }

/* --- Dark Mode Variables --- */
[data-theme="dark"] {
  --hdk-bg-page: #0a0f1a;
  --hdk-bg-card: #0f172a;
  --hdk-bg-hover: #1a2744;
  --hdk-bg-subtle: #0f172a;
  --hdk-bg-body: #0f172a;
  --hdk-border: #1e2d4a;
  --hdk-border-light: #162032;

  --hdk-text: #e2e8f0;
  --hdk-text-muted: #94a3b8;
  --hdk-text-light: #64748b;

  /* Topbar dark */
  --hdk-topbar-bg: #0f172a;
  --hdk-topbar-text: #e2e8f0;
  --hdk-topbar-border: #1e293b;

  /* Sidebar dark */
  --hdk-sidebar-bg: #0f172a;
  --hdk-sidebar-text: rgba(203,213,225,0.8);
  --hdk-sidebar-text-active: #60a5fa;
  --hdk-sidebar-hover: rgba(255,255,255,0.05);
  --hdk-sidebar-active: rgba(59,130,246,0.15);
  --hdk-sidebar-active-border: #60a5fa;
  --hdk-sidebar-divider: #1e293b;
  --hdk-sidebar-accent: #60a5fa;

  --hdk-primary: #60a5fa;
  --hdk-primary-light: #93c5fd;
  --hdk-primary-dark: #3b82f6;

  --hdk-shadow-sm: 0 1px 2px rgba(0,0,0,0.5);
  --hdk-shadow: 0 1px 3px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.5);
  --hdk-shadow-md: 0 4px 6px rgba(0,0,0,0.6), 0 2px 4px rgba(0,0,0,0.5);
  --hdk-shadow-lg: 0 10px 15px rgba(0,0,0,0.7), 0 4px 6px rgba(0,0,0,0.5);
  --hdk-shadow-hover: 0 4px 12px rgba(0,0,0,0.4);
}

/* Body + global overrides */
[data-theme="dark"] body {
  background-color: var(--hdk-bg-page) !important;
  color: var(--hdk-text) !important;
}

/* Navbar stays dark (already dark in light mode, make it darker) */
[data-theme="dark"] .navbar {
  background-color: #0a0f1e !important;
  border-bottom: 1px solid #1e2d4a;
}

/* Toolbar */
[data-theme="dark"] .nav.nav-pills {
  background-color: var(--hdk-bg-card) !important;
  border-bottom-color: var(--hdk-border);
}

/* Breadcrumb */
[data-theme="dark"] .breadcrumb {
  border-bottom-color: var(--hdk-border);
}

/* Dropdown menus */
[data-theme="dark"] .navbar .dropdown-menu,
[data-theme="dark"] .dropdown-menu {
  background-color: var(--hdk-bg-card) !important;
  border-color: var(--hdk-border) !important;
}

[data-theme="dark"] .navbar .dropdown-menu > li > a,
[data-theme="dark"] .dropdown-menu > li > a {
  color: var(--hdk-text) !important;
}

[data-theme="dark"] .navbar .dropdown-menu > li > a:hover,
[data-theme="dark"] .dropdown-menu > li > a:hover {
  background-color: var(--hdk-bg-hover) !important;
}

/* Form elements */
[data-theme="dark"] .campo,
[data-theme="dark"] .campo12,
[data-theme="dark"] .campo_apont,
[data-theme="dark"] .campoff,
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background-color: #0f172a !important;
  color: var(--hdk-text) !important;
  border-color: var(--hdk-border) !important;
}

/* Tables */
[data-theme="dark"] .row1,
[data-theme="dark"] .row1 td {
  background-color: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  border-bottom-color: var(--hdk-border) !important;
}

[data-theme="dark"] .row2,
[data-theme="dark"] .row2 td {
  background-color: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  border-bottom-color: var(--hdk-border) !important;
}

[data-theme="dark"] .rowTitulo,
[data-theme="dark"] .rowTitulo td {
  background-color: transparent !important;
  color: var(--hdk-text-muted) !important;
  border-bottom: 1px solid var(--hdk-border) !important;
}

[data-theme="dark"] .row1:hover td,
[data-theme="dark"] .row2:hover td {
  background-color: rgba(255,255,255,0.04) !important;
}

/* Cards and modals */
[data-theme="dark"] .hdk-card,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .card {
  background-color: var(--hdk-bg-card) !important;
  border-color: var(--hdk-border) !important;
}

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

/* Legacy bgcolor overrides */
[data-theme="dark"] td[bgcolor],
[data-theme="dark"] tr[bgcolor],
[data-theme="dark"] table[bgcolor] {
  background-color: var(--hdk-bg-card) !important;
}

[data-theme="dark"] body[bgcolor] {
  background-color: var(--hdk-bg-page) !important;
}

/* Buttons — keep colored buttons, adjust default/outline */
[data-theme="dark"] .btn-default,
[data-theme="dark"] .btn-outline-secondary {
  background-color: var(--hdk-bg-card) !important;
  border-color: var(--hdk-border) !important;
  color: var(--hdk-text) !important;
}

/* Sidebar */
[data-theme="dark"] .hdk-left {
  background-color: var(--hdk-bg-card) !important;
  border-right-color: var(--hdk-border);
}

/* Scrollbars */
[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--hdk-bg-page);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #475569;
}

/* Login page dark mode */
[data-theme="dark"] .form-login {
  background: var(--hdk-bg-card) !important;
  border-color: var(--hdk-border) !important;
}

[data-theme="dark"] .label-form-input {
  background-color: #0f172a !important;
  border-color: var(--hdk-border) !important;
}

/* Chosen select in dark mode */
[data-theme="dark"] .chosen-container .chosen-single {
  background: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  border-color: var(--hdk-border) !important;
}

[data-theme="dark"] .chosen-container .chosen-drop {
  background: var(--hdk-bg-card) !important;
  border-color: var(--hdk-border) !important;
}

/* Metric cards */
[data-theme="dark"] .hdk-metric {
  background: var(--hdk-bg-card);
  border-color: var(--hdk-border);
}

[data-theme="dark"] .hdk-metric-value {
  color: var(--hdk-text);
}

/* Ticket category badges dark mode */
[data-theme="dark"] tr.tr-mine a.hdk-ticket-num {
  background: #1e3a5f;
  color: #93c5fd !important;
}

[data-theme="dark"] tr.tr-group a.hdk-ticket-num {
  background: #064e3b;
  color: #6ee7b7 !important;
}

[data-theme="dark"] tr.tr-unassigned a.hdk-ticket-num {
  background: #78350f;
  color: #fcd34d !important;
}

[data-theme="dark"] tr.tr-other a.hdk-ticket-num {
  background: #334155;
  color: #94a3b8 !important;
}

/* ============================================================
   DARK MODE — Global coverage (html, body, legacy elements)
   ============================================================ */

/* html + body: fill entire viewport dark */
[data-theme="dark"],
[data-theme="dark"] html {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] body {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
  min-height: 100vh;
}

/* Generic anchor colors */
[data-theme="dark"] a { color: #60a5fa; }
[data-theme="dark"] a:hover { color: #93bbfd; }

/* Legacy inline bgcolor on ANY element */
[data-theme="dark"] [bgcolor] {
  background-color: #1e293b !important;
}
[data-theme="dark"] body[bgcolor] {
  background-color: #0f172a !important;
}

/* Legacy text classes (style.default.css) */
[data-theme="dark"] .txtLabel,
[data-theme="dark"] .texto,
[data-theme="dark"] .texto11,
[data-theme="dark"] .texto12,
[data-theme="dark"] .col,
[data-theme="dark"] .linkColuna,
[data-theme="dark"] .linkSolicita,
[data-theme="dark"] .linkSimples,
[data-theme="dark"] .linkMenuAdmin,
[data-theme="dark"] .titRelatorio,
[data-theme="dark"] .linkPai,
[data-theme="dark"] .linkFilho,
[data-theme="dark"] .colNormal,
[data-theme="dark"] .lnkNovaSolc {
  color: #e2e8f0 !important;
}

[data-theme="dark"] .titSecao {
  color: #60a5fa !important;
}

[data-theme="dark"] .linkMenu {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .linkVencer {
  color: #f87171 !important;
}
[data-theme="dark"] .linkVencerDia {
  color: #60a5fa !important;
}
[data-theme="dark"] .linkVencidas {
  color: #f87171 !important;
}

/* Legacy row coloring classes */
[data-theme="dark"] .colGrupo {
  background-color: #064e3b !important;
  color: #6ee7b7 !important;
}
[data-theme="dark"] .colMinha {
  background-color: #78350f !important;
  color: #fcd34d !important;
}

/* Row backgrounds */
[data-theme="dark"] .rowTitulo,
[data-theme="dark"] .rowTitulo td {
  background-color: transparent !important;
  color: var(--hdk-text-muted) !important;
  border-bottom: 1px solid var(--hdk-border) !important;
}
[data-theme="dark"] .row1,
[data-theme="dark"] .row1 td {
  background-color: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  border-bottom-color: var(--hdk-border) !important;
}
[data-theme="dark"] .row2,
[data-theme="dark"] .row2 td {
  background-color: var(--hdk-bg-card) !important;
  color: var(--hdk-text) !important;
  border-bottom-color: var(--hdk-border) !important;
}
[data-theme="dark"] .row1:hover td,
[data-theme="dark"] .row2:hover td {
  background-color: rgba(255,255,255,0.04) !important;
}

/* bgDica */
[data-theme="dark"] .bgDica {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}

/* bg_tabela */
[data-theme="dark"] .bg_tabela {
  background-color: #1e293b !important;
  color: #60a5fa !important;
  border-bottom-color: #334155 !important;
}

/* Form elements — legacy campo classes */
[data-theme="dark"] .campo,
[data-theme="dark"] .campo12,
[data-theme="dark"] .campo_apont,
[data-theme="dark"] .campoff,
[data-theme="dark"] .campoAlerta {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
  border-color: #475569 !important;
}

[data-theme="dark"] .btn_verde {
  background-color: var(--hdk-accent) !important;
  background-image: none !important;
  color: #fff !important;
  border-color: var(--hdk-accent) !important;
}
[data-theme="dark"] .btn_verde:hover {
  background-color: var(--hdk-accent-dark) !important;
}

/* Nav tabs dark */
[data-theme="dark"] .nav-tabs {
  border-bottom-color: #334155 !important;
  background: #1e293b !important;
}
[data-theme="dark"] .nav-tabs .nav-link {
  color: #94a3b8 !important;
  border-bottom-color: transparent !important;
}
[data-theme="dark"] .nav-tabs .nav-link:hover {
  color: #60a5fa !important;
  background: rgba(255,255,255,0.03) !important;
  border-bottom-color: #475569 !important;
}
[data-theme="dark"] .nav-tabs .nav-link.active,
[data-theme="dark"] .nav-tabs li.active .nav-link,
[data-theme="dark"] .nav-tabs li.active a {
  color: #60a5fa !important;
  background: rgba(59,130,246,0.08) !important;
  border-bottom-color: #3b82f6 !important;
}

/* Nav pills */
[data-theme="dark"] .nav-pills .nav-link.active {
  background-color: #334155 !important;
  color: #e2e8f0 !important;
}

/* Generic table/td/th with hardcoded light backgrounds */
[data-theme="dark"] table {
  border-color: #334155 !important;
}
[data-theme="dark"] td,
[data-theme="dark"] th {
  border-color: #334155 !important;
}

/* Specific legacy bgcolor values */
[data-theme="dark"] td[bgcolor="#CCCCCC"],
[data-theme="dark"] td[bgcolor="#cccccc"],
[data-theme="dark"] table[bgcolor="#CCCCCC"],
[data-theme="dark"] table[bgcolor="#cccccc"] {
  background-color: #1e293b !important;
}
[data-theme="dark"] td[bgcolor="#E5E5E5"],
[data-theme="dark"] td[bgcolor="#e5e5e5"] {
  background-color: #162032 !important;
}
[data-theme="dark"] td[bgcolor="#FFFFFF"],
[data-theme="dark"] td[bgcolor="#ffffff"],
[data-theme="dark"] td[bgcolor="white"] {
  background-color: #1e293b !important;
}
[data-theme="dark"] td[bgcolor="#F5F5F5"],
[data-theme="dark"] td[bgcolor="#f5f5f5"] {
  background-color: #1a2332 !important;
}
[data-theme="dark"] td[bgcolor="#F9FBFB"],
[data-theme="dark"] td[bgcolor="#f9fbfb"] {
  background-color: #1e293b !important;
}

/* Tables used as page structure */
[data-theme="dark"] table[width="100%"] {
  border-color: #334155 !important;
}

/* Bootstrap overrides */
[data-theme="dark"] .table {
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .table > tbody > tr > td {
  color: #cbd5e1 !important;
  border-bottom-color: #334155 !important;
}
[data-theme="dark"] .table > tbody > tr:hover {
  background-color: #334155 !important;
}
[data-theme="dark"] .table thead th,
[data-theme="dark"] .table thead.table-light th {
  background: #0f172a !important;
  color: #94a3b8 !important;
  border-bottom-color: #475569 !important;
}
[data-theme="dark"] .table-bordered > :not(caption) > * > * {
  border-color: #334155 !important;
}

/* bg-light, bg-white Bootstrap utilities */
[data-theme="dark"] .bg-light {
  background-color: #1e293b !important;
}
[data-theme="dark"] .bg-white {
  background-color: #1e293b !important;
}

/* text-dark, text-secondary Bootstrap utilities */
[data-theme="dark"] .text-dark {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .text-secondary {
  color: #94a3b8 !important;
}
[data-theme="dark"] .text-muted {
  color: #94a3b8 !important;
}
[data-theme="dark"] .text-body {
  color: #e2e8f0 !important;
}

/* border-top, border-bottom Bootstrap utilities */
[data-theme="dark"] .border-top {
  border-top-color: #334155 !important;
}
[data-theme="dark"] .border-bottom {
  border-bottom-color: #334155 !important;
}
[data-theme="dark"] .border {
  border-color: #334155 !important;
}

/* Panels, wells, accordions */
[data-theme="dark"] .panel,
[data-theme="dark"] .panel-default,
[data-theme="dark"] .panel-body,
[data-theme="dark"] .well {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel-heading {
  background-color: #162032 !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}

/* Pagination */
[data-theme="dark"] .pagination .page-link {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #94a3b8 !important;
}
[data-theme="dark"] .pagination .page-item.active .page-link {
  background-color: #334155 !important;
  border-color: #475569 !important;
  color: #60a5fa !important;
}
[data-theme="dark"] .pagination .page-link:hover {
  background-color: #334155 !important;
  color: #e2e8f0 !important;
}

/* Filter bar (solicita_consulta) */
[data-theme="dark"] .hdk-filter-bar {
  background: #1e293b !important;
  border-bottom-color: #334155 !important;
}

/* Task detail expand row */
[data-theme="dark"] .taskImage {
  background: #1e293b !important;
  border-top-color: #334155 !important;
}

/* Ticket row tinting dark */
[data-theme="dark"] tr.tr-mine {
  background-color: rgba(59,130,246,0.1) !important;
}
[data-theme="dark"] tr.tr-mine:hover {
  background-color: rgba(59,130,246,0.18) !important;
}
[data-theme="dark"] tr.tr-group {
  background-color: rgba(16,185,129,0.1) !important;
}
[data-theme="dark"] tr.tr-group:hover {
  background-color: rgba(16,185,129,0.18) !important;
}
[data-theme="dark"] tr.tr-unassigned {
  background-color: rgba(239,68,68,0.1) !important;
  border-left-color: #ef4444 !important;
}
[data-theme="dark"] tr.tr-unassigned:hover {
  background-color: rgba(239,68,68,0.18) !important;
}

/* Alert/info boxes */
[data-theme="dark"] .alert {
  border-color: #334155 !important;
}
[data-theme="dark"] .alert-info {
  background-color: #1e3a5f !important;
  color: #93c5fd !important;
  border-color: #2563eb !important;
}
[data-theme="dark"] .alert-warning {
  background-color: #78350f !important;
  color: #fcd34d !important;
  border-color: #b45309 !important;
}
[data-theme="dark"] .alert-danger {
  background-color: #7f1d1d !important;
  color: #fca5a5 !important;
  border-color: #b91c1c !important;
}
[data-theme="dark"] .alert-success {
  background-color: #064e3b !important;
  color: #6ee7b7 !important;
  border-color: #059669 !important;
}

/* Popover / Tooltip */
[data-theme="dark"] .popover {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .tooltip-inner {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}

/* Breadcrumb */
[data-theme="dark"] .breadcrumb {
  background-color: #1e293b !important;
  border-bottom-color: #334155 !important;
}
[data-theme="dark"] .breadcrumb-item a {
  color: #60a5fa !important;
}
[data-theme="dark"] .breadcrumb-item.active {
  color: #94a3b8 !important;
}

/* jQuery UI autocomplete / datepicker */
[data-theme="dark"] .ui-autocomplete,
[data-theme="dark"] .ui-menu {
  background-color: #1e293b !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .ui-menu-item a,
[data-theme="dark"] .ui-menu-item-wrapper {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .ui-menu-item a:hover,
[data-theme="dark"] .ui-state-active,
[data-theme="dark"] .ui-state-focus {
  background-color: #334155 !important;
  color: #e2e8f0 !important;
  border-color: #475569 !important;
}
[data-theme="dark"] .ui-datepicker {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .ui-datepicker-header {
  background-color: #162032 !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .ui-datepicker td a {
  color: #cbd5e1 !important;
  background: #0f172a !important;
}
[data-theme="dark"] .ui-datepicker td a:hover {
  background: #334155 !important;
}

/* Chosen plugin dark */
[data-theme="dark"] .chosen-container .chosen-results li {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .chosen-container .chosen-results li.highlighted {
  background-color: #334155 !important;
  background-image: none !important;
}
[data-theme="dark"] .chosen-container-multi .chosen-choices {
  background: #0f172a !important;
  border-color: #475569 !important;
}
[data-theme="dark"] .chosen-container-multi .chosen-choices li.search-choice {
  background: #334155 !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .chosen-container input[type="text"] {
  color: #e2e8f0 !important;
}

/* Iframes inside the page */
[data-theme="dark"] iframe {
  border-color: #334155 !important;
}

/* hr elements */
[data-theme="dark"] hr {
  border-color: #334155 !important;
  opacity: 0.5;
}

/* Placeholder text */
[data-theme="dark"] ::placeholder {
  color: #64748b !important;
  opacity: 1;
}

/* Print: reset to light */
@media print {
  [data-theme="dark"],
  [data-theme="dark"] body,
  [data-theme="dark"] html {
    background: #fff !important;
    color: #000 !important;
  }
  [data-theme="dark"] .table > tbody > tr > td,
  [data-theme="dark"] .table thead th {
    color: #000 !important;
    background: #fff !important;
  }
}

/* =====================================================
   SB-ADMIN / Dashboard dark mode
   ===================================================== */
[data-theme="dark"] #wrapper,
[data-theme="dark"] #page-wrapper {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel {
  background-color: #1e293b !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .panel-primary > .panel-heading {
  background-color: #1e40af !important;
  border-color: #1d4ed8 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel-default > .panel-heading {
  background-color: #162032 !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel-body {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel-title {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .panel-footer {
  background-color: #162032 !important;
  border-color: #334155 !important;
  color: #94a3b8 !important;
}
[data-theme="dark"] .panel-footer a {
  color: #60a5fa !important;
}
/* Dashboard table */
[data-theme="dark"] .table-bordered {
  border-color: #334155 !important;
}
[data-theme="dark"] .table-bordered > thead > tr > th,
[data-theme="dark"] .table-bordered > tbody > tr > td,
[data-theme="dark"] .table-bordered > tfoot > tr > td {
  border-color: #334155 !important;
}
[data-theme="dark"] .table-striped > tbody > tr:nth-child(odd) {
  background-color: #1a2332 !important;
}
[data-theme="dark"] .table-striped > tbody > tr:nth-child(even) {
  background-color: #1e293b !important;
}
[data-theme="dark"] .table-hover > tbody > tr:hover {
  background-color: #334155 !important;
}
[data-theme="dark"] .table > thead > tr > th {
  color: #cbd5e1 !important;
  background-color: #162032 !important;
  border-bottom-color: #334155 !important;
}
[data-theme="dark"] .table > tbody > tr > td {
  color: #e2e8f0 !important;
  border-top-color: #334155 !important;
}
[data-theme="dark"] .table > tbody > tr > td a {
  color: #60a5fa !important;
}
/* Dashboard loader */
[data-theme="dark"] .loader {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
}
/* sb-admin side-nav */
[data-theme="dark"] .side-nav {
  background-color: #0f172a !important;
}
/* Catch: any remaining font[color] tags */
[data-theme="dark"] font[color] {
  color: #e2e8f0 !important;
}
/* Catch: inline style overrides for common bg colors */
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background-color: #FFF"],
[data-theme="dark"] [style*="background-color:#FFF"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background-color:white"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #FFF"],
[data-theme="dark"] [style*="background:#FFF"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background:white"] {
  background-color: #1e293b !important;
  background: #1e293b !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [style*="background-color: #f5f5f5"],
[data-theme="dark"] [style*="background-color:#f5f5f5"],
[data-theme="dark"] [style*="background-color: #F5F5F5"],
[data-theme="dark"] [style*="background-color:#F5F5F5"] {
  background-color: #162032 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [style*="background-color: #e5e5e5"],
[data-theme="dark"] [style*="background-color:#e5e5e5"],
[data-theme="dark"] [style*="background-color: #E5E5E5"],
[data-theme="dark"] [style*="background-color:#E5E5E5"] {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [style*="background-color: #cccccc"],
[data-theme="dark"] [style*="background-color:#cccccc"],
[data-theme="dark"] [style*="background-color: #CCCCCC"],
[data-theme="dark"] [style*="background-color:#CCCCCC"] {
  background-color: #162032 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [style*="background-color: #efefef"],
[data-theme="dark"] [style*="background-color:#efefef"],
[data-theme="dark"] [style*="background-color: #EFEFEF"],
[data-theme="dark"] [style*="background-color:#EFEFEF"] {
  background-color: #1a2332 !important;
  color: #e2e8f0 !important;
}
/* Strengthen bgcolor catch-all for additional hex values */
[data-theme="dark"] [bgcolor="#FFFFFF"],
[data-theme="dark"] [bgcolor="#ffffff"],
[data-theme="dark"] [bgcolor="white"] {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [bgcolor="#F5F5F5"],
[data-theme="dark"] [bgcolor="#f5f5f5"] {
  background-color: #162032 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [bgcolor="#F7F3F7"],
[data-theme="dark"] [bgcolor="#f7f3f7"] {
  background-color: #1a2332 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [bgcolor="#E7E7E7"],
[data-theme="dark"] [bgcolor="#e7e7e7"] {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] [bgcolor="#999999"],
[data-theme="dark"] [bgcolor="#666666"] {
  background-color: #0f172a !important;
  color: #e2e8f0 !important;
}
/* Select2 dark mode */
[data-theme="dark"] .select2-container--default .select2-selection--single,
[data-theme="dark"] .select2-container--default .select2-selection--multiple {
  background-color: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .select2-dropdown {
  background-color: #1e293b !important;
  border-color: #475569 !important;
}
[data-theme="dark"] .select2-results__option {
  color: #e2e8f0 !important;
}
[data-theme="dark"] .select2-results__option--highlighted {
  background-color: #334155 !important;
}
[data-theme="dark"] .select2-search--dropdown .select2-search__field {
  background-color: #0f172a !important;
  border-color: #475569 !important;
  color: #e2e8f0 !important;
}
/* Bootstrap modal dark */
[data-theme="dark"] .modal-content {
  background-color: #1e293b !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
[data-theme="dark"] .modal-header {
  border-bottom-color: #334155 !important;
}
[data-theme="dark"] .modal-footer {
  border-top-color: #334155 !important;
}
[data-theme="dark"] .modal-header .btn-close {
  filter: invert(1) !important;
}
/* CKEditor dark */
[data-theme="dark"] .cke_chrome {
  border-color: #334155 !important;
}
[data-theme="dark"] .cke_top,
[data-theme="dark"] .cke_bottom {
  background-color: #162032 !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .cke_button_icon {
  filter: invert(0.8) !important;
}
/* Body-level bgcolor override */
[data-theme="dark"] body[bgcolor] {
  background-color: #0f172a !important;
}
/* Collapsible panel plugin dark */
[data-theme="dark"] .collapsibleContainer {
  border-color: #334155 !important;
}
[data-theme="dark"] .collapsibleContainerTitle {
  background-color: #162032 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
[data-theme="dark"] .collapsibleContainerContent {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}

/* ============================================================
   DARK MODE — New Layout Components (Phase 6)
   ============================================================ */

/* Topbar dark (already dark by default, ensure consistency) */
[data-theme="dark"] .hdk-topbar {
  background: #0f172a !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important;
}

[data-theme="dark"] .hdk-topbar .hdk-topbar-search input[type="text"],
[data-theme="dark"] .hdk-topbar .hdk-topbar-search input,
[data-theme="dark"] .hdk-topbar-search input {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.08) !important;
}

/* Sidebar dark consistency */
[data-theme="dark"] .hdk-sidebar {
  background: #0f172a !important;
  border-right: 1px solid #1e293b !important;
}

[data-theme="dark"] .hdk-sidebar-section-title {
  color: #334155 !important;
}

[data-theme="dark"] .hdk-sidebar-link {
  color: #64748b !important;
}

[data-theme="dark"] .hdk-sidebar-link:hover {
  background: rgba(255,255,255,0.04) !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] .hdk-sidebar-link.active {
  background: rgba(59,130,246,0.12) !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] .hdk-sidebar-footer {
  border-top-color: #1e293b !important;
}

/* Dark mode sidebar children */
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-parent {
  color: rgba(226,232,240,0.88) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-parent:hover {
  background: rgba(255,255,255,0.05) !important;
  color: #fff !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-child {
  color: rgba(203,213,225,0.65) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-child:hover {
  color: rgba(226,232,240,0.9) !important;
  background: rgba(255,255,255,0.04) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-child.active {
  color: #fff !important;
  background: rgba(59,130,246,0.10) !important;
}
[data-theme="dark"] .hdk-sidebar .child-dot {
  background: rgba(148,163,184,0.30) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-child.active .child-dot {
  background: #60a5fa !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-grandchild {
  color: rgba(203,213,225,0.55) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-grandchild:hover {
  color: rgba(226,232,240,0.85) !important;
  background: rgba(255,255,255,0.03) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-grandchild.active {
  color: #fff !important;
  background: rgba(96,165,250,0.08) !important;
}
[data-theme="dark"] .hdk-sidebar .btn-new-ticket {
  background: var(--hdk-accent, #3b82f6) !important;
  color: #fff !important;
  border: none !important;
}
[data-theme="dark"] .hdk-sidebar .btn-new-ticket:hover {
  background: var(--hdk-accent-dark, #2563eb) !important;
}
[data-theme="dark"] .hdk-sidebar .hdk-sidebar-divider-line {
  background: linear-gradient(90deg, transparent, rgba(148,163,184,0.12), transparent) !important;
}

/* Data table dark */
[data-theme="dark"] .hdk-data-table {
  background: #1e293b;
  border-color: #334155;
}

[data-theme="dark"] .hdk-data-table-toolbar {
  border-bottom-color: #334155;
}

[data-theme="dark"] .hdk-data-table-toolbar .table-title {
  color: #e2e8f0;
}

[data-theme="dark"] .hdk-data-table-filter {
  background: #0f172a;
  border-color: #334155;
  color: #e2e8f0;
}

[data-theme="dark"] .hdk-data-table-export {
  background: #0f172a;
  border-color: #334155;
  color: #94a3b8;
}

[data-theme="dark"] .hdk-data-table thead th {
  background: #162032;
  color: #94a3b8;
  border-bottom-color: #334155;
}

[data-theme="dark"] .hdk-data-table tbody td {
  color: #e2e8f0;
  border-bottom-color: #1e293b;
}

[data-theme="dark"] .hdk-data-table tbody tr:hover {
  background-color: rgba(59,130,246,0.08);
}

[data-theme="dark"] .hdk-data-table-footer {
  border-top-color: #334155;
  color: #64748b;
}

/* Form groups dark */
[data-theme="dark"] .hdk-form-group {
  background: #1e293b;
  border-color: #334155;
}

[data-theme="dark"] .hdk-form-group-header {
  background: #162032;
  border-bottom-color: #334155;
}

[data-theme="dark"] .hdk-form-group-header h3 {
  color: #e2e8f0;
}

[data-theme="dark"] .hdk-form-label {
  color: #64748b;
}

/* AJAX Modal dark */
[data-theme="dark"] .hdk-ajax-modal .modal-content {
  box-shadow: 0 25px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.05);
}

[data-theme="dark"] .hdk-ajax-modal .modal-header {
  background: linear-gradient(135deg, #162447, #2d4a7a);
  border-bottom: none;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body {
  background: #1e293b;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body td[bgcolor="#E5E5E5"] {
  background: #1e293b !important;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body table[bgcolor="#CCCCCC"] {
  background: #1e293b !important;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body input.campo,
[data-theme="dark"] .hdk-ajax-modal .modal-body select.campo,
[data-theme="dark"] .hdk-ajax-modal .modal-body textarea.campo,
[data-theme="dark"] .hdk-ajax-modal .modal-body .form-control {
  background: #0f172a !important;
  color: #e2e8f0 !important;
  border-color: #475569 !important;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body #content {
  background: #1e293b !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body table[bgcolor="#666666"] > tbody > tr:last-child > td {
  background: #162032 !important;
  border-top-color: #334155 !important;
}

[data-theme="dark"] .hdk-ajax-modal .modal-body::-webkit-scrollbar-thumb {
  background: #475569;
}

[data-theme="dark"] .modal-backdrop.show {
  opacity: 0.6;
}

/* Breadcrumb dark */
[data-theme="dark"] .hdk-breadcrumb {
  color: #64748b;
}

[data-theme="dark"] .hdk-breadcrumb a {
  color: #64748b;
}

[data-theme="dark"] .hdk-breadcrumb a:hover {
  color: #60a5fa;
}

[data-theme="dark"] .hdk-breadcrumb .current {
  color: #e2e8f0;
}

/* Main content dark */
[data-theme="dark"] .hdk-main {
  background: #0f172a;
}

/* Dashboard dark */
[data-theme="dark"] .hdk-dashboard-chart {
  background: #1e293b;
  border-color: #334155;
}

[data-theme="dark"] .hdk-dashboard-chart-title {
  color: #e2e8f0;
}

/* Skeleton dark */
[data-theme="dark"] .hdk-skeleton {
  background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
  background-size: 400px 100%;
}

/* Status pills dark */
[data-theme="dark"] .hdk-status-nova      { background: #1e3a5f; color: #60a5fa; }
[data-theme="dark"] .hdk-status-andamento  { background: #064e3b; color: #6ee7b7; }
[data-theme="dark"] .hdk-status-espera     { background: #78350f; color: #fcd34d; }
[data-theme="dark"] .hdk-status-encerrada  { background: #334155; color: #94a3b8; }
[data-theme="dark"] .hdk-status-rejeitada  { background: #7f1d1d; color: #fca5a5; }
[data-theme="dark"] .hdk-status-aprovacao  { background: #4c1d95; color: #c4b5fd; }

/* Badge bg tokens dark */
[data-theme="dark"] .hdk-badge-success { background-color: #064e3b; color: #6ee7b7; }
[data-theme="dark"] .hdk-badge-warning { background-color: #78350f; color: #fcd34d; }
[data-theme="dark"] .hdk-badge-danger  { background-color: #7f1d1d; color: #fca5a5; }
[data-theme="dark"] .hdk-badge-info    { background-color: #1e3a5f; color: #93c5fd; }

/* Login dark mode */
[data-theme="dark"] body.login-page {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%) !important;
}