/* =====================================================================
   StrefaHoreca.pl — Design System
   Estetyka: czysta, minimalistyczna, jeden kolor akcentu, dużo oddechu.
   ===================================================================== */
:root{
  --sh-primary:#1F7A4D;
  --sh-primary-dark:#155C39;
  --sh-primary-soft:#EAF3EE;
  --sh-accent:#F2A20C;
  --sh-accent-soft:#FDF2DC;
  --sh-bg:#FFFFFF;
  --sh-bg-soft:#F6F8F7;
  --sh-text:#1A1D1B;
  --sh-text-muted:#6B756F;
  --sh-border:#E6E9E7;
  --sh-border-strong:#D5DAD7;
  --sh-danger:#D64545;
  --sh-radius:14px;
  --sh-radius-sm:10px;
  --sh-radius-pill:999px;
  --sh-shadow:0 2px 12px rgba(20,40,30,.06);
  --sh-shadow-md:0 8px 30px rgba(20,40,30,.10);
  --sh-shadow-lg:0 18px 50px rgba(20,40,30,.16);
  --sh-header-h:68px;
  --sh-cat-h:48px;
  --bs-body-font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

*{ -webkit-tap-highlight-color:transparent; }
html{ scroll-behavior:auto; }
body{
  font-family:var(--bs-body-font-family);
  color:var(--sh-text);
  background:var(--sh-bg);
  font-size:15.5px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  padding-top:calc(var(--sh-header-h) + var(--sh-cat-h));
  transition:padding-top .25s ease;
}
body.cat-collapsed{ padding-top:var(--sh-header-h); }

h1,h2,h3,h4,h5{ font-weight:700; letter-spacing:-.012em; color:var(--sh-text); }
h1{ font-size:clamp(1.7rem,3.4vw,2.5rem); }
a{ color:var(--sh-primary-dark); text-decoration:none; }
a:hover{ color:var(--sh-primary); }
.text-muted-2{ color:var(--sh-text-muted)!important; }
.bg-soft{ background:var(--sh-bg-soft); }
.fw-semi{ font-weight:600; }
.container-sh{ max-width:1320px; margin-inline:auto; padding-inline:18px; }

::selection{ background:var(--sh-primary-soft); }

/* ---- Buttons ---- */
.btn{ --bs-btn-font-weight:600; border-radius:var(--sh-radius-sm); padding:.55rem 1.05rem; letter-spacing:-.01em; }
.btn-lg{ padding:.8rem 1.4rem; border-radius:var(--sh-radius); }
.btn-sh{ background:var(--sh-primary); color:#fff; border:1px solid var(--sh-primary); }
.btn-sh:hover{ background:var(--sh-primary-dark); border-color:var(--sh-primary-dark); color:#fff; }
.btn-sh-outline{ background:#fff; color:var(--sh-primary-dark); border:1.5px solid var(--sh-border-strong); }
.btn-sh-outline:hover{ border-color:var(--sh-primary); color:var(--sh-primary-dark); background:var(--sh-primary-soft); }
.btn-accent{ background:var(--sh-accent); color:#3a2a00; border:1px solid var(--sh-accent); }
.btn-accent:hover{ filter:brightness(.96); color:#3a2a00; }
.btn-ghost{ background:transparent; color:var(--sh-text); border:1px solid transparent; }
.btn-ghost:hover{ background:var(--sh-bg-soft); color:var(--sh-text); }
.btn-icon{ width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center; padding:0; border-radius:12px; position:relative; }

/* ---- Badges ---- */
.badge-sh{ font-weight:600; font-size:.72rem; padding:.32em .6em; border-radius:8px; letter-spacing:.01em; }
.badge-promo{ background:var(--sh-accent-soft); color:#8a5e00; }
.badge-buy{ background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.badge-listing{ background:#EEF1FA; color:#3b4a8c; }
.badge-count{ position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; padding:0 5px; font-size:.66rem; font-weight:700; background:var(--sh-accent); color:#3a2a00; border-radius:999px; display:flex; align-items:center; justify-content:center; border:2px solid #fff; }

/* =====================================================================
   HEADER
   ===================================================================== */
.sh-header{
  position:fixed; top:0; left:0; right:0; z-index:1030;
  background:#fff; border-bottom:1px solid var(--sh-border);
}
.sh-bar{
  height:var(--sh-header-h);
  display:flex; align-items:center; gap:14px;
  max-width:1320px; margin-inline:auto; padding-inline:18px;
  transition:height .2s ease;
}
.sh-logo{ flex:0 0 auto; display:flex; align-items:center; }
.sh-logo img{ height:40px; width:auto; display:block; transition:height .2s ease; }
.sh-header.is-scrolled .sh-logo img{ height:32px; }

/* Search */
.sh-search{ flex:1 1 auto; min-width:0; }
.sh-search-form{
  display:flex; align-items:stretch; height:46px;
  background:#fff; border:1.5px solid var(--sh-border-strong);
  border-radius:var(--sh-radius-pill); overflow:hidden;
  transition:border-color .15s, box-shadow .15s;
}
.sh-search-form:focus-within{ border-color:var(--sh-primary); box-shadow:0 0 0 4px var(--sh-primary-soft); }
.sh-search-cat{
  border:0; background:transparent; padding:0 14px; max-width:170px;
  color:var(--sh-text-muted); font-weight:500; font-size:.78rem; cursor:pointer;
  border-right:1px solid var(--sh-border); flex:0 0 auto;
}
.sh-search-cat:focus{ outline:none; }
.sh-search-input{ border:0; background:transparent; flex:1 1 auto; min-width:0; padding:0 14px; font-size:.95rem; }
.sh-search-input:focus{ outline:none; }
.sh-search-btn{
  flex:0 0 auto; width:54px; border:0; background:var(--sh-primary); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.15rem; cursor:pointer;
}
.sh-search-btn:hover{ background:var(--sh-primary-dark); }

/* Autocomplete */
.sh-ac{ position:absolute; z-index:40; left:0; right:0; margin-top:8px; background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); box-shadow:var(--sh-shadow-md); overflow:hidden; display:none; max-height:420px; overflow-y:auto; }
.sh-ac.open{ display:block; }
.sh-ac-item{ display:flex; align-items:center; gap:11px; padding:9px 12px; cursor:pointer; font-size:.92rem; }
.sh-ac-item .bi{ color:var(--sh-text-muted); }
.sh-ac-item:hover,.sh-ac-item.active{ background:var(--sh-bg-soft); }
.sh-ac-item mark{ background:transparent; color:var(--sh-primary-dark); font-weight:700; padding:0; }
.sh-ac-ic{ width:34px; height:34px; flex:0 0 auto; border-radius:9px; background:var(--sh-primary-soft); color:var(--sh-primary); display:flex; align-items:center; justify-content:center; font-size:1rem; }
.sh-ac-ic .bi{ color:var(--sh-primary); }
.sh-ac-thumb{ width:38px; height:34px; flex:0 0 auto; border-radius:8px; overflow:hidden; }
.sh-ac-thumb .ph-img{ width:100%; height:100%; }
.sh-ac-thumb .ph-img .bi{ font-size:1rem; }
.sh-ac-thumb .ph-img .ph-label{ display:none; }
.sh-ac-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.25; }
.sh-ac-txt .t{ font-weight:600; color:var(--sh-text); }
.sh-ac-txt .s{ font-size:.76rem; color:var(--sh-text-muted); }
.sh-ac-go{ margin-left:auto; opacity:0; font-size:.85rem; }
.sh-ac-item:hover .sh-ac-go,.sh-ac-item.active .sh-ac-go{ opacity:.6; }
.sh-ac-empty{ padding:18px 14px; text-align:center; color:var(--sh-text-muted); font-size:.88rem; }
.sh-ac-head{ font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--sh-text-muted); padding:10px 12px 4px; }

/* Actions */
.sh-actions{ flex:0 0 auto; display:flex; align-items:center; gap:6px; }
.sh-action{
  width:44px; height:44px; border-radius:12px; border:0; background:transparent;
  display:inline-flex; align-items:center; justify-content:center; position:relative;
  color:var(--sh-text); font-size:1.25rem; cursor:pointer; transition:background .15s;
}
.sh-action:hover{ background:var(--sh-bg-soft); color:var(--sh-primary-dark); }
.sh-add-btn{ height:44px; padding:0 16px; border-radius:12px; gap:8px; font-weight:600; display:inline-flex; align-items:center; white-space:nowrap; }
.sh-add-btn .bi{ font-size:1.05rem; }
.sh-avatar-btn{ display:inline-flex; align-items:center; gap:8px; height:44px; padding:4px 6px 4px 4px; border-radius:12px; border:0; background:transparent; cursor:pointer; }
.sh-avatar-btn.avatar-only{ padding:4px; width:44px; height:44px; justify-content:center; }
.sh-avatar-btn:hover{ background:var(--sh-bg-soft); }
.sh-avatar{ width:36px; height:36px; border-radius:50%; background:var(--sh-primary); color:#fff; font-weight:700; display:flex; align-items:center; justify-content:center; font-size:.9rem; flex:0 0 auto; }
.sh-avatar.guest{ background:var(--sh-bg-soft); color:var(--sh-text-muted); border:1px solid var(--sh-border); }
.sh-avatar-meta{ text-align:left; line-height:1.1; max-width:120px; }
.sh-avatar-meta .nm{ font-weight:600; font-size:.84rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sh-avatar-meta .rl{ font-size:.72rem; color:var(--sh-text-muted); }

/* Dropdown panels (lang/account/cart) */
.sh-pop{ position:absolute; top:calc(100% + 8px); right:0; z-index:1040; min-width:240px; background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); box-shadow:var(--sh-shadow-md); padding:8px; opacity:0; transform:translateY(-6px); pointer-events:none; transition:opacity .14s, transform .14s; }
.sh-pop.open{ opacity:1; transform:translateY(0); pointer-events:auto; }
.sh-pop-head{ padding:8px 12px 4px; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--sh-text-muted); }
.sh-pop a,.sh-pop button.pop-row{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; padding:9px 12px; border-radius:9px; color:var(--sh-text); font-size:.92rem; border:0; background:transparent; cursor:pointer; }
.sh-pop a .bi,.sh-pop button.pop-row .bi{ font-size:1.05rem; color:var(--sh-text-muted); width:20px; }
.sh-pop a:hover,.sh-pop button.pop-row:hover{ background:var(--sh-bg-soft); color:var(--sh-text); }
.sh-pop hr{ margin:6px 4px; border-color:var(--sh-border); opacity:1; }
.sh-pop .check{ margin-left:auto; color:var(--sh-primary); }
.sh-pos{ position:relative; }
.lang-flag{ width:20px; height:14px; border-radius:3px; object-fit:cover; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); flex:0 0 auto; }
.lang-soon{ margin-left:auto; font-size:.66rem; color:var(--sh-text-muted); background:var(--sh-bg-soft); padding:2px 7px; border-radius:999px; }

/* Category bar */
.sh-catbar{ background:#fff; border-bottom:1px solid var(--sh-border); height:var(--sh-cat-h); overflow:hidden; transition:height .25s ease, opacity .2s ease; }
body.cat-collapsed .sh-catbar{ height:0; opacity:0; border-color:transparent; }
.sh-catbar-inner{ display:flex; align-items:center; gap:8px; height:var(--sh-cat-h); max-width:1320px; margin-inline:auto; padding-inline:14px; }
.sh-cat-link{ display:inline-flex; align-items:center; gap:8px; height:34px; padding:0 13px; border-radius:9px; border:1px solid var(--sh-border-strong); background:var(--sh-primary-soft); color:var(--sh-text); font-weight:600; font-size:.9rem; white-space:nowrap; cursor:pointer; transition:border-color .14s, background .14s, color .14s; }
.sh-cat-link .bi{ color:var(--sh-primary); font-size:1rem; }
.sh-cat-link:hover,.sh-cat-link[aria-expanded="true"]{ background:var(--sh-bg-soft); color:var(--sh-primary-dark); border-color:var(--sh-border-strong); }
.sh-cat-all{ font-weight:700; }

/* Mega menu */
.sh-mega{ position:fixed; left:0; right:0; top:calc(var(--sh-header-h) + var(--sh-cat-h)); z-index:1025; background:#fff; border-bottom:1px solid var(--sh-border); box-shadow:var(--sh-shadow-md); padding:22px 0 26px; display:none; }
.sh-mega.open{ display:block; }
.sh-mega-grid{ max-width:1320px; margin-inline:auto; padding-inline:18px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px 28px; }
.sh-mega h6{ font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--sh-text-muted); margin:0 0 6px; }
.sh-mega a{ display:block; padding:5px 0; color:var(--sh-text); font-size:.93rem; }
.sh-mega a:hover{ color:var(--sh-primary-dark); }

/* Hamburger offcanvas — full width */
.sh-burger-panel{ width:100%!important; max-width:100%!important; }
.sh-burger-panel .offcanvas-header{ border-bottom:1px solid var(--sh-border); padding:14px 22px; }
.sh-burger-body{ max-width:1100px; margin-inline:auto; width:100%; padding:24px 22px 40px; }
.sh-burger-cols{ display:grid; grid-template-columns:1.4fr 1fr; gap:38px; }
.sh-burger-cat{ display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--sh-border); border-radius:12px; color:var(--sh-text); font-weight:600; }
.sh-burger-cat:hover{ border-color:var(--sh-primary); background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.sh-burger-cat .bi{ font-size:1.25rem; color:var(--sh-primary); }

/* =====================================================================
   OFFER CARD
   ===================================================================== */
.offer-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; display:flex; flex-direction:column; height:100%; transition:box-shadow .18s, border-color .18s, transform .18s; position:relative; }
.offer-card:hover{ box-shadow:var(--sh-shadow-md); border-color:var(--sh-border-strong); transform:translateY(-2px); }
.offer-thumb{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.offer-thumb .ph-img{ width:100%; height:100%; }
.offer-card .fav{ position:absolute; top:10px; right:10px; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.92); border:1px solid var(--sh-border); display:flex; align-items:center; justify-content:center; font-size:1.05rem; color:var(--sh-text-muted); cursor:pointer; backdrop-filter:blur(4px); transition:.15s; z-index:3; }
.offer-card .fav:hover{ color:var(--sh-danger); transform:scale(1.08); }
.offer-card .fav.on{ color:var(--sh-danger); }
.offer-badges{ position:absolute; top:10px; left:10px; display:flex; gap:6px; flex-wrap:wrap; z-index:2; }
.offer-body{ padding:13px 14px 15px; display:flex; flex-direction:column; gap:7px; flex:1 1 auto; }
.offer-title{ font-size:.95rem; font-weight:600; line-height:1.32; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.55em; color:var(--sh-text); }
.offer-title-link{ color:inherit; text-decoration:none; }
.offer-title-link:hover .offer-title{ color:var(--sh-primary-dark); }
.offer-cta{ position:relative; z-index:2; margin-top:4px; }
.offer-loc{ font-size:.8rem; color:var(--sh-text-muted); display:flex; align-items:center; gap:5px; }
.offer-seller{ font-size:.8rem; color:var(--sh-text-muted); display:flex; align-items:center; gap:6px; }
.offer-price{ margin-top:auto; padding-top:4px; }
.offer-price .amt{ font-size:1.18rem; font-weight:700; color:var(--sh-text); }
.offer-price .unit{ font-size:.82rem; color:var(--sh-text-muted); font-weight:500; }
.price-locked{ display:inline-flex; align-items:center; gap:7px; font-size:.84rem; font-weight:600; color:var(--sh-primary-dark); background:var(--sh-primary-soft); padding:8px 12px; border-radius:10px; cursor:pointer; width:100%; justify-content:center; border:0; position:relative; z-index:2; }
.price-locked:hover{ background:#dfeee6; }
.rating-mini{ display:inline-flex; align-items:center; gap:3px; color:var(--sh-accent); font-size:.8rem; font-weight:600; }
.rating-mini .bi{ font-size:.78rem; }

/* Image placeholders (striped, professional) */
.ph-img{ position:relative; display:flex; align-items:center; justify-content:center; background:var(--sh-bg-soft); overflow:hidden; }
.ph-img::before{ content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(135deg, rgba(31,122,77,.05) 0 14px, transparent 14px 28px); }
.ph-img .bi{ font-size:2.4rem; color:rgba(31,122,77,.32); position:relative; z-index:1; }
.ph-img .ph-label{ position:absolute; bottom:8px; left:8px; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:.64rem; color:var(--sh-text-muted); background:rgba(255,255,255,.78); padding:2px 7px; border-radius:6px; letter-spacing:.02em; }

/* Shimmer / skeleton */
.skeleton{ position:relative; overflow:hidden; background:#eef1ef; }
.skeleton::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent); animation:shimmer 1.4s infinite; }
@keyframes shimmer{ 100%{ transform:translateX(100%); } }
.sk-line{ height:12px; border-radius:6px; margin:8px 0; }

/* Category tiles (home) */
.map-promo{ display:flex; align-items:center; gap:22px; padding:24px 28px; border-radius:20px; background:linear-gradient(120deg,var(--sh-primary-soft),#fff 80%); border:1px solid var(--sh-border); color:var(--sh-text); position:relative; overflow:hidden; transition:box-shadow .18s, transform .18s, border-color .18s; }
.map-promo:hover{ box-shadow:var(--sh-shadow-md); transform:translateY(-2px); color:var(--sh-text); border-color:var(--sh-primary); }
.map-promo::after{ content:""; position:absolute; inset:0; background-image:radial-gradient(circle, rgba(31,122,77,.12) 1.5px, transparent 1.5px); background-size:22px 22px; opacity:.45; pointer-events:none; }
.map-promo-ic{ width:64px; height:64px; border-radius:18px; background:var(--sh-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.9rem; flex:0 0 auto; position:relative; z-index:1; box-shadow:var(--sh-shadow); }
.map-promo-txt{ flex:1; min-width:0; position:relative; z-index:1; }
.map-promo-txt h3{ font-size:1.3rem; margin:0 0 4px; }
.map-promo-txt p{ margin:0; color:var(--sh-text-muted); font-size:.95rem; max-width:72ch; }
.map-promo-btn{ flex:0 0 auto; position:relative; z-index:1; white-space:nowrap; }
@media (max-width:768px){ .map-promo{ flex-direction:column; align-items:flex-start; gap:14px; padding:20px; } .map-promo-btn{ width:100%; justify-content:center; } }
.cat-scroller{ position:relative; }
.cat-track{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x proximity; scroll-behavior:smooth; padding:4px 2px 12px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.cat-track::-webkit-scrollbar{ display:none; }
.cat-track > .cat-tile{ scroll-snap-align:start; flex:0 0 auto; width:190px; }
.scroller-nav{ display:flex; gap:8px; }
.scroll-btn{ width:40px; height:40px; border-radius:50%; border:1px solid var(--sh-border-strong); background:#fff; color:var(--sh-text); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.1rem; transition:.15s; }
.scroll-btn:hover{ border-color:var(--sh-primary); color:var(--sh-primary-dark); background:var(--sh-primary-soft); }
.scroll-btn:disabled{ opacity:.35; cursor:default; background:#fff; border-color:var(--sh-border-strong); color:var(--sh-text); }
@media (max-width:768px){ .scroller-nav{ display:none; } .cat-track > .cat-tile{ width:150px; } }
.cat-tile{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:24px 12px; background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); text-align:center; color:var(--sh-text); transition:.18s; height:100%; }
.cat-tile:hover{ border-color:var(--sh-primary); box-shadow:var(--sh-shadow); transform:translateY(-2px); color:var(--sh-primary-dark); }
.cat-tile .ic{ width:58px; height:58px; border-radius:16px; background:var(--sh-primary-soft); color:var(--sh-primary); display:flex; align-items:center; justify-content:center; font-size:1.7rem; }
.cat-tile .nm{ font-weight:600; font-size:.95rem; }
.cat-tile .ct{ font-size:.78rem; color:var(--sh-text-muted); }

/* Chips */
.chip{ display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:var(--sh-radius-pill); border:1px solid var(--sh-border-strong); background:#fff; color:var(--sh-text); font-size:.88rem; font-weight:600; cursor:pointer; transition:.15s; }
.chip:hover{ border-color:var(--sh-primary); background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.chip.active{ border-color:var(--sh-primary); background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.chip .bi{ color:var(--sh-primary); }

/* Section heads */
.sh-section{ padding:42px 0; }
.sh-section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:22px; }
.sh-section-head h2{ font-size:clamp(1.35rem,2.4vw,1.7rem); margin:0; }
.sh-section-head .sub{ color:var(--sh-text-muted); font-size:.92rem; margin-top:2px; }
.sh-section-head a.more{ font-weight:600; white-space:nowrap; }

/* Hero */
.sh-hero{ background:linear-gradient(180deg,var(--sh-primary-soft),#fff 78%); padding:54px 0 46px; }
.sh-hero h1{ max-width:none; }
.sh-hero-search{ max-width:720px; }
.sh-hero-search .sh-search-form{ height:58px; box-shadow:var(--sh-shadow); }

/* Trust bar */
.trust{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.trust .it{ text-align:center; padding:22px 10px; }
.trust .nm{ font-size:1.9rem; font-weight:800; color:var(--sh-primary-dark); letter-spacing:-.02em; }
.trust .lb{ color:var(--sh-text-muted); font-size:.88rem; }

/* Seller mini card */
.seller-card{ display:flex; gap:14px; align-items:center; padding:16px; background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); transition:.18s; height:100%; }
.seller-card:hover{ box-shadow:var(--sh-shadow); border-color:var(--sh-border-strong); }
.seller-logo{ width:54px; height:54px; border-radius:12px; flex:0 0 auto; }

/* =====================================================================
   LISTING
   ===================================================================== */
.filters{ position:sticky; top:calc(var(--sh-header-h) + 14px); }
.filter-box{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; }
.filter-group{ border-bottom:1px solid var(--sh-border); padding:16px 16px; }
.filter-group:last-child{ border-bottom:0; }
.filter-group h6{ font-size:.86rem; font-weight:700; margin:0 0 12px; display:flex; align-items:center; justify-content:space-between; }
.filter-tree a{ display:flex; align-items:center; justify-content:space-between; padding:6px 0; color:var(--sh-text); font-size:.9rem; }
.filter-tree a:hover{ color:var(--sh-primary-dark); }
.filter-tree .cnt{ color:var(--sh-text-muted); font-size:.8rem; }
.filter-tree .sub{ padding-left:14px; }
.toolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.view-toggle{ display:inline-flex; border:1px solid var(--sh-border-strong); border-radius:10px; overflow:hidden; }
.view-toggle button{ border:0; background:#fff; width:40px; height:38px; color:var(--sh-text-muted); }
.view-toggle button.active{ background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.form-check-input:checked{ background-color:var(--sh-primary); border-color:var(--sh-primary); }
.form-control:focus,.form-select:focus{ border-color:var(--sh-primary); box-shadow:0 0 0 3px var(--sh-primary-soft); }
.locked-note{ font-size:.82rem; color:var(--sh-text-muted); background:var(--sh-bg-soft); border:1px dashed var(--sh-border-strong); border-radius:10px; padding:10px 12px; display:flex; gap:8px; align-items:flex-start; }

/* list view variant */
.offers-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.offers-grid.list-view{ grid-template-columns:1fr; }
.offers-grid.list-view .offer-card{ flex-direction:row; }
.offers-grid.list-view .offer-thumb{ width:240px; flex:0 0 240px; aspect-ratio:auto; }
.offers-grid.list-view .offer-body{ padding:18px 20px; }
.offers-grid.list-view .offer-title{ font-size:1.1rem; -webkit-line-clamp:1; min-height:0; }

/* =====================================================================
   OFFER PAGE
   ===================================================================== */
.gallery-main{ aspect-ratio:4/3; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; cursor:zoom-in; }
.gallery-thumbs{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.gallery-thumbs .th{ width:74px; height:60px; border-radius:10px; overflow:hidden; border:2px solid transparent; cursor:pointer; }
.gallery-thumbs .th.active{ border-color:var(--sh-primary); }
.attr-table{ width:100%; }
.attr-table tr{ border-bottom:1px solid var(--sh-border); }
.attr-table td{ padding:11px 4px; font-size:.92rem; vertical-align:top; }
.attr-table td:first-child{ color:var(--sh-text-muted); width:42%; }
.attr-table td:last-child{ font-weight:600; }
.buy-panel{ position:sticky; top:calc(var(--sh-header-h) + 16px); background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:20px; box-shadow:var(--sh-shadow); }
.price-big{ font-size:2rem; font-weight:800; letter-spacing:-.02em; }
.stepper{ display:inline-flex; align-items:stretch; border:1.5px solid var(--sh-border-strong); border-radius:12px; overflow:hidden; }
.stepper button{ width:46px; border:0; background:#fff; font-size:1.2rem; color:var(--sh-text); cursor:pointer; }
.stepper button:hover{ background:var(--sh-bg-soft); }
.stepper input{ width:64px; border:0; text-align:center; font-weight:600; font-size:1rem; }
.stepper input:focus{ outline:none; }
.seller-block{ border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:16px; }
.locked-block{ background:var(--sh-bg-soft); border:1px dashed var(--sh-border-strong); border-radius:var(--sh-radius); padding:18px; text-align:center; }

/* mobile sticky buy bar */
.mobile-buybar{ position:fixed; bottom:0; left:0; right:0; z-index:1020; background:#fff; border-top:1px solid var(--sh-border); padding:10px 14px; display:none; gap:10px; align-items:center; box-shadow:0 -6px 24px rgba(0,0,0,.06); }

/* =====================================================================
   ADD OFFER (stepper form)
   ===================================================================== */
.steps-bar{ display:flex; gap:6px; margin-bottom:26px; flex-wrap:wrap; }
.steps-bar .st{ flex:1 1 0; min-width:90px; display:flex; align-items:center; gap:9px; padding:10px 12px; border-radius:12px; border:1px solid var(--sh-border); background:#fff; font-size:.84rem; color:var(--sh-text-muted); }
.steps-bar .st .n{ width:24px; height:24px; border-radius:50%; background:var(--sh-bg-soft); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.78rem; flex:0 0 auto; }
.steps-bar .st.active{ border-color:var(--sh-primary); color:var(--sh-primary-dark); background:var(--sh-primary-soft); }
.steps-bar .st.active .n{ background:var(--sh-primary); color:#fff; }
.steps-bar .st.done .n{ background:var(--sh-primary); color:#fff; }
.step-panel{ display:none; }
.step-panel.active{ display:block; animation:fade .25s ease; }
@keyframes fade{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.type-pick{ border:1.5px solid var(--sh-border-strong); border-radius:var(--sh-radius); padding:22px; text-align:center; cursor:pointer; transition:.15s; height:100%; }
.type-pick:hover{ border-color:var(--sh-primary); background:var(--sh-primary-soft); }
.type-pick.sel{ border-color:var(--sh-primary); background:var(--sh-primary-soft); box-shadow:0 0 0 3px var(--sh-primary-soft); }
.type-pick .ic{ font-size:2rem; color:var(--sh-primary); }
.dropzone{ border:2px dashed var(--sh-border-strong); border-radius:var(--sh-radius); padding:30px; text-align:center; color:var(--sh-text-muted); cursor:pointer; transition:.15s; }
.dropzone:hover,.dropzone.drag{ border-color:var(--sh-primary); background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.upload-thumb{ position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden; border:1px solid var(--sh-border); }
.upload-thumb .st-badge{ position:absolute; bottom:6px; left:6px; right:6px; font-size:.68rem; background:rgba(0,0,0,.6); color:#fff; padding:3px 6px; border-radius:6px; display:flex; align-items:center; gap:5px; justify-content:center; }
.upload-thumb .rm{ position:absolute; top:5px; right:5px; width:24px; height:24px; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; border:0; font-size:.85rem; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.upload-thumb .main-tag{ position:absolute; top:5px; left:5px; font-size:.62rem; background:var(--sh-primary); color:#fff; padding:2px 6px; border-radius:5px; }
.repeater-row{ display:grid; grid-template-columns:1fr 1fr auto; gap:10px; margin-bottom:10px; }

/* Category drill-down (add offer) */
.cat-drill{ border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; }
.cat-drill-bar{ display:flex; align-items:center; gap:12px; padding:10px 12px; background:var(--sh-bg-soft); border-bottom:1px solid var(--sh-border); flex-wrap:wrap; }
.cat-back{ border:1px solid var(--sh-border-strong); background:#fff; border-radius:9px; padding:5px 11px; font-size:.84rem; font-weight:600; color:var(--sh-text); cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.cat-back:hover{ border-color:var(--sh-primary); color:var(--sh-primary-dark); }
.cat-path{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:.86rem; color:var(--sh-text-muted); }
.cat-path .bi{ font-size:.7rem; opacity:.6; }
.cat-path-link{ cursor:pointer; color:var(--sh-primary-dark); font-weight:600; }
.cat-path-link:hover{ text-decoration:underline; }
.cat-drill-row{ display:flex; align-items:center; gap:12px; padding:12px 14px; cursor:pointer; border-bottom:1px solid var(--sh-border); transition:background .12s; }
.cat-drill-row:last-child{ border-bottom:0; }
.cat-drill-row:hover{ background:var(--sh-bg-soft); }
.cat-drill-row.sel{ background:var(--sh-primary-soft); }
.cat-drill-ic{ width:40px; height:40px; flex:0 0 auto; border-radius:11px; background:var(--sh-primary-soft); color:var(--sh-primary); display:flex; align-items:center; justify-content:center; font-size:1.15rem; }
.cat-drill-ic .bi{ color:var(--sh-primary); }
.cat-drill-txt{ display:flex; flex-direction:column; min-width:0; line-height:1.25; }
.cat-drill-txt .t{ font-weight:600; color:var(--sh-text); }
.cat-drill-txt .s{ font-size:.78rem; color:var(--sh-text-muted); }
.cat-drill-end{ margin-left:auto; color:var(--sh-text-muted); font-size:1.1rem; }
.cat-drill-row.branch .cat-drill-end{ font-size:.95rem; }
.cat-drill-empty{ padding:20px 14px; text-align:center; color:var(--sh-text-muted); font-size:.9rem; }

/* =====================================================================
   CART / CHECKOUT
   ===================================================================== */
.cart-group{ border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; margin-bottom:18px; }
.cart-group-head{ background:var(--sh-bg-soft); padding:13px 18px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--sh-border); font-weight:600; }
.cart-item{ display:flex; gap:16px; padding:16px 18px; border-bottom:1px solid var(--sh-border); align-items:flex-start; }
.cart-item:last-child{ border-bottom:0; }
.cart-item .thumb{ width:92px; height:74px; border-radius:10px; overflow:hidden; flex:0 0 auto; }
.summary-box{ position:sticky; top:calc(var(--sh-header-h) + 16px); background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:20px; box-shadow:var(--sh-shadow); }
.summary-row{ display:flex; justify-content:space-between; padding:7px 0; font-size:.95rem; }
.summary-total{ display:flex; justify-content:space-between; padding-top:12px; margin-top:6px; border-top:1px solid var(--sh-border); font-size:1.2rem; font-weight:800; }

/* =====================================================================
   PANELS (dashboard)
   ===================================================================== */
.panel-layout{ display:grid; grid-template-columns:248px 1fr; gap:26px; align-items:start; }
.side-nav{ position:sticky; top:calc(var(--sh-header-h) + 16px); background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:8px; }
.side-nav a{ display:flex; align-items:center; gap:11px; padding:11px 13px; border-radius:10px; color:var(--sh-text); font-weight:500; font-size:.92rem; }
.side-nav a .bi{ font-size:1.1rem; color:var(--sh-text-muted); width:20px; }
.side-nav a:hover{ background:var(--sh-bg-soft); }
.side-nav a.active{ background:var(--sh-primary-soft); color:var(--sh-primary-dark); font-weight:600; }
.side-nav a.active .bi{ color:var(--sh-primary); }
.stat-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:18px 20px; }
.stat-card .v{ font-size:1.8rem; font-weight:800; letter-spacing:-.02em; }
.stat-card .l{ color:var(--sh-text-muted); font-size:.85rem; }
.data-table{ width:100%; border-collapse:separate; border-spacing:0; }
.data-table th{ text-align:left; font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; color:var(--sh-text-muted); padding:12px 14px; border-bottom:1px solid var(--sh-border); }
.data-table td{ padding:14px; border-bottom:1px solid var(--sh-border); font-size:.92rem; vertical-align:middle; }
.status-pill{ font-size:.74rem; font-weight:700; padding:4px 10px; border-radius:999px; }
.status-active{ background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.status-draft{ background:#EEF1F4; color:#5b6470; }
.status-paused{ background:var(--sh-accent-soft); color:#8a5e00; }
.status-ended{ background:#F6E7E7; color:#9c3a3a; }
.status-new{ background:#EEF1FA; color:#3b4a8c; }

/* object card */
.obj-card{ border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:18px; position:relative; height:100%; }
.obj-card.default{ border-color:var(--sh-primary); }
.obj-type{ display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:600; color:var(--sh-primary-dark); background:var(--sh-primary-soft); padding:3px 10px; border-radius:999px; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.sh-footer{ background:#15281f; color:#cdd8d1; margin-top:60px; }
.sh-footer .container-sh{ padding-top:50px; padding-bottom:30px; }
.sh-footer h6{ color:#fff; font-size:.84rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px; }
.sh-footer a{ color:#cdd8d1; display:block; padding:5px 0; font-size:.9rem; }
.sh-footer a:hover{ color:#fff; }
.sh-footer .logo-foot{ height:58px; margin-bottom:14px; }
.sh-footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding:18px 0; font-size:.83rem; color:#9fb0a6; }
.sh-footer-bottom .container-sh{ padding-top:0; padding-bottom:0; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }

/* =====================================================================
   DOCUMENT / CONTENT PAGES
   ===================================================================== */
.doc-hero{ background:linear-gradient(180deg,var(--sh-primary-soft),#fff 92%); border-bottom:1px solid var(--sh-border); padding:10px 0 40px; }
.doc-hero .sh-crumbs{ padding-top:16px; }
.doc-kicker{ display:inline-block; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--sh-primary-dark); background:#fff; border:1px solid var(--sh-border); padding:5px 12px; border-radius:999px; margin-bottom:14px; }
.doc-hero h1{ font-size:clamp(1.8rem,3.6vw,2.7rem); margin:0; max-width:20ch; }
.doc-lead{ font-size:1.1rem; color:var(--sh-text-muted); max-width:62ch; margin:14px 0 0; }
.doc-wrap{ padding:46px 0 20px; }
.doc-layout{ display:grid; grid-template-columns:240px 1fr; gap:46px; align-items:start; }
.doc-toc{ position:sticky; top:calc(var(--sh-header-h) + 18px); }
.doc-toc h6{ font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--sh-text-muted); margin-bottom:10px; }
.doc-toc a{ display:block; padding:6px 12px; border-left:2px solid var(--sh-border); color:var(--sh-text-muted); font-size:.88rem; }
.doc-toc a:hover,.doc-toc a.active{ border-left-color:var(--sh-primary); color:var(--sh-primary-dark); }

.prose{ max-width:74ch; color:var(--sh-text); }
.prose.wide{ max-width:none; }
.prose h2{ font-size:1.5rem; margin:38px 0 14px; scroll-margin-top:120px; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ font-size:1.12rem; margin:24px 0 10px; }
.prose p{ margin:0 0 14px; line-height:1.7; }
.prose ul,.prose ol{ margin:0 0 16px; padding-left:22px; }
.prose li{ margin:6px 0; line-height:1.65; }
.prose a{ color:var(--sh-primary-dark); text-decoration:underline; text-underline-offset:2px; }
.prose strong{ font-weight:700; }
.prose .lead{ font-size:1.06rem; color:var(--sh-text-muted); }
.legal{ counter-reset:sec; }
.legal h2{ counter-increment:sec; }
.legal h2::before{ content:"§ " counter(sec) ". "; color:var(--sh-primary); }

.callout{ background:var(--sh-bg-soft); border:1px solid var(--sh-border); border-left:3px solid var(--sh-primary); border-radius:12px; padding:16px 18px; margin:18px 0; }
.callout .ttl{ font-weight:700; margin-bottom:4px; display:flex; align-items:center; gap:8px; }
.callout .bi{ color:var(--sh-primary); }

.value-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:24px; height:100%; }
.value-card .ic{ width:48px; height:48px; border-radius:13px; background:var(--sh-primary-soft); color:var(--sh-primary); display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:14px; }
.value-card h3{ font-size:1.1rem; margin:0 0 6px; }
.value-card p{ color:var(--sh-text-muted); font-size:.92rem; margin:0; }

.step-row{ display:flex; gap:20px; align-items:flex-start; padding:22px 0; border-bottom:1px solid var(--sh-border); }
.step-row:last-child{ border-bottom:0; }
.step-row .num{ width:46px; height:46px; flex:0 0 auto; border-radius:50%; background:var(--sh-primary); color:#fff; font-weight:800; font-size:1.2rem; display:flex; align-items:center; justify-content:center; }
.step-row h3{ font-size:1.15rem; margin:4px 0 6px; }
.step-row p{ color:var(--sh-text-muted); margin:0; }

.pricing-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:28px; height:100%; }
.pricing-card.featured{ border:2px solid var(--sh-primary); box-shadow:var(--sh-shadow-md); position:relative; }
.pricing-card .price{ font-size:2.4rem; font-weight:800; letter-spacing:-.02em; }
.pricing-card .price small{ font-size:1rem; color:var(--sh-text-muted); font-weight:500; }
.pricing-card ul{ list-style:none; padding:0; margin:18px 0 0; }
.pricing-card li{ padding:8px 0; display:flex; gap:10px; align-items:flex-start; font-size:.93rem; border-top:1px solid var(--sh-border); }
.pricing-card li .bi{ color:var(--sh-primary); margin-top:2px; }

.faq .accordion-button{ font-weight:600; border-radius:12px!important; }
.faq .accordion-button:not(.collapsed){ background:var(--sh-primary-soft); color:var(--sh-primary-dark); box-shadow:none; }
.faq .accordion-button:focus{ box-shadow:0 0 0 3px var(--sh-primary-soft); }
.faq .accordion-item{ border:1px solid var(--sh-border); border-radius:12px!important; margin-bottom:10px; overflow:hidden; }
.faq .accordion-body{ color:var(--sh-text-muted); }

.contact-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:24px; height:100%; }
.contact-card .ic{ width:46px; height:46px; border-radius:12px; background:var(--sh-primary-soft); color:var(--sh-primary); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:12px; }
.company-box{ background:var(--sh-bg-soft); border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:22px 24px; font-size:.92rem; line-height:1.7; }
.company-box .nm{ font-weight:700; font-size:1.02rem; color:var(--sh-text); }

.blog-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; height:100%; display:flex; flex-direction:column; transition:.18s; }
.blog-card:hover{ box-shadow:var(--sh-shadow-md); transform:translateY(-2px); }
.blog-card .thumb{ aspect-ratio:16/9; }
.blog-card .bd{ padding:18px; display:flex; flex-direction:column; gap:8px; flex:1; }
.blog-card .tag{ font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--sh-primary-dark); }
.blog-card h3{ font-size:1.05rem; margin:0; }
.blog-card .meta{ font-size:.8rem; color:var(--sh-text-muted); margin-top:auto; }

@media (max-width:860px){
  .doc-layout{ grid-template-columns:1fr; gap:24px; }
  .doc-toc{ position:static; display:none; }
}

/* =====================================================================
   MESSAGES (czat OLX-style)
   ===================================================================== */
.msg-app{ display:grid; grid-template-columns:340px 1fr; height:calc(100vh - var(--sh-header-h) - 56px); min-height:520px; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; background:#fff; box-shadow:var(--sh-shadow); }
.msg-list{ border-right:1px solid var(--sh-border); display:flex; flex-direction:column; min-width:0; }
.msg-list-head{ padding:15px 16px; border-bottom:1px solid var(--sh-border); font-weight:700; }
.msg-list-scroll{ overflow-y:auto; flex:1; }
.conv{ display:flex; gap:12px; padding:13px 16px; border-bottom:1px solid var(--sh-border); cursor:pointer; align-items:center; }
.conv:hover{ background:var(--sh-bg-soft); }
.conv.active{ background:var(--sh-primary-soft); }
.conv .av{ width:46px; height:46px; border-radius:50%; flex:0 0 auto; background:var(--sh-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; }
.conv .meta{ min-width:0; flex:1; }
.conv .nm{ font-weight:600; font-size:.9rem; display:flex; justify-content:space-between; gap:8px; align-items:center; }
.conv .nm .t{ color:var(--sh-text-muted); font-weight:500; font-size:.72rem; white-space:nowrap; }
.conv .pv{ font-size:.82rem; color:var(--sh-text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.conv .dot{ width:9px; height:9px; border-radius:50%; background:var(--sh-primary); flex:0 0 auto; }
.msg-thread{ display:flex; flex-direction:column; min-width:0; }
.msg-thread-head{ display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--sh-border); }
.msg-thread-head .av{ width:40px; height:40px; border-radius:50%; background:var(--sh-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; flex:0 0 auto; }
.msg-ctx{ display:flex; align-items:center; gap:12px; padding:10px 16px; background:var(--sh-bg-soft); border-bottom:1px solid var(--sh-border); }
.msg-ctx .thumb{ width:48px; height:40px; border-radius:8px; overflow:hidden; flex:0 0 auto; }
.msg-body{ flex:1; overflow-y:auto; padding:20px 16px; background:var(--sh-bg-soft); display:flex; flex-direction:column; gap:9px; }
.bubble{ max-width:76%; padding:10px 14px; border-radius:16px; font-size:.92rem; line-height:1.45; box-shadow:var(--sh-shadow); }
.bubble .tm{ font-size:.66rem; opacity:.7; margin-top:4px; text-align:right; }
.bubble.them{ align-self:flex-start; background:#fff; border:1px solid var(--sh-border); border-bottom-left-radius:4px; }
.bubble.me{ align-self:flex-end; background:var(--sh-primary); color:#fff; border-bottom-right-radius:4px; }
.bubble.me a{ color:#fff; }
.msg-day{ align-self:center; font-size:.72rem; color:var(--sh-text-muted); background:#fff; border:1px solid var(--sh-border); padding:3px 12px; border-radius:999px; margin:6px 0; }
.att-img{ border-radius:10px; max-width:220px; width:100%; display:block; margin-top:6px; }
.att-file{ display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:10px; background:rgba(0,0,0,.05); margin-top:6px; text-decoration:none; color:inherit; }
.bubble.me .att-file{ background:rgba(255,255,255,.18); }
.att-file .bi{ font-size:1.4rem; }
.att-file .fnm{ font-weight:600; font-size:.84rem; word-break:break-all; }
.att-file .fsz{ font-size:.72rem; opacity:.75; }
.msg-composer{ border-top:1px solid var(--sh-border); padding:12px 14px; background:#fff; }
.msg-pending{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.msg-composer .row-in{ display:flex; gap:8px; align-items:flex-end; }
.msg-composer textarea{ flex:1; border:1px solid var(--sh-border-strong); border-radius:14px; padding:10px 14px; resize:none; max-height:120px; font-size:.92rem; font-family:inherit; }
.msg-composer textarea:focus{ outline:none; border-color:var(--sh-primary); box-shadow:0 0 0 3px var(--sh-primary-soft); }
.att-chip{ display:inline-flex; align-items:center; gap:8px; background:var(--sh-bg-soft); border:1px solid var(--sh-border); border-radius:999px; padding:4px 8px 4px 6px; font-size:.8rem; max-width:220px; }
.att-chip img{ width:28px; height:28px; border-radius:6px; object-fit:cover; flex:0 0 auto; }
.att-chip .nm{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.att-chip button{ border:0; background:transparent; color:var(--sh-text-muted); cursor:pointer; padding:0 2px; }
.icon-btn{ width:44px; height:44px; border-radius:50%; border:1px solid var(--sh-border-strong); background:#fff; color:var(--sh-text); display:flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; font-size:1.15rem; }
.icon-btn:hover{ border-color:var(--sh-primary); color:var(--sh-primary-dark); background:var(--sh-primary-soft); }
.send-btn{ width:46px; height:46px; border-radius:50%; border:0; background:var(--sh-primary); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; flex:0 0 auto; font-size:1.15rem; }
.send-btn:hover{ background:var(--sh-primary-dark); }
.msg-back{ display:none; border:0; background:transparent; font-size:1.3rem; color:var(--sh-text); cursor:pointer; }
.msg-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; height:100%; color:var(--sh-text-muted); padding:30px; }
/* statusy doręczenia */
.bubble.me .tm{ color:rgba(255,255,255,.78); }
.bubble .tm .ticks{ font-size:.8rem; }
.bubble.me .tm .ticks.read{ color:#8effc0; }
/* wskaźnik pisania */
.typing{ align-self:flex-start; background:#fff; border:1px solid var(--sh-border); border-radius:16px; border-bottom-left-radius:4px; padding:13px 16px; display:inline-flex; gap:5px; box-shadow:var(--sh-shadow); }
.typing span{ width:7px; height:7px; border-radius:50%; background:var(--sh-text-muted); opacity:.5; animation:typingDot 1.2s infinite; }
.typing span:nth-child(2){ animation-delay:.2s; } .typing span:nth-child(3){ animation-delay:.4s; }
@keyframes typingDot{ 0%,60%,100%{ transform:translateY(0); opacity:.4; } 30%{ transform:translateY(-4px); opacity:1; } }
/* szybkie odpowiedzi */
.quick-replies{ display:flex; gap:8px; overflow-x:auto; padding-bottom:9px; scrollbar-width:none; }
.quick-replies::-webkit-scrollbar{ display:none; }
.quick-reply{ flex:0 0 auto; border:1px solid var(--sh-border-strong); background:#fff; border-radius:999px; padding:6px 13px; font-size:.82rem; cursor:pointer; white-space:nowrap; color:var(--sh-text); }
.quick-reply:hover{ border-color:var(--sh-primary); background:var(--sh-primary-soft); color:var(--sh-primary-dark); }
.att-img{ cursor:zoom-in; }
/* lightbox */
.lightbox{ position:fixed; inset:0; background:rgba(10,20,15,.86); z-index:1100; display:none; align-items:center; justify-content:center; padding:30px; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92%; max-height:92%; border-radius:12px; box-shadow:var(--sh-shadow-lg); }
.lightbox .lb-close{ position:absolute; top:16px; right:22px; color:#fff; font-size:2rem; cursor:pointer; background:transparent; border:0; line-height:1; }
@media (max-width:768px){
  .msg-app{ grid-template-columns:1fr; height:calc(100vh - var(--sh-header-h) - 24px); }
  .msg-app.show-thread .msg-list{ display:none; }
  .msg-app:not(.show-thread) .msg-thread{ display:none; }
  .msg-back{ display:inline-flex; }
  .bubble{ max-width:86%; }
}

/* =====================================================================
   MAPA / KATALOG REGIONALNY (Leaflet + OSM)
   ===================================================================== */
.map-toolbar{ display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; margin-bottom:16px; }
.map-toolbar .fld{ display:flex; flex-direction:column; gap:4px; }
.map-toolbar label{ font-size:.74rem; font-weight:600; color:var(--sh-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.map-layout{ display:grid; grid-template-columns:440px 1fr; border:1px solid var(--sh-border); border-radius:var(--sh-radius); overflow:hidden; }
.map-list{ height:calc(100vh - var(--sh-header-h) - 170px); min-height:480px; overflow-y:auto; padding:14px; background:var(--sh-bg-soft); }
.map-list-head{ font-size:.88rem; color:var(--sh-text-muted); padding:2px 4px 12px; }
.map-pane{ position:relative; }
#map{ height:calc(100vh - var(--sh-header-h) - 170px); min-height:480px; width:100%; z-index:1; }
.vendor-card{ background:#fff; border:1px solid var(--sh-border); border-radius:var(--sh-radius); padding:14px; margin-bottom:12px; cursor:pointer; transition:border-color .15s, box-shadow .15s; }
.vendor-card:hover,.vendor-card.active{ border-color:var(--sh-primary); box-shadow:var(--sh-shadow-md); }
.vendor-head{ display:flex; gap:12px; align-items:center; }
.vendor-logo{ width:52px; height:52px; border-radius:12px; overflow:hidden; flex:0 0 auto; }
.vendor-dist{ font-size:.76rem; color:var(--sh-primary-dark); font-weight:700; background:var(--sh-primary-soft); padding:3px 9px; border-radius:999px; white-space:nowrap; }
.vendor-offers{ display:flex; flex-direction:column; gap:6px; margin-top:11px; }
.vendor-offer{ display:flex; gap:10px; align-items:center; padding:7px; border:1px solid var(--sh-border); border-radius:10px; color:var(--sh-text); }
.vendor-offer:hover{ background:var(--sh-bg-soft); color:var(--sh-text); }
.vendor-offer .th{ width:42px; height:34px; border-radius:7px; overflow:hidden; flex:0 0 auto; }
.vendor-offer .pr{ margin-left:auto; font-weight:700; font-size:.84rem; white-space:nowrap; }
.sh-pin{ background:var(--sh-primary); color:#fff; font-weight:700; font-size:.78rem; padding:5px 10px; border-radius:999px; box-shadow:0 3px 10px rgba(0,0,0,.35); white-space:nowrap; border:2px solid #fff; transition:.12s; cursor:pointer; }
.sh-pin:hover,.sh-pin.active{ background:var(--sh-accent); color:#3a2a00; transform:scale(1.1); z-index:1000; }
.sh-pin-me{ width:18px; height:18px; border-radius:50%; background:#1d4ed8; border:3px solid #fff; box-shadow:0 0 0 4px rgba(29,78,216,.25); }
.map-pop .pc-h{ font-weight:700; font-size:.95rem; margin-bottom:2px; }
.map-pop .pc-m{ font-size:.8rem; color:var(--sh-text-muted); }
.map-toggle{ display:none; }
@media (max-width:860px){
  .map-layout{ grid-template-columns:1fr; }
  .map-pane{ display:none; }
  .map-layout.show-map .map-list{ display:none; }
  .map-layout.show-map .map-pane{ display:block; }
  #map,.map-list{ height:calc(100vh - var(--sh-header-h) - 230px); }
  .map-toggle{ display:inline-flex; }
}

/* Toasts */
.toast-wrap{ position:fixed; right:18px; bottom:18px; z-index:1090; display:flex; flex-direction:column; gap:10px; }
/* PWA install banner */
.pwa-banner{ position:fixed; left:50%; bottom:18px; transform:translateX(-50%) translateY(24px); z-index:1095; background:#fff; border:1px solid var(--sh-border); border-radius:16px; box-shadow:var(--sh-shadow-lg); padding:12px 14px; display:none; align-items:center; gap:14px; width:calc(100% - 32px); max-width:480px; opacity:0; transition:opacity .25s, transform .25s; }
.pwa-banner.show{ display:flex; opacity:1; transform:translateX(-50%) translateY(0); }
.pwa-banner .ic{ width:48px; height:48px; border-radius:12px; flex:0 0 auto; }
.pwa-banner .nm{ font-weight:700; font-size:.94rem; line-height:1.2; }
.pwa-banner .ds{ font-size:.8rem; color:var(--sh-text-muted); }
.pwa-banner .x{ border:0; background:transparent; color:var(--sh-text-muted); cursor:pointer; font-size:1rem; padding:4px; flex:0 0 auto; }
.sh-toast{ background:#15281f; color:#fff; border-radius:12px; padding:12px 16px; box-shadow:var(--sh-shadow-lg); display:flex; align-items:center; gap:11px; font-size:.9rem; min-width:240px; animation:toastIn .25s ease; }
.sh-toast .bi{ font-size:1.2rem; }
.sh-toast.ok .bi{ color:#5fd498; }
.sh-toast.err{ background:var(--sh-danger); }
@keyframes toastIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }

/* Empty state */
.empty-state{ text-align:center; padding:60px 20px; }
.empty-state .ic{ width:84px; height:84px; border-radius:24px; background:var(--sh-bg-soft); color:var(--sh-text-muted); display:flex; align-items:center; justify-content:center; font-size:2.4rem; margin:0 auto 18px; }

/* Modal tweaks */
.modal-content{ border:0; border-radius:var(--sh-radius); box-shadow:var(--sh-shadow-lg); }
.auth-tabs{ display:flex; gap:6px; background:var(--sh-bg-soft); padding:5px; border-radius:12px; margin-bottom:20px; }
.auth-tabs button{ flex:1; border:0; background:transparent; padding:9px; border-radius:9px; font-weight:600; color:var(--sh-text-muted); cursor:pointer; }
.auth-tabs button.active{ background:#fff; color:var(--sh-text); box-shadow:var(--sh-shadow); }

/* Breadcrumb */
.sh-crumbs{ font-size:.83rem; color:var(--sh-text-muted); padding:14px 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.sh-crumbs a{ color:var(--sh-text-muted); }
.sh-crumbs a:hover{ color:var(--sh-primary-dark); }
.sh-crumbs .sep{ opacity:.5; }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
.only-mobile{ display:none; }
@media (max-width:1100px){
  .offers-grid{ grid-template-columns:repeat(3,1fr); }
  .sh-mega-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:992px){
  .sh-burger-cols{ grid-template-columns:1fr; gap:24px; }
  .panel-layout{ grid-template-columns:1fr; }
  .side-nav{ position:static; display:flex; gap:6px; overflow-x:auto; }
  .side-nav a{ white-space:nowrap; }
  .trust{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px){
  body{ padding-top:var(--sh-header-h); }
  .sh-catbar{ display:none; }
  .sh-avatar-meta{ display:none; }
  .sh-add-btn .add-label{ display:none; }
  .sh-add-btn{ padding:0; width:44px; justify-content:center; }
  .offers-grid.list-view .offer-thumb{ width:130px; flex:0 0 130px; }
}
@media (max-width:768px){
  .offers-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .sh-mega-grid{ grid-template-columns:repeat(2,1fr); }
  .trust{ grid-template-columns:repeat(2,1fr); }
  .sh-search-cat{ display:none; }
  .mobile-buybar{ display:flex; }
  .buy-panel{ position:static; }
  .filters{ position:static; }
  .sh-action.hide-sm{ display:none; }
  .sh-section{ padding:30px 0; }
  .summary-box{ position:static; }
}
@media (max-width:480px){
  .sh-bar{ gap:8px; padding-inline:12px; }
  .offers-grid.list-view .offer-card{ flex-direction:column; }
  .offers-grid.list-view .offer-thumb{ width:100%; flex:auto; aspect-ratio:4/3; }
  .only-mobile{ display:block; }
}
