/*
Theme Name: DellResell
Theme URI: https://example.com
Author: DellResell
Description: DellResell reseller marketplace theme — homepage, header/footer, and product page styled for WooCommerce.
Version: 7.1
Text Domain: stackd
*/

*{box-sizing:border-box}
body{margin:0;font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:oklch(0.16 0.01 90);background:#fff}
a{color:oklch(0.4 0.1 155);text-decoration:none}
a:hover{color:oklch(0.5 0.13 155)}
img{max-width:100%;display:block}

@keyframes stackd-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes stackd-pulse{0%{box-shadow:0 0 0 0 oklch(0.62 0.14 155 / .55)}70%{box-shadow:0 0 0 8px oklch(0.62 0.14 155 / 0)}100%{box-shadow:0 0 0 0 oklch(0.62 0.14 155 / 0)}}

/* header */
.stackd-topbar{position:sticky;top:0;z-index:50;background:#fff}
.stackd-header{max-width:1280px;margin:0 auto;background:#fff}
.stackd-nav{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid oklch(0.9 0.006 90)}
.stackd-hamburger{background:none;border:none;display:flex;flex-direction:column;gap:4px;width:20px;cursor:default;padding:0}
.stackd-hamburger span{width:20px;height:2px;background:oklch(0.16 0.01 90);border-radius:2px;display:block}
.stackd-logo{font-size:20px;font-weight:800;letter-spacing:-0.5px;color:oklch(0.16 0.01 90)}
.stackd-cart{position:relative;width:34px;height:34px;border-radius:9px;background:oklch(0.95 0.005 90);display:flex;align-items:center;justify-content:center}
.stackd-cart-icon{width:16px;height:14px;border:2px solid oklch(0.16 0.01 90);border-top:none;border-radius:0 0 3px 3px}
.stackd-cart-count{position:absolute;top:-4px;right:-4px;width:16px;height:16px;border-radius:50%;background:oklch(0.68 0.14 45);color:#fff;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center}
.stackd-menu{display:none}
.stackd-menu ul{list-style:none;display:flex;gap:26px;margin:0;padding:14px 20px 0;font-size:13.5px;font-weight:600;color:oklch(0.4 0.01 90)}
.stackd-marquee{background:oklch(0.55 0.19 25);overflow:hidden;padding:8px 0;white-space:nowrap}
.stackd-marquee-track{display:inline-flex;animation:stackd-marquee 26s linear infinite}
.stackd-marquee-item{color:#fff;font-size:11px;font-weight:700;letter-spacing:0.4px;padding:0 18px;display:inline-flex;align-items:center}
.stackd-marquee-item::before{content:'\2022';margin-right:18px;opacity:0.55}
.stackd-marquee-item:first-child::before{display:none}

/* footer */
.stackd-footer{max-width:1280px;margin:0 auto;padding:18px 20px;border-top:1px solid oklch(0.9 0.006 90);display:flex;flex-direction:column;gap:10px}
.stackd-footer-logo{font-size:13px;font-weight:800}
.stackd-footer-links{display:flex;gap:16px;font-size:11px;color:oklch(0.48 0.01 90)}
.stackd-footer-copy{font-size:10px;color:oklch(0.62 0.006 90)}

/* homepage */
.stackd-home{max-width:1280px;margin:0 auto}
.stackd-hero{display:flex;flex-direction:column;gap:14px;padding:22px 20px 20px}
.stackd-hero h1{font-size:26px;font-weight:800;line-height:1.1;letter-spacing:-0.6px;margin:0 0 8px}
.stackd-hero p{font-size:14px;line-height:1.5;color:oklch(0.48 0.01 90);margin:0}
.stackd-hero-img{width:100%;height:200px;border-radius:16px;background:repeating-linear-gradient(135deg,oklch(0.94 0.01 90),oklch(0.94 0.01 90) 10px,oklch(0.9 0.01 90) 10px,oklch(0.9 0.01 90) 20px);display:flex;align-items:center;justify-content:center;font:12px ui-monospace,monospace;color:oklch(0.5 0.01 90)}
.stackd-hero-ctas{display:flex;gap:10px;margin-top:6px}
.stackd-btn{flex:1;background:oklch(0.16 0.01 90);color:#fff;font-size:14px;font-weight:700;text-align:center;padding:13px;border-radius:10px}
.stackd-btn-outline{flex:1;border:1.5px solid oklch(0.16 0.01 90);color:oklch(0.16 0.01 90);font-size:14px;font-weight:700;text-align:center;padding:12px;border-radius:10px}

.stackd-section{padding:4px 20px 22px}
.stackd-section-title{font-size:14px;font-weight:700;margin-bottom:4px}
.stackd-section-sub{font-size:11.5px;font-weight:700;color:oklch(0.55 0.14 155);margin-bottom:12px}
.stackd-pricing-label{font-size:11.5px;font-weight:700;letter-spacing:0.3px;color:oklch(0.48 0.01 90);text-transform:uppercase;margin:16px 0 8px}
.stackd-pack-grid{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.stackd-tile{flex:none;width:116px;border:1.5px solid oklch(0.9 0.006 90);border-radius:12px;padding:12px 10px;display:flex;flex-direction:column;gap:4px;position:relative;background:#fff}
.stackd-tile.is-hot{border:2px solid oklch(0.16 0.01 90)}
.stackd-badge{position:absolute;top:-9px;left:8px;background:oklch(0.62 0.14 155);color:#fff;font-size:8px;font-weight:800;letter-spacing:0.3px;padding:2px 6px;border-radius:4px}
.stackd-tile-name{font-size:15px;font-weight:800}
.stackd-tile-price{font-size:13px;font-weight:700}
.stackd-tile-unit{font-size:11px;color:oklch(0.55 0.14 155);font-weight:700}
.stackd-tile-ship{font-size:9.5px;font-weight:700;color:oklch(0.55 0.14 155)}

.stackd-cat-grid{display:flex;gap:10px;padding:0 20px 22px}
.stackd-cat-tile{flex:1;position:relative;border-radius:14px;overflow:hidden;height:120px;text-decoration:none;display:block;background:repeating-linear-gradient(135deg,oklch(0.94 0.01 90),oklch(0.94 0.01 90) 10px,oklch(0.9 0.01 90) 10px,oklch(0.9 0.01 90) 20px)}
.stackd-cat-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),transparent 60%);display:flex;align-items:flex-end;padding:10px}
.stackd-cat-overlay span{color:#fff;font-size:13px;font-weight:700}

.stackd-feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 20px 22px}
.stackd-feat-card{display:flex;flex-direction:column;gap:6px;color:inherit}
.stackd-feat-img{border-radius:12px;overflow:hidden;width:100%;aspect-ratio:1/1;background:oklch(0.94 0.01 90)}
.stackd-feat-img img{width:100%;height:100%;object-fit:cover}
.stackd-feat-name{font-size:12px;font-weight:700}
.stackd-feat-price{font-size:13px;font-weight:800}

/* single product */
.stackd-pdp-wrap{max-width:1280px;margin:0 auto;padding:0 20px 40px}
.stackd-pdp-wrap .product{display:flex;flex-direction:column;gap:20px}
.stackd-pdp-wrap .summary{display:flex;flex-direction:column;gap:12px}
.stackd-pdp-wrap .product_title{font-size:22px;font-weight:800;letter-spacing:-0.4px;margin:0}
.stackd-pdp-wrap .price{font-size:24px;font-weight:800;color:oklch(0.16 0.01 90)}
.stackd-attr-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:6px 0}
.stackd-kind-colour{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}
.stackd-attr-tile{cursor:pointer;border:1.5px solid oklch(0.9 0.006 90);border-radius:10px;padding:9px 4px;display:flex;flex-direction:column;align-items:center;gap:4px;position:relative;background:#fff;text-align:center}
.stackd-attr-tile.is-selected{border:2px solid oklch(0.16 0.01 90);background:oklch(0.16 0.01 90);color:#fff}
.stackd-attr-badge{position:absolute;top:-9px;left:50%;transform:translateX(-50%);white-space:nowrap;background:oklch(0.62 0.14 155);color:#fff;font-size:7px;font-weight:800;padding:2px 5px;border-radius:4px}
.stackd-attr-tile-name{font-size:14px;font-weight:800}
.stackd-attr-tile-name-sm{font-size:10.5px;font-weight:700}
.stackd-attr-tile-price{font-size:9.5px;font-weight:700;opacity:.85}
.stackd-swatch-dot{width:22px;height:22px;border-radius:50%;display:block}
.stackd-qty-tiles{margin:6px 0 14px}
.stackd-qty-tile{cursor:pointer}
.stackd-qty-tile.is-active{border:2px solid oklch(0.16 0.01 90);background:oklch(0.16 0.01 90);color:#fff}
.stackd-attr-group{margin:6px 0}
.stackd-attr-group-label{font-size:11.5px;font-weight:700;letter-spacing:0.3px;color:oklch(0.48 0.01 90);text-transform:uppercase;margin-bottom:6px}
.stackd-qty-label{display:block;font-size:11.5px;font-weight:700;letter-spacing:0.3px;color:oklch(0.48 0.01 90);text-transform:uppercase;margin-bottom:6px}
.stackd-qty-tip p{font-size:12px;font-weight:600;color:oklch(0.55 0.14 155);margin:6px 0 10px}
.stackd-multiunit{display:flex;flex-direction:column;gap:12px;margin:6px 0 14px}
.stackd-unit-card{border:1px solid oklch(0.9 0.006 90);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}
.stackd-unit-title{font-size:12.5px;font-weight:800;color:oklch(0.16 0.01 90)}
.stackd-unit-group{display:flex;flex-direction:column;gap:6px}
.woocommerce div.product form.cart .button,.single_add_to_cart_button{background:oklch(0.16 0.01 90) !important;border:none !important;color:#fff !important;font-family:'Plus Jakarta Sans',system-ui,sans-serif !important;font-weight:700 !important;font-size:14px !important;padding:0 24px !important;height:64px !important;border-radius:10px !important;text-transform:none !important;box-shadow:none !important;box-sizing:border-box !important;display:inline-flex !important;align-items:center !important;justify-content:center !important}
.woocommerce div.product form.cart .button:hover,.single_add_to_cart_button:hover{background:oklch(0.28 0.01 90) !important}
.woocommerce div.product form.cart .quantity .qty{border:1.5px solid oklch(0.9 0.006 90) !important;border-radius:10px !important;height:44px !important;font-family:'Plus Jakarta Sans',system-ui,sans-serif !important;font-size:14px !important;padding:0 10px !important}
.woocommerce div.product form.cart{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap}
.woocommerce div.product form.cart .quantity{margin:0;display:flex;flex-direction:column}
.woocommerce div.images{max-width:100%}
@media (min-width:900px){ .woocommerce div.images{max-width:360px} }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper{margin:0}
.woocommerce div.images img{border-radius:14px}
.flex-control-thumbs{display:flex !important;gap:8px;overflow-x:auto;list-style:none;margin:10px 0 0 !important;padding:0 !important}
.flex-control-thumbs li{flex:none;width:56px;height:56px}
.flex-control-thumbs img{width:100%;height:100%;object-fit:cover;border-radius:8px;cursor:pointer;opacity:.55;transition:opacity .15s}
.flex-control-thumbs img.flex-active,.flex-control-thumbs img:hover{opacity:1}
.flex-control-nav.flex-control-paging{display:none !important}
.flex-direction-nav{list-style:none !important;margin:0 !important;padding:0 !important}
.flex-direction-nav li{list-style:none !important}
.flex-direction-nav a{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;background:oklch(0.16 0.01 90);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:0;z-index:5;cursor:pointer}
.flex-direction-nav a:before{content:'';display:block;width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff}
.flex-direction-nav a.flex-prev{left:8px}
.flex-direction-nav a.flex-prev:before{transform:rotate(135deg);margin-left:3px}
.flex-direction-nav a.flex-next{right:8px}
.flex-direction-nav a.flex-next:before{transform:rotate(-45deg);margin-right:3px}
.woocommerce div.product .product_title{font-size:21px !important;font-weight:800 !important;line-height:1.25 !important;letter-spacing:-0.3px !important;margin:0 0 4px !important}
@media (min-width:900px){ .woocommerce div.product .product_title{font-size:26px !important} }
.stackd-category-tag{font-size:11px;font-weight:700;letter-spacing:0.4px;text-transform:uppercase;color:oklch(0.55 0.14 155);margin-bottom:4px}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:oklch(0.16 0.01 90) !important;font-weight:800 !important;font-size:22px !important}
.woocommerce div.product p.price del,.woocommerce div.product span.price del{color:oklch(0.62 0.006 90) !important;font-weight:500 !important;font-size:0.65em !important;opacity:1 !important}
.woocommerce div.product p.price ins,.woocommerce div.product span.price ins{text-decoration:none}

.woocommerce span.onsale{background:oklch(0.62 0.14 155) !important;color:#fff !important;font-weight:800 !important;font-size:12px !important;text-transform:none !important;box-shadow:none !important;min-height:0 !important;min-width:0 !important;padding:6px 12px !important;border-radius:9999px !important;line-height:1.2 !important;top:10px !important;left:10px !important;right:auto !important}

/* why choose us comparison */
.stackd-compare{max-width:1280px;margin:0 auto;padding:4px 20px 40px}
.stackd-compare-eyebrow{font-size:11px;font-weight:700;letter-spacing:0.3px;color:oklch(0.55 0.14 155);text-transform:uppercase}
.stackd-compare-title{font-size:20px;font-weight:800;color:oklch(0.16 0.01 90);margin:2px 0 14px}
.stackd-compare-table{border:1px solid oklch(0.9 0.006 90);border-radius:14px;overflow:hidden;background:#fff;max-width:640px}
.stackd-compare-row{display:grid;grid-template-columns:1fr 100px 100px;align-items:center;padding:12px 18px;border-top:1px solid oklch(0.93 0.006 90);font-size:12.5px;font-weight:600;color:oklch(0.3 0.01 90)}
.stackd-compare-row:first-child{border-top:none}
.stackd-compare-head{background:oklch(0.95 0.005 90);font-size:11px;font-weight:800;color:oklch(0.16 0.01 90)}
.stackd-compare-head div:nth-child(2),.stackd-compare-head div:nth-child(3){text-align:center}
.stackd-compare-yes{text-align:center;color:oklch(0.62 0.14 155);font-size:15px;font-weight:800}
.stackd-compare-no{text-align:center;color:oklch(0.62 0.006 90);font-size:11.5px;font-weight:600}
@media (min-width:900px){
    .stackd-compare-title{font-size:24px}
    .stackd-compare-row{padding:14px 24px;font-size:13.5px}
}

@media (min-width:900px){
  .stackd-menu{display:block}
  .stackd-hero{flex-direction:row;align-items:center;gap:56px;padding:56px 48px}
  .stackd-hero-copy{flex:1.1;max-width:460px}
  .stackd-hero-img{flex:0.9;height:360px}
  .stackd-pack-grid{display:grid;grid-template-columns:repeat(4,1fr);overflow:visible}
  .stackd-cat-grid{padding:0 48px 40px}
  .stackd-cat-tile{height:180px}
  .stackd-feat-grid{grid-template-columns:repeat(4,1fr);gap:20px;padding:0 48px 40px}
  .stackd-section{padding:8px 48px 40px}
  .stackd-footer,.stackd-nav{padding-left:48px;padding-right:48px}
  .stackd-pdp-wrap .product{flex-direction:row;gap:56px;padding-top:24px}
  .stackd-pdp-wrap .images{flex:1}
  .stackd-pdp-wrap .summary{flex:1;max-width:480px}
}
