*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;background:#f7f8fc;color:#172033}header{display:flex;align-items:center;gap:28px;padding:18px 6%;background:#fff;position:sticky;top:0;z-index:5;box-shadow:0 2px 14px #00000012}.logo{font-size:27px;font-weight:900;color:#6c35ff}.logo span{color:#ff4b91}.search{display:flex;flex:1;max-width:600px}.search input{flex:1;padding:13px 16px;border:1px solid #ddd;border-radius:12px 0 0 12px}.search button{border:0;background:#6c35ff;color:#fff;padding:0 20px;border-radius:0 12px 12px 0}nav{display:flex;gap:18px}a{text-decoration:none;color:inherit}.hero{margin:28px 6%;padding:70px 7%;border-radius:28px;background:linear-gradient(120deg,#6c35ff,#ff4b91);color:#fff}.hero h1{font-size:52px;margin:8px 0}.tag{font-weight:bold;letter-spacing:2px}.btn,.add{display:inline-block;background:#fff;color:#6c35ff;padding:13px 22px;border-radius:12px;font-weight:bold;border:0;cursor:pointer}.wrap{max-width:1200px;margin:45px auto;padding:0 20px}.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:45px}.cats a{background:#fff;padding:20px;text-align:center;border-radius:15px;box-shadow:0 4px 18px #0000000b}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:#fff;padding:18px;border-radius:18px;box-shadow:0 5px 20px #0000000b}.pic{height:150px;border-radius:14px;background:linear-gradient(135deg,#eef0ff,#fff0f6);display:grid;place-items:center;font-size:55px}.card strong{display:block;font-size:20px;margin:10px 0}.add{background:#172033;color:#fff;padding:10px 15px}.cartrow{background:#fff;padding:18px;margin:10px 0;border-radius:12px;display:flex;justify-content:space-between}.auth{max-width:430px;margin:70px auto;background:#fff;padding:35px;border-radius:22px;box-shadow:0 10px 35px #0001}.auth form{display:grid;gap:14px}.auth input,.auth textarea{padding:14px;border:1px solid #ddd;border-radius:10px}.auth .btn{background:#6c35ff;color:#fff}footer{text-align:center;padding:40px;background:#172033;color:#fff;margin-top:60px}@media(max-width:800px){header{flex-wrap:wrap}.search{order:3;flex-basis:100%}.hero h1{font-size:38px}.cats{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:500px){.grid{grid-template-columns:1fr}.hero{padding:45px 25px;margin:15px}.wrap{margin:25px auto}nav{gap:10px}}
.product-img{width:100%;height:150px;object-fit:cover;border-radius:14px;display:block}


/* CLICKABLE PRODUCT / DETAIL PAGE */
.product-image-link{display:block;position:relative;border-radius:14px;overflow:hidden}
.product-image-link .product-img{transition:transform .35s ease,filter .35s ease}
.product-image-link:hover .product-img{transform:scale(1.05);filter:saturate(1.08)}
.product-image-link:after{content:"🔍  View Product";position:absolute;left:50%;bottom:12px;transform:translate(-50%,12px);opacity:0;background:#6c35ff;color:#fff;padding:9px 13px;border-radius:9px;font-size:12px;font-weight:bold;transition:.25s;white-space:nowrap}
.product-image-link:hover:after{opacity:1;transform:translate(-50%,0)}

.product-detail-wrap{max-width:1200px;margin:0 auto;padding:30px 20px 70px}
.breadcrumb{color:#697287;font-size:14px;margin-bottom:20px}
.breadcrumb a{color:#6c35ff;font-weight:600}
.breadcrumb span{padding:0 8px;color:#aaa}
.product-detail{display:grid;grid-template-columns:1.05fr .95fr;gap:45px;background:#fff;padding:30px;border-radius:24px;box-shadow:0 10px 35px #0000000c}
.detail-image-box{position:relative;background:linear-gradient(135deg,#f0eeff,#fff0f6);border-radius:20px;padding:18px;min-height:500px;display:grid;place-items:center}
.detail-image{width:100%;height:500px;object-fit:contain;border-radius:15px;cursor:zoom-in;transition:transform .3s}
.detail-image:hover{transform:scale(1.02)}
.detail-placeholder{width:100%;height:500px;display:grid;place-items:center;font-size:100px}
.image-hint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);background:#172033e8;color:#fff;padding:8px 13px;border-radius:99px;font-size:12px}
.detail-info{padding:18px 5px}
.detail-category{display:inline-block;background:#eeeaff;color:#6134d6;padding:7px 12px;border-radius:99px;font-size:12px;font-weight:bold}
.detail-info h1{font-size:40px;line-height:1.15;margin:18px 0 12px}
.rating{color:#ff9b00;font-size:18px}
.rating span{color:#697287;font-size:13px;margin-left:8px}
.detail-price{font-size:34px;font-weight:900;color:#6c35ff;margin:18px 0}
.detail-description{color:#667085;line-height:1.7;font-size:15px}
.stock{display:inline-block;padding:9px 13px;border-radius:9px;font-size:13px;font-weight:bold;margin:10px 0 20px}
.stock.in{background:#e5f8ec;color:#167642}
.stock.out{background:#ffe7eb;color:#b42335}
.qty-row{display:flex;align-items:center;gap:20px;margin:10px 0 20px;font-weight:bold}
.qty{display:flex;border:1px solid #ddd;border-radius:10px;overflow:hidden}
.qty button{width:40px;border:0;background:#f4f4f8;font-size:20px;cursor:pointer}
.qty input{width:45px;text-align:center;border:0;font-weight:bold}
.detail-actions{display:flex;gap:12px}
.detail-cart,.buy-now{flex:1;text-align:center;padding:15px;border-radius:12px;font-weight:bold}
.detail-cart{background:#172033;color:#fff}
.buy-now{background:linear-gradient(120deg,#6c35ff,#ff4b91);color:#fff}
.benefits{display:grid;grid-template-columns:1fr;gap:10px;margin-top:25px}
.benefits div{background:#f7f7fb;padding:12px;border-radius:11px;font-size:14px}
.benefits b{margin-left:6px}
.benefits small{display:block;color:#7a8190;margin-left:27px;margin-top:3px}
.image-modal{position:fixed;inset:0;background:#101426ee;z-index:100;display:none;align-items:center;justify-content:center;padding:40px}
.image-modal.show{display:flex}
.image-modal img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:16px;box-shadow:0 20px 70px #0008}
.close-image{position:absolute;right:25px;top:20px;width:45px;height:45px;border:0;border-radius:50%;background:#fff;color:#172033;font-size:30px;cursor:pointer}

@media(max-width:850px){
 .product-detail{grid-template-columns:1fr;padding:18px;gap:20px}
 .detail-image-box,.detail-image,.detail-placeholder{min-height:350px;height:350px}
 .detail-info h1{font-size:30px}
}

/* CUSTOMER ACCOUNT */
.account-wrap{max-width:1200px;margin:35px auto 70px;padding:0 20px}
.account-heading{margin:25px 0}.account-kicker{font-size:11px;letter-spacing:2px;color:#6c35ff;font-weight:bold}
.account-heading h1{font-size:38px;margin:7px 0}.account-heading p,.muted{color:#697287}
.account-layout{display:grid;grid-template-columns:270px 1fr;gap:24px;align-items:start}
.account-menu{background:#fff;border-radius:18px;padding:15px;box-shadow:0 6px 25px #0000000b}
.profile-mini{display:flex;align-items:center;gap:11px;padding:10px 8px 18px;border-bottom:1px solid #eee;margin-bottom:8px}
.avatar{width:45px;height:45px;border-radius:50%;background:linear-gradient(135deg,#6c35ff,#ff4b91);color:#fff;display:grid;place-items:center;font-weight:900;font-size:19px}
.profile-mini small{display:block;color:#7a8291;font-size:11px;margin-top:3px;max-width:165px;overflow:hidden;text-overflow:ellipsis}
.account-menu>a{display:block;padding:13px 12px;border-radius:10px;text-decoration:none;color:#333;margin:3px 0;font-weight:600;font-size:14px}
.account-menu>a.active,.account-menu>a:hover{background:#f0ecff;color:#6234d5}
.account-menu .account-logout{color:#c02f48;margin-top:10px}
.account-content{min-width:0}
.account-card{background:#fff;border-radius:18px;padding:28px;box-shadow:0 6px 25px #0000000b}
.account-card h2{margin:0 0 7px;font-size:24px}.account-form{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:24px}
.account-form label{font-size:13px;color:#626b7e;font-weight:600}.account-form input,.account-form textarea{display:block;width:100%;margin-top:7px;padding:13px;border:1px solid #dfe3eb;border-radius:10px;font-family:inherit;font-size:14px}
.account-form textarea{min-height:110px;resize:vertical}.account-form .full-field{grid-column:1/-1}.account-form.one-col{grid-template-columns:1fr;max-width:520px}.account-save{background:#6c35ff;color:#fff;margin-top:5px}
.account-success,.account-alert{padding:13px 16px;border-radius:11px;margin:0 0 18px;font-size:14px}.account-success{background:#e7f8ed;color:#187642}.account-alert{background:#ffe9ed;color:#b4233c}
.account-link{color:#6c35ff;font-weight:bold;text-decoration:none}.account-auth{margin-top:50px}
.card-title-row{display:flex;justify-content:space-between;align-items:center;gap:15px}.card-title-row h2{margin-bottom:4px}
.empty-account{text-align:center;padding:55px 15px;color:#687186}.empty-account:first-letter{font-size:35px}
.order-list{margin-top:20px}.order-item{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:12px;align-items:center;border:1px solid #edf0f5;padding:16px;border-radius:12px;margin:9px 0;font-size:14px}.order-item small{display:block;color:#7a8291;margin-top:4px}
.status-pill{justify-self:start;padding:6px 10px;border-radius:99px;font-size:12px;background:#eee}.status-pill.delivered{background:#e5f8ec;color:#187642}.status-pill.shipped{background:#e6f0ff;color:#2563b8}.status-pill.processing{background:#fff3d7;color:#946200}.status-pill.pending{background:#eeeaff;color:#6040b4}.status-pill.cancelled{background:#ffe8eb;color:#b42335}
@media(max-width:800px){.account-layout{grid-template-columns:1fr}.account-form{grid-template-columns:1fr}.account-form .full-field{grid-column:auto}.account-heading h1{font-size:30px}.order-item{grid-template-columns:1fr 1fr}.card-title-row{align-items:flex-start;flex-direction:column}}
/* CUSTOMER ORDER MANAGEMENT */
.checkout-wrap{max-width:1100px;margin:35px auto 70px;padding:0 20px}.checkout-grid{display:grid;grid-template-columns:1fr 360px;gap:22px}.checkout-summary{height:max-content}.summary-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f5;font-size:14px}.summary-total{display:flex;justify-content:space-between;padding-top:18px;font-size:20px}.checkout-success{background:#fff;max-width:700px;margin:70px auto;padding:45px;border-radius:22px;box-shadow:0 10px 35px #0000000b;text-align:center}.success-icon{width:65px;height:65px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#e5f8ec;color:#187642;font-size:35px;font-weight:bold}.checkout-success h1{font-size:30px}.checkout-actions{display:flex;justify-content:center;gap:12px;margin-top:22px}.secondary{display:inline-block;padding:12px 16px;border-radius:10px;background:#f1f2f6;color:#172033;text-decoration:none;font-weight:bold;border:0;cursor:pointer}.order-top{margin:30px 0 20px}.order-top h1{margin:5px 0}.print-actions{display:flex;gap:10px}.order-status-card{margin-bottom:20px}.progress{display:grid;grid-template-columns:repeat(4,1fr);position:relative;margin:35px 10px 10px}.progress-line{position:absolute;top:15px;left:10%;right:10%;height:4px;background:#e5e7ed;border-radius:99px;z-index:0}.progress-line span{display:block;height:100%;background:#6c35ff;border-radius:99px}.progress-step{position:relative;z-index:1;text-align:center}.progress-step span{display:grid;place-items:center;width:32px;height:32px;margin:auto;border-radius:50%;background:#e8eaf0;color:#777;font-weight:bold}.progress-step.done span{background:#6c35ff;color:#fff}.progress-step small{display:block;margin-top:8px;color:#737b8c;font-weight:600}.progress-step.done small{color:#4d2ac0}.order-detail-grid{display:grid;grid-template-columns:1fr 380px;gap:20px}.detail-item{display:flex;justify-content:space-between;gap:15px;padding:15px 0;border-bottom:1px solid #edf0f5}.detail-item small{display:block;color:#7b8392;margin-top:5px}.detail-total{border-top:1px solid #ddd;margin-top:10px}.info-block{padding:12px 0;border-bottom:1px solid #edf0f5}.info-block b{display:block;color:#687186;font-size:12px;margin-bottom:5px}.info-block span{font-size:14px;line-height:1.5}.reorder{display:block;text-align:center;margin-top:20px;text-decoration:none}.order-head{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;color:#8991a0;font-size:11px;font-weight:bold;padding:10px 15px}.order-item{grid-template-columns:1.2fr 1fr 1fr 1fr}.order-view{color:#6c35ff;font-weight:bold;text-decoration:none;font-size:13px}.order-view:hover{text-decoration:underline}
@media(max-width:850px){.checkout-grid,.order-detail-grid{grid-template-columns:1fr}.progress{margin-left:0;margin-right:0}.order-head{display:none}.order-item{grid-template-columns:1fr 1fr}.print-actions{flex-wrap:wrap}.checkout-success{margin:30px auto;padding:30px}}
@media print{header,footer,.print-actions,.reorder{display:none!important}.account-wrap{margin:0;padding:0}.account-card{box-shadow:none;border:1px solid #ddd}.order-status-card{break-inside:avoid}}

/* AVGSHOP PREMIUM HOMEPAGE */
.topbar{height:30px;background:linear-gradient(90deg,#0b9d3b,#16b94d,#63d400);color:#fff;padding:0 5%;display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:600}.site-header{position:relative;display:flex;align-items:center;gap:28px;padding:14px 5%;background:#fff;box-shadow:0 2px 12px #00000010;z-index:5}.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:#101828;min-width:220px}.brand img{width:55px;height:55px;object-fit:contain}.brand b{display:block;font-size:25px;letter-spacing:-1px;color:#0877d9}.brand b span{color:#ff6b2c}.brand small{display:block;font-size:9px;letter-spacing:1px;color:#788398;margin-top:2px}.site-header .search{display:flex;max-width:560px;flex:1;border:1px solid #e0e5ec;border-radius:12px;overflow:hidden;height:43px}.site-header .search select{border:0;border-right:1px solid #eee;padding:0 12px;background:#fff;color:#555}.site-header .search input{border:0;border-radius:0;padding:0 14px;outline:0}.site-header .search button{background:#1689ed;border:0;padding:0 24px;color:#fff;font-weight:bold}.site-header nav{gap:16px;white-space:nowrap}.main-nav{background:linear-gradient(90deg,#0758cf,#167fe9);color:#fff}.nav-inner{max-width:1200px;margin:auto;display:flex;align-items:center}.nav-inner a{color:#fff;text-decoration:none;padding:14px 18px;font-weight:700;font-size:13px}.nav-inner .all-cat{background:#0649b1;border-radius:0 0 10px 10px}.nav-inner .today{margin-left:auto;background:#ff6547;border-radius:8px;padding:9px 15px}.hero-new{max-width:1200px;margin:16px auto 22px;min-height:300px;border-radius:18px;overflow:hidden;position:relative;background:linear-gradient(105deg,#d8b6ff,#9fe4ff 48%,#b7f6c4);display:flex;align-items:center;padding:45px 60px}.hero-copy{position:relative;z-index:2;max-width:410px}.hero-copy>span{color:#0a9d4b;font-size:13px;font-weight:900;letter-spacing:1px}.hero-copy h1{font-size:43px;line-height:1.05;margin:10px 0 15px;color:#12203a}.hero-copy p{color:#40516b;line-height:1.5}.hero-btn{display:inline-block;background:#1689ed;color:#fff;text-decoration:none;padding:12px 20px;border-radius:9px;font-weight:bold;margin:10px 8px 0 0}.hero-btn.light{background:#fff;color:#4c2fe8}.offer{position:absolute;left:43%;top:75px;width:115px;height:115px;border-radius:50%;background:linear-gradient(135deg,#ff3f75,#ff7845);color:#fff;text-align:center;padding-top:22px;font-weight:bold;font-size:12px;box-shadow:0 12px 25px #ff507055;z-index:2}.offer strong{display:block;font-size:30px;line-height:1}.hero-products{position:absolute;right:50px;bottom:0;width:46%;height:100%;display:flex;align-items:center;justify-content:center;gap:10px}.device{display:grid;place-items:center;filter:drop-shadow(0 20px 18px #0003)}.phone{font-size:150px;transform:rotate(-8deg)}.buds{font-size:90px;transform:translateY(70px)}.watch{font-size:95px;transform:translateY(75px)}.trust-strip{max-width:1200px;margin:0 auto 30px;background:#fff;border-radius:14px;box-shadow:0 5px 20px #00000010;display:grid;grid-template-columns:repeat(6,1fr);padding:18px}.trust-strip div{display:grid;grid-template-columns:30px 1fr;column-gap:7px;align-items:center;border-right:1px solid #eee;padding:0 12px}.trust-strip div:last-child{border:0}.trust-strip div:first-letter{font-size:22px}.trust-strip b{font-size:12px}.trust-strip small{grid-column:2;color:#7a8494;font-size:10px}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.section-title h2{margin:0}.section-title a{color:#0879df;font-size:12px;font-weight:bold;text-decoration:none}.category-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:13px}.category-card{padding:16px 8px;background:#fff;border-radius:13px;text-align:center;text-decoration:none;color:#1b2940;box-shadow:0 4px 14px #0000000a;border:1px solid #f0f1f5;transition:.2s}.category-card:hover{transform:translateY(-4px);box-shadow:0 10px 22px #0002}.category-card span{font-size:32px;display:block;margin-bottom:8px}.category-card b{display:block;font-size:11px}.category-card small{display:block;color:#7c8799;font-size:9px;margin-top:5px}.featured-title{margin-top:35px}.card{position:relative}.discount{position:absolute;top:20px;left:20px;background:#12a651;color:#fff;border-radius:6px;padding:5px 7px;font-size:10px;font-weight:bold;z-index:1}.stars{font-size:12px;color:#f59e0b;margin:6px 0}.stars span{color:#8a93a3;margin-left:4px}.benefit-banner{max-width:1200px;margin:35px auto 0;background:linear-gradient(90deg,#075cf0,#008edb,#04b63b);color:#fff;border-radius:12px;display:grid;grid-template-columns:repeat(4,1fr);padding:17px 25px}.benefit-banner div{display:grid;grid-template-columns:35px 1fr;align-items:center}.benefit-banner div:first-letter{font-size:24px}.benefit-banner small{grid-column:2;font-size:10px;opacity:.85}.benefit-banner b{font-size:13px}.footer-inner{max-width:1200px;margin:auto;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1.3fr;gap:30px}.footer-brand img{width:160px;height:70px;object-fit:contain;object-position:left}.footer-inner h3{font-size:14px;margin-top:0}.footer-inner a{display:block;color:#cbd5e1;text-decoration:none;font-size:12px;margin:10px 0}.footer-inner p{font-size:12px;color:#aab5c7;line-height:1.6}.newsletter{display:flex}.newsletter input{min-width:0;flex:1;padding:12px;border:0;border-radius:8px 0 0 8px}.newsletter button{border:0;background:#13b967;color:#fff;padding:0 14px;border-radius:0 8px 8px 0}.footer-bottom{max-width:1200px;margin:25px auto 0;border-top:1px solid #22304a;padding-top:15px;font-size:11px;color:#9aa7ba;display:flex;justify-content:space-between}
@media(max-width:1000px){.site-header{flex-wrap:wrap}.brand{min-width:auto}.site-header .search{order:3;flex-basis:100%;max-width:none}.nav-inner{overflow:auto}.category-grid{grid-template-columns:repeat(4,1fr)}.trust-strip{grid-template-columns:repeat(3,1fr);gap:15px}.hero-products{opacity:.45;right:-30px}.offer{left:52%}.footer-inner{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.topbar span:last-child{display:none}.site-header{padding:10px 15px}.brand img{width:46px;height:46px}.brand b{font-size:21px}.site-header nav{width:100%;justify-content:space-between;font-size:12px}.nav-inner a{padding:12px 13px}.hero-new{margin:10px 12px;padding:35px 25px;min-height:390px}.hero-copy h1{font-size:35px}.hero-products{right:-100px;opacity:.3}.offer{left:auto;right:25px;top:35px;transform:scale(.75)}.trust-strip{margin:0 12px 25px;grid-template-columns:repeat(2,1fr);padding:10px}.trust-strip div{border:0;padding:8px}.category-grid{grid-template-columns:repeat(2,1fr)}.benefit-banner{margin:25px 12px 0;grid-template-columns:repeat(2,1fr);gap:15px}.footer-inner{grid-template-columns:1fr 1fr;padding:0 20px}.footer-bottom{margin:20px;padding:15px;display:block}.footer-bottom span{display:block;margin-top:8px}.wrap{padding:0 12px}}
