/* Utility Classes */

/* Display utilities */
.u-hidden {
  display: none;
}

/* Spacing utilities */
.u-mb-1_5 {
  margin-bottom: 1.5rem;
}

.u-mb-1 {
  margin-bottom: 1rem;
}

.u-mb-0_5 {
  margin-bottom: 0.5rem;
}

.u-mt-1_5 {
  margin-top: 1.5rem;
}

.u-mt-0_5 {
  margin-top: 0.5rem;
}

.u-mt-2 {
  margin-top: 2rem;
}

.u-mb-2 {
  margin-bottom: 2rem;
}

.u-mb-3 {
  margin-bottom: 3rem;
}

/* Container utilities */
.u-scroll-container {
  max-height: 200px;
  overflow-y: auto;
}

.u-scroll-container-lg {
  max-height: 70vh;
  overflow-y: auto;
}

/* Card/Panel utilities */
.u-stat-card {
  padding: 0.75rem;
}

.u-info-panel {
  padding: 1rem;
  margin-bottom: 1.5rem;
}

/* Typography utilities */
.u-text-muted-sm {
  margin-bottom: 0.25rem;
}

.u-text-muted {
  /* color: var(--text-secondary); */
  /* font-size: 0.9rem; */
}

.u-text-muted-xs {
  /* font-size: 0.7rem; */
}

.u-heading-sm {
  margin-bottom: 0.5rem;
}

.u-heading-md {
  margin: 0;
}

.u-text-bold {
  /* font-weight: 600; */
  /* color: var(--text-primary); */
}

.u-text-default {
  /* color: var(--text-primary); */
}

.u-text-xs {
  /* font-size: 0.9rem; */
}

/* Modal/Dialog utilities */
.u-modal-container {
  position: relative;
  max-width: 1200px;
  margin: 2rem auto;
  padding: 2rem;
}

.u-close-btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 40px;
  height: 40px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Code/Terminal styling */
.u-terminal-log {
  max-height: 70vh;
  overflow-y: auto;
  padding: 1.5rem;
  line-height: 1.6;
}

/* Flex utilities */
.u-flex-center {
  text-align: center;
  display: flex;
  gap: 1rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 1.5rem;
}

.u-flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.u-flex-between-mb {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

/* Grid utilities */
.u-grid-2col {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  margin-bottom: 1rem;
}

/* Helper message box */
.u-helper-box {
  padding: 1rem 1.25rem;
  margin-bottom: 1.5rem;
}

.u-helper-content {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.u-helper-icon {
  /* color: var(--info-color); */
  /* font-size: 1.5rem; */
}

.u-helper-text {
  flex: 1;
}