/* Card Base Module - External Styles */
/* Minimal styles - leveraging theme CSS for common styles */
/* Only includes card-specific accessibility and print styles */

/* Print styles */
@media print {
  .c-card {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .c-card__btn,
  .c-card__link {
    text-decoration: underline !important;
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .c-card {
    border-width: 2px !important;
  }

  .c-card__btn {
    border: 2px solid currentColor;
  }
}

/* Forced colors mode (Windows High Contrast) */
@media (forced-colors: active) {
  .c-card {
    border: 1px solid;
  }

  .c-card__btn {
    border: 1px solid;
    forced-color-adjust: none;
  }
}

/* Utility classes for card grid layouts - extends theme grid */
/* Using explicit column counts to prevent partial cards from being visible */
.c-card-grid {
  display: grid;
  gap: var(--grid-gap, var(--spacing, 1.5rem));
  /* Mobile: single column */
  grid-template-columns: 1fr;
}

/* Tablet: 2 columns */
@media (min-width: 641px) {
  .c-card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Desktop: 3 columns by default */
@media (min-width: 1025px) {
  .c-card-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Explicit column count modifiers */
.c-card-grid--2 {
  --grid-cols-desktop: 2;
}
.c-card-grid--3 {
  --grid-cols-desktop: 3;
}
.c-card-grid--4 {
  --grid-cols-desktop: 4;
}

@media (min-width: 1025px) {
  .c-card-grid--2 { grid-template-columns: repeat(2, 1fr); }
  .c-card-grid--3 { grid-template-columns: repeat(3, 1fr); }
  .c-card-grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* Masonry layout support for cards */
.c-card-masonry {
  columns: 300px auto;
  column-gap: var(--spacing, 1.5rem);
}

.c-card-masonry .c-card {
  break-inside: avoid;
  margin-bottom: var(--spacing, 1.5rem);
}