/* XPL Filterable Archive — v1.12.1 (scoped; media fix + pagination polish) */

.xpl-archive{ --xpl-blue:#0350d8; --xpl-text:#0e234e; }
.xpl-archive *{ box-sizing:border-box; }
.xpl-archive a{ color:inherit; text-decoration:none; }

/* Layout */
.xpl-archive .xpl-archive__inner{ display:grid; grid-template-columns: 280px 1fr; gap:28px; align-items:start; }

/* Sidebar */
.xpl-archive .xpl-archive__filters{
  position: sticky;
  top: var(--xpl-filters-desktop-top, calc(var(--xpl-adminbar-h,0px) + var(--xpl-header-h,0px) + 20px));
  max-height: calc(100vh - (var(--xpl-filters-desktop-top, 0px) + 40px));
  overflow:auto; background:#fff; border:1px solid rgba(12,33,76,.10); border-radius:12px; padding:16px; z-index:100000;
}
.xpl-archive .xpl-archive__content{ min-width:0; }

/* Toolbar */
.xpl-archive .xpl-archive__toolbar{ display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-bottom:16px; }
.xpl-archive .xpl-archive__toggle{ display:none; border:1px solid rgba(12,33,76,.2); background:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; }
.xpl-archive .xpl-archive__clear{ border:none; background:transparent; color:var(--xpl-blue); cursor:pointer; text-decoration:underline; }

/* Filters UI */
.xpl-archive .xpl-filters__wrap{ display:flex; flex-direction:column; gap:18px; color:var(--xpl-text); }
.xpl-archive .xpl-filter__title{ font-weight:600; color:var(--xpl-text); margin-bottom:8px; }
.xpl-archive .xpl-filter__list{ display:flex; flex-direction:column; gap:8px; }
.xpl-archive .xpl-filter__item{ display:flex; align-items:center; gap:8px; color:var(--xpl-text); }
.xpl-archive .xpl-filter__item.is-disabled{ opacity:.35; pointer-events:none; }

/* Grid */
.xpl-archive .xpl-archive__grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:18px; position:relative; }

/* Cards */
.xpl-archive .xpl-card{
  display:flex; flex-direction:column;
  border:1px solid rgba(12,33,76,.12); border-radius:16px; overflow:hidden; min-height:100%; background:#fff;
  transition: box-shadow .25s ease, transform .25s ease;
}

/* --- Featured image visibility fix --- */
.xpl-archive .xpl-card__media{
  position:relative;
  aspect-ratio: 16 / 9;
  background:rgba(12,33,76,.04);
  overflow:hidden;
  /* Neutralize any ratio hacks injected by themes/plugins */
  padding-top: 0 !important;
  height:auto !important;
}
.xpl-archive .xpl-card__imglink{
  display:block;
  position:absolute; inset:0;          /* fill the media box */
  width:100%; height:100%;
  overflow:hidden;
}
.xpl-archive .xpl-card__imglink img{
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block; transition: transform .25s ease;
}
.xpl-archive .xpl-card:hover .xpl-card__imglink img{ transform: scale(1.03); }
.xpl-archive .xpl-card:hover{ box-shadow:0 8px 28px rgba(0,0,0,.08); transform: translateY(-2px); }

.xpl-archive .xpl-card__badges{ position:absolute; left:10px; top:10px; display:flex; flex-wrap:wrap; gap:6px; }
.xpl-archive .xpl-card__badge{ background:var(--xpl-blue); color:#fff; padding:4px 8px; border-radius:3px; font-size:12px; font-weight:500; line-height:1; text-shadow:none; display:inline-block; }

.xpl-archive .xpl-card__body{ display:flex; flex-direction:column; flex:1; padding:14px; color:var(--xpl-text); }
.xpl-archive .xpl-card__product{ font-weight:400; margin-bottom:4px; color:var(--xpl-text); }
.xpl-archive .xpl-card__title{ font-weight:500; margin:0 0 8px 0; font-size:1.05rem; }
.xpl-archive .xpl-card__title a{ color:var(--xpl-text); }
.xpl-archive .xpl-card__title a:hover{ text-decoration:underline; }
.xpl-archive .xpl-card__meta{ margin-top:auto; display:flex; align-items:center; gap:6px; font-weight:400; opacity:1; font-size:.7rem; text-shadow:none; }
.xpl-archive .xpl-card__sep{ opacity:.5; }
.xpl-archive .xpl-archive__empty{ padding:24px; border:1px dashed rgba(12,33,76,.25); border-radius:12px; text-align:center; color:var(--xpl-text); grid-column:1/-1; }

/* Pagination (polished) */
.xpl-archive .xpl-archive__pagination ul,
.xpl-archive .xpl-archive__pagination li{ list-style:none !important; margin:0 !important; padding:0 !important; }
.xpl-archive .xpl-archive__pagination li::before,
.xpl-archive .xpl-archive__pagination li::after,
.xpl-archive .xpl-archive__pagination li::marker{ content:none !important; }

.xpl-archive .xpl-archive__pagination{ display:flex; justify-content:center; margin-top:18px; }
.xpl-archive .xpl-pager{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.xpl-archive .xpl-pager__btn{
  appearance:none; border:1px solid rgba(12,33,76,.16); background:#fff;
  min-width:40px; height:38px; padding:0 12px; border-radius:12px; cursor:pointer;
  font: 500 14px/1 var(--xpl-font, inherit); color: var(--xpl-text);
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease, color .15s ease, transform .05s ease;
  display:inline-flex; align-items:center; justify-content:center;
}
.xpl-archive .xpl-pager__btn:hover{ border-color: rgba(12,33,76,.28); box-shadow:0 2px 10px rgba(0,0,0,.06); }
.xpl-archive .xpl-pager__btn:active{ transform: translateY(1px); }
.xpl-archive .xpl-pager__btn:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(3,80,216,.18); }
.xpl-archive .xpl-pager__btn.is-current{ background: var(--xpl-blue); color:#fff; border-color: var(--xpl-blue); cursor: default; box-shadow:0 4px 16px rgba(3,80,216,.28); }
.xpl-archive .xpl-pager__btn.is-disabled{ opacity:.45; cursor:not-allowed; box-shadow:none; }
.xpl-archive .xpl-pager__dots{ color: rgba(12,33,76,.55); padding:0 2px; user-select:none; }

/* Drawer close (mobile) */
.xpl-archive .xpl-filters__close{
  position: sticky; top:8px; margin-left:auto; display:none;
  align-items:center; justify-content:center; width:34px; height:34px; border-radius:999px;
  border:1px solid rgba(12,33,76,.15); background:#fff; cursor:pointer; box-shadow:0 2px 10px rgba(0,0,0,.05);
}

/* Tablet */
@media (max-width: 980px){
  .xpl-archive .xpl-archive__inner{ grid-template-columns: 1fr; }
  .xpl-archive .xpl-archive__filters{
    position: fixed;
    top: var(--xpl-filters-top, calc(var(--xpl-adminbar-h,0px) + var(--xpl-header-h,0px)));
    bottom:0; left:0; width:min(86vw, 340px); max-width:86vw;
    transform: translateX(-105%); transition: transform .25s ease; z-index:1000000; overflow:auto;
    box-shadow:12px 0 30px rgba(0,0,0,.12);
  }
  .xpl-archive .xpl-archive__filters.is-open{ transform: translateX(0%); }
  .xpl-archive .xpl-archive__toolbar{ justify-content:flex-start; gap:10px; }
  .xpl-archive .xpl-archive__toggle{ display:inline-flex; }
  .xpl-archive .xpl-archive__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .xpl-archive .xpl-filters__close{ display:inline-flex; }
}

/* Mobile */
@media (max-width: 600px){
  .xpl-archive .xpl-archive__grid{ grid-template-columns: 1fr; }
  .xpl-archive .xpl-pager{ gap:8px; }
  .xpl-archive .xpl-pager__btn{ min-width:36px; height:36px; padding:0 10px; border-radius:10px; }
}
/* ---------------------------
   MANUAL LIST (no filters)
   --------------------------- */
.xpl-archive--manual .xpl-archive__inner{
  /* kill the 280px filters column */
  display:block;
}
.xpl-archive--manual .xpl-archive__content{
  width:100%;
}

/* allow optional [xpl_post_list columns="1|2|3"] */
.xpl-archive--manual .xpl-archive__grid{
  grid-template-columns: repeat(var(--xpl-manual-cols, 3), minmax(0,1fr));
}

/* responsive */
@media (max-width: 980px){
  .xpl-archive--manual .xpl-archive__grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 600px){
  .xpl-archive--manual .xpl-archive__grid{
    grid-template-columns: 1fr;
  }
}

/* hard safety: make sure titles never collapse vertically */
.xpl-archive--manual .xpl-card__title,
.xpl-archive--manual .xpl-card__title a{
  white-space:normal !important;
  writing-mode:horizontal-tb !important;
}