/* Custom CSS for Konrix App */
/* Add your custom styles here */

/* Hide Theme Customizer */
[data-fc-type="offcanvas"][data-fc-target="theme-customization"] {
  display: none !important;
}

/* Hide Back to Top Button */
[data-toggle="back-to-top"] {
  display: none !important;
}

/* Example: Change primary color */
:root {
  --tw-color-primary: #3073F1;
}

/* Example: Custom button styles */
.btn-custom {
  background-color: var(--tw-color-primary);
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  transition: all 0.3s ease;
}

.btn-custom:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

/* Price Charts Styles */
.chart-container {
  width: 120px;
  height: 60px;
}

.chart-container .apexcharts-canvas {
  margin: 0 !important;
}

/* Ensure dropdowns in price charts have no focus ring */
.card .form-select-sm:focus {
  box-shadow: none;
  border-color: transparent;
}

/* Price chart card hover effect */
.card:has(#revenue-sparkline-chart),
.card:has(#pending-sparkline-chart),
.card:has(#open-sparkline-chart) {
  transition: all 0.3s ease;
  cursor: pointer;
}

.card:has(#revenue-sparkline-chart):hover,
.card:has(#pending-sparkline-chart):hover,
.card:has(#open-sparkline-chart):hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Dark mode adjustments for price charts */
.dark .card:has(#revenue-sparkline-chart):hover,
.dark .card:has(#pending-sparkline-chart):hover,
.dark .card:has(#open-sparkline-chart):hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
}