/* =========================================================
   ALC Carousels — consolidated styles (large / medium / small)
   ========================================================= */

/* ---------- Base ---------- */
.alc-swiper { position: relative; width: 100%; }
.alc-swiper .swiper { width: 100%; }
.alc-swiper .swiper-button-prev,
.alc-swiper .swiper-button-next,
.alc-swiper .swiper-pagination { display: none !important; }

.alc-card {
  background: #fff;
  border-radius: 18px;
  overflow: hidden;
  /* box-shadow: 0 4px 14px rgba(0,0,0,.08); keep card depth per design */
  box-shadow: none; /* design specifies no shadow */
}
.alc-card__link { display: block; color: inherit; text-decoration: none; }
.alc-card__media { position: relative; margin: 0; width: 100%; background: #eee; overflow: visible; border-radius: 18px; }
.alc-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 18px; }
.alc-card__body { padding: 12px 14px 16px; }
.alc-card__title { margin: 0; font-weight: 800; font-size: 1.125rem; line-height: 1.25; }

.alc-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.22); pointer-events: none; border-radius: 18px; }

/* Pills / badges (global shape; shadows removed) */
.alc-badge,
.alc-like,
.alc-chip { box-shadow: none !important; border:none !important;}
.alc-badge {
  position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; color: #fff; background: rgba(49,63,78,1); border-radius: 14px;
  font-weight: 800; font-size: .85rem; line-height: 1;
}
.alc-badge--date { top: 12px; left: 12px; }

/* ---------- Like (vertical) generic ---------- */
.alc-like{
  position: absolute; top: 12px; right: 12px; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 7px; padding: 8px 12px; border-radius: 12px;
  background: rgba(49,63,78, .65); color: #fff; font-weight: 800; font-size: .9rem;
}
.alc-like .fa-heart{ font-size: .95rem; }
.alc-like__count{ font-size: .85rem; line-height: 1; }

/* ---------- Size switches for media aspect ---------- */
.alc-swiper.size-small  .alc-card__media { aspect-ratio: 1 / 1; }
.alc-swiper.size-medium .alc-card__media { aspect-ratio: 1 / 1; }
.alc-swiper.size-large  .alc-card__media { aspect-ratio: 16 / 9; }

/* =========================================================
   LARGE
   ========================================================= */
.size-large .alc-card { border-radius: 18px; overflow: hidden; }
.size-large .alc-card__media { position: relative; overflow: hidden; }
.size-large .alc-card__media img { display:block; width:100%; height:100%; object-fit:cover; }
.size-large .alc-overlay{ position:absolute; inset:0; background:rgba(0,0,0,.28); z-index:1; }

.size-large .alc-badge--cat {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  background: rgba(49, 63, 78, .95);
  color: #fff;
  font-weight: 500;
  font-size: .6rem;
  line-height: 1;
  padding: 6px 10px 5px 10px;
  border-radius: 12px;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.size-large .alc-like{ z-index:3; }
.size-large .alc-title-band{
  position:absolute; left:12px; right:12px; bottom:55%;
  transform:translateY(50%); z-index:2; color:#fff; font-weight:800; font-size:1.25rem;
}
.size-large .alc-date-band{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  background:rgba(49,63,78,1); color:#fff; font-weight:normal;
  font-size:.95rem; padding:16px; border-radius:0 0 18px 18px;
}

/* =========================================================
   MEDIUM (mobile list: date chip TL, vertical like TR, title below)
   ========================================================= */
.alc-swiper.size-medium .swiper { overflow: visible; }
.size-medium .alc-card { border-radius: 18px; overflow: hidden; }
.size-medium .alc-card__media { position: relative; }
.size-medium .alc-badge--cat { display: none; } /* not used in medium */

/* Date chip — single line ellipsis */
.size-medium .alc-chip--date{
  position: absolute; top: 12px; left: 12px; z-index: 2;
  background: rgba(49,63,78, .65); color:#fff; font-weight:800;
  font-size:.5rem; line-height:1; padding: 6px 10px 5px 10px; border-radius:12px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 66%;
}
.size-medium .alc-like{ top:12px; right:12px; }
.size-medium .alc-card__body { padding: 12px 12px 18px; }

/* Title — two-line clamp */
.size-medium .alc-card__title{
  font-size: 1.05rem; line-height: 1.25; font-weight: 800; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.size-medium .swiper { padding: 0 6px; }
.size-medium .swiper-slide { width: auto; }

/* =========================================================
   SMALL (square cards; 2 rows; ~3 per row with a peeking 4th)
   ========================================================= */
.alc-swiper.size-small .swiper { overflow: visible; padding: 0 6px; }

/* IMPORTANT: let Swiper compute widths for grid; do NOT force width:auto */
.alc-swiper.size-small .swiper-slide { /* intentionally empty */ }

.size-small .alc-card{ border-radius: 18px; overflow: hidden; }
.size-small .alc-card__media{ position: relative; }

/* clean image; no chips on small */
.size-small .alc-overlay,
.size-small .alc-badge,
.size-small .alc-like { display: none !important; }

.size-small .alc-card__body{ padding: 10px 10px 14px; }

/* Title clamp already desired on small */
.size-small .alc-card__title{
  font-size: 1rem; line-height: 1.25; font-weight: 800; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* =======================
   Prevent outer overflow in Elementor modules
   ======================= */

/* Swiper outer container (shortcode wrapper) */
.alc-swiper { overflow: hidden; }

/* Medium template specific fix */
.alc-swiper.size-medium .swiper {
  overflow: hidden !important;
  padding: 0 6px;
}

/* Allow slides to peek internally without causing horizontal scroll */
.alc-swiper.size-medium .swiper-wrapper { overflow: visible; }

/* Safety: never let Elementor columns clip rounding shadows */
.elementor-widget-shortcode .alc-swiper {
  max-width: 100%;
  overflow-x: hidden;
}