/* Small overrides + helper styles */
.mh-wrapper img{max-width:100%;height:auto}
.widget-box{margin:0 0 25px}
.widget-box .widget-title{font-size:18px;margin:0 0 10px}
.notice-bar{padding:10px 12px;border:1px solid #eee;background:#fafafa;border-radius:6px;margin:10px 0}
.admin-link{font-weight:bold}

/* Main content surface: light translucent like the original */
.entry-content{
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(2px);
  border-radius: 14px;
  padding: 18px 18px 22px;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}

/* Header banner + player polish */
.kmf-banner{margin:10px 0 0; border-radius:12px; overflow:hidden; box-shadow:0 12px 28px rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.18)}
.kmf-banner img{display:block; width:100%; height:auto}
.kmf-player .kmf-player-inner{border:1px solid rgba(255,255,255,.18); box-shadow:0 10px 22px rgba(0,0,0,.25)}

/* Friends slider (Vrienden van Station KMF) */
.friends-slider{position:relative;margin:10px 0 20px;border:1px solid rgba(0,0,0,.08);border-radius:10px;background:rgba(255,255,255,.7);padding:10px}
.friends-slider .fs-track{display:flex;gap:12px;overflow:auto;scroll-behavior:smooth;padding:6px 44px;scroll-snap-type:x mandatory}
.friends-slider .friend{flex:0 0 auto;display:flex;align-items:center;justify-content:center;min-width:140px;max-width:220px;height:92px;border-radius:10px;background:#fff;border:1px solid rgba(0,0,0,.06);scroll-snap-align:start}
.friends-slider .friend img{max-height:78px;max-width:200px;object-fit:contain}
.friends-slider .fs-btn{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:999px;border:1px solid rgba(0,0,0,.12);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1}
.friends-slider .fs-btn.prev{left:8px}
.friends-slider .fs-btn.next{right:8px}
.friends-slider.empty{padding:14px}
@media (max-width:720px){
  .friends-slider .fs-track{padding:6px 38px}
  .friends-slider .friend{min-width:120px;height:84px}
}

/* Friends page grid */
.friends-grid{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:14px;margin:10px 0 20px}
.friends-grid .friend-card{display:flex;align-items:center;justify-content:center;min-height:110px;border-radius:10px;background:rgba(255,255,255,.85);border:1px solid rgba(0,0,0,.08);padding:10px;transition:transform .12s ease}
.friends-grid .friend-card:hover{transform:translateY(-2px)}
.friends-grid .friend-card img{max-width:100%;max-height:92px;object-fit:contain}
@media (max-width:900px){
  .friends-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width:560px){
  .friends-grid{grid-template-columns:1fr}
}

/* White bar fix */
.mh-wrapper{padding-top:0 !important;}

/* ============ Responsive + Hamburger menu ============ */
.main-nav{position:relative}
.main-nav .nav-toggle{display:none;align-items:center;gap:10px;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.18);color:#fff;border-radius:10px;padding:10px 12px;cursor:pointer}
.main-nav .nav-toggle-icon{font-size:18px;line-height:1}
.main-nav .nav-toggle-text{font-weight:700;letter-spacing:.2px}

@media (max-width: 900px){
  /* container widths */
  .mh-container{width:100% !important;max-width:100% !important;padding:0 12px}

  /* banner + player spacing */
  .kmf-banner{margin-top:8px}
  .kmf-player .kmf-player-inner{padding:6px}

  /* hamburger */
  .main-nav .nav-toggle{display:flex}
  .main-nav ul.menu{display:none;margin-top:10px}
  .main-nav.is-open ul.menu{display:block}
  .main-nav ul.menu li{display:block;float:none !important}
  .main-nav ul.menu li a{display:block;padding:12px 14px;border-radius:10px}
  .main-nav ul.menu li a:hover{background:rgba(255,255,255,.08)}

  /* stack content + sidebar */
  .mh-content, .mh-sidebar{float:none !important;width:100% !important}
  .mh-sidebar{margin-top:18px}

  /* titles */
  .page-title{font-size:28px}
}

@media (max-width: 520px){
  .page-title{font-size:24px}
  .widget-box .widget-title{font-size:16px}
}



/* Sidebar widget polish */
.widget-box .textwidget{ text-align:center; }
.widget-box .textwidget img{ display:inline-block; vertical-align:middle; margin:6px 4px; max-width:100%; height:auto; }
.widget-box .textwidget a{ display:inline-block; }

/* Remove white bar / spacing above banner */
.mh-wrapper{ margin-top:0 !important; padding-top:0 !important; }
.kmf-banner{ margin:0 0 12px !important; }

/* Mobile sidebar spacing */
@media (max-width:900px){
  #main-content, .mh-sidebar{ float:none !important; width:100% !important; }
  .mh-wrapper{ padding:14px !important; }
  .widget-box{ margin:0 0 14px !important; }
  .widget-box .widget-title{ text-align:center; }
}


/* === KMF Sidebar Widgets (match original look) === */
.mh-sidebar .widget-box{
  background:#e9e9e9;
  border:1px solid rgba(0,0,0,.35);
  border-radius:12px;
  overflow:hidden;
  margin:0 0 22px;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}
.mh-sidebar .widget-box .widget-title{
  background:#000;
  color:#fff;
  padding:10px 12px;
  font-weight:800;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.4px;
  margin:0;
  border-radius:0;
}
.mh-sidebar .widget-box .textwidget{
  padding:14px 12px 16px;
  text-align:center;
  color:#111;
  font-size:14px;
  line-height:1.35;
}
.mh-sidebar .widget-box .textwidget img{
  max-width:100%;
  height:auto;
}
.mh-sidebar .widget-box .textwidget a{
  display:inline-block;
  margin:6px 4px;
}
.mh-sidebar .widget-box iframe{
  display:block;
  width:100%;
  border:0;
  border-radius:10px;
  overflow:hidden;
}

/* Responsive tweaks */
@media (max-width: 900px){
  .mh-sidebar .widget-box{ margin:0 0 16px; }
  .mh-sidebar .widget-box .textwidget{ padding:12px 10px 14px; }
}

/* KMF fixes: remove white bar / normalize */
html,body{margin:0;padding:0;background:transparent;}
.mh-wrapper{padding-top:0 !important;margin-top:0 !important;}
#page, #main, #main-content{margin-top:0 !important;}
.kmf-banner, .kmf-hero{margin-top:0 !important;}



/* --- KMF: content translucency like original site --- */
.mh-wrapper{background:transparent !important;}
.mh-content, .mh-sidebar{background:transparent !important;}
.entry-content{
  background:rgba(255,255,255,.82);
  border-radius:14px;
  padding:18px 18px 20px;
  box-shadow:0 12px 35px rgba(0,0,0,.18);
  backdrop-filter: blur(2px);
}
@media (max-width: 900px){
  .entry-content{padding:14px}
}

/* --- KMF: programming page nicer (only on /programmering) --- */
.page-programmering .entry-content h2,
.page-programmering .entry-content h3{margin:18px 0 10px}
.entry-content p{line-height:1.55}
.page-programmering .entry-content strong{
  display:block;
  font-size:18px;
  margin:18px 0 6px;
}
.page-programmering .entry-content br+br{display:none}

/* --- KMF: sidebar widget spacing tighter --- */
.mh-sidebar .widget-box .textwidget{padding:14px 12px 16px}
.mh-sidebar .widget-box img{max-width:100%;height:auto}

/* --- KMF: make background always fixed/no-repeat even if theme overrides --- */
body{
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}


/* === Main content panel like original KMF, with black title bar === */
#main-content .content-panel{
  background: rgba(255,255,255,.82);
  border-radius: 16px;
  box-shadow: 0 12px 35px rgba(0,0,0,.18);
  overflow: hidden;
}
#main-content .content-panel-title{
  background:#000;
  color:#fff;
  padding:12px 18px;
  font-weight:800;
  font-size:16px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.4px;
}
#main-content .content-panel-body{
  padding:16px 18px 22px;
}
#main-content .page-title{
  display:none;
}
#main-content .entry-content{
  background: transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  padding:0 !important;
}
#main-content .widget-box:last-child,
#main-content .entry-content > *:last-child{
  margin-bottom:0;
}
@media (max-width:900px){
  #main-content .content-panel-title{padding:11px 14px;font-size:15px}
  #main-content .content-panel-body{padding:14px}
}


/* === FINAL KMF main title fix === */
#main-content .kmf-main-panel{background:rgba(255,255,255,.82) !important;border-radius:16px !important;overflow:hidden !important;box-shadow:0 12px 35px rgba(0,0,0,.18) !important;}
#main-content .kmf-main-title,
#main-content .content-panel-title.kmf-main-title{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  margin:0 !important;
  padding:12px 18px !important;
  min-height:22px !important;
  background:#000 !important;
  background-image:none !important;
  color:#fff !important;
  font-size:16px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  text-transform:uppercase !important;
  letter-spacing:.4px !important;
  border:0 !important;
  border-radius:16px 16px 0 0 !important;
  box-shadow:none !important;
}
#main-content .kmf-main-title span,
#main-content .kmf-main-title strong,
#main-content .kmf-main-title a,
#main-content .content-panel-title.kmf-main-title *,
#main-content .content-panel-title *{
  color:#fff !important;
  text-shadow:none !important;
}
#main-content .page-title,
#main-content .entry-title,
#main-content h1.page-title,
#main-content h1.entry-title,
#main-content > h1,
#main-content > h2{
  display:none !important;
}
