/* =====================================================================
   PKC premium menu bar + mobile slider sizing
   Only the header menu and the homepage photo slider are touched.
   ===================================================================== */

/* ---------- 1. one premium menu bar (all devices) ---------- */
html.pkc-site #main-site-header nav.lg\:flex{display:none!important}
html.pkc-site #header-menu-toggle-btn{display:inline-flex!important;position:relative;flex:none}
html.pkc-site #mobile-navigation-container{display:block!important}
html.pkc-site #main-site-header>div{min-width:0}

@media (min-width:1024px){
  html.pkc-site #header-menu-toggle-btn{
    align-items:center;gap:10px;padding:9px 20px 9px 15px!important;min-height:44px;border-radius:999px!important;
    background:linear-gradient(135deg,rgba(244,196,48,.18),rgba(26,107,60,.40))!important;
    border:1px solid rgba(244,196,48,.6)!important;color:var(--theme-gold,#f4c430)!important;
    box-shadow:0 0 0 3px rgba(244,196,48,.07),0 6px 22px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.14)!important;
    transition:transform .2s ease,box-shadow .2s ease!important}
  html.pkc-site #header-menu-toggle-btn:hover{transform:translateY(-1px);
    box-shadow:0 0 0 3px rgba(244,196,48,.12),0 0 22px rgba(244,196,48,.35),0 8px 26px rgba(0,0,0,.4)!important}
  html.pkc-site #header-menu-toggle-btn::after{content:"সকল মেনু";font:700 14.5px/1 var(--theme-font-bengali-sans,"Hind Siliguri"),sans-serif;white-space:nowrap}
  html.pkc-site[lang=en] #header-menu-toggle-btn::after{content:"All Menu";font-family:var(--theme-font-english-sans,"Inter"),sans-serif}
  html.pkc-site[lang=ar] #header-menu-toggle-btn::after{content:"القائمة";font-family:var(--theme-font-arabic-sans,"Cairo"),sans-serif}

  /* the full menu opens as a premium panel right under the header */
  html.pkc-site #mobile-navigation-drawer{
    top:calc(var(--header-height,64px) + 10px)!important;bottom:auto!important;
    right:max(16px,calc((100vw - 1720px)/2 + 24px))!important;left:auto!important;
    width:480px!important;max-width:calc(100vw - 32px)!important;height:auto!important;
    max-height:calc(100vh - var(--header-height,64px) - 28px)!important;
    border:1px solid rgba(244,196,48,.42)!important;border-radius:22px!important;overflow:hidden;
    box-shadow:0 24px 70px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04),0 0 44px rgba(244,196,48,.10)!important;
    transform-origin:top right;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s,visibility .2s!important}
  html.pkc-site #mobile-navigation-drawer.translate-x-full{transform:translateY(-10px) scale(.97)!important}
  html.pkc-site #mobile-navigation-drawer.translate-x-0{transform:none!important}
  html.pkc-site[dir=rtl] #mobile-navigation-drawer{left:max(16px,calc((100vw - 1720px)/2 + 24px))!important;right:auto!important;transform-origin:top left}
  html.pkc-site #mobile-navigation-container>div:first-child{backdrop-filter:blur(3px);background:rgba(2,10,6,.45)!important}
}

/* phones & tablets: logo, donate and menu always fit on one line */
@media (max-width:1023px){
  html.pkc-site #main-site-header>div{gap:8px!important;padding-left:12px!important;padding-right:12px!important}
  html.pkc-site #main-site-header>div>a:first-child{min-width:0;flex:1 1 auto}
  html.pkc-site #main-site-header>div>a:first-child>div:last-child{min-width:0;overflow:hidden}
  html.pkc-site #main-site-header>div>a:first-child>div:last-child>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html.pkc-site #main-site-header>div>div:last-child{flex:none;gap:6px!important}
  html.pkc-site #header-menu-toggle-btn{min-width:42px!important;min-height:42px!important;border-radius:12px!important;
    border:1px solid rgba(244,196,48,.55)!important;background:rgba(244,196,48,.12)!important;
    box-shadow:0 0 14px rgba(244,196,48,.18)!important}
}
@media (max-width:520px){
  /* language buttons are inside the menu panel */
  html.pkc-site #main-site-header>div>div:last-child>div:first-child{display:none!important}
  html.pkc-site #main-site-header>div>a:first-child>div:last-child>*:not(:first-child){display:none!important}
}

/* menu panel polish */
html.pkc-site #mobile-navigation-drawer{overscroll-behavior:contain}
html.pkc-site #mobile-navigation-drawer>div:last-child,html.pkc-site #mobile-navigation-drawer>div:last-child>div{flex-wrap:wrap!important;row-gap:8px}
html.pkc-site #mobile-navigation-drawer>div:last-child>div>*{flex:1 1 auto;justify-content:center}
@media (max-width:640px){
  html.pkc-site #mobile-navigation-drawer{width:100vw!important;max-width:100vw!important;border-left:0!important}
}

/* ---------- 2. homepage photo slider: right size on phones & tablets ---------- */
@media (max-width:1023px){
  html.pkc-site #root section.group\/slider{padding-top:64px!important;padding-bottom:64px!important}
}
@media (max-width:640px){
  html.pkc-site #root section.group\/slider{padding-top:40px!important;padding-bottom:60px!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>span{margin-bottom:12px!important;font-size:12px!important;padding:4px 12px!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>h2{font-size:26px!important;line-height:1.3!important;margin-bottom:10px!important;gap:8px!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>h3{font-size:16px!important;line-height:1.45!important;margin-bottom:10px!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>p{font-size:14.5px!important;line-height:1.65!important;margin-bottom:20px!important;
    display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>div{gap:10px!important;flex-wrap:nowrap!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>div>a{flex:1 1 0;padding:12px 14px!important;font-size:15px!important;text-align:center;border-radius:12px!important}
  /* side arrows sit over the text on phones; swipe dots below are enough */
  html.pkc-site #root section.group\/slider>button{width:32px!important;height:32px!important;top:auto!important;bottom:10px!important;transform:none!important;opacity:.85}
}
@media (max-width:360px){
  html.pkc-site #root section.group\/slider>div.max-w-4xl>h2{font-size:23px!important}
  html.pkc-site #root section.group\/slider>div.max-w-4xl>div>a{font-size:14px!important;padding:11px 10px!important}
}

/* ---------- 3. homepage photo slider: clear photo, no green tint ---------- */
html.pkc-site #root section.group\/slider{background:#0a1a12!important}
html.pkc-site #root section.group\/slider>div.absolute.inset-0.z-0>div.bg-cover{mix-blend-mode:normal!important;filter:saturate(1.06) contrast(1.03)}
html.pkc-site #root section.group\/slider>div.absolute.inset-0.z-0>div.bg-cover.opacity-100{opacity:1!important}
html.pkc-site #root section.group\/slider>div.absolute.inset-0.z-0>div.bg-cover.opacity-0{opacity:0!important}
/* a soft neutral shade only behind the text, so the words stay as readable as before */
html.pkc-site #root section.group\/slider>div.absolute.inset-0.z-0::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 62% 58% at 50% 50%,rgba(0,0,0,.42),transparent 78%),linear-gradient(180deg,rgba(0,0,0,.20) 0%,rgba(0,0,0,.30) 60%,rgba(0,0,0,.45) 100%)}
html.pkc-site #root section.group\/slider>div.max-w-4xl h2,
html.pkc-site #root section.group\/slider>div.max-w-4xl h3,
html.pkc-site #root section.group\/slider>div.max-w-4xl p{text-shadow:0 2px 12px rgba(0,0,0,.6),0 1px 2px rgba(0,0,0,.5)}