/* =========================
   GRID — картуудын хоорондын зайг шахсан layout
   ========================= */

.grid{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;

  /* Картын чинь өргөн 210px → түүнд тааруулж багана гаргана */
  grid-template-columns: repeat(auto-fit, 180px);
  justify-content: flex-start;

  column-gap: 10px;   /* хоорондын зай – хүсвэл 6px/10px болгож өөрчилж болно */
  row-gap:16px;
}

/* Жижиг дэлгэцүүд дээр баганы тоог өөрчилж өгье */

/* маш жижиг утас */
@media (max-width: 479px){
  .grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* жижиг/дунд утас */
@media (min-width: 480px) and (max-width: 767px){
  .grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* таблет – auto-fit дүрэм ажиллана (200px картуудыг шахаад байрлуулна) */
@media (min-width: 768px){
  .grid{
    grid-template-columns: repeat(auto-fit, 200px);
    justify-content: flex-start;
  }
}


/* =========================
   MAIN MENU – идэвхтэй төлөв
   ========================= */
.bs-header .bs-mainmenu{display:flex;align-items:center;gap:28px;}
.bs-header .bs-mainmenu .bs-navitem{
  display:inline-block; padding:6px 12px; border-radius:10px;
  color:#c9d1e3; text-decoration:none; font-weight:800; letter-spacing:.5px; font-size:26px;
}
.bs-header .bs-mainmenu .bs-navitem:hover,
.bs-header .bs-mainmenu .bs-navitem.is-active{
  background:#E50914; color:#fff; box-shadow:0 0 0 1px #9b0b12 inset;
}
.home  .bs-header .bs-mainmenu .bs-navitem--home,
.blog  .bs-header .bs-mainmenu .bs-navitem--home,
.category-eu   .bs-header .bs-mainmenu .bs-navitem--eu,
.category-asia .bs-header .bs-mainmenu .bs-navitem--asia{
  background:#E50914; color:#fff; box-shadow:0 0 0 1px #9b0b12 inset;
}


/* =========================
   CARD / POSTER
   ========================= */
.card{
  position:relative;
  background:transparent;
  border:0;
  width:200px;      /* thumbnail 20–30% жижигрүүлсэн хэмжээ */
  max-width:200px;
}
.card__link{ display:block; text-decoration:none; color:inherit }
.card .thumb{
  position:relative; background:#111;
  aspect-ratio:27/40;
  border-radius:16px; overflow:hidden;
  border:1px solid #24374a;
  box-shadow: 0 12px 60px rgba(0,0,0,1), 0 2px 10px rgba(0,0,0,1);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

/* subtle hover өсөлт */
.card__link:hover .thumb{
  transform: translateY(-2px);
  box-shadow: 0 16px 70px rgba(0,0,0,.7), 0 4px 14px rgba(0,0,0,1);
  border-color:#2f4962;
}

/* =========================
   BADGES — гялтганасан (glossy) + “shine” эффекттэй
   ========================= */
.badge{
  position:absolute; z-index:3;
  color:#fff; font-weight:800; letter-spacing:.2px;
  font-size:16px; line-height:1; padding:4px 9px;
  border-radius:9px;

  /* Glossy gradient + дотоод сүүдэр */
  background: linear-gradient(180deg, #ff3b45 0%, #E50914 55%, #b50710 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(0,0,0,.15),
    0 2px 8px rgba(0,0,0,.35);
  border:1px solid #9b0b12;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}


@keyframes bs-shine{
  0%   { transform:rotate(25deg) translateX(-160%); opacity:.0; }
  10%  { opacity:.55; }
  40%  { transform:rotate(25deg) translateX(130%); opacity:.0; }
  100% { transform:rotate(25deg) translateX(130%); opacity:.0; }
}

/* байрлал */
.badge--price{ top:10px; left:10px; }
.badge--mins { bottom:10px; right:10px; }

/* =========================
   CONTAINER + PAGINATION
   ========================= */
.bs-container{ max-width:1320px; margin:0 auto; padding:16px; }
.bs-pagination{ margin:18px 0; text-align:center; }
.bs-pagination .page-numbers{
  display:inline-block; padding:6px 10px; margin:0 4px;
  border:1px solid #223041; border-radius:8px; text-decoration:none; color:#e8eefb;
}
.bs-pagination .current{ background:#223041; }

/* =========================
   ADMIN debug overlay (хүсвэл устгаж болно)
   ========================= */
.dbg-meta{
  position:absolute; left:8px; bottom:8px; right:8px;
  max-height:60%; overflow:auto;
  background:rgba(0,0,0,.72); color:#9effa1;
  padding:6px; border-radius:6px; z-index:9;
  font: 11px/1.25 ui-monospace,Menlo,Consolas,monospace;
}
.dbg-meta div{ white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }