/* FJN System — E1 block 9: E1-42 „Przewozy” and E1-43 the driver's transfer (ModWydania „przewozy”, „kierowca*”). */

.fjn-trips { gap: 14px; }
.fjn-trips__head { display: flex; align-items: baseline; gap: 12px; }
.fjn-trips__title { margin: 0; font-size: 28px; line-height: 1.3; white-space: nowrap; }
.fjn-trips__count { font-size: 15px; color: var(--fjn-text-2); white-space: nowrap; }
.fjn-trips__filters { display: flex; gap: 10px; flex-wrap: wrap; }
.fjn-trips__list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.fjn-trips__row {
  display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 150px; gap: 10px 16px; align-items: center;
  padding: 14px 16px; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: var(--fjn-r-lg);
}
.fjn-trips__route, .fjn-trips__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
/* D191 pkt 12: the card stays on the screen — a long route wraps to 2 lines, then „…” (full name in the trip) */
.fjn-trips__route b { font-size: 17px; overflow: hidden; overflow-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.fjn-trips__route span { font-size: 14px; color: var(--fjn-text-2); }
.fjn-trips__who { font-size: 14px; }
.fjn-trips__who b, .fjn-trips__who span { white-space: nowrap; }
.fjn-trips__who span { color: var(--fjn-text-2); }
.fjn-trips__none { font-size: 15px; color: var(--fjn-text-2); }
@media (max-width: 767px) {
  .fjn-trips__title { font-size: 22px; }
  .fjn-trips__row { grid-template-columns: minmax(0, 1fr) auto; }
  .fjn-trips__chip { justify-self: start; }
  .fjn-trips__who { align-items: flex-end; }
}

/* E1-43 (phone) */
.fjn-trip { display: flex; flex-direction: column; gap: 14px; min-height: calc(100vh - var(--fjn-topbar-h-m) - var(--fjn-bottomnav-h) - 32px); padding: 16px; box-sizing: border-box; }
.fjn-trip__head { display: flex; flex-direction: column; gap: 4px; }
.fjn-trip__head span { font-size: 14px; color: var(--fjn-text-2); }
.fjn-trip__title { margin: 0; font-size: 24px; line-height: 30px; }
.fjn-trip__card { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: var(--fjn-r-lg); }
.fjn-trip__line { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fjn-trip__line b { font-size: 18px; }
.fjn-trip__line span, .fjn-trip__pickup { font-size: 14px; color: var(--fjn-text-2); }
.fjn-trip__scan {
  display: flex; align-items: center; justify-content: center; gap: 10px; height: 56px; box-sizing: border-box;
  border: 2px solid var(--fjn-text); border-radius: 8px; background: var(--fjn-surface); color: var(--fjn-text); font-size: 18px; font-weight: 700; text-decoration: none;
}
.fjn-trip__gap { flex: 1; }
.fjn-trip__main {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 64px; border: 0; border-radius: 10px;
  background: var(--fjn-brand-600); color: var(--fjn-text-inverse); font: inherit; font-size: 20px; font-weight: 700; text-decoration: none; cursor: pointer;
}
.fjn-trip__main:hover { color: var(--fjn-text-inverse); text-decoration: none; }
.fjn-trip__main--ok { background: var(--fjn-success-700); }
.fjn-trip__main--next { justify-content: space-between; padding: 0 16px; }
.fjn-trip__state { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 10px; }
.fjn-trip__state div { display: flex; flex-direction: column; gap: 2px; font-size: 14px; color: var(--fjn-text); }
.fjn-trip__state div > b { font-size: 17px; }
.fjn-trip__state--way { background: var(--fjn-brand-100); color: var(--fjn-brand-600); }
.fjn-trip__state--way div > b { color: var(--fjn-brand-700); }
.fjn-trip__state--done { background: var(--fjn-success-100); color: var(--fjn-success-700); }
.fjn-trip__state--done div > b { color: var(--fjn-success-700); }
.fjn-trip__none { font-size: 15px; color: var(--fjn-text-2); }
@media (min-width: 768px) { .fjn-trip { max-width: 560px; margin: 0 auto; min-height: 0; } }

/* E1-42a / E1-42b form (D132) */
.fjn-tform { display: flex; flex-direction: column; min-height: 100%; }
.fjn-tform__body { display: flex; flex-direction: column; gap: 16px; padding: 24px 32px 120px; }
.fjn-tform__head { display: flex; flex-direction: column; gap: 4px; }
.fjn-tform__titlerow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.fjn-tform__title { margin: 0; font-size: 28px; line-height: 36px; }
.fjn-tform__chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 700; }
.fjn-tform__chip i { width: 8px; height: 8px; background: currentColor; }
.fjn-tform__lock { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 8px; background: var(--fjn-neutral-100); color: var(--fjn-text-2); font-size: 14px; line-height: 20px; }
.fjn-tform__lock span { color: var(--fjn-text); }
.fjn-tform__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 16px; align-items: start; }
.fjn-tform__grid.is-locked .fjn-tform__card { opacity: .6; }
.fjn-tform__card { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 16px; min-width: 0; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: var(--fjn-r-lg); }
#fjn-tform-orders { gap: 10px; }
.fjn-tform__h2 { font-size: 16px; }
.fjn-tform__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fjn-tform__field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fjn-tform__field label { font-size: 14px; font-weight: 700; }
.fjn-tform__field .fjn-select, .fjn-tform__field .fjn-input-group { height: 40px; }
.fjn-tform__hint { font-size: 13px; line-height: 18px; color: var(--fjn-text-2); }
.fjn-tform__orders-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fjn-tform__orders-head span { font-size: 13px; color: var(--fjn-text-2); white-space: nowrap; }
.fjn-tform__filter { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--fjn-border-strong); border-radius: var(--fjn-r-md); color: var(--fjn-text-3); }
.fjn-tform__filter input { flex: 1; min-width: 0; border: 0; outline: none; background: none; font: inherit; font-size: 15px; }
.fjn-tform__order { position: relative; display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 12px; box-sizing: border-box; border: 1px solid var(--fjn-border); border-radius: 8px; cursor: pointer; }
.fjn-tform__order[hidden] { display: none; }
.fjn-tform__order input { position: absolute; opacity: 0; }
.fjn-tform__order.is-checked { border-color: var(--fjn-brand-600); background: var(--fjn-brand-50); }
.fjn-tform__box { display: flex; align-items: center; justify-content: center; flex: none; width: 22px; height: 22px; box-sizing: border-box; border: 1.5px solid var(--fjn-border-strong); border-radius: 5px; color: transparent; }
.fjn-tform__order.is-checked .fjn-tform__box { border: 0; background: var(--fjn-brand-600); color: var(--fjn-text-inverse); }
.fjn-tform__order input:focus-visible + .fjn-tform__box { box-shadow: var(--fjn-focus); }
.fjn-tform__otext { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.fjn-tform__otext span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.fjn-tform__otext span + span { font-size: 13px; color: var(--fjn-text-2); }
.fjn-tform__labels { display: inline-flex; align-items: center; gap: 4px; flex: none; height: 22px; padding: 0 8px; border-radius: 999px; background: var(--fjn-warning-100); color: var(--fjn-warning-700); font-size: 12px; font-weight: 700; white-space: nowrap; }
.fjn-tform__none { margin: 0; font-size: 14px; color: var(--fjn-text-2); }
.fjn-tform__foot { position: fixed; right: 0; bottom: 0; left: var(--fjn-sidebar-w); z-index: 20; display: flex; justify-content: flex-end; gap: 10px; padding: 12px 24px; background: var(--fjn-surface); border-top: 1px solid var(--fjn-border); }
.fjn-tform__btn { height: 44px; }
.fjn-tform__cancel { margin-right: auto; }
.fjn-tcancel__head { display: flex; flex-direction: column; gap: 6px; padding: 20px 20px 8px; }
.fjn-tcancel__title { margin: 0; font-size: 19px; line-height: 26px; }
.fjn-tcancel__sub { margin: 0; font-size: 14px; line-height: 20px; color: var(--fjn-text-2); }
.fjn-tcancel__body { display: flex; flex-direction: column; gap: 12px; padding: 8px 20px 16px; }
.fjn-tcancel__field { display: flex; flex-direction: column; gap: 6px; }
.fjn-tcancel__field[hidden] { display: none; }
.fjn-tcancel__field label { font-size: 14px; font-weight: 700; }
.fjn-tcancel__hint { font-size: 13px; color: var(--fjn-text-2); }
.fjn-trips__row--link { color: inherit; font-weight: 400; text-decoration: none; }
.fjn-trips__row--link:hover { border-color: var(--fjn-brand-600); text-decoration: none; color: inherit; }
.fjn-trips__labels { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; align-self: flex-start; height: 22px; padding: 0 8px; border-radius: 999px; background: var(--fjn-warning-100); color: var(--fjn-warning-700); font-size: 12px; font-weight: 700; }
@media (max-width: 1279px) {
  .fjn-tform__body { padding: 20px 24px 120px; }
  .fjn-tform__foot { left: var(--fjn-rail-w); }
  .fjn-tform__btn { height: 52px; }
  .fjn-tform__field .fjn-select, .fjn-tform__field .fjn-input-group { height: 52px; }
}
@media (max-width: 767px) {
  .fjn-tform__body { padding: 16px 16px 180px; }
  .fjn-tform__grid, .fjn-tform__fields { grid-template-columns: minmax(0, 1fr); }
  .fjn-tform__foot { left: 0; bottom: var(--fjn-bottomnav-h); padding: 12px 16px; }
  .fjn-tform__btn { flex: 1; }
}
.fjn-trips__head .fjn-trips__new { margin-left: auto; align-self: center; height: 40px; }

/* E1-24 „Przewozy (n)” (D132 pt 4) */
.fjn-otrips { display: flex; flex-direction: column; gap: 14px; }
.fjn-otrips__banner { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 8px; background: var(--fjn-info-100); color: var(--fjn-info-700); font-size: 14px; line-height: 20px; }
.fjn-otrips__banner span { color: var(--fjn-text); }
.fjn-otrips__card { display: flex; flex-direction: column; gap: 10px; padding: 16px; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: var(--fjn-r-lg); }
.fjn-otrips__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.fjn-otrips__top div { display: flex; flex-direction: column; gap: 2px; }
.fjn-otrips__top b { font-size: 16px; }
.fjn-otrips__top span { font-size: 14px; color: var(--fjn-text-2); }
.fjn-otrips__rows { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 8px 12px; margin: 0; font-size: 14px; }
.fjn-otrips__rows dt { color: var(--fjn-text-2); }
.fjn-otrips__rows dd { margin: 0; }
.fjn-otrips__wait { color: var(--fjn-warning-700); font-weight: 700; }
.fjn-otrips__none { font-size: 14px; color: var(--fjn-text-2); }
.fjn-tform__cal { position: relative; overflow: visible; }
.fjn-tform__cal [data-fjn-att-calendar-toggle] { cursor: pointer; pointer-events: auto; }

/* D133: one state chip everywhere (square marker) */
.fjn-tchip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.fjn-tchip i { width: 8px; height: 8px; background: currentColor; }
.fjn-tchip--to_pick { background: var(--fjn-brand-100); color: var(--fjn-brand-700); }
.fjn-tchip--on_the_way { background: var(--fjn-warning-100); color: var(--fjn-warning-700); }
.fjn-tchip--arrived { background: var(--fjn-success-100); color: var(--fjn-success-700); }
.fjn-tchip--cancelled { background: var(--fjn-neutral-100); color: var(--fjn-neutral-700); }
.fjn-trips__chip { justify-self: end; }
@media (max-width: 767px) { .fjn-trips__row .fjn-trips__chip { justify-self: start; } }  /* E1-42_M: under the route, left */
.fjn-trips__arrived { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border-radius: 10px; background: var(--fjn-success-100); color: var(--fjn-success-700); }
.fjn-trips__arrived > svg { flex: none; align-self: flex-start; margin-top: 2px; }
.fjn-trips__arrived div { flex: 1 1 240px; display: flex; flex-direction: column; gap: 2px; }
.fjn-trips__arrived span { font-size: 14px; color: var(--fjn-text); }
.fjn-trips__arrived-btn { height: 56px; border-color: var(--fjn-success-700); background: var(--fjn-success-700); color: var(--fjn-text-inverse); }
.fjn-trips__arrived-btn:hover { color: var(--fjn-text-inverse); text-decoration: none; }
.fjn-trips__empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 36px 20px; text-align: center; background: var(--fjn-surface); border: 1px solid var(--fjn-border); border-radius: var(--fjn-r-lg); }
.fjn-trips__empty-icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 12px; background: var(--fjn-surface-2); color: var(--fjn-text-2); }
.fjn-trips__empty b { font-size: 18px; }
.fjn-trips__empty span { max-width: 420px; font-size: 14px; line-height: 20px; color: var(--fjn-text-2); }
.fjn-trips__empty-btn { height: 56px; }
/* D188 pkt 15 (E1-42_M_przewozy-odbior-od-serwisu): M — two buttons above the filters, half width each, 56 px */
.fjn-trips__mbtns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.fjn-trips__mbtns .fjn-btn { height: 56px; padding: 0 8px; font-size: 16px; white-space: nowrap; }
.fjn-trips__mbtns .fjn-btn--secondary { border-color: var(--fjn-brand-600); color: var(--fjn-brand-600); }
