.detail-page{padding:30px 0 70px;background:linear-gradient(180deg,var(--brand-soft),var(--surface) 310px)}
.detail-breadcrumb{display:flex;align-items:center;gap:8px;min-width:0;margin-bottom:20px;color:var(--muted);font-size:.84rem}.detail-breadcrumb a{color:var(--brand-dark);font-weight:700;text-decoration:none}.detail-breadcrumb i{font-size:.7rem}.detail-breadcrumb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail-card{overflow:hidden;border:1px solid rgba(22,139,69,.12);border-radius:28px;background:#fff;box-shadow:var(--shadow)}.detail-gallery{padding:30px;background:#f7faf8;border-right:1px solid #e8f0ea}.detail-main-media{display:grid;place-items:center;aspect-ratio:1;overflow:hidden;border-radius:22px;background:#fff}.detail-main-media>img{width:100%;height:100%;object-fit:contain}.detail-placeholder{display:grid;justify-items:center;gap:10px;color:#a2afa7}.detail-placeholder i{font-size:4rem}
.detail-thumbnails{display:flex;gap:10px;margin-top:14px;padding:3px;overflow-x:auto}.detail-thumbnail{flex:0 0 74px;width:74px;height:74px;padding:4px;overflow:hidden;border:2px solid transparent;border-radius:14px;background:#fff}.detail-thumbnail img{width:100%;height:100%;object-fit:cover;border-radius:9px}.detail-thumbnail:hover,.detail-thumbnail.active{border-color:var(--brand);box-shadow:0 5px 14px rgba(11,95,48,.13)}
.detail-summary{padding:clamp(28px,4vw,48px)}.detail-category{display:inline-flex;padding:7px 12px;margin-bottom:14px;border-radius:99px;background:var(--brand-soft);color:var(--brand-dark);font-size:.76rem;font-weight:800;text-transform:uppercase}.detail-summary h1{margin:0 0 15px;color:var(--ink);font-size:clamp(1.65rem,3vw,2.45rem);font-weight:820;line-height:1.2}.detail-price{margin-bottom:18px;color:var(--brand-dark);font-size:clamp(1.8rem,3vw,2.35rem);font-weight:850}.detail-description{margin-bottom:20px;color:#52645a;line-height:1.7}.detail-code{display:flex;justify-content:space-between;gap:18px;padding:11px 14px;margin-bottom:20px;border-radius:12px;background:#f5f8f6;font-size:.84rem}.detail-code span{color:var(--muted)}
.detail-benefits{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px}.detail-benefits>div{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #e5eee8;border-radius:14px;background:#fbfdfb}.detail-benefits i{color:var(--brand);font-size:1.3rem}.detail-benefits strong,.detail-benefits small{display:block}.detail-benefits strong{font-size:.82rem}.detail-benefits small{margin-top:2px;color:var(--muted);font-size:.68rem}
.detail-actions{display:grid;grid-template-columns:1.25fr 1fr;gap:10px}.detail-actions .btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;border-radius:15px;font-weight:800}.detail-call{border-color:var(--brand);background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff}.detail-call:hover{background:var(--brand-dark);color:#fff}.detail-call span,.detail-call small{display:block;line-height:1.2}.detail-call small{margin-top:3px;font-size:.67rem;opacity:.82}.detail-zalo{border:1px solid var(--brand);color:var(--brand-dark)}.detail-zalo:hover{background:var(--brand-soft);color:var(--brand-dark)}.detail-advice{margin-top:14px;color:var(--muted);font-size:.76rem;text-align:center}.detail-advice i{color:var(--brand)}
.related-products{padding-top:52px}.related-products>span{color:var(--brand);font-size:.78rem;font-weight:800;text-transform:uppercase}.related-products>h2{margin:5px 0 24px;font-size:clamp(1.55rem,3vw,2.2rem);font-weight:820}.detail-empty{min-height:58vh}.detail-empty>div>i{display:block;color:var(--brand);font-size:4rem}.detail-empty h1{font-weight:820}.detail-empty p{color:var(--muted)}
@media(max-width:991.98px){.detail-gallery{border-right:0;border-bottom:1px solid #e8f0ea}}@media(max-width:575.98px){.detail-page{padding-top:18px}.detail-card{border-radius:20px}.detail-gallery,.detail-summary{padding:18px}.detail-main-media{border-radius:16px}.detail-benefits,.detail-actions{grid-template-columns:1fr}.detail-breadcrumb span{max-width:45vw}}
