/* Coleção /collections/all — réplica do collection-banner + main-collection (Focal 13) da lelamier.com.
   Medidas de 05/10/2026 (1240 e 390, mesmo viewport dos dois lados). Escopo: .lcoll* (só esta página). */

/* ---------- banner: fil d'ariane + H1 ---------- */
.lcoll-banner { height: 140px; padding: 0 40px; }
.lcoll-banner__inner { position: relative; height: 100%; }
/* (o .lam-breadcrumb do v2/lamier.css é o do tema Woo: 11px cinza, ponto como separador, padding 2.5rem) */
.lcoll-banner .lam-breadcrumb { position: absolute; left: 0; top: 26px; padding: 0; font-size: 13px; line-height: 20px; color: #000; }
.lcoll-banner .lam-breadcrumb__list { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; font-size: 13px; line-height: 20px; color: #000; }
.lcoll-banner .lam-breadcrumb__item + .lam-breadcrumb__item::before { content: "/"; width: auto; height: auto; border-radius: 0; background: none; margin: 0 6px; }
.lcoll-banner .lam-breadcrumb__link { color: #000; text-decoration: none; }
.lcoll-banner__title { position: absolute; left: 0; right: 0; top: 80px; margin: 0; text-align: center;
  font-size: 56px; line-height: 60px; font-weight: 400; letter-spacing: -1px; color: #000; }

/* ---------- facet: filtros à esquerda (265) + grade à direita ---------- */
.lcoll { display: grid; grid-template-columns: 265px 1fr; column-gap: 40px; padding: 68px 40px 80px; align-items: start; }
.lcoll__overlay, .lcoll__close, .lcoll__aside-foot, .lcoll-mobilebar { display: none; }
.lcoll__aside-head { display: flex; align-items: center; justify-content: space-between; }
.lcoll__aside-title { margin: 0 0 25px; font-size: 24px; line-height: 28px; letter-spacing: -0.4px; font-weight: 400; color: #000; }
.lcoll__filter { border-bottom: 1px solid #D9D9D9; }
.lcoll__filter > summary { list-style: none; }
.lcoll__filter > summary::-webkit-details-marker { display: none; }
.lcoll__toggle { display: flex; align-items: center; justify-content: space-between; padding: 21px 0; cursor: pointer;
  font-size: 15px; line-height: 26px; font-weight: 600; color: #000; }
.lcoll__chev { flex-shrink: 0; transition: transform .2s; }
.lcoll__filter[open] > .lcoll__toggle .lcoll__chev { transform: rotate(180deg); }
.lcoll__filter-body { padding: 0 0 24px; }
.lcoll__check { display: flex; align-items: center; padding-left: 8px; font-size: 15px; line-height: 26px; color: #000; cursor: pointer; }
.lcoll__check + .lcoll__check { margin-top: 2px; }
.lcoll__check input { appearance: none; -webkit-appearance: none; flex-shrink: 0; width: 14px; height: 14px; margin: 0 12px 0 0;
  border: 1px solid #999; border-radius: 0; background: #fff; cursor: pointer; }
.lcoll__check input:checked { background: #000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M1 4l3 3 5-6' stroke='%23fff' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") center no-repeat; border-color: #000; }
.lcoll__check input:disabled { opacity: .5; cursor: default; }
.lcoll__price { display: flex; align-items: center; gap: 10px; }
.lcoll__price-field { position: relative; flex: 1; }
.lcoll__price-field span { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: 13px; line-height: 20px; color: rgba(0,0,0,.7); }
.lcoll__price-field input { width: 100%; height: 46px; padding: 0 10px 0 26px; border: 1px solid #D9D9D9; border-radius: 0; font: inherit; font-size: 14px; color: #000; background: #fff; -moz-appearance: textfield; }
.lcoll__price-field input::-webkit-outer-spin-button, .lcoll__price-field input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.lcoll__price-sep { font-size: 14px; line-height: 24px; }
.lcoll__apply { margin-top: 16px; padding: 0; border: 0; background: none; font: inherit; font-size: 15px; color: #000; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.lcoll__meta { display: flex; align-items: center; justify-content: space-between; margin: 0 0 24px; font-size: 15px; line-height: 26px; color: #000; }
.lcoll__sort { position: relative; }
.lcoll__sort-btn { display: inline-flex; align-items: center; gap: 0; padding: 0; border: 0; background: none; font: inherit; font-size: 15px; line-height: 26px; color: #000; cursor: pointer; }
.lcoll__sort-label { color: rgba(0,0,0,.7); padding-right: 7px; }
.lcoll__sort-value { margin-right: 10px; }
.lcoll__sort-pop { position: absolute; right: 0; top: calc(100% + 26px); z-index: 20; min-width: 370px; padding: 18px 25px; background: #fff;
  border: 1px solid #D9D9D9; box-shadow: 0 1px 5px rgba(0,0,0,.1); }
.lcoll__sort-pop[hidden] { display: none; }
.lcoll__sort-pop-title { display: none; }
.lcoll__sort-opt { display: block; width: 100%; padding: 6px 0; border: 0; background: none; font: inherit; font-size: 15px; line-height: 21px; color: #000; text-align: left; cursor: pointer; }
.lcoll__sort-opt.is-selected { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- grade + card ---------- */
.lcoll__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; row-gap: 48px; }
.lcoll-card { display: flex; flex-direction: column; min-width: 0; }
.lcoll-card__media { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #F5F5F5; }
.lcoll-card__link { display: block; height: 100%; }
.lcoll-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .3s; }
.lcoll-card__img--2 { opacity: 0; }
.lcoll-card:hover .lcoll-card__img--2 { opacity: 1; }
.lcoll-card__quick-wrap { position: absolute; left: 10px; right: 10px; bottom: 10px; opacity: 0; transform: translateY(10px); transition: opacity .2s, transform .2s; }
.lcoll-card:hover .lcoll-card__quick-wrap, .lcoll-card__quick-wrap:focus-within { opacity: 1; transform: none; }
.lcoll-card__quick { display: block; width: 100%; height: 54px; padding: 0 30px; border: 1px solid #D9D9D9; border-left: 0; border-right: 0; background: #fff;
  font: inherit; font-size: 15px; line-height: 52px; color: #000; text-align: center; text-decoration: none; cursor: pointer; }
.lcoll-card__meta { margin-top: 24px; text-align: center; }
.lcoll-card__title { display: block; font-size: 15px; line-height: 22.5px; color: #000; text-decoration: none; }
.lcoll-card__rating { display: flex; align-items: center; justify-content: center; height: 26px; margin: 4px 0 5px; }
.lcoll-card__rating svg { display: block; width: 16px; height: 16px; margin-right: 2px; }
.lcoll-card__count { margin-left: 4px; font-size: 16px; line-height: 1; color: #000; }
.lcoll-card__prices { display: flex; justify-content: center; font-size: 15px; line-height: 26px; }
.lcoll-card__price { color: #000; }
.lcoll-card__price--sale { color: #DE2A2A; margin-right: 10px; }
.lcoll-card__price--compare { text-decoration: line-through; }
.lcoll-card__colors { margin: 8px 0 0; font-size: 14px; line-height: 24px; color: rgba(0,0,0,.7); }

/* ---------- mobile (Focal: < 1000 a coluna de filtros vira gaveta) ---------- */
@media (max-width: 999px) {
  .lcoll-mobilebar { display: flex; position: sticky; top: 0; z-index: 5; height: 48px; background: #fff; border-bottom: 1px solid #D9D9D9; }
  .lcoll-mobilebar__item { flex: 1; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 0; border: 0; background: none;
    font: inherit; font-size: 14px; line-height: 24px; color: #000; cursor: pointer; }
  .lcoll-mobilebar__item + .lcoll-mobilebar__item { border-left: 1px solid #D9D9D9; }
  .lcoll-banner { height: auto; padding: 38px 24px 0; }
  .lcoll-banner .lam-breadcrumb { display: none; }
  .lcoll-banner__title { position: static; font-size: 36px; line-height: 40px; letter-spacing: -0.9px; }
  .lcoll { display: block; padding: 38px 24px 48px; }
  .lcoll__meta { justify-content: center; margin-bottom: 16px; font-size: 14px; line-height: 24px; }
  .lcoll__sort-btn { display: none; }
  .lcoll__aside { position: fixed; top: 0; bottom: 0; left: 0; z-index: 1001; width: min(347px, 89vw); padding: 24px 24px 0; overflow-y: auto;
    background: #fff; transform: translateX(-100%); transition: transform .3s; display: flex; flex-direction: column; }
  .lcoll.is-filters-open .lcoll__aside { transform: none; }
  .lcoll__overlay { display: block; position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.3); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
  .lcoll.is-filters-open .lcoll__overlay, .lcoll.is-sort-open .lcoll__overlay { opacity: 1; visibility: visible; }
  .lcoll__close { display: block; padding: 6px; border: 0; background: none; color: #000; cursor: pointer; }
  .lcoll__aside-title { margin: 0; font-size: 20px; line-height: 24px; }
  .lcoll__aside-head { padding-bottom: 20px; border-bottom: 1px solid #D9D9D9; }
  .lcoll__toggle { padding: 18px 0; font-size: 14px; line-height: 24px; }
  .lcoll__check { font-size: 14px; line-height: 24px; }
  .lcoll__aside-foot { display: block; position: sticky; bottom: 0; margin-top: auto; padding: 16px 0 24px; background: #fff; }
  .lcoll__results { display: block; width: 100%; height: 48px; border: 0; background: #000; color: #fff; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
  .lcoll__sort-pop { position: fixed; left: 0; right: 0; top: auto; bottom: 0; z-index: 1001; min-width: 0; padding: 24px; border: 0; box-shadow: none; }
  .lcoll__sort-pop-title { display: block; margin: 0 0 12px; font-size: 20px; line-height: 24px; color: #000; }
  .lcoll__grid { margin: 0 -12px; column-gap: 12px; row-gap: 32px; }
  .lcoll-card__meta { margin-top: 16px; }
  .lcoll-card__title { font-size: 14px; line-height: 22.4px; }
  .lcoll-card__rating { height: 21px; margin: 6px 0 4px; }
  .lcoll-card__rating svg { width: 13px; height: 13px; margin-right: 1px; }
  .lcoll-card__count { font-size: 14px; }
  .lcoll-card__prices { font-size: 14px; line-height: 24px; }
  .lcoll-card__colors { margin-top: 5px; font-size: 13px; line-height: 22px; }
  /* no toque o Focal mostra só o ícone de compra rápida no canto da foto */
  .lcoll-card__quick-wrap { left: auto; right: 8px; bottom: 8px; opacity: 1; transform: none; }
  .lcoll-card__quick { width: 36px; height: 36px; padding: 0; border: 0; font-size: 0; line-height: 0;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.4'%3E%3Cpath d='M3 6h11l-1 11H4L3 6z'/%3E%3Cpath d='M6 6V4.5a2.5 2.5 0 0 1 5 0V6'/%3E%3Cpath d='M15 1v6M12 4h6'/%3E%3C/svg%3E") center no-repeat; }
}
@media (min-width: 750px) and (max-width: 999px) {
  .lcoll { padding-left: 40px; padding-right: 40px; }
  .lcoll__grid { margin: 0; column-gap: 24px; row-gap: 40px; }
}