/* ONBE Ưu đãi & Khuyến mãi. Mobile first; reuses .pr-search, .col-* from products.css. */

.of-hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#2F4BE0 0%,#6C3FE0 55%,#9B4DE8 100%);color:#fff;border-radius:0 0 24px 24px}
.of-hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr);padding-top:14px;padding-bottom:18px;min-height:220px}
.of-hero .crumbs{display:none}
.of-hero-text{position:relative;z-index:1;max-width:64%}
.of-title{font-size:30px;line-height:1.12;font-weight:700;letter-spacing:-.02em;text-shadow:0 2px 10px rgba(0,0,0,.18)}
.of-sub{margin-top:8px;font-size:14px;line-height:1.5;opacity:.95}
.of-gift{position:absolute;right:-6px;top:6px;width:44%;max-width:260px;height:auto}
.of-hero-sm .of-hero-inner{min-height:0}
.of-hero-sm .of-hero-text{max-width:100%}
.of-search{margin-top:auto;padding-top:16px}

/* Category chips: scroll sideways on phones */
.of-cats{margin-top:16px}
.of-cats ul{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px}
.of-cats ul::-webkit-scrollbar{display:none}
.of-cats li{flex:0 0 auto}
.of-cats a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:84px;height:84px;border-radius:16px;background:color-mix(in srgb,var(--c) 9%,#fff);font-size:13px;font-weight:600;color:var(--ink)}
.of-cats a .ic{width:30px;height:30px;color:var(--c);stroke-width:1.8}
.of-cats a[aria-current="page"]{outline:2px solid var(--blue);background:var(--blue-50);color:var(--blue-d)}

.of-sec{margin-top:26px}
.of-fire{background:#FFEDE5;color:#EA580C}
.of-countdown{display:inline-flex;align-items:center;gap:6px;flex:none;padding:6px 10px;border-radius:999px;background:#FEECEB;color:#B42318;font-size:12.5px;font-weight:600}
.of-countdown .ic{width:16px;height:16px}
.of-countdown b{font-variant-numeric:tabular-nums}

/* Featured deals: horizontal scroll on phones */
.of-grid-deal{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.of-grid-deal::-webkit-scrollbar{display:none}
.of-card-deal{scroll-snap-align:start}
.of-card-deal .of-media{aspect-ratio:16/8}
.of-card-deal .card-body{padding-right:52px}
.of-go{position:absolute;right:12px;bottom:16px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#FEECEB;color:var(--red-text)}
.of-go .ic{width:16px;height:16px}

/* Offer grid */
.of-grid-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.of-media{aspect-ratio:16/9;background:var(--soft)}
.of-media img,.of-media .ph{width:100%;height:100%;object-fit:cover}
.of-badge{right:10px;top:10px;padding:4px 10px;font-size:13px}
.of-meta{display:flex;flex-wrap:wrap;gap:4px 12px}
.of-cta{margin-top:8px;align-self:flex-start;padding:7px 14px}
.of-best{color:var(--red-text)!important;font-weight:600}
.of-cols .col-img{aspect-ratio:16/9}

/* Detail */
.of-ended{display:flex;flex-direction:column;gap:2px;margin:12px 0;padding:12px 14px;border-radius:12px;background:#F2F4F7;color:#344054;font-size:14px}
.of-ended b{color:var(--ink)}
.of-st-da-ket-thuc{background:#FEECEB}
.of-st-sap-dien-ra{background:#EEF4FF}
.of-detail{display:grid;gap:18px;margin-top:14px}
.of-detail-media{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:16/9}
.of-detail-media img,.of-detail-media .ph{width:100%;height:100%;object-fit:cover}
.of-detail-info{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.of-lead{font-size:16px;color:#344054}
.of-facts{margin:4px 0}
.of-content{margin-top:20px}

@media (min-width:640px){
	.of-grid-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.of-grid-deal{grid-auto-columns:46%}
}
@media (min-width:768px){
	.of-hero{border-radius:0}
	.of-hero-inner{min-height:290px;padding-top:16px;padding-bottom:28px}
	.of-hero-sm .of-hero-inner{min-height:0}
	.of-hero .crumbs{display:block;margin-bottom:10px}
	.of-hero .crumbs ol{color:rgba(255,255,255,.85)}
	.of-hero .crumbs a{color:#fff}
	.of-title{font-size:42px}
	.of-sub{font-size:16px;max-width:32em}
	.of-gift{right:4%;top:16px;width:300px;max-width:none}
	.of-search{max-width:640px}
	.of-cats ul{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible}
	.of-cats a{width:auto}
	.of-grid-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
	.of-grid-deal{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
	.of-cols{grid-template-columns:repeat(3,minmax(0,1fr))}
	.of-detail{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start;gap:28px}
}
@media (min-width:1100px){
	.of-grid-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
	.of-grid-deal{grid-template-columns:repeat(4,minmax(0,1fr))}
	.of-grid-deal:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
	.of-grid-deal:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
}
.of-sec .sec-head{flex-wrap:wrap;row-gap:8px}
.of-sec .sec-title{flex:1 1 auto}