/* Product detail styles - scoped under .product-detail-page to avoid conflicts */
.product-detail-page{
	--red-primary: #FF0000;
	--red-dark: #CC0000;
	--blue-primary: #1075CD;

	--bg-gradient: linear-gradient(to bottom, #F9FAFB, #FFFFFF);
	--bg-white: #FFFFFF;
	--bg-gray-50: #F9FAFB;
	--bg-gray-100: #F3F4F6;
	--bg-red-50: #FEF2F2;
	--bg-pink-50: #FDF2F8;
	--bg-blue-50: #EFF6FF;

	--text-gray-900: #111827;
	--text-gray-700: #374151;
	--text-gray-600: #4B5563;
	--text-gray-500: #6B7280;

	--border-gray-100: #F3F4F6;
	--border-gray-200: #E5E7EB;
	--border-red-100: #FEE2E2;
	--border-blue-100: #DBEAFE;

	--yellow-400: #FBBF24;
	--green-700: #15803D;

	font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	background: var(--bg-gradient);
	padding-top: 32px; padding-bottom: 32px;
	overflow-x:hidden;
	width:100%;
	box-sizing:border-box;
}

.product-detail-page .product-detail-inner{ width:100%; max-width:1200px; margin:0 auto; padding:0 2px; box-sizing:border-box }
@media(min-width:480px){ .product-detail-page .product-detail-inner{ padding:0 10px } }
@media(min-width:640px){ .product-detail-page .product-detail-inner{ padding:0 24px } }

/* Breadcrumb */
.product-detail-page .breadcrumb{ font-size:0.875rem; color:var(--text-gray-600); display:flex; gap:8px; margin-bottom:24px }
.product-detail-page .breadcrumb a{ color:inherit; text-decoration:none }

/* Back link */
.product-detail-page .back-link{ display:inline-flex; align-items:center; gap:8px; color:var(--text-gray-600); margin-bottom:32px }
.product-detail-page .back-link svg{ width:16px; height:16px; transition:transform .25s }
.product-detail-page .back-link:hover svg{ transform:translateX(-4px) }

/* Grid */
.product-detail-page .grid-2{ display:grid; grid-template-columns:1fr; gap:32px }
@media(min-width:640px){ .product-detail-page .product-detail-inner{ padding:0 24px } }
@media(min-width:1024px){ .product-detail-page .grid-2{ grid-template-columns:0.9fr 1.2fr; gap:48px } }

/* Card shared */
.product-detail-page .card{ background:var(--bg-white); border:1px solid var(--border-gray-200); border-radius:16px; overflow:hidden; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.06); width:100%; box-sizing:border-box; margin:0 }
.product-detail-page .product-header{ padding:12px !important; box-sizing:border-box }
@media(min-width:640px){ .product-detail-page .product-header{ padding:16px !important } }

/* Media */
.product-detail-page .media-large{ position:relative; width:100%; display:flex; justify-content:center }
.product-detail-page .product-gallery{ position:relative; overflow:hidden; border-radius:24px; background:#f8fafc; max-width:380px; width:100%; margin:0 auto }
.product-detail-page .gallery-main{ position:relative; width:100%; aspect-ratio:1 / 1; overflow:hidden; border-radius:24px }
.product-detail-page .gallery-main img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .45s ease }
.product-detail-page .gallery-main:hover img{ transform:scale(1.12) }
.product-detail-page .gallery-thumbs{ display:flex; gap:12px; padding-top:16px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; max-height:108px; transition:opacity .3s ease, transform .3s ease, max-height .3s ease; }
.product-detail-page .gallery-thumbs::-webkit-scrollbar{ display:none }
.product-detail-page .gallery-thumbs.hidden{ opacity:0; max-height:0; transform:translateY(-4px); pointer-events:none; }
.product-detail-page .gallery-thumbs.open{ opacity:1; max-height:108px; transform:none; pointer-events:auto; }
.product-detail-page .gallery-thumb{ width:72px; height:72px; border-radius:16px; border:2px solid transparent; cursor:pointer; flex-shrink:0; transition:border-color .25s ease, transform .25s ease; overflow:hidden; }
.product-detail-page .gallery-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.product-detail-page .gallery-thumb:hover,
.product-detail-page .gallery-thumb.active{ border-color:var(--blue-primary); transform:scale(1.02) }
.product-detail-page .gallery-nav{ position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border:none; border-radius:9999px; background:rgba(17,24,39,0.75); color:#fff; font-size:1.5rem; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 20px rgba(0,0,0,0.16) }

.product-detail-page .gallery-nav:hover{
  background:rgba(17,24,39,0.9);
}
.product-detail-page .gallery-nav.prev{ left:16px; }
.product-detail-page .gallery-nav.next{ right:16px; }

/* Best seller badge */
.product-detail-page .badge-seller{ position:absolute; top:16px; left:16px; z-index:10; background:linear-gradient(90deg,var(--red-primary),var(--red-dark)); color:#fff; font-size:14px; font-weight:700; padding:8px 16px; border-radius:9999px; display:flex; align-items:center; gap:8px; box-shadow:0 10px 15px -3px rgba(0,0,0,0.08) }

/* Trust badges */
.product-detail-page .trust-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px }
.product-detail-page .trust-item{ background:var(--bg-white); border:1px solid var(--border-gray-200); border-radius:12px; padding:16px; text-align:center }
.product-detail-page .trust-item svg{ width:24px; height:24px; color:var(--blue-primary); margin-bottom:8px }
.product-detail-page .trust-item .title{ font-size:12px; font-weight:600; color:var(--text-gray-700) }
.product-detail-page .trust-item .sub{ font-size:12px; color:var(--text-gray-500) }

/* Header */
.product-detail-page .product-header h1{ margin:0 0 8px; font-size:20px; font-weight:500; color:var(--text-gray-900); line-height:1.5; word-break:break-word }
@media(min-width:640px){ .product-detail-page .product-header h1{ font-size:24px } }
.product-detail-page .product-header .model{ font-size:14px; color:var(--text-gray-600); margin-bottom:16px; word-break:break-word }
@media(min-width:640px){ .product-detail-page .product-header .model{ font-size:16px } }

/* Rating */
.product-detail-page .rating{ display:flex; align-items:center; gap:8px; margin-bottom:16px }
.product-detail-page .rating .stars{ display:flex; gap:4px }
.product-detail-page .rating .stars svg{ width:20px; height:20px; color:var(--yellow-400); fill:var(--yellow-400) }
.product-detail-page .rating .text{ font-size:14px; color:var(--text-gray-600) }

/* Price box */
.product-detail-page .price-panel{ background:linear-gradient(90deg,var(--bg-red-50),var(--bg-pink-50)); border:1px solid var(--border-red-100); border-radius:12px; padding:16px; margin-bottom:24px }
.product-detail-page .price-panel .price{ font-size:36px; font-weight:700; color:var(--red-primary) }
.product-detail-page .price-panel .compare{ font-size:14px; color:var(--text-gray-500); text-decoration:line-through }
.product-detail-page .price-panel .save-badge{ background:var(--red-primary); color:#fff; font-size:12px; font-weight:700; padding:4px 8px; border-radius:9999px }
.product-detail-page .price-panel .instock{ margin-top:8px; font-size:14px; color:var(--green-700); font-weight:500 }

/* Features */
.product-detail-page .features{ margin-bottom:24px; overflow-x:hidden }
.product-detail-page .features h3{ font-size:16px; font-weight:700; margin-bottom:12px }
@media(min-width:640px){ .product-detail-page .features h3{ font-size:18px } }
.product-detail-page .features .list{ background:var(--bg-gray-50); border-radius:12px; padding:12px; display:flex; flex-direction:column; gap:8px; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .features .list{ padding:16px } }
.product-detail-page .features li{ display:flex; gap:8px; align-items:flex-start; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .features li{ gap:12px } }
.product-detail-page .features .tick{ width:20px; height:20px; background:var(--red-primary); border-radius:9999px; color:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.product-detail-page .features .text{ font-size:12px; color:var(--text-gray-700); line-height:1.625; word-break:break-word; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .features .text{ font-size:14px } }

/* Quantity selector */
.product-detail-page .qty-row{ display:flex; align-items:center; gap:12px; overflow-x:hidden; flex-wrap:wrap }
@media(min-width:640px){ .product-detail-page .qty-row{ gap:16px; flex-wrap:nowrap } }
.product-detail-page .qty-label{ font-size:12px; font-weight:700; color:var(--text-gray-700); margin-bottom:12px }
@media(min-width:640px){ .product-detail-page .qty-label{ font-size:14px } }
.product-detail-page .qty-controls{ display:flex; align-items:center; gap:8px; background:var(--bg-gray-100); border-radius:12px; padding:4px }
.product-detail-page .qty-controls button{ width:44px; height:44px; background:var(--bg-white); border-radius:8px; border:none; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,0.05) }
@media(min-width:640px){ .product-detail-page .qty-controls button{ width:48px; height:48px } }
.product-detail-page .qty-controls button:hover{ background:var(--red-primary); color:#fff }
.product-detail-page .qty-controls .qty-num{ font-size:20px; font-weight:700; width:50px; text-align:center }
@media(min-width:640px){ .product-detail-page .qty-controls .qty-num{ font-size:24px; width:64px } }
.product-detail-page .subtotal-label{ font-size:12px; color:var(--text-gray-600); font-weight:600 }
@media(min-width:640px){ .product-detail-page .subtotal-label{ font-size:14px } }
.product-detail-page .subtotal-price{ font-size:18px; font-weight:700; color:var(--red-primary) }
@media(min-width:640px){ .product-detail-page .subtotal-price{ font-size:20px } }

/* Actions */
.product-detail-page .actions{ display:grid; grid-template-columns:1fr; gap:16px }
@media(min-width:640px){ .product-detail-page .actions{ grid-template-columns:repeat(2,1fr) } }
.product-detail-page .btn-outline{ background:var(--bg-white); border:2px solid var(--red-primary); color:var(--red-primary); padding:14px 20px; border-radius:12px; font-weight:700; font-size:14px; box-shadow:0 4px 6px -1px rgba(0,0,0,0.06); word-break:break-word; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .btn-outline{ padding:16px 24px; font-size:16px } }
.product-detail-page .btn-outline:hover{ background:var(--red-primary); color:#fff; transform:scale(1.05) }
.product-detail-page .btn-primary{ background:linear-gradient(90deg,var(--red-primary),var(--red-dark)); color:#fff; padding:14px 20px; border-radius:12px; font-weight:700; font-size:14px; box-shadow:0 10px 15px -3px rgba(255,0,0,0.3); word-break:break-word; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .btn-primary{ padding:16px 24px; font-size:16px } }
.product-detail-page .btn-primary:hover{ box-shadow:0 20px 25px -5px rgba(255,0,0,0.4); transform:scale(1.05) }
.product-detail-page .btn-share{ background:var(--bg-gray-100); color:var(--text-gray-700); padding:12px 24px; border-radius:12px; font-weight:500 }
.product-detail-page .btn-share:hover{ background:var(--border-gray-200) }

/* Tabs */
.product-detail-page .tabs{ margin-top:64px; background:var(--bg-white); border:1px solid var(--border-gray-200); border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,0.05); overflow:hidden }
.product-detail-page .tab-header{ background:var(--bg-gray-50); border-bottom:1px solid var(--border-gray-200) }
.product-detail-page .tab-buttons{ display:flex; overflow-x:auto; -webkit-overflow-scrolling:touch }
.product-detail-page .tab-btn{ flex:1; min-width:120px; padding:12px 16px; font-weight:600; font-size:14px; border:none; background:transparent; cursor:pointer; border-bottom:4px solid transparent; color:var(--text-gray-600); transition:all 200ms ease; white-space:nowrap }
@media(min-width:640px){ .product-detail-page .tab-btn{ min-width:150px; padding:16px 24px; font-size:16px } }
.product-detail-page .tab-btn.active{ border-bottom-color:#ff0000; color:#ff0000; background:var(--bg-white) }
.product-detail-page .tab-btn:hover{ background:var(--bg-gray-50) }
.product-detail-page .tab-content{ padding:16px }
@media(min-width:640px){ .product-detail-page .tab-content{ padding:32px } }
.product-detail-page .tab-pane{ display:none; overflow-x:hidden }
.product-detail-page .tab-pane.active{ display:block }
.product-detail-page .tab-pane h3{ font-size:18px; font-weight:700; margin-bottom:16px }
@media(min-width:640px){ .product-detail-page .tab-pane h3{ font-size:20px } }
.product-detail-page .tab-pane p{ font-size:14px; color:var(--text-gray-700); line-height:1.625 }
@media(min-width:640px){ .product-detail-page .tab-pane p{ font-size:16px } }

/* Star Rating */
.star-rating .star{ transition:color 200ms ease }
.star-rating .star:hover, .star-rating .star.active{ color:#fbbf24 }

/* Specs grid */
.product-detail-page .specs-grid{ display:grid; grid-template-columns:1fr; gap:12px; word-break:break-word; overflow-x:hidden }
@media(min-width:768px){ .product-detail-page .specs-grid{ grid-template-columns:repeat(2,1fr); gap:16px } }
.product-detail-page .spec-item{ background:var(--bg-gray-50); border:1px solid var(--border-gray-200); border-radius:12px; padding:12px; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .spec-item{ padding:16px } }
.product-detail-page .spec-item .label{ font-weight:600; color:var(--text-gray-700); margin-bottom:4px; text-transform:capitalize; font-size:13px; word-break:break-word }
@media(min-width:640px){ .product-detail-page .spec-item .label{ font-size:14px } }
.product-detail-page .spec-item .value{ color:var(--text-gray-900); font-weight:500; font-size:13px; word-break:break-word }
@media(min-width:640px){ .product-detail-page .spec-item .value{ font-size:14px } }

/* Warranty/Delivery list */
.product-detail-page .info-box{ background:var(--bg-blue-50); border:1px solid var(--border-blue-100); border-radius:12px; padding:16px; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .info-box{ padding:24px } }
.product-detail-page .info-item{ display:flex; gap:12px; align-items:flex-start; margin-bottom:12px; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .info-item{ gap:16px; margin-bottom:16px } }
.product-detail-page .info-item .check{ width:24px; height:24px; background:var(--blue-primary); border-radius:9999px; display:flex; align-items:center; justify-content:center; color:#fff; flex-shrink:0 }
.product-detail-page .info-item .text{ font-size:13px; color:var(--text-gray-700); word-break:break-word; overflow-x:hidden }
@media(min-width:640px){ .product-detail-page .info-item .text{ font-size:16px } }

/* Notifications */
.product-detail-page .notification{ position:fixed; top:96px; right:16px; background:var(--green-700); color:#fff; padding:12px 16px; border-radius:8px; z-index:1000 }