/* Softkom palette theme */
:root {
  --so-color-ink: #233e4f;
  --so-color-surface: #e6ebeb;
  --so-color-accent: #2bbbb4;

  /* Primary (brand) scale used by TailAdmin utilities */
  --color-brand-50: #ebf8f7;
  --color-brand-100: #d8f2f0;
  --color-brand-200: #b2e6e2;
  --color-brand-300: #81d7d1;
  --color-brand-400: var(--so-color-accent);
  --color-brand-500: #23a59e;
  --color-brand-600: #1d8b85;
  --color-brand-800: #216a6f;
  --color-brand-950: var(--so-color-ink);

  /* Neutral scale */
  --color-gray-50: #f4f7f7;
  --color-gray-100: var(--so-color-surface);
  --color-gray-200: #d2dbdb;
  --color-gray-300: #bac7c7;
  --color-gray-400: #93a6ad;
  --color-gray-500: #6a7f89;
  --color-gray-600: #526a76;
  --color-gray-700: #3d5663;
  --color-gray-800: #2d4754;
  --color-gray-900: var(--so-color-ink);
  --color-black: var(--so-color-ink);
}

/* Small polish so "Aktivna baza" block follows the new palette */
.header-active-db {
  border-color: var(--color-brand-200);
  background-color: var(--color-brand-50);
}

.header-active-db-label {
  color: var(--color-brand-600);
}

.db-set-active-short-label {
  display: none;
}

@media (max-width: 469.98px) {
  .header-active-db--long .header-active-db-label {
    display: none;
  }
  .db-set-active-full-label {
    display: none;
  }
  .db-set-active-short-label {
    display: inline;
  }
}

@media (max-width: 403.98px) {
  .header-active-db-label {
    display: none;
  }
}

.header-active-db-icon {
  color: var(--color-brand-600);
}

.dark .header-active-db {
  border-color: #2f5566;
  background-color: #1f3442;
  color: #c7d5db;
}

.dark .header-active-db .font-semibold {
  color: #ffffff;
}

.dark .header-active-db-label {
  color: #84d6d2;
}

.dark .header-active-db-icon {
  color: #84d6d2;
}

/* Login right panel image tint */
.login-right-overlay {
  background-color: rgba(35, 62, 79, 0.9);
}

.dark .login-right-overlay {
  background-color: rgba(0, 0, 0, 0.58);
}

.report-submenu {
  padding-left: 14px;
}

.report-submenu-link {
  display: flex;
  width: 100%;
  box-sizing: border-box;
  align-items: center;
  min-height: 34px;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-gray-600);
  transition: background-color 0.2s ease, color 0.2s ease;
}

.report-submenu-link:hover {
  background-color: var(--color-gray-100);
  color: var(--color-gray-800);
}

.report-submenu-link-active {
  background-color: var(--color-brand-50);
  color: var(--color-brand-600);
}

.dark .report-submenu-link {
  color: #9fb0b8;
}

.dark .report-submenu-link:hover {
  background-color: rgba(255, 255, 255, 0.05);
  color: #ffffff;
}

.dark .report-submenu-link-active {
  background-color: rgba(43, 187, 180, 0.16);
  color: #84d6d2;
}

.report-filter-popover {
  min-width: 320px;
}

/* Report filter selects in Softkom accent color */
.report-page-size-select {
  border-color: var(--color-brand-300);
}

.report-page-size-select:focus {
  border-color: var(--so-color-accent) !important;
  box-shadow: 0 0 0 3px rgba(43, 187, 180, 0.18) !important;
}

.report-page-size-select option {
  background-color: #ffffff;
  color: var(--color-gray-800);
}

.dark .report-page-size-select option {
  background-color: #1f3442;
  color: #d8e3e7;
}

.report-page-size-select option:checked {
  background: linear-gradient(var(--so-color-accent), var(--so-color-accent));
  color: var(--so-color-ink);
}

.dark .report-page-size-select option:checked {
  background: linear-gradient(#23a59e, #23a59e);
  color: #102a35;
}

.so-custom-select-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.so-custom-select-button:focus {
  border-color: var(--so-color-accent) !important;
  box-shadow: 0 0 0 3px rgba(43, 187, 180, 0.18) !important;
  outline: none;
}

.so-custom-select-option {
  width: 100%;
  border-radius: 8px;
  padding: 8px 10px;
  text-align: left;
  font-size: 14px;
  color: var(--color-gray-800);
}

.so-custom-select-option:hover {
  background-color: var(--color-brand-50);
  color: var(--color-brand-600);
}

.so-custom-select-option-active {
  background-color: var(--so-color-accent);
  color: var(--so-color-ink);
}

.dark .so-custom-select-option {
  color: #d8e3e7;
}

.dark .so-custom-select-option:hover {
  background-color: rgba(43, 187, 180, 0.18);
  color: #84d6d2;
}

.dark .so-custom-select-option-active {
  background-color: #23a59e;
  color: #102a35;
}

.dashboard-top-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.chartDarkStyle .apexcharts-legend-text {
  color: #344054 !important;
}

.chartDarkStyle .apexcharts-datalabel-label,
.chartDarkStyle .apexcharts-datalabel-value {
  fill: #344054 !important;
}

.dark .chartDarkStyle .apexcharts-legend-text {
  color: #d0d5dd !important;
}

.dark .chartDarkStyle .apexcharts-datalabel-label,
.dark .chartDarkStyle .apexcharts-datalabel-value {
  fill: #d0d5dd !important;
}

.chartDarkStyle .apexcharts-tooltip,
.chartDarkStyle .apexcharts-tooltip.apexcharts-theme-dark {
  background: #0f172a !important;
  border-color: #0f172a !important;
}

.chartDarkStyle .apexcharts-tooltip,
.chartDarkStyle .apexcharts-tooltip *,
.chartDarkStyle .apexcharts-tooltip-title {
  color: #ffffff !important;
}

.error-page-code-tailadmin {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 280px;
  min-height: 180px;
  border-radius: 28px;
  border: 1px solid rgba(43, 187, 180, 0.18);
  background:
    radial-gradient(circle at top, rgba(43, 187, 180, 0.2), rgba(43, 187, 180, 0) 55%),
    linear-gradient(135deg, rgba(35, 62, 79, 0.06), rgba(43, 187, 180, 0.1));
  color: var(--color-brand-600);
  font-size: clamp(70px, 15vw, 108px);
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  box-shadow: 0 18px 48px rgba(35, 62, 79, 0.1);
}

.dark .error-page-code-tailadmin {
  border-color: rgba(43, 187, 180, 0.2);
  background:
    radial-gradient(circle at top, rgba(43, 187, 180, 0.14), rgba(43, 187, 180, 0) 55%),
    linear-gradient(135deg, rgba(16, 24, 40, 0.86), rgba(33, 106, 111, 0.5));
  color: #9ce8e4;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
}
@media (min-width: 1024px) {
  .dashboard-top-cards {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }

  .dashboard-top-cards-swapped {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }
}

details > summary::-webkit-details-marker {
  display: none;
}

@media (min-width: 1024px) {
  /* Keep items left-aligned when collapsed sidebar auto-expands on hover. */
  #ta-sidebar:hover a.menu-item,
  #ta-sidebar:hover button.menu-item {
    justify-content: flex-start;
  }

  /* Hide report sub-links only while compact sidebar is not hovered. */
  #ta-sidebar.lg\:w-\[90px\]:not(:hover) .report-submenu {
    display: none;
  }

  #ta-sidebar.lg\:w-\[90px\]:not(:hover) [data-ta-submenu-toggle] .menu-item-arrow {
    display: none;
  }

  /* In compact mode, reveal submenu when hovering the parent item. */
  #ta-sidebar.lg\:w-\[90px\]:hover li:hover > .report-submenu {
    display: flex;
  }
}

@media (max-width: 1023.98px) {
  .login-left-stack {
    position: relative;
    justify-content: center;
  }

  .login-mobile-brand {
    position: absolute;
    top: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    gap: 0.75rem;
    width: max-content;
    z-index: 2;
  }
}

@media (min-width: 640px) and (max-width: 1023.98px) {
  .login-mobile-brand {
    top: 1.5rem;
  }
}
