/* TOMŻAL CRM 6.0.14 — iPhone (Safari + aplikacja IPA).
   ZASADA: iPhone używa DOKŁADNIE tego samego układu co Android/telefon.
   Ten plik dodaje tylko to, czego Android nie ma: strefy iPhone'a
   (pasek statusu / wyspa u góry, pasek gestów u dołu).
   Wcześniejsze warstwy 6.0.10/6.0.12 (wymuszające jedną kolumnę, wąskie przyciski,
   nagłówek pod zegarem i pływającą dolną belkę) są wyłączone w index.php.
   Klasa html.crm-iphone jest nadawana tylko dla iPhone/iPod — Android i komputer bez zmian.
   Ładowany jako OSTATNI arkusz; selektory z #app wygrywają z regułami klasowymi. */

html.crm-iphone {
  --ios-top: env(safe-area-inset-top, 0px);
  --ios-bottom: env(safe-area-inset-bottom, 0px);
  --ios-left: env(safe-area-inset-left, 0px);
  --ios-right: env(safe-area-inset-right, 0px);
  --ios-head: 64px;  /* wysokość nagłówka BEZ strefy zegara */
  --ios-nav: 62px;   /* wysokość dolnej belki BEZ strefy paska gestów */
  --crm-system-left: 0px !important;
  --crm-system-right: 0px !important;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
  /* tło poza aplikacją (odbicie przy przewijaniu, strefa zegara) = kolor belek, nigdy biały pasek */
  background: #0b1220 !important;
}

/* ===== Zalogowany CRM: jeden ekran, bez podwójnych odstępów ===== */
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) {
  background: #0b1220 !important;
}
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) #app {
  padding: 0 !important;
  margin: 0 !important;
  background: #f5f7fb !important;
}
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) #app::before,
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) #app::after,
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open)::after {
  height: 0 !important;
  min-height: 0 !important;
  display: none !important;
}

/* ===== Górna belka: ciemna aż pod zegar/wyspę, treść zawsze poniżej ===== */
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) #app .main > .top {
  position: relative !important;
  top: auto !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
  height: calc(var(--ios-head) + var(--ios-top)) !important;
  min-height: calc(var(--ios-head) + var(--ios-top)) !important;
  max-height: calc(var(--ios-head) + var(--ios-top)) !important;
  margin: 0 !important;
  padding: var(--ios-top) calc(14px + var(--ios-right)) 0 calc(14px + var(--ios-left)) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: #0b1220 !important;
  border: 0 !important;
  overflow: visible !important;
}
/* Tytuł bierze resztę miejsca i przycina się „…”, zamiast spychać przyciski za ekran. */
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view] #app .main > .top > div:first-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view] #app .main > .top #title {
  white-space: normal !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-height: 1.2 !important;
  max-height: 2.4em !important;
  overflow-wrap: break-word !important;
}
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view] #app .main > .top .top-actions {
  flex: 0 0 auto !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
  max-width: none !important;
}
/* Licznik na dzwonku/AI: nie ucinany przez krawędź ani przez sąsiedni przycisk. */
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view] #app .main > .top .top-actions > button {
  overflow: visible !important;
  flex-shrink: 0 !important;
}

/* ===== Dolna belka: przyklejona do samego dołu ekranu, pod nią NIC nie prześwituje ===== */
html.crm-iphone.crm-iphone.crm-iphone:not(.crm-keyboard-open) body[data-crm-view]:not(.tomzal-modal-open):not(.tomzal-menu-open):not(.notebook-open) #app .mobilebar {
  position: fixed !important;
  top: auto !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  height: calc(var(--ios-nav) + var(--ios-bottom)) !important;
  min-height: calc(var(--ios-nav) + var(--ios-bottom)) !important;
  max-height: calc(var(--ios-nav) + var(--ios-bottom)) !important;
  margin: 0 !important;
  padding: 0 var(--ios-right) var(--ios-bottom) var(--ios-left) !important;
  transform: none !important;
  background: #0b1220 !important;
  align-items: stretch !important;
}
html.crm-iphone.crm-iphone.crm-iphone:not(.crm-keyboard-open) body[data-crm-view]:not(.notebook-open) #app .mobilebar > button {
  height: var(--ios-nav) !important;
  min-height: 0 !important;
  max-height: var(--ios-nav) !important;
  margin: 0 !important;
  min-width: 0 !important;
  overflow: visible !important;
}

/* Treść kończy się nad belką — ostatnia karta zawsze w całości widoczna. */
html.crm-iphone.crm-iphone.crm-iphone body[data-crm-view]:not(.notebook-open) #app .main > .content {
  padding-left: calc(10px + var(--ios-left)) !important;
  padding-right: calc(10px + var(--ios-right)) !important;
  padding-bottom: calc(var(--ios-nav) + var(--ios-bottom) + 24px) !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  background: #f5f7fb !important;
}

/* Pola formularzy ≥16px — iPhone nie robi automatycznego zoomu przy wpisywaniu. */
html.crm-iphone.crm-iphone.crm-iphone input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
html.crm-iphone.crm-iphone.crm-iphone select,
html.crm-iphone.crm-iphone.crm-iphone textarea {
  font-size: max(16px, 1em) !important;
}

/* ===== Ekran logowania: strefa zegara i paska gestów nie zasłania formularza ===== */
html.crm-iphone.crm-iphone.crm-iphone body:not([data-crm-view]) {
  background: #0b1220 !important;
}
html.crm-iphone.crm-iphone.crm-iphone body:not([data-crm-view]) .login {
  padding-top: calc(20px + var(--ios-top)) !important;
  padding-bottom: calc(20px + var(--ios-bottom)) !important;
}

/* ===== Okna pełnoekranowe (Nowa karta klienta, Nowy termin, edycje…) =====
   Nagłówek okna z „X” schodzi poniżej zegara; pasek nad nim ma kolor nagłówka. */
html.crm-iphone.crm-iphone.crm-iphone #modal.modal:not(.hidden) {
  box-sizing: border-box !important;
  padding: var(--ios-top) var(--ios-right) 0 var(--ios-left) !important;
  background: linear-gradient(to bottom, #101c2f 0, #101c2f var(--ios-top), #ffffff var(--ios-top), #ffffff 100%) !important;
}
html.crm-iphone.crm-iphone.crm-iphone #modal.modal:not(.hidden) > .modal-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}
html.crm-iphone.crm-iphone.crm-iphone #modal.modal:not(.hidden) > .modal-card > .modal-head {
  flex: 0 0 auto !important;
}
html.crm-iphone.crm-iphone.crm-iphone #modal.modal:not(.hidden) > .modal-card > #modalBody {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: calc(18px + var(--ios-bottom)) !important;
}

/* ===== Wyszukiwanie w CRM (lupa) ===== */
html.crm-iphone.crm-iphone.crm-iphone #crmCommandLayer {
  box-sizing: border-box !important;
  padding: var(--ios-top) var(--ios-right) 0 var(--ios-left) !important;
  background: linear-gradient(to bottom, #101c2f 0, #101c2f var(--ios-top), #f5f7fb var(--ios-top), #f5f7fb 100%) !important;
}
html.crm-iphone.crm-iphone.crm-iphone #crmCommandLayer > .crm-command-shell {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}
html.crm-iphone.crm-iphone.crm-iphone #crmCommandLayer .crm-command-body {
  padding-bottom: calc(24px + var(--ios-bottom)) !important;
}

/* ===== Menu „Więcej” ===== */
html.crm-iphone.crm-iphone.crm-iphone #mobileMenu.crm-mobile-more:not(.hidden) {
  box-sizing: border-box !important;
  padding-top: calc(10px + var(--ios-top)) !important;
  padding-bottom: calc(10px + var(--ios-bottom)) !important;
  padding-left: calc(10px + var(--ios-left)) !important;
  padding-right: calc(10px + var(--ios-right)) !important;
}

/* ===== Asystent AI w poziomie: nie pod wycięciem aparatu ===== */
html.crm-iphone.crm-iphone.crm-iphone #crmAiPanel.crm-ai-panel {
  box-sizing: border-box !important;
  padding-left: var(--ios-left) !important;
  padding-right: var(--ios-right) !important;
}

/* ===== 6.0.14: „fartuchy” w kolorze belek poza krawędzią strony =====
   Gdy aplikacja IPA pokazuje stronę tylko w środkowym obszarze ekranu (pod zegarem
   i nad paskiem gestów), iPhone potrafi pokazać tam jasne tło. Te dwie warstwy
   leżą tuż ZA górną i dolną krawędzią strony — jeśli system je rysuje, pasy są
   ciemne jak belki; jeśli nie, nic nie zmieniają. Nie łapią dotyku. */
html.crm-iphone::before,
html.crm-iphone::after {
  content: "" !important;
  position: fixed !important;
  left: -50px !important;
  right: -50px !important;
  height: 220px !important;
  background: #0b1220 !important;
  pointer-events: none !important;
  z-index: 2147483000 !important;
  display: block !important;
}
html.crm-iphone::before { top: -220px !important; }
html.crm-iphone::after  { bottom: -220px !important; }
/* Dolna belka dodatkowo „ciągnie” swój kolor w dół (cień bez rozmycia). */
html.crm-iphone.crm-iphone.crm-iphone:not(.crm-keyboard-open) body[data-crm-view]:not(.notebook-open) #app .mobilebar {
  box-shadow: 0 -4px 18px rgba(0,0,0,.22), 0 120px 0 0 #0b1220 !important;
}