/* assets/css/site.css */
/* ========== Root Variables & Reset ========== */
:root{
  --nv-bg: #0b0c10;
  --nv-bg-soft: #111827;
  --nv-panel: #ffffff;
  --nv-panel-soft: #f3f4f6;
  --nv-text: #111827;
  --nv-muted: #6b7280;
  --nv-brand: #dc2626;
  --nv-brand-soft: #dbeafe;
  --nv-danger: #dc2626;
  --nv-border: #e5e7eb;
  --nv-radius: 14px;
  --nv-radius-sm: 10px;
  --nv-shadow: 0 10px 30px rgba(15,23,42,.12);
  --nv-max-width: 1200px;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  padding:0;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  font-size:15px;
  line-height:1.6;
  color:var(--nv-text);
  background:var(--nv-panel-soft);
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a{
  color:inherit;
  text-decoration:none;
}
a:hover{
  color:var(--nv-brand);
}

::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:999px}
::-webkit-scrollbar-track{background:#e5e7eb}

/* ========== Common Helpers ========== */
.wrap{
  max-width:var(--nv-max-width);
  margin:0 auto;
  padding:0 12px;
}

.section-title{
  margin:0;
  font-size:1.05rem;
  font-weight:700;
  color:#111827;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
}
.section-title::before{
  content:'';
  display:inline-block;
  width:3px;
  height:1.2rem;
  border-radius:999px;
  background:var(--nv-brand);
}

.muted{
  color:var(--nv-muted);
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.35rem;
  padding:.45rem .9rem;
  border-radius:999px;
  border:1px solid var(--nv-border);
  background:var(--nv-panel-soft);
  color:var(--nv-text);
  font-size:.85rem;
  cursor:pointer;
}
.btn.primary{
  background:var(--nv-brand);
  border-color:var(--nv-brand);
  color:#fff;
}
.btn.icon{
  padding:.35rem;
  width:32px;
  height:32px;
  border-radius:999px;
}
.btn:hover{
  filter:brightness(0.97);
}

/* Card (generic) */
.card{
  background:var(--nv-panel);
  border-radius:var(--nv-radius);
  border:1px solid var(--nv-border);
  box-shadow:var(--nv-shadow);
  overflow:hidden;
}
.pad{ padding:.8rem .9rem; }

/* ========== Top strip (date) ========== */
.h-top{
  background:#fef2f2;
  border-bottom:1px solid #fee2e2;
  font-size:.86rem;
  color:#b91c1c;
}
.h-top .inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  padding:.25rem 0;
}
.h-top small{font-size:.8rem;}

/* ========== Header with centered logo ========== */
.nv-header{
  background:#ffffff;
  border-bottom:1px solid #f3f4f6;
}
.nv-header-inner{
  display:grid;
  grid-template-columns: 1.1fr auto 1.1fr;
  align-items:center;
  gap:12px;
  padding:10px 0 8px;
}
.nv-header-left{
  font-size:.86rem;
  color:var(--nv-muted);
}
.nv-header-logo{
  text-align:center;
}
.nv-header-logo img{
  max-height:110px;
  margin:0 auto;
}
.nv-header-right{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:.45rem;
}
.nv-header-right .social{
  display:inline-flex;
  align-items:center;
  gap:.25rem;
}
.nv-header-right .social a{
  width:28px;
  height:28px;
  border-radius:999px;
  background:#f3f4ff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
}
.nv-header-right .social a:hover{
  background:#e0ecff;
}

@media (max-width: 768px){
  .nv-header-inner{
    grid-template-columns: 1fr;
    text-align:center;
  }
  .nv-header-left{order:3;}
  .nv-header-right{justify-content:center;order:2;}
  .nv-header-logo{order:1;}
}

/* ========== Desktop Nav ========== */
.nv-nav-row{
  background:#b91c1c;
  color:#fff;
}
.nv-nav{
  height:44px;
  display:flex;
  align-items:center;
  gap:10px;
}
.nv-nav-toggle{
  display:none;
  border:none;
  background:transparent;
  color:#fff;
  font-size:1.4rem;
  cursor:pointer;
}
.nv-nav-list{
  display:flex;
  align-items:center;
  gap:4px;
  list-style:none;
  padding:0;
  margin:0;
  flex:1 1 auto;
  overflow-x:auto;
}
.nv-nav-item > a,
.nv-nav-more-toggle{
  display:inline-flex;
  align-items:center;
  padding:.35rem .9rem;
  border-radius:999px;
  white-space:nowrap;
  font-size:.9rem;
  border:1px solid transparent;
}
.nv-nav-item.active > a{
  background:#fff;
  color:#b91c1c;
  font-weight:600;
}
.nv-nav-item > a:hover,
.nv-nav-more-toggle:hover{
  background:rgba(255,255,255,.12);
}
.nv-nav-more{
  position:relative;
}
.nv-nav-more-toggle{
  cursor:pointer;
}
.nv-nav-actions{
  display:flex;
  align-items:center;
  gap:.3rem;
}

/* Mega dropdown */
.nv-mega{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  background:#ffffff;
  color:var(--nv-text);
  border-radius:14px;
  box-shadow:0 18px 40px rgba(15,23,42,.18);
  padding:14px 16px 12px;
  min-width:360px;
  max-width:520px;
  z-index:40;
  display:none;
}
.nv-mega.open{display:block;}
.nv-mega-title{
  font-size:.9rem;
  font-weight:600;
  margin-bottom:6px;
  color:var(--nv-muted);
}
.nv-mega-grid{
  display:grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap:4px 10px;
}
.nv-mega-grid a{
  font-size:.86rem;
  border-radius:999px;
  padding:.2rem .4rem;
}
.nv-mega-grid a:hover{
  background:#f3f4f6;
  color:var(--nv-text);
}

@media (max-width: 960px){
  .nv-nav-row{display:none;} /* desktop nav hidden on mobile */
}

/* ========== News Ticker ========== */
.nv-ticker{
  background:#111827;
  color:#e5e7eb;
  border-bottom:1px solid #b91c1c;
  font-size:.88rem;
}
.nv-ticker .inner{
  display:flex;
  align-items:center;
  gap:.75rem;
}
.nv-ticker-label{
  display:flex;
  align-items:center;
  gap:.45rem;
  padding:.4rem 0;
  font-weight:600;
  white-space:nowrap;
}
.nv-ticker-label .dot{
  width:.55rem;
  height:.55rem;
  border-radius:999px;
  background:#f97316;
}
.nv-ticker-viewport{
  flex:1 1 auto;
  overflow:hidden;
  position:relative;
}
.nv-ticker-track{
  display:flex;
  gap:1.8rem;
  white-space:nowrap;
  will-change:transform;
  padding:.4rem 0;
  animation: nvTickerScroll 60000ms linear infinite;
}
.nv-ticker-item{
  display:inline-flex;
  align-items:center;
}
.nv-ticker-item .bullet{
  width:.42rem;
  height:.42rem;
  border-radius:999px;
  background:#fecaca;
  margin-right:.38rem;
}
.nv-ticker-item a{
  color:inherit;
}
.nv-ticker-item a:hover{
  color:#bfdbfe;
}
.nv-ticker-speed{
  font-size:.8rem;
  color:#94a3b8;
}

/* Ticker animation */
@keyframes nvTickerScroll{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-50%); }
}

/* ========== Mobile Bar & Drawer ========== */
.mobile-bar{
  display:none;
}
@media (max-width: 960px){
  .mobile-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:.45rem 12px;
    background:#111827;
    color:#e5e7eb;
    position:sticky;
    top:0;
    z-index:50;
  }
  .mobile-bar .hamb{
    font-size:1.35rem;
    cursor:pointer;
  }
}

/* Drawer */
.drawer-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease-out;
  z-index:60;
}
.drawer-backdrop.open{
  opacity:1;
  pointer-events:auto;
}
.drawer{
  position:fixed;
  inset:0 auto 0 0;
  width:260px;
  max-width:82%;
  background:#0b1120;
  color:#e5e7eb;
  transform:translateX(-100%);
  transition:transform .18s ease-out;
  z-index:70;
  display:flex;
  flex-direction:column;
}
.drawer.open{
  transform:translateX(0);
}
.drawer header{
  padding:.8rem .9rem;
  border-bottom:1px solid #1f2937;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.drawer .btn{
  font-size:.8rem;
}
.drawer a{
  padding:.55rem .9rem;
  border-bottom:1px solid #b91c1c;
  font-size:.9rem;
}
.drawer a:hover{
  background:#b91c1c;
}

/* ========== Search Overlay ========== */
.searchbox{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.6);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:80;
}
.searchbox.open{
  display:flex;
}
.searchbox__inner{
  background:#b91c1c;
  border-radius:16px;
  padding:18px 18px 16px;
  max-width:520px;
  width:100%;
  box-shadow:0 22px 50px rgba(0,0,0,.65);
}
.searchbox__form{
  display:flex;
  gap:8px;
}
.searchbox__input{
  flex:1;
  padding:.65rem .85rem;
  border-radius:999px;
  border:none;
  font-size:.95rem;
}
.searchbox__form .btn{
  border-radius:999px;
}

/* ========== Footer (generic) ========== */
.footer-wrap{
  border-top:1px solid #e5e7eb;
  margin-top:10px;
  background:#0b1120;
  color:#9ca3af;
}
.footer{
  max-width:var(--nv-max-width);
  margin:0 auto;
  padding:10px 12px 14px;
  font-size:.82rem;
}


/* wrap – ছোট স্ক্রিনে padding নরমাল, বড় স্ক্রিনে একটু বেশি চাইলে আলাদা করতে পারো */
.wrap{
  max-width:var(--nv-max-width);
  margin:0 auto;
  padding:0 12px;
}
@media (min-width: 1024px){
  .wrap{
    padding:0 16px;
  }
}



/* ===== Category hero header ===== */
.nv-cat-hero{
  margin-bottom:1rem;
  padding:1rem 1.2rem;
  border-radius:14px;
  border:1px solid #e5e7eb;
  background:radial-gradient(circle at top left,#dbeafe,transparent 55%), #f9fafb;
  display:flex;
  justify-content:space-between;
  gap:.75rem;
  align-items:center;
}
.nv-cat-hero h1{
  margin:.1rem 0 .25rem;
  font-size:1.2rem;
  font-weight:700;
}
.nv-cat-hero p{
  margin:0;
  font-size:.9rem;
  color:#6b7280;
}
.nv-cat-chip{
  display:inline-flex;
  align-items:center;
  padding:.16rem .6rem;
  border-radius:999px;
  background:#1d4ed8;
  color:#fff;
  font-size:.78rem;
}
.nv-cat-meta-box{
  font-size:.85rem;
  color:#4b5563;
  background:#ffffff;
  border-radius:12px;
  padding:.4rem .7rem;
  display:flex;
  flex-direction:column;
  gap:.15rem;
  box-shadow:0 8px 18px rgba(148,163,184,.25);
}
.nv-cat-meta-box strong{color:#111827;}

@media (max-width:768px){
  .nv-cat-hero{
    flex-direction:column;
    align-items:flex-start;
  }
  .nv-cat-meta-box{
    flex-direction:row;
    flex-wrap:wrap;
    gap:.4rem .8rem;
  }
}

/* ===== Toolbar + chips ===== */
.nv-cat-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:.6rem;
  font-size:.85rem;
  color:#6b7280;
}
.nv-chip{
  border:none;
  outline:none;
  background:#e5e7eb;
  color:#374151;
  border-radius:999px;
  padding:.2rem .7rem;
  margin-left:.25rem;
  cursor:pointer;
  font-size:.8rem;
}
.nv-chip.active{
  background:#2563eb;
  color:#fff;
}

/* ===== Card hover + date badge ===== */
.nv-card-soft{
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.nv-card-soft:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(15,23,42,.16);
  border-color:#d1d5db;
}

.nv-badge-date{
  display:inline-flex;
  align-items:center;
  padding:.08rem .45rem;
  border-radius:999px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:.78rem;
}

/* ===== Grid → List view toggle ===== */
#news-container.nv-list-view{
  display:flex;
  flex-direction:column;
}
#news-container.nv-list-view > article{
  display:grid;
  grid-template-columns:140px minmax(0,1fr);
  gap:.75rem;
}
#news-container.nv-list-view > article img{
  height:120px;
}

@media (max-width:640px){
  /* মোবাইলে সবসময় এক কলাম */
  #news-container{
    grid-template-columns:1fr !important;
  }
  #news-container.nv-list-view > article{
    grid-template-columns:1fr;
  }
  #news-container.nv-list-view > article img{
    height:200px;
  }
}


/* ================= CATEGORY PAGE ================= */

.nv-cat-page{
  padding-top:1rem;
}

/* breadcrumb */
.nv-cat-breadcrumb{
  margin-bottom:.4rem;
  font-size:.85rem;
  color:var(--nv-muted);
}
.nv-cat-breadcrumb ol{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  gap:.35rem;
  align-items:center;
}
.nv-cat-breadcrumb a{
  text-decoration:none;
}

/* hero */
.nv-cat-hero{
  margin-bottom:1rem;
  padding:1rem 1.2rem;
  border-radius:var(--nv-radius);
  border:1px solid var(--nv-border);
  background:
    radial-gradient(circle at top left, var(--nv-brand-soft), transparent 55%),
    #f9fafb;
  display:flex;
  justify-content:space-between;
  gap:.9rem;
  align-items:flex-start;
}
.nv-cat-hero h1{
  margin:.15rem 0 .25rem;
  font-size:1.15rem;
  font-weight:700;
  color:#111827;
}
.nv-cat-hero p{
  margin:0;
  font-size:.9rem;
  color:var(--nv-muted);
}
.nv-cat-chip{
  display:inline-flex;
  align-items:center;
  padding:.14rem .6rem;
  border-radius:999px;
  background:var(--nv-brand);
  color:#fff;
  font-size:.78rem;
}

/* hero meta box + view toggle */
.nv-cat-meta-box{
  background:#ffffff;
  border-radius:12px;
  padding:.55rem .75rem;
  box-shadow:0 10px 24px rgba(148,163,184,.25);
  font-size:.82rem;
  color:#4b5563;
  display:flex;
  flex-direction:column;
  gap:.25rem;
  min-width:180px;
}
.nv-cat-meta-box strong{color:#111827;}

.nv-cat-view-toggle{
  display:flex;
  gap:.25rem;
}

/* chips (reuse style) */
.nv-chip{
  border:none;
  outline:none;
  background:#e5e7eb;
  color:#374151;
  border-radius:999px;
  padding:.2rem .7rem;
  cursor:pointer;
  font-size:.8rem;
}
.nv-chip.active{
  background:var(--nv-brand);
  color:#fff;
}

/* main grid for cards */
.nv-cat-section-main{
  margin-top:.5rem;
}
.nv-cat-news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:1rem;
}

/* card look (same as home cards) */
.nv-cat-card{
  overflow:hidden;
}
.nv-cat-card-img{
  width:100%;
  height:170px;
  object-fit:cover;
  display:block;
}
.nv-cat-card-title{
  font-size:1rem;
  font-weight:600;
  margin:0 0 .25rem;
}
.nv-cat-card-meta{
  margin-bottom:.3rem;
}
.nv-cat-card-excerpt{
  margin:0;
  font-size:.9rem;
  color:#4b5563;
}

/* date badge same as home */
.nv-badge-date{
  display:inline-flex;
  align-items:center;
  padding:.08rem .45rem;
  border-radius:999px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:.78rem;
}

/* load more */
.nv-cat-loadmore-wrap{
  text-align:center;
  margin-top:1rem;
}

/* list view mode */
.nv-list-view{
  display:flex !important;
  flex-direction:column;
}
.nv-list-view .nv-cat-card{
  display:grid;
  grid-template-columns:140px minmax(0,1fr);
  gap:.8rem;
}
.nv-list-view .nv-cat-card-img{
  height:120px;
}

/* sidebar spacing */
.nv-cat-sidebar{
  min-width:0;
}

@media (max-width:960px){
  .nv-cat-hero{
    flex-direction:column;
  }
  .nv-cat-meta-box{
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
  }
}

@media (max-width:640px){
  .nv-cat-news-grid{
    grid-template-columns:1fr;
  }
  .nv-list-view .nv-cat-card{
    grid-template-columns:1fr;
  }
  .nv-list-view .nv-cat-card-img{
    height:200px;
  }
}