/* ==========================================================
   DS MARKET – ARTICLE-SHOP.CSS
   Nákupní prvky v článcích (navazuje na articles.css)
   1) .dsm-article__shop      – nákupní blok na začátku článku
   2) .dsm-live-products      – živé produktové karty z kategorie
   3) .dsm-article-bar        – lišta „Nakoupit“ na mobilu
   ========================================================== */

.dsm-article__shop,
.dsm-live-products,
.dsm-article-bar{
  --as-green:var(--dsm-primary,#2e7d32);
  --as-green-dark:var(--dsm-primary-dark,#245f28);
  --as-green-soft:var(--dsm-primary-soft,#f2f8f0);
  --as-border:var(--dsm-primary-border,#d6e7d2);
  --as-text:var(--dsm-text,#29352d);
  --as-muted:var(--dsm-muted,#607066);
}

/* ---------- 1) Nákupní blok ---------- */
.dsm-article__shop{
  margin:28px 0 36px; padding:22px 22px 18px;
  border:1px solid var(--as-border); border-radius:16px;
  background:var(--as-green-soft); color:var(--as-text);
}
.dsm-article__shop-title{margin:0 0 4px; font-size:19px; font-weight:800; line-height:1.3; color:var(--as-text)}
.dsm-article__shop-text{margin:0 0 14px; font-size:15px; line-height:1.5; color:var(--as-muted)}
.dsm-article__shop-links{
  display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; padding:0; list-style:none;
}
.dsm-article__shop-links li{margin:0; padding:0}
.dsm-article__shop-links li::before{display:none !important; content:none !important}
.dsm-article__shop-links a{
  display:inline-flex; align-items:center; min-height:40px; padding:0 14px;
  border:1px solid var(--as-border); border-radius:999px; background:#fff;
  color:var(--as-text) !important; font-size:14.5px; font-weight:600; text-decoration:none !important;
  transition:border-color .15s, background .15s;
}
.dsm-article__shop-links a:hover{border-color:var(--as-green); background:#fff; color:var(--as-green-dark) !important}
.dsm-article__shop-main{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; padding:0 22px; border-radius:12px;
  background:var(--as-green); color:#fff !important;
  font-size:16px; font-weight:700; text-decoration:none !important;
}
.dsm-article__shop-main:hover{background:var(--as-green-dark)}
.dsm-article__shop-main svg{width:18px; height:18px}
.dsm-article__shop-trust{
  display:flex; flex-wrap:wrap; gap:6px 18px; margin:16px 0 0; padding:14px 0 0;
  border-top:1px solid var(--as-border); list-style:none;
  font-size:13.5px; color:var(--as-muted);
}
.dsm-article__shop-trust li{display:flex; align-items:center; gap:6px; margin:0; padding:0}
.dsm-article__shop-trust li::before{
  content:"" !important; display:block !important; flex:none; width:16px; height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d32' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/contain no-repeat;
  position:static !important; border:0 !important; border-radius:0 !important; margin:0 !important;
}

/* ---------- 2) Živé produktové karty ---------- */
.dsm-live-products{margin:22px 0 26px}
.dsm-live-products__title{margin:0 0 12px; font-size:17px; font-weight:800; color:var(--as-text)}
.dsm-live-products__grid{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px;
  margin:0; padding:0; list-style:none;
}
.dsm-live-products__grid > li{margin:0; padding:0}
.dsm-live-products__grid > li::before{display:none !important; content:none !important}
.dsm-live-products__card{
  display:flex; flex-direction:column; height:100%; box-sizing:border-box;
  padding:10px; border:1px solid #e3e8e1; border-radius:14px; background:#fff;
  color:var(--as-text) !important; text-decoration:none !important;
  transition:box-shadow .15s, border-color .15s;
}
.dsm-live-products__card:hover{border-color:var(--as-border); box-shadow:0 10px 26px rgba(30,60,35,.10)}
.dsm-live-products__img{
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:4/3; margin:0 0 10px; border-radius:10px; background:#f7f8f5; overflow:hidden;
}
.dsm-live-products__img img{width:100%; height:100%; object-fit:contain; display:block; margin:0 !important; border-radius:0 !important; box-shadow:none !important}
.dsm-live-products__name{
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  margin:0 0 8px; font-size:14px; font-weight:600; line-height:1.35; min-height:3.9em;
}
.dsm-live-products__stock{font-size:12.5px; font-weight:600; color:#1f7a1f; margin:0 0 6px}
.dsm-live-products__bottom{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto}
.dsm-live-products__price{font-size:17px; font-weight:800; white-space:nowrap}
.dsm-live-products__go{
  flex:none; display:inline-flex; align-items:center; justify-content:center;
  height:36px; padding:0 12px; border-radius:9px;
  background:var(--as-green); color:#fff; font-size:13.5px; font-weight:700;
}
.dsm-live-products__more{display:inline-block; margin-top:12px; font-weight:700; color:var(--as-green) !important}
.dsm-live-products--loading .dsm-live-products__grid{min-height:120px}

/* ---------- 4) Bachovy esence – výběr do lahvičky ---------- */
.dsm-bach{--as-green:#2e7d32; --as-green-dark:#245f28; --as-border:#d6e7d2}
.dsm-bach__steps{margin:6px 0 16px; padding-left:22px; font-size:15px; line-height:1.5; color:#29352d}
.dsm-bach__steps li{margin:0 0 6px}
.dsm-bach__btns{display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin:0 0 6px}
.dsm-bach__alt{font-weight:700; color:#245f28 !important}
.dsm-bach__navtitle{margin:16px 0 8px; font-size:14px; font-weight:700; color:#607066}
.dsm-bach .dsm-article__shop-links{margin-bottom:0}

.dsm-bach__add{
  display:inline-flex; align-items:center; vertical-align:middle;
  margin:4px 0 4px 10px; padding:0 12px; height:32px;
  border:1.5px solid #2e7d32; border-radius:999px; background:#fff;
  color:#245f28; font:inherit; font-size:13.5px !important; font-weight:700; line-height:1; cursor:pointer;
}
.dsm-bach__add:hover{background:#f2f8f0}
.dsm-bach__add.is-on{background:#2e7d32; color:#fff}
.dsm-bach__add:disabled{opacity:.45; cursor:not-allowed}

.dsm-bach__bar{
  position:fixed; left:50%; bottom:14px; z-index:950;
  display:flex; align-items:center; gap:12px;
  width:min(760px, calc(100% - 20px)); box-sizing:border-box;
  padding:12px 12px 12px 18px; border-radius:16px;
  background:#fff; border:1px solid #d6e7d2; box-shadow:0 12px 34px rgba(20,40,25,.24);
  transform:translate(-50%, 160%); transition:transform .25s ease;
}
.dsm-bach__bar.is-visible{transform:translate(-50%, 0)}
.dsm-bach__bar.is-full{animation:dsmBachShake .35s}
@keyframes dsmBachShake{25%{transform:translate(calc(-50% - 6px),0)}75%{transform:translate(calc(-50% + 6px),0)}}
.dsm-bach__bar-info{flex:1; min-width:0}
.dsm-bach__count{display:block; font-size:15px; color:#29352d}
.dsm-bach__list{display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:13px; color:#607066}
.dsm-bach__clear{flex:none; border:0; background:none; padding:6px; color:#607066; font:inherit; font-size:13px; text-decoration:underline; cursor:pointer}
.dsm-bach__order{
  flex:none; display:inline-flex; align-items:center; height:46px; padding:0 18px; border-radius:11px;
  background:#2e7d32; color:#fff !important; font-size:15px; font-weight:700; text-decoration:none !important;
}
.dsm-bach__order:hover{background:#245f28}
body.dsm-bach-open #footer{padding-bottom:90px}

.dsm-bach__note{
  margin:0 0 16px; padding:14px 16px; border:1px solid #d6e7d2; border-radius:12px; background:#f2f8f0; color:#29352d;
}
.dsm-bach__note p{margin:4px 0 0}
.dsm-bach__note-small{font-size:13px; color:#607066}
.dsm-bach__copy{margin-top:8px; padding:6px 12px; border:1px solid #2e7d32; border-radius:8px; background:#fff; color:#245f28; font:inherit; font-size:13px; font-weight:700; cursor:pointer}

@media (max-width:767px){
  .dsm-bach__add{display:flex; margin:8px 0 2px}
  .dsm-bach__bar{bottom:8px; flex-wrap:wrap; gap:8px; padding:10px 12px}
  .dsm-bach__bar-info{flex:1 1 60%}
  .dsm-bach__order{flex:1 1 100%; justify-content:center; height:44px}
  .dsm-bach__btns .dsm-article__shop-main{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .dsm-bach__bar{transition:none}
  .dsm-bach__bar.is-full{animation:none}
}

/* úzká tabulka (2–3 sloupce) – na mobilu bez vodorovného posouvání */
.dsm-article .dsm-article-table-wrap--compact table{min-width:0}

/* ---------- 3) Lišta „Nakoupit“ na mobilu ---------- */
.dsm-article-bar{display:none}

@media (max-width:767px){
  .dsm-article__shop{margin:22px -4px 30px; padding:18px 16px 14px}
  .dsm-article__shop-main{width:100%; box-sizing:border-box}

  .dsm-live-products__grid{
    display:flex; overflow-x:auto; gap:10px; padding-bottom:6px;
    scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none;
  }
  .dsm-live-products__grid::-webkit-scrollbar{display:none}
  .dsm-live-products__grid > li{flex:0 0 46%; scroll-snap-align:start}

  .dsm-article-bar{
    display:flex; align-items:center; gap:10px;
    position:fixed; left:10px; right:10px; bottom:10px; z-index:900;
    padding:10px 10px 10px 14px; border-radius:14px;
    background:#fff; border:1px solid var(--as-border);
    box-shadow:0 10px 30px rgba(20,40,25,.22);
    transform:translateY(140%); transition:transform .25s ease;
  }
  .dsm-article-bar.is-visible{transform:none}
  .dsm-article-bar__text{flex:1; min-width:0; font-size:14px; font-weight:700; line-height:1.25; color:var(--as-text)}
  .dsm-article-bar__text small{display:block; font-size:12px; font-weight:600; color:var(--as-muted)}
  .dsm-article-bar__btn{
    flex:none; display:inline-flex; align-items:center; height:44px; padding:0 16px; border-radius:10px;
    background:var(--as-green); color:#fff !important; font-size:15px; font-weight:700; text-decoration:none !important;
  }
  .dsm-article-bar__close{
    flex:none; width:32px; height:32px; margin-left:-4px; padding:0; border:0; background:transparent;
    color:var(--as-muted); font-size:22px; line-height:1; cursor:pointer;
  }
}

@media (prefers-reduced-motion:reduce){
  .dsm-article-bar{transition:none}
}