/* Suvatec Product Filter — sidebar stânga + carduri după mockup-ul brandbook */
:root{
	--spf-navy:#0B1F33; --spf-text:#102640; --spf-muted:#687692; --spf-line:#E4E8EF;
	--spf-yellow:#F2C400; --spf-blue:#1E8EFF; --spf-green:#1AA463; --spf-red:#E0143C;
	--spf-add:#F2C400; --spf-add-d:#E0B400; --spf-bg:#F4F8FB;
}
.spf-page{max-width:1560px;margin:0 auto;padding:24px 16px 64px}
.spf-head{margin-bottom:18px}
.spf-bc{font-size:13px;color:var(--spf-muted);margin-bottom:8px}
.spf-bc a{color:var(--spf-muted);text-decoration:none}
.spf-bc a:hover{color:var(--spf-blue)}
.spf-bc strong{color:var(--spf-navy);font-weight:700}
.spf-head h1{font-family:Montserrat,sans-serif;font-size:30px;font-weight:800;color:var(--spf-navy);margin:0 0 6px}
.spf-head p{color:var(--spf-muted);font-size:15px;margin:0;max-width:780px;line-height:1.6}

.spf-topbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.spf-count{font-weight:800;color:var(--spf-navy)}
.spf-sortwrap{margin-left:auto;display:flex;align-items:center;gap:8px}
.spf-sortwrap label{font-size:13px;color:var(--spf-muted)}
.spf-sort{border:1px solid var(--spf-line);border-radius:6px;padding:9px 12px;background:#fff;color:var(--spf-navy);font-size:14px;cursor:pointer}
.spf-toggle{display:none;align-items:center;gap:8px;background:var(--spf-yellow);color:var(--spf-navy);border:0;border-radius:6px;padding:11px 18px;font-weight:700;cursor:pointer;font-size:14px}

.spf-wrap{display:flex;gap:24px;align-items:flex-start;position:relative}
.spf-side{flex:0 0 272px;width:272px;background:#fff;border:1px solid var(--spf-line);border-radius:8px;padding:8px 18px 18px;position:sticky;top:20px}
.spf-side-head{display:none;justify-content:space-between;align-items:center;padding:6px 0 4px}
.spf-side-head span{font-family:Montserrat,sans-serif;font-weight:800;font-size:18px;color:var(--spf-navy)}
.spf-close{background:none;border:0;font-size:28px;line-height:1;cursor:pointer;color:var(--spf-navy)}
.spf-group{padding:16px 0;border-bottom:1px solid #EEF1F5}
.spf-group:last-of-type{border-bottom:0}
.spf-group h4{font-family:Montserrat,sans-serif;font-size:13px;font-weight:800;color:var(--spf-navy);margin:0 0 12px;text-transform:uppercase;letter-spacing:.4px}
.spf-s{width:100%;border:1px solid var(--spf-line);border-radius:6px;padding:11px 12px;font-size:14px;outline:none}
.spf-s:focus{border-color:var(--spf-yellow)}
.spf-check{display:flex;align-items:center;gap:9px;padding:7px 0;cursor:pointer;font-size:14px;color:#374A5E}
.spf-check input{width:17px;height:17px;accent-color:var(--spf-yellow);cursor:pointer}
.spf-check input.spf-cat{-webkit-appearance:none;appearance:none;width:20px;height:20px;flex:0 0 20px;margin:0;border:2px solid #8B96A3;border-radius:5px;background:#fff;display:grid;place-items:center;transition:background .15s,border-color .15s,box-shadow .15s}.spf-check input.spf-cat:before{content:"";width:9px;height:5px;border-left:2px solid var(--spf-navy);border-bottom:2px solid var(--spf-navy);transform:rotate(-45deg) scale(0);margin-top:-2px;transition:transform .12s}.spf-check input.spf-cat:checked{background:var(--spf-yellow);border-color:var(--spf-yellow);box-shadow:0 0 0 3px rgba(242,196,0,.16)}.spf-check input.spf-cat:checked:before{transform:rotate(-45deg) scale(1)}.spf-check input.spf-cat:focus-visible{outline:2px solid var(--spf-navy);outline-offset:2px}.spf-check:has(.spf-cat:checked)>span{color:var(--spf-navy);font-weight:700}
.spf-check em{margin-left:auto;color:var(--spf-muted);font-style:normal;font-size:12px;background:#F1F5F9;border-radius:20px;padding:2px 9px}
.spf-dynamic-attrs{transition:opacity .18s;position:relative}.spf-dynamic-attrs.is-loading{opacity:.45;pointer-events:none}.spf-attrs-placeholder{margin:14px 0 4px;padding:15px 13px;border:1px dashed #CBD5E1;border-radius:7px;background:#F8FAFC;display:flex;flex-direction:column;gap:4px}.spf-attrs-placeholder b{font-family:Montserrat,sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--spf-navy)}.spf-attrs-placeholder span{font-size:12px;line-height:1.4;color:var(--spf-muted)}.spf-dynamic-attrs.is-disabled .spf-attrs-placeholder{opacity:.75}.spf-attr-group{padding-top:14px}.spf-attr-group .spf-check{padding:5px 0}.spf-attr-group .spf-check span{line-height:1.25}

.spf-slider{position:relative;height:30px;margin:4px 6px 2px}
.spf-track{position:absolute;top:13px;left:0;right:0;height:4px;background:var(--spf-line);border-radius:3px}
.spf-range{position:absolute;top:13px;height:4px;background:var(--spf-yellow);border-radius:3px;left:0;width:100%}
.spf-slider input[type=range]{position:absolute;top:0;left:0;width:100%;height:30px;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}
.spf-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--spf-yellow);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.25)}
.spf-slider input[type=range]::-moz-range-thumb{pointer-events:auto;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--spf-yellow);cursor:pointer}
.spf-pricebox{display:flex;align-items:center;gap:8px;margin-top:12px}
.spf-pricebox span{color:#9FB0C2}
.spf-pricebox input{width:100%;border:1px solid var(--spf-line);border-radius:6px;padding:9px 8px;font-size:13px;text-align:center;outline:none}
.spf-pricebox input:focus{border-color:var(--spf-yellow)}

.spf-actions{display:flex;gap:10px;margin-top:18px}
.spf-apply{display:none}
.spf-reset{flex:1;background:#fff;border:1px solid var(--spf-line);color:#475569;border-radius:6px;padding:11px;font-weight:700;cursor:pointer}
.spf-reset:hover{background:#F6F8FB;border-color:#CBD5E1}

.spf-results{flex:1;min-width:0;position:relative;transition:opacity .15s}
.spf-loading .spf-results{opacity:.45;pointer-events:none}
.spf-results ul.products,.woocommerce.spf-grid ul.products{display:grid!important;gap:18px;list-style:none;margin:0!important;padding:0!important}
.spf-results ul.products{grid-template-columns:repeat(3,1fr)}
.woocommerce.spf-grid ul.products{grid-template-columns:repeat(var(--spf-cols,4),1fr)}
.spf-results ul.products::before,.spf-results ul.products::after,
.woocommerce.spf-grid ul.products::before,.woocommerce.spf-grid ul.products::after{display:none!important}
.spf-results ul.products li.product,.woocommerce.spf-grid ul.products li.product{width:auto!important;margin:0!important;float:none!important}

/* ------------------------------ Cardul ------------------------------ */
.spf-card{background:#fff;border:1px solid #E8ECF1;border-radius:6px;display:flex;flex-direction:column;overflow:hidden;transition:box-shadow .18s,border-color .18s;text-align:left!important}
.spf-card:hover{box-shadow:0 10px 26px rgba(11,31,51,.10);border-color:#D7DEE6}
.spf-media{position:relative;padding:18px;background:#fff}
.spf-badges{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:6px;z-index:2;align-items:flex-start}
.spf-b{font-size:12px;font-weight:700;padding:4px 9px;border-radius:3px;color:#fff;line-height:1.2}
.spf-b1{background:var(--spf-navy)}
.spf-b2{background:var(--spf-green)}
.spf-img{display:flex;align-items:center;justify-content:center;height:190px}
.spf-img img{max-height:190px!important;width:auto!important;max-width:100%;object-fit:contain;margin:0 auto!important}
.spf-body{display:flex;flex-direction:column;flex:1;padding:0 16px 16px;border-top:1px solid #F0F3F6;padding-top:12px}
.spf-sku{font-size:12px;color:var(--spf-muted);margin-bottom:4px}
.spf-title{font-family:Montserrat,sans-serif;font-size:15px;font-weight:700;color:var(--spf-navy)!important;line-height:1.4;text-decoration:none;display:block;min-height:63px;margin-bottom:8px}
.spf-title:hover{color:var(--spf-blue)!important}
.spf-docline{display:flex;align-items:center;gap:9px;margin-bottom:10px;min-height:26px}
.spf-energy{background:var(--spf-yellow);color:var(--spf-navy);font-weight:800;font-size:12px;padding:4px 8px;border-radius:3px;position:relative}
.spf-doc{font-size:13px;color:var(--spf-blue)!important;text-decoration:none}
.spf-doc:hover{text-decoration:underline}
.spf-pricing{margin-top:auto}
.spf-oldline{display:flex;align-items:center;gap:8px;font-size:13px}
.spf-oldline del{color:#9AA8B8}
.spf-disc{background:var(--spf-red);color:#fff;font-weight:700;font-size:12px;padding:2px 7px;border-radius:3px}
.spf-price{font-family:Montserrat,sans-serif;font-size:22px;font-weight:800;color:var(--spf-navy);display:block;line-height:1.2}
.spf-price .woocommerce-Price-amount{font-size:inherit;font-weight:inherit;color:inherit}
.spf-price-req{font-size:18px}
.spf-tva{font-size:12px;color:var(--spf-muted);margin-top:2px}
.spf-stock{display:flex;align-items:center;gap:7px;font-size:13px;margin:10px 0 12px;color:var(--spf-text)}
.spf-stock i{width:9px;height:9px;border-radius:50%;display:inline-block}
.spf-stock.is-in{color:var(--spf-green)}
.spf-stock.is-in i{background:var(--spf-green)}
.spf-stock.is-wait i{background:var(--spf-navy)}
.spf-add{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--spf-add)!important;color:var(--spf-navy)!important;font-family:Montserrat,sans-serif;font-weight:700;font-size:14px;padding:12px 10px!important;border-radius:4px;text-decoration:none;text-align:center;transition:background .15s;margin:0!important}
.spf-add:hover{background:var(--spf-add-d)!important}
.spf-add.added{background:var(--spf-green)!important;color:#fff!important}
.spf-add .spf-cart{font-size:15px;line-height:1}
.spf-add-rfq{background:var(--spf-yellow)!important;color:var(--spf-navy)!important}
.spf-add-rfq:hover{background:#E0B400!important}
.spf-card .added_to_cart{display:block;text-align:center;margin-top:8px;font-size:13px;color:var(--spf-green);font-weight:700}

.spf-empty{text-align:center;padding:64px 20px;color:var(--spf-muted);background:#fff;border:1px solid var(--spf-line);border-radius:8px}
.spf-empty p{font-size:17px;font-weight:700;color:var(--spf-navy);margin:0 0 6px}
.spf-empty span{font-size:14px}

.spf-pagination{display:flex;gap:8px;justify-content:center;margin-top:34px;flex-wrap:wrap}
.spf-pg{min-width:42px;height:42px;border:1px solid var(--spf-line);background:#fff;border-radius:6px;font-weight:700;color:var(--spf-navy);cursor:pointer;font-size:15px}
.spf-pg.is-active{background:var(--spf-yellow);border-color:var(--spf-yellow);color:var(--spf-navy)}
.spf-pg:hover:not(.is-active){border-color:var(--spf-yellow)}

.spf-overlay{display:none}

.spf-more-wrap{text-align:center;margin-top:28px}
.spf-more{background:#fff;border:2px solid var(--spf-yellow);color:var(--spf-navy);font-weight:800;font-size:15px;padding:13px 34px;border-radius:6px;cursor:pointer;font-family:Montserrat,sans-serif;transition:background .15s;display:inline-flex;align-items:center;gap:9px}
.spf-more:hover{background:var(--spf-yellow)}
.spf-more:disabled{opacity:.7;cursor:default}

@media (max-width:1100px){
	.spf-results ul.products{grid-template-columns:repeat(2,1fr)}
	.woocommerce.spf-grid ul.products{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
	.spf-toggle{display:inline-flex}
	.spf-sortwrap{margin-left:0;flex:1;justify-content:flex-end}
	.spf-side{position:fixed;top:0;left:0;height:100%;width:88%;max-width:350px;z-index:100000;border-radius:0;transform:translateX(-100%);transition:transform .28s ease;overflow-y:auto;box-shadow:0 0 50px rgba(0,0,0,.25);padding-bottom:90px}
	.spf-open .spf-side{transform:none}
	.spf-side-head{display:flex;position:sticky;top:0;background:#fff;border-bottom:1px solid #EEF1F5;margin:0 -18px;padding:14px 18px;z-index:2}
	.spf-apply{display:block;flex:2;background:var(--spf-yellow);color:var(--spf-navy);border:0;border-radius:6px;padding:13px;font-weight:800;cursor:pointer}
	.spf-actions{position:sticky;bottom:0;background:#fff;padding:14px 18px 4px;margin:0 -18px;border-top:1px solid #EEF1F5}
	.spf-overlay{display:block;position:fixed;inset:0;background:rgba(11,31,51,.5);z-index:99999;opacity:0;pointer-events:none;transition:opacity .28s}
	.spf-open .spf-overlay{opacity:1;pointer-events:auto}
}
@media (max-width:680px){
	.spf-results ul.products,.woocommerce.spf-grid ul.products{grid-template-columns:repeat(2,1fr);gap:12px}
	.spf-head h1{font-size:24px}
	.spf-title{min-height:0}
}
@media (max-width:420px){
	.spf-results ul.products,.woocommerce.spf-grid ul.products{grid-template-columns:1fr}
}

/* ------------------------- Carusel orizontal (mockup) ------------------------- */
.spf-carousel{position:relative}
.spf-car-nav{position:absolute;top:-58px;right:0;display:flex;gap:8px}
.spf-car-prev,.spf-car-next{width:40px;height:40px;border-radius:50%;border:1px solid var(--spf-line);background:#fff;color:var(--spf-navy);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;padding:0 0 3px}
.spf-car-prev:hover,.spf-car-next:hover{background:var(--spf-yellow);border-color:var(--spf-yellow)}
.spf-car-prev:disabled,.spf-car-next:disabled{opacity:.35;cursor:default;background:#fff;border-color:var(--spf-line)}
.spf-carousel ul.products.spf-car-track{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;gap:18px;list-style:none;margin:0!important;padding:2px 2px 6px!important;scrollbar-width:none;-ms-overflow-style:none}
.spf-carousel ul.products.spf-car-track::-webkit-scrollbar{display:none}
.spf-carousel ul.products.spf-car-track::before,.spf-carousel ul.products.spf-car-track::after{display:none!important}
.spf-carousel ul.products.spf-car-track li.product{flex:0 0 calc(100%/var(--spf-vis,5.4) - 15px);width:auto!important;margin:0!important;float:none!important;scroll-snap-align:start}
/* carduri compacte în carusel (~6 pe rând, ca în mockup) */
.spf-carousel{--spf-vis:5.4}
.spf-carousel .spf-img{height:150px}
.spf-carousel .spf-img img{max-height:150px!important}
.spf-carousel .spf-media{padding:14px}
.spf-carousel .spf-body{padding:10px 12px 12px}
.spf-carousel .spf-title{font-size:13.5px;min-height:57px}
.spf-carousel .spf-sku{font-size:11px}
.spf-carousel .spf-doc{font-size:12px}
.spf-carousel .spf-energy{font-size:11px;padding:3px 7px}
.spf-carousel .spf-price{font-size:19px}
.spf-carousel .spf-price-req{font-size:16px}
.spf-carousel .spf-stock{font-size:12px;margin:8px 0 10px}
.spf-carousel .spf-add{font-size:13px;padding:10px 8px!important;gap:7px}
.spf-carousel .spf-b{font-size:11px;padding:3px 8px}
.spf-car-dots{display:flex;justify-content:center;gap:8px;margin-top:22px}
.spf-car-dot{width:34px;height:4px;border-radius:3px;background:#D7DEE6;border:0;cursor:pointer;padding:0;transition:background .15s}
.spf-car-dot.is-active{background:var(--spf-navy)}
@media (max-width:1100px){.spf-carousel{--spf-vis:4.3}}
@media (max-width:900px){.spf-carousel{--spf-vis:3.2}}
@media (max-width:680px){.spf-carousel{--spf-vis:2.2}.spf-carousel .spf-title{min-height:0}}
@media (max-width:480px){.spf-carousel{--spf-vis:1.25}}