/* ============================================================
   CodebyCarter — industries.css
   Industry-specific mock variants for the Style Lab.
   ============================================================ */

.lab-tmpl{display:none}
.lab-tmpl.is-active{
  display:block;
  animation:tmplIn .5s cubic-bezier(.16,1,.3,1);
}
@keyframes tmplIn{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

/* Each industry brings its own content block, so hide the default grid */
.lab-tmpl .lab-mock-grid{display:none}

/* ---------- Restaurant: menu list ---------- */
.lab-menu{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.lab-menu-row{
  display:flex;align-items:baseline;gap:6px;font-size:13px;
  color:var(--lab-text,#0A0A0F);
}
.lab-menu-name{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}
.lab-menu-dot{flex:1;border-bottom:1px dotted var(--lab-muted,#5A5A66);transform:translateY(-3px);opacity:.5}
.lab-menu-price{
  font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:600;
  color:var(--lab-c1,#A855F7);
}
.lab-menu-price::before{content:"$"}

/* ---------- SaaS: feature grid ---------- */
.lab-features{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.lab-feature{
  padding:10px;border-radius:8px;
  background:rgba(0,0,0,.05);
  display:flex;flex-direction:column;gap:3px;
  color:var(--lab-text,#0A0A0F);
}
.lab-mock[data-theme="cyber"] .lab-feature{background:rgba(255,255,255,.04)}
.lab-feature-icon{
  width:16px;height:16px;border-radius:5px;
  background:linear-gradient(135deg,var(--lab-c1,#A855F7),var(--lab-c2,#EC4899));
  margin-bottom:3px;
}
.lab-feature-name{font-weight:600;font-size:11px;letter-spacing:-.005em}
.lab-feature-desc{
  font-size:10px;line-height:1.35;
  color:var(--lab-muted,#5A5A66);
}

/* ---------- Portfolio: photo gallery ---------- */
.lab-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.lab-photo{
  aspect-ratio:3/4;border-radius:6px;opacity:.92;
  background:linear-gradient(135deg,var(--lab-c1,#A855F7),var(--lab-c3,#FB923C));
}
.lab-photo-2{background:linear-gradient(135deg,var(--lab-c2,#EC4899),var(--lab-c4,#06B6D4))}
.lab-photo-3{background:linear-gradient(135deg,var(--lab-c4,#06B6D4),var(--lab-c1,#A855F7))}

/* ---------- E-commerce: product cards ---------- */
.lab-products{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}
.lab-product{display:flex;flex-direction:column;gap:3px;color:var(--lab-text,#0A0A0F)}
.lab-product-img{
  aspect-ratio:1;border-radius:8px;margin-bottom:5px;
  background:linear-gradient(135deg,var(--lab-c2,#EC4899),var(--lab-c4,#06B6D4));
  opacity:.92;
}
.lab-product:nth-child(2) .lab-product-img{background:linear-gradient(135deg,var(--lab-c3,#FB923C),var(--lab-c1,#A855F7))}
.lab-product:nth-child(3) .lab-product-img{background:linear-gradient(135deg,var(--lab-c4,#06B6D4),var(--lab-c2,#EC4899))}
.lab-product-name{font-size:11px;font-weight:600;letter-spacing:-.005em}
.lab-product-price{font-size:10.5px;color:var(--lab-muted,#5A5A66);font-family:'JetBrains Mono',monospace}

/* ---------- Agency: client logos row ---------- */
.lab-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px;align-items:center}
.lab-logo{
  height:28px;border-radius:4px;
  background:rgba(0,0,0,.06);
  display:grid;place-items:center;
  font-size:9.5px;font-weight:700;
  color:var(--lab-muted,#5A5A66);
  font-family:'JetBrains Mono',monospace;letter-spacing:.08em;
}
.lab-mock[data-theme="cyber"] .lab-logo,
.lab-mock[data-theme="mono"] .lab-logo{background:rgba(255,255,255,.06)}

/* ---------- Creator: article preview list ---------- */
.lab-articles{display:flex;flex-direction:column;margin-top:14px}
.lab-article{
  display:flex;gap:12px;align-items:baseline;padding:10px 0;
  border-top:1px solid var(--lab-border,rgba(10,10,15,.08));
  color:var(--lab-text,#0A0A0F);
}
.lab-article:first-child{border-top:0;padding-top:0}
.lab-article-date{
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;
  color:var(--lab-muted,#5A5A66);min-width:48px;
}
.lab-article-title{font-size:12px;font-weight:500;line-height:1.35;flex:1}

/* ---------- Density adjustments for industry blocks ---------- */
.lab-mock[data-density="tight"] .lab-menu,
.lab-mock[data-density="tight"] .lab-features,
.lab-mock[data-density="tight"] .lab-gallery,
.lab-mock[data-density="tight"] .lab-products,
.lab-mock[data-density="tight"] .lab-logos,
.lab-mock[data-density="tight"] .lab-articles{margin-top:10px}

.lab-mock[data-density="airy"] .lab-menu,
.lab-mock[data-density="airy"] .lab-features,
.lab-mock[data-density="airy"] .lab-gallery,
.lab-mock[data-density="airy"] .lab-products,
.lab-mock[data-density="airy"] .lab-logos,
.lab-mock[data-density="airy"] .lab-articles{margin-top:30px}

.lab-mock[data-density="airy"] .lab-features,
.lab-mock[data-density="airy"] .lab-gallery,
.lab-mock[data-density="airy"] .lab-products,
.lab-mock[data-density="airy"] .lab-logos{gap:14px}

.lab-mock[data-density="airy"] .lab-logo{height:34px}

/* ---------- Make sure new pill row aligns ---------- */
.lab-row-industry .lab-pills{flex:1}