/* MovieLinkBD V76.64 — unified public canvas, categories and footer flow */
:root{
  --mlbd-flow-canvas:#3a3f44;
  --mlbd-flow-surface:#272b30;
  --mlbd-flow-surface-soft:#30343a;
  --mlbd-flow-button:#414750;
  --mlbd-flow-button-hover:#4b525c;
  --mlbd-flow-text:#e6eaf2;
  --mlbd-flow-muted:rgba(255,255,255,.66);
  --mlbd-flow-cyan:#00eaff;
}
html,body,#page-top{
  min-height:100%;
  background:var(--mlbd-flow-canvas)!important;
}
body{overflow-x:hidden}
#wrapper,
#wrapper #content-wrapper,
#wrapper #content-wrapper #content{
  background:var(--mlbd-flow-canvas)!important;
}
.navbar.bg-white{background:transparent!important}

/* Keep public content on one visual canvas instead of stacked background bands. */
.mlbd-origin-details-shell,
.mlbd-origin-details-panel{
  background:transparent!important;
}

/* =========================================================
   V78.30 — MovieLinkBD footer.
   Built on the site's own card (black, 9px radius, the .movie-card /
   .mlbd-upcoming-card shadow) sitting on the #3a3f44 canvas, with the same
   green rule and brand red/yellow as the header and the page headings.
   Intentionally small: the header chips, the CTA strip and the
   Genres/Languages grid above it already carry every category link, so the
   footer does not repeat them.
   ========================================================= */
footer.mlbd-site-footer{
  position:relative;
  width:var(--mlbd-canvas,min(1180px,calc(100% - 16px)));
  margin:26px auto 0;
  padding:0 0 22px!important;
  background:transparent!important;
  color:var(--mlbd-flow-muted)!important;
  text-align:left;
}
footer.mlbd-site-footer::before{
  content:"";
  display:block;
  height:2px;
  margin-bottom:18px;
  background:#1cc88a;
  border-radius:2px;
}
footer.mlbd-site-footer .container{max-width:none!important;padding:0!important;text-align:left}
footer.mlbd-site-footer a{transition:color .16s ease,transform .16s ease,background .16s ease,box-shadow .16s ease;text-decoration:none}

/* ---- panel: the Genres/Languages chip card ----
   Exactly .mlbd-chip's surface — #40454b on a #565d68 border at 9px — scaled up
   to a panel, so the footer is the same material as the chip grid right above it. */
.mlbd-foot-panel{
  position:relative;
  overflow:hidden;
  border:0;
  border-radius:9px;
  background:#40454b;
  box-shadow:0 5px 14px rgba(0,0,0,.22);
  padding:20px 22px 16px;
}

/* ---- brand row ---- */
.mlbd-foot-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px 24px;
  flex-wrap:wrap;
}
.mlbd-foot-brandcol{flex:1 1 320px;min-width:0}
.mlbd-foot-brandmark{
  display:inline-block;
  font-size:clamp(22px,3.2vw,30px);
  font-weight:900;
  letter-spacing:1px;
  line-height:1;
  color:#ff4d4d!important;
  text-shadow:0 3px 10px rgba(0,0,0,.45);
}
footer.mlbd-site-footer .mlbd-foot-brandmark:hover{color:#ff6060!important}
.mlbd-foot-tag{
  margin:9px 0 0;
  color:rgba(255,255,255,.80);
  font-size:12.5px;
  line-height:1.65;
  font-weight:500;
  max-width:56ch;
}
.mlbd-foot-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:11px;
  padding:5px 11px;
  border:0;
  border-radius:999px;
  background:rgba(28,200,138,.20);
  color:#1cc88a!important;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.3px;
}

/* ---- social ---- */
.mlbd-foot-social{display:flex;flex-wrap:wrap;gap:8px;flex:0 0 auto;padding-top:4px}
.mlbd-foot-social a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 14px;
  border-radius:9px;
  border:0;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.2px;
  color:#fff!important;
}
.mlbd-foot-social .fb{background:#1e40af}
footer.mlbd-site-footer .mlbd-foot-social .fb:hover{background:#2a52c9;color:#fff!important}
.mlbd-foot-social .tg{background:#0284c7}
footer.mlbd-site-footer .mlbd-foot-social .tg:hover{background:#0ea5e9;color:#fff!important}
.mlbd-foot-social svg{width:15px;height:15px;flex:0 0 auto;fill:currentColor}

/* ---- one inline link row (chip surface, same as .mlbd-chip) ---- */
.mlbd-foot-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
  padding-top:0;
}
.mlbd-foot-links a{
  padding:7px 13px;
  border-radius:9px;
  background:#343940;
  border:0;
  box-shadow:0 3px 10px rgba(0,0,0,.18);
  color:rgba(255,255,255,.88)!important;
  font-size:12.5px;
  font-weight:700;
  white-space:nowrap;
}
footer.mlbd-site-footer .mlbd-foot-links a:hover{
  background:#2b3036;
  color:#facc15!important;
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0,0,0,.26);
}

/* ---- bottom bar ---- */
.mlbd-foot-bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 14px;
  margin-top:18px;
  padding-top:0;
}
.mlbd-foot-copy{color:rgba(255,255,255,.70);font-size:12px;font-weight:600}
.mlbd-foot-copy b{color:#facc15;font-weight:800}
.mlbd-foot-official{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11.5px;font-weight:700}
.mlbd-foot-official a{color:rgba(255,255,255,.72)!important}
footer.mlbd-site-footer .mlbd-foot-official a:hover{color:var(--mlbd-flow-cyan)!important}

@media(max-width:640px){
  .mlbd-foot-top{gap:14px}
  .mlbd-foot-social{width:100%;padding-top:0}
  .mlbd-foot-social a{flex:1 1 0;justify-content:center;min-width:0}
}
@media(max-width:560px){
  footer.mlbd-site-footer{margin-top:20px;padding-bottom:16px!important}
  footer.mlbd-site-footer::before{margin-bottom:15px}
  .mlbd-foot-panel{padding:16px 14px 13px}
  .mlbd-foot-brandmark{font-size:24px}
  .mlbd-foot-tag{font-size:12px;line-height:1.55;margin-top:7px}
  .mlbd-foot-links{gap:7px;margin-top:14px;padding-top:13px}
  .mlbd-foot-links a{font-size:12px;padding:6px 11px}
  .mlbd-foot-bottom{justify-content:center;text-align:center}
  .mlbd-foot-official{justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  footer.mlbd-site-footer a:hover{transform:none}
}

/* V76.64 — restore the original dark `bg-white` card language. */
.bg-white{background-color:#272b30!important}
.mlbd-origin-details .bg-white,
.cr-shell .bg-white,
.mlbd-request-cta.bg-white{background-color:#272b30!important}
