body{padding-bottom:60px;}

/* ─── Body Section ─── */
.idx-body{
  padding:28px 0 0;
  background:var(--bg);
  overflow:hidden;
}
.idx-categories{
  padding:0 0 80px;
  background:var(--bg);
  overflow:hidden;
}
@media(min-width:768px){
  .idx-body{padding:36px 0 0;}
  .idx-categories{padding:0 0 100px;}
}
@media(min-width:1024px){
  .idx-body{padding:40px 0 0;}
  .idx-categories{padding:0 0 120px;}
}

/* ─── Index Layout ─── */
#headerPlaceholder{height:180px;}
.idx-closing-wrap{padding-top:4px;margin-bottom:32px;}
.idx-trending-wrap{padding-bottom:48px;}
.idx-empty-state{text-align:center;padding:40px 0;color:var(--muted);}
.dark-section .section-header{margin-bottom:24px;}
.dark-section .section-header h2{color:#fff;}
.dark-section .section-header .sub{color:rgba(255,255,255,.45);}

/* ─── Section Header ─── */
/* ─── Section Header (index overrides) ─── */
.section-header .sub .tooltip-wrap{display:inline-flex;vertical-align:middle;}
.section-header .sub .tooltip-trigger{
  padding:0;display:inline-flex;align-items:center;cursor:pointer;opacity:.5;transition:opacity .2s;
}
.section-header .sub .tooltip-trigger:hover,
.section-header .sub .tooltip-wrap.active .tooltip-trigger{opacity:.9;}
.section-header .sub .tooltip-box{
  left:0;right:auto;transform:none;
  width:220px;padding:10px 14px;z-index:100;
  white-space:normal;word-break:keep-all;line-height:1.6;
}
.section-header .sub .tooltip-box::before{display:none;}
.section-header .sub .tooltip-wrap.active .tooltip-box{opacity:1;pointer-events:auto;}
.section-header .more{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.75rem;font-weight:500;color:var(--muted);
  padding:6px 14px;border-radius:9999px;
  border:1px solid var(--border);background:var(--card);
  transition:all .2s;white-space:nowrap;flex-shrink:0;text-decoration:none;
}
.section-header .more:hover{color:var(--fg);border-color:var(--fg);background:#fff;}
.section-header .more svg{width:12px;height:12px;transition:transform .2s;}
.section-header .more:hover svg{transform:translateX(2px);}

/* ─── Section Mini ─── */
.section-mini{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:20px;
}
.section-mini h2{
  font-size:1rem;font-weight:700;letter-spacing:-.02em;
  display:flex;align-items:center;gap:8px;
  padding-left:14px;position:relative;
}
.section-mini h2::before{
  content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:3px;height:14px;border-radius:2px;background:var(--accent);
}
.section-mini .more{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.75rem;font-weight:500;color:var(--muted);
  padding:5px 12px;border-radius:9999px;
  border:1px solid var(--border);background:var(--card);
  transition:all .2s;text-decoration:none;
}
.section-mini .more:hover{color:var(--fg);border-color:var(--fg);background:#fff;}
.section-mini .more svg{width:12px;height:12px;transition:transform .2s;}
.section-mini .more:hover svg{transform:translateX(2px);}

/* ─── Closing Today Banner ─── */
.closing-banner{
  display:flex;align-items:center;gap:12px;
  padding:14px 18px;border-radius:14px;
  background:linear-gradient(135deg,#E8453C 0%,#F0675F 100%);
  color:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s;
  text-decoration:none;
}
.closing-banner:hover{
  transform:translateY(-1px);box-shadow:0 6px 20px rgba(232,69,60,.3);
}
.closing-banner-timer{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:8px;
  background:rgba(255,255,255,.22);font-size:.8125rem;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
  flex-shrink:0;white-space:nowrap;
}
.closing-banner-timer svg{width:14px;height:14px;flex-shrink:0;}
.closing-banner-text{
  font-size:.9375rem;font-weight:600;letter-spacing:-.01em;
  white-space:nowrap;flex-shrink:0;
}
.closing-banner-right{
  display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0;
}
.closing-banner-thumbs{display:flex;align-items:center;}
.closing-banner-thumbs img{
  width:36px;height:36px;border-radius:50%;object-fit:cover;
  border:2px solid rgba(255,255,255,.7);
  margin-left:-10px;position:relative;
  box-shadow:-2px 0 4px rgba(0,0,0,.15);
}
.closing-banner-thumbs img:nth-child(1){margin-left:0;z-index:3;}
.closing-banner-thumbs img:nth-child(2){z-index:2;}
.closing-banner-thumbs img:nth-child(3){z-index:1;}
.closing-banner-arrow{
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:rgba(255,255,255,.2);flex-shrink:0;
}
.closing-banner-arrow svg{width:14px;height:14px;}

/* ─── Card Swiper (shared for trending + category) ─── */
.card-swiper{overflow:hidden;}
.card-swiper .swiper-slide{width:160px;height:auto;}
.card-swiper .category-item-card{height:100%;}
.card-swiper .category-card-body{flex:1;}

/* ─── Upcoming Section (dark) ─── */
.dark-section{background:var(--fg);color:#fff;padding:56px 0;overflow:hidden;}
@media(min-width:768px){.dark-section{padding:80px 0;}}

.upcoming-swiper-v2{overflow:hidden;}
.upcoming-swiper-v2 .swiper-slide{width:320px;height:auto;}

.upcoming-card-v2{
  display:flex;gap:14px;padding:16px;
  background:rgba(255,255,255,.04);border-radius:12px;height:100%;
  transition:background .2s;
}
.upcoming-card-v2:hover{background:rgba(255,255,255,.07);}
.upcoming-card-v2 .upcoming-thumb{
  width:90px;aspect-ratio:3/4;border-radius:10px;overflow:hidden;
  flex-shrink:0;position:relative;background:rgba(255,255,255,.05);
}
.upcoming-card-v2 .upcoming-thumb img{
  width:100%;height:100%;object-fit:cover;transition:transform .4s;
}
.upcoming-card-v2:hover .upcoming-thumb img{transform:scale(1.05);}
.upcoming-card-v2 .upcoming-social{
  position:absolute;bottom:6px;left:6px;
  display:inline-flex;align-items:center;gap:4px;
  color:#fff;font-size:.6875rem;font-weight:600;
  text-shadow:0 1px 2px rgba(0,0,0,.5);
}
.upcoming-card-v2 .upcoming-social svg{width:10px;height:10px;}
.upcoming-card-v2 .upcoming-info{min-width:0;flex:1;display:flex;flex-direction:column;gap:6px;}
.upcoming-card-v2 .upcoming-handle{font-size:.6875rem;color:rgba(255,255,255,.65);}
.upcoming-card-v2 .upcoming-title{
  font-size:.8125rem;font-weight:500;color:rgba(255,255,255,.9);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.upcoming-card-v2 .upcoming-meta{margin-top:auto;display:flex;flex-direction:column;gap:8px;}
.upcoming-card-v2 .upcoming-alert-num{font-size:.75rem;font-weight:700;color:#4DD0E1;}
.upcoming-card-v2 .upcoming-notify-btn{
  width:100%;padding:8px;font-size:.6875rem;font-weight:600;
  color:#4DD0E1;background:transparent;
  border:1px solid rgba(77,208,225,.4);border-radius:6px;
  cursor:pointer;transition:all .2s;
}
.upcoming-card-v2 .upcoming-notify-btn:hover{
  background:rgba(77,208,225,.1);border-color:rgba(77,208,225,.7);
}

/* ─── Category Section ─── */
.category-section{padding-top:48px;}
.category-block{margin-bottom:36px;}
.category-block:last-child{margin-bottom:0;}
.category-block .section-mini{margin-bottom:16px;}
.category-block .section-mini h2{font-size:1rem;font-weight:600;}


/* ─── Responsive ─── */
@media(max-width:480px){
  .card-swiper .swiper-slide{width:155px;}
  .closing-banner{padding:12px 14px;gap:8px;flex-wrap:wrap;}
  .closing-banner-text{font-size:.8125rem;}
  .closing-banner-right{display:none;}
  .upcoming-swiper-v2 .swiper-slide{width:280px;}
}
@media(min-width:768px){
  .card-swiper .swiper-slide{width:220px;}
  .upcoming-swiper-v2 .swiper-slide{width:360px;}
  .upcoming-card-v2 .upcoming-thumb{width:100px;}
}
@media(min-width:1024px){
  body{padding-bottom:0;}
  .section-header h2{font-size:1.25rem;}
  .card-swiper .swiper-slide{width:260px;}
  .upcoming-swiper-v2 .swiper-slide{width:380px;}
  .dark-section{border-radius:20px;overflow:hidden;}
  .closing-banner{padding:16px 24px;border-radius:16px;}
}
@media(min-width:1400px){
  .card-swiper .swiper-slide{width:280px;}
}
