/* KabarLagi 3.4.1 — mobile drawer/sidebar and favicon stability */

/* Drawer must be invisible only while the native hidden attribute is present. */
.kl-drawer[hidden],#resp-menu[hidden]{display:none!important}
@media (max-width:1023px){
  body .menu-button.menu-trigger,
  body a.menu-button.menu-trigger,
  body .site-header .menu-button.menu-trigger,
  body .nav .menu-button.menu-trigger,
  body .nav-1 .menu-button.menu-trigger,
  body .nav-2 .menu-button.menu-trigger{
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:12px!important;
  }
  .menu-button.menu-trigger .toggle-icon,
  .menu-button.menu-trigger .toggle-icon::before,
  .menu-button.menu-trigger .toggle-icon::after{
    display:block!important;
    width:21px!important;
    height:2px!important;
    border-radius:99px!important;
    background:currentColor!important;
    content:"";
  }
  .menu-button.menu-trigger .toggle-icon{position:relative!important}
  .menu-button.menu-trigger .toggle-icon::before{position:absolute!important;left:0!important;top:-7px!important}
  .menu-button.menu-trigger .toggle-icon::after{position:absolute!important;left:0!important;top:7px!important}
  #resp-menu.kl-drawer:not([hidden]){display:block!important;position:fixed!important;inset:0!important;z-index:2147482500!important;width:100%!important;height:100%!important;max-width:none!important;margin:0!important;padding:0!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
  #resp-menu .kl-drawer__backdrop{display:block!important;position:absolute!important;inset:0!important}
  #resp-menu .kl-drawer__surface{display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;width:min(88vw,390px)!important;max-width:calc(100vw - 36px)!important;height:100%!important;max-height:100dvh!important;overflow:hidden!important;transform:none!important;visibility:visible!important;opacity:1!important}
  #resp-menu .kl-drawer__body{min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
}
@media (max-width:420px){
  #resp-menu .kl-drawer__surface{width:min(92vw,360px)!important;max-width:calc(100vw - 20px)!important}
  #resp-menu .kl-drawer__header,#resp-menu .kl-drawer__footer{padding:13px!important}
  #resp-menu .kl-drawer__body{padding:14px 13px!important}
}

/* V6 previously hid single-post sidebars on phones. Keep the configured
   sidebar in normal document flow after the article instead. */
@media (max-width:767px){
  body.kl-mobile-sidebar-enabled.single #sidebar,
  body.kl-mobile-sidebar-enabled.single #sidebar-b{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:static!important;
    float:none!important;
    clear:both!important;
    width:100%!important;
    max-width:100%!important;
    margin:26px 0 0!important;
    padding:0!important;
    transform:none!important;
  }
  body.kl-mobile-sidebar-enabled.single #sidebar .widget,
  body.kl-mobile-sidebar-enabled.single #sidebar-b .widget{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  body.kl-mobile-sidebar-disabled.single #sidebar,
  body.kl-mobile-sidebar-disabled.single #sidebar-b{display:none!important}
}

/* Network favicon should align with text and never collapse the link. */
body.kl-network-favicons .kl-network-menu__list a{display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important}
body.kl-network-favicons .kl-network-favicon{display:block!important;width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;object-fit:contain!important;border-radius:4px!important}

/* Dark drawer remains readable regardless of legacy V6 color declarations. */
html.dark-mode #resp-menu .kl-drawer__surface,
html.kl-v6-dark #resp-menu .kl-drawer__surface{background:var(--kl-v6-dark-surface,#111827)!important;color:var(--kl-v6-dark-text,#f8fafc)!important}
html.dark-mode #resp-menu .kl-drawer__description,
html.kl-v6-dark #resp-menu .kl-drawer__description{color:var(--kl-v6-dark-muted,#cbd5e1)!important}