/* ============================================
   UTILITIES — agencia-invitaciones
   Clases de utilidad reutilizables
   ============================================ */

/* ---- Display ---- */
.flex            { display: flex; }
.flex-col        { display: flex; flex-direction: column; }
.flex-center     { display: flex; align-items: center; justify-content: center; }
.flex-between    { display: flex; align-items: center; justify-content: space-between; }
.hidden          { display: none !important; }

/* ---- Posición ---- */
.relative        { position: relative; }
.absolute        { position: absolute; }
.inset-0         { inset: 0; }
.z-1             { z-index: 1; }
.z-5             { z-index: 5; }
.z-10            { z-index: 10; }
.z-20            { z-index: 20; }
.z-100           { z-index: 100; }

/* ---- Texto ---- */
.text-center     { text-align: center; }
.text-left       { text-align: left; }
.text-right      { text-align: right; }
.text-italic     { font-style: italic; }
.text-bold       { font-weight: 700; }
.uppercase       { text-transform: uppercase; }
.no-wrap         { white-space: nowrap; }

/* ---- Overflow ---- */
.overflow-hidden { overflow: hidden; }
.overflow-auto   { overflow: auto; }
.pointer-none    { pointer-events: none; }

/* ---- Espaciado ---- */
.mt-2  { margin-top: 2px; }
.mt-4  { margin-top: 4px; }
.mt-8  { margin-top: 8px; }
.mt-12 { margin-top: 12px; }
.mb-2  { margin-bottom: 2px; }
.mb-4  { margin-bottom: 4px; }
.mb-8  { margin-bottom: 8px; }
.p-0   { padding: 0; }
.p-8   { padding: 8px; }
.p-12  { padding: 12px; }

/* ---- Opacidad ---- */
.opacity-0    { opacity: 0; }
.opacity-50   { opacity: 0.5; }
.opacity-70   { opacity: 0.7; }
.opacity-100  { opacity: 1; }

/* ---- Transiciones ---- */
.transition    { transition: all 0.3s ease; }
.transition-sm { transition: all 0.2s ease; }
.transition-lg { transition: all 0.6s ease; }

/* ---- Sombras de texto comunes ---- */
.text-shadow-dark {
  text-shadow:
    0 2px 8px rgba(0,0,0,1),
    0 0 12px rgba(0,0,0,0.8),
    0 0 4px rgba(0,0,0,1);
}
.text-shadow-soft {
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
}
.text-shadow-glow-gold {
  text-shadow:
    0 0 20px rgba(244, 211, 105, 0.8),
    0 2px 8px rgba(0,0,0,0.9);
}

/* ---- Backdrop blur ---- */
.blur-sm  { backdrop-filter: blur(2px); }
.blur-md  { backdrop-filter: blur(6px); }
.blur-lg  { backdrop-filter: blur(12px); }

/* ---- Utilidades de imagen ---- */
.img-contain {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.img-cover {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.drop-shadow-dark {
  filter: drop-shadow(0 3px 8px rgba(0,0,0,0.7));
}