/* ============================================================
   VelvetTicino — Listing page styles
   ============================================================ */

/* Hero */
.vt-listing-hero{position:relative;overflow:hidden;padding-top:clamp(130px,16vh,180px);padding-bottom:clamp(48px,7vw,90px);background:var(--vt-bg-2);}
.vt-listing-hero-bg{position:absolute;inset:0;z-index:0;opacity:.55;}
.vt-listing-hero-bg .vt-ph{position:absolute;inset:0;}
.vt-listing-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,19,31,.7),var(--vt-bg) 96%),linear-gradient(90deg,var(--vt-bg-2),transparent 60%);}
.vt-listing-hero-inner{position:relative;z-index:1;}
.vt-listing-search{max-width:760px;}
.vt-listing-search .vt-search-bar{padding:7px 7px 7px 18px;}
.vt-listing-pop{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;}

/* Toolbar */
.vt-listing-body{padding-block:clamp(36px,5vw,64px) var(--vt-section-sm);}
.vt-listing-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-bottom:22px;border-bottom:1px solid var(--vt-line);}
.vt-listing-toolbar-l,.vt-listing-toolbar-r{display:flex;align-items:center;gap:16px;}
.vt-listing-toolbar-r .vt-ico{color:var(--vt-gold);width:16px;height:16px;}
.vt-select-sm{padding:.6em 2.4em .6em 1em;font-size:.78rem;width:auto;}

/* AI semantic search */
.vt-ai-search{position:relative;display:flex;align-items:center;gap:8px;background:linear-gradient(120deg,rgba(201,164,92,.1),var(--vt-surface) 70%);border:1px solid var(--vt-line-gold);border-radius:99px;padding:7px 7px 7px 20px;}
.vt-ai-search-spark{width:18px;height:18px;color:var(--vt-gold);flex:0 0 auto;}
.vt-ai-search input{flex:1;min-width:0;background:none;border:0;outline:none;font-family:var(--vt-sans);font-weight:300;font-size:.92rem;color:var(--vt-text);padding:.55em 0;}
.vt-ai-search input::placeholder{color:var(--vt-text-mute);}
.vt-ai-search-status{min-height:20px;margin-top:10px;font-size:.78rem;color:var(--vt-text-mute);display:flex;align-items:center;gap:8px;}
.vt-ai-search-status svg{width:14px;height:14px;color:var(--vt-gold);}
.vt-ai-search-status.is-loading{color:var(--vt-text-soft);}
.vt-ai-search-status.is-ok{color:var(--vt-sand);}
.vt-ai-examples{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;}
.vt-chip-sm{font-size:.72rem;padding:.4em .8em;}

/* Filter toggle — refined, always available */
.vt-filter-toggle{display:inline-flex;align-items:center;gap:9px;}
.vt-filter-toggle .vt-ft-ico{width:15px;height:15px;color:var(--vt-gold);transition:transform .45s var(--vt-ease);}
.vt-listing-layout.is-filters-hidden .vt-filter-toggle .vt-ft-ico{transform:rotate(180deg);}

/* Active filters */
.vt-active-filters{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-top:18px;}
.vt-active-chips{display:flex;gap:8px;flex-wrap:wrap;}

/* Layout */
.vt-listing-layout{display:grid;grid-template-columns:268px 1fr;gap:clamp(28px,3.5vw,56px);align-items:start;transition:grid-template-columns .45s var(--vt-ease),gap .45s var(--vt-ease);}

/* Filter panel */
.vt-filter-panel{position:sticky;top:96px;display:flex;flex-direction:column;gap:6px;overflow:hidden;min-width:0;transition:opacity .35s var(--vt-ease);}
.vt-filter-group{border-bottom:1px solid var(--vt-line);padding:18px 0;}
.vt-filter-group:first-child{padding-top:4px;}
.vt-filter-group h5{font-family:var(--vt-sans);font-weight:600;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--vt-gold);margin:0 0 16px;}
.vt-filter-list{display:flex;flex-direction:column;gap:12px;}
.vt-filter-list.vt-filter-wrap{flex-direction:row;flex-wrap:wrap;gap:8px;}
.vt-filter-count{margin-left:auto;font-size:.7rem;color:var(--vt-text-faint);}
.vt-filter-toggles{display:flex;flex-direction:column;gap:14px;}
/* Gender segmented control */
.vt-gender-seg{display:flex;gap:4px;background:rgba(248,246,242,.04);border:1px solid var(--vt-line);border-radius:999px;padding:4px;}
.vt-gseg-opt{flex:1;text-align:center;padding:9px 6px;border-radius:999px;font-family:var(--vt-sans);font-weight:600;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--vt-platinum);cursor:pointer;transition:background .25s var(--vt-ease),color .25s var(--vt-ease);}
.vt-gseg-opt:hover{color:var(--vt-soft-white);}
.vt-gseg-opt.is-active{background:rgba(201,164,92,.14);color:var(--vt-gold);box-shadow:inset 0 0 0 1px rgba(201,164,92,.4);}

/* Top selection */
.vt-topsel-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:22px;}

/* Skeleton card */
.vt-sk-card{border:1px solid var(--vt-line);border-radius:var(--vt-r);overflow:hidden;background:var(--vt-surface);}
.vt-sk-media{aspect-ratio:3/4.05;}
.vt-sk-body{padding:18px 20px;display:flex;flex-direction:column;gap:10px;}
.vt-sk-line{height:12px;border-radius:3px;}
.vt-sk-line.sk-60{width:60%;}.vt-sk-line.sk-40{width:40%;}.vt-sk-line.sk-80{width:80%;}

.vt-listing-compliance{margin-top:46px;padding-top:24px;border-top:1px solid var(--vt-line);max-width:680px;}

/* Mobile drawer */
.vt-filter-drawer{position:fixed;inset:0;z-index:130;visibility:hidden;}
.vt-filter-drawer.is-open{visibility:visible;}
.vt-fd-scrim{position:absolute;inset:0;background:rgba(5,10,17,.72);backdrop-filter:blur(3px);opacity:0;transition:.4s var(--vt-ease);}
.vt-filter-drawer.is-open .vt-fd-scrim{opacity:1;}
.vt-fd-panel{position:absolute;top:0;bottom:0;left:0;width:min(88vw,380px);background:var(--vt-bg-2);border-right:1px solid var(--vt-line-gold);transform:translateX(-100%);transition:transform .45s var(--vt-ease);display:flex;flex-direction:column;}
.vt-filter-drawer.is-open .vt-fd-panel{transform:none;}
.vt-fd-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--vt-line);}
.vt-fd-body{flex:1;overflow-y:auto;padding:8px 24px 24px;}
.vt-fd-foot{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:18px 24px;border-top:1px solid var(--vt-line);}

@media (min-width:981px){
  /* Desktop collapse of the filter sidebar */
  .vt-listing-layout.is-filters-hidden{grid-template-columns:0px 1fr;gap:0;}
  .vt-listing-layout.is-filters-hidden .vt-filter-panel{opacity:0;pointer-events:none;}
}
@media (min-width:1300px){
  .vt-listing-layout.is-filters-hidden .vt-listing-results .vt-grid.vt-cols-3{grid-template-columns:repeat(4,1fr);}
}

@media (max-width:980px){
  .vt-listing-layout{grid-template-columns:1fr;}
  .vt-filter-panel{display:none;}
}
@media (max-width:680px){
  .vt-listing-toolbar-r .vt-label{display:none;}
}
