/* SN194 hotfix layer. Loaded last. Existing staff sidebars and the v192 quick guide are intentionally untouched. */

/* Public/mobile header: brand stays right; login + search/menu controls stay on the left. */
@media(max-width:900px){
  body .bk47-header .bk47-nav{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;min-width:0!important}
  body .bk47-header .bk47-brand{flex:0 0 auto!important;margin:0!important;margin-inline:0!important;min-width:0!important}
  body .bk47-header .bk47-nav-actions{margin-right:auto!important;margin-left:0!important;margin-inline-start:auto!important;margin-inline-end:0!important;justify-content:flex-start!important;align-items:center!important;flex:0 1 auto!important;min-width:0!important}
  body .bk47-header .bk58-login,body .bk47-header .bk47-menu-button,body .bk47-header .bk58-search-trigger{flex:0 0 auto!important}
  /* Logged-in users can have long names. Never let the identity button push search/menu off-screen. */
  body .bk47-header .bk58-login{max-width:132px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
}
@media(max-width:640px){
  body .bk47-header .bk58-login{max-width:104px!important}
}
@media(max-width:420px){
  body .bk47-header .bk47-nav{gap:6px!important}
  body .bk47-header .bk47-nav-actions{gap:5px!important}
  body .bk47-header .bk58-login{padding-inline:10px!important;min-width:0!important;max-width:84px!important}
}
@media(max-width:360px){
  body .bk47-header .bk47-nav{gap:4px!important}
  body .bk47-header .bk47-brand{width:108px!important;min-width:108px!important}
  body .bk47-header .bk58-login{min-width:0!important;max-width:66px!important;padding-inline:7px!important}
}

/* Partner systems popup is portaled to BODY by v194 JS, so sidebar overflow cannot clip it. */
body>#bk181SystemsMenu.bk181-systems-menu,
body>#bk181SystemsMenu.bk192-systems-menu{
  position:fixed!important;right:auto!important;bottom:auto!important;left:auto!important;top:auto!important;
  box-sizing:border-box!important;overflow:auto!important;overscroll-behavior:contain!important;
  max-width:calc(100vw - 24px)!important;box-shadow:0 20px 55px rgba(4,24,61,.26)!important;z-index:5000!important
}
@media(max-width:900px){
  body>#bk181SystemsMenu.bk181-systems-menu,
  body>#bk181SystemsMenu.bk192-systems-menu{left:12px!important;right:12px!important;top:auto!important;width:auto!important;max-width:none!important;border-radius:16px!important;box-shadow:0 -14px 42px rgba(4,24,61,.24)!important}
}

/* Modular dashboard sizing. Targeted only to Admin / Superadmin / HRM dashboard roots. */
:where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"].bk189-square-grid{
  --bk193-columns:6;display:grid!important;grid-template-columns:repeat(var(--bk193-columns),minmax(0,1fr))!important;
  grid-auto-flow:row!important;gap:12px!important;align-items:start!important;min-width:0!important
}
:where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget]{
  min-width:0!important;max-width:100%!important;min-height:0!important;height:auto!important;overflow:hidden!important;box-sizing:border-box!important
}

/* Editing controls get their own row INSIDE a card, instead of fighting the card title. */
.bk194-edit-controls-row{display:none;min-width:0;width:100%;margin:0 0 7px;padding:6px;border:1px solid #d8e4f1;border-radius:9px;background:#f7faff;box-sizing:border-box}
.bk193-dashboard-editing .bk194-edit-controls-row{display:flex!important;align-items:center!important;justify-content:flex-start!important}
.bk194-edit-controls-row .bk193-edit-controls{display:flex!important;width:100%!important;min-width:0!important;flex-wrap:nowrap!important;align-items:center!important;gap:4px!important;margin:0!important}
.bk194-edit-controls-row .bk193-edit-controls select{flex:1 1 72px!important;min-width:64px!important;max-width:110px!important;height:32px!important;padding-block:0!important;box-sizing:border-box!important;font-size:10.5px!important}
.bk194-edit-controls-row .bk193-edit-controls button{flex:0 0 30px!important;width:30px!important;height:30px!important;min-width:30px!important;max-width:30px!important;padding:0!important;box-sizing:border-box!important;justify-content:center!important}

/* Keep titles/chrome contained in narrow widgets. */
[data-bk193-editor="1"] .bk181-widget-handle{min-width:0!important;max-width:100%!important;overflow:hidden!important}
[data-bk193-editor="1"] .bk181-widget-handle>span:not(.bk193-size-badge){min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
[data-bk193-editor="1"] .bk181-widget-handle :is(.bk189-widget-star,.bk191-widget-open,.bk193-size-badge){flex:0 0 auto!important}
[data-bk193-editor="1"] .bk181-widget-handle .bk189-widget-star{margin-inline-start:auto!important}
[data-bk193-editor="1"] .bk189-widget-content{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
[data-bk193-editor="1"] :is(.bk178-queue-copy,.bk148-row-copy,.bk178-control-row span,.bk193-activity-list span){min-width:0!important}

/* Undo old v177/v193 density rules that hid useful content unpredictably after resizing. */
[data-bk193-editor="1"] [data-size="2x2"] .bk178-section-head span{display:initial!important}
[data-bk193-editor="1"] [data-size="2x2"] .bk178-summary-copy em{display:block!important}
[data-bk193-editor="1"] [data-size="2x2"] .bk181-mini-status article{display:block!important}
[data-bk193-editor="1"] [data-size="2x2"] .bk178-queue-row,
[data-bk193-editor="1"] [data-size="2x2"] .bk178-control-row,
[data-bk193-editor="1"] [data-size="2x2"] .bk178-flow-row,
[data-bk193-editor="1"] [data-size="2x2"] .bk148-action-row,
[data-bk193-editor="1"] [data-size="2x2"] .bk148-mini-row{display:flex!important}
[data-bk193-editor="1"] [data-size="2x2"] .bk148-announcement-list article{display:grid!important}
[data-bk193-editor="1"] [data-size="2x2"] .bk178-queue-row:nth-child(n+5),
[data-bk193-editor="1"] [data-size="2x2"] .bk148-action-row:nth-child(n+5),
[data-bk193-editor="1"] [data-size="2x2"] .bk148-mini-row:nth-child(n+5){display:none!important}

/* Content-safe module heights. The previous single row height was the source of most overlap/clipping. */
@media(min-width:620px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"].bk189-square-grid{grid-auto-rows:auto!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget]{grid-row:auto!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"]{height:126px!important;min-height:126px!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget][data-size="2x1"]{height:192px!important;min-height:192px!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget]:is([data-size="2x2"],[data-size="3x2"]){height:344px!important;min-height:344px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"]{height:176px!important;min-height:176px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget][data-size="2x1"]{height:234px!important;min-height:234px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget]:is([data-size="2x2"],[data-size="3x2"]){height:386px!important;min-height:386px!important}
}

/* Desktop compact editor strip for six-column KPI rows. */
@media(min-width:1120px){
  [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"] .bk194-edit-controls-row{padding:5px!important}
  [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"] .bk194-edit-controls-row .bk193-edit-controls{gap:3px!important}
  [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"] .bk194-edit-controls-row .bk193-edit-controls select{flex:1 1 44px!important;min-width:44px!important;max-width:58px!important;height:28px!important;padding-inline:4px!important;font-size:9.5px!important}
  [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"] .bk194-edit-controls-row .bk193-edit-controls button{flex-basis:25px!important;width:25px!important;height:25px!important;min-width:25px!important;max-width:25px!important;font-size:10px!important}
}

/* Tablet: four columns, more useful 2x1 content, and touch-safe editor controls. */
@media(min-width:780px) and (max-width:1119px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"].bk189-square-grid{--bk193-columns:4!important}
  .bk193-editor-bar{gap:10px!important}
  .bk193-editor-actions{width:100%!important;display:flex!important;flex-wrap:wrap!important}
  .bk193-editor-actions .bk178-btn{flex:1 1 160px!important;justify-content:center!important}
}
@media(min-width:620px) and (max-width:1119px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget][data-size="2x1"]{height:220px!important;min-height:220px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget][data-size="1x1"]{height:190px!important;min-height:190px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget][data-size="2x1"]{height:274px!important;min-height:274px!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-section-head span{display:initial!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk181-mini-status article{display:block!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk181-mini-status article:nth-child(n+4){display:none!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-control-row,
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-flow-row,
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-mini-row{display:flex!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-control-row:nth-of-type(n+4),
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-flow-row:nth-of-type(n+4),
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-mini-row:nth-child(n+4){display:none!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-announcement-list article{display:grid!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-announcement-list article:nth-child(n+3){display:none!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk181-calendar-today span{display:initial!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk193-activity-list>div{display:grid!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk193-activity-list>div:nth-child(n+4){display:none!important}
  .bk194-edit-controls-row .bk193-edit-controls select{height:38px!important;font-size:11px!important}
  .bk194-edit-controls-row .bk193-edit-controls button{flex-basis:36px!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important}
}

/* Small tablet / landscape phone. */
@media(min-width:620px) and (max-width:779px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"].bk189-square-grid{--bk193-columns:2!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget][data-size="3x2"]{grid-column:span 2!important}
  .bk193-editor-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  .bk193-editor-actions .bk178-btn{width:100%!important;justify-content:center!important}
}

/* Phones: stack naturally. Do not clip content into fake desktop rows. */
@media(max-width:619px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"].bk189-square-grid{display:flex!important;flex-direction:column!important;gap:10px!important;grid-auto-rows:auto!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget]{width:100%!important;height:auto!important;min-height:132px!important;max-height:none!important;overflow:visible!important;contain:none!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget][data-size="2x1"]{min-height:165px!important}
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm) [data-bk193-editor="1"]>[data-dashboard-widget]:is([data-size="2x2"],[data-size="3x2"]){min-height:280px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget]{overflow:visible!important;min-height:202px!important}
  .bk193-dashboard-editing [data-bk193-editor="1"]>[data-dashboard-widget]:is([data-size="2x2"],[data-size="3x2"]){min-height:326px!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-section-head span{display:initial!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk181-mini-status article{display:block!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-control-row,
  [data-bk193-editor="1"] [data-size="2x1"] .bk178-flow-row,
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-mini-row{display:flex!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk148-announcement-list article{display:grid!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk181-calendar-today span{display:initial!important}
  [data-bk193-editor="1"] [data-size="2x1"] .bk193-activity-list>div{display:grid!important}
  .bk193-editor-bar{padding:10px!important}
  .bk193-editor-copy{width:100%!important;gap:4px 7px!important}
  .bk193-editor-copy>span{line-height:1.65!important}
  .bk193-editor-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;width:100%!important}
  .bk193-editor-actions .bk178-btn{min-height:42px!important;width:100%!important;justify-content:center!important}
  .bk194-edit-controls-row{padding:7px!important}
  .bk194-edit-controls-row .bk193-edit-controls{gap:6px!important}
  .bk194-edit-controls-row .bk193-edit-controls select{flex:1 1 100px!important;max-width:none!important;height:42px!important;min-height:42px!important;font-size:12px!important}
  .bk194-edit-controls-row .bk193-edit-controls button{flex-basis:42px!important;width:42px!important;height:42px!important;min-width:42px!important;max-width:42px!important;font-size:12px!important}
  .bk193-welcome-copy p{font-size:11px!important;line-height:1.75!important}
  .bk193-welcome-pills{gap:5px!important}
  .bk193-welcome-pills>span{font-size:9.5px!important}
  /* Staff mobile dock is fixed; keep the last widget and its actions above it. */
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-tab-dashboard .app>.main>.content,
  body.bk58-app-hrm.bk58-tab-hrm_dashboard .app>.main>.content{padding-bottom:calc(104px + env(safe-area-inset-bottom))!important}
}

/* Staff phone header: late v81 mobile rules were painting the SVG buttons white,
   while the newer route header stays light. Restore readable controls without
   changing sidebar/header structure. */
@media(max-width:680px){
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .app>.main>.route-topbar{
    background:rgba(251,252,254,.97)!important;
    border-bottom:1px solid #e3e9ef!important;
  }
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .route-toolbar .route-icon-button,
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .route-toolbar .header-action-btn.route-icon-button,
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .route-toolbar .notif-btn.route-icon-button{
    color:#4d5d73!important;
    background:#fff!important;
    border:1.5px solid #d5deea!important;
  }
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .route-toolbar .route-icon-button>svg{
    color:inherit!important;
    stroke:currentColor!important;
    opacity:1!important;
  }
  :where(body.bk58-app-admin,body.bk58-app-superadmin,body.bk58-app-hrm).bk58-panel-shell .route-menu-button{
    color:#4d5d73!important;
    background:#fff!important;
    border:1.5px solid #d5deea!important;
  }
}
@media(max-width:680px){
  html body.bk58-panel-shell.bk58-app-admin .app>.main>.route-topbar .route-toolbar .route-icon-button,
  html body.bk58-panel-shell.bk58-app-superadmin .app>.main>.route-topbar .route-toolbar .route-icon-button,
  html body.bk58-panel-shell.bk58-app-hrm .app>.main>.route-topbar .route-toolbar .route-icon-button{
    color:#4d5d73!important;background:#fff!important;border:1.5px solid #d5deea!important;
  }
  html body.bk58-panel-shell.bk58-app-admin .app>.main>.route-topbar .route-toolbar .route-icon-button>svg,
  html body.bk58-panel-shell.bk58-app-superadmin .app>.main>.route-topbar .route-toolbar .route-icon-button>svg,
  html body.bk58-panel-shell.bk58-app-hrm .app>.main>.route-topbar .route-toolbar .route-icon-button>svg{
    color:inherit!important;stroke:currentColor!important;opacity:1!important;
  }
}

/* Final narrow-phone safeguard (320–360px): editor controls must never squeeze outside cards. */
@media(max-width:360px){
  .bk193-dashboard-editing .bk193-editor-actions{grid-template-columns:1fr!important}
  .bk194-edit-controls-row{padding:6px!important}
  .bk194-edit-controls-row .bk193-edit-controls{gap:4px!important;min-width:0!important}
  .bk194-edit-controls-row .bk193-edit-controls select{flex:1 1 0!important;min-width:0!important;max-width:none!important;height:40px!important;min-height:40px!important;padding-inline:5px!important}
  .bk194-edit-controls-row .bk193-edit-controls button{flex:0 0 36px!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important}
  .bk193-welcome-pills{flex-wrap:wrap!important}
}
