/* Custom Utility Classes - Additional to Bootstrap 5 */
/* Most utilities are now provided by Bootstrap 5 */

/* Backwards compatibility for Tailwind-like classes */
.hidden { display: none !important; }
.block { display: block; }
.inline { display: inline; }
.inline-block { display: inline-block; }

/* Flexbox compatibility */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.flex-col { flex-direction: column; }
.flex-row { flex-direction: row; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }

/* Gap utilities (Bootstrap has gap but different syntax) */
.gap-sm { gap: 0.5rem; }
.gap-md { gap: 1rem; }
.gap-lg { gap: 1.5rem; }

/* Text utilities */
.text-xs { font-size: 0.75rem; }
.text-2xl { font-size: 1.5rem; }

/* Height utilities */
.h-screen { height: 100vh; }

/* Additional margin/padding shortcuts */
.m-xs { margin: 0.25rem; }
.m-sm { margin: 0.5rem; }
.m-md { margin: 1rem; }
.m-lg { margin: 1.5rem; }
.m-xl { margin: 3rem; }

.mb-xs { margin-bottom: 0.25rem; }
.mb-sm { margin-bottom: 0.5rem; }
.mb-md { margin-bottom: 1rem; }
.mb-lg { margin-bottom: 1.5rem; }
.mb-xl { margin-bottom: 3rem; }

.p-xs { padding: 0.25rem; }
.p-sm { padding: 0.5rem; }
.p-md { padding: 1rem; }
.p-lg { padding: 1.5rem; }
.p-xl { padding: 3rem; }

/* Gradient text */
.text-gradient-brand {
  background: var(--gradient-card-border, linear-gradient(90deg, #667eea, #764ba2, #42A5F5));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Position helpers */
.relative { position: relative; }
.z-10 { z-index: 10; }