/* Complementos de tema — utilitários além do Tailwind/Flowbite */

/* Paleta brand (usada nos templates; não veio no build do Tailwind) */
.bg-brand-50 { background-color: #eff6ff; }
.bg-brand-100 { background-color: #dbeafe; }
.bg-brand-600 { background-color: #1d4ed8; }
.bg-brand-700 { background-color: #1e40af; }
.text-brand-600 { color: #1d4ed8; }
.text-brand-700 { color: #1d4ed8; }
.text-brand-800 { color: #1e40af; }
.border-brand-200 { border-color: #bfdbfe; }
.hover\:bg-brand-50:hover { background-color: #eff6ff; }
.hover\:bg-brand-100:hover { background-color: #dbeafe; }
.hover\:bg-brand-700:hover { background-color: #1e40af; }
.hover\:text-brand-800:hover { color: #1e40af; }

/* Paleta primary (Flowbite) — até rebuild do Tailwind */
.bg-primary-50 { background-color: #eff6ff; }
.bg-primary-700 { background-color: #1d4ed8; }
.bg-primary-800 { background-color: #1e40af; }
.bg-primary-100 { background-color: #dbeafe; }
.text-primary-700 { color: #1d4ed8; }
.bg-green-100 { background-color: #dcfce7; }
.text-green-700 { color: #15803d; }
.text-green-800 { color: #166534; }
.bg-red-100 { background-color: #fee2e2; }
.text-red-700 { color: #b91c1c; }
.text-red-800 { color: #991b1b; }
.bg-amber-100 { background-color: #fef3c7; }
.text-amber-700 { color: #b45309; }
.text-amber-800 { color: #92400e; }
.whitespace-nowrap { white-space: nowrap; }
.hover\:bg-primary-800:hover { background-color: #1e40af; }
.focus\:border-primary-500:focus { border-color: #3b82f6; }
.focus\:border-primary-600:focus { border-color: #2563eb; }
.focus\:ring-primary-300:focus { --tw-ring-color: #93c5fd; box-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); }
.focus\:ring-primary-500:focus { --tw-ring-color: #3b82f6; box-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); }
.focus\:ring-primary-600:focus { --tw-ring-color: #2563eb; box-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); }
.focus\:ring-gray-200:focus { --tw-ring-color: #e5e7eb; box-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); }
.bg-gray-100 { background-color: #f3f4f6; }
.bg-gray-900\/50 { background-color: rgba(17, 24, 39, 0.5); }
.divide-y > :not([hidden]) ~ :not([hidden]) { border-top-width: 1px; }
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #f3f4f6; }
.divide-gray-200 > :not([hidden]) ~ :not([hidden]) { border-color: #e5e7eb; }
.whitespace-nowrap { white-space: nowrap; }
.list-none { list-style: none; }
.h-\[calc\(100vh-4rem\)\] { height: calc(100vh - 4rem); }
.max-h-\[70vh\] { max-height: 70vh; }
.min-h-0 { min-height: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.font-light { font-weight: 300; }
.leading-tight { line-height: 1.25; }
.max-w-md { max-width: 28rem; }
.max-w-xl { max-width: 36rem; }
@media (min-width: 1024px) {
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:col-span-3 { grid-column: span 3 / span 3; }
  .lg\:col-span-1 { grid-column: span 1 / span 1; }
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:flex { display: flex; }
  .lg\:px-16 { padding-left: 4rem; padding-right: 4rem; }
}
@media (min-width: 1280px) {
  .xl\:px-20 { padding-left: 5rem; padding-right: 5rem; }
  .xl\:p-12 { padding: 3rem; }
}
.max-w-screen-2xl { max-width: 1536px; }
.p-2\.5 { padding: 0.625rem; }
.pe-10 { padding-inline-end: 2.5rem; }
.object-contain { object-fit: contain; }
.focus\:ring-3:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }
.focus\:ring-4:focus { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }

.sidebar-panel.sidebar-collapsed .sidebar-tree {
  display: none;
}

.sidebar-panel.sidebar-collapsed .sidebar-collapse-btn,
.sidebar-panel.sidebar-collapsed form button {
  justify-content: center;
}

.sidebar-panel.sidebar-collapsed .nav-submenu {
  display: none !important;
}

.sidebar-panel.sidebar-collapsed .nav-group-toggle {
  justify-content: center;
}

.nav-group-toggle .nav-group-chevron {
  transition: transform 0.2s ease;
}

.nav-group.is-open > .nav-group-toggle .nav-group-chevron {
  transform: rotate(180deg);
}

.nav-sublink-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #6b7280;
}

.nav-sublink-icon svg {
  width: 1rem !important;
  height: 1rem !important;
}

.nav-sublink:hover .nav-sublink-icon {
  color: #111827;
}

.nav-submenu {
  margin-left: 0.85rem;
  padding-left: 0.4rem;
  border-left: 1px solid #e5e7eb;
}

.page-header-slot:empty {
  display: none;
  margin: 0;
}

.navbar-page-title:not(:empty) {
  border-left: 1px solid #e5e7eb;
  margin-left: 0.25rem;
  padding-left: 0.875rem;
}

.navbar-page-title h1 {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.5;
  color: #111827;
}

.navbar-user-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  border: 0;
  border-radius: 0.75rem;
  background: transparent;
  padding: 0.25rem 0.5rem 0.25rem 0.25rem;
  cursor: pointer;
  transition: background-color 0.15s;
}

.navbar-user-trigger:hover {
  background: #f3f4f6;
}

.navbar-user-trigger:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

.navbar-user-avatar {
  display: flex;
  height: 2.25rem;
  width: 2.25rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 700;
  color: #fff;
  background-color: #2563eb;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px #e5e7eb;
}

.navbar-user-avatar-photo {
  display: block;
  object-fit: cover;
  background-color: #fff;
}

.navbar-user-name {
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
  font-weight: 600;
  color: #111827;
}

.navbar-user-chevron {
  height: 1rem;
  width: 1rem;
  flex-shrink: 0;
  color: #6b7280;
}

.navbar-user-dropdown {
  min-width: 12rem;
}

.navbar-user-menu-item {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  color: #374151;
  text-decoration: none;
  transition: background-color 0.15s;
}

.navbar-user-menu-item:hover {
  background: #f3f4f6;
}

.navbar-user-menu-button {
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.navbar-user-menu-icon {
  height: 1rem;
  width: 1rem;
  flex-shrink: 0;
  color: #6b7280;
}

@media (min-width: 768px) {
  .md\:space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
  .md\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
  .md\:p-6 { padding: 1.5rem; }
  .md\:mr-24 { margin-right: 6rem; }
}
@media (min-width: 1024px) {
  .lg\:px-20 { padding-left: 5rem; padding-right: 5rem; }
  .lg\:ml-20 { margin-left: 5rem; }
  .lg\:flex { display: flex; }
}
@media (min-width: 1280px) {
  .xl\:px-24 { padding-left: 6rem; padding-right: 6rem; }
  .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 1536px) {
  .\32xl\:p-8 { padding: 2rem; }
}

/* Sidebar mobile: overlay acima do conteúdo */
@media (max-width: 1023px) {
  #sidebar.flex {
    display: flex !important;
  }
}

.filter-drawer-backdrop {
  background: rgba(15, 23, 42, 0.35);
}

.filter-drawer.open {
  transform: translateX(0);
}

.toolbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  background: #fff;
  padding: 0.5rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}

.toolbar-btn:hover {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #111827;
}

.toolbar-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.toolbar-btn-primary {
  border-color: #1d4ed8;
  background: #1d4ed8;
  color: #fff;
}

.toolbar-btn-primary:hover {
  background: #1e40af;
  border-color: #1e40af;
  color: #fff;
}

.toolbar-btn-active {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.toolbar-btn-active:hover {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #1e40af;
}

.toolbar-split {
  position: relative;
  display: inline-flex;
  align-items: stretch;
}

.toolbar-split-main {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.toolbar-split-toggle {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.28);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.toolbar-split-toggle[aria-expanded="true"] {
  background: #1e3a8a;
  border-color: #1e3a8a;
}

.toolbar-split-menu {
  position: absolute;
  top: calc(100% + 0.35rem);
  right: 0;
  z-index: 40;
  width: min(20rem, calc(100vw - 2rem));
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
  padding: 0.35rem;
}

.toolbar-split-item {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  border: 0;
  border-radius: 0.5rem;
  background: transparent;
  padding: 0.7rem 0.75rem;
  text-align: left;
  cursor: pointer;
}

.toolbar-split-item:hover {
  background: #eff6ff;
}

.toolbar-split-item-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
}

.toolbar-split-item-desc {
  font-size: 0.75rem;
  line-height: 1.35;
  color: #6b7280;
}

.toolbar-split-help {
  margin: 0.15rem 0.35rem 0.35rem;
  border-top: 1px solid #f3f4f6;
  padding: 0.65rem 0.4rem 0.25rem;
  font-size: 0.72rem;
  line-height: 1.4;
  color: #6b7280;
}

.toolbar-split-help strong {
  color: #374151;
  font-weight: 600;
}

.metric-card {
  display: block;
  text-decoration: none;
  color: inherit;
}

.filter-chip {
  border: 1px solid #bfdbfe;
}

.settings-tab-active {
  border-color: #2563eb;
  color: #2563eb;
}

.dataTables_wrapper .dt-top .dataTables_filter {
  margin: 0;
  float: none;
  text-align: left;
}

.dataTables_wrapper .dt-top .dataTables_filter label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.dataTables_wrapper .dt-top .dataTables_filter input {
  min-width: 14rem;
}

/* Login — vídeo de fundo em tela cheia */
.login-page {
  min-height: 100vh;
  background: #0f172a;
}

.login-video-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.login-video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.6s ease;
}

.login-video-bg video.is-ready {
  opacity: 1;
}

.login-video-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(15, 23, 42, 0.72) 0%,
    rgba(30, 64, 175, 0.45) 100%
  );
}

.login-page-content {
  position: relative;
  z-index: 10;
}

.login-card {
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(10px);
}