/* Ilementor 3.2.1 archive query renderer — CSS cannot change query, filter or pagination semantics. */
.ilm321-archive{padding-top:24px;padding-bottom:46px;max-width:100%;font-size:var(--ilm321-font-size,16px)}
.ilm321-archive-title{margin:0 0 24px;font-size:clamp(24px,3.5vw,42px);font-weight:750;line-height:1.18;overflow-wrap:anywhere}
.ilm321-archive .ilm321-card-grid{display:grid;grid-template-columns:repeat(var(--ilm321-cols,3),minmax(0,1fr));gap:clamp(12px,2vw,25px);min-width:0;align-items:stretch}
.ilm321-archive .ilm321-card-grid>*{width:100%;max-width:100%;min-width:0;overflow-wrap:anywhere}
.ilm321-archive .ilm321-card-grid img,.ilm321-archive .ilm321-card-grid video{max-width:100%;height:auto}
.ilm321-archive .ilm321-card-grid .ilm-pcard,.ilm321-archive .ilm321-card-grid .ilm-postcard{min-width:0;max-width:100%}
.ilm321-archive .ilm3-pagination{margin:30px 0 20px;overflow-x:auto}
.ilm321-archive .ilm3-pagination ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.ilm321-archive .ilm3-pagination a,.ilm321-archive .ilm3-pagination .current{display:inline-flex;min-height:38px;min-width:38px;align-items:center;justify-content:center;padding:7px 12px;border-radius:9px;border:1px solid var(--ilm321-border,#d9e2e7)}
.ilm321-archive .ilm3-pagination .current{background:var(--ilm321-primary,#018089);color:white}
.ilm321-isolated-filter{display:block;width:100%;min-width:0;margin:0 0 22px}
.ilm321-term-widget{margin-bottom:12px}.ilm321-term-options{display:flex;gap:7px;flex-wrap:wrap}
.ilm321-term-choice{display:inline-flex;align-items:center;gap:7px;min-height:40px;background:#fff;border:1px solid #e0e9ed;border-radius:10px;padding:6px 10px;cursor:pointer}
.ilm321-term-choice img{width:38px;height:38px;max-width:38px;object-fit:cover;border-radius:7px}
.ilm321-filter-help{margin:0 0 7px;font-size:12px;color:#687880}
.ilm301-filter--pill{border-radius:50px!important;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.ilm301-filter--sidebar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));background:#f7fafb;border-left:4px solid var(--ilm321-primary,#018089)}
.ilm301-filter--stacked{flex-direction:column!important;align-items:stretch!important}
.ilm301-filter--minimal{background:transparent!important;border:0!important;border-bottom:1px solid #d7dfe2!important;border-radius:0!important}
.ilm301-filter--compact{padding:9px!important;gap:6px!important}.ilm301-filter--compact .ilm-input,.ilm301-filter--compact .ilm-select{padding:7px!important}
.ilm301-filter--glass{background:rgba(255,255,255,.76)!important;backdrop-filter:blur(16px) saturate(145%);border:1px solid rgba(255,255,255,.65)!important}
.ilm321-price-range{display:flex;flex-wrap:wrap;gap:10px;align-items:center;min-width:0}.ilm321-price-range label{display:grid;gap:6px;min-width:120px;flex:1}
.ilm321-price-range input[type=range]{width:100%;accent-color:var(--ilm321-primary,#018089)}
@media(max-width:980px){.ilm321-archive .ilm321-card-grid{grid-template-columns:repeat(min(3,var(--ilm321-cols,3)),minmax(0,1fr))}}
@media(max-width:680px){.ilm321-archive .ilm321-card-grid{grid-template-columns:repeat(min(2,var(--ilm321-cols,3)),minmax(0,1fr));gap:10px}.ilm301-filter--sidebar{grid-template-columns:1fr}}
@media(max-width:400px){.ilm321-archive .ilm321-card-grid{grid-template-columns:1fr}}

/* UI hotfix: theme-managed content always has an intact, visible fallback. */
.ilm321-archive .ilm321-archive-runtime{width:100%;min-width:0;max-width:100%;isolation:isolate}
.ilm321-archive .ilm321-archive-design{width:100%;max-width:100%;min-width:0;isolation:isolate;contain:layout style;overflow-x:clip}
.ilm321-archive .ilm321-archive-design[hidden]{display:none!important}
.ilm321-archive .ilm321-owned-part{width:100%;max-width:100%;min-width:0}
.ilm321-archive .ilm321-owned-part:empty{display:none}
.ilm321-archive .ilm321-card-grid{display:grid!important;grid-template-columns:repeat(var(--ilm321-cols,3),minmax(0,1fr))!important;min-width:0!important;max-width:100%!important;gap:clamp(12px,2vw,25px)!important}
.ilm321-archive .ilm321-card-grid>*{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
@media(max-width:980px){.ilm321-archive .ilm321-card-grid{grid-template-columns:repeat(min(3,var(--ilm321-cols,3)),minmax(0,1fr))!important}}
@media(max-width:680px){.ilm321-archive .ilm321-card-grid{grid-template-columns:repeat(min(2,var(--ilm321-cols,3)),minmax(0,1fr))!important;gap:10px!important}}
@media(max-width:400px){.ilm321-archive .ilm321-card-grid{grid-template-columns:1fr!important}}

/* Keep malformed fixed-width AI wrappers from expanding archive columns. */
/* 3.2.1.2: Do NOT force max-width:100%!important onto every AI-owned element.
   That declaration overrode AI max-width:1240px, making the entire archive full width.
   Keep overflow safety without preventing the actual custom layout. */
.ilm321-archive .ilm321-archive-design,
.ilm321-archive .ilm321-archive-design :where(*, *::before, *::after){box-sizing:border-box;min-width:0;overflow-wrap:break-word}
.ilm321-archive .ilm321-archive-design :where(img,video,svg,iframe,table){max-width:100%;height:auto}
/* Default/fallback layout stays aligned with footer, not viewport edges. */
.ilm321-archive .ilm321-archive-native,
.ilm321-archive .ilm321-archive-fallback{
  width:calc(100% - 40px);
  max-width:var(--ilm321-content-width,1240px);
  margin-inline:auto;
}
.ilm321-archive .ilm321-archive-design[data-ilm321-mount]{
  width:100%;max-width:100%;min-width:0;overflow-x:clip;
}
/* Code from Khả năng mới can set max-width on an inner shell independently.
   Default layout when there is no inner shell remains safely centered. */
.ilm321-archive .ilm321-archive-design[data-ilm321-mount] > .ilm321-owned-part{
  width:calc(100% - 40px);max-width:var(--ilm321-content-width,1240px);
  margin-inline:auto;
}
@media(max-width:767px){
  .ilm321-archive .ilm321-archive-native,
  .ilm321-archive .ilm321-archive-fallback,
  .ilm321-archive .ilm321-archive-design[data-ilm321-mount] > .ilm321-owned-part{width:calc(100% - 24px)}
}
