/* ==========================================================
   pandabu V2.0.4 RC16.280c8b
   Tablet Guided Layout Fix
   Additiver, ausschließlich auf Notvorrat/Geführt begrenzter Fix.
   ========================================================== */

/*
 * Tablet-Desktop-Hybrid (z.B. iPad mit 1024 CSS-px):
 * Ab 900px ist die feste Desktop-Seitenleiste 220px breit. Der geführte
 * Notvorrat verwendet in älteren Ständen gleichzeitig einen viewportbreiten
 * Flow. Dadurch rutscht die linke Hälfte unter die Navigation.
 *
 * Nur in diesem Übergangsbereich wird der Guided-Flow deshalb exakt auf die
 * verbleibende Inhaltsfläche rechts der Sidebar begrenzt. Desktop >=1200px
 * und Mobile <900px bleiben vollständig unverändert.
 */
@media (min-width:900px) and (max-width:1199px){
  .page.page-emergency{
    min-width:0!important;
    overflow-x:clip!important;
  }

  .mode-guided.rc251-form-flow{
    left:220px!important;
    right:0!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:none!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }

  .mode-guided .rc251-form-shell,
  .mode-guided .rc251-form-header,
  .mode-guided .rc251-form-stage{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  .mode-guided .rc251-form-header{
    padding-left:18px!important;
    padding-right:18px!important;
    overflow-x:hidden!important;
  }

  .mode-guided .rc251-form-stage{
    margin:0!important;
    padding:24px 18px 38px!important;
    overflow-x:hidden!important;
  }

  .mode-guided .rc251-form-stage>.emergency-smart-group,
  .mode-guided .rc251-form-stage>.emergency-wizard-complete{
    width:min(100%,820px)!important;
    max-width:820px!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  .mode-guided .emergency-requirement,
  .mode-guided .emergency-requirement-copy,
  .mode-guided .emergency-requirement-body,
  .mode-guided .emergency-requirement-list,
  .mode-guided .emergency-component-targets,
  .mode-guided .emergency-product-planner{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* Sechs Bereichsicons bleiben vollständig innerhalb der verfügbaren Breite. */
  .mode-guided .emergency-wizard-categories{
    width:100%!important;
    max-width:780px!important;
    min-width:0!important;
    padding-left:10px!important;
    padding-right:10px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .mode-guided .emergency-wizard-category{
    min-width:0!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }
  .mode-guided .emergency-wizard-category-icon{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
  }
  .mode-guided .emergency-wizard-category-icon img,
  .mode-guided .emergency-wizard-category-icon>img{
    width:43px!important;
    height:43px!important;
  }
  .mode-guided .emergency-wizard-category.active .emergency-wizard-category-icon{
    width:62px!important;
    height:62px!important;
    min-width:62px!important;
    min-height:62px!important;
    margin-top:-5px!important;
  }
  .mode-guided .emergency-wizard-category.active .emergency-wizard-category-icon img,
  .mode-guided .emergency-wizard-category.active .emergency-wizard-category-icon>img{
    width:51px!important;
    height:51px!important;
  }
  .mode-guided .emergency-wizard-category small{
    max-width:92px!important;
    font-size:10px!important;
    line-height:1.08!important;
    text-align:center!important;
  }

  /* Komplexe Teilziel-Zeilen dürfen nie links aus der Karte laufen. */
  .mode-guided .emergency-component-target-row{
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  .mode-guided .emergency-product-plan-row,
  .mode-guided .emergency-existing-stock-row,
  .mode-guided .emergency-inventory-bridge-row{
    min-width:0!important;
    max-width:100%!important;
  }
}
