/* SGS Support responsive/full-screen layout override */
html,body,#root{margin:0!important;padding:0!important;width:100%!important;min-width:0!important;}
body{overflow-x:hidden;}

/* Remove the global portal sidebar and let application content use the full viewport. */
#root > div.flex.min-h-screen > aside{display:none!important;}
#root > div.flex.min-h-screen > main{width:100%!important;max-width:none!important;min-width:0!important;flex:1 1 100%!important;padding:0!important;margin:0!important;}

/* FMS application full width */
.fms-root{width:100%!important;max-width:none!important;min-height:100vh!important;margin:0!important;}
.fms-root > header{width:100%!important;margin:0!important;border-radius:0!important;}

/* Keep the FMS top navigation usable on narrow screens. */
.fms-root header nav{display:flex!important;flex-wrap:wrap!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:thin!important;}
.fms-root header nav > *{flex:0 0 auto!important;}

/* Main FMS content should not have a desktop-only fixed width. */
.fms-root .tab-content{width:100%!important;max-width:none!important;}
.fms-root .chart-grid{grid-template-columns:repeat(3,minmax(0,1fr));}

/* Prevent charts/cards from causing horizontal page overflow. */
.fms-root .chart-card,.fms-root .table-wrap,.fms-root .toolbar,.fms-root .kpi-card{min-width:0!important;max-width:100%!important;}
.fms-root .chart-wrap{min-width:0!important;}

@media (max-width: 1100px){
  .fms-root .chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fms-root .kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media (max-width: 700px){
  .fms-root{font-size:12px!important;}
  .fms-root header{position:sticky!important;top:0!important;z-index:1000!important;}
  .fms-root header > div{padding-left:12px!important;padding-right:12px!important;}
  .fms-root header nav{flex-wrap:nowrap!important;white-space:nowrap!important;}
  .fms-root .tab-content{padding:12px 10px 20px!important;}
  .fms-root .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
  .fms-root .kpi-card{padding:12px!important;border-radius:8px!important;}
  .fms-root .kpi-value{font-size:24px!important;}
  .fms-root .chart-grid{grid-template-columns:1fr!important;gap:10px!important;}
  .fms-root .chart-card{padding:12px!important;border-radius:8px!important;}
  .fms-root .chart-wrap{height:220px!important;}
  .fms-root .toolbar{padding:10px!important;gap:7px!important;}
  .fms-root .toolbar select,.fms-root .toolbar input{width:100%!important;min-width:0!important;}
  .fms-root .toolbar-spacer{display:none!important;}
  .fms-root .btn{min-height:36px!important;}
  .fms-root .form-grid{grid-template-columns:1fr!important;}
  .fms-root .modal-overlay{padding:8px!important;}
  .fms-root .modal{max-width:100%!important;max-height:94vh!important;border-radius:8px!important;}
  .fms-root .modal-body{padding:14px!important;}
  .fms-root .modal-footer{padding:10px 14px!important;flex-wrap:wrap!important;}
  .fms-root .modal-footer .btn{flex:1 1 120px!important;}
  .fms-root .pagination{flex-wrap:wrap!important;gap:8px!important;}
  .fms-root .table-scroll{width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
  .fms-root table{min-width:900px!important;}
}

@media (max-width: 420px){
  .fms-root .kpi-grid{grid-template-columns:1fr!important;}
  .fms-root .kpi-value{font-size:22px!important;}
  .fms-root .section-title{font-size:15px!important;}
  .fms-root .chart-wrap{height:200px!important;}
}

/* Also make non-FMS pages that use the shared shell full width. */
@media (max-width: 768px){
  #root > div.flex.min-h-screen > main{padding:0!important;}
}