@charset "UTF-8";
/* SC Metal — тема за витрината (OpenCart 3.0.3.7).
ДВЕ ПРАВИЛА ЗА ТОЗИ ФАЙЛ:
1. Цвят не се пише наготово. Всичко тръгва от петте настройки на темата
(акцент, фон, панел, в наличност, по поръчка); производните нюанси ги
смята контролерът и ги подава като променливи в .
2. Размер на шрифт не се пише в пиксели. Ползват се стълбите --fs1..--fs6
(тръгват от „основна големина") и --fh1..--fh6 (тръгват от „големина на
заглавията"), за да мести цялата страница с двете настройки. */
:root{
/* ---- цветове: стойностите тук са само резервни (Индустриално зелено) ---- */
--bg:#101210; --bg2:#171A17; --bg3:#1D211D; --line:#272C27; --line2:#353B35;
--acc:#9EC41C; --acc2:#B4D93A; --accedge:#3A4A17;
--accink:#5C7210; --accline:#C5DC7A; --accsoft:#F6FAEB; --btnink:#111111;
--ok:#12A05A; --okink:#0C7A44; --okb:#B9E2CD; --okbg:#F3FBF7;
--wait:#E0B000; --waitink:#8A6A00; --waitb:#F0DFA6; --waitbg:#FEFBF2;
/* ---- тонове на тъмната рамка (неутрални, не зависят от гамата) ---- */
--t1:#6A6A6A; --t2:#7D7D7D; --t3:#8A8A8A; --t4:#9A9A9A; --t5:#C6C6C6; --t6:#D9D9D9;
/* ---- бялата продуктова карта ---- */
--card:#FFFFFF; --cbg2:#FCFCFC; --cink:#2B2B2B; --cink2:#565656;
--cmid:#767676; --cdim:#9A9A9A; --cline:#E8E8E8; --cline2:#EDEDED; --cedge:#D9D9D9;
/* ---- шрифтове ---- */
--wrap:1800px; --imgh:620px;
--fs:14px; --fsh:26px;
--head:"Century Gothic","Trebuchet MS",Tahoma,sans-serif;
--body:Tahoma,Verdana,Geneva,"Segoe UI",sans-serif;
/* ---- стълба на основния текст ---- */
--fs1:calc(var(--fs) * .72); /* ключове с разредка, брояч */
--fs2:calc(var(--fs) * .82); /* дребен текст, трохи, тагове */
--fs3:calc(var(--fs) * .89); /* навигация, менюта, страници */
--fs4:calc(var(--fs) * .96); /* бутони, перки */
--fs5:calc(var(--fs) * 1.07); /* известие */
--fs6:calc(var(--fs) * 1.16); /* поле за брой (не по-малко от 16px на телефон) */
/* ---- стълба на заглавията ---- */
--fh1:calc(var(--fsh) * .65); /* h2 на секция */
--fh2:calc(var(--fsh) * .73); /* име на продукт в реда */
--fh3:calc(var(--fsh) * .81); /* телефон в хедъра */
--fh4:calc(var(--fsh) * .88); /* телефон в поканата */
--fh5:var(--fsh); /* лого, цена в реда, h1 */
--fh6:calc(var(--fsh) * 1.23); /* цена на продуктовата страница */
}
/* box-sizing: само в нашите зони */
.sc-wrap *,.sc-head *,.sc-topbar *,.sc-foot *{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);font-family:var(--body);font-size:var(--fs);color:var(--t2);-webkit-font-smoothing:antialiased}
.sc-wrap a,.sc-head a,.sc-topbar a,.sc-foot a{color:var(--acc);text-decoration:none}
.sc-wrap a:hover,.sc-head a:hover,.sc-foot a:hover{text-decoration:underline}
.sc-wrap img,.sc-head img,.sc-foot img{max-width:100%;display:block}
.sc-wrap h1,.sc-wrap h2,.sc-wrap h3,.sc-wrap h4{margin:0;font-weight:400}
.sc-wrap :focus-visible,.sc-head :focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* --- горна лента --- */
.sc-topbar{border-bottom:1px solid var(--line);background:var(--bg2)}
.sc-topbar .sc-in{max-width:var(--wrap);margin:0 auto;padding:6px 18px;display:flex;gap:16px;align-items:center;
font-size:var(--fs2);color:var(--t1);letter-spacing:.03em}
.sc-topbar .sc-sp{margin-left:auto;display:flex;gap:16px;align-items:center}
.sc-topbar b{color:var(--t3);font-weight:400}
/* --- хедър --- */
.sc-head{border-bottom:1px solid var(--line)}
.sc-head .sc-in{max-width:var(--wrap);margin:0 auto;padding:20px 18px 18px;display:flex;gap:26px;align-items:center}
.sc-logo{line-height:1.15}
.sc-logo .sc-l1{font-family:var(--head);font-size:var(--fh5);letter-spacing:.10em;color:var(--t6);font-weight:300}
.sc-logo .sc-l1 span{color:var(--acc)}
.sc-logo .sc-l2{font-size:var(--fs1);letter-spacing:.20em;color:var(--t1);text-transform:uppercase;margin-top:4px}
.sc-hnav{display:flex;gap:22px;margin-left:26px;flex-wrap:wrap}
.sc-hnav a{color:var(--t4);font-size:var(--fs3);letter-spacing:.04em}
.sc-hnav a:hover{color:var(--acc)}
.sc-hspace{margin-left:auto}
.sc-hphone{text-align:right;line-height:1.3}
.sc-hphone .sc-n{font-family:var(--head);font-size:var(--fh3);color:var(--acc);letter-spacing:.03em;white-space:nowrap}
.sc-hphone .sc-t{font-size:var(--fs1);color:var(--t1);letter-spacing:.06em;text-transform:uppercase}
.sc-cart{display:flex;align-items:center;gap:9px;border:1px solid var(--line2);padding:11px 14px;color:var(--t4);
cursor:pointer;white-space:nowrap;min-height:44px}
.sc-cart:hover{border-color:var(--acc);color:var(--acc)}
.sc-cart .sc-ico{width:16px;height:16px;border:1.5px solid currentColor;border-top:0;position:relative;display:inline-block}
.sc-cart .sc-ico:before{content:"";position:absolute;left:2px;right:2px;top:-6px;height:7px;border:1.5px solid currentColor;border-bottom:0;border-radius:4px 4px 0 0}
.sc-cart b{color:var(--t6);font-weight:400}
.sc-burger{display:none;width:44px;height:44px;border:1px solid var(--line2);cursor:pointer;padding:13px 11px}
.sc-burger i{display:block;height:1.5px;background:var(--t4);margin:4px 0}
/* --- оформление --- */
.sc-layout{max-width:var(--wrap);margin:0 auto;display:flex;gap:34px;padding:22px 18px 60px;align-items:flex-start}
.sc-col{width:212px;flex:0 0 212px;position:sticky;top:52px}
.sc-main{flex:1;min-width:0}
/* --- ляво меню --- */
.sc-mtitle{font-size:var(--fs1);letter-spacing:.20em;color:var(--t1);text-transform:uppercase;
padding:0 0 9px;border-bottom:1px solid var(--line);margin-bottom:10px}
.sc-menu{list-style:none;margin:0 0 24px;padding:0}
.sc-menu a{display:block;padding:8px 10px 8px 11px;color:var(--t4);font-size:var(--fs3);border-left:2px solid transparent}
.sc-menu a:hover{color:var(--acc);background:var(--bg2);text-decoration:none;border-left-color:var(--accedge)}
.sc-menu a.sc-on{color:var(--acc);border-left-color:var(--acc);background:var(--bg2)}
.sc-menu .sc-cnt{float:right;color:var(--t1);font-size:var(--fs1);padding-top:2px}
.sc-menu .sc-sub{padding-left:24px;font-size:var(--fs2);color:var(--t2)}
.sc-side-call{border:1px solid var(--line);padding:14px;background:var(--bg2)}
.sc-side-call .sc-k{font-size:var(--fs1);letter-spacing:.16em;color:var(--t1);text-transform:uppercase}
.sc-side-call .sc-p{font-family:var(--head);font-size:var(--fh3);color:var(--acc);margin:6px 0 8px;letter-spacing:.02em}
.sc-side-call .sc-s{font-size:var(--fs2);line-height:1.7;color:var(--t3)}
/* --- заглавия --- */
h1.sc-page{font-family:var(--head);font-weight:300;font-size:var(--fh5);color:var(--t5);letter-spacing:.03em;margin:2px 0 6px}
.sc-lead{font-size:var(--fs);line-height:1.85;color:var(--t3);max-width:80ch}
.sc-lead p{margin:0 0 10px}
.sc-crumbs{font-size:var(--fs2);color:var(--t1);margin-bottom:14px;letter-spacing:.02em;list-style:none;padding:0}
.sc-crumbs li{display:inline}
.sc-crumbs li+li:before{content:"› ";color:var(--t1)}
.sc-crumbs a{color:var(--t3)}
.sc-crumbs a:hover{color:var(--acc)}
.sc-sechead{display:flex;align-items:center;gap:14px;margin:34px 0 14px}
.sc-sechead h2{font-family:var(--head);font-weight:300;font-size:var(--fh1);color:var(--t4);letter-spacing:.06em;text-transform:uppercase}
.sc-sechead .sc-ln{flex:1;height:1px;background:var(--line)}
.sc-sechead .sc-more{font-size:var(--fs2)}
.sc-perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:20px 0 8px}
.sc-perks div{background:var(--bg2);padding:13px 16px}
.sc-perks b{display:block;color:var(--t5);font-weight:400;font-size:var(--fs4);font-family:var(--head);letter-spacing:.03em}
.sc-perks span{font-size:var(--fs2);color:var(--t2)}
.sc-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px;margin-top:14px}
.sc-tile{border:1px solid var(--line);background:var(--bg2);display:block;color:inherit}
.sc-tile:hover{border-color:var(--accedge);text-decoration:none}
.sc-tile .sc-im{background:var(--card);height:150px;display:flex;align-items:center;justify-content:center;padding:10px}
.sc-tile .sc-im img{max-height:130px;width:auto}
.sc-tile .sc-tx{padding:11px 13px 13px}
.sc-tile .sc-tx b{display:block;font-weight:400;font-family:var(--head);font-size:var(--fs5);color:var(--t6);letter-spacing:.03em}
.sc-tile:hover .sc-tx b{color:var(--acc)}
.sc-tile .sc-tx span{font-size:var(--fs2);color:var(--t2)}
.sc-tools{display:flex;gap:12px;align-items:center;border:1px solid var(--line);background:var(--bg2);
padding:9px 12px;margin:18px 0;font-size:var(--fs2);color:var(--t2);flex-wrap:wrap}
.sc-tools select{background:var(--bg);border:1px solid var(--line2);color:var(--t5);font:inherit;font-size:var(--fs2);
padding:7px 8px;min-height:36px;max-width:230px}
.sc-tools label{margin:0;font-weight:400;color:var(--t2);font-size:var(--fs2)}
.sc-tools .sc-cntinfo{margin-left:auto;color:var(--t1)}
/* ================= ПРОДУКТОВ РЕД ================= */
.sc-plist{display:flex;flex-direction:column;gap:14px}
.sc-pcard{background:var(--card);border:1px solid var(--cedge);border-left:5px solid var(--ok);display:flex;position:relative}
.sc-pcard.sc-order{border-left-color:var(--wait)}
.sc-pcard .sc-ph{flex:0 0 240px;padding:16px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--cline2)}
.sc-pcard .sc-ph img{max-height:220px;width:auto}
.sc-pcard .sc-bd{flex:1;padding:18px 22px;min-width:0}
.sc-pcard h2.sc-pname{font-family:var(--head);font-size:var(--fh2);font-weight:400;color:var(--cink);letter-spacing:.02em;margin-bottom:11px;line-height:1.3}
.sc-pcard h2.sc-pname a{color:var(--cink)}
.sc-pcard h2.sc-pname a:hover{color:var(--accink)}
.sc-dims{display:flex;border:1px solid var(--cline);margin:0 0 13px;max-width:460px}
.sc-dims div{flex:1;padding:7px 11px;border-right:1px solid var(--cline)}
.sc-dims div:last-child{border-right:0}
.sc-dims span{display:block;font-size:var(--fs1);color:var(--cdim);letter-spacing:.09em;text-transform:uppercase}
.sc-dims b{font-size:var(--fs);color:var(--cink);font-weight:400;font-family:var(--head)}
.sc-pdesc{margin:0;font-size:var(--fs);line-height:1.8;color:var(--cink2)}
.sc-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.sc-tag{font-size:var(--fs2);color:var(--cink2);border:1px solid var(--cline);padding:4px 10px;background:var(--cbg2)}
.sc-tag.sc-ok{color:var(--okink);border-color:var(--okb);background:var(--okbg)}
.sc-tag.sc-wait{color:var(--waitink);border-color:var(--waitb);background:var(--waitbg)}
.sc-pcard .sc-pr{flex:0 0 218px;border-left:1px solid var(--cline2);padding:18px 16px;text-align:center;
display:flex;flex-direction:column;justify-content:center;gap:4px;background:var(--cbg2)}
.sc-price{font-family:var(--head);font-size:var(--fh5);color:var(--cink);letter-spacing:.01em;line-height:1.15}
.sc-price small{font-size:var(--fs2);color:var(--cmid);display:block;letter-spacing:.04em;margin-top:2px}
.sc-price-nv{font-size:var(--fs3);color:var(--cmid);font-style:italic}
.sc-buy{display:flex;gap:7px;margin-top:12px}
.sc-buy input{width:62px;background:var(--card);border:1px solid var(--cedge);color:var(--cink);font:inherit;font-size:var(--fs6);
text-align:center;padding:11px 4px;min-height:44px}
.sc-buy input:focus{border-color:var(--accink);outline:none}
.sc-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--acc);color:var(--btnink);border:1px solid var(--acc);
font:inherit;font-size:var(--fs4);padding:11px 18px;cursor:pointer;letter-spacing:.05em;text-align:center;
font-family:var(--head);min-height:44px}
.sc-btn:hover{background:var(--acc2);border-color:var(--acc2);text-decoration:none;color:var(--btnink)}
.sc-btn.sc-ghost{background:transparent;color:var(--accink);border-color:var(--accline)}
.sc-btn.sc-ghost:hover{background:var(--accsoft);color:var(--accink)}
.sc-btn.sc-dark{background:transparent;border-color:var(--line2);color:var(--t4)}
.sc-btn.sc-dark:hover{border-color:var(--acc);color:var(--acc)}
.sc-buy .sc-btn{flex:1}
.sc-stock{font-size:var(--fs2);letter-spacing:.05em;text-transform:uppercase;color:var(--okink)}
.sc-stock.sc-w{color:var(--waitink)}
.sc-pr .sc-term{font-size:var(--fs2);color:var(--cmid);margin-top:9px}
.sc-pager{display:flex;gap:6px;align-items:center;margin-top:22px;font-size:var(--fs3);flex-wrap:wrap}
.sc-pager a{border:1px solid var(--line2);padding:9px 13px;color:var(--t4);min-width:40px;text-align:center}
.sc-pager a.sc-on{background:var(--acc);border-color:var(--acc);color:var(--btnink)}
.sc-pager a:hover{text-decoration:none;border-color:var(--acc);color:var(--acc)}
.sc-pager a.sc-on:hover{color:var(--btnink)}
.sc-pager .sc-info{margin-left:auto;color:var(--t1);font-size:var(--fs2)}
.sc-pager .pagination{display:inline-flex;gap:6px;padding:0;margin:0;list-style:none}
.sc-pager .pagination li{display:inline-block}
/* --- известие за добавен продукт --- */
.sc-toast{position:fixed;right:18px;bottom:18px;background:var(--card);border-left:5px solid var(--ok);
padding:13px 18px;color:var(--cink);font-size:var(--fs3);box-shadow:0 4px 22px rgba(0,0,0,.5);z-index:300;
opacity:0;transform:translateY(10px);transition:.2s;pointer-events:none}
.sc-toast.sc-on{opacity:1;transform:none}
.sc-toast b{display:block;font-weight:400;font-family:var(--head);font-size:var(--fs5);margin-bottom:2px}
/* ================= ПРОДУКТОВА СТРАНИЦА ================= */
.sc-prod{display:flex;gap:26px;align-items:flex-start}
.sc-gal{flex:0 0 360px}
.sc-gal .sc-big{background:var(--card);border:1px solid var(--cedge);padding:18px;display:flex;align-items:center;justify-content:center;height:340px}
.sc-gal .sc-big img{max-height:300px;width:auto}
.sc-pinfo{flex:1;min-width:0}
.sc-pinfo h1{font-family:var(--head);font-weight:300;font-size:var(--fh5);color:var(--t6);letter-spacing:.02em;line-height:1.3}
.sc-meta{display:flex;gap:18px;font-size:var(--fs2);color:var(--t2);margin:10px 0 16px;letter-spacing:.04em;flex-wrap:wrap}
.sc-meta b{color:var(--t4);font-weight:400}
.sc-pricebox{border:1px solid var(--line);background:var(--bg2);padding:16px 18px;margin-bottom:16px}
.sc-pricebox .sc-big{font-family:var(--head);font-size:calc(var(--fh5) - 4px);color:var(--acc);letter-spacing:.01em;line-height:1.1}
.sc-pricebox .sc-big span{font-size:var(--fs3);color:var(--t3);letter-spacing:.06em;margin-left:6px}
.sc-pricebox .sc-nv{font-size:var(--fs3);color:var(--t3);font-style:italic;margin-top:6px}
.sc-pricebox .sc-nv.sc-ex{font-family:var(--head);font-size:calc(var(--fh5) - 8px);color:var(--t4);
font-style:normal;letter-spacing:.01em;line-height:1.1;margin-top:5px}
.sc-pricebox .sc-nv.sc-ex span{font-family:var(--body);font-size:var(--fs3);color:var(--t3);
letter-spacing:.06em;margin-left:6px}
.sc-spec{width:100%;border-collapse:collapse;max-width:520px;margin:6px 0 16px}
.sc-spec td{border-bottom:1px solid var(--line);padding:8px 10px;font-size:var(--fs3)}
.sc-spec td:first-child{color:var(--t2);width:45%}
.sc-spec td:last-child{color:var(--t5)}
.sc-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ok);margin-right:7px;vertical-align:1px}
.sc-dot.sc-w{background:var(--wait)}
.sc-cta{border:1px solid var(--line);background:var(--bg2);border-left:4px solid var(--acc);
padding:18px 22px;margin:22px 0;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.sc-cta .sc-t{font-family:var(--head);font-size:var(--fh1);color:var(--t5);letter-spacing:.02em}
.sc-cta .sc-s{font-size:var(--fs3);color:var(--t3);flex:1;min-width:220px}
.sc-cta .sc-p{font-family:var(--head);font-size:var(--fh4);color:var(--acc);letter-spacing:.02em;white-space:nowrap}
.sc-prod-note{font-size:var(--fs2);color:var(--t2)}
/* ================= ИНФО ================= */
.sc-article{font-size:var(--fs);line-height:1.95;color:var(--t3);max-width:80ch}
.sc-article h2{font-family:var(--head);font-weight:300;font-size:var(--fh1);color:var(--t5);margin:26px 0 10px;letter-spacing:.03em}
.sc-article ul{margin:0 0 14px;padding-left:18px}
.sc-article li{margin-bottom:7px}
.sc-cbox{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:18px 0 8px}
.sc-cbox .sc-b{border:1px solid var(--line);background:var(--bg2);padding:16px 18px}
.sc-cbox .sc-b .sc-k{font-size:var(--fs1);letter-spacing:.18em;color:var(--t1);text-transform:uppercase;margin-bottom:8px}
.sc-cbox .sc-b .sc-v{font-size:var(--fs4);line-height:1.8;color:var(--t5)}
.sc-cbox .sc-b .sc-v .sc-big{font-family:var(--head);font-size:var(--fh3);color:var(--acc);display:block;margin-bottom:4px}
.sc-map{height:270px;border:1px solid var(--line);background:var(--bg3);
display:flex;align-items:center;justify-content:center;color:var(--t1);font-size:var(--fs2);letter-spacing:.1em;margin-top:14px}
/* ================= ФУТЪР ================= */
.sc-foot{border-top:1px solid var(--line);background:var(--bg2);margin-top:20px}
.sc-foot .sc-in{max-width:var(--wrap);margin:0 auto;padding:28px 18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:26px}
.sc-foot h4{font-size:var(--fs1);letter-spacing:.18em;color:var(--t1);text-transform:uppercase;margin-bottom:10px}
.sc-foot ul{list-style:none;margin:0;padding:0}
.sc-foot li{margin-bottom:7px;font-size:var(--fs3)}
.sc-foot a{color:var(--t4)}
.sc-foot a:hover{color:var(--acc)}
.sc-foot .sc-ftxt{font-size:var(--fs3);line-height:1.75;color:var(--t3);margin:0 0 12px}
/* полиците на началната страница: последни и случайни продукти */
.sc-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin:0 0 30px}
.sc-pmini{display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--line);
transition:border-color .15s ease,transform .15s ease}
.sc-pmini:hover{border-color:var(--accedge);transform:translateY(-2px)}
.sc-pmini .sc-mh{display:flex;align-items:center;justify-content:center;
background:#fff;padding:14px;min-height:150px}
.sc-pmini .sc-mh img{max-width:100%;max-height:230px;width:auto;height:auto;display:block;margin:0 auto}
.sc-pmini .sc-mb{padding:14px 14px 0;flex:1}
.sc-pmini .sc-mname{margin:0 0 9px;font-family:var(--body);font-size:var(--fs4);line-height:1.4;font-weight:400}
.sc-pmini .sc-mname a{color:var(--t6);text-decoration:none}
.sc-pmini .sc-mname a:hover{color:var(--acc)}
.sc-pmini .sc-tags{margin:0 0 9px}
.sc-pmini .sc-mprice{font-family:var(--head);font-size:var(--fh3);color:var(--acc);line-height:1.2}
.sc-pmini .sc-mprice small{font-family:var(--body);font-size:var(--fs1);color:var(--t3);margin-left:6px}
.sc-pmini .sc-price-nv{font-size:var(--fs2);color:var(--t3);margin-top:3px}
.sc-pmini .sc-mbuy{padding:12px 14px 14px}
/* бутонът в полицата е по-тих: при шест карти на ред плътното зелено пресича
страницата. Мастилото се взема от сметнатата смес, за да остане четимо. */
.sc-pmini .sc-mbuy .sc-btn{display:block;width:100%;text-align:center;
background:rgba(var(--accrgb),.4);border-color:rgba(var(--accrgb),.4);color:var(--accfadeink)}
.sc-pmini .sc-mbuy .sc-btn:hover,
.sc-pmini .sc-mbuy .sc-btn:focus{background:var(--acc);border-color:var(--acc);color:var(--btnink)}
@media (max-width:520px){ .sc-pgrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px} }
.sc-foot .sc-cc{font-size:var(--fs3);line-height:1.85;color:var(--t3)}
.sc-footend{border-top:1px solid var(--line);font-size:var(--fs2);color:var(--t1);padding:12px 18px;text-align:center;letter-spacing:.03em}
.sc-fphone{color:var(--acc);font-size:var(--fs5);font-family:var(--head)}
/* ================= ДОКУМЕНТАЦИОННИ ЕКРАНИ ================= */
.sc-ds{max-width:1100px;margin:0 auto;padding:26px 18px 70px}
/* ---------- РАЗЧУПВАНИЯ ---------- */
@media (max-width:1180px){
.sc-layout{gap:26px}
.sc-hnav{gap:14px;margin-left:14px}
.sc-head .sc-in{gap:18px}
.sc-pcard .sc-ph{flex:0 0 210px}
.sc-pcard .sc-pr{flex:0 0 195px}
}
@media (max-width:1120px){
.sc-hnav{order:5;flex-basis:100%;margin-left:0;gap:20px;border-top:1px solid var(--line);padding-top:11px}
.sc-head .sc-in{flex-wrap:wrap;gap:16px}
.sc-hspace{display:none}
.sc-hphone{margin-left:auto}
}
@media (max-width:1020px){
.sc-head .sc-in{gap:18px}
.sc-logo .sc-l1{font-size:calc(var(--fh5) * .88)}
.sc-hphone .sc-n{font-size:calc(var(--fh3) * .9)}
.sc-spec{display:block;overflow-x:auto;white-space:nowrap}
.sc-spec td,.sc-spec th{white-space:normal;min-width:150px}
}
@media (max-width:900px){
.sc-head .sc-in{flex-wrap:wrap;gap:14px;padding:14px 16px}
.sc-burger{display:block;order:1}
.sc-logo{order:2}
.sc-hspace{display:none}
.sc-hphone{order:3;margin-left:auto;text-align:right}
.sc-cart,.sc-cartbox{order:4}
.sc-hnav{order:5;flex-basis:100%;margin-left:0;gap:18px;border-top:1px solid var(--line);padding-top:12px}
.sc-topbar .sc-in span:nth-child(2) span:first-child{display:none}
.sc-col{position:fixed;left:0;top:0;bottom:0;width:270px;flex:none;background:var(--bg2);z-index:150;
padding:18px;overflow:auto;transform:translateX(-105%);transition:transform .22s;border-right:1px solid var(--line);
box-shadow:0 0 40px rgba(0,0,0,.6)}
body.sc-nav .sc-col{transform:none}
.sc-layout{gap:0;padding:18px 16px 50px}
.sc-prod{flex-direction:column}
.sc-gal{flex:none;width:100%}
.sc-gal .sc-big{height:300px}
.sc-pcard{flex-wrap:wrap}
.sc-pcard .sc-ph{flex:0 0 190px;padding:14px}
.sc-pcard .sc-ph img{max-height:170px}
.sc-pcard .sc-bd{padding:16px 18px}
.sc-pcard h2.sc-pname{font-size:calc(var(--fh2) * .92)}
.sc-pcard .sc-pr{flex:1 0 100%;border-left:0;border-top:1px solid var(--cline2);flex-direction:row;align-items:center;
justify-content:flex-start;text-align:left;gap:16px;flex-wrap:wrap;padding:14px 18px}
.sc-pcard .sc-pr .sc-price{font-size:calc(var(--fh5) * .88)}
.sc-pcard .sc-pr .sc-price small{display:inline;margin-left:5px}
.sc-pcard .sc-pr .sc-stock{flex-basis:100%}
.sc-pcard .sc-pr .sc-buy{margin-top:0;margin-left:auto;min-width:190px}
.sc-pcard .sc-pr .sc-term{margin-top:0;flex-basis:100%}
.sc-cbox{grid-template-columns:1fr}
.sc-ds{padding:22px 16px 60px}
}
@media (max-width:680px){
.sc-topbar .sc-in{font-size:var(--fs1)}
.sc-topbar .sc-in>span:first-child{display:none}
.sc-topbar .sc-sp{margin-left:0}
.sc-hphone .sc-t{display:none}
.sc-pcard .sc-ph{flex:0 0 168px;padding:14px}
.sc-pcard .sc-ph img{max-height:150px}
.sc-dims{max-width:none}
.sc-dims div{padding:6px 8px}
.sc-dims b{font-size:var(--fs3)}
.sc-tools{display:grid;grid-template-columns:auto 1fr;gap:9px 10px;align-items:center}
.sc-tools select{width:100%;max-width:none}
.sc-tools .sc-cntinfo{grid-column:1/-1;margin-left:0}
.sc-gal .sc-big{height:240px}
.sc-pinfo h1{font-size:calc(var(--fh5) * .82)}
.sc-pricebox .sc-big{font-size:calc(var(--fh5) * .82 - 4px)}
.sc-pricebox .sc-nv.sc-ex{font-size:calc(var(--fh5) * .82 - 8px)}
h1.sc-page{font-size:calc(var(--fh5) * .88)}
.sc-pager .sc-info{margin-left:0;flex-basis:100%;margin-top:8px}
}
@media (max-width:520px){
.sc-logo .sc-l1{font-size:calc(var(--fh5) * .77);letter-spacing:.06em}
.sc-logo .sc-l2{font-size:calc(var(--fs1) * .92);letter-spacing:.14em}
.sc-hphone{display:none}
.sc-cart{padding:11px 12px;font-size:var(--fs2)}
.sc-cart .sc-lbl{display:none}
.sc-pcard .sc-pr{flex-direction:column;flex-wrap:nowrap;align-items:center;text-align:center;gap:6px;padding:14px}
.sc-pcard .sc-pr .sc-buy{margin-left:0;width:100%;max-width:290px}
.sc-pcard .sc-pr .sc-term{margin-top:4px}
.sc-pcard .sc-ph{flex:1 0 100%;border-right:0;border-bottom:1px solid var(--cline2);padding:14px}
.sc-pcard .sc-ph img{max-height:170px}
.sc-hnav{gap:14px;font-size:var(--fs2)}
.sc-layout{padding:16px 12px 40px}
.sc-pcard .sc-bd{padding:14px}
.sc-dims{flex-wrap:wrap}
.sc-dims div{flex:1 0 33%;border-bottom:1px solid var(--cline)}
.sc-lead,.sc-article,.sc-ds p{font-size:var(--fs3)}
.sc-ds{padding:18px 12px 50px}
.sc-prod-note{font-size:var(--fs2)}
}
/* ---------- добавки за истинския магазин (извън макета) ---------- */
/* кремавата лента на Bootstrap изчезва - трохите стават част от тъмната рамка */
.breadcrumb{background:var(--bg2)!important;border-bottom:1px solid var(--line);border-radius:0;
padding:9px 16px;margin:0;font-size:var(--fs2);color:var(--t2)}
.breadcrumb>li+li:before{color:var(--t1)}
.breadcrumb a{color:var(--t4)}
.breadcrumb a:hover{color:var(--acc)}
.sc-wrap{background:var(--bg)}
.sc-in{max-width:var(--wrap);margin:0 auto}
/* страниците, които още не са облечени (количка, поръчка, профил, продукт)
остават четими: бял лист вътре в тъмната рамка */
#content:not(.sc-content){background:var(--card);color:var(--cink);padding:18px 22px;margin:18px 0;font-size:var(--fs);line-height:1.75}
#content:not(.sc-content) h1{font-size:var(--fh5);font-weight:400;font-family:var(--head);letter-spacing:.02em;margin:0 0 14px}
#content:not(.sc-content) h2{font-size:var(--fh2);font-weight:400;font-family:var(--head);margin:18px 0 10px}
#content:not(.sc-content) h3,#content:not(.sc-content) legend{font-size:var(--fh1);font-weight:400;font-family:var(--head);margin:14px 0 8px}
#content:not(.sc-content) h4,#content:not(.sc-content) h5,#content:not(.sc-content) h6{font-size:var(--fs4);font-weight:400;margin:12px 0 6px}
#content:not(.sc-content) p,#content:not(.sc-content) td,#content:not(.sc-content) th,#content:not(.sc-content) li,#content:not(.sc-content) label,#content:not(.sc-content) dt,#content:not(.sc-content) dd{font-size:var(--fs)}
#content:not(.sc-content) .form-control,#content:not(.sc-content) input,#content:not(.sc-content) select,#content:not(.sc-content) textarea{font-size:var(--fs)}
#content:not(.sc-content) .btn{font-size:var(--fs);font-family:var(--head);letter-spacing:.03em}
#content:not(.sc-content) .panel-heading,#content:not(.sc-content) .panel-title,#content:not(.sc-content) .list-group-item,#content:not(.sc-content) .alert,#content:not(.sc-content) .help-block,#content:not(.sc-content) .text-danger{font-size:var(--fs)}
#content:not(.sc-content) .panel-title{font-family:var(--head)}
#content:not(.sc-content) small,#content:not(.sc-content) .small{font-size:var(--fs2)}
#content:not(.sc-content) .breadcrumb{background:transparent;padding:0 0 12px;margin:0;font-size:var(--fs2)}
#content.sc-content{background:transparent;color:inherit;padding:0;margin:0}
#content:not(.sc-content) h1,#content:not(.sc-content) h2,#content:not(.sc-content) h3,#content:not(.sc-content) h4,#content:not(.sc-content) h5,#content:not(.sc-content) h6{color:var(--cink)}
#content:not(.sc-content) a{color:var(--accink)}
#content:not(.sc-content) a:hover{color:var(--accink)}
#content:not(.sc-content) .btn-primary{background:var(--acc);border-color:var(--acc);color:var(--btnink)}
#content:not(.sc-content) .btn-primary:hover,#content:not(.sc-content) .btn-primary:focus{background:var(--acc2);border-color:var(--acc2);color:var(--btnink)}
/* количката на OpenCart в нашия хедър */
.sc-cartbox .btn{background:transparent;border:1px solid var(--line2);color:var(--t4);font-family:var(--body);
font-size:var(--fs3);min-height:44px}
.sc-cartbox .btn:hover{border-color:var(--acc);color:var(--acc)}
.sc-cartbox #cart .dropdown-menu{min-width:280px}
.sc-cartbox strong{color:var(--t6);font-weight:400}
/* колоните на OpenCart живеят вътре в нашата странична лента: Bootstrap ги
свива до col-sm-3 от нейната ширина, затова се неутрализират */
.sc-col #column-left,.sc-col #column-right{width:100%;float:none;padding:0}
.sc-col .list-group{margin:0}
.sc-col .list-group-item{background:var(--bg2);border:0;border-bottom:1px solid var(--line);
color:var(--t4);font-size:var(--fs3);padding:8px 11px;border-radius:0}
.sc-col .list-group-item:hover{color:var(--acc);background:var(--bg3)}
.sc-col .list-group-item.active,.sc-col .list-group-item.active:hover{background:var(--bg3);color:var(--acc);border-color:var(--line)}
.sc-col .panel{background:transparent;border:0;box-shadow:none}
.sc-col .panel-heading{background:transparent;border:0;padding:0 0 9px;
font-size:var(--fs1);letter-spacing:.20em;color:var(--t1);text-transform:uppercase;border-bottom:1px solid var(--line)}
.sc-col .panel-body{padding:0}
/* ---------- текст вътре в белия лист: списъци и галерия ---------- */
/* описанията идват от вноса като ...
- отстъпите на абзаца
вътре в точката правят междуредието двойно голямо */
#content:not(.sc-content) ul,#content:not(.sc-content) ol{margin:8px 0 14px;padding-left:20px}
#content:not(.sc-content) li{line-height:1.6;margin-bottom:5px}
#content:not(.sc-content) li>p{margin:0}
#content:not(.sc-content) li>p+p{margin-top:5px}
#content:not(.sc-content) p{margin:0 0 10px;line-height:1.7}
#content:not(.sc-content) table p:last-child{margin-bottom:0}
/* галерията на продукта е - без точка над снимката */
#content:not(.sc-content) .thumbnails{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
#content:not(.sc-content) .thumbnails>li{list-style:none;margin:0;float:none;width:auto}
#content:not(.sc-content) .thumbnails>li:first-child{flex:1 0 100%}
#content:not(.sc-content) .thumbnails>li:first-child a{display:block;text-align:center}
#content:not(.sc-content) .thumbnails img{margin:0 auto;height:auto;max-width:100%}
#content:not(.sc-content) .thumbnails>li:not(:first-child) a{display:block;border:1px solid var(--cline);padding:4px}
#content:not(.sc-content) .thumbnails>li:not(:first-child) a:hover{border-color:var(--accline)}
/* ---------- продуктова страница по макета (върху тъмната рамка) ---------- */
.sc-gal .thumbnails{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.sc-gal .thumbnails>li{margin:0;list-style:none}
.sc-gal .thumbnails>li:first-child{flex:1 0 100%}
.sc-gal .thumbnails>li:first-child a{display:flex;align-items:center;justify-content:center;
background:var(--card);border:1px solid var(--cedge);padding:18px;min-height:340px}
.sc-gal .thumbnails>li:first-child img{max-height:320px;width:auto}
.sc-gal .thumbnails>li:not(:first-child) a{display:block;background:var(--card);border:1px solid var(--cedge);padding:5px}
.sc-gal .thumbnails>li:not(:first-child) a:hover{border-color:var(--acc)}
.sc-ink-ok{color:var(--ok)}
.sc-ink-wait{color:var(--wait)}
.sc-meta .sc-dot{margin-right:5px}
.sc-options{margin:14px 0 4px;max-width:420px}
.sc-options h3{font-family:var(--head);font-weight:300;font-size:var(--fh1);color:var(--t5);margin:0 0 10px;letter-spacing:.03em}
.sc-options .control-label{display:block;font-size:var(--fs2);color:var(--t2);margin-bottom:4px;font-weight:400}
.sc-options .form-group{margin-bottom:12px}
.sc-options .form-control{background:var(--bg2);border:1px solid var(--line2);color:var(--t5);
font:inherit;font-size:var(--fs3);padding:9px 10px;min-height:40px;width:100%;border-radius:0;box-shadow:none}
.sc-options .form-control:focus{border-color:var(--acc);outline:none}
.sc-options .radio label,.sc-options .checkbox label{color:var(--t4);font-size:var(--fs3);font-weight:400}
.sc-options .required>.control-label:after{content:" *";color:var(--acc)}
.sc-pinfo .sc-buy{max-width:320px}
.sc-pinfo .sc-buy input{background:var(--bg2);border:1px solid var(--line2);color:var(--t6)}
.sc-pinfo .sc-buy input:focus{border-color:var(--acc)}
.sc-pinfo .sc-prod-note{margin-top:10px}
.sc-pinfo .sc-prod-note a{color:var(--acc)}
#form-review .control-label{display:block;font-size:var(--fs2);color:var(--t2);margin-bottom:4px;font-weight:400}
#form-review .form-control{background:var(--bg2);border:1px solid var(--line2);color:var(--t5);
font:inherit;font-size:var(--fs3);padding:9px 10px;width:100%;border-radius:0;box-shadow:none}
#form-review h3{font-family:var(--head);font-weight:300;font-size:var(--fh1);color:var(--t5);margin:16px 0 10px}
#form-review .form-group{margin-bottom:12px}
#review{color:var(--t3);font-size:var(--fs3)}
.sc-article table{border-collapse:collapse;max-width:100%}
.sc-article td,.sc-article th{border:1px solid var(--line);padding:7px 10px}
.sc-article img{max-width:100%;height:auto}
.sc-article li>p{margin:0}
.sc-article li{margin-bottom:5px;line-height:1.6}
@media (max-width:900px){
.sc-prod{flex-direction:column}
.sc-gal{flex:none;width:100%}
.sc-gal .thumbnails>li:first-child a{min-height:260px}
.sc-gal .thumbnails>li:first-child img{max-height:240px}
}
/* голямата снимка на продукта: колкото може по-голяма, както беше */
.sc-prod{gap:30px;align-items:flex-start}
.sc-gal{flex:1 1 520px;max-width:660px;min-width:0}
.sc-gal .thumbnails>li:first-child a{min-height:0;padding:22px}
.sc-gal .thumbnails>li:first-child img{max-height:none;width:100%;height:auto}
.sc-pinfo{flex:1 1 340px;min-width:0}
@media (max-width:1180px){ .sc-gal{flex:1 1 420px} }
@media (max-width:900px){ .sc-gal{flex:none;width:100%;max-width:none} }
/* ---------- продуктова страница: пропорция две към едно, плоча без разместване ---------- */
.sc-prod{display:flex;gap:28px;align-items:flex-start}
.sc-gal{flex:2 1 0;min-width:0;max-width:none}
.sc-pinfo{flex:1 1 0;min-width:300px}
.sc-gal .thumbnails{display:block;list-style:none;margin:0;padding:0}
.sc-gal .thumbnails>li{display:block;list-style:none;margin:0 0 10px}
.sc-gal .thumbnails>li:first-child a{display:block;text-align:center;background:var(--card);
border:1px solid var(--cedge);padding:20px;min-height:0}
.sc-gal .thumbnails>li:first-child img{display:inline-block;max-width:100%;width:auto;height:auto;max-height:none;margin:0 auto}
.sc-gal .thumbnails>li:not(:first-child){display:inline-block;vertical-align:top;margin:0 8px 8px 0}
.sc-gal .thumbnails>li:not(:first-child) a{display:block;background:var(--card);border:1px solid var(--cedge);padding:5px}
.sc-gal .thumbnails>li:not(:first-child) a:hover{border-color:var(--acc)}
@media (max-width:1180px){ .sc-pinfo{min-width:260px} }
@media (max-width:900px){
.sc-prod{flex-direction:column}
.sc-gal,.sc-pinfo{flex:none;width:100%;min-width:0}
}
/* плочата на голямата снимка беше с фиксирана височина 340px от макета -
при висока снимка съдържанието излизаше извън нея и лягаше върху текста */
.sc-gal .sc-big{display:block;height:auto;min-height:0;padding:20px;text-align:center}
.sc-gal .sc-big img{max-height:none;max-width:100%;width:auto;height:auto;margin:0 auto;display:inline-block}
/* таван на голямата снимка: без него квадратна снимка разпъва плочата колкото
е широка и избутва всичко надолу, а по-ниска снимка изглежда стегната */
.sc-gal .sc-big img,.sc-gal .thumbnails>li:first-child img{max-height:var(--imgh);width:auto}
/* бутонът "Купи" на продуктовата страница заема цялата текстова колона */
.sc-pinfo .sc-buy{max-width:none}
.sc-pinfo .sc-buy input{flex:0 0 78px;width:78px}
.sc-pinfo .sc-buy .sc-btn{flex:1 1 auto}
/* ---------- добавяне в количката: снимката отлита, количката пулсира ---------- */
.sc-fly{position:fixed;z-index:9999;pointer-events:none;opacity:.95;object-fit:contain;
background:var(--card);border:1px solid var(--cedge);padding:2px;
transition:left .7s cubic-bezier(.35,.1,.5,1),top .7s cubic-bezier(.35,.1,.5,1),width .7s ease,height .7s ease,opacity .7s ease}
@keyframes sc-pop{
0%{transform:scale(1)}
35%{transform:scale(1.12);border-color:var(--acc);color:var(--acc)}
100%{transform:scale(1)}
}
.sc-pop{animation:sc-pop .5s ease}
/* Снимката в реда на категорията не се зареждаше изобщо: с loading="lazy"
и кутия 0x0 браузърът никога не стига до нея, а кутията е 0x0 точно защото
снимката още не е заредена. Дава се размер предварително - това чупи
омагьосания кръг и пази страницата от подскок при зареждане. */
.sc-pcard .sc-ph a{display:flex;align-items:center;justify-content:center;width:100%;min-height:150px}
.sc-pcard .sc-ph img{max-width:100%;max-height:220px;width:auto;height:auto}
@media (max-width:900px){ .sc-pcard .sc-ph a{min-height:130px} }
.sc-fly-dot{background:var(--acc);border-color:var(--acc);border-radius:3px}
/* ============================================================
ЕКРАНИТЕ, КОИТО OPENCART РИСУВА САМ
Количка, оформяне на поръчка, профил, 404. Тук не пипаме шаблони —
обличаме съставките на Bootstrap, за да станат част от темата.
============================================================ */
.container{max-width:var(--wrap);width:auto;padding-left:18px;padding-right:18px}
body>.container{margin-bottom:22px}
/* страничните колони на OpenCart върху тъмния фон */
#column-left,#column-right{padding-top:4px}
#column-left .list-group-item,#column-right .list-group-item,.sc-col .list-group-item{
background:var(--bg2);border:0;border-bottom:1px solid var(--line);color:var(--t4);
font-size:var(--fs3);padding:9px 12px;border-radius:0}
#column-left .list-group-item:hover,#column-right .list-group-item:hover{color:var(--acc);background:var(--bg3)}
#column-left h3,#column-right h3{font-size:var(--fs1);letter-spacing:.20em;color:var(--t1);
text-transform:uppercase;border-bottom:1px solid var(--line);padding-bottom:9px;margin:0 0 10px}
/* таблици: количка, поръчки, сравнение */
#content:not(.sc-content) .table{width:100%;border-collapse:collapse;margin-bottom:18px;background:var(--card)}
#content:not(.sc-content) .table>thead>tr>td,#content:not(.sc-content) .table>thead>tr>th{
background:var(--cbg2);border-bottom:2px solid var(--cline);color:var(--cink);
font-weight:400;font-family:var(--head);letter-spacing:.03em;padding:11px 12px;vertical-align:middle}
#content:not(.sc-content) .table>tbody>tr>td,#content:not(.sc-content) .table>tfoot>tr>td{
border-top:1px solid var(--cline);padding:11px 12px;vertical-align:middle}
#content:not(.sc-content) .table-bordered,#content:not(.sc-content) .table-bordered>tbody>tr>td{border-color:var(--cline)}
#content:not(.sc-content) .table img{max-width:90px;height:auto}
#content:not(.sc-content) .table>tfoot>tr>td{font-family:var(--head)}
#content:not(.sc-content) .table>tfoot>tr:last-child>td{font-size:var(--fs5);color:var(--cink)}
/* полета */
#content:not(.sc-content) .form-control{border:1px solid var(--cedge);border-radius:0;box-shadow:none;
min-height:42px;color:var(--cink);background:var(--card)}
#content:not(.sc-content) .form-control:focus{border-color:var(--accink);box-shadow:none}
#content:not(.sc-content) .control-label,#content:not(.sc-content) label{font-weight:400;color:var(--cink2)}
#content:not(.sc-content) .form-group{margin-bottom:14px}
#content:not(.sc-content) .required .control-label:after,
#content:not(.sc-content) .form-group.required>label:after{content:" *";color:var(--accink)}
#content:not(.sc-content) .input-group-btn>.btn,#content:not(.sc-content) .input-group-addon{border-radius:0;border-color:var(--cedge)}
/* бутони */
#content:not(.sc-content) .btn{border-radius:0;min-height:42px;padding:10px 18px;letter-spacing:.04em}
#content:not(.sc-content) .btn-primary,#content:not(.sc-content) .btn-success{
background:var(--acc);border-color:var(--acc);color:var(--btnink);text-shadow:none}
#content:not(.sc-content) .btn-primary:hover,#content:not(.sc-content) .btn-primary:focus,
#content:not(.sc-content) .btn-success:hover,#content:not(.sc-content) .btn-success:focus{
background:var(--acc2);border-color:var(--acc2);color:var(--btnink)}
#content:not(.sc-content) .btn-default{background:var(--card);border-color:var(--cedge);color:var(--cink2)}
#content:not(.sc-content) .btn-default:hover{border-color:var(--accline);color:var(--accink);background:var(--accsoft)}
#content:not(.sc-content) .btn-danger{background:transparent;border-color:var(--cedge);color:var(--cmid)}
#content:not(.sc-content) .btn-danger:hover{border-color:#c0392b;color:#c0392b;background:#fdf3f2}
/* панели и списъци */
#content:not(.sc-content) .panel{border-radius:0;border-color:var(--cline);box-shadow:none;background:var(--card)}
#content:not(.sc-content) .panel-heading{background:var(--cbg2);border-color:var(--cline);border-radius:0;
font-family:var(--head);letter-spacing:.03em;color:var(--cink)}
#content:not(.sc-content) .panel-default>.panel-heading{color:var(--cink)}
#content:not(.sc-content) .well{background:var(--cbg2);border:1px solid var(--cline);border-radius:0;box-shadow:none}
#content:not(.sc-content) .list-group-item{border-radius:0;border-color:var(--cline);color:var(--cink2)}
#content:not(.sc-content) .list-group-item:hover{color:var(--accink)}
/* съобщения */
#content:not(.sc-content) .alert{border-radius:0;border-width:1px;padding:11px 14px}
#content:not(.sc-content) .alert-success{background:var(--okbg);border-color:var(--okb);color:var(--okink)}
#content:not(.sc-content) .alert-warning{background:var(--waitbg);border-color:var(--waitb);color:var(--waitink)}
#content:not(.sc-content) .alert-info{background:var(--accsoft);border-color:var(--accline);color:var(--accink)}
#content:not(.sc-content) .alert-danger{background:#fdf3f2;border-color:#e8c4bf;color:#a5352a}
/* страниране и раздели */
#content:not(.sc-content) .pagination>li>a,#content:not(.sc-content) .pagination>li>span{
border-radius:0;border-color:var(--cline);color:var(--cink2)}
#content:not(.sc-content) .pagination>.active>span,#content:not(.sc-content) .pagination>.active>span:hover{
background:var(--acc);border-color:var(--acc);color:var(--btnink)}
#content:not(.sc-content) .nav-tabs{border-bottom:1px solid var(--cline)}
#content:not(.sc-content) .nav-tabs>li>a{border-radius:0;color:var(--cmid)}
#content:not(.sc-content) .nav-tabs>li.active>a,#content:not(.sc-content) .nav-tabs>li.active>a:hover{
border-color:var(--cline);border-bottom-color:transparent;color:var(--cink)}
/* стъпките на поръчката */
#content:not(.sc-content) .panel-group .panel+.panel{margin-top:10px}
#content:not(.sc-content) .buttons{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0 0}
#content:not(.sc-content) .buttons .pull-right{margin-left:auto}
#content:not(.sc-content) .buttons .pull-left,#content:not(.sc-content) .buttons .pull-right{float:none}
/* дясната колона на OpenCart е изключена от настройка: скриваме я и
връщаме ширината на съдържанието и по страниците, които не са наши */
.sc-no-right #column-right{display:none!important}
.sc-no-right #content.col-sm-9{width:100%}
.sc-no-right #content.col-sm-6{width:75%}
.sc-no-right #content.col-sm-12{width:100%}
/* описанието на категорията заема две трети от колоната, не цялата ширина */
.sc-lead{max-width:66%}
@media (max-width:900px){ .sc-lead{max-width:none} }
/* ---------- падащата количка в хедъра ---------- */
.sc-cartbox .dropdown-menu{min-width:400px;background:var(--bg2);border:1px solid var(--line2);
border-radius:0;padding:0;box-shadow:0 16px 44px rgba(0,0,0,.6);margin-top:6px}
.sc-cartbox .dropdown-menu>li{padding:0}
.sc-cartbox .dropdown-menu>li>div{padding:0}
.sc-cartbox .dropdown-menu .table{margin:0;width:100%;background:transparent;border:0}
.sc-cartbox .dropdown-menu .table>tbody>tr>td{background:transparent;border:0;border-top:1px solid var(--line);
padding:10px 12px;vertical-align:middle;color:var(--t4);font-size:var(--fs3)}
.sc-cartbox .dropdown-menu .table>tbody>tr:first-child>td{border-top:0}
.sc-cartbox .dropdown-menu .table-striped>tbody>tr:nth-of-type(odd){background:transparent}
.sc-cartbox .dropdown-menu td.text-right,.sc-cartbox .dropdown-menu td.text-center{white-space:nowrap}
.sc-cartbox .dropdown-menu td.text-left{white-space:normal;line-height:1.45}
.sc-cartbox .dropdown-menu a{color:var(--t5);text-decoration:none}
.sc-cartbox .dropdown-menu a:hover{color:var(--acc);text-decoration:none}
.sc-cartbox .dropdown-menu img,.sc-cartbox .dropdown-menu .img-thumbnail{background:var(--card);
border:1px solid var(--cedge);border-radius:0;padding:3px;max-width:56px;height:auto}
.sc-cartbox .dropdown-menu .btn-danger,.sc-cartbox .dropdown-menu .btn-xs{background:transparent;
border:1px solid var(--line2);color:var(--t2);border-radius:0;padding:5px 9px;min-height:0}
.sc-cartbox .dropdown-menu .btn-danger:hover{border-color:#c0392b;color:#c0392b;background:transparent}
.sc-cartbox .dropdown-menu .table-bordered,.sc-cartbox .dropdown-menu .table-bordered>tbody>tr>td{border-color:var(--line)}
.sc-cartbox .dropdown-menu strong{color:var(--t5);font-weight:400}
.sc-cartbox .dropdown-menu .table-bordered>tbody>tr:last-child td{color:var(--t6);font-family:var(--head)}
.sc-cartbox .dropdown-menu p{margin:0;padding:12px;display:flex;gap:10px;border-top:1px solid var(--line);text-align:center}
.sc-cartbox .dropdown-menu p a{flex:1;border:1px solid var(--line2);padding:11px 8px;color:var(--t4);
font-size:var(--fs3);min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px}
.sc-cartbox .dropdown-menu p a:hover{border-color:var(--acc);color:var(--acc)}
.sc-cartbox .dropdown-menu p a:last-child{background:var(--acc);border-color:var(--acc);color:var(--btnink)}
.sc-cartbox .dropdown-menu p a:last-child strong{color:var(--btnink)}
.sc-cartbox .dropdown-menu p a:last-child:hover{background:var(--acc2);border-color:var(--acc2);color:var(--btnink)}
.sc-cartbox .dropdown-menu p a:last-child:hover strong{color:var(--btnink)}
@media (max-width:520px){ .sc-cartbox .dropdown-menu{min-width:280px} }
/* количката става една трета от страницата, а името на продукта взима
остатъка - иначе клетките с "x 2" и цената го смачкват до една буква */
.sc-cartbox #cart .dropdown-menu,.sc-cartbox .dropdown-menu{
width:calc(var(--wrap) / 3);min-width:380px;max-width:94vw}
.sc-cartbox .dropdown-menu .table{table-layout:auto}
.sc-cartbox .dropdown-menu td.text-left{width:99%;min-width:150px;white-space:normal;
word-break:normal;overflow-wrap:break-word;hyphens:none}
.sc-cartbox .dropdown-menu td.text-center:first-child{width:74px}
@media (max-width:520px){ .sc-cartbox #cart .dropdown-menu,.sc-cartbox .dropdown-menu{width:94vw;min-width:0} }
/* полето за брой в падащата количка */
.sc-cartbox .dropdown-menu td.sc-qty{width:88px;padding-left:4px;padding-right:4px}
.sc-cartbox .dropdown-menu input.sc-cartqty{width:72px;background:var(--bg3);border:1px solid var(--line2);
color:var(--t6);font:inherit;font-size:var(--fs3);text-align:center;padding:8px 4px;min-height:38px;border-radius:0}
.sc-cartbox .dropdown-menu input.sc-cartqty:focus{border-color:var(--acc);outline:none}
/* сумите в падащата количка: етикетът стои плътно до числото, а не в
средата на реда - първата клетка поема свободното място и е дясно
подравнена, втората е точно колкото сумата */
.sc-cartbox .dropdown-menu .table-bordered{table-layout:auto;width:100%}
.sc-cartbox .dropdown-menu .table-bordered>tbody>tr>td{padding:10px 12px;vertical-align:middle}
.sc-cartbox .dropdown-menu .table-bordered>tbody>tr>td:first-child{width:99%;text-align:right;padding-right:16px}
.sc-cartbox .dropdown-menu .table-bordered>tbody>tr>td:last-child{width:1%;min-width:110px;
text-align:right;white-space:nowrap}
/* долният бутон на количката. Някои магазини имат модул за поръчка на
една страница, който сменя двете връзки с един .btn-block - затова и
двата варианта получават еднаква височина и центриран надпис */
.sc-cartbox .dropdown-menu p{padding:12px}
.sc-cartbox .dropdown-menu p a{min-height:52px;padding:13px 10px;line-height:1.25}
.sc-cartbox .dropdown-menu .btn-block{display:flex;align-items:center;justify-content:center;gap:8px;
width:100%;min-height:56px;padding:15px 12px;margin:0;line-height:1.25;font-size:var(--fs3);
border-radius:0;white-space:normal;text-align:center;
background:rgba(var(--accrgb),.5);border:1px solid rgba(var(--accrgb),.5);color:var(--acchalfink);
letter-spacing:.04em;text-transform:uppercase}
.sc-cartbox .dropdown-menu .btn-block:hover,
.sc-cartbox .dropdown-menu .btn-block:focus,
.sc-cartbox .dropdown-menu .btn-block:active{background:var(--acc);border-color:var(--acc);
color:var(--btnink);text-decoration:none}
.sc-cartbox .dropdown-menu .btn-block,
.sc-cartbox .dropdown-menu .btn-block:hover{box-shadow:none;outline:none}
.sc-cartbox .dropdown-menu .btn-block>i{line-height:1}
/* ---------- Категорията в карти — одобреният вариант 3 ----------
Снимката остава отляво като в широкия ред, но цялата карта се събира в една трета.
Маркапът не се пипа: картата става решетка от две колони, снимката хваща двата
реда отляво, а тялото и цената се нареждат едно под друго отдясно. */
.sc-cards .sc-plist{display:grid;gap:16px;align-items:stretch}
.sc-c2 .sc-plist{grid-template-columns:repeat(2,minmax(0,1fr))}
.sc-c3 .sc-plist{grid-template-columns:repeat(3,minmax(0,1fr))}
.sc-c4 .sc-plist{grid-template-columns:repeat(4,minmax(0,1fr))}
.sc-cards .sc-pcard{display:grid;grid-template-columns:40% minmax(0,1fr);grid-template-rows:1fr auto}
.sc-cards .sc-pcard .sc-ph{grid-column:1;grid-row:1 / span 2;flex:none;padding:14px;
border-right:1px solid var(--cline2);border-bottom:0;min-height:0}
.sc-cards .sc-pcard .sc-ph img{max-height:210px;max-width:100%}
.sc-cards .sc-pcard .sc-bd{grid-column:2;grid-row:1;flex:none;padding:14px 15px 4px;min-width:0}
.sc-cards .sc-pcard .sc-pr{grid-column:2;grid-row:2;flex:none;background:transparent;
border-left:0;border-top:0;padding:0 15px 14px;text-align:left;
display:block}
.sc-cards .sc-pcard h2.sc-pname{font-size:calc(var(--fh1) * 1.02);margin-bottom:8px;line-height:1.35}
/* размерите стават списък с точки - трите кутийки не стигат в такава ширина */
.sc-cards .sc-pcard .sc-dims{display:block;border:0;max-width:none;margin:0 0 9px}
.sc-cards .sc-pcard .sc-dims div{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
flex:none;padding:3px 0;border:0;border-bottom:1px dotted var(--cline)}
.sc-cards .sc-pcard .sc-dims span{display:inline;letter-spacing:.06em}
.sc-cards .sc-pcard .sc-dims b{font-size:var(--fs3)}
/* описанието остава, но на два реда, за да не разтегля картите */
.sc-cards .sc-pcard .sc-pdesc{font-size:var(--fs3);line-height:1.6;display:-webkit-box;
-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sc-cards .sc-pcard .sc-tags{margin-top:9px}
/* срокът вече стои като етикет горе - второ изписване не трябва */
.sc-cards .sc-pcard .sc-pr .sc-stock{display:none}
.sc-cards .sc-pcard .sc-pr .sc-price{font-size:calc(var(--fh3) * .98)}
.sc-cards .sc-pcard .sc-pr .sc-price small{display:inline;margin-left:5px;margin-top:0}
.sc-cards .sc-pcard .sc-pr .sc-price-nv{margin-top:2px}
.sc-cards .sc-pcard .sc-pr .sc-term{margin-top:6px}
.sc-cards .sc-pcard .sc-pr .sc-buy{margin:9px 0 0;min-width:0}
.sc-cards .sc-pcard .sc-pr .sc-buy input{display:none}
.sc-cards .sc-pcard .sc-pr .sc-buy .sc-btn{flex:1;width:100%}
/* тясно - броят на колоните пада сам, без да се пипа настройката */
@media (max-width:1500px){ .sc-c4 .sc-plist{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:1180px){ .sc-c3 .sc-plist,.sc-c4 .sc-plist{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){ .sc-cards .sc-plist{grid-template-columns:minmax(0,1fr)} }
@media (max-width:430px){
.sc-cards .sc-pcard{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr auto}
.sc-cards .sc-pcard .sc-ph{grid-column:1;grid-row:1;border-right:0;border-bottom:1px solid var(--cline2)}
.sc-cards .sc-pcard .sc-bd{grid-column:1;grid-row:2}
.sc-cards .sc-pcard .sc-pr{grid-column:1;grid-row:3}
}
/* ---------- Лявата лента като бели плочки (одобреният макет) ----------
Цялата плочка е бяла - снимката ляга плътно до рамката, името е тъмно
върху бялото. Височината на снимката и стегнатостта на надписа идват от настройките. */
.sc-ctiles{margin:0 0 24px}
.sc-ctile{display:block;background:var(--card);border:1px solid var(--cedge);
border-left:3px solid transparent;margin-bottom:3px;text-decoration:none;
transition:border-color .15s ease}
.sc-ctile:last-child{margin-bottom:0}
.sc-ctile:hover{border-color:var(--acc);border-left-color:var(--acc);text-decoration:none}
.sc-ctile.sc-on{border-left-color:var(--acc)}
.sc-cim{display:flex;align-items:center;justify-content:center;height:var(--tileh,136px);overflow:hidden}
.sc-cim img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.sc-cno{display:flex;align-items:center;justify-content:center;width:100%;height:100%;
background:repeating-linear-gradient(45deg,#f5f5f5,#f5f5f5 8px,#ececec 8px,#ececec 16px);
color:#9a9a9a;font-family:var(--head);font-size:var(--fs1);letter-spacing:.08em;text-transform:uppercase}
.sc-cnm{display:block;padding:var(--tilepad,3px) 11px calc(var(--tilepad,3px) + 1px);
border-top:1px solid var(--cline);font-size:var(--fs3);color:var(--cink);line-height:1.3}
.sc-ctile:hover .sc-cnm,.sc-ctile.sc-on .sc-cnm{color:var(--accink)}
/* v1.23.0 - the colours on the cards (sc_groups draws them; approved maket shop_core_karti_cvetove_v1) */
.sc-tile-w{display:flex;flex-direction:column;min-width:0}
/* v1.23.1 - the colours centred on a row of their own right under the picture (maket shop_core_forma_tochki_v1) */
.sc-tile-w{border:1px solid var(--line);background:var(--bg2)}
.sc-tile-w:hover{border-color:var(--accedge)}
.sc-tile-w>.sc-tile{border:0;background:transparent}
.sc-tile-w>.sc-tile-t{flex:1}
.sc-tile-w:hover .sc-tx b{color:var(--acc)}
.sc-tile-w>.sc-dots,.sc-tile-w>.sc-ral,
.sc-pcard .sc-ph>.sc-dots,.sc-pcard .sc-ph>.sc-ral,
.sc-pmini>.sc-dots,.sc-pmini>.sc-ral,
.product-thumb>.sc-dots,.product-thumb>.sc-ral{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px;margin:8px 10px 2px;padding:0}
.sc-pcard .sc-ph{flex-direction:column}
.sc-dot{border-color:rgba(255,255,255,.25)}
.sc-dot.on{box-shadow:0 0 0 2px var(--bg,#101210),0 0 0 3.5px var(--acc,#9EC41C)}
.sc-ral-l{color:var(--t3,#9aa19a)}