/* JoyJoy cabinet v456 — final layout stability and responsive repair */

html{
  max-width:100%;
  overflow-x:clip;
}
body[data-account-page]{
  max-width:100%;
  overflow-x:clip;
}
body[data-account-page] .account-page,
body[data-account-page] .github-layout,
body[data-account-page] .github-content,
body[data-account-page] .account-page-primary,
body[data-account-page] .bot-workspace,
body[data-account-page] .bot-module-content,
body[data-account-page] .bot-module-panel,
body[data-account-page] .github-card,
body[data-account-page] .console-card,
body[data-account-page] .admin-hub-view,
body[data-account-page] .admin-master-detail,
body[data-account-page] .admin-list-card{
  min-width:0;
  max-width:100%;
}
body[data-account-page] :is(img,video,canvas){
  max-width:100%;
}
body[data-account-page] :is(.page-heading,.console-heading,.card-title,.admin-view-heading)>div{
  min-width:0;
}
body[data-account-page] :is(h1,h2,h3,h4,p,small,strong,span,label,code){
  overflow-wrap:anywhere;
}
body[data-account-page] :is(input,select,textarea){
  max-width:100%;
  min-width:0;
}
body[data-account-page] :is(.form-actions,.developer-form-actions,.admin-filter-row,.admin-inline-form,.admin-bot-actions,.admin-availability-actions){
  min-width:0;
}

/* Disable approximate off-screen sizing that caused visible jumps while scrolling. */
body[data-account-page] .account-panel.is-active .github-card,
body[data-account-page="bots"] .bot-module-panel.is-active>article,
body[data-account-page="bots"] .bot-module-panel.is-active>.github-card{
  content-visibility:visible!important;
  contain-intrinsic-size:none!important;
}

/* Stable wide console without allowing child grids to stretch the page. */
body[data-account-page="console"] .account-page{
  width:min(2040px,100%);
}
body[data-account-page="console"] :is(
  .admin-overview-grid,.admin-issues-grid,.admin-system-layout,.admin-queue-grid,
  .admin-announcement-layout,.admin-security-grid,.admin-billing-grid,
  .admin-manager-maintenance-grid-v439,.developer-console-layout
)>*{
  min-width:0;
}
body[data-account-page="console"] .admin-table-wrap{
  width:100%;
  max-width:100%;
  overflow:auto;
  overscroll-behavior:contain;
}
body[data-account-page="console"] .admin-table-wrap table{
  margin:0;
}
body[data-account-page="console"] .developer-terminal{
  min-width:0;
  max-width:100%;
}

/* Bot workspaces: keep every panel inside its content column. */
body[data-account-page="bots"] .bot-module-panel>*{
  min-width:0;
  max-width:100%;
}
body[data-account-page="bots"] :is(
  .feature-toggle-grid,.settings-grid,.routing-fields,.routing-events-grid,
  .routing-display-grid,.gamey-form-grid-v406,.gamey-config-grid-v406,
  .gamey-integration-function-grid-v415,.automod-settings-grid,
  .welcome-settings-grid,.admin-form-grid
)>*{
  min-width:0;
}
body[data-account-page="bots"] :is(.sticky-save-bar,.universal-save-bar-v186,.joyjoy-save-dock-v449,.joyjoy-save-dock-v453){
  max-width:100%;
}

@media(max-width:980px){
  body[data-account-page] .account-page{
    padding-inline:14px;
  }
  body[data-account-page] :is(.page-heading,.console-heading,.admin-view-heading,.admin-panel-heading,.developer-panel-heading){
    flex-wrap:wrap;
  }
  body[data-account-page] :is(.content-grid,.stats-grid,.admin-overview-grid,.admin-issues-grid){
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  body[data-account-page] .account-page{
    padding:10px;
  }
  body[data-account-page] .account-topbar{
    margin-bottom:12px;
  }
  body[data-account-page] :is(.page-heading,.console-heading,.admin-view-heading,.admin-panel-heading,.developer-panel-heading,.card-title){
    align-items:flex-start!important;
    gap:10px!important;
  }
  body[data-account-page] :is(.page-heading,.console-heading,.admin-view-heading)>button,
  body[data-account-page] :is(.page-heading,.console-heading,.admin-view-heading)>.secondary-button{
    max-width:100%;
  }

  /* The admin section selector now wraps instead of disappearing off-screen. */
  body[data-account-page="console"] #panel-admin>.admin-hub-nav{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%;
    max-width:100%;
    padding:8px!important;
    overflow:visible!important;
    scrollbar-gutter:auto!important;
  }
  body[data-account-page="console"] #panel-admin>.admin-hub-nav button{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    padding:7px 9px!important;
    white-space:normal!important;
    justify-content:flex-start!important;
  }
  body[data-account-page="console"] #panel-admin>.admin-hub-nav button span{
    flex:0 0 30px;
    width:30px!important;
    height:30px!important;
  }
  body[data-account-page="console"] #panel-admin>.admin-hub-nav button b{
    min-width:0;
    font-size:12px!important;
    line-height:1.2!important;
  }
  body[data-account-page="console"] :is(.admin-overview-kpis,.admin-billing-kpis,.admin-queue-kpis,.admin-security-kpis,.admin-issue-kpis,.admin-subscription-kpis-v232){
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body[data-account-page="console"] .admin-bot-metric-grid-v217{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body[data-account-page="console"] :is(.developer-request-line,.developer-command-form){
    min-width:0;
  }

  /* Bot selector and module selector no longer rely on hidden horizontal overflow. */
  body[data-account-page="bots"] .bot-switcher{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%;
    max-width:100%;
    overflow:visible!important;
  }
  body[data-account-page="bots"] .bot-switch-button{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding:8px!important;
  }
  body[data-account-page="bots"] .bot-workspace{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  body[data-account-page="bots"] .bot-module-sidebar{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    padding:7px!important;
  }
  body[data-account-page="bots"] .bot-sidebar-top{
    display:none!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(112px,1fr))!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    overflow:visible!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]>button{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:44px!important;
    padding:6px 8px!important;
    justify-content:flex-start!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]>button .module-icon{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    margin:0!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]>button .module-label{
    min-width:0;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:normal!important;
    text-align:left;
  }
  body[data-account-page="bots"] .bot-module-content :is(p,small,.field small,.muted-status){
    line-height:1.45;
  }
  body[data-account-page="bots"] .bot-module-content small{
    font-size:max(11px,.72rem);
  }
  body[data-account-page="bots"] :is(.sticky-save-bar,.universal-save-bar-v186,.joyjoy-save-dock-v449,.joyjoy-save-dock-v453){
    width:100%!important;
    max-width:100%!important;
    margin-inline:0!important;
  }
}

@media(max-width:520px){
  body[data-account-page="console"] #panel-admin>.admin-hub-nav{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body[data-account-page="console"] :is(.admin-overview-kpis,.admin-billing-kpis,.admin-queue-kpis,.admin-security-kpis,.admin-issue-kpis,.admin-subscription-kpis-v232,.admin-bot-metric-grid-v217){
    grid-template-columns:1fr!important;
  }
  body[data-account-page="console"] .admin-view-heading>button,
  body[data-account-page="console"] .admin-view-heading>.secondary-button{
    width:100%;
  }
  body[data-account-page="console"] .developer-output-actions,
  body[data-account-page="console"] .developer-form-actions{
    width:100%;
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  body[data-account-page="console"] .developer-output-actions>button,
  body[data-account-page="console"] .developer-form-actions>button{
    width:100%;
  }

  body[data-account-page="bots"] .bot-switch-button{
    min-height:46px!important;
  }
  body[data-account-page="bots"] .bot-switch-button span:not(.bot-switch-icon){
    font-size:11px;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]>button{
    min-height:46px!important;
    padding:6px!important;
    justify-content:center!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]>button .module-label{
    display:none!important;
  }
  body[data-account-page="bots"] :is(.sticky-save-bar,.universal-save-bar-v186,.joyjoy-save-dock-v449,.joyjoy-save-dock-v453){
    grid-template-columns:1fr!important;
  }
  body[data-account-page="bots"] :is(.sticky-save-bar,.universal-save-bar-v186,.joyjoy-save-dock-v449,.joyjoy-save-dock-v453)>*{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
  }
}

@media(max-width:380px){
  body[data-account-page="console"] #panel-admin>.admin-hub-nav{
    grid-template-columns:1fr!important;
  }
  body[data-account-page="bots"] .bot-module-menu[data-bot-menu]{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

/* High-specificity repair for the legacy mobile navigation rules. */
@media(max-width:820px){
  body[data-account-page="bots"] #panel-bot-control .bot-module-sidebar{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(108px,1fr))!important;
    width:100%!important;
    max-width:100%!important;
    gap:6px!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]>button{
    display:flex!important;
    flex:initial!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:44px!important;
    padding:6px 8px!important;
    justify-content:flex-start!important;
    scroll-snap-align:none!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-icon{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    margin:0!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-label{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:normal!important;
    font-size:12px!important;
    line-height:1.15!important;
    text-align:left!important;
  }
}
@media(max-width:520px){
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]>button{
    display:grid!important;
    place-items:center!important;
    min-height:46px!important;
    padding:6px!important;
  }
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-label{
    display:none!important;
  }
}
@media(max-width:380px){
  body[data-account-page="bots"] #panel-bot-control .bot-module-menu[data-bot-menu]{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
