/* CRM DEMO 5.4.162 — consolidated responsive compatibility layer. Historical order intentionally preserved. */

/* ===== schedule-ai-5.4.90.css ===== */
/* CRM DEMO 5.4.90 — wymuszony układ dymka AI pod terminami.
   Osobny plik ma nową nazwę, więc nie może zostać pomylony ze starą wersją arkusza. */
.calendar-page .day.ai-hint-layout-fixed{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  height:auto !important;
  overflow:visible !important;
}
.calendar-page .day.ai-hint-layout-fixed > .date{
  flex:0 0 auto !important;
}
.calendar-page .day.ai-hint-layout-fixed > .day-events{
  position:relative !important;
  z-index:1 !important;
  flex:0 0 auto !important;
  width:100% !important;
  min-width:0 !important;
}
.calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline{
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  z-index:1 !important;
  display:flex !important;
  flex:0 0 auto !important;
  width:100% !important;
  max-width:100% !important;
  margin:6px 0 0 !important;
  transform:none !important;
  box-sizing:border-box !important;
}
.calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline:hover{
  transform:none !important;
}

/* ===== tablet-layout-5.4.91.css ===== */
/* CRM DEMO 5.4.91 — stabilny widok tabletu w pionie i poziomie.
   Tablet/natywna aplikacja używa układu mobilno-tabletowego niezależnie od tego,
   jaką szerokość CSS zgłosi WebView. Android rezerwuje miejsce na paski systemowe,
   dlatego nie dokładamy drugiego sztucznego bocznego insetu. */

html.crm-native-mobile,
html.crm-tablet-device{
  --crm-system-left:0px!important;
  --crm-system-right:0px!important;
}

/* W natywnej aplikacji Android system bars są obsługiwane przez warstwę natywną.
   Usuwamy dawny fallback 30/54 px, który po obrocie tworzył czarny pas z boku. */
html.crm-native-mobile.crm-system-nav-left,
html.crm-native-mobile.crm-system-nav-right{
  --tomzal-safe-left:env(safe-area-inset-left,0px)!important;
  --tomzal-safe-right:env(safe-area-inset-right,0px)!important;
}
html.crm-native-mobile.crm-system-nav-left body:not(.notebook-open) #app,
html.crm-native-mobile.crm-system-nav-right body:not(.notebook-open) #app{
  margin-left:0!important;
  margin-right:0!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:var(--tomzal-safe-left,0px)!important;
  padding-right:var(--tomzal-safe-right,0px)!important;
}
html.crm-native-mobile.crm-system-nav-left body:not(.notebook-open) .mobilebar,
html.crm-native-mobile.crm-system-nav-right body:not(.notebook-open) .mobilebar{
  left:0!important;
  right:0!important;
  width:100%!important;
}

/* Natywny tablet nigdy nie może wejść w desktopowy sidebar. */
html.crm-native-mobile .shell,
html.crm-tablet-device .shell{
  display:block!important;
  grid-template-columns:1fr!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}
html.crm-native-mobile .side,
html.crm-tablet-device .side{
  display:none!important;
  visibility:hidden!important;
}
html.crm-native-mobile .main,
html.crm-tablet-device .main{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}

html.crm-native-mobile .top,
html.crm-tablet-device .top{
  position:sticky!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  max-width:100%!important;
  min-height:66px!important;
  height:66px!important;
  padding:0 16px!important;
  background:#0b1220!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 2px 12px rgba(0,0,0,.16)!important;
  z-index:40!important;
}
html.crm-native-mobile .top h2,
html.crm-tablet-device .top h2{color:#fff!important;font-size:20px!important;line-height:1.15!important}
html.crm-native-mobile .top .eyebrow,
html.crm-tablet-device .top .eyebrow{color:#9aa9bd!important}
html.crm-native-mobile .top-actions,
html.crm-tablet-device .top-actions{height:100%!important;gap:10px!important}
html.crm-native-mobile .quick-add,
html.crm-tablet-device .quick-add{
  width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;
  background:#16243a!important;color:#fff!important;border:1px solid #2a3a52!important;
}
html.crm-native-mobile .quick-add b,
html.crm-tablet-device .quick-add b{display:none!important}
html.crm-native-mobile .notif-btn,
html.crm-tablet-device .notif-btn{height:44px!important;background:#16243a!important;color:#fff!important;border-color:#2a3a52!important}

html.crm-native-mobile .content,
html.crm-tablet-device .content{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:18px 18px 92px!important;
  overflow-x:hidden!important;
}
html.crm-native-mobile .welcome-actions,
html.crm-tablet-device .welcome-actions{display:none!important}

/* Dolna nawigacja ma być zawsze nad systemowym paskiem Androida / taskbarem Lenovo. */
html.crm-native-mobile body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
html.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  height:66px!important;
  min-height:66px!important;
  max-height:66px!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  padding:0!important;
  margin:0!important;
  background:#0b1220!important;
  border:0!important;
  box-shadow:0 -4px 18px rgba(0,0,0,.22)!important;
  z-index:2147482000!important;
}
html.crm-native-mobile .mobilebar button,
html.crm-tablet-device .mobilebar button{
  height:66px!important;min-width:0!important;padding:7px 2px 5px!important;
  background:#0b1220!important;color:#94a3b8!important;border:0!important;
}
html.crm-native-mobile .mobilebar button.active,
html.crm-tablet-device .mobilebar button.active{background:#152238!important;color:#fff!important}

/* TABLET PION — dwie czytelne kolumny. */
@media (orientation:portrait){
  html.crm-tablet-device .content{padding:18px 18px 94px!important}
  html.crm-tablet-device .dashboard-stats,
  html.crm-tablet-device .cards,
  html.crm-tablet-device .action-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
  html.crm-tablet-device .card,
  html.crm-tablet-device .action-card{padding:17px!important}
  html.crm-tablet-device .welcome h1{font-size:26px!important}
}

/* TABLET POZIOM — bez sidebara, więcej treści w jednym rzędzie. */
@media (orientation:landscape){
  html.crm-tablet-device .content{padding:16px 20px 92px!important}
  html.crm-tablet-device body[data-crm-view="dashboard"] .dashboard-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
  html.crm-tablet-device body[data-crm-view="dashboard"] .action-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important}
  html.crm-tablet-device .welcome{margin-bottom:16px!important}
  html.crm-tablet-device .welcome h1{font-size:24px!important}
  html.crm-tablet-device .section-title{margin-top:20px!important}
}

/* Telefony pozostają bez zmian; bardzo wąski pion tabletu też nie jest ściskany. */
@media (orientation:portrait) and (max-width:700px){
  html.crm-tablet-device .dashboard-stats,
  html.crm-tablet-device .cards,
  html.crm-tablet-device .action-grid{grid-template-columns:1fr!important}
  html.crm-tablet-device .content{padding-left:10px!important;padding-right:10px!important}
}

/* CRM DEMO 5.4.94 — tablet landscape scroll fix.
   W poziomie używamy dokładnie jednego scrollera (.content).
   To omija konflikt: globalny mobile CSS blokuje html/body, a 5.4.93
   próbował przewijać body bez odblokowania html. */
@media (orientation:landscape){
  

  html.crm-tablet-device body:not(.notebook-open) #app{
    height:var(--crm-vv-height,100dvh)!important;
    min-height:var(--crm-vv-height,100dvh)!important;
    max-height:var(--crm-vv-height,100dvh)!important;
  }

  html.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-tablet-device body:not(.notebook-open) .shell,
  html.crm-tablet-device body:not(.notebook-open) .main{
    display:flex!important;
    flex-direction:column!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }

  

  html.crm-tablet-device body:not(.notebook-open) .main>.content,
  html.crm-tablet-device body:not(.notebook-open) .main .content{
    height:0!important;
    padding:16px 20px 96px!important;
  }

  
}

/* ===== mobile-portrait-5.4.100.css ===== */
/* CRM DEMO 5.4.100 — mobile portrait full-width hardfix.
   Ochrona przed błędnym rozpoznaniem telefonu jako desktopu.
   Dotyczy wyłącznie pionowego viewportu <= 900 px. */
@media (orientation:portrait) and (max-width:900px){
  html .side,
  html.crm-desktop-device .side,
  html.crm-mobile-device .side{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
  }
  html .shell,
  html.crm-desktop-device .shell,
  html.crm-mobile-device .shell{
    display:block!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }
  html .main,
  html.crm-desktop-device .main,
  html.crm-mobile-device .main{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }
  html .top,
  html.crm-desktop-device .top,
  html.crm-mobile-device .top{
    left:0!important;
    right:0!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  html .content,
  html.crm-desktop-device .content,
  html.crm-mobile-device .content{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow-x:hidden!important;
  }
  html body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
}

/* ===== device-layout-5.4.101.css ===== */
/* CRM DEMO 5.4.101 — finalne rozdzielenie PHONE / TABLET.
   1) Telefon: dolna belka zawsze NAD systemowym paskiem Androida i bez sztucznych bocznych insetów.
   2) Tablet landscape: naturalny scroll dokumentu zamiast wysokości zamkniętej do visualViewport.
   Reguły nie dotyczą desktopu. */

/* =========================
   PHONE ONLY
   ========================= */
html.crm-mobile-device:not(.crm-tablet-device){
  --crm-system-left:0px!important;
  --crm-system-right:0px!important;
  --tomzal-safe-left:0px!important;
  --tomzal-safe-right:0px!important;
}

html.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #app{
  margin-left:0!important;
  margin-right:0!important;
  width:100%!important;
  max-width:100%!important;
  padding-left:0!important;
  padding-right:0!important;
}

html.crm-mobile-device:not(.crm-tablet-device) .shell,
html.crm-mobile-device:not(.crm-tablet-device) .main,
html.crm-mobile-device:not(.crm-tablet-device) .top{
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Tylko zwykły wewnętrzny oddech treści — żadnego czarnego/bocznego pasa aplikacji. */
html.crm-mobile-device:not(.crm-tablet-device) .content{
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:10px!important;
  padding-right:10px!important;
  box-sizing:border-box!important;
}

/* Native Android phone: tablet-layout 5.4.91 ustawiało bottom:0!important także na telefonach.
   Ta reguła ma wyższą specyficzność i podnosi pasek nad systemową nawigację. */
html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device)
body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:max(var(--crm-vv-bottom,0px),env(safe-area-inset-bottom,0px),var(--tomzal-safe-bottom,30px))!important;
  width:100%!important;
  max-width:100%!important;
  height:64px!important;
  min-height:64px!important;
  max-height:64px!important;
  margin:0!important;
  transform:none!important;
  z-index:2147483000!important;
}

/* Przeglądarka/PWA na telefonie — bez sztucznego 30px, korzysta z realnego safe-area/visualViewport. */
html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)
body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
  bottom:max(var(--crm-vv-bottom,0px),env(safe-area-inset-bottom,0px))!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  max-width:100%!important;
}

html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) .content{
  padding-bottom:calc(86px + max(var(--crm-vv-bottom,0px),env(safe-area-inset-bottom,0px),var(--tomzal-safe-bottom,30px)))!important;
}
html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device) .content{
  padding-bottom:calc(86px + max(var(--crm-vv-bottom,0px),env(safe-area-inset-bottom,0px)))!important;
}

/* =========================
   TABLET LANDSCAPE ONLY
   ========================= */
@media (orientation:landscape){
  

  /* Nie zamykamy całej strony w błędnie raportowanej wysokości visualViewport. */
  html.crm-tablet-device,
  html.crm-tablet-device body{
    height:auto!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
  }

  html.crm-tablet-device body:not(.notebook-open) #app{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    padding-left:0!important;
    padding-right:0!important;
    padding-bottom:0!important;
    overflow:visible!important;
  }

  html.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-tablet-device body:not(.notebook-open) .shell,
  html.crm-tablet-device body:not(.notebook-open) .main{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
  }

  html.crm-tablet-device body:not(.notebook-open) .main>.top{
    position:sticky!important;
    top:0!important;
    left:0!important;
    right:0!important;
    flex:none!important;
  }

  html.crm-tablet-device body:not(.notebook-open) .main>.content,
  html.crm-tablet-device body:not(.notebook-open) .main .content{
    min-height:calc(100dvh - 66px)!important;
    overflow-y:visible!important;
    overscroll-behavior-y:auto!important;
  }

  

  /* W landscape pasek systemowy jest z boku, więc dolna belka może zostać przy dolnej krawędzi WebView. */
  html.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    left:0!important;
    right:0!important;
    width:100%!important;
    max-width:100%!important;
  }
}

/* ===== tablet-landscape-5.4.102.css ===== */
/* CRM DEMO 5.4.102 — TABLET LANDSCAPE: pełna wysokość + czarny system navigation rail.
   Dotyczy WYŁĄCZNIE tabletu w poziomie. Telefon/desktop bez zmian.
   - nie używamy --crm-vv-height do wysokości głównego ekranu,
   - .content jest jedynym pionowym scrollerem,
   - aplikacja kończy się przed bocznymi przyciskami Androida,
   - czarny pas systemowy zostaje widoczny jak wcześniej. */

@media (orientation:landscape){
  /* Przywróć realny boczny inset wyliczony w JS. */
  html.crm-tablet-device.crm-system-nav-right{
    --tomzal-safe-left:0px!important;
    --tomzal-safe-right:var(--crm-system-right,54px)!important;
  }
  html.crm-tablet-device.crm-system-nav-left{
    --tomzal-safe-left:var(--crm-system-left,54px)!important;
    --tomzal-safe-right:0px!important;
  }

  /* Czarna strefa pod systemowymi przyciskami Androida. */
  html.crm-tablet-device.crm-system-nav-right body::after{
    content:""!important;
    display:block!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:auto!important;
    right:0!important;
    width:var(--crm-system-right,54px)!important;
    height:auto!important;
    min-height:0!important;
    background:#000!important;
    z-index:2147483646!important;
    pointer-events:none!important;
  }
  html.crm-tablet-device.crm-system-nav-left body::after{
    content:""!important;
    display:block!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:var(--crm-system-left,54px)!important;
    height:auto!important;
    min-height:0!important;
    background:#000!important;
    z-index:2147483646!important;
    pointer-events:none!important;
  }

  html.crm-tablet-device,
  html.crm-tablet-device body{
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    max-height:100%!important;
    margin:0!important;
    overflow:hidden!important;
    touch-action:pan-y!important;
    background:#000!important;
  }

  /* Cały ekran aplikacji jest fizycznie skrócony o boczny pasek Androida.
     100dvh jest stabilniejsze tutaj niż chwilowe visualViewport.height. */
  html.crm-tablet-device body:not(.notebook-open) #app{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:var(--crm-system-left,0px)!important;
    right:var(--crm-system-right,0px)!important;
    width:auto!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:var(--tomzal-safe-top,0px) 0 0!important;
    overflow:hidden!important;
    background:#000!important;
    box-sizing:border-box!important;
  }

  html.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-tablet-device body:not(.notebook-open) .shell{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:calc(100dvh - var(--tomzal-safe-top,0px))!important;
    min-height:0!important;
    max-height:calc(100dvh - var(--tomzal-safe-top,0px))!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }

  html.crm-tablet-device body:not(.notebook-open) #app>.shell>.main,
  html.crm-tablet-device body:not(.notebook-open) .main{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }

  html.crm-tablet-device body:not(.notebook-open) .main>.top{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    flex:0 0 66px!important;
    width:100%!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
    z-index:40!important;
  }

  html.crm-tablet-device body:not(.notebook-open) .main>.content,
  html.crm-tablet-device body:not(.notebook-open) .main .content{
    position:relative!important;
    display:block!important;
    flex:1 1 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:16px 20px 98px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-x:none!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    box-sizing:border-box!important;
  }

  /* Pulpit nie może odziedziczyć wcześniejszego width:95%, bo przy systemowym
     railu tworzył dodatkowe puste marginesy po bokach. */
  html.crm-tablet-device body[data-crm-view="dashboard"]:not(.notebook-open) #app>.shell>.main>.content{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  html.crm-tablet-device body:not(.notebook-open) .content .tablewrap,
  html.crm-tablet-device body:not(.notebook-open) .content .workflow-tablewrap,
  html.crm-tablet-device body:not(.notebook-open) .content .calendar-wrap,
  html.crm-tablet-device body:not(.notebook-open) .content .calendar-grid,
  html.crm-tablet-device body:not(.notebook-open) .content .calendar-board,
  html.crm-tablet-device body:not(.notebook-open) .content .calendar-table{
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Fixed względem viewportu, więc dostaje ten sam boczny inset co #app. */
  html.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    left:var(--crm-system-left,0px)!important;
    right:var(--crm-system-right,0px)!important;
    bottom:0!important;
    width:auto!important;
    max-width:none!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
  }
}


/* ===== TEN SAM HARD-FIX DLA NATYWNEJ APLIKACJI ANDROID (PHONE + TABLET) ===== */
/* CRM DEMO 5.4.102 — NATIVE ANDROID LANDSCAPE: pełna wysokość + czarny system navigation rail.
   Ten drugi blok dotyczy natywnej aplikacji Android w poziomie (telefon i tablet). Telefon/desktop bez zmian.
   - nie używamy --crm-vv-height do wysokości głównego ekranu,
   - .content jest jedynym pionowym scrollerem,
   - aplikacja kończy się przed bocznymi przyciskami Androida,
   - czarny pas systemowy zostaje widoczny jak wcześniej. */

@media (orientation:landscape){
  /* Przywróć realny boczny inset wyliczony w JS. */
  html.crm-native-mobile.crm-system-nav-right{
    --tomzal-safe-left:0px!important;
    --tomzal-safe-right:var(--crm-system-right,54px)!important;
  }
  html.crm-native-mobile.crm-system-nav-left{
    --tomzal-safe-left:var(--crm-system-left,54px)!important;
    --tomzal-safe-right:0px!important;
  }

  /* Czarna strefa pod systemowymi przyciskami Androida. */
  html.crm-native-mobile.crm-system-nav-right body::after{
    content:""!important;
    display:block!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:auto!important;
    right:0!important;
    width:var(--crm-system-right,54px)!important;
    height:auto!important;
    min-height:0!important;
    background:#000!important;
    z-index:2147483646!important;
    pointer-events:none!important;
  }
  html.crm-native-mobile.crm-system-nav-left body::after{
    content:""!important;
    display:block!important;
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:auto!important;
    width:var(--crm-system-left,54px)!important;
    height:auto!important;
    min-height:0!important;
    background:#000!important;
    z-index:2147483646!important;
    pointer-events:none!important;
  }

  html.crm-native-mobile,
  html.crm-native-mobile body{
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    max-height:100%!important;
    margin:0!important;
    overflow:hidden!important;
    touch-action:pan-y!important;
    background:#000!important;
  }

  /* Cały ekran aplikacji jest fizycznie skrócony o boczny pasek Androida.
     100dvh jest stabilniejsze tutaj niż chwilowe visualViewport.height. */
  html.crm-native-mobile body:not(.notebook-open) #app{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:var(--crm-system-left,0px)!important;
    right:var(--crm-system-right,0px)!important;
    width:auto!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:var(--tomzal-safe-top,0px) 0 0!important;
    overflow:hidden!important;
    background:#000!important;
    box-sizing:border-box!important;
  }

  html.crm-native-mobile body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile body:not(.notebook-open) .shell{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:calc(100dvh - var(--tomzal-safe-top,0px))!important;
    min-height:0!important;
    max-height:calc(100dvh - var(--tomzal-safe-top,0px))!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }

  html.crm-native-mobile body:not(.notebook-open) #app>.shell>.main,
  html.crm-native-mobile body:not(.notebook-open) .main{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:var(--bg)!important;
  }

  html.crm-native-mobile body:not(.notebook-open) .main>.top{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    flex:0 0 66px!important;
    width:100%!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
    z-index:40!important;
  }

  html.crm-native-mobile body:not(.notebook-open) .main>.content,
  html.crm-native-mobile body:not(.notebook-open) .main .content{
    position:relative!important;
    display:block!important;
    flex:1 1 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:16px 20px 98px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-x:none!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    box-sizing:border-box!important;
  }

  /* Pulpit nie może odziedziczyć wcześniejszego width:95%, bo przy systemowym
     railu tworzył dodatkowe puste marginesy po bokach. */
  html.crm-native-mobile body[data-crm-view="dashboard"]:not(.notebook-open) #app>.shell>.main>.content{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  html.crm-native-mobile body:not(.notebook-open) .content .tablewrap,
  html.crm-native-mobile body:not(.notebook-open) .content .workflow-tablewrap,
  html.crm-native-mobile body:not(.notebook-open) .content .calendar-wrap,
  html.crm-native-mobile body:not(.notebook-open) .content .calendar-grid,
  html.crm-native-mobile body:not(.notebook-open) .content .calendar-board,
  html.crm-native-mobile body:not(.notebook-open) .content .calendar-table{
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Fixed względem viewportu, więc dostaje ten sam boczny inset co #app. */
  html.crm-native-mobile body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    left:var(--crm-system-left,0px)!important;
    right:var(--crm-system-right,0px)!important;
    bottom:0!important;
    width:auto!important;
    max-width:none!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
  }
}

/* ===== phone-landscape-5.4.103.css ===== */
/* CRM DEMO 5.4.103 — PHONE LANDSCAPE WIDTH HOTFIX.
   Tylko natywna aplikacja Android na TELEFONIE w poziomie.
   Naprawia konflikt z tablet-layout-5.4.91.css: starszy, bardziej specyficzny selektor
   wymuszał width:100% na #app nawet po dodaniu bocznego insetu systemowego.
   Skutek: #app miał szerokość całego viewportu + left/right i prawa część UI była ucinana.
   Tablet, portrait i desktop pozostają bez zmian. */

@media (orientation:landscape){
  /* WAŻNE: selektory celowo mają większą specyficzność niż reguły 5.4.91. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left
  body:not(.notebook-open) #app{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:var(--crm-system-left,54px)!important;
    right:0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right
  body:not(.notebook-open) #app{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:var(--crm-system-right,54px)!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  /* Główne kontenery liczą 100% już od realnej szerokości #app po odjęciu paska Androida. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left body:not(.notebook-open) #app .main,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right body:not(.notebook-open) #app .main,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left body:not(.notebook-open) #app .top,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right body:not(.notebook-open) #app .top,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left body:not(.notebook-open) #app .content,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right body:not(.notebook-open) #app .content{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }

  /* Fixed mobilebar też wcześniej przegrywał z bardziej specyficznym selektorem 5.4.91. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-left
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    left:var(--crm-system-left,54px)!important;
    right:0!important;
    width:auto!important;
    max-width:none!important;
  }

  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device).crm-system-nav-right
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    left:0!important;
    right:var(--crm-system-right,54px)!important;
    width:auto!important;
    max-width:none!important;
  }

  /* Żaden główny panel telefonu nie może rozszerzyć rodzica ponownie do szerokości viewportu. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #content,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #content>.card,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #content>.toolbar{
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  /* Umowy: pole wyszukiwania może się skurczyć zamiast wypychać przycisk poza ekran.
     Nie zmieniamy układu tabletu. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) .contract-toolbar{
    max-width:100%!important;
    min-width:0!important;
  }
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) .contract-toolbar>input{
    min-width:0!important;
    flex:1 1 180px!important;
    max-width:100%!important;
  }
}

/* ===== tablet-landscape-5.4.104.css ===== */
/* CRM DEMO 5.4.104 — TABLET LANDSCAPE FULL-WIDTH HOTFIX.
   TYLKO tablet w poziomie. Telefon pozostaje dokładnie na regułach 5.4.103.

   Przyczyna: tablet potrafił dostać jednocześnie boczny offset #app oraz safe-area padding
   z wcześniejszych reguł 5.4.91/5.4.102. Dawało to podwójne odsunięcie z jednej strony,
   czarną pustą przestrzeń i wypychanie prawej części nagłówka poza ekran.

   Tablet z systemowymi przyciskami Androida na DOLE nie potrzebuje bocznego raila w CSS.
   Dolny czarny pasek systemowy pozostaje obsługiwany przez Android/WebView. */

@media (orientation:landscape){
  /* Zerujemy wyłącznie boczne insets TABLETU. Telefon ma osobny hotfix 5.4.103. */
  html.crm-tablet-device{
    --crm-system-left:0px!important;
    --crm-system-right:0px!important;
    --tomzal-safe-left:0px!important;
    --tomzal-safe-right:0px!important;
  }

  /* Nie rysuj sztucznego bocznego czarnego raila na tablecie. */
  html.crm-tablet-device.crm-system-nav-left body::after,
  html.crm-tablet-device.crm-system-nav-right body::after,
  html.crm-native-mobile.crm-tablet-device.crm-system-nav-left body::after,
  html.crm-native-mobile.crm-tablet-device.crm-system-nav-right body::after{
    content:none!important;
    display:none!important;
    width:0!important;
  }

  /* Większa specyficzność niż 5.4.91/5.4.102: #app ma dokładnie szerokość viewportu tabletu. */
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app,
  html.crm-native-mobile.crm-tablet-device.crm-system-nav-left body:not(.notebook-open) #app,
  html.crm-native-mobile.crm-tablet-device.crm-system-nav-right body:not(.notebook-open) #app,
  html.crm-tablet-device body:not(.notebook-open) #app{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  /* Wszystkie główne warstwy liczą szerokość od już poprawnego #app. */
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app .main,
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app .top,
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app .content,
  html.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-tablet-device body:not(.notebook-open) #app .main,
  html.crm-tablet-device body:not(.notebook-open) #app .top,
  html.crm-tablet-device body:not(.notebook-open) #app .content{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }

  /* Pulpit tabletu ma być pełny, bez odziedziczonych 95% ani auto-marginów. */
  html.crm-native-mobile.crm-tablet-device body[data-crm-view="dashboard"]:not(.notebook-open) #app .content,
  html.crm-tablet-device body[data-crm-view="dashboard"]:not(.notebook-open) #app .content{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  /* Dolna belka tabletu również od krawędzi do krawędzi WebView. */
  html.crm-native-mobile.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
  html.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    left:0!important;
    right:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  /* Nagłówek nie może wyjechać poza prawą krawędź po skasowaniu podwójnego insetu. */
  html.crm-native-mobile.crm-tablet-device .top-actions,
  html.crm-tablet-device .top-actions{
    min-width:0!important;
    max-width:100%!important;
  }
}

/* ===== tablet-ui-5.4.105.css ===== */
/* CRM DEMO 5.4.105 — TABLET UI HOTFIX.
   TYLKO html.crm-tablet-device. Telefon pozostaje na regułach 5.4.103.
   1) Wiadomości: cały composer + przycisk Wyślij zawsze nad dolną nawigacją.
   2) Klienci: tabela aktywnych klientów mieści pełną kolumnę Akcje na tablecie.
   3) Desktop: przycisk Wyślij w czacie ma stałe położenie po prawej. */

/* =========================================================
   TABLET — WIADOMOŚCI, PORTRAIT + LANDSCAPE
   ========================================================= */
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open{
  position:fixed!important;
  top:var(--crm-chat-top,66px)!important;
  bottom:var(--crm-chat-bottom,72px)!important;
  left:var(--crm-system-left,0px)!important;
  right:var(--crm-system-right,0px)!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  z-index:900!important;
}

/* Tablet ma nadal widzieć listę rozmów i rozmowę obok siebie. */
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-sidebar{
  display:block!important;
  min-width:0!important;
  max-height:none!important;
  overflow:hidden!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-conversations{
  height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-pane{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:none!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-thread{
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-compose{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:10px 12px 11px!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  background:#fff!important;
  z-index:8!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-compose-input{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 48px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-compose textarea{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-compose-bottom{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:42px!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-file-name{
  min-width:0!important;
  max-width:55%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .crm-draft-indicator{
  flex:0 1 auto!important;
  min-width:0!important;
}
html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-send-btn{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:104px!important;
  max-width:none!important;
  min-height:40px!important;
  margin-left:auto!important;
  padding:9px 14px!important;
  white-space:nowrap!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
}

/* W portrait na tablecie proporcje 32/68 dają więcej miejsca rozmowie. */


/* =========================================================
   TABLET — KLIENCI: pełne przyciski bez uciekania w prawo
   ========================================================= */
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .tablewrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table th,
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table td{
  min-width:0!important;
  box-sizing:border-box!important;
  overflow-wrap:anywhere!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table th:nth-child(1),
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table td:nth-child(1){width:24%!important;}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table th:nth-child(2),
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table td:nth-child(2){width:17%!important;}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table th:nth-child(3),
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table td:nth-child(3){width:13%!important;}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table th:last-child,
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .table td:last-child{
  width:46%!important;
  min-width:0!important;
  max-width:46%!important;
  padding-left:8px!important;
  padding-right:8px!important;
  overflow:hidden!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .customer-actions{
  display:grid!important;
  grid-template-columns:1fr!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  gap:6px!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .customer-actions-row{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  gap:6px!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .customer-actions .btn{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:38px!important;
  margin:0!important;
  padding:7px 6px!important;
  font-size:11px!important;
  line-height:1.12!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  border-radius:10px!important;
  box-sizing:border-box!important;
}
html.crm-tablet-device body[data-crm-view="customers"] .customer-list-card:not(.archive-mode) .badge{
  font-size:10px!important;
  line-height:1.15!important;
  padding-left:8px!important;
  padding-right:8px!important;
}

/* =========================================================
   DESKTOP — Wyślij zawsze po prawej w rozmowie
   ========================================================= */
html.crm-desktop-device body[data-crm-view="messages"] .chat-compose-bottom{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  gap:8px!important;
  box-sizing:border-box!important;
}
html.crm-desktop-device body[data-crm-view="messages"] .chat-compose-bottom .chat-file-name{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
html.crm-desktop-device body[data-crm-view="messages"] .chat-compose-bottom .chat-send-btn{
  display:inline-flex!important;
  flex:0 0 auto!important;
  margin-left:auto!important;
  margin-right:0!important;
  min-width:110px!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
}
html.crm-desktop-device .message-compose-inline-actions,
html.crm-desktop-device #modal.modal-message-compose .message-compose-actions{
  justify-content:flex-end!important;
}
html.crm-desktop-device .message-compose-inline-actions .btn.primary,
html.crm-desktop-device #modal.modal-message-compose .message-compose-actions .btn.primary{
  margin-left:0!important;
  margin-right:0!important;
}

/* ===== tablet-messages-portrait-5.4.106.css ===== */
/* CRM DEMO 5.4.106 — TABLET PORTRAIT MESSAGES HOTFIX.
   Tylko tablet w pionie. Przywraca normalny (niefixed) układ Wiadomości z 5.4.104,
   zachowując pełną wysokość do górnej krawędzi dolnej nawigacji i widoczny przycisk Wyślij.
   Telefon, tablet landscape, Klienci i desktop pozostają bez zmian. */

@media (orientation:portrait){
  /* 5.4.105 ustawiał cały czat jako fixed. W pionie tabletu wracamy do normalnego
     miejsca w layoucie, ale wysokość nadal kończy się dokładnie nad mobilebar. */
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:100%!important;
    height:calc(100dvh - var(--crm-chat-top,66px) - var(--crm-chat-bottom,66px))!important;
    min-height:0!important;
    max-height:calc(100dvh - var(--crm-chat-top,66px) - var(--crm-chat-bottom,66px))!important;
    margin:0!important;
    overflow:hidden!important;
    z-index:auto!important;
    box-sizing:border-box!important;
    grid-template-columns:minmax(250px,32%) minmax(0,1fr)!important;
  }

  /* Lewa lista rozmów ma własny scroll i nie rozpycha całego czatu. */
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-sidebar{
    display:flex!important;
    flex-direction:column!important;
    width:auto!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-sidebar-head{
    flex:0 0 auto!important;
  }
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-conversations{
    flex:1 1 auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Prawa część rozmowy mieści header + historię + composer w dostępnej wysokości. */
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-pane{
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-thread{
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-compose{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.mobile-chat-open .chat-send-btn{
    display:inline-flex!important;
    visibility:visible!important;
    opacity:1!important;
    margin-left:auto!important;
  }
}

/* ===== browser-landscape-5.4.107.css ===== */
/* CRM DEMO 5.4.107 — BROWSER LANDSCAPE FULL-HEIGHT FIX.
   TYLKO mobilna przeglądarka (Chrome/Samsung Internet/PWA uruchomione jako strona)
   na tablecie/dużym urządzeniu w poziomie.

   Przyczyna: klasy crm-browser-mobile + crm-tablet-device uruchamiały jednocześnie
   tabletowe hard-fixy 5.4.102/5.4.104 przeznaczone głównie dla natywnego WebView.
   #app był wtedy position:fixed i zamykany do 100dvh, podczas gdy przeglądarka ma
   dynamiczny pasek adresu / visual viewport. Efektem było ucięcie .content od dołu
   i duży martwy obszar nad dolną nawigacją.

   W przeglądarce wracamy do naturalnego scrolla dokumentu. Native Android pozostaje
   dokładnie na regułach 5.4.102–5.4.106. */

@media (orientation:landscape){
  html.crm-browser-mobile.crm-tablet-device,
  html.crm-browser-mobile.crm-tablet-device body{
    position:static!important;
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    max-height:none!important;
    margin:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:var(--bg)!important;
  }

  /* W przeglądarce nie rysujemy żadnych sztucznych raili Android WebView. */
  html.crm-browser-mobile.crm-tablet-device body::before,
  html.crm-browser-mobile.crm-tablet-device body::after{
    content:none!important;
    display:none!important;
    width:0!important;
    height:0!important;
  }

  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) #app{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:var(--crm-vv-height,100dvh)!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
    background:var(--bg)!important;
  }

  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .shell,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .main{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .main>.top{
    position:sticky!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
    z-index:40!important;
    box-sizing:border-box!important;
  }

  /* Treść ma minimum całą realnie widoczną wysokość przeglądarki i przewija się
     razem z dokumentem. Dzięki temu nie może skończyć się w połowie ekranu. */
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .main>.content,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .main .content{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:calc(var(--crm-vv-height,100dvh) - 66px)!important;
    max-height:none!important;
    margin:0!important;
    padding:12px 12px 88px!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .tablewrap,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .workflow-tablewrap,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .calendar-wrap,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .calendar-grid,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .calendar-board,
  html.crm-browser-mobile.crm-tablet-device body:not(.notebook-open) .content .calendar-table{
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Dolna nawigacja przeglądarki pozostaje przy dolnej krawędzi widocznego viewportu.
     Nie dziedziczy już geometrycznych offsetów przeznaczonych dla natywnego WebView. */
  html.crm-browser-mobile.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:max(env(safe-area-inset-bottom,0px),0px)!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    padding-left:env(safe-area-inset-left,0px)!important;
    padding-right:env(safe-area-inset-right,0px)!important;
    box-sizing:border-box!important;
  }
}

/* ===== tablet-portrait-nav-5.4.108.css ===== */
/* CRM DEMO 5.4.108 — TABLET PORTRAIT NAV ONLY.
   Celowo TYLKO dolna nawigacja na tablecie w pionie.
   Bez zmian telefonu, landscape, contentu, tabel, wiadomości i scrollowania. */
@media (orientation:portrait){
  html.crm-tablet-device body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
  html[data-crm-form-factor="tablet"] body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
    padding:0!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    transform:none!important;
    clip:auto!important;
    overflow:visible!important;
    z-index:2147482000!important;
    box-sizing:border-box!important;
  }
}

/* ===== portrait-systembars-tablet-nav-5.4.109.css ===== */
/* CRM DEMO 5.4.109 — PORTRAIT SYSTEM BARS + TABLET NAV ONLY.
   Zakres celowo bardzo wąski:
   1) natywna aplikacja Android w pionie: bez dublowania safe-area, bo WebView jest już
      osadzony pomiędzy systemowym paskiem stanu i paskiem nawigacji Androida;
   2) tablet dotykowy w pionie: dolna nawigacja ma być widoczna niezależnie od tego,
      czy wcześniejszy detektor zachował klasę crm-tablet-device po obrocie.
   Brak zmian landscape, tabel, wiadomości, desktopu i pozostałych modułów. */

@media (orientation:portrait){
  /* Native Android już dostaje obszar roboczy pomniejszony przez system bars.
     Nie dokładamy drugi raz env(safe-area-inset-top/bottom), bo tworzyło to
     nienaturalnie wysokie czarne pasy nad i pod CRM. */
  html.crm-native-mobile{
    --tomzal-safe-top:0px!important;
    --tomzal-safe-bottom:0px!important;
  }

  html.crm-native-mobile body::before,
  html.crm-native-mobile body::after,
  html.crm-native-mobile #app::before,
  html.crm-native-mobile #app::after{
    display:none!important;
    content:none!important;
    height:0!important;
    min-height:0!important;
    width:0!important;
  }

  html.crm-native-mobile body:not(.notebook-open) #app{
    padding-top:0!important;
    padding-bottom:0!important;
    min-height:100dvh!important;
  }

  html.crm-native-mobile body:not(.tomzal-modal-open):not(.notebook-open) .mobilebar{
    bottom:0!important;
  }

  html.crm-native-mobile body:not(.notebook-open) .content{
    padding-bottom:86px!important;
  }

  /* Twardy fallback tabletu portrait. Klasa guard jest ustawiana tylko na dużym
     urządzeniu dotykowym; nie zmienia całego layoutu, wymusza wyłącznie mobilebar. */
  html.crm-tablet-portrait-nav-guard body:not(.tomzal-modal-open):not(.notebook-open) .mobilebar,
  html.crm-tablet-device body:not(.tomzal-modal-open):not(.notebook-open) .mobilebar,
  html[data-crm-form-factor="tablet"] body:not(.tomzal-modal-open):not(.notebook-open) .mobilebar{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin:0!important;
    padding:0!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    transform:none!important;
    clip:auto!important;
    overflow:visible!important;
    z-index:2147483000!important;
    box-sizing:border-box!important;
  }

  html.crm-tablet-portrait-nav-guard body:not(.notebook-open) .content{
    padding-bottom:94px!important;
  }
}

/* ===== native-viewport-gap-fix-5.4.110.css ===== */
/* CRM DEMO 5.4.110 — NATIVE VIEWPORT GAP FIX ONLY.
   Zakres: natywna aplikacja Android, bez klawiatury ekranowej.
   Android/WebView już rezerwuje miejsce dla systemowych pasków, dlatego nie wolno
   ponownie odejmować visualViewport/safe-area od warstw CRM.
   Nie zmienia tabel, wiadomości, desktopu ani przeglądarki. */

/* Gdy klawiatura jest zamknięta, offsety visualViewport nie są insetami CRM.
   Klawiatura nadal korzysta z oryginalnych zmiennych po dodaniu crm-keyboard-open. */
html.crm-native-mobile:not(.crm-keyboard-open){
  --crm-vv-left:0px!important;
  --crm-vv-top:0px!important;
  --crm-vv-right:0px!important;
  --crm-vv-bottom:0px!important;
}

/* Telefon/tablet w pionie: WebView kończy się przed paskami Androida.
   Dolna belka ma więc leżeć dokładnie przy dolnej krawędzi WebView — bez drugiego insetu. */
@media (orientation:portrait){
  

  html.crm-native-mobile:not(.crm-keyboard-open) body:not(.notebook-open) .content{
    padding-bottom:86px!important;
  }

  /* Globalne wyszukiwanie ma wypełniać dokładnie obszar WebView, bez pustego pasa
     nad nagłówkiem i pod treścią. */
  html.crm-native-mobile:not(.crm-keyboard-open) .crm-command-layer{
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    padding:0!important;
  }

  html.crm-native-mobile:not(.crm-keyboard-open) .crm-command-shell{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:100%!important;
    margin:0!important;
  }
}

/* Landscape: góra/dół nie potrzebują safe-area. Zostawiamy WYŁĄCZNIE realny boczny
   pasek systemowy wyliczony przez crm-system-left/right (poprawki 5.4.102–5.4.104). */
@media (orientation:landscape){
  html.crm-native-mobile:not(.crm-keyboard-open) .crm-command-layer{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    left:var(--crm-system-left,0px)!important;
    right:var(--crm-system-right,0px)!important;
    width:auto!important;
    height:auto!important;
    max-width:none!important;
    max-height:none!important;
    padding:0!important;
  }

  html.crm-native-mobile:not(.crm-keyboard-open) .crm-command-shell{
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:100%!important;
    margin:0!important;
    border-radius:0!important;
  }
}

/* ===== portrait-nav-gap-5.4.111.css ===== */
/* CRM DEMO 5.4.111 — PORTRAIT NAV GAP ONLY.
   Zakres: wyłącznie dolna belka nawigacji w pionie w natywnej aplikacji
   oraz w trybie standalone/PWA. Bez zmian layoutu, tabel, wiadomości,
   landscape, desktopu i przeglądarki uruchomionej normalnie w karcie.

   Na części urządzeń Android aplikacja działa jako standalone/PWA zamiast
   otrzymać klasę crm-native-mobile. Wtedy starsza reguła pozostawiała
   bottom: env(safe-area-inset-bottom), mimo że system już odsunął viewport
   od paska nawigacyjnego. Powstawał biały pas pod .mobilebar. */

@media (orientation:portrait){
  html.crm-native-mobile:not(.crm-keyboard-open)
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    bottom:0!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
}

@media (orientation:portrait) and (display-mode:standalone){
  html.crm-mobile-device:not(.crm-keyboard-open)
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    bottom:0!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
}

/* ===== phone-app-portrait-nav-bottom-5.4.112.css ===== */
/* CRM DEMO 5.4.112 — PHONE APP PORTRAIT NAV BOTTOM ONLY.
   Zakres: wyłącznie telefon Android uruchomiony wewnątrz WebView aplikacji, portrait.
   Nie dotyka tabletu, zwykłej przeglądarki, PWA, landscape ani innych modułów.

   Część wersji APK nie wystawia Capacitor/TOMZALCRM-NATIVE, ale Android WebView
   identyfikuje się tokenem "wv" / "Version/4.0". Klasa crm-android-webview-app
   jest dodawana w <head> zanim wczyta się layout. Na telefonie WebView już kończy
   obszar strony nad systemowym paskiem Androida, więc dodatkowy bottom/safe-area
   pod .mobilebar tworzył widoczną jasną przerwę. */
@media (orientation:portrait) and (max-width:599px){
  html.crm-android-webview-app:not(.crm-tablet-device){
    --tomzal-safe-bottom:0px!important;
    --crm-vv-bottom:0px!important;
    --crm-safe-bottom:0px!important;
  }

  html.crm-android-webview-app:not(.crm-tablet-device) body:not(.notebook-open) #app{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  html.crm-android-webview-app:not(.crm-tablet-device)
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    margin:0!important;
    margin-bottom:0!important;
    padding-bottom:0!important;
    transform:none!important;
  }
}

/* ===== phone-app-nav-anchor-5.4.113.css ===== */
/* CRM DEMO 5.4.113 — PHONE APP PORTRAIT NAV ANCHOR.
   Tylko telefon Android uruchomiony jako aplikacja / WebView, portrait.
   Naprawia przyczynę: #app był skracany przez --crm-vv-height / --crm-vv-bottom,
   więc mobilebar z bottom:0 kończył się kilkadziesiąt px nad realnym dołem WebView. */
@media (orientation:portrait) and (max-width:599px){
  html.crm-phone-app-runtime:not(.crm-tablet-device),
  html.crm-android-app-runtime:not(.crm-tablet-device),
  html.crm-server-android-app:not(.crm-tablet-device),
  html.crm-android-webview-app:not(.crm-tablet-device){
    --crm-vv-bottom:0px!important;
    --crm-safe-bottom:0px!important;
    --tomzal-safe-bottom:0px!important;
    --crm-vv-height:100dvh!important;
  }

  html.crm-phone-app-runtime:not(.crm-tablet-device) body:not(.notebook-open) #app,
  html.crm-android-app-runtime:not(.crm-tablet-device) body:not(.notebook-open) #app,
  html.crm-server-android-app:not(.crm-tablet-device) body:not(.notebook-open) #app,
  html.crm-android-webview-app:not(.crm-tablet-device) body:not(.notebook-open) #app{
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  html.crm-phone-app-runtime:not(.crm-tablet-device) body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
  html.crm-android-app-runtime:not(.crm-tablet-device) body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
  html.crm-server-android-app:not(.crm-tablet-device) body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar,
  html.crm-android-webview-app:not(.crm-tablet-device) body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    margin:0!important;
    padding-bottom:0!important;
    transform:none!important;
  }

  html.crm-phone-app-runtime:not(.crm-tablet-device) body:not(.notebook-open) .content,
  html.crm-android-app-runtime:not(.crm-tablet-device) body:not(.notebook-open) .content,
  html.crm-server-android-app:not(.crm-tablet-device) body:not(.notebook-open) .content,
  html.crm-android-webview-app:not(.crm-tablet-device) body:not(.notebook-open) .content{
    padding-bottom:86px!important;
  }
}

/* ===== phone-landscape-top-gap-5.4.115.css ===== */
/* CRM DEMO 5.4.115 — PHONE APP LANDSCAPE TOP GAP ONLY.
   Zakres: wyłącznie telefon w natywnej aplikacji Android, orientacja pozioma.
   Android/WebView już rezerwuje pionową strefę status bara. Nie dodajemy drugi raz
   --tomzal-safe-top / safe-area do #app. Tablet, portrait i browser bez zmian. */
@media (orientation:landscape) and (pointer:coarse){
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device),
  html[data-crm-runtime="native"][data-crm-form-factor="phone"]{
    --tomzal-safe-top:0px!important;
    --crm-safe-top:0px!important;
    --crm-vv-top:0px!important;
  }

  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body::before,
  html[data-crm-runtime="native"][data-crm-form-factor="phone"] body::before{
    height:0!important;
    min-height:0!important;
    display:none!important;
  }

  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #app,
  html[data-crm-runtime="native"][data-crm-form-factor="phone"] body:not(.notebook-open) #app{
    top:0!important;
    padding-top:0!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
  }

  /* 5.4.102 odejmowało safe-top również od .shell. Po wyzerowaniu górnego insetu
     shell ma dokładnie wysokość dostępnego WebView, bez czarnej szczeliny u góry. */
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile.crm-mobile-device:not(.crm-tablet-device) body:not(.notebook-open) .shell,
  html[data-crm-runtime="native"][data-crm-form-factor="phone"] body:not(.notebook-open) #app>.shell,
  html[data-crm-runtime="native"][data-crm-form-factor="phone"] body:not(.notebook-open) .shell{
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
  }
}

/* ===== tablet-app-top-gap-5.4.116.css ===== */
/* CRM DEMO 5.4.116 — TABLET APP TOP GAP ONLY.
   Zakres: WYŁĄCZNIE tablet uruchomiony jako aplikacja Android.
   Telefon, zwykła przeglądarka i desktop bez zmian.

   Android/WebView już rezerwuje obszar paska statusu. Starsze reguły CRM
   dodawały drugi --tomzal-safe-top / body::before, tworząc czarną szczelinę
   nad nagłówkiem. Na tablecie aplikacyjnym ten drugi inset musi być równy 0. */

html.crm-native-mobile.crm-tablet-device,
html.crm-android-app-runtime.crm-tablet-device,
html[data-crm-runtime="native"][data-crm-form-factor="tablet"]{
  --tomzal-safe-top:0px!important;
  --crm-safe-top:0px!important;
  --crm-vv-top:0px!important;
}

html.crm-native-mobile.crm-tablet-device body::before,
html.crm-android-app-runtime.crm-tablet-device body::before,
html[data-crm-runtime="native"][data-crm-form-factor="tablet"] body::before{
  content:none!important;
  display:none!important;
  top:0!important;
  height:0!important;
  min-height:0!important;
}

html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app,
html.crm-android-app-runtime.crm-tablet-device body:not(.notebook-open) #app,
html[data-crm-runtime="native"][data-crm-form-factor="tablet"] body:not(.notebook-open) #app{
  top:0!important;
  padding-top:0!important;
}

/* 5.4.102 liczyło wysokość shell od safe-top. Po jego wyzerowaniu tablet ma
   wykorzystać pełną wysokość WebView, bez pustego czarnego pasa u góry. */
@media (orientation:landscape){
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-native-mobile.crm-tablet-device body:not(.notebook-open) .shell,
  html.crm-android-app-runtime.crm-tablet-device body:not(.notebook-open) #app>.shell,
  html.crm-android-app-runtime.crm-tablet-device body:not(.notebook-open) .shell,
  html[data-crm-runtime="native"][data-crm-form-factor="tablet"] body:not(.notebook-open) #app>.shell,
  html[data-crm-runtime="native"][data-crm-form-factor="tablet"] body:not(.notebook-open) .shell{
    height:100dvh!important;
    max-height:100dvh!important;
  }
}

/* ===== browser-phone-landscape-5.4.117.css ===== */
/* CRM DEMO 5.4.117 — PHONE MOBILE BROWSER LANDSCAPE FULL WINDOW FIX.
   TYLKO zwykła mobilna przeglądarka na TELEFONIE w poziomie.
   Nie dotyczy natywnej aplikacji Android, tabletu ani portrait.

   5.4.107 naprawiał pełną wysokość wyłącznie dla .crm-tablet-device.
   Telefon z .crm-browser-mobile pozostawał na starszej geometrii i po obrocie
   mógł zostać zamknięty w niskim/wąskim obszarze. Tutaj przywracamy naturalną
   geometrię dokumentu i minimum równe realnemu visualViewport przeglądarki. */

@media (orientation:landscape){
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"],
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:100%!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body::before,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body::after,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] #app::before,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] #app::after{
    content:none!important;
    display:none!important;
    width:0!important;
    height:0!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) #app{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:var(--crm-vv-height,100dvh)!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) #app>.shell,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .shell,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .main{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:var(--crm-vv-height,100dvh)!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .main>.top{
    position:sticky!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    box-sizing:border-box!important;
    z-index:40!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .main>.content,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .main .content{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:calc(var(--crm-vv-height,100dvh) - 58px)!important;
    max-height:none!important;
    margin:0!important;
    padding:10px 10px calc(74px + env(safe-area-inset-bottom,0px))!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
    touch-action:pan-y!important;
    overscroll-behavior-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content>*{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .tablewrap,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .workflow-tablewrap,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .calendar-wrap,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .calendar-grid,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .calendar-board,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"] body:not(.notebook-open) .content .calendar-table{
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:max(var(--crm-vv-bottom,0px),env(safe-area-inset-bottom,0px))!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
}

/* ===== browser-phone-landscape-buttons-5.4.118.css ===== */
/* CRM DEMO 5.4.118 — PHONE MOBILE BROWSER LANDSCAPE TABLE BUTTONS FIX.
   WYŁĄCZNIE: zwykła mobilna przeglądarka + telefon + orientacja pozioma.
   Nie dotyczy aplikacji Android, tabletu ani telefonu w pionie.

   Cel: zdjąć desktopowe minimalne szerokości akcji w Klientach i Sprawach,
   aby cała kolumna przycisków mieściła się w dostępnym oknie przeglądarki. */

@media (orientation:landscape){
  /* ===== KLIENCI ===== */
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .tablewrap{
    width:100%!important;
    max-width:100%!important;
  }

  

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td{
    padding-left:7px!important;
    padding-right:7px!important;
    word-break:normal!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:nth-child(1),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:nth-child(1){width:24%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:nth-child(2),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:nth-child(2){width:22%!important}

  

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:last-child,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:last-child{
    width:41%!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions{
    gap:5px!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions-row{
    gap:5px!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions .btn{
    min-height:34px!important;
    padding:5px 4px!important;
    font-size:10.5px!important;
    line-height:1.08!important;
    word-break:normal!important;
    border-radius:9px!important;
  }

  /* ===== SPRAWY ===== */
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-tablewrap{
    width:100%!important;
    max-width:100%!important;
  }

  

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td{
    padding-left:7px!important;
    padding-right:7px!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(2),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(2){width:18%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(3),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(3){width:27%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(4),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(4){width:32%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-actions,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions{
    gap:4px!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-actions .btn,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions .btn{
    min-height:36px!important;
    padding:5px 3px!important;
    font-size:10.5px!important;
    line-height:1.08!important;
    word-break:normal!important;
    border-radius:9px!important;
  }

  
}

/* ===== browser-phone-landscape-5.4.119.css ===== */
/* CRM DEMO 5.4.119 — PHONE BROWSER LANDSCAPE BUTTONS + PAGE SCROLL.
   WYŁĄCZNIE: zwykła mobilna przeglądarka + telefon + orientacja pozioma.
   Nie dotyczy natywnej aplikacji Android, tabletu ani telefonu w pionie.

   1) Przyciski pozostają czytelne — bez mikroskopijnego 10.5px. Zamiast tego
      zwiększamy realną szerokość kolumny akcji i pozwalamy etykietom zawijać się.
   2) Tabele nie tworzą pionowego scrollera i nie blokują pionowego gestu dokumentu.
      Sam stary JS transferujący gest do .content jest wyłączony dla browser+phone. */

@media (orientation:landscape){
  /* ===== wspólne zachowanie tabel w przeglądarce telefonu ===== */
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body:not(.notebook-open) .content .tablewrap,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body:not(.notebook-open) .content .workflow-tablewrap{
    height:auto!important;
    max-height:none!important;
    overflow-y:visible!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* ===== KLIENCI ===== */
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .tablewrap{
    overflow-x:hidden!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:fixed!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td{
    min-width:0!important;
    max-width:none!important;
    padding-left:6px!important;
    padding-right:6px!important;
    overflow:visible!important;
    overflow-wrap:anywhere!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:nth-child(1),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:nth-child(1){width:22%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:nth-child(2),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:nth-child(2){width:19%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:nth-child(3),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:nth-child(3){width:13%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table th:last-child,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-list-card .table td:last-child{
    width:46%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:6px!important;
    align-items:stretch!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:6px!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="customers"] .customer-actions .btn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:40px!important;
    padding:7px 6px!important;
    margin:0!important;
    font-size:12.5px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:normal!important;
    word-break:keep-all!important;
    hyphens:none!important;
    text-align:center!important;
    border-radius:10px!important;
    box-sizing:border-box!important;
  }

  /* ===== SPRAWY ===== */
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-tablewrap{
    overflow-x:hidden!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:fixed!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td{
    min-width:0!important;
    max-width:none!important;
    padding-left:6px!important;
    padding-right:6px!important;
    overflow:visible!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(1),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(1){width:23%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(2),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(2){width:16%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(3),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(3){width:24%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table th:nth-child(4),
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-table td:nth-child(4){width:37%!important}

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-actions,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:5px!important;
    align-items:stretch!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-actions .btn,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions .btn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:42px!important;
    padding:7px 5px!important;
    margin:0!important;
    font-size:12px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:normal!important;
    word-break:keep-all!important;
    hyphens:none!important;
    text-align:center!important;
    border-radius:10px!important;
    box-sizing:border-box!important;
  }

  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-lead-card b,
  html.crm-browser-mobile.crm-mobile-device:not(.crm-tablet-device)[data-crm-runtime="browser"][data-crm-form-factor="phone"]
  body[data-crm-view="tasks"] .workflow-card .workflow-lead-card span{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

/* ===== browser-mobile-table-page-scroll-5.4.120.css ===== */
/* CRM DEMO 5.4.120 — MOBILE BROWSER TABLE -> PAGE SCROLL HARD FIX.
   WYŁĄCZNIE crm-browser-mobile w poziomie. Aplikacji natywnej nie dotyczy.

   Klienci/Sprawy są już dopasowane do szerokości w 5.4.119, więc ich wrapper
   nie musi być osobnym poziomym scrollerem. Pozostawiamy gest pionowy przeglądarce
   i dokumentowi — można rozpocząć przewijanie na td/th/przycisku. */

@media (orientation:landscape) and (pointer:coarse){
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .tablewrap,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-tablewrap{
    overflow:visible!important;
    overflow-x:visible!important;
    overflow-y:visible!important;
    overscroll-behavior:auto!important;
    touch-action:pan-y pinch-zoom!important;
    -webkit-overflow-scrolling:auto!important;
  }

  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .table,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .table tr,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .table th,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .table td,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .customer-actions,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .customer-actions-row,
  html.crm-browser-mobile body[data-crm-view="customers"] .customer-list-card .btn,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-table,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-table tr,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-table th,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-table td,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-actions,
  html.crm-browser-mobile body[data-crm-view="tasks"] .workflow-card .workflow-actions .btn{
    touch-action:pan-y pinch-zoom!important;
    overscroll-behavior:auto!important;
  }
}

/* ===== iphone-browser-5.4.122.css ===== */
/* CRM DEMO 5.4.122 — iPhone/iPod browser ONLY: jeden stabilny scroller.
   Safari i Chrome na iOS używają WebKit. Reguły aktywują się wyłącznie przez
   klasę .crm-iphone-browser dodaną w index.php.

   Cel: NIE przewijamy jednocześnie body + tabel + content. W zalogowanym CRM
   jedynym pionowym scrollerem jest .content. Nagłówek i dolna nawigacja pozostają
   poza nim. Brak touchmove/preventDefault w CSS/JS iPhone. */

/* Root nie jest scrollerem zalogowanego CRM. Dzięki temu WebKit nie wybiera
   losowo body albo zagnieżdżonej tabeli jako właściciela gestu. */
html.crm-iphone-browser{
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
  min-height:100%!important;
  overflow:hidden!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
}
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open){
  position:relative!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:100%!important;
  min-height:100%!important;
  max-height:100%!important;
  margin:0!important;
  overflow:hidden!important;
  touch-action:auto!important;
}

/* Jedna, zamknięta geometria viewportu. Nie używamy chwilowego visualViewport.height
   do wysokości głównego CRM — 100dvh robi to natywnie w iOS 15.4+. */
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) #app{
  position:relative!important;
  left:0!important;
  right:auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-height:100dvh!important;
  margin:0!important;
  transform:none!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  touch-action:auto!important;
}
@supports not (height:100dvh){
  html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) #app{
    height:100vh!important;min-height:100vh!important;max-height:100vh!important;
  }
}

html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) #app>.shell,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .shell,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .main{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:100%!important;
  margin:0!important;
  transform:none!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  touch-action:auto!important;
}

html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .top{
  flex:0 0 auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
}

/* JEDYNY pionowy scroller na zwykłych ekranach CRM. */
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .main>.content,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .main .content{
  position:relative!important;
  display:block!important;
  flex:1 1 auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:0!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:auto!important;
  touch-action:auto!important;
  box-sizing:border-box!important;
}

/* Dolna belka nadal jest fixed; content ma już istniejący padding-bottom z CRM. */
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .mobilebar{
  max-width:100%!important;
  touch-action:manipulation!important;
}

/* iOS auto-zoom: pola poniżej 16px powiększają viewport i potrafią pozostawić
   złą skalę po logowaniu. To zostaje z 5.4.121. */
html.crm-iphone-browser input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
html.crm-iphone-browser select,
html.crm-iphone-browser textarea,
html.crm-iphone-browser [contenteditable="true"]{
  font-size:16px!important;
}

/* Ekran logowania NIE używa zamkniętego .content — pozostaje zwykłym dokumentem.
   Klawiatura nie może zamknąć formularza w chwilowej wysokości visualViewport. */

/* Login / przed zalogowaniem: root wraca do naturalnego scrolla dokumentu. */
html.crm-iphone-browser.crm-iphone-login{
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}

html.crm-iphone-browser body:not([data-crm-view]){
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
html.crm-iphone-browser .login{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:100svh!important;
  height:auto!important;
  padding:20px 16px!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
@supports not (height:100svh){html.crm-iphone-browser .login{min-height:100vh!important}}
html.crm-iphone-browser .login-card{
  width:min(440px,100%)!important;
  min-width:0!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
html.crm-iphone-browser.crm-keyboard-open .login{
  place-items:start center!important;
  align-content:start!important;
  padding-top:max(10px,env(safe-area-inset-top,0px))!important;
  padding-bottom:20px!important;
}

/* Tabele nie mogą być pionowymi scrollerami. Pionowy swipe ma trafić do .content.
   Nie ustawiamy touch-action:pan-y, bo na iOS potrafi to wejść w konflikt z
   zagnieżdżonym overflow-x. Zostawiamy natywne touch-action:auto. */
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .tablewrap,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .workflow-tablewrap,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-wrap,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-grid,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-board,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-table{
  max-height:none!important;
  overflow-y:visible!important;
  overscroll-behavior-y:auto!important;
  touch-action:auto!important;
}
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .tablewrap *,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .workflow-tablewrap *,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-wrap *,
html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .calendar-grid *{
  touch-action:auto!important;
}

/* Portrait: mobilne tabele są kartami, więc nie potrzebują osobnego poziomego
   scrollera. To usuwa „martwe” gesty zaczynane na komórkach. */
@media (orientation:portrait){
  html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .tablewrap,
  html.crm-iphone-browser body[data-crm-view]:not(.notebook-open) .content .workflow-tablewrap{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:auto!important;
  }
}

/* Landscape: Klienci i Sprawy zostały już dopasowane do ekranu w 5.4.119/120,
   więc także tutaj nie tworzymy nested scrollerów. */
@media (orientation:landscape){
  html.crm-iphone-browser body[data-crm-view="customers"] .customer-list-card .tablewrap,
  html.crm-iphone-browser body[data-crm-view="tasks"] .workflow-card .workflow-tablewrap{
    overflow:visible!important;
    overflow-x:visible!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:auto!important;
    touch-action:auto!important;
  }
}

/* ===== message-portrait-open-5.4.128.css ===== */
/* CRM DEMO 5.4.128 — ONLY existing conversation in portrait.
   W pionie istniejący wątek jest jednym pełnym panelem między górną belką CRM
   i dolną nawigacją. Landscape/desktop oraz formularz „Nowa rozmowa” bez zmian. */
@media (orientation:portrait){
  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open{
    display:block!important;
    position:fixed!important;
    top:var(--crm-chat-top,calc(var(--tomzal-safe-top,0px) + 66px))!important;
    right:0!important;
    bottom:var(--crm-chat-bottom,var(--tomzal-mobile-nav-height,64px))!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    z-index:1200!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-sidebar,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-sidebar{
    display:none!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-pane,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-pane{
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:none!important;
    overflow:hidden!important;
    background:#fff!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-header,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-header{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-mobile-back,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-mobile-back{
    display:flex!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-thread,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-thread{
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-compose,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-thread-open.mobile-chat-open .chat-compose{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
}

/* ===== message-portrait-compose-5.4.129.css ===== */
/* CRM DEMO 5.4.129 — Wiadomosci / Nowa rozmowa / portrait only.
   Fix: formularz inline mial height:100% mimo osobnego naglowka, wiec jego dol
   wychodzil poza dostepna wysokosc i byl obcinany przez overflow:hidden.
   W pionie formularz dostaje jeden pelny panel pomiedzy topbarem i mobilebarem;
   przewija sie tylko srodkowa tresc, a akcje Anuluj/Wyslij zostaja nad dolna belka. */
@media (orientation:portrait){
  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open.mobile-chat-open,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open.mobile-chat-open{
    display:block!important;
    position:fixed!important;
    top:var(--crm-chat-top,calc(var(--tomzal-safe-top,0px) + 66px))!important;
    right:0!important;
    bottom:var(--crm-chat-bottom,var(--tomzal-mobile-nav-height,64px))!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#fff!important;
    z-index:1200!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-sidebar,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-sidebar{
    display:none!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-pane,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-pane{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
    background:#fff!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-shell,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-shell{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-head,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-head{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    box-sizing:border-box!important;
  }

  /* Kluczowa poprawka: NIE height:100%. Formularz zajmuje tylko miejsce pozostale po naglowku. */
  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline{
    display:flex!important;
    flex-direction:column!important;
    flex:1 1 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-intro,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-intro{
    flex:0 0 auto!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-grid,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-grid{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    padding-bottom:28px!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-actions,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-actions{
    position:relative!important;
    inset:auto!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:68px!important;
    margin:0!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important;
    background:#fff!important;
    border-top:1px solid var(--line)!important;
    box-shadow:0 -8px 24px rgba(15,23,42,.08)!important;
    z-index:20!important;
    box-sizing:border-box!important;
  }

  html.crm-mobile-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-mobile-back,
  html.crm-tablet-device body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .chat-mobile-back{
    display:inline-flex!important;
  }
}

/* ===== mobile-landscape-popup-fullscreen-5.4.130.css ===== */
/* CRM DEMO 5.4.130 — mobile/tablet landscape popup fullscreen guard.
   Problem: older landscape safety rules reused visualViewport.offsetLeft / safe-area
   for generic CRM overlays. On some Android tablets the OS navigation is physically
   at the bottom, but WebView can still report a horizontal visualViewport offset.
   This shifted every generic modal/search layer to the right and sometimes down.

   Scope: mobile/tablet/browser-mobile in LANDSCAPE only.
   Desktop and portrait are intentionally untouched. */

@media (orientation: landscape) {
  /* Generic CRM modal: the WebView itself is already the usable app viewport.
     Do not add visualViewport/safe-area offsets a second time. */
  html.crm-mobile-device #modal.modal:not(.hidden),
  html.crm-mobile-device.crm-tablet-device #modal.modal:not(.hidden),
  html.crm-mobile-device.crm-system-nav-left #modal.modal:not(.hidden),
  html.crm-mobile-device.crm-system-nav-right #modal.modal:not(.hidden),
  html.crm-tablet-device #modal.modal:not(.hidden),
  html.crm-browser-mobile #modal.modal:not(.hidden) {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html.crm-mobile-device #modal.modal:not(.hidden) > .modal-card,
  html.crm-mobile-device #modal.modal:not(.hidden) > .modal-content,
  html.crm-mobile-device #modal.modal:not(.hidden) > .fullscreen-card,
  html.crm-tablet-device #modal.modal:not(.hidden) > .modal-card,
  html.crm-tablet-device #modal.modal:not(.hidden) > .modal-content,
  html.crm-tablet-device #modal.modal:not(.hidden) > .fullscreen-card,
  html.crm-browser-mobile #modal.modal:not(.hidden) > .modal-card,
  html.crm-browser-mobile #modal.modal:not(.hidden) > .modal-content,
  html.crm-browser-mobile #modal.modal:not(.hidden) > .fullscreen-card {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding-bottom: 0 !important;
    transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    background: #fff !important;
  }

  html.crm-mobile-device #modal.modal:not(.hidden) .modal-head,
  html.crm-tablet-device #modal.modal:not(.hidden) .modal-head,
  html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    min-height: 58px !important;
    box-sizing: border-box !important;
  }

  html.crm-mobile-device #modal.modal:not(.hidden) #modalBody,
  html.crm-tablet-device #modal.modal:not(.hidden) #modalBody,
  html.crm-browser-mobile #modal.modal:not(.hidden) #modalBody {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y !important;
    box-sizing: border-box !important;
  }

  /* Global CRM search/command popup uses a separate root from #modal. */
  html.crm-mobile-device .crm-command-layer:not(.hidden),
  html.crm-tablet-device .crm-command-layer:not(.hidden),
  html.crm-browser-mobile .crm-command-layer:not(.hidden) {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html.crm-mobile-device .crm-command-layer:not(.hidden) > .crm-command-shell,
  html.crm-tablet-device .crm-command-layer:not(.hidden) > .crm-command-shell,
  html.crm-browser-mobile .crm-command-layer:not(.hidden) > .crm-command-shell {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    max-height: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html.crm-mobile-device .crm-command-layer:not(.hidden) .crm-command-head,
  html.crm-tablet-device .crm-command-layer:not(.hidden) .crm-command-head,
  html.crm-browser-mobile .crm-command-layer:not(.hidden) .crm-command-head {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    min-height: 58px !important;
    box-sizing: border-box !important;
  }

  html.crm-mobile-device .crm-command-layer:not(.hidden) .crm-command-body,
  html.crm-tablet-device .crm-command-layer:not(.hidden) .crm-command-body,
  html.crm-browser-mobile .crm-command-layer:not(.hidden) .crm-command-body {
    min-width: 0 !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }
}

/* ===== mobile-popup-unified-fullscreen-5.4.131.css ===== */
/* CRM DEMO 5.4.131 — unified mobile/tablet popup geometry.
   Cel: wszystkie główne popupy na telefonie/tablecie mają identyczny pełny
   viewport zarówno w portrait, jak i landscape. Plik jest ładowany po wszystkich
   starszych modułach urządzeń, więc kasuje ich lokalne top/margin/max-height.
   Desktop pozostaje bez zmian. */

/* Wspólny pełnoekranowy modal na urządzeniach mobilnych/tabletach. */
html.crm-mobile-device #modal.modal:not(.hidden),
html.crm-tablet-device #modal.modal:not(.hidden),
html.crm-browser-mobile #modal.modal:not(.hidden) {
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device #modal.modal:not(.hidden) > .modal-card,
html.crm-tablet-device #modal.modal:not(.hidden) > .modal-card,
html.crm-browser-mobile #modal.modal:not(.hidden) > .modal-card {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  background: #fff !important;
}

/* Jedna identyczna belka popupu w obu orientacjach. */
html.crm-mobile-device #modal.modal:not(.hidden) .modal-head,
html.crm-tablet-device #modal.modal:not(.hidden) .modal-head,
html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: linear-gradient(180deg,#101c2f,#0c1728) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 10 !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device #modal.modal:not(.hidden) .modal-head h3,
html.crm-tablet-device #modal.modal:not(.hidden) .modal-head h3,
html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head h3,
html.crm-mobile-device #modal.modal:not(.hidden) #modalTitle,
html.crm-tablet-device #modal.modal:not(.hidden) #modalTitle,
html.crm-browser-mobile #modal.modal:not(.hidden) #modalTitle {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

html.crm-mobile-device #modal.modal:not(.hidden) .modal-head .icon-btn,
html.crm-tablet-device #modal.modal:not(.hidden) .modal-head .icon-btn,
html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head .icon-btn {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 46px !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-size: 28px !important;
  line-height: 1 !important;
  transform: none !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device #modal.modal:not(.hidden) #modalBody,
html.crm-tablet-device #modal.modal:not(.hidden) #modalBody,
html.crm-browser-mobile #modal.modal:not(.hidden) #modalBody {
  position: relative !important;
  inset: auto !important;
  flex: 1 1 auto !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
  background: #fff !important;
  box-sizing: border-box !important;
}

/* Notatka klienta wcześniej miała własne max-width:820px i margin:auto,
   przez co w landscape wyglądała jak mniejszy popup mimo pełnego #modal. */
html.crm-mobile-device #modal.modal:not(.hidden) #modalBody > .customer-note-form,
html.crm-tablet-device #modal.modal:not(.hidden) #modalBody > .customer-note-form,
html.crm-browser-mobile #modal.modal:not(.hidden) #modalBody > .customer-note-form {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Globalna wyszukiwarka jest osobną warstwą, więc dostaje identyczną geometrię. */
html.crm-mobile-device .crm-command-layer:not(.hidden),
html.crm-tablet-device .crm-command-layer:not(.hidden),
html.crm-browser-mobile .crm-command-layer:not(.hidden) {
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device .crm-command-layer:not(.hidden) > .crm-command-shell,
html.crm-tablet-device .crm-command-layer:not(.hidden) > .crm-command-shell,
html.crm-browser-mobile .crm-command-layer:not(.hidden) > .crm-command-shell {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  transform: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device .crm-command-layer:not(.hidden) .crm-command-head,
html.crm-tablet-device .crm-command-layer:not(.hidden) .crm-command-head,
html.crm-browser-mobile .crm-command-layer:not(.hidden) .crm-command-head {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px !important;
  box-sizing: border-box !important;
}

html.crm-mobile-device .crm-command-layer:not(.hidden) .crm-command-body,
html.crm-tablet-device .crm-command-layer:not(.hidden) .crm-command-body,
html.crm-browser-mobile .crm-command-layer:not(.hidden) .crm-command-body {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  touch-action: pan-y !important;
}

/* ===== mobile-popup-portrait-compact-header-5.4.132.css ===== */
/* CRM DEMO 5.4.132 — compact popup header in portrait.
   Cel: na telefonach i tabletach w pionie nagłówek popupu nie może ponownie
   doliczać całego safe-area u góry, jeżeli WebView/przeglądarka już zaczyna się
   pod paskiem systemowym. Dzięki temu tytuł i X są wyżej, a treść zaczyna się
   wcześniej. Landscape i desktop pozostają bez zmian. */

@media (orientation: portrait) and (max-width: 1400px) and (pointer: coarse) {
  html.crm-mobile-device #modal.modal:not(.hidden) .modal-head,
  html.crm-tablet-device #modal.modal:not(.hidden) .modal-head,
  html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head {
    min-height: 54px !important;
    padding: 6px 12px !important;
    align-items: center !important;
  }

  html.crm-mobile-device #modal.modal:not(.hidden) .modal-head .icon-btn,
  html.crm-tablet-device #modal.modal:not(.hidden) .modal-head .icon-btn,
  html.crm-browser-mobile #modal.modal:not(.hidden) .modal-head .icon-btn {
    flex-basis: 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
  }

  /* Globalne wyszukiwanie korzysta z osobnego nagłówka, ale wizualnie ma być
     tak samo zwarte jak zwykłe popupy. */
  html.crm-mobile-device .crm-command-layer:not(.hidden) .crm-command-head,
  html.crm-tablet-device .crm-command-layer:not(.hidden) .crm-command-head,
  html.crm-browser-mobile .crm-command-layer:not(.hidden) .crm-command-head {
    min-height: 54px !important;
    padding: 6px 12px !important;
    align-items: center !important;
  }
}

/* ===== customer-form-create-portrait-compact-5.4.134.css ===== */
/* CRM DEMO 5.4.134 — Nowa karta klienta: mniejsze odstępy między polami w pionie.
   Zakres jest celowo wąski: tylko formularz TWORZENIA klienta na mobile/tablecie
   w orientacji portrait. Wysokość inputów i pozostałe popupy pozostają bez zmian. */

@media (orientation: portrait) and (max-width: 1400px) {
  html.crm-mobile-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2,
  html.crm-tablet-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2,
  html.crm-browser-mobile #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 {
    row-gap: 2px !important;
    column-gap: 12px !important;
    padding-top: 4px !important;
  }

  html.crm-mobile-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:not(.customer-form-actions),
  html.crm-tablet-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:not(.customer-form-actions),
  html.crm-browser-mobile #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:not(.customer-form-actions) {
    margin: 6px 0 !important;
    gap: 6px !important;
  }

  /* Pierwsze pole nie potrzebuje dodatkowej pustej przestrzeni nad sobą. */
  html.crm-mobile-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:first-child,
  html.crm-tablet-device #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:first-child,
  html.crm-browser-mobile #modal.modal:not(.hidden) #cf.customer-form-create > .grid2 > .field:first-child {
    margin-top: 2px !important;
  }
}

/* 5.4.162: Native Android is the single source of truth for WindowInsets. */
html[data-crm-runtime="native-android"],html.crm-android-app-runtime.crm-native-mobile{
  --tomzal-safe-top:var(--native-inset-top,0px)!important;
  --tomzal-safe-right:var(--native-inset-right,0px)!important;
  --tomzal-safe-bottom:var(--native-inset-bottom,0px)!important;
  --tomzal-safe-left:var(--native-inset-left,0px)!important;
  --crm-system-top:var(--native-inset-top,0px)!important;
  --crm-system-right:var(--native-inset-right,0px)!important;
  --crm-system-bottom:var(--native-inset-bottom,0px)!important;
  --crm-system-left:var(--native-inset-left,0px)!important;
}

/* 5.4.162 final: in native Android every safe-area-dependent component uses ONLY values injected by MainActivity. */
html[data-crm-runtime="native-android"] #modal.modal:not(.hidden) .modal-head,
html[data-crm-runtime="native-android"] .crm-command-layer:not(.hidden) .crm-command-head{
  padding-top:calc(10px + var(--native-inset-top,0px))!important;
  padding-left:calc(14px + var(--native-inset-left,0px))!important;
  padding-right:calc(14px + var(--native-inset-right,0px))!important;
}
html[data-crm-runtime="native-android"] body[data-crm-view="messages"] .chat-layout.crm-portrait-compose-open .message-compose-inline-actions{
  padding-bottom:calc(10px + var(--native-inset-bottom,0px))!important;
}
html[data-crm-runtime="native-android"].crm-mobile-device:not(.crm-tablet-device) body:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) .mobilebar{
  bottom:max(var(--crm-vv-bottom,0px),var(--native-inset-bottom,0px))!important;
}
html[data-crm-runtime="native-android"].crm-mobile-device:not(.crm-tablet-device) .content{
  padding-bottom:calc(86px + max(var(--crm-vv-bottom,0px),var(--native-inset-bottom,0px)))!important;
}

/* 5.4.172 — montaże ustalone: 2x2 przyciski na telefonie/tablecie mobilnym */
@media (orientation:landscape) and (max-width:1400px) and (pointer:coarse){
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions,
  body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:stretch!important;
  }
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions .btn,
  body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions .btn{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    padding:8px 8px!important;
    margin:0!important;
    text-align:center!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
    line-height:1.15!important;
  }
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions .installation-incomplete-btn{
    font-size:12px!important;
  }
}

@media (max-width:700px){
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions,
  body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions .btn,
  body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions .btn{
    min-height:44px!important;
    padding:8px 6px!important;
    font-size:12px!important;
    line-height:1.12!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
  }
}

/* 5.4.173 — Montaże ustalone: stabilny układ 2x2 również na desktopie. */
body[data-crm-view="tasks"] .workflow-card td.installation-scheduled-actions-cell{
  width:252px!important;
  min-width:252px!important;
  white-space:normal!important;
}
body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions,
body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  gap:7px!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  flex-wrap:initial!important;
}
body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions .btn,
body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions .btn{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:40px!important;
  padding:7px 6px!important;
  margin:0!important;
  border-radius:10px!important;
  font-size:11.5px!important;
  line-height:1.14!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:anywhere!important;
  text-align:center!important;
}
body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions .installation-incomplete-btn{
  font-size:11.25px!important;
}
@media(max-width:900px){
  body[data-crm-view="tasks"] .workflow-card td.installation-scheduled-actions-cell{
    width:232px!important;
    min-width:232px!important;
  }
  body[data-crm-view="tasks"] .workflow-card .workflow-actions.installation-scheduled-actions .btn,
  body[data-crm-view="tasks"] .workflow-card .row-actions.workflow-actions.installation-scheduled-actions .btn{
    font-size:11px!important;
    min-height:40px!important;
    padding:7px 5px!important;
  }
}

/* 5.4.174 — wymuszone dwuwierszowe "Montaż niedokończony" w Sprawach. */
body[data-crm-view="tasks"] .workflow-card .workflow-actions .installation-incomplete-btn{
  white-space:normal!important;
  line-height:1.08!important;
  font-size:10.75px!important;
  text-align:center!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  hyphens:none!important;
}
body[data-crm-view="tasks"] .workflow-card .workflow-actions .installation-incomplete-btn br{
  display:block!important;
}

/* 5.4.186 — dyskretniejszy dymek „Masz jeszcze klienta w okolicy”. */
body[data-crm-view="tasks"] .ai-workflow-nearby-hint{
  padding:5px 7px!important;
  gap:5px!important;
  margin-bottom:6px!important;
  border-radius:10px!important;
  font-size:10px!important;
  line-height:1.15!important;
  font-weight:760!important;
}
body[data-crm-view="tasks"] .ai-workflow-nearby-hint > span:first-child{font-size:12px!important}
body[data-crm-view="tasks"] .ai-workflow-nearby-hint .ai-hint-copy b{font-size:10px!important;line-height:1.15!important}

/* 5.4.187 — kalendarz: mniejszy i lekko węższy dymek „Masz jeszcze klienta w okolicy”. */
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby{
  width:calc(100% - 12px)!important;
  max-width:calc(100% - 12px)!important;
  margin:4px auto 0!important;
  padding:4px 6px!important;
  gap:4px!important;
  border-radius:9px!important;
  font-size:9px!important;
  line-height:1.1!important;
  font-weight:780!important;
  align-items:center!important;
}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby > span:first-child{
  line-height:1!important;
}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy{
  gap:1px!important;
}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy b{
  font-size:9px!important;
  line-height:1.1!important;
}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-admin-capacity{
  font-size:8px!important;
  line-height:1.1!important;
}

/* 5.4.196 — notatka rysikiem: przycisk szkicu musi pozostać dostępny */
.contract-notebook-actions .notebook-action-draft{display:inline-flex!important;align-items:center!important;justify-content:center!important}
@media (max-width:1400px), (pointer:coarse){
  .contract-notebook-actions .notebook-action-draft{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;border-radius:10px!important}
  .contract-notebook-actions .notebook-action-draft span{display:none!important}
  .contract-notebook-actions .notebook-action-draft svg{display:block!important;width:17px!important;height:17px!important}
}
#contractNotebookCanvas{touch-action:none!important;user-select:none!important;-webkit-user-select:none!important}


/* 5.4.198 — tablet: formularz umowy nie zmienia liczby kolumn po otwarciu/zamknięciu klawiatury. */
html.crm-tablet-device #modal.modal.modal-contract-editor:not(.hidden) .contract-form-grid,
html.crm-tablet-device #modal.modal.modal-contract-editor:not(.hidden) .contract-money-grid{
  grid-template-columns:1fr!important;
}
html.crm-tablet-device #modal.modal.modal-contract-editor:not(.hidden) .contract-form-grid>.field,
html.crm-tablet-device #modal.modal.modal-contract-editor:not(.hidden) .contract-money-grid>.field{
  grid-column:1/-1!important;
  min-width:0!important;
}

/* 5.4.199 — umowa na urządzeniu dotykowym: blokada 1 kolumny niezależna od zmian viewportu po otwarciu klawiatury. */
#modal.modal.modal-contract-editor.modal-contract-force-single-column:not(.hidden) .contract-form-grid,
#modal.modal.modal-contract-editor.modal-contract-force-single-column:not(.hidden) .contract-money-grid{
  grid-template-columns:minmax(0,1fr)!important;
}
#modal.modal.modal-contract-editor.modal-contract-force-single-column:not(.hidden) .contract-form-grid>.field,
#modal.modal.modal-contract-editor.modal-contract-force-single-column:not(.hidden) .contract-money-grid>.field{
  grid-column:1/-1!important;
  min-width:0!important;
}
@media (pointer:coarse){
  #modal.modal.modal-contract-editor:not(.hidden) .contract-form-grid,
  #modal.modal.modal-contract-editor:not(.hidden) .contract-money-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  #modal.modal.modal-contract-editor:not(.hidden) .contract-form-grid>.field,
  #modal.modal.modal-contract-editor:not(.hidden) .contract-money-grid>.field{
    grid-column:1/-1!important;
    min-width:0!important;
  }
}



/* CRM DEMO 5.4.203 — desktop: kompaktowe akcje produktów i ten sam panel notatki co na Androidzie. */
@media (min-width:1101px) and (pointer:fine){
  #modal.modal-contract-editor .contract-scope-heading{
    align-items:flex-start!important;
  }
  #modal.modal-contract-editor .contract-scope-actions{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:auto!important;
    min-width:0!important;
    gap:7px!important;
  }
  #modal.modal-contract-editor .contract-scope-actions .btn,
  #modal.modal-contract-editor .contract-scope-actions label.btn{
    width:auto!important;
    min-width:0!important;
    min-height:34px!important;
    height:34px!important;
    padding:6px 10px!important;
    border-radius:9px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }

  /* Jeden wspólny interfejs notatnika: desktop korzysta z mobilnego paska Android. */
  .contract-notebook-layer .notebook-desktop-tools{display:none!important}
  .contract-notebook-layer .contract-notebook-tools{
    padding:6px 8px 4px!important;
    background:transparent!important;
    border-bottom:0!important;
    display:block!important;
    overflow:visible!important;
    max-height:none!important;
  }
  .contract-notebook-layer .notebook-mobile-toolbar{
    display:grid!important;
    grid-template-columns:repeat(10,minmax(0,1fr))!important;
    width:min(620px,100%)!important;
    min-height:38px!important;
    height:38px!important;
    margin:0!important;
    padding:3px!important;
    gap:2px!important;
    border-radius:15px!important;
    background:#23262d!important;
    box-shadow:0 8px 20px rgba(15,23,42,.14)!important;
  }
  .contract-notebook-layer .notebook-mobile-tool{
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    min-height:32px!important;
    padding:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:#f5f7fb!important;
    display:grid!important;
    place-items:center!important;
  }
  .contract-notebook-layer .notebook-mobile-tool.active{background:rgba(255,255,255,.14)!important}
  .contract-notebook-layer .notebook-mobile-tool .notebook-svg-icon svg{width:16px!important;height:16px!important}
  .contract-notebook-layer .notebook-mobile-tool .notebook-text-icon{width:19px!important;height:19px!important;font-size:13px!important;border-width:1.5px!important}
  .contract-notebook-layer .notebook-mobile-panels{
    display:block!important;
    width:min(620px,100%)!important;
    margin-top:6px!important;
  }
  .contract-notebook-layer .notebook-mobile-panel{
    display:none!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    background:#23262d!important;
    color:#fff!important;
    border-radius:16px!important;
    padding:7px 9px!important;
    box-shadow:0 8px 22px rgba(15,23,42,.14)!important;
  }
  .contract-notebook-layer .notebook-mobile-panel.open{display:flex!important}
  .contract-notebook-layer .notebook-mobile-panel[data-panel="shapes"]{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .contract-notebook-layer .notebook-mobile-panel[data-panel="shapes"].open{display:grid!important}
  .contract-notebook-layer .notebook-mobile-panel[data-panel="colors"].open{display:block!important}
  .contract-notebook-layer .notebook-mobile-panel[data-panel="size"].open{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .contract-notebook-layer .notebook-mobile-panel[data-panel="view"].open{display:flex!important;justify-content:center!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-tool{
    height:36px!important;
    min-width:36px!important;
    padding:0 9px!important;
    border:0!important;
    border-radius:12px!important;
    background:transparent!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .contract-notebook-layer .notebook-mobile-panel .notebook-tool.active{background:rgba(255,255,255,.16)!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-tool-text{display:none!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-tool-icon svg,
  .contract-notebook-layer .notebook-mobile-panel .notebook-svg-icon svg{width:18px!important;height:18px!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-palette{display:flex!important;flex-wrap:wrap!important;gap:8px!important;justify-content:flex-start!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-color-swatch{width:24px!important;height:24px!important;min-width:24px!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-width{
    width:100%!important;
    min-width:0!important;
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
    border:0!important;
    box-shadow:none!important;
    border-radius:12px!important;
    padding:6px 9px!important;
  }
  .contract-notebook-layer .notebook-mobile-panel .notebook-width input{min-width:0!important;width:100%!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-width b{color:#fff!important}
  .contract-notebook-layer .notebook-mobile-panel .notebook-size-label{min-width:88px!important;font-size:11px!important}
}


/* 5.4.205 — desktop: wyśrodkowany pasek Notatki rysikiem oraz komunikat diagnostyki GPS. */
@media (min-width:1367px){
  .contract-notebook-layer .notebook-mobile-toolbar{
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .contract-notebook-layer .notebook-mobile-panels{
    margin-left:auto!important;
    margin-right:auto!important;
  }
}
#gpsAdminPanel > .notice.danger-notice{
  max-width:920px;
  margin:18px auto!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
#gpsAdminPanel > .notice.danger-notice p{
  max-width:760px;
  margin-left:auto!important;
  margin-right:auto!important;
}
#gpsAdminPanel > .notice.danger-notice .btn{
  align-self:center!important;
}

/* 5.4.207 — diagnostyka telefonów: ostatnia kolumna nie tworzy pustego pasa po prawej. */
@media (min-width:701px){
  .gps-device-table th:last-child,.gps-device-table td:last-child{width:1%!important;white-space:nowrap!important;text-align:right!important;}
  .gps-device-table th:last-child{padding-right:16px!important;}
  .gps-device-table td:last-child{padding-right:16px!important;}
  .gps-device-table .gps-device-logout{margin-left:auto!important;}
}

/* 5.4.208 — tabela telefonów wypełnia całą szerokość bez pozornej pustej kolumny. */
@media (min-width:901px){
  .gps-device-table{width:100%!important;table-layout:fixed!important;}
  .gps-device-table th:nth-child(1),.gps-device-table td:nth-child(1){width:24%!important;}
  .gps-device-table th:nth-child(2),.gps-device-table td:nth-child(2){width:17%!important;}
  .gps-device-table th:nth-child(3),.gps-device-table td:nth-child(3){width:18%!important;}
  .gps-device-table th:nth-child(4),.gps-device-table td:nth-child(4){width:27%!important;}
  .gps-device-table th:nth-child(5),.gps-device-table td:nth-child(5){width:14%!important;text-align:left!important;white-space:normal!important;}
  .gps-device-table .gps-device-logout{margin-left:0!important;white-space:nowrap!important;}
}

/* 5.4.211 — pełna tabela diagnostyczna urządzeń; nadpisuje stary układ 5-kolumnowy. */
.gps-device-table.gps-device-diagnostics{width:100%!important;min-width:1280px!important;table-layout:auto!important}
.gps-device-table.gps-device-diagnostics th:nth-child(-n+9),.gps-device-table.gps-device-diagnostics td:nth-child(-n+9){width:auto!important;text-align:left!important;white-space:normal!important;vertical-align:top!important}
.gps-device-table.gps-device-diagnostics th:nth-child(1),.gps-device-table.gps-device-diagnostics td:nth-child(1){min-width:235px!important}
.gps-device-table.gps-device-diagnostics th:nth-child(6),.gps-device-table.gps-device-diagnostics td:nth-child(6){min-width:270px!important}
.gps-device-table.gps-device-diagnostics th:nth-child(7),.gps-device-table.gps-device-diagnostics td:nth-child(7){min-width:170px!important}
.gps-device-table.gps-device-diagnostics th:nth-child(8),.gps-device-table.gps-device-diagnostics td:nth-child(8){min-width:165px!important}
.gps-device-table.gps-device-diagnostics th:last-child,.gps-device-table.gps-device-diagnostics td:last-child{width:1%!important;white-space:nowrap!important;text-align:right!important}

/* 5.4.233 — „Masz jeszcze klienta w okolicy”: przyklejony do prawej, zamiast wisieć na środku. */
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby{
  width:max-content!important;max-width:calc(100% - 8px)!important;margin:4px 0 0 auto!important;padding:2px 4px!important;gap:3px!important;min-height:0!important;border-radius:7px!important;font-size:10px!important;line-height:1.15!important;align-self:flex-end!important;justify-content:flex-start!important;text-align:left!important;justify-self:end!important;
}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby > span:first-child{font-size:10px!important}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy{flex:0 1 auto!important;gap:0!important;text-align:left!important}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy b{font-size:10px!important;line-height:1.15!important}
body[data-crm-view="calendar"] .calendar-page .day.ai-hint-layout-fixed > .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-admin-capacity{font-size:9px!important;line-height:1.15!important}

body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint{
  grid-column:2/-1!important;padding:3px 5px!important;gap:3px!important;min-height:0!important;border-radius:8px!important;font-size:10px!important;line-height:1.15!important;
}
body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint > span:first-child{font-size:10px!important}

body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint .ai-hint-copy b{font-size:10px!important;line-height:1.15!important}

body[data-crm-view="tasks"] .workflow-card .workflow-actions + .ai-workflow-nearby-hint,
body[data-crm-view="tasks"] .workflow-card td > .ai-workflow-nearby-hint{
  width:max-content!important;max-width:230px!important;margin:5px 0 0 auto!important;padding:3px 5px!important;gap:3px!important;min-height:0!important;border-radius:8px!important;font-size:10px!important;line-height:1.15!important;justify-content:flex-start!important;text-align:left!important;
}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint > span:first-child{font-size:10px!important}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint .ai-hint-copy{flex:0 1 auto!important;}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint .ai-hint-copy b{font-size:10px!important;line-height:1.15!important}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint .ai-hint-admin-capacity{font-size:9px!important;line-height:1.15!important}

@media(max-width:700px){
  body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint{width:max-content!important;margin:4px 0 0 auto!important}
  body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint{width:max-content!important;margin:4px 0 0 auto!important}
}
/* 5.4.234 — finalne wymuszenie dymku AI po prawej krawędzi. */
body[data-crm-view="calendar"] .today-plan-item{position:relative}
body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint{
  grid-column:1/-1!important;justify-self:end!important;align-self:start!important;
  width:max-content!important;max-width:230px!important;margin:5px 0 0 auto!important;
  justify-content:flex-start!important;text-align:left!important;
}
body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint .ai-hint-copy{flex:0 1 auto!important;text-align:left!important}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint{
  display:flex!important;width:max-content!important;max-width:230px!important;
  margin-left:auto!important;margin-right:0!important;justify-content:flex-start!important;text-align:left!important;
}
body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint .ai-hint-copy{text-align:left!important}
@media(max-width:700px){
  body[data-crm-view="calendar"] .today-plan-item > .ai-today-nearby-hint{grid-column:1/-1!important;max-width:70%!important;margin-left:auto!important;margin-right:0!important}
  body[data-crm-view="tasks"] .workflow-card .ai-workflow-nearby-hint{max-width:70%!important;margin-left:auto!important;margin-right:0!important}
}

/* 5.4.239 — telefon: prawdziwe przełączanie Widok listy / Widok miesiąca. */
@media (max-width:700px){
  body[data-crm-view="calendar"] .calendar-planning-tools .calendar-view-toggle{
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode){
    overflow-x:auto!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(92px,1fr))!important;
    min-width:700px!important;
    width:100%!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .dow{
    display:block!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day{
    display:block!important;
    min-height:118px!important;
    border-radius:0!important;
    margin:0!important;
    padding:8px!important;
    border-right:1px solid var(--line)!important;
    border-bottom:1px solid var(--line)!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day.other{
    display:block!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode{
    overflow-x:visible!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .calendar{
    display:block!important;
    min-width:0!important;
    width:100%!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .dow{
    display:none!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .day{
    display:block!important;
    min-height:0!important;
    border:1px solid var(--line)!important;
    border-radius:13px!important;
    margin-bottom:8px!important;
    padding:10px!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .day.other{
    display:none!important;
  }
}

/* Telefon/tablet dotykowy w poziomie: lista nie może dziedziczyć min-width:760px z miesiąca. */
@media (max-width:1400px) and (pointer:coarse){
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode{
    overflow-x:visible!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .calendar{
    display:block!important;
    min-width:0!important;
    width:100%!important;
  }
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .dow{display:none!important}
  body[data-crm-view="calendar"] .calendar-card.calendar-list-mode .day.other{display:none!important}
}

/* 5.4.242 — telefon: miesiąc nadal mieści się na ekranie, ale jest wyraźnie czytelniejszy. */
@media (max-width:600px){
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode){
    overflow-x:hidden!important;
    width:100%!important;
    max-width:100%!important;
    touch-action:pan-y!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar{
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .dow{
    min-width:0!important;
    padding:7px 0!important;
    font-size:9px!important;
    font-weight:700!important;
    line-height:1.05!important;
    overflow:hidden!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day{
    min-width:0!important;
    min-height:96px!important;
    padding:4px!important;
    overflow:hidden!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .date{
    min-width:0!important;
    gap:2px!important;
    margin-bottom:3px!important;
    font-size:10px!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .date span{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    border-radius:7px!important;
    font-size:11px!important;
    line-height:22px!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .date em{
    max-width:20px!important;
    padding:0 4px!important;
    font-size:8px!important;
    line-height:16px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day-events{
    min-width:0!important;
    gap:3px!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .event{
    min-width:0!important;
    width:100%!important;
    padding:4px 3px 4px 6px!important;
    border-radius:7px!important;
    font-size:8.5px!important;
    line-height:1.12!important;
    overflow:hidden!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .event:before{
    width:3px!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .event-time,
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .event>b{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:8.5px!important;
    line-height:1.12!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .event-team{
    display:none!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .ai-calendar-hint-inline.ai-calendar-hint-nearby{
    width:max-content!important;
    max-width:calc(100% - 2px)!important;
    padding:3px 4px!important;
    font-size:8.5px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    align-self:flex-end!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .ai-calendar-hint-inline.ai-calendar-hint-nearby > span:first-child{
    font-size:9px!important;
    line-height:1!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy{
    min-width:0!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-copy b{
    display:block!important;
    font-size:8.5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .ai-calendar-hint-inline.ai-calendar-hint-nearby .ai-hint-admin-capacity{
    display:none!important;
  }
}

/* 5.4.243 — telefon: dzisiejsza kolumna miesiąca szersza od pozostałych. */
@media (max-width:600px){
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="1"]{grid-template-columns:1.6fr repeat(6,.9fr)!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="2"]{grid-template-columns:.9fr 1.6fr repeat(5,.9fr)!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="3"]{grid-template-columns:repeat(2,.9fr) 1.6fr repeat(4,.9fr)!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="4"]{grid-template-columns:repeat(3,.9fr) 1.6fr repeat(3,.9fr)!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="5"]{grid-template-columns:repeat(4,.9fr) 1.6fr repeat(2,.9fr)!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="6"]{grid-template-columns:repeat(5,.9fr) 1.6fr .9fr!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .calendar[data-today-column="7"]{grid-template-columns:repeat(6,.9fr) 1.6fr!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day.today{padding-left:5px!important;padding-right:5px!important}
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day.today .event-time,
  body[data-crm-view="calendar"] .calendar-card:not(.calendar-list-mode) .day.today .event>b{font-size:9.5px!important}
}