/* EasyWater Fleet Mobile R22. CSS-only responsive correction.
   This applies solely to small screens and preserves all application behavior. */
@media screen and (max-width:760px) {
  html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  html, body, #root { max-width:100%; min-width:0; overflow-x:clip; }
  #root > header {
    display:flex !important;
    flex-direction:column !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:11px !important;
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:15px 16px !important;
    box-sizing:border-box !important;
  }
  /* Sidecar action bars may have desktop-only absolute positioning. */
  #root > header :where(div, nav, section, button, a) {
    position:static !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    float:none !important;
    transform:none !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
  #root > header > * {
    flex:0 1 auto !important;
    margin:0 !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  #root > header .brand {
    display:block !important;
    width:100% !important;
    font-size:25px !important;
    line-height:1.13 !important;
    letter-spacing:-1px !important;
  }
  #root > header .brand span {
    display:block !important;
    font-size:11px !important;
    letter-spacing:1px !important;
    line-height:1.35 !important;
    margin-top:4px !important;
  }
  #root > header .account {
    display:flex !important;
    flex-flow:row wrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    max-width:100% !important;
    gap:8px !important;
    font-size:14px !important;
    line-height:1.35 !important;
  }
  /* Additional leader navigation injected by other Fleet modules. */
  #root > header > :not(.brand):not(.account) {
    display:flex !important;
    flex-flow:row wrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    align-content:flex-start !important;
    gap:8px !important;
    width:100% !important;
  }
  #root > header :where(nav, section) {
    flex-wrap:wrap !important;
    gap:8px !important;
  }
  #root > header :where(button, a) {
    min-height:42px !important;
    padding:9px 11px !important;
    margin:0 !important;
    font-size:13px !important;
    line-height:1.3 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    flex:0 1 auto !important;
  }
  #root > main {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:22px 14px 42px !important;
    box-sizing:border-box !important;
  }
  #root > main > .heading,
  #root > main .heading {
    align-items:flex-start !important;
    gap:12px !important;
    min-width:0 !important;
  }
  #root > main .heading > :first-child { min-width:0 !important; }
  #root > main .heading h1 {
    font-size:27px !important;
    line-height:1.18 !important;
    letter-spacing:-.7px !important;
    overflow-wrap:anywhere;
  }
  #root > main .heading p { font-size:14px; line-height:1.45; }
  #root > main .metric {
    min-width:64px !important;
    max-width:90px !important;
    flex:0 0 26% !important;
    padding-left:12px !important;
  }
  #root > main .metric strong { font-size:27px !important; }
  #root > main .metric span { font-size:11px !important; line-height:1.35; }
  #root > main nav[aria-label="Hovedmenu"] {
    display:flex !important;
    flex-flow:row wrap !important;
    gap:7px !important;
    margin:0 0 14px !important;
    min-width:0 !important;
  }
  #root > main nav[aria-label="Hovedmenu"] > button {
    min-height:42px !important;
    padding:10px 11px !important;
    font-size:13px !important;
    line-height:1.25 !important;
    max-width:100% !important;
    white-space:normal !important;
  }
  #root > main .stop, #root > main .detail { padding:14px !important; max-width:100%; }
  #root > main .toolbar, #root > main .calendar-controls,
  #root > main .calendar-filters { max-width:100%; min-width:0; flex-wrap:wrap; }
  #root > main :is(input,select,textarea) { max-width:100%; }
  #root > main .table-scroll { max-width:100%; overflow-x:auto; }
}
@media screen and (max-width:350px) {
  #root > main .heading h1 { font-size:24px !important; }
  #root > main .metric { max-width:72px !important; padding-left:8px !important; }
  #root > main .metric strong { font-size:23px !important; }
}