/* ═══════════════════════════════════════════════════════
   Vitrina Gallery v1.1 — Public CSS
   Variables inyectadas via PHP inline style
   ═══════════════════════════════════════════════════════ */
.vitrina-wrap *,.vitrina-lightbox *{box-sizing:border-box}

/* ── LAYOUT ── */
.vitrina-wrap{display:flex;gap:var(--vit-gap);background:var(--vit-bg);color:var(--vit-text);font-family:inherit;padding:0}

/* ── SIDEBAR ── */
.vitrina-sidebar{width:var(--vit-sidebar-w);flex-shrink:0;position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--vit-accent) transparent}
.vitrina-search-box{position:relative;margin-bottom:16px}
.vitrina-search-box input{width:100%;border:2px solid color-mix(in srgb,var(--vit-accent) 20%,transparent);border-radius:var(--vit-radius);padding:9px 36px 9px 12px;background:var(--vit-card-bg);color:var(--vit-text);font-size:.9rem;transition:border-color .2s}
.vitrina-search-box input:focus{outline:none;border-color:var(--vit-accent)}
.vitrina-search-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--vit-accent);font-size:1.2rem;pointer-events:none}
.vitrina-cat-nav ul{list-style:none;margin:0;padding:0}
.vitrina-cat-nav li{margin-bottom:2px}
.vitrina-cat-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:#fff;border:1px solid #000;border-radius:var(--vit-radius);color:#000;font-size:.88rem;text-align:left;cursor:pointer;transition:all .15s}
.vitrina-cat-btn:hover,.vitrina-cat-btn.active,.vitrina-cat-btn:focus-visible{background:#000;border-color:#000;color:#fff}
.vitrina-cat-btn.is-parent{font-weight:600}
.vitrina-count{background:transparent;color:inherit;border:1px solid currentColor;border-radius:20px;padding:1px 7px;font-size:.78rem;font-weight:600}
/* Cabecera de grupo de categorías (Estancia / Destacados) — etiqueta, no filtro */
.vitrina-cat-grouphead{flex-basis:100%;width:100%;margin:14px 0 3px;list-style:none}
.vitrina-group-label{display:block;padding:2px 12px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--vit-text) 45%,transparent)}

/* ── MAIN ── */
.vitrina-main{flex:1;min-width:0}
.vitrina-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px}
.vitrina-results-count{font-size:.85rem;color:color-mix(in srgb,var(--vit-text) 60%,transparent)}
.vitrina-layout-toggle{display:flex;gap:4px}
.vitrina-layout-btn{background:#fff;border:1px solid #000;border-radius:6px;width:32px;height:32px;font-size:1rem;cursor:pointer;color:#000;transition:all .15s}
.vitrina-layout-btn.active,.vitrina-layout-btn:hover,.vitrina-layout-btn:focus-visible{background:#000;border-color:#000;color:#fff}

/* ── GRID ── */
.vitrina-grid{display:grid;grid-template-columns:repeat(var(--vit-cols),1fr);gap:var(--vit-gap)}
.vitrina-wrap[data-layout="masonry"] .vitrina-grid{align-items:start}

/* ── CARD ── */
.vitrina-card{background:var(--vit-card-bg);border-radius:var(--vit-radius);overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.07);transition:transform .22s,box-shadow .22s;cursor:pointer}
.vitrina-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(0,0,0,.13)}
.vitrina-card-image{position:relative;height:var(--vit-img-h);overflow:hidden}
.vitrina-wrap[data-layout="masonry"] .vitrina-card-image{height:auto;min-height:140px}
/* REAL IMG — lazy nativo funciona perfectamente con object-fit */
.vitrina-card-img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.vitrina-card:hover .vitrina-card-img{transform:scale(1.04)}
.vitrina-wrap[data-layout="masonry"] .vitrina-card-img{height:auto}
.vitrina-badge{position:absolute;top:12px;left:12px;background:var(--vit-accent);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 10px;border-radius:20px;z-index:1}
.vitrina-card-overlay{position:absolute;inset:0;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;transition:background .22s}
.vitrina-card:hover .vitrina-card-overlay{background:rgba(0,0,0,.32)}
.vitrina-open-btn{width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid #000;color:#000;font-size:1.6rem;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.7);transition:opacity .2s,transform .2s,background .15s,color .15s;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.vitrina-open-btn:hover,.vitrina-open-btn:focus-visible{background:#000;color:#fff;border-color:#000}
.vitrina-card:hover .vitrina-open-btn{opacity:1;transform:scale(1)}
.vitrina-card-body{padding:14px 16px 16px}
.vitrina-card-title{margin:0 0 6px;font-size:.95rem;font-weight:700;color:var(--vit-text);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vitrina-card-excerpt{margin:0 0 10px;font-size:.82rem;color:color-mix(in srgb,var(--vit-text) 65%,transparent);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vitrina-card-cats{display:flex;flex-wrap:wrap;gap:5px}
.vitrina-tag{font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:20px;background:#fff;border:1px solid #000;color:#000;cursor:pointer;transition:all .15s}
.vitrina-tag:hover,.vitrina-tag:focus-visible{background:#000;color:#fff;border-color:#000}
.vitrina-no-results{grid-column:1/-1;text-align:center;padding:60px 20px;color:color-mix(in srgb,var(--vit-text) 50%,transparent);font-size:1.05rem}
.vitrina-pagination{text-align:center;margin-top:32px}
.vitrina-load-more{background:#fff;color:#000;border:1px solid #000;border-radius:var(--vit-radius);padding:11px 32px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .18s}
.vitrina-load-more:hover,.vitrina-load-more:focus-visible{background:#000;color:#fff;border-color:#000;transform:translateY(-2px)}
.vitrina-load-more:disabled{opacity:.5;cursor:not-allowed;transform:none}
.vitrina-spinner{grid-column:1/-1;text-align:center;padding:40px;font-size:.9rem;color:color-mix(in srgb,var(--vit-text) 50%,transparent)}

/* ════════════════════════════════════
   LIGHTBOX
   ════════════════════════════════════ */
.vitrina-lb-backdrop{position:fixed;inset:0;background:var(--vit-lightbox-bg);z-index:99998;display:none;animation:vit-fade .25s ease}
.vitrina-lightbox{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;pointer-events:none}
.vitrina-lightbox.is-open{pointer-events:all}

/* Topbar con controles de zoom */
.vitrina-lb-topbar{position:fixed;top:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;z-index:100001;background:rgba(0,0,0,.45);backdrop-filter:blur(8px);border-radius:30px;padding:6px 14px}
.vitrina-lb-close{background:#fff;border:1px solid #000;color:#000;font-size:1.1rem;cursor:pointer;padding:2px 8px;border-radius:50%;transition:all .15s}
.vitrina-lb-close:hover,.vitrina-lb-close:focus-visible{background:#000;color:#fff;border-color:#000}
.vitrina-lb-zoom-ctrl{display:flex;align-items:center;gap:6px}
.vitrina-lb-zoom-ctrl button{background:#fff;border:1px solid #000;color:#000;border-radius:6px;width:28px;height:28px;font-size:1rem;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center}
.vitrina-lb-zoom-ctrl button:hover,.vitrina-lb-zoom-ctrl button:focus-visible{background:#000;color:#fff;border-color:#000}
.vitrina-lb-zoom-pct{color:#fff;font-size:.82rem;min-width:36px;text-align:center}

.vitrina-lb-inner{display:flex;background:var(--vit-card-bg);border-radius:calc(var(--vit-radius)*1.5);overflow:hidden;max-width:980px;width:100%;max-height:88vh;box-shadow:0 30px 90px rgba(0,0,0,.5);animation:vit-up .28s ease;margin-top:44px}
@keyframes vit-fade{from{opacity:0}to{opacity:1}}
@keyframes vit-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.vitrina-lb-media{flex:0 0 55%;display:flex;flex-direction:column;background:#000;overflow:hidden}

/* Contenedor de imagen con zoom */
.vitrina-lb-img-wrap{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:zoom-in;position:relative}
.vitrina-lb-img-wrap.zoomed{cursor:grab}
.vitrina-lb-img-wrap.zoomed:active{cursor:grabbing}
.vitrina-lb-img{max-width:100%;max-height:440px;object-fit:contain;display:block;transform-origin:center;transition:transform .2s ease;user-select:none;pointer-events:none}
/* Al hacer zoom, la imagen puede crecer más */
.vitrina-lb-img-wrap.zoomed .vitrina-lb-img{max-width:none;max-height:none;pointer-events:all}

.vitrina-lb-gallery-thumbs{display:flex;gap:6px;padding:8px;overflow-x:auto;background:rgba(0,0,0,.4);scrollbar-width:thin;flex-shrink:0}
.vitrina-lb-gallery-thumbs img{width:56px;height:56px;object-fit:cover;border-radius:5px;border:2px solid transparent;cursor:pointer;opacity:.7;transition:opacity .15s,border-color .15s;flex-shrink:0}
.vitrina-lb-gallery-thumbs img.active,.vitrina-lb-gallery-thumbs img:hover{opacity:1;border-color:var(--vit-accent)}

.vitrina-lb-info{flex:1;padding:28px 26px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;color:var(--vit-text)}
.vitrina-lb-badge{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--vit-accent);border-radius:20px;padding:3px 12px;align-self:flex-start;display:none}
.vitrina-lb-badge:not(:empty){display:inline-block}
.vitrina-lb-title{margin:0;font-size:1.3rem;font-weight:700;line-height:1.3;color:var(--vit-text)}
.vitrina-lb-cats{display:flex;flex-wrap:wrap;gap:5px}
.vitrina-lb-cats .vitrina-tag{cursor:default}
.vitrina-lb-description{font-size:.9rem;line-height:1.7;color:color-mix(in srgb,var(--vit-text) 80%,transparent);flex:1}
.vitrina-lb-description p{margin:0 0 .8em}
.vitrina-lb-tags{display:flex;flex-wrap:wrap;gap:5px}
.vitrina-lb-link{display:inline-block;background:#fff!important;color:#000!important;border:1px solid #000!important;border-radius:var(--vit-radius)!important;padding:9px 20px!important;font-size:.88rem;font-weight:600;text-decoration:none;align-self:flex-start;margin-top:auto;transition:all .18s}
.vitrina-lb-link:hover,.vitrina-lb-link:focus-visible{background:#000!important;color:#fff!important;border-color:#000!important}

/* Nav btns */
.vitrina-lb-prev,.vitrina-lb-next{position:fixed;background:#fff;border:1px solid #000;color:#000;font-size:1.6rem;cursor:pointer;border-radius:50%;width:46px;height:46px;display:flex;align-items:center;justify-content:center;transition:all .15s;z-index:100000}
.vitrina-lb-prev:hover,.vitrina-lb-next:hover,.vitrina-lb-prev:focus-visible,.vitrina-lb-next:focus-visible{background:#000;color:#fff;border-color:#000}
.vitrina-lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.vitrina-lb-next{right:16px;top:50%;transform:translateY(-50%)}

/* ── Responsive ── */
@media(max-width:900px){
  .vitrina-wrap{flex-direction:column}
  .vitrina-sidebar{width:100%;position:static;max-height:none}
  .vitrina-cat-nav ul{display:flex;flex-wrap:wrap;gap:6px}
  .vitrina-cat-btn{width:auto;border:1px solid #000;border-radius:var(--vit-radius);padding:6px 12px}
  .vitrina-lb-inner{flex-direction:column;max-height:95vh;margin-top:52px}
  .vitrina-lb-media{flex:0 0 auto}
  .vitrina-lb-img{max-height:240px}
  .vitrina-lb-prev{left:4px}
  .vitrina-lb-next{right:4px}
}
@media(max-width:600px){
  .vitrina-grid{grid-template-columns:repeat(2,1fr)}
  .vitrina-lb-topbar{width:calc(100% - 32px)}
}

/* ── Modos de ancho ── */
/* width_mode=inherit: nada, hereda del tema */
.vitrina-wrap--custom {
  max-width: var(--vit-max-width);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}
/* width_mode=fullwidth: rompe el contenedor padre */
.vitrina-wrap--fullwidth {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}