/* E3-02 „Nowa rezerwacja” / „Auto z ulicy” and E3-03 „Wizyta” (ModWulk nowa, konflikt, ulica,
   karta, karta-odwolaj, karta-nie). */
.fjn-tbk, .fjn-tvis { display: flex; flex-direction: column; gap: 14px; min-height: calc(100vh - var(--fjn-topbar-h)); padding-bottom: 0; }
.fjn-tbk > .fjn-form-footer, .fjn-tvis > .fjn-form-footer { margin-top: auto; }
.fjn-tbk > .fjn-form-footer, .fjn-tvis > .fjn-form-footer { margin-top: auto; }
.fjn-tbk__foot .fjn-stin__sum b { white-space: nowrap; }
.fjn-tbk__card .fjn-toggle__label { font-weight: 700; }
.fjn-tbk__foot .fjn-stin__sum b { white-space: nowrap; }
.fjn-tbk__card .fjn-toggle__label { font-weight: 700; }
.fjn-tbk__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.fjn-tbk__col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.fjn-tbk__card { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: 10px; }
.fjn-tbk__card h2 { margin: 0; font-size: 16px; line-height: 22px; }
.fjn-tbk__cardhead { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fjn-tbk__cardhead a { font-size: 14px; font-weight: 700; text-decoration: none; }
.fjn-tbk__who { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 12px; border: 2px solid var(--fjn-brand-600); border-radius: 8px; background: var(--fjn-brand-50); box-sizing: border-box; }
.fjn-tbk__who > span { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.fjn-tbk__who > span b, .fjn-tbk__who small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fjn-tbk__who small { font-size: 13px; color: var(--fjn-text-2); }
.fjn-tbk__who a { font-size: 14px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.fjn-tbk__plate { padding: 1px 6px; border: 1.5px solid var(--fjn-text); border-radius: 4px; background: var(--fjn-surface); font-size: 15px; white-space: nowrap; }
.fjn-tbk__note { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 13px; color: var(--fjn-text-2); }
.fjn-tbk__svc { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; min-height: 52px; padding: 6px 12px; border: 1px solid var(--fjn-border); border-radius: 8px; box-sizing: border-box; cursor: pointer; }
.fjn-tbk__svc.is-on { border: 2px solid var(--fjn-brand-600); background: var(--fjn-brand-50); font-weight: 700; }
.fjn-tbk__svc input { width: 24px; height: 24px; margin: 0; accent-color: var(--fjn-brand-600); }
.fjn-tbk__name { font-size: 15px; }
.fjn-tbk__min { font-size: 13px; color: var(--fjn-text-2); font-weight: 400; white-space: nowrap; }
.fjn-tbk__svc b { min-width: 72px; text-align: right; font-size: 14px; white-space: nowrap; }
.fjn-tbk__other { display: none; flex-direction: column; gap: 8px; }
.fjn-tbk__other:target { display: flex; }
.fjn-tbk__time { display: flex; flex-direction: column; gap: 6px; padding-top: 10px; border-top: 1px solid var(--fjn-surface-2); }
.fjn-tbk__time small { font-size: 12px; color: var(--fjn-text-2); }
.fjn-tbk__timerow { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 14px; }
.fjn-tbk__stepper { display: flex; align-items: center; gap: 6px; }
.fjn-tbk__stepper b { min-width: 70px; text-align: center; font-size: 18px; }
.fjn-tbk__step { width: 40px; height: 40px; border: 1px solid var(--fjn-border-strong); border-radius: 8px; background: var(--fjn-surface); font-size: 20px; font-weight: 700; cursor: pointer; }
.fjn-tbk__step:disabled { color: var(--fjn-text-disabled); cursor: default; }
.fjn-tbk__step--plus { border-color: var(--fjn-brand-600); background: var(--fjn-brand-600); color: var(--fjn-text-inverse); }
.fjn-tbk__bar { display: flex; height: 12px; border-radius: 6px; background: var(--fjn-surface-2); overflow: hidden; }
.fjn-tbk__cell { flex: 1; }
.fjn-tbk__cell--a { background: var(--fjn-brand-600); }
.fjn-tbk__cell--b { background: #6F93BF; }
.fjn-tbk__cell--x { background: repeating-linear-gradient(135deg, #6F93BF 0 3px, var(--fjn-brand-100) 3px 6px); }
.fjn-tbk__hint { margin: 0; font-size: 13px; color: var(--fjn-text-2); }
.fjn-tbk__windows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.fjn-tbk__window { display: flex; flex-direction: column; justify-content: center; gap: 1px; min-height: 56px; padding: 6px 10px; border: 1px solid var(--fjn-border); border-radius: 8px; background: var(--fjn-surface); color: var(--fjn-text); text-align: left; cursor: pointer; }
.fjn-tbk__window b { font-size: 15px; white-space: nowrap; }
.fjn-tbk__window span { font-size: 12px; }
.fjn-tbk__window.is-on { border: 2px solid var(--fjn-brand-600); background: var(--fjn-brand-600); color: var(--fjn-text-inverse); }
.fjn-tbk__fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.fjn-tbk__fields .fjn-input.is-error, .fjn-tbk__fields .fjn-select.is-error { border: 2px solid var(--fjn-danger-700); }
.fjn-tbk__error { display: flex; gap: 8px; margin: 0; font-size: 13px; line-height: 18px; color: var(--fjn-danger-700); }
.fjn-tbk__error svg { flex: none; margin-top: 1px; }
.fjn-tbk__found { padding: 2px 8px; border-radius: 999px; background: var(--fjn-success-100); color: var(--fjn-success-700); font-size: 12px; font-weight: 700; white-space: nowrap; }
.fjn-tbk__set { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--fjn-border); border-radius: 8px; }
.fjn-tbk__set > b { font-size: 22px; white-space: nowrap; }
.fjn-tbk__set > span { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.fjn-tbk__set small { font-size: 13px; color: var(--fjn-text-2); }
.fjn-tbk__banner { display: flex; gap: 12px; align-items: center; padding: 12px 16px; border-radius: 8px; }
.fjn-tbk__banner p { margin: 0; font-size: 15px; line-height: 21px; }
.fjn-tbk__banner--ok { background: var(--fjn-success-100); }
.fjn-tbk__banner--ok svg, .fjn-tbk__banner--ok b { color: var(--fjn-success-700); }
.fjn-tbk__banner--wait { background: var(--fjn-warning-100); }
.fjn-tbk__banner--wait svg, .fjn-tbk__banner--wait b { color: var(--fjn-warning-700); }
.fjn-tbk__banner svg { flex: none; }
/* E3-03 (D155 (7)): four tiles, cards, actions, history */
.fjn-tvis__tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.fjn-tvis__tile { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px 14px; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: 8px; }
.fjn-tvis__tile > span, .fjn-tvis__tile small { font-size: 12px; color: var(--fjn-text-2); }
/* D191 pkt 1: no cut text — without room the value wraps to 2 lines and the tile grows */
.fjn-tvis__tile b { overflow: hidden; font-size: 18px; overflow-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.fjn-tvis__acts form { margin: 0; }
.fjn-tvis__hrow { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-top: 1px solid var(--fjn-surface-2); font-size: 13px; }
.fjn-tvis__hrow:first-of-type { border-top: 0; }
.fjn-tvis__hrow b { font-size: 15px; }
.fjn-tvis__hrow > span { color: var(--fjn-text-2); }
@media (max-width: 767px) {
  .fjn-tvis__tiles, .fjn-tvis .fjn-tvis__acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fjn-tvis__acts .fjn-btn, .fjn-tvis__acts form { width: 100%; }
  .fjn-tbk, .fjn-tvis { min-height: calc(100vh - var(--fjn-topbar-h-m) - var(--fjn-bottomnav-h)); }
  .fjn-tbk__grid { grid-template-columns: minmax(0, 1fr); }
  .fjn-tbk__foot { flex-direction: row; flex-wrap: nowrap; align-items: center; } /* E3-02_M: one row */
  /* 4.12.3: the native date / time fields shrink to their column (iPhone: no overlap) */
  .fjn-tbk__fields .fjn-input, .fjn-tbk__fields .fjn-select { width: 100%; min-width: 0; }
  .fjn-tbk__fields input[type="date"], .fjn-tbk__fields input[type="time"] { -webkit-appearance: none; appearance: none; display: block; }
  .fjn-tbk__foot .fjn-stin__sum { min-width: 0; overflow: hidden; }
  .fjn-tbk__foot .fjn-stin__sum b { font-size: 18px; overflow: hidden; text-overflow: clip; }
  .fjn-tbk__foot .fjn-stin__actions { flex: 1; }
}
/* E3-08 „Ustawienia wulkanizacji” (ModWulkReszta ustawienia) */
.fjn-tset__grid { display: grid; grid-template-columns: minmax(0, 488px) minmax(0, 1fr); gap: 16px; align-items: start; }
.fjn-tset__card { padding: 0; gap: 0; overflow: hidden; }
.fjn-tset__head { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--fjn-surface-2); }
.fjn-tset__head a { font-size: 14px; font-weight: 700; text-decoration: none; }
.fjn-tset__station { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--fjn-surface-2); font-size: 15px; }
.fjn-tset__station > b { flex: 1; }
.fjn-tset__chip { padding: 2px 8px; border-radius: 999px; background: var(--fjn-success-100); color: var(--fjn-success-700); font-size: 12px; font-weight: 700; }
.fjn-tset__chip--off { background: var(--fjn-neutral-100); color: var(--fjn-neutral-700); }
.fjn-tset__links { font-size: 14px; font-weight: 700; color: var(--fjn-brand-600); white-space: nowrap; }
.fjn-tset__links a { text-decoration: none; }
.fjn-tset__link { padding: 0; border: 0; background: none; color: var(--fjn-brand-600); font: inherit; font-weight: 700; cursor: pointer; }
.fjn-tset__note { margin: 0; padding: 12px 16px; font-size: 13px; color: var(--fjn-text-2); }
.fjn-tset__blocked { padding: 8px 16px 12px; background: var(--fjn-danger-100); color: var(--fjn-danger-700); font-size: 13px; }
.fjn-tset__blocked p { margin: 0 0 4px; font-weight: 700; }
.fjn-tset__blocked ul { margin: 0; padding-left: 18px; }
.fjn-tset__row { display: grid; grid-template-columns: 130px 110px 110px 1fr; gap: 10px; align-items: center; padding: 6px 16px; border-bottom: 1px solid var(--fjn-surface-2); }
.fjn-tset__row .fjn-input { height: 40px; }
.fjn-tset__row--head { padding: 10px 16px; background: var(--fjn-bg); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--fjn-text-2); }
.fjn-tset__last { color: var(--fjn-text-2); }
.fjn-tset__err { grid-column: 2 / -1; }
.fjn-tset__last-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; font-size: 14px; }
.fjn-tset__last-row .fjn-select { width: 110px; }
.fjn-tset__last-row span { font-size: 13px; color: var(--fjn-text-2); }
@media (max-width: 1023px) { .fjn-tset__grid { grid-template-columns: minmax(0, 1fr); } }
/* SPEC 1.100 (D155 pt 10-15): „Błąd wysyłki” — a red hollow circle, „Bez przypomnienia” — grey */
.fjn-tvis__rem { display: inline-flex; align-items: center; gap: 6px; }
.fjn-tvis__tile b.fjn-tvis__rem--failed { display: inline-flex; }  /* the ring next to „Błąd wysyłki” */
.fjn-tvis__ring { display: inline-block; flex: none; width: 10px; height: 10px; border: 2px solid var(--fjn-danger-700); border-radius: 50%; box-sizing: border-box; }
.fjn-tvis__rem--failed { color: var(--fjn-danger-700); }
.fjn-tvis__rem--late { color: var(--fjn-text-3); }
.fjn-tvis__rem a { color: inherit; }
/* D201: the vehicle of the customer under the element „Klient” and „Zmień pojazd” */
.fjn-twz__client .fjn-tbk__who { border: 1px solid #D8DCE1; background: var(--fjn-surface); }
.fjn-tbk__change { border: 0; background: none; padding: 8px 0; color: var(--fjn-brand-600); font: inherit; font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.fjn-tbk__vlist { display: flex; flex-direction: column; gap: 8px; }
.fjn-tbk__vpick { width: 100%; text-align: left; font: inherit; cursor: pointer; }
.fjn-twz__client .fjn-tbk__vpick.is-on { border: 2px solid var(--fjn-brand-600); background: var(--fjn-brand-50); }
/* 4.26.1 (owner, D201 T): the customer's phone in the vehicle row is never cut — the line wraps, the number stays whole */
.fjn-twz__client .fjn-tbk__who small { white-space: normal; }
.fjn-twz__client .fjn-tbk__who small .fjn-mono { white-space: nowrap; }