/* CLS fixes: reserve icon space before Font Awesome loads */
.fa,
.fas,
.far,
.fal,
.fab,
.fa-solid,
.fa-regular,
.fa-light,
.fa-brands {
  display: inline-block;
  width: 1.25em;
  line-height: 1em;
  text-align: center;
  vertical-align: -0.125em;
}

/* Ensure images with explicit dimensions keep ratio */
img[width][height] {
  height: auto;
}

/* Prevent layout shift for inline SVG icons (if any) */
svg.icon,
svg.fa-icon {
  width: 1.25em;
  height: 1.25em;
  display: inline-block;
}

/* Primary color utilities (replace missing Tailwind custom colors) */
:root {
  --xigox-primary: #2563eb;
  --xigox-primary-dark: #1d4ed8;
}

.text-primary { color: var(--xigox-primary) !important; }
.bg-primary { background-color: var(--xigox-primary) !important; }
.bg-primary-dark { background-color: var(--xigox-primary-dark) !important; }
.border-primary { border-color: var(--xigox-primary) !important; }

.hover\:text-primary:hover { color: var(--xigox-primary) !important; }
.hover\:bg-primary:hover { background-color: var(--xigox-primary) !important; }
.hover\:bg-primary-dark:hover { background-color: var(--xigox-primary-dark) !important; }
.hover\:border-primary:hover { border-color: var(--xigox-primary) !important; }

/* Opacity variants */
.bg-primary\/10 { background-color: rgba(37, 99, 235, 0.10) !important; }
.bg-primary\/20 { background-color: rgba(37, 99, 235, 0.20) !important; }
.border-primary\/30 { border-color: rgba(37, 99, 235, 0.30) !important; }
.text-primary\/50 { color: rgba(37, 99, 235, 0.50) !important; }

/* Gradient stops for primary */
.from-primary { --tw-gradient-from: #2563eb; --tw-gradient-to: rgba(37, 99, 235, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-primary { --tw-gradient-to: #2563eb; }
.from-primary-dark { --tw-gradient-from: #1d4ed8; --tw-gradient-to: rgba(29, 78, 216, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-primary-dark { --tw-gradient-to: #1d4ed8; }
.from-primary\/10 { --tw-gradient-from: rgba(37, 99, 235, 0.10); --tw-gradient-to: rgba(37, 99, 235, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-primary\/20 { --tw-gradient-from: rgba(37, 99, 235, 0.20); --tw-gradient-to: rgba(37, 99, 235, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.from-primary-dark\/20 { --tw-gradient-from: rgba(29, 78, 216, 0.20); --tw-gradient-to: rgba(29, 78, 216, 0); --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }

/* Focus ring helper */
.focus\:ring-primary\/20:focus { --tw-ring-color: rgba(37, 99, 235, 0.20) !important; }
.focus\:ring-primary:focus { --tw-ring-color: rgba(37, 99, 235, 1) !important; }

/* Accessibility: Footer link touch targets */
footer a.text-sm.text-gray-400 {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 0;
}

footer a.text-sm.text-gray-400 > i {
  margin-top: 0;
}
