/* ===== LAMA SmartEats — UI refresh (mobile-first) ===== */
.lama-basket [hidden]{display:none !important;}

/* Палитра — можеш да смениш тези променливи за брандинг */
:root{
  --lb-bg: #fff;
  --lb-soft: #f7f6f4;         /* фон около картата / drop */
  --lb-ink: #111;

  --lb-accent: #0f8f5f;       /* основен */
  --lb-accent-ink: #ffffff;

  --lb-success-bg: #e7f7ec;
  --lb-success-ink:#0a8f3d;
  --lb-warn-bg:    #fff6d9;
  --lb-warn-ink:   #8a6d00;
  --lb-danger-bg:  #ffe8e8;
  --lb-danger-ink: #b00020;

  --lb-border: #e9e6e0;
  --lb-shadow: 0 10px 28px rgba(0,0,0,.06);
}

/* Контейнер/карта */
.lama-basket__card{
  background: var(--lb-bg);
  border: 1px solid var(--lb-border);
  border-radius: 18px;
  padding: 16px;
  box-shadow: var(--lb-shadow);
  max-width: 760px;
  margin: 0 auto;
}

/* Заглавие + оставащи */
.lama-basket__hero{
  display:flex;justify-content:space-between;align-items:center;
  gap:12px;margin-bottom: 12px;
}
.lama-basket__title{
  display:flex; align-items:center; gap:10px;
  font-weight:800; font-size:20px; letter-spacing:.2px; color:var(--lb-ink);
}
.lama-basket__logo{
  width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex:0 0 28px;
}
@media (max-width: 520px){
  .lama-basket__title{ font-size:18px; }
  .lama-basket__logo { width: 24px; height: 24px; flex:0 0 24px; }
}
.lama-basket__quota{
  background:var(--lb-success-bg); color:var(--lb-success-ink);
  padding:6px 10px; border-radius:999px; font-size:13px; white-space:nowrap;
  border:1px solid #e4f3ea;
}

/* Drop зона */
.lama-basket__drop{
  background: var(--lb-soft);
  border:1px dashed #ddd; border-radius:14px; padding:14px; margin:10px 0 12px;
}
#lbPick.lb-btn--ghost{ width:100%; }
.lama-basket__preview{ margin-top:10px; }
.lama-basket__preview img{
  width:100%; border-radius:12px; border:1px solid #eee; display:block;
  max-height:320px; object-fit:cover;
}

/* Теми – „pill“ чекове с активен state */
.lama-basket__topics-title{ font-weight:700; margin:6px 0 8px; }
.lama-basket__topics{ display:flex; gap:10px; flex-wrap:wrap; }
.lb-check{
  display:inline-flex; align-items:center; gap:10px;
  border:1px solid #eae7e1; padding:10px 14px; border-radius:999px;
  background:#fff; transition: all .15s ease;
}
.lb-check:hover{ box-shadow:0 4px 10px rgba(0,0,0,.05); }
.lb-check input{ width:18px; height:18px; margin:0; }
.lb-check:has(input:checked){
  border-color: var(--lb-accent); background: #eef9f4;
}

/* Бутони */
.lb-btn{
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; padding:14px 18px; font-weight:800;
  border:1px solid #0f0f0f; background:var(--lb-ink); color:#fff;
  transition: transform .06s ease, box-shadow .15s ease, background .15s ease, opacity .15s ease;
  cursor:pointer;
}
.lb-btn:active{ transform: translateY(1px) scale(.99); }
.lb-btn:hover{ box-shadow:0 6px 16px rgba(0,0,0,.12); }
.lb-btn[disabled], .lb-btn:disabled{
  opacity:.55; cursor:not-allowed; box-shadow:none; transform:none;
}
.lb-btn--ghost{
  background:#fff; color:var(--lb-ink); border-color:#ddd;
}
.lama-basket__actions{ display:flex; gap:12px; }
@media (max-width: 520px){
  .lama-basket__actions{ flex-direction:column; }
  .lb-btn, .lb-btn--ghost{ width:100%; }
}

/* Overlay (loading) — TOP toast */
.lama-basket__overlay{
  position: fixed;
  top: 60px; /* по-надолу на desktop */
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 24px);
  max-width: 560px;
  background: rgba(255,255,255,.98);
  border: 1px solid #eee;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
  border-radius: 12px;
  gap: 10px; padding: 10px 14px; align-items: center;
  z-index: 9999;
  display: none !important;
  opacity: 0;
  visibility: hidden;
}
.lama-basket__overlay.is-visible{
  display:flex !important;
  opacity: 1;
  visibility: visible;
  animation: lbfade .18s ease;
}
@keyframes lbfade {
  from { transform: translateX(-50%) translateY(-8px); opacity: 0; }
  to   { transform: translateX(-50%) translateY(0);    opacity: 1; }
}
.lb-spinner{
  width:18px;height:18px;border-radius:50%;
  border:2px solid #ddd;border-top-color:var(--lb-accent);
  animation: lbspin 0.9s linear infinite;
}
@keyframes lbspin{ to{ transform:rotate(360deg);} }

/* Mobile offset за overlay */
@media (max-width: 520px){
  .lama-basket__overlay{ top: 40px; }
}

/* Прогрес бар (визуален „живец“) */
.lama-basket__overlay::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0; height:3px;
  background: linear-gradient(90deg, var(--lb-accent) 0%, rgba(15,143,95,.2) 60%, transparent 100%);
  animation: lbbar 1.4s ease-in-out infinite;
}
@keyframes lbbar{
  0%{ transform: translateX(-40%); opacity:.8;}
  60%{ transform: translateX(30%);  opacity:1;}
  100%{transform: translateX(110%); opacity:.2;}
}

/* По-ясна типография вътре в overlay */
.lama-basket__overlay h4,
.lama-basket__overlay .lb-title{
  margin: 0;
  font-weight: 800;
  font-size: 16px;
  line-height: 1.25;
  color: var(--lb-ink);
}
.lama-basket__overlay small,
.lama-basket__overlay .lb-sub{
  font-size: 13px;
  opacity: .85;
}
@media (max-width: 520px){
  .lama-basket__overlay h4,
  .lama-basket__overlay .lb-title{ font-size: 15px; }
  .lama-basket__overlay small,
  .lama-basket__overlay .lb-sub{ font-size: 12.5px; }
}

/* Ясни етапи (ако JS сетва data-step) */
.lama-basket__overlay[data-step="recognition"] .lb-title::before { content:"Стъпка 1: "; }
.lama-basket__overlay[data-step="analysis"]    .lb-title::before { content:"Стъпка 2: "; }

/* Резултат – секции */
.lama-basket__result{ display:grid; gap:12px; }
.lama-basket__result .lb-sec{
  border:1px dashed var(--lb-border); border-radius:14px; padding:12px; background:#fff;
}
.lama-basket__result .lb-sec-title{ font-weight:700; margin-bottom:6px; }
.lama-basket__result .lb-two{ display:grid; gap:8px; }
@media (min-width: 560px){
  .lama-basket__result .lb-two{ grid-template-columns: 1fr 1fr; }
}

/* Значки */
.lb-badge{ font-size:12px; padding:4px 10px; border-radius:999px; display:inline-block; font-weight:800; letter-spacing:.2px; }
.lb-badge--ok{ background:var(--lb-success-bg); color:var(--lb-success-ink); }
.lb-badge--watch{ background:var(--lb-warn-bg); color:var(--lb-warn-ink); }
.lb-badge--avoid{ background:var(--lb-danger-bg); color:var(--lb-danger-ink); }

/* Промо карта */
.lb-product{ border:1px solid #eee; border-radius:12px; padding:10px; background:#fff; }
.lb-prodimg{ width:68px;height:68px;border-radius:10px;object-fit:cover;border:1px solid #eee;margin-right:8px; }
.lb-product-row{ display:flex; align-items:center; gap:10px; }
.lb-product-text{ flex:1; }
.lb-product .lb-btn{ padding:10px 14px; }

/* Подсказки/грешки + CTA */
.lama-basket__hint{
  margin-top:10px; border-radius:12px; padding:12px 14px;
  background:#fff4f4; border:1px solid #ffd7d7; color:#8a1c1c;
}
.lama-basket__hint a{
  display:inline-block; margin-left:8px; padding:6px 10px; border-radius:10px;
  text-decoration:none; font-weight:700;
  background: var(--lb-accent); color: var(--lb-accent-ink);
}
.lama-basket__hint a + a{ margin-left:6px; }
.lb-error{
  background:#fff4f4; border:1px solid #ffd7d7; color:#8a1c1c; padding:10px; border-radius:12px;
}

/* Лимити / Съобщения */
.lb-limit{
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 10px;
  align-items: start;
  border-radius: 14px;
  box-shadow: var(--lb-shadow);
  margin-top: 12px;
  font-size: 14px;
  padding: 12px 14px;
}
.lb-limit::before{
  content: "";
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--lb-danger-bg);
  box-shadow: inset 0 0 0 3px #fff;
  border: 1px solid #ffd7d7;
}
.lb-limit--soft{
  background: var(--lb-warn-bg);
  border: 1px solid #f7e7a8;
  color: var(--lb-warn-ink);
}
.lb-limit--hard{
  background: var(--lb-danger-bg);
  border: 1px solid #ffd7d7;
  color: var(--lb-danger-ink);
}
.lb-limit__title{ font-weight: 800; margin: 0 0 4px 0; }
.lb-limit__desc{ margin: 0; opacity: .9; }

/* Списъци */
.lama-basket__result ul{ margin:.35rem 0 .35rem 1.1rem; }
.lama-basket__result ol{ margin:.35rem 0 .35rem 1.2rem; }

/* Дребни подобрения */
.lama-basket .lb-headline{ margin:6px 0 4px; line-height:1.3; font-weight:800; }
.lama-basket__topics-error{
  color:#a30b0b; background:#fff2f2; border:1px solid #ffdede;
  padding:8px 10px; border-radius:10px; margin-top:8px;
}

/* Стабилен скрол */
.lb-scroll-persist{
  overflow-anchor: auto;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
}

/* Skeleton */
.lb-skeleton{
  background: linear-gradient(90deg,#eee,#f7f7f7,#eee);
  background-size: 200% 100%;
  animation: lbskeleton 1.2s ease-in-out infinite;
  border-radius:10px;
}
@keyframes lbskeleton{ 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* Достъпност */
@media (prefers-reduced-motion: reduce){
  .lama-basket__overlay{ animation: none !important; }
  .lama-basket__overlay.is-visible{ animation: none !important; }
}

/* Share bar (за сваляне/споделяне на карта) */
.lama-basket__share {
  display:flex;
  gap:10px;
  margin-top:12px;
  justify-content:flex-start;
  flex-wrap: wrap;
}
.lama-basket__share .lb-btn { padding:10px 14px; }
.lama-basket__share small { color:#666; opacity:.9; }

/* Скрит канвас за story-картата */
#lbShareCanvas { display:none; }