/* SimplyIrfan Magazine v2.10.22 — Sliding card metadata and category badge fix.
   This file loads after the existing footer, homepage, single-post and mobile styles. */

/* Featured strip slider: keep title and metadata together at the bottom of the image.
   The legacy title was absolutely positioned while .traditional-meta stayed in normal
   flow, which left the author/reading-time row stranded at the top of the card. */
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy {
  position: absolute !important;
  z-index: 2 !important;
  inset: auto 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 24px clamp(16px, 2vw, 28px) 20px !important;
  color: #fff !important;
  text-align: left !important;
  pointer-events: none;
}
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > h3 {
  position: static !important;
  inset: auto !important;
  order: 1 !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: clamp(16px, 1.5vw, 21px) !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  text-align: left !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .55) !important;
}
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > h3 > a {
  color: #fff !important;
  text-decoration: none !important;
  pointer-events: auto;
}
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > .traditional-meta {
  position: static !important;
  inset: auto !important;
  order: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, .94) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  text-align: left !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .7) !important;
}
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > .traditional-meta time,
.home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > .traditional-meta span {
  position: static !important;
  inset: auto !important;
  display: inline !important;
  margin: 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Restore a solid category badge on all sliding card types. This deliberately
   overrides the old rule that hid the Editor's Picks category label. */
.home .si-home-cards--slider > article .eyebrow,
.home .category-story-grid.si-home-cards--slider > .category-story-card .eyebrow {
  position: relative !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: max-content !important;
  max-width: 100% !important;
  min-height: 21px !important;
  margin: 0 0 7px !important;
  padding: 4px 8px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: var(--accent, #1769ed) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
}
.home .editor-grid.si-home-cards--slider > article.editor-card > .editor-copy > .eyebrow {
  order: 0 !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  pointer-events: auto;
}
.home .editor-grid.si-home-cards--slider > article.editor-card > .editor-copy > h3 {
  order: 1 !important;
}
.home .editor-grid.si-home-cards--slider > article.editor-card > .editor-copy > .traditional-meta {
  order: 2 !important;
}
.home .latest-grid.si-home-cards--slider > article.latest-card .eyebrow,
.home .category-story-grid.si-home-cards--slider > .category-story-card .eyebrow {
  margin-bottom: 7px !important;
}

@media (max-width: 700px) {
  .home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy {
    padding: 20px 16px 16px !important;
    gap: 6px !important;
  }
  .home .home-strip-section .story-strip.si-home-cards--slider > article.strip-card > .strip-copy > h3 {
    font-size: 17px !important;
    line-height: 1.28 !important;
  }
}