.main-collection-container {
  background-color: rgb(var(--color-background));
}

.main-collection {
  padding-block: 40px;
}

.main-collection__no-products-tips {
  color: rgb(var(--color-text));
}

.main-collection__list {
  margin-block-end: 40px;
  overflow: visible;
}

@media (max-width: 959px) {
  .main-collection__list {
    margin-block-end: 20px;
  }
}

@media (max-width: 959px) {
  .main-collection {
    padding-block: 20px;
  }
}

@media (min-width: 960px) {
  .main-collection {
    display: grid;
  }

  .main-collection .main-collection__products {
    grid-area: list;
  }

  .main-collection .facets-filtering {
    grid-area: filtering;
  }

  .main-collection .facets-sorting {
    grid-area: sorting;
  }

  .main-collection .facets-count {
    grid-area: count;
  }

  .main-collection.facets-layout-horizontal {
    grid-template:
      "filtering sorting count"
      "list list list" /
      1fr auto auto;
    row-gap: 40px;
  }

  .main-collection.facets-layout-vertical {
    grid-template:
      "count count sorting" 10px
      "list list list" /
      256px auto auto;
    gap: 40px;
  }

  .main-collection.facets-layout-vertical.enable-filtering {
    grid-template:
      "filtering count sorting" 10px
      "filtering list list" /
      256px auto auto;
  }

  .main-collection.facets-layout-drawer {
    grid-template:
      "filtering sorting count"
      "list list list" /
      1fr auto auto;
  }
}

/* CERAMMI filters: keep shape, decoration, and price controls together in a clear sidebar. */
.main-collection>theme-facets-form{display:contents}
.main-collection>theme-facets-form.hidden-mobile{display:none}
.main-collection>theme-facets-form.hidden-desktop{display:contents}
.main-collection .cerammi-collection-filter{grid-area:filtering;align-self:start;min-width:0}
.main-collection .main-collection__products{grid-area:list;min-width:0}
.main-collection .facets-sorting{grid-area:sorting}
.main-collection .facets-count{grid-area:count}
@media(min-width:960px){
  .main-collection.facets-layout-vertical,
  .main-collection.facets-layout-vertical.enable-filtering,
  .main-collection.facets-layout-horizontal,
  .main-collection.facets-layout-drawer{
    display:grid;
    grid-template-columns:minmax(230px,260px) minmax(0,1fr);
    grid-template-areas:"filtering sorting" "filtering count" "filtering list";
    align-items:start;
    column-gap:clamp(26px,3vw,46px);
    row-gap:18px;
  }
  .main-collection .cerammi-filter-details{position:sticky;top:24px}
}
@media(max-width:959px){
  .main-collection.facets-layout-vertical,
  .main-collection.facets-layout-vertical.enable-filtering,
  .main-collection.facets-layout-horizontal,
  .main-collection.facets-layout-drawer{display:flex;flex-direction:column;gap:18px}
  .main-collection .cerammi-filter-details{position:relative}
}
.cerammi-filter-details{padding:19px 18px;background:#f7f5ee;border:1px solid #d8d1c4;color:#292f2c}
.cerammi-filter-details>summary{display:flex;justify-content:space-between;align-items:baseline;gap:12px;cursor:pointer;list-style:none;font:400 21px/1.2 Georgia,"Times New Roman",serif}
.cerammi-filter-details>summary::-webkit-details-marker{display:none}
.cerammi-filter-summary-note{color:#706b61;font:10px/1.4 Arial,sans-serif;letter-spacing:.04em}
.cerammi-filter-content{padding-top:15px}
.cerammi-filter-intro{margin:0 0 17px;color:#6a6b63;font:11px/1.65 Arial,sans-serif}
.cerammi-filter-form{display:grid;grid-template-columns:1fr;gap:8px}
.cerammi-filter-form>label,.cerammi-price-fields>label{margin-top:8px;color:#625f58;font:700 9px/1.4 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.cerammi-filter-form select,.cerammi-price-fields input{width:100%;min-height:42px;padding:10px 11px;background:#fff;border:1px solid #cfc8bb;border-radius:0;color:#272d29;font:12px/1.35 Arial,sans-serif}
.cerammi-filter-form select:focus-visible,.cerammi-price-fields input:focus-visible,.cerammi-filter-form button:focus-visible{outline:3px solid #9d382f;outline-offset:2px}
.cerammi-price-fields{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;margin:6px 0 0;padding:12px 0 0;border:0;border-top:1px solid #d4ccbe}
.cerammi-price-fields legend{padding:0;color:#625f58;font:700 9px/1.4 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.cerammi-price-fields legend span{font-weight:400;letter-spacing:0;text-transform:none}
.cerammi-price-fields>label{grid-row:2}
.cerammi-price-fields input{grid-row:3}
.cerammi-filter-actions{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;margin-top:8px}
.cerammi-filter-apply{min-height:44px;padding:12px 14px;background:#55252a;border:1px solid #55252a;color:#fff;cursor:pointer;font:700 10px/1.3 Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.cerammi-filter-apply:hover{background:#7a3030}
.cerammi-filter-clear{padding:8px 4px;background:transparent;border:0;color:#6d625a;cursor:pointer;font:10px/1.4 Arial,sans-serif;text-decoration:underline;text-underline-offset:3px}
.cerammi-filter-error{margin:4px 0 0;color:#9d2f2f;font:11px/1.5 Arial,sans-serif}
@media(max-width:959px){
  .cerammi-filter-details{padding:16px}
  .cerammi-filter-details>summary{font-size:18px}
  .cerammi-filter-summary-note{font-size:9px}
  .cerammi-filter-content{padding-top:12px}
}
