/* ===== UTILITY CLASSES ===== */
/* Single-purpose utility classes following CSS Guidelines */
/* No component-specific styles in this file */

/* ===== TEXT UTILITIES ===== */
.text-primary { color: var(--color-primary); }
.text-secondary { color: var(--color-secondary); }
.text-accent { color: var(--color-accent); }
.text-muted { color: var(--color-text-light); }

.text-green-darkest { color: var(--color-green-darkest); }
.text-blue-dark { color: var(--color-blue-dark); }
.text-blue-medium { color: var(--color-blue-medium); }
.text-yellow-light { color: var(--color-yellow-light); }
.text-red-light { color: var(--color-red-light); }

/* ===== BACKGROUND UTILITIES ===== */
.bg-primary { background-color: var(--color-primary); }
.bg-secondary { background-color: var(--color-secondary); }
.bg-accent { background-color: var(--color-accent); }

.bg-green-light { background-color: var(--color-green-light); }
.bg-blue-light { background-color: var(--color-blue-light); }
.bg-blue-darkest { background-color: var(--color-blue-darkest); }

/* ===== BORDER UTILITIES ===== */
.border-primary { border-color: var(--color-primary); }
.border-secondary { border-color: var(--color-secondary); }
.border-accent { border-color: var(--color-accent); }

.border-green-medium { border-color: var(--color-green-medium); }
.border-blue-dark { border-color: var(--color-blue-dark); }

/* ===== SHADOW UTILITIES ===== */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }

.shadow-green { box-shadow: 0 4px 15px rgba(2, 71, 42, 0.1); }
.shadow-green-hover { box-shadow: 0 8px 25px rgba(2, 71, 42, 0.15); }
.shadow-blue { box-shadow: 0 4px 20px rgba(6, 41, 67, 0.2); }

/* ===== SPACING UTILITIES - GUIDELINES COMPLIANCE ===== */
/* All spacing utilities follow the centralized spacing scale */

/* Padding utilities */
.p-xxs { padding: var(--space-xxs); }
.p-xs { padding: var(--space-xs); }
.p-sm { padding: var(--space-sm); }
.p-md { padding: var(--space-md); }
.p-lg { padding: var(--space-lg); }

/* Margin utilities */
.m-xxs { margin: var(--space-xxs); }
.m-xs { margin: var(--space-xs); }
.m-sm { margin: var(--space-sm); }
.m-md { margin: var(--space-md); }
.m-lg { margin: var(--space-lg); }

/* Directional padding utilities */
.pt-xxs { padding-top: var(--space-xxs); }
.pt-xs { padding-top: var(--space-xs); }
.pt-sm { padding-top: var(--space-sm); }
.pt-md { padding-top: var(--space-md); }
.pt-lg { padding-top: var(--space-lg); }

.pb-xxs { padding-bottom: var(--space-xxs); }
.pb-xs { padding-bottom: var(--space-xs); }
.pb-sm { padding-bottom: var(--space-sm); }
.pb-md { padding-bottom: var(--space-md); }
.pb-lg { padding-bottom: var(--space-lg); }

.pl-xxs { padding-left: var(--space-xxs); }
.pl-xs { padding-left: var(--space-xs); }
.pl-sm { padding-left: var(--space-sm); }
.pl-md { padding-left: var(--space-md); }
.pl-lg { padding-left: var(--space-lg); }

.pr-xxs { padding-right: var(--space-xxs); }
.pr-xs { padding-right: var(--space-xs); }
.pr-sm { padding-right: var(--space-sm); }
.pr-md { padding-right: var(--space-md); }
.pr-lg { padding-right: var(--space-lg); }

/* Directional margin utilities */
.mt-xxs { margin-top: var(--space-xxs); }
.mt-xs { margin-top: var(--space-xs); }
.mt-sm { margin-top: var(--space-sm); }
.mt-md { margin-top: var(--space-md); }
.mt-lg { margin-top: var(--space-lg); }

.mb-xxs { margin-bottom: var(--space-xxs); }
.mb-xs { margin-bottom: var(--space-xs); }
.mb-sm { margin-bottom: var(--space-sm); }
.mb-md { margin-bottom: var(--space-md); }
.mb-lg { margin-bottom: var(--space-lg); }

.ml-xxs { margin-left: var(--space-xxs); }
.ml-xs { margin-left: var(--space-xs); }
.ml-sm { margin-left: var(--space-sm); }
.ml-md { margin-left: var(--space-md); }
.ml-lg { margin-left: var(--space-lg); }

.mr-xxs { margin-right: var(--space-xxs); }
.mr-xs { margin-right: var(--space-xs); }
.mr-sm { margin-right: var(--space-sm); }
.mr-md { margin-right: var(--space-md); }
.mr-lg { margin-right: var(--space-lg); }

/* Legacy spacing utilities for backward compatibility */
.p-xl { padding: var(--spacing-xl); }
.m-xl { margin: var(--spacing-xl); }

/* ===== BORDER RADIUS UTILITIES ===== */
.rounded-sm { border-radius: var(--border-radius-sm); }
.rounded-md { border-radius: var(--border-radius-md); }
.rounded-lg { border-radius: var(--border-radius-lg); }
.rounded-xl { border-radius: var(--border-radius-xl); }

/* ===== TRANSITION UTILITIES ===== */
.transition-fast { transition: all var(--transition-fast); }
.transition-normal { transition: all var(--transition-normal); }
.transition-slow { transition: all var(--transition-slow); }

.transition-color { transition: color var(--transition-normal); }
.transition-bg { transition: background-color var(--transition-normal); }
.transition-transform { transition: transform var(--transition-normal); }

/* ===== FOCUS UTILITIES ===== */
.focus-primary:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

.focus-accent:focus {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ===== DISPLAY UTILITIES ===== */
.d-none { display: none; }
.d-block { display: block; }
.d-inline { display: inline; }
.d-inline-block { display: inline-block; }
.d-flex { display: flex; }
.d-grid { display: grid; }

/* ===== FLEXBOX UTILITIES ===== */
.flex-row { flex-direction: row; }
.flex-column { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.flex-nowrap { flex-wrap: nowrap; }

.justify-start { justify-content: flex-start; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }

.align-start { align-items: flex-start; }
.align-center { align-items: center; }
.align-end { align-items: flex-end; }
.align-stretch { align-items: stretch; }

/* ===== POSITION UTILITIES ===== */
.position-relative { position: relative; }
.position-absolute { position: absolute; }
.position-fixed { position: fixed; }
.position-sticky { position: sticky; }

/* ===== Z-INDEX UTILITIES ===== */
.z-dropdown { z-index: var(--z-dropdown); }
.z-sticky { z-index: var(--z-sticky); }
.z-fixed { z-index: var(--z-fixed); }
.z-modal { z-index: var(--z-modal); }
.z-tooltip { z-index: var(--z-tooltip); }

/* ===== RESPONSIVE UTILITIES ===== */
@media (min-width: 576px) {
  .d-sm-none { display: none; }
  .d-sm-block { display: block; }
  .d-sm-inline { display: inline; }
  .d-sm-inline-block { display: inline-block; }
  .d-sm-flex { display: flex; }
  .d-sm-grid { display: grid; }
}

@media (min-width: 768px) {
  .d-md-none { display: none; }
  .d-md-block { display: block; }
  .d-md-inline { display: inline; }
  .d-md-inline-block { display: inline-block; }
  .d-md-flex { display: flex; }
  .d-md-grid { display: grid; }
}

@media (min-width: 992px) {
  .d-lg-none { display: none; }
  .d-lg-block { display: block; }
  .d-lg-inline { display: inline; }
  .d-lg-inline-block { display: inline-block; }
  .d-lg-flex { display: flex; }
  .d-lg-grid { display: grid; }
}

@media (min-width: 1200px) {
  .d-xl-none { display: none; }
  .d-xl-block { display: block; }
  .d-xl-inline { display: inline; }
  .d-xl-inline-block { display: inline-block; }
  .d-xl-flex { display: flex; }
  .d-xl-grid { display: grid; }
}

/* ===== DARK THEME UTILITY OVERRIDES ===== */
[data-theme="dark"] .text-primary { color: var(--text-primary); }
[data-theme="dark"] .text-secondary { color: var(--text-secondary); }
[data-theme="dark"] .text-muted { color: var(--text-muted); }

[data-theme="dark"] .bg-primary { background-color: var(--bg-primary); }
[data-theme="dark"] .bg-secondary { background-color: var(--bg-secondary); }
[data-theme="dark"] .bg-dark { background-color: var(--bg-primary); }

[data-theme="dark"] .border-primary { border-color: var(--border-primary); }
[data-theme="dark"] .border-secondary { border-color: var(--border-secondary); }

[data-theme="dark"] .shadow-green { box-shadow: var(--shadow-secondary); }
[data-theme="dark"] .shadow-blue { box-shadow: var(--shadow-primary); }
