/* Дроп-платформа protovar — ті самі кольори, що й роздрібний сайт */
:root{
  --accent:#0d9488; --accent-dark:#0f766e; --warm:#f59e0b; --danger:#e11d48;
  --bg:#f0fdf4; --surface:#fff; --text:#134e4a; --muted:#5f7a76; --line:#d9ece7;
  --radius:16px; --shadow:0 2px 12px rgba(13,148,136,.07); --shadow-lg:0 12px 40px rgba(13,148,136,.14);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);
     color:var(--text);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,select,textarea{font:inherit;color:var(--text)}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
[hidden]{display:none!important}

/* шапка */
.top{background:linear-gradient(135deg,var(--accent-dark),var(--accent));color:#fff;padding:14px 0}
.top .wrap{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:20px}
.logo img{width:32px;height:32px}
.logo span{font-weight:600;font-size:13px;opacity:.85;margin-left:4px}
.top nav{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.top nav a,.top nav button{padding:8px 14px;border-radius:10px;font-weight:700;font-size:14px;background:rgba(255,255,255,.14)}
.top nav a.on,.top nav button.on{background:#fff;color:var(--accent-dark)}
.top .who{font-size:13px;opacity:.9}

/* блоки */
.block{padding:30px 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
h1{font-size:clamp(26px,4vw,38px);font-weight:900;line-height:1.15;letter-spacing:-.02em}
h2{font-size:clamp(19px,3vw,25px);font-weight:900;margin-bottom:14px}
h3{font-size:17px;font-weight:800;margin-bottom:10px}
.muted{color:var(--muted)}
.grid2{display:grid;gap:18px}
@media(min-width:860px){.grid2{grid-template-columns:1fr 1fr}}

/* форми */
label{display:block;font-size:13px;font-weight:700;color:var(--muted);margin:12px 0 5px}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],select,textarea{
  width:100%;padding:11px 13px;border:2px solid var(--line);border-radius:12px;background:#fff;font-size:15px}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent)}
input.bad,select.bad,textarea.bad{border-color:var(--danger)}
.err{display:none;color:var(--danger);font-size:13px;margin-top:4px}
.err.on{display:block}
.cta{display:inline-block;background:var(--accent);color:#fff;font-weight:800;padding:12px 24px;border-radius:12px;margin-top:14px}
.cta:hover{background:var(--accent-dark)}
.cta.sec{background:var(--surface);color:var(--accent-dark);border:2px solid var(--line)}
.cta.sm{padding:8px 14px;font-size:14px;margin:0}
.cta[disabled]{opacity:.6;pointer-events:none}
.fine{font-size:12.5px;color:var(--muted);margin-top:10px}
.msg{background:#ecfdf5;border:1px solid #a7f3d0;color:var(--accent-dark);padding:12px 14px;border-radius:12px;margin-top:12px;font-size:14px}
.msg.bad{background:#fff1f2;border-color:#fecdd3;color:var(--danger)}
.msg.warn{background:#fffbeb;border-color:#fde68a;color:#92400e}

/* правила */
.rules{display:grid;gap:12px;margin-top:14px}
@media(min-width:700px){.rules{grid-template-columns:repeat(4,1fr)}}
.rule{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}
.rule b{display:block;font-size:26px;color:var(--accent-dark);font-weight:900}
.rule span{font-size:13.5px;color:var(--muted)}
.steps{counter-reset:s;display:grid;gap:10px;margin-top:14px}
@media(min-width:700px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 16px 16px 52px;position:relative;font-size:14.5px}
.step::before{counter-increment:s;content:counter(s);position:absolute;left:14px;top:14px;width:28px;height:28px;border-radius:50%;
  background:var(--accent);color:#fff;font-weight:900;display:grid;place-items:center;font-size:14px}

/* кабінет */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 14px}
.tabs button{padding:9px 16px;border-radius:10px;font-weight:700;font-size:14px;background:var(--surface);border:1px solid var(--line)}
.tabs button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.tools{display:grid;gap:10px;margin-bottom:14px}
@media(min-width:800px){.tools{grid-template-columns:1fr 220px 220px}}
.tools input,.tools select{margin:0}
.pgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.pc{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.pc .th{position:relative;aspect-ratio:1/1;background:#fff;overflow:hidden;min-height:0;flex:none;display:block}
.pc .th img{position:absolute;left:8px;top:8px;width:calc(100% - 16px);height:calc(100% - 16px);object-fit:contain}
.pc .b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:4px;flex:1}
.pc .c{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.pc .n{font-size:13px;line-height:1.35;font-weight:600;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pc .pr{display:flex;align-items:baseline;gap:8px;margin-top:4px}
.pc .drop{font-size:18px;font-weight:900;color:var(--accent-dark)}
.pc .ret{font-size:12px;color:var(--muted);text-decoration:line-through}
.pc .add{margin-top:8px;background:var(--accent);color:#fff;font-weight:800;padding:9px;border-radius:10px;font-size:13.5px}
.pc .add:hover{background:var(--accent-dark)}
.more{display:block;margin:18px auto 0;padding:12px 26px;border-radius:12px;background:var(--surface);border:2px solid var(--line);font-weight:800}

/* кошик і таблиці */
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.tbl{overflow-x:auto}
.qty{display:inline-flex;align-items:center;border:2px solid var(--line);border-radius:9px;overflow:hidden}
.qty button{width:28px;height:30px;font-weight:800;color:var(--muted)}
.qty input{width:40px;height:30px;border:0;text-align:center;font-weight:800;padding:0;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.del{color:var(--muted);font-size:18px;padding:4px 8px}
.del:hover{color:var(--danger)}
.tot{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:15px}
.tot.big{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-size:18px;font-weight:900}
.tot b{color:var(--accent-dark)}
.profit{color:var(--accent-dark);font-weight:900}
.st{display:inline-block;padding:3px 9px;border-radius:99px;font-size:12px;font-weight:800;background:var(--line);color:var(--text)}
.st.new{background:#fef3c7;color:#92400e}
.st.confirmed{background:#dbeafe;color:#1e40af}
.st.shipped{background:#e0e7ff;color:#3730a3}
.st.received{background:#d1fae5;color:#065f46}
.st.refused,.st.returned,.st.cancelled{background:#fee2e2;color:#991b1b}
.st.active{background:#d1fae5;color:#065f46}
.st.blocked{background:#fee2e2;color:#991b1b}
.badge{position:fixed;right:16px;bottom:16px;background:var(--accent);color:#fff;font-weight:900;padding:12px 18px;border-radius:99px;
  box-shadow:var(--shadow-lg);z-index:9}
.badge:hover{background:var(--accent-dark)}
.items{font-size:13px;color:var(--muted)}
.items li{list-style:none}
footer{padding:26px 0 40px;color:var(--muted);font-size:13px;text-align:center}

.chk{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--text);margin:8px 0}
.chk input{width:17px;height:17px;accent-color:var(--accent)}

/* ---------- макет із бічним меню (кабінет) ---------- */
.layout{display:grid;gap:18px;max-width:1360px;margin:0 auto;padding:16px}
@media(min-width:960px){.layout{grid-template-columns:230px 1fr}}
.side{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:12px;align-self:start;position:sticky;top:14px}
.side .tabs{flex-direction:column;gap:4px;margin:0}
.side .tabs button{text-align:left;border:0;padding:11px 14px;border-radius:12px;font-size:14.5px}
.side .tabs button:hover{background:var(--bg)}
.side .tabs button.on{background:linear-gradient(135deg,var(--accent-dark),var(--accent));color:#fff}
.sidelink{display:block;margin:12px 14px 4px;font-size:13px;color:var(--muted)}
@media(max-width:959px){.side{display:none}.side.open{display:block;position:static}}
.burger{display:none;font-size:22px;padding:4px 10px;border-radius:8px;background:rgba(255,255,255,.14)}
@media(max-width:959px){.burger{display:inline-block}}
.main{min-width:0}
.cartbtn{font-size:15px!important}
.dcards{display:grid;gap:12px}
@media(min-width:800px){.dcards{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.dcard{border-radius:14px;padding:16px;border:1px solid var(--line);background:var(--surface)}
.dcard.fin{background:linear-gradient(135deg,#eefdf7,#f3fbff)}.dcard.lnd{background:linear-gradient(135deg,#eef9ff,#f6fbff)}
.dcard.intg{background:linear-gradient(135deg,#f0fdf4,#f7fff9)}.dcard.inf{background:linear-gradient(135deg,#fffbeb,#fffdf5)}
.dh{display:flex;justify-content:space-between;font-weight:800;margin-bottom:10px}.dh span{opacity:.6}
.drow{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);padding:4px 0}.drow b{color:var(--accent-dark);font-size:16px}
.drow b.warm{color:#b45309}
.dbtns{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.dbar{height:6px;background:var(--line);border-radius:99px;margin:8px 0;overflow:hidden}.dbar i{display:block;height:100%;background:var(--accent);width:0}
.dlink{display:inline-block;margin-top:8px;font-size:13.5px;color:var(--accent-dark);text-decoration:underline}
.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{background:var(--accent);color:#fff;font-size:12px;font-weight:700;border-radius:99px;padding:4px 10px}
.chip.off{background:var(--line);color:var(--muted)}
.kpi4{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kpi4 div{display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center}
.kpi4 .ic{grid-row:1/3;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:900;color:#fff}
.ic.g{background:#10b981}.ic.r{background:#ef4444}.ic.b{background:#0ea5e9}.ic.y{background:#f59e0b}
.kpi4 span{font-size:13px;color:var(--muted)}.kpi4 b{font-size:17px}
.donutwrap{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.donut{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;position:relative;flex:0 0 auto;
  background:conic-gradient(var(--line) 0 100%)}
.donut::before{content:"";position:absolute;inset:20px;background:var(--surface);border-radius:50%}
.donut b,.donut span{position:relative;z-index:1}.donut b{font-size:26px;font-weight:900}.donut span{font-size:12px;color:var(--muted)}
.legend{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 22px;flex:1;min-width:220px;font-size:14px}
.legend li{display:flex;justify-content:space-between;gap:8px}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:middle}
.viewbar{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap;align-items:center}
.viewbar button{padding:7px 12px;border-radius:9px;background:var(--surface);border:1px solid var(--line);font-weight:700;font-size:13px}
.viewbar button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.fav{position:absolute;top:8px;right:8px;background:#fff;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;font-size:17px;color:#d1d5db;box-shadow:var(--shadow)}
.fav.on{color:var(--danger)}
.pc{position:relative}
.ptbl img{width:44px;height:44px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:8px}
.ptbl td{vertical-align:middle;font-size:13.5px}
.ptbl .favt{font-size:18px;color:#d1d5db;padding:2px 6px}.ptbl .favt.on{color:var(--danger)}
.ohead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.filters.of{display:grid;gap:8px;margin:10px 0 14px}
@media(min-width:800px){.filters.of{grid-template-columns:1.4fr 1fr 1fr 1fr auto}}
.filters.of input,.filters.of select{padding:9px 11px;font-size:14px}

/* новинки / знову в наявності */
.pc{position:relative}
.tag{position:absolute;left:8px;top:8px;z-index:2;font-size:10.5px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;padding:3px 7px;border-radius:7px;color:#fff}
.tag.new{background:#f59e0b}.tag.back{background:#0ea5e9}
.tag.inl{position:static;display:inline-block;padding:1px 6px;font-size:9.5px;margin-left:4px}
.viewbar .newbtn.on{background:#fff7ed;border-color:#f59e0b;color:#b45309}
.viewbar .xlsbtn{margin-left:auto;background:#166534;color:#fff;border-radius:9px;padding:7px 12px;font-weight:800;font-size:13px}
.side .sidelink{display:block;padding:9px 12px;border-radius:10px;font-size:14px;color:var(--muted);margin-top:6px}
.side .sidelink:hover{background:var(--bg);color:var(--text)}
.dcard.stk .dh span{background:#ecfeff}

/* ---------- вітрина (публічний каталог) ---------- */
.sfhead .wrap{gap:14px}
.sfsearch{display:flex;flex:1;min-width:220px;max-width:420px;border-radius:10px;overflow:hidden;background:#fff}
.sfsearch input{flex:1;border:0;padding:10px 12px;font:inherit;font-size:14px;color:var(--text);outline:0}
.sfsearch button{background:var(--warm);color:#fff;padding:0 14px;font-size:15px}
.sfsup{font-size:12.5px;line-height:1.3;opacity:.95}.sfsup span{display:block;font-weight:700}.sfsup a{text-decoration:underline}
.sfphone{font-weight:900;font-size:17px;white-space:nowrap}
.sfhead nav{margin-left:auto}
.sfcart{background:#fff;color:var(--accent-dark);font-weight:900;padding:8px 12px;border-radius:10px}
.sfnav{background:#0b3d3a;color:#fff}
.sfnav .wrap{display:flex;gap:0;flex-wrap:wrap;align-items:center}
.sfnav a{padding:10px 11px;font-weight:700;font-size:13.5px;white-space:nowrap}.sfnav a:hover{background:rgba(255,255,255,.08)}
.sfnav a.cat{background:var(--accent);min-width:190px;font-weight:900;letter-spacing:.03em;padding-left:16px}.sfnav a.cat.on{background:var(--accent-dark)}
.sfhome{display:grid;gap:16px;padding-top:16px;padding-bottom:16px}
.sfwrap{display:grid;gap:16px;padding-top:16px;padding-bottom:30px}
@media(min-width:900px){.sfhome,.sfwrap{grid-template-columns:250px 1fr}}
.sfside{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px;align-self:start;font-size:14px}
.sfside h3{font-size:14px;text-transform:uppercase;letter-spacing:.05em;padding:8px 10px 6px;color:var(--accent-dark)}
.sfsec>a{display:flex;justify-content:space-between;gap:8px;padding:9px 12px;border-radius:9px;font-weight:700;background:var(--accent);color:#fff;margin-bottom:4px}
.sfsec>a i,.sfcats a i{font-style:normal;opacity:.7;font-weight:400;font-size:12px}
.sfcats{display:none;padding:2px 0 6px 8px}.sfsec.open .sfcats{display:block}
.sfcats a{display:flex;justify-content:space-between;gap:6px;padding:5px 8px;border-radius:7px;font-size:13.5px}
.sfcats a:hover,.sfcats a.on{background:var(--bg);color:var(--accent-dark);font-weight:700}
.sfside.arr a{display:block;padding:9px 12px;border-radius:9px;font-weight:700;margin-bottom:4px;border:1px solid var(--line);background:var(--bg)}
.sfside.arr a.on{border-color:var(--accent);background:#fff;color:var(--accent-dark)}
.sfside.arr a.all{background:none;border:0;color:var(--accent-dark);text-align:right}
.banners{display:grid;gap:14px}@media(min-width:700px){.banners{grid-template-columns:repeat(3,1fr)}}
.bn{border-radius:14px;padding:22px 18px;min-height:230px;display:flex;flex-direction:column;color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.bn b{font-size:22px;line-height:1.1;letter-spacing:.02em}.bn span{font-size:14px;margin-top:6px;opacity:.95}
.bn i{font-style:normal;margin-top:auto;font-weight:700;font-size:13.5px;background:rgba(0,0,0,.22);padding:8px 10px;border-radius:8px}
.bn.b1{background:linear-gradient(135deg,#0f766e,#14b8a6)}.bn.b2{background:linear-gradient(135deg,#1d4ed8,#38bdf8)}.bn.b3{background:linear-gradient(135deg,#b45309,#f59e0b)}
.bn::after{content:"";position:absolute;right:-40px;bottom:-40px;width:170px;height:170px;border-radius:50%;background:rgba(255,255,255,.12)}
.flow{display:flex;gap:6px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 16px;margin-bottom:4px}
.flow div{flex:1;min-width:0;text-align:center;font-size:12.5px;line-height:1.3}
.flow i{display:block;font-style:normal;font-size:28px;width:58px;height:58px;line-height:58px;margin:0 auto 6px;border:2px solid var(--accent);border-radius:12px;background:#fff}
.flow em{flex:0 0 auto}
@media(max-width:700px){.flow{flex-direction:column;align-items:stretch}.flow div{min-width:0}}
.flow em{font-style:normal;color:var(--accent);font-size:26px}
@media(max-width:700px){.flow em{display:none}}
.sfgrid .pc .n{font-size:13px;line-height:1.35;font-weight:600;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sfgrid .pc .pr2{font-size:12px;color:var(--muted)}
.sfgrid .pc .add.sec{background:var(--bg);color:var(--accent-dark);border:1px solid var(--line);text-align:center;font-size:12.5px}
.sfbar{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.sfbar h1{font-size:24px}
.sftools{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.sftools select{padding:8px 10px;border-radius:9px;border:1px solid var(--line);background:#fff;font:inherit;font-size:13.5px}
.chipbtn{padding:8px 12px;border-radius:9px;background:#fff;border:1px solid var(--line);font-weight:700;font-size:13px}
.chipbtn.on{background:#fff7ed;border-color:#f59e0b;color:#b45309}
.sfcta{text-align:center}.sfcta h2{margin-bottom:6px}
.crumbs{font-size:13.5px;color:var(--muted);margin-bottom:12px}.crumbs a:hover{text-decoration:underline}
.prod{display:grid;gap:24px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px}
@media(min-width:860px){.prod{grid-template-columns:420px 1fr}}
.pgal img#big{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:12px;border:1px solid var(--line)}
.thumbs{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.thumbs img{width:64px;height:64px;object-fit:contain;border:2px solid var(--line);border-radius:8px;background:#fff;cursor:pointer}
.thumbs img.on{border-color:var(--accent)}
.pinfo h1{font-size:22px;line-height:1.3;margin:6px 0 4px}
.pprices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.pprices div{background:var(--bg);border-radius:12px;padding:10px 12px}
.pprices span{display:block;font-size:12px;color:var(--muted)}.pprices span i{font-style:normal;background:var(--accent);color:#fff;border-radius:6px;padding:1px 6px;font-weight:800;margin-left:4px}
.pprices b{font-size:20px;color:var(--accent-dark)}.pprices b.ret{color:var(--muted);text-decoration:line-through;font-size:16px}
.pdesc{font-size:15px;line-height:1.6}.pdesc p{margin-bottom:8px}
.specs{border-collapse:collapse;font-size:14px;width:100%}.specs td{padding:6px 8px;border-bottom:1px solid var(--line)}.specs td:first-child{color:var(--muted);width:45%}

/* модалка реєстрації/входу на вітрині */
.sfmodal{position:fixed;inset:0;background:rgba(6,40,38,.55);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:30px 12px;overflow:auto}
.sfmodal .box{background:var(--surface);border-radius:16px;padding:22px;width:100%;max-width:440px;position:relative;box-shadow:var(--shadow-lg)}
.sfmodal .x{position:absolute;right:10px;top:8px;font-size:26px;color:var(--muted);line-height:1}
.sfmodal .tabs{display:flex;gap:6px;margin-bottom:14px}
.sfmodal .tabs button{flex:1;padding:9px;border-radius:10px;background:var(--bg);font-weight:800}.sfmodal .tabs button.on{background:var(--accent);color:#fff}
.sfmodal label{display:block;font-size:13px;font-weight:700;margin:10px 0 4px}
.sfmodal input,.sfmodal select{width:100%;padding:10px 12px;border:2px solid var(--line);border-radius:10px;font:inherit;font-size:15px;background:#fff;color:var(--text)}
.sfmodal .err{color:var(--danger);font-size:13.5px;min-height:18px;margin-top:6px}

/* передзвонити */
.cbwrap{padding:26px 0 30px}
.cbwrap .wrap{display:grid;gap:16px}@media(min-width:800px){.cbwrap .wrap{grid-template-columns:1fr 1fr}}
.cb,.cb2{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px}
.cb h3{font-size:18px;margin-bottom:4px}.cb p{color:var(--muted);font-size:14.5px}
.cb form{display:flex;gap:10px;margin:12px 0 10px;flex-wrap:wrap}
.cb form input[type=tel]{flex:1;min-width:180px;padding:11px 12px;border:2px solid var(--line);border-radius:10px;font:inherit;font-size:16px}
.cb form .cta{margin:0}
.cb2{display:flex;flex-direction:column;justify-content:center;gap:4px}
.cb2 b{font-size:26px;color:var(--accent-dark)}.cb2 span{color:var(--muted);font-size:14px}.cb2 a{margin-top:10px;color:var(--accent-dark);font-weight:800;text-decoration:underline}
.sfhead nav a.sffav{background:#fff;color:var(--danger)}
.side .sidelink.adminlink{background:#fff7ed;color:#b45309;font-weight:800;border:1px solid #fde68a}

/* шапка кабінету */
.cabnav{display:flex;align-items:center;gap:10px;margin-left:auto}
.cabnav .mgr{display:flex;flex-direction:column;line-height:1.15;padding:6px 12px;border-radius:10px;background:rgba(255,255,255,.12)}
.cabnav .mgr span{font-size:11px;opacity:.85}.cabnav .mgr b{font-size:14.5px;font-weight:800}
.cabnav .sfl{padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.12);font-weight:700;font-size:13.5px}
.cabnav .whobox{display:flex;align-items:center;gap:8px;padding:5px 6px 5px 12px;border-radius:10px;background:rgba(255,255,255,.12)}
.cabnav .whobox .who{font-size:13px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cabnav .whobox button{background:#fff;color:var(--accent-dark);padding:6px 12px;border-radius:8px;font-weight:800;font-size:13px}
.cabnav .cartbtn{position:relative;width:44px;height:44px;border-radius:12px;background:#fff!important;color:var(--accent-dark);font-size:20px!important;display:grid;place-items:center;padding:0!important}
.cabnav .cartbtn i{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--danger);color:#fff;font-style:normal;font-size:12px;font-weight:900;line-height:20px;text-align:center}
@media(max-width:700px){.cabnav .mgr,.cabnav .sfl{display:none}.cabnav .whobox .who{max-width:120px}}

.fincards{display:grid;gap:12px;margin-bottom:16px}@media(min-width:800px){.fincards{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}}
.fc{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.fc span{display:block;font-size:12.5px;color:var(--muted)}.fc b{display:block;font-size:22px;color:var(--accent-dark);margin:2px 0}.fc small{font-size:12px;color:var(--muted)}
.fc.g{background:linear-gradient(135deg,#f0fdf4,#f7fff9)}.fc.r{background:#fff1f2}.fc.r b{color:var(--danger)}

.sfhome{align-items:start}
.usp{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.usp div{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.usp b{display:block;font-size:18px;color:var(--accent-dark)}.usp span{font-size:12.5px;color:var(--muted)}
@media(max-width:700px){.usp{grid-template-columns:1fr 1fr}}
.flow{margin-bottom:0}

.sfsearch{max-width:none;flex:1 1 260px}
.sfsup{white-space:nowrap}
@media(max-width:1100px){.sfsup{display:none}}

@media(min-width:1000px){.sfhead .wrap{flex-wrap:nowrap}.sfsearch{flex:1 1 160px;min-width:160px}.sfhead nav{flex:0 0 auto}.sfhead .logo span{display:none}}
.logo .dropmark{display:inline-block;font-style:normal;font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;background:var(--warm);color:#fff;border-radius:7px;padding:2px 7px;margin-left:8px;vertical-align:middle;position:relative;top:-2px}


@media(max-width:899px){.sfhome .sfside:not(.arr){display:none}.sfwrap .sfside{order:2}.sfnav a{padding:10px 12px;font-size:13.5px}.sfnav a.cat{min-width:0}}
.dcard.ref{background:linear-gradient(135deg,#fdf4ff,#fbf7ff)}
.tag.top{background:#dc2626}
.sfside.arr h3{margin-top:0}

/* шапка: надходження (випадашка) і ТОП */
.sfnav .dd{position:relative;display:inline-block}
.sfnav .dd>a{display:inline-block}
.sfnav .ddm{display:none;position:absolute;left:0;top:100%;background:#fff;color:var(--text);min-width:200px;border-radius:0 0 12px 12px;box-shadow:var(--shadow-lg);padding:6px;z-index:30}
.sfnav .dd:hover .ddm{display:block}
.sfnav .ddm a{display:block;padding:8px 12px;border-radius:8px;font-size:14px;font-weight:600;color:var(--text)}
.sfnav .ddm a:hover{background:var(--bg);color:var(--accent-dark)}
.sfnav .ddm a.all{color:var(--accent-dark);border-top:1px solid var(--line);margin-top:4px;border-radius:0 0 8px 8px}
.sfnav a.hot{color:#fde68a}
#dates .chipbtn{text-decoration:none}#dates .chipbtn.on{background:#fff7ed;border-color:#f59e0b;color:#b45309}

#cartbox input.sp{width:120px;padding:7px 9px;border:2px solid var(--line);border-radius:9px;font:inherit;font-size:14px}
#cartbox td.bad{color:var(--danger);font-weight:800}

.tag.sale{background:#e11d48}.tag.oos{background:#6b7280}
.pc.oos .th img{opacity:.45;filter:grayscale(.6)}

.sfgrid .pc .szs{font-size:11.5px;color:var(--muted);display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.sfgrid .pc .szs span{border:1px solid var(--line);border-radius:6px;padding:0 5px;font-weight:700;color:var(--text)}
.szrow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0 4px}
.szrow .sz{border:2px solid var(--line);border-radius:9px;padding:5px 11px;font-weight:800;font-size:14px;color:var(--text)}
.szrow .sz.on{border-color:var(--accent);background:var(--accent);color:#fff}.szrow a.sz:hover{border-color:var(--accent)}

/* месенджери в шапці: те саме, що в роздробі — пишуть туди, де зручно */
.sfmsgs{display:inline-flex;gap:7px;margin-left:10px;vertical-align:middle}
.sfmsgs a{display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.14);
  color:#fff;text-decoration:none;transition:background .15s}
.sfmsgs a:hover{background:rgba(255,255,255,.26)}
.sfmsgs svg{width:17px;height:17px}
@media (max-width:760px){
  .sfmsgs{margin-left:6px;gap:5px}
  .sfmsgs a{width:29px;height:29px}
}

/* ---- картка каталогу в стилі opt-drop (09.10+) ---- */
.sfgrid{gap:14px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.sfgrid .pc{border-radius:16px;border:1px solid var(--line);transition:box-shadow .15s}
.sfgrid .pc:hover{box-shadow:0 6px 22px rgba(15,60,56,.14)}
.sfgrid .pc .th{aspect-ratio:1/1;border-radius:14px 14px 0 0}
.sfgrid .pc .b{padding:10px 14px 14px;gap:6px}
.sfgrid .pc .meta{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.sfgrid .pc .aid{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sfgrid .pc .av{color:#16a34a;font-weight:600;white-space:nowrap;font-size:12px}
.sfgrid .pc .av.no{color:#9ca3af}
.sfgrid .pc .n{font-size:14.5px;font-weight:700;line-height:1.35;-webkit-line-clamp:2;min-height:39px}
.sfgrid .pc .prow{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto}
.sfgrid .pc .pl{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.sfgrid .pc .pl .op{font-size:12.5px;color:var(--muted)}
.sfgrid .pc .pl .dp{font-size:15.5px;font-weight:800;color:var(--accent-dark);white-space:nowrap}
.sfgrid .pc .buy{display:inline-block;background:var(--accent);color:#fff;font-weight:800;font-size:13.5px;padding:9px 16px;border-radius:999px;border:0;cursor:pointer;text-align:center;white-space:nowrap;text-decoration:none}
.sfgrid .pc .buy:hover{background:var(--accent-dark)}
.sfgrid .pc .buy.no{background:var(--bg);color:var(--muted);cursor:default}
.pc .land{position:absolute;top:46px;right:8px;width:32px;height:32px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:16px;text-decoration:none;box-shadow:var(--shadow);z-index:2}
.pc .land:hover{background:#ecfdf5}
.catpill{display:inline-flex;align-items:center;gap:6px;background:#84cc16;color:#14301b;font-weight:800;font-size:14px;padding:9px 16px;border-radius:999px;text-decoration:none;white-space:nowrap}
.catpill:hover{background:#a3e635}
.sfchips{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 6px}
.sfchips .chipbtn{padding:11px 18px;border-radius:12px;font-size:14px;background:#fff;border:1px solid var(--line);font-weight:700}
.sfchips .chipbtn.on{background:#ecfdf5;border-color:#84cc16;color:#166534}
.sfcrumbs{font-size:13px;color:var(--muted);margin:14px 0 4px}.sfcrumbs a{color:var(--muted);text-decoration:none}.sfcrumbs a:hover{text-decoration:underline}

/* кабінет: плитка каталогу та кнопка купівлі */
.sfgrid .pc .buyrow{display:flex;gap:8px;align-items:center;margin-top:6px}
.sfgrid .pc .buyrow .qty{flex:none}
.sfgrid .pc .cartbtn{flex:1;background:var(--accent);color:#fff;font-weight:800;font-size:13.5px;padding:9px 12px;border-radius:999px;margin:0;white-space:nowrap}
.sfgrid .pc .cartbtn:hover{background:var(--accent-dark)}
.sfgrid .pc .landlnk{display:block;margin:6px auto 0;font-size:12.5px;color:var(--accent-dark)}
.sfgrid .pc .prow .ret{font-size:12px;color:var(--muted);text-decoration:line-through}

/* ---- сторінка товару в стилі opt-drop ---- */
.prod2{background:transparent;border:0;padding:0;display:block}
.prod2 .pback{display:inline-block;font-size:13px;font-weight:700;color:var(--muted);text-decoration:none;margin:0 0 8px}
.prod2 .ptitle{font-size:26px;line-height:1.25;margin:0 0 16px}
.prod2 .pmain{display:grid;gap:26px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}
@media(min-width:900px){.prod2 .pmain{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}
.prod2 .pgal2{display:flex;gap:12px;align-items:flex-start}
.prod2 .thumbs2{display:flex;flex-direction:column;gap:8px;max-height:460px;overflow-y:auto;margin:0;flex:none}
.prod2 .thumbs2 img{width:64px;height:64px;object-fit:contain;border:2px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.prod2 .thumbs2 img.on{border-color:var(--accent)}
.prod2 .bigwrap{flex:1;min-width:0}
.prod2 .bigwrap img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:14px;border:1px solid var(--line)}
@media(max-width:640px){.prod2 .pgal2{flex-direction:column-reverse}.prod2 .thumbs2{flex-direction:row;max-height:none;overflow-x:auto}}
.prod2 .pmeta{display:flex;justify-content:space-between;gap:10px;font-size:14px;color:var(--muted);margin-bottom:12px;flex-wrap:wrap}
.prod2 .pmeta b{color:var(--text)}
.prod2 .av{color:#16a34a;font-weight:700}.prod2 .av.no{color:#9ca3af}
.prod2 .prices2{margin:12px 0 14px}
.prod2 .prices2 .r{display:flex;align-items:baseline;gap:14px;margin:2px 0}
.prod2 .prices2 .r span{font-size:14px;color:var(--text);min-width:120px}.prod2 .prices2 .r span i{font-style:normal;color:var(--muted);font-size:12px}
.prod2 .prices2 .r b{font-size:26px;font-weight:900}
.prod2 .prices2 .r.dr span,.prod2 .prices2 .r.dr b{color:var(--accent-dark)}
.prod2 .prices2 .rt{font-size:13px;color:var(--muted);margin-top:6px}
.prod2 .buyline{display:flex;gap:10px;align-items:center;margin:6px 0 12px}
.prod2 .buyline .qty{border-radius:12px}.prod2 .buyline .qty button{width:42px;height:46px}.prod2 .buyline .qty input{width:56px;height:46px;font-size:16px}
.prod2 .favbig{width:48px;height:48px;border-radius:12px;background:var(--accent);color:#fff;font-size:20px}
.prod2 .favbig.on{background:var(--danger)}
.prod2 .btns2{display:flex;gap:10px;flex-wrap:wrap}
.prod2 .btns2 .cta{flex:1;min-width:200px;text-align:center}
.prod2 .pill{border-radius:999px;padding:14px 22px;font-size:15px}
.prod2 .dlv{margin-top:20px;border-top:1px solid var(--line);padding-top:14px}
.prod2 .dlv h3{margin:0 0 8px;font-size:17px}.prod2 .dlv ul{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.9}
.prod2 .pdesc2{margin-top:16px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px 22px}

/* ---- оформлення замовлення в стилі opt-drop ---- */
.co-title{font-size:24px;margin:0 0 14px}.co-title small{font-size:14px;font-weight:500;margin-left:8px}
.co{display:grid;gap:18px;align-items:start}
@media(min-width:980px){.co{grid-template-columns:minmax(0,1fr) 380px}.co-side{position:sticky;top:12px}}
.co-main{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:6px 22px}
.co .cs{padding:20px 0;border-bottom:1px solid var(--line)}.co .cs:last-of-type{border-bottom:0}
.co .cs h3{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:18px}
.co .cs h3 i{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;font-style:normal;font-size:14px;display:grid;place-items:center;flex:none}
.co .two{display:grid;gap:12px}@media(min-width:620px){.co .two{grid-template-columns:1fr 1fr}}
.co .viewbar,.co .cardsel{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.co .viewbar button,.co .cardsel button{display:flex;align-items:center;gap:10px;text-align:left;padding:14px 16px;border:2px solid var(--line);border-radius:12px;background:#fff;font-weight:700;font-size:14px;position:relative}
.co .viewbar button.on,.co .cardsel button.on{border-color:var(--accent);background:#ecfdf5}
.co .viewbar button.on::after,.co .cardsel button.on::after{content:"✓";position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;display:grid;place-items:center}
.co .paycard{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border:2px solid var(--accent);background:#ecfdf5;border-radius:12px;margin-bottom:12px}
.co .paycard span{font-size:13px;color:var(--muted)}
.co textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font:inherit;resize:vertical}
.sumcard h3{margin:0 0 10px;font-size:18px}
.sumcard .tot{display:flex;justify-content:space-between;gap:10px;padding:6px 0;font-size:14px}
.sumcard .tot.big b{font-size:20px;color:var(--accent-dark)}

/* ---- замовлення партнера в стилі opt-drop ---- */
.ochips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.ochips button{padding:9px 16px;border-radius:999px;background:#f3f4f6;font-weight:700;font-size:13.5px;border:0}
.ochips button.on{background:var(--accent);color:#fff}
.filters.of .pp{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.otbl td{vertical-align:top}.otbl tbody tr{cursor:pointer}.otbl tbody tr:hover{background:#f6fbfa}
.st{display:inline-block;padding:3px 11px;border-radius:999px;font-size:12.5px;font-weight:700;background:#e5e7eb;color:#374151;white-space:nowrap}
.st.new{background:#dbeafe;color:#1d4ed8}.st.confirmed{background:#e0e7ff;color:#4338ca}.st.shipped{background:#fef3c7;color:#92400e}
.st.received,.st.done{background:#dcfce7;color:#166534}.st.refused,.st.cancelled{background:#fee2e2;color:#b91c1c}.st.returned{background:#ffedd5;color:#c2410c}
.eyeb{font-size:18px;background:transparent}
.opager{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 0 4px;font-size:14px;flex-wrap:wrap}
.ohd{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.ohd h2{margin:0 0 4px}
.backb{width:38px;height:38px;border-radius:50%;background:#f3f4f6;font-size:18px;font-weight:800}
.ogrid{display:grid;gap:16px;margin-top:16px;align-items:start}@media(min-width:980px){.ogrid{grid-template-columns:300px minmax(0,1fr)}}
.ogrid .card h3{margin:0 0 12px;font-size:17px}.ogrid>div>.card{margin-bottom:16px}
.orow2{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.orow2.big{border-bottom:0}.orow2.big b{font-size:20px}
.oitem{display:grid;grid-template-columns:56px minmax(0,1fr) repeat(4,minmax(70px,auto));gap:12px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
@media(max-width:760px){.oitem{grid-template-columns:56px 1fr 1fr}.oi-n{grid-column:2/-1}}
.oitem img{width:56px;height:56px;object-fit:contain;border-radius:8px;border:1px solid var(--line);background:#fff}
.oi-n{display:flex;flex-direction:column;gap:2px;font-size:14px;font-weight:600}.oi-n a{color:var(--text)}
.oi-c{display:flex;flex-direction:column;font-size:13px}.oi-c b{font-size:15px}
.kv{display:grid;gap:14px 24px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.kv div{display:flex;flex-direction:column;gap:2px}.kv b{font-size:15px}
.cmt{background:#f3f4f6;border-radius:12px;padding:14px 16px;font-size:14px}

/* головна: заповнення правої колонки */
.homefill{margin-top:18px}
.hf-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}.hf-head h2{margin:0;font-size:20px}.hf-head a{font-size:13.5px;font-weight:700;color:var(--accent-dark)}
.hrow{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(200px,230px);overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
.hrow .pc{scroll-snap-align:start}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.tiles a{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--text);font-weight:700;font-size:14px;line-height:1.25}
.tiles a:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(15,60,56,.1)}
.tiles i{font-style:normal;font-size:24px;width:40px;height:40px;border-radius:12px;background:#ecfdf5;display:grid;place-items:center;flex:none}
.tiles small{display:block;font-weight:500;color:var(--muted);font-size:12px}

/* вирівнювання: кнопка «КАТАЛОГ» у темній смузі = ширина лівої колонки з розділами (250px), логотип і колонка по одній лівій лінії */
@media(min-width:900px){
  .sfnav a.cat{width:250px;min-width:250px;box-sizing:border-box;margin-right:12px}
  .sfhead .logo{min-width:0}
}

/* фікс: горизонтальна стрічка не розтягує колонку сітки (сторінка «розʼїжджалась») */
.sfhome>div,.sfwrap>main{min-width:0}
.hrow{max-width:100%;grid-auto-columns:220px}
.sfgrid .pc .prow{flex-wrap:wrap;row-gap:8px}
.sfgrid .pc .buy{padding:8px 14px}

/* ліва колонка з розділами «їде» за прокруткою, тому поруч із довгим вмістом немає порожнечі */
@media(min-width:900px){
  .sfhome{align-items:stretch}
  .sfhome>.sfside{position:sticky;top:12px;align-self:start;max-height:calc(100vh - 24px);overflow-y:auto}
}

/* ---- фінанси, статистика, дашборд в стилі opt-drop ---- */
.kcards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:16px}
.kc{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px 20px;display:flex;flex-direction:column;gap:4px}
.kc span{font-size:13.5px;color:var(--muted)}.kc b{font-size:28px;font-weight:900;line-height:1.1}.kc small{font-size:12.5px;color:var(--muted)}
.kc i{position:absolute;right:16px;top:14px;font-style:normal;font-size:20px;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#ecfdf5}
.kc.b i{background:#dbeafe}.kc.r i{background:#fee2e2}.kc.y i{background:#fef3c7}
.ftabs{display:flex;gap:6px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px;margin-bottom:14px}
.ftabs button{flex:1;min-width:110px;padding:10px 14px;border-radius:10px;font-weight:700;font-size:13.5px;background:transparent}
.ftabs button.on{background:var(--accent);color:#fff}
.ftools{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.ftools input{flex:1;min-width:200px;padding:10px 14px;border:1px solid var(--line);border-radius:12px}
.ftools .pp{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin-left:auto}
.skcards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:14px 0}
.sk{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.sk i{font-style:normal;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-weight:800;margin-bottom:6px}
.sk i.b{background:#dbeafe;color:#1d4ed8}.sk i.p{background:#ede9fe;color:#6d28d9}.sk i.g{background:#dcfce7;color:#166534}.sk i.r{background:#fee2e2;color:#b91c1c}.sk i.y{background:#fef3c7;color:#b45309}
.sk b{font-size:26px;font-weight:900}.sk span{font-size:13.5px;color:var(--muted)}
.sk em{position:absolute;right:14px;bottom:14px;font-style:normal;font-size:12px;font-weight:800;padding:2px 9px;border-radius:99px}
.sk em.g{background:#dcfce7;color:#166534}.sk em.r{background:#fee2e2;color:#b91c1c}.sk em.y{background:#fef3c7;color:#b45309}
.sgrid{display:grid;gap:16px;align-items:start}@media(min-width:980px){.sgrid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}}
.chart{width:100%;height:260px;display:block}
.schips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.schips button{padding:7px 14px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:700}
.schips button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.kb{margin:0 0 16px}.kh{display:flex;justify-content:space-between;align-items:center;font-weight:700;margin-bottom:6px}
.kh em{font-style:normal;font-size:12px;font-weight:800;padding:2px 9px;border-radius:99px}
.kbar{height:7px;background:#e5e7eb;border-radius:99px;overflow:hidden}.kbar i{display:block;height:100%;border-radius:99px}
.kboxes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}.kboxes>div{background:#f9fafb;border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}.kboxes b{font-size:20px}

/* галерея товару: стрілки, лічильник, повноекранний перегляд */
.prod2 .bigwrap{position:relative}.prod2 .bigwrap img#big{cursor:zoom-in}
.gnav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 2px 10px rgba(0,0,0,.2);font-size:26px;line-height:1;color:var(--accent-dark);display:grid;place-items:center;z-index:3;border:0;cursor:pointer}
.gnav:hover{background:#fff}.gnav.prev{left:10px}.gnav.next{right:10px}
.gcount{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.55);color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:1000;display:flex;align-items:center;justify-content:center}
.lb img{max-width:92vw;max-height:88vh;object-fit:contain;background:#fff;border-radius:10px}
.lb .gnav{width:52px;height:52px;font-size:32px}.lb .gnav.prev{left:18px}.lb .gnav.next{right:18px}
.lbx{position:absolute;top:16px;right:18px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.15);color:#fff;font-size:20px;border:0;cursor:pointer}
.lbc{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:#fff;font-weight:700;font-size:14px}

/* ---- лендінги в стилі opt-drop ---- */
.lcount{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.lcount .lc{display:flex;flex-direction:column;gap:2px}.lcount .lc b{font-size:22px}
.lcount .lbtns{margin-left:auto}
.pmback{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:900;display:flex;align-items:flex-start;justify-content:center;padding:40px 12px;overflow-y:auto}
.pmback[hidden]{display:none}
.pmod{background:#fff;border-radius:16px;width:100%;max-width:820px;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.pmh{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 6px}.pmh h2{margin:0;font-size:20px}
.pmh button{width:34px;height:34px;border-radius:50%;background:#f3f4f6;font-size:16px}
.pmt{display:flex;gap:10px;padding:10px 22px}.pmt input{flex:1;padding:11px 14px;border:1px solid var(--line);border-radius:12px;font:inherit}
.pmt .cta.on{background:#fee2e2;color:#b91c1c}
.pmb{padding:0 22px;max-height:60vh;overflow-y:auto}
.pmtbl{width:100%;border-collapse:collapse}.pmtbl th{font-size:11.5px;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px 6px;border-bottom:1px solid var(--line)}
.pmtbl td{padding:10px 6px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:14px}
.pmn{display:flex;gap:12px;align-items:center}.pmn img{width:46px;height:46px;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff;flex:none}.pmn span{font-weight:600;line-height:1.3}
.pmf{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 22px;border-top:1px solid var(--line);margin-top:6px}

/* фікс оформлення: клас кроку не збігається з блоками «Як це працює»; видимий текст на картках; компактний склад замовлення справа */
.co .viewbar button,.co .cardsel button{color:var(--text)}
.co .viewbar button.on,.co .cardsel button.on{color:var(--text);padding-right:42px}
.co #kindbox>label{display:none}
.sumcard #cartbox{overflow:visible}
.sumcard .clines{display:flex;flex-direction:column;gap:10px}
.sumcard .cl{display:grid;grid-template-columns:52px minmax(0,1fr) 28px;gap:8px 10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fafcfc;align-items:start}
.sumcard .cli{width:52px;height:52px;object-fit:contain;border-radius:10px;border:1px solid var(--line);background:#fff;grid-row:1}
.sumcard .cln{display:flex;flex-direction:column;gap:3px;grid-column:2;grid-row:1;min-width:0}.sumcard .cln b{font-size:13.5px;line-height:1.3}.sumcard .cln span{font-size:12.5px}
.sumcard .cld{grid-column:3;grid-row:1;width:26px;height:26px;border-radius:50%;background:#f3f4f6;color:var(--muted);font-size:13px}
.sumcard .clq,.sumcard .clp,.sumcard .clg{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px}
.sumcard .clq>span,.sumcard .clp>span,.sumcard .clg>span{font-size:12.5px}
.sumcard .clp .sp{width:130px;padding:8px 10px;text-align:right}
.sumcard .clg b{font-size:15px}
.sumcard .fine{font-size:12px;color:var(--muted);line-height:1.45}

/* ---- карусель і підбірки головної ---- */
.hero{position:relative;overflow:hidden;border-radius:18px;margin:0 0 4px}
.hslides{display:flex;transition:transform .5s ease}
.hs{flex:0 0 100%;min-height:210px;display:flex;align-items:center;padding:28px 34px;color:#fff;text-decoration:none}
.hs div{max-width:560px;display:flex;flex-direction:column;gap:8px}
.hs small{font-size:12px;font-weight:800;letter-spacing:.08em;opacity:.85}.hs b{font-size:30px;line-height:1.15}.hs span{font-size:15px;opacity:.92}
.hs em{font-style:normal;align-self:flex-start;margin-top:6px;background:#fff;color:#0f3d38;font-weight:800;font-size:14px;padding:9px 18px;border-radius:999px}
.hs.h1{background:linear-gradient(120deg,#0f766e,#14b8a6)}.hs.h2{background:linear-gradient(120deg,#1e3a8a,#38bdf8)}
.hs.h3{background:linear-gradient(120deg,#991b1b,#f97316)}.hs.h4{background:linear-gradient(120deg,#5b21b6,#c084fc)}.hs.h5{background:linear-gradient(120deg,#0e7490,#22d3ee)}
.hnav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.9);font-size:26px;line-height:1;color:#0f3d38;border:0;cursor:pointer;display:grid;place-items:center}
.hnav.hp{left:12px}.hnav.hn{right:12px}
.hdots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:7px}
.hdots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.5);border:0;padding:0}.hdots button.on{background:#fff;width:22px;border-radius:99px}
@media(max-width:640px){.hs{padding:20px;min-height:190px}.hs b{font-size:23px}}
.cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.cols .col{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--text);position:relative;transition:box-shadow .15s,border-color .15s}
.cols .col:hover{box-shadow:0 6px 20px rgba(15,60,56,.12);border-color:var(--accent)}
.cols .col i{font-style:normal;font-size:26px;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#ecfdf5;margin-bottom:4px}
.cols .col b{font-size:15px;line-height:1.25}.cols .col span{font-size:12.5px;color:var(--muted);line-height:1.35}
.cols .col small{margin-top:6px;font-size:12px;font-weight:800;color:var(--accent-dark)}
.cols .t-cold i{background:#dbeafe}.cols .t-cozy i{background:#fef3c7}.cols .t-baby i{background:#fce7f3}.cols .t-ny i{background:#fee2e2}.cols .t-kitchen i{background:#ffedd5}
.cols .t-order i{background:#ede9fe}.cols .t-sport i{background:#dcfce7}

/* ---- конструктор лендингу: форма + живий перегляд ---- */
.lfwrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(300px,440px);gap:16px;align-items:start}
.lfright{position:sticky;top:12px}.lfprev{padding:0;overflow:hidden}.lfph{padding:12px 16px;border-bottom:1px solid var(--line)}.lfph small{display:block;color:var(--muted);font-size:12.5px}
.lfprev iframe{width:100%;height:calc(100vh - 110px);min-height:520px;border:0;display:block;background:#eee}
@media(max-width:1000px){.lfwrap{grid-template-columns:1fr}.lfright{position:static}.lfprev iframe{height:560px}}
.lfs{border:1px solid var(--line);border-radius:14px;margin-top:10px;background:#fff}.lfs>summary{list-style:none;cursor:pointer;padding:12px 16px;display:flex;flex-direction:column;gap:2px}
.lfs>summary::-webkit-details-marker{display:none}.lfs>summary small{color:var(--muted);font-size:12.5px}.lfs[open]{background:#f6fbf8;border-color:#bfe3d3}.lfs>summary:after{content:"▾";position:absolute;right:16px;color:var(--muted)}.lfs{position:relative}
.lfb{padding:0 16px 16px}.lta{width:100%;padding:11px 13px;border:2px solid var(--line);border-radius:12px;font:inherit;font-size:15px}
.tpls{display:grid;gap:8px}.tpl{display:flex;align-items:center;gap:12px;padding:8px 10px;border:2px solid var(--line);border-radius:12px;cursor:pointer;background:#fff;margin:0}.tpl.on{border-color:var(--accent);background:#ecfdf5}
.tpl input{display:none}.tt{flex:none;width:58px;height:74px;border-radius:8px;background:var(--bg);display:flex;flex-direction:column;gap:3px;padding:5px;overflow:hidden;border:1px solid rgba(0,0,0,.12)}
.tt i{display:block;border-radius:3px}.tt .a{height:12px;background:var(--hd)}.tt .b{height:26px;background:var(--card);border:1px solid var(--l)}.tt .c{height:8px;background:var(--nw);width:70%}.tt .d{height:9px;background:var(--a);border-radius:99px}
.tn{flex:1;min-width:0}.tn b{display:block;font-size:14.5px}.tn small{color:var(--muted);font-size:12.5px;font-weight:400}.tv{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);color:var(--muted);text-decoration:none}
.rep{border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:10px;display:grid;gap:8px;background:#fff}.repdel{justify-self:end;font-size:12.5px;color:#b91c1c;background:none;border:0;cursor:pointer}
.lfsw{display:flex;gap:10px;align-items:center;font-weight:600;color:var(--text)}.lfsw input{width:auto}

.crmrow{border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:10px;background:#fff;display:grid;gap:8px}.crmf{display:grid;gap:8px}

/* ---- редактор опису лендингу ---- */
.rte{border:2px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}.rte:focus-within{border-color:var(--accent)}
.rtb{display:flex;flex-wrap:wrap;gap:2px;align-items:center;padding:6px;border-bottom:1px solid var(--line);background:#f6f8f8}
.rtb button,.rtb select{height:32px;min-width:32px;padding:0 8px;border:1px solid transparent;border-radius:8px;background:none;font:inherit;font-size:14px;cursor:pointer;color:var(--text);width:auto}
.rtb button:hover,.rtb select:hover{background:#e6eeee}.rtb .sep{width:1px;height:20px;background:var(--line);margin:0 4px}
.rtc{min-height:180px;max-height:420px;overflow:auto;padding:12px 14px;font-size:15px;line-height:1.6;outline:0}
.rtc p{margin:0 0 .7em}.rtc h2{font-size:19px;margin:.8em 0 .4em}.rtc h3{font-size:16.5px;margin:.8em 0 .4em}.rtc ul,.rtc ol{margin:0 0 .7em 1.3em}.rtc img{max-width:100%;height:auto}.rtc a{color:var(--accent-dark);text-decoration:underline}
.rtc blockquote{margin:.7em 0;padding:.4em 1em;border-left:4px solid var(--accent);background:#f0faf6}.rtc table{width:100%;border-collapse:collapse}.rtc td,.rtc th{border:1px solid var(--line);padding:6px 8px}
