/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Enhanced checkbox styling */
.form-checkbox:checked {
  background-size: 16px 16px;
  background-position: center;
  background-repeat: no-repeat;
}

/* Custom textarea improvements */
textarea:focus {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1), 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Improve table cell spacing and alignment */
.assessment-table td {
  vertical-align: top;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Better hover states for interactive elements */
.form-checkbox:hover:not(:disabled) {
  transform: scale(1.05);
}

textarea:hover:not(:focus) {
  border-color: rgb(147, 197, 253);
}

/* Custom scrollbar for sidebar navigation */
.sidebar-scroll::-webkit-scrollbar {
  width: 6px;
}

.sidebar-scroll::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 3px;
}

.sidebar-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}

.sidebar-scroll::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Firefox scrollbar styling */
.sidebar-scroll {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 #f1f5f9;
}
