:root{
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 10px;
  --space-4: 12px;
  --space-5: 14px;
  --space-6: 16px;

  --font-size-xs: 12px;
  --font-size-sm: 13px;
  --font-size-md: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 20px;
  --ui-control-height: 40px;
  --ui-control-radius: 6px;
  --ui-radius-window: 12px;
  --ui-radius-inner: 10px;

  /* Single source of truth: help tooltip component */
  --help-btn-size: 20px;
  --help-btn-font-size: 11px;
  --help-btn-border: rgba(var(--p-slate-600), 0.22);
  --help-btn-bg: rgba(var(--p-slate-600), 0.08);
  --help-btn-color: rgba(var(--p-slate-700), 0.68);
  --help-btn-hover-border: rgba(var(--p-slate-700), 0.30);
  --help-btn-hover-bg: rgba(var(--p-slate-600), 0.13);
  --help-btn-hover-color: rgba(var(--p-slate-700), 0.88);
}

/* ---- Utilities ---- */
.u-m-0{ margin: 0 !important; }
.u-mt-6{ margin-top: 6px !important; }
.u-mt-8{ margin-top: var(--space-2) !important; }
.u-mt-10{ margin-top: var(--space-3) !important; }
.u-mt-12{ margin-top: var(--space-4) !important; }
.u-mb-8{ margin-bottom: var(--space-2) !important; }
.u-mb-10{ margin-bottom: var(--space-3) !important; }
.u-mb-12{ margin-bottom: var(--space-4) !important; }
.u-my-14{ margin-top: var(--space-5) !important; margin-bottom: var(--space-5) !important; }

.u-gap-8{ gap: var(--space-2) !important; }
.u-align-center{ align-items: center !important; }
.u-justify-end{ justify-content: flex-end !important; }
.u-row-center-gap-8{ align-items: center !important; gap: var(--space-2) !important; }
.u-input-auto{ width: auto !important; }

.row > form{
  margin: 0;
}

.col-10{ width: 10%; }
.col-12{ width: 12%; }
.col-14{ width: 14%; }
.col-16{ width: 16%; }
.col-18{ width: 18%; }
.col-20{ width: 20%; }
.col-22{ width: 22%; }
.col-24{ width: 24%; }
.col-26{ width: 26%; }
.col-30{ width: 30%; }
.col-34{ width: 34%; }

/* ---- Typografia / rytm ---- */
.card h1{
  margin: 0;
  font-size: clamp(1.32rem, 1.8vw, 1.72rem);
  line-height: 1.2;
}
.card h2{
  margin: 0;
  font-size: clamp(1.12rem, 1.45vw, 1.36rem);
  line-height: 1.25;
}
.card h3{
  margin: 0;
  font-size: clamp(1rem, 1.2vw, 1.1rem);
  line-height: 1.25;
}

.small{
  font-size: var(--font-size-sm);
}

/* ---- Spójność przycisków ---- */
.btn{
  font-size: var(--font-size-md);
  font-family: var(--sans) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px;
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  width: auto !important;
  max-width: 100%;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  box-sizing: border-box;
  padding: 0 14px !important;
}
.btn--small{
  font-size: var(--font-size-sm);
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  padding: 0 14px !important;
}
.btn--tiny{
  font-size: var(--font-size-xs);
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  padding: 0 12px !important;
}
.btn--danger{
  padding: 0 14px;
  font-size: var(--font-size-md);
}
.btn--small.btn--danger{
  padding: 0 14px;
  font-size: var(--font-size-sm);
}
.btn--tiny.btn--danger{
  padding: 0 12px;
  font-size: var(--font-size-xs);
}

/* ---- Modularne menu akcji (⋯) ---- */
.action-menu{
  display: inline-block;
}
.sortmenu.action-menu[open]{
  z-index: 2000;
}
.card:has(.action-menu){
  overflow: visible;
}
.card:has(.action-menu) .card__body{
  overflow: visible;
}
.action-menu__button{
  min-height: 30px;
  min-width: 30px;
  padding: 0 6px;
  border: 1px solid var(--ui-border-strong);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-muted);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.action-menu__button::after{
  display: none;
}
.action-menu__button:hover{
  background: var(--ui-neutral-hover);
  border-color: var(--ui-border-strong);
}
.action-menu__button:focus-visible{
  outline: 2px solid var(--ui-primary);
  outline-offset: 2px;
}
.action-menu__dots{
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.action-menu__panel{
  right: 0;
  left: auto;
  min-width: 180px;
  max-width: min(360px, calc(100vw - 24px));
  overflow: visible !important;
  z-index: 2100;
  background: var(--ui-surface) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 16px 44px rgba(15, 23, 42, .18), 0 2px 6px rgba(15, 23, 42, .08) !important;
}
.sortmenu__panel{
  z-index: 2100;
}

/* Pozwól dropdownowi w detalu tematu todo wyjść poza zaokrąglone ramy okna */
.todo-detail:has(.action-menu[open]){
  overflow: visible !important;
}
.action-menu__panel .sortmenu__option{
  white-space: normal;
  overflow-wrap: anywhere;
}
.action-menu__option-danger{
  color: var(--c-red-800);
}
.action-menu__option-danger:hover{
  background: rgba(var(--p-red-600), .08);
}

/* ---- Widoczność akcji w tabelach ---- */
.table--people td[data-label="Akcje"],
.rental-tree__vendor-actions,
.rental-tree__item-actions{
  overflow: visible;
}
.table--people,
.table--people tbody,
.table--people tr,
.table--people td,
.table--people th{
  overflow: visible !important;
}

/* ---- No-scroll policy (internal containers) ----
   Zasada: brak wewnętrznych scrollbarów.
   Przewijanie ma być wyłącznie naturalne na stronie, gdy danych jest naprawdę dużo. */
.tablewrap,
.tablewrap--packlist{
  overflow: hidden !important;
}

/* Keep action dropdown panels visible while preserving rounded corners elsewhere */
.tablewrap:has(.action-menu),
.tablewrap--packlist:has(.action-menu){
  overflow: visible !important;
}

.table,
.table--editor,
.table--inventory,
.table--people,
.table--inventory-avail,
.table--events,
.table--report,
.table--packlist{
  min-width: 0 !important;
}

.table th,
.table td{
  white-space: normal;
  overflow-wrap: anywhere;
  vertical-align: top !important;
}

/* Checklista packlisty: „anywhere” + wąska komórka = tekst co znak — tylko sensowne łamanie wyrazów */
.table--checklist th,
.table--checklist td{
  overflow-wrap: break-word !important;
  word-break: normal !important;
  vertical-align: middle !important;
}

.table--editor tr.is-editing td{
  vertical-align: top !important;
}

.table--inventory{
  table-layout: fixed;
}

.table--inventory th,
.table--inventory td{
  font-size: var(--font-size-md) !important;
  line-height: 1.35 !important;
  vertical-align: middle !important;
  text-align: center !important;
}

.table--inventory th:nth-child(1),
.table--inventory td:nth-child(1),
.table--inventory th:nth-child(2),
.table--inventory td:nth-child(2){
  text-align: left !important;
}

.table--inventory th.num,
.table--inventory td.num{
  text-align: center !important;
}

.table--inventory td.num .inv-inline__display{
  text-align: inherit !important;
}

.table--inventory td.num:not([data-label="Akcje"]) .inv-inline__unit{
  justify-content: center;
}

.table--inventory td.num:not([data-label="Akcje"]) .inv-inline__unit input{
  max-width: 96px;
  text-align: center;
}

.table--editor .inv-inline__edit{
  width: 100%;
}

.table--editor .inv-inline__edit input,
.table--editor .inv-inline__edit select{
  width: 100%;
  box-sizing: border-box;
}

.table--editor .inv-inline__unit input{
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
}

.table--editor .inv-inline__actions{
  align-items: center;
}

.table--inventory .inv-inline__actions{
  justify-content: center;
}

/* Checklista: przewijanie poziome zamiast ściskania tabeli poniżej sensownej szerokości */
[data-packlist-checklist] .tablewrap.tablewrap--packlist{
  overflow-x: auto !important;
}

/* Packlist checklist page */
.packlist-checklist__summary{
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

.packlist-checklist__stats{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.packlist-checklist__progress{
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: var(--ui-surface-soft);
  border: 1px solid var(--ui-border-soft);
  overflow: hidden;
}

.packlist-checklist__progress-bar{
  height: 100%;
  width: 0;
  background: var(--ui-primary);
  transition: width .2s ease;
}

.packlist-checklist__bulk{
  flex-wrap: wrap;
  align-items: stretch;
}

/* Checklist: ✓ wąsko, szersza ilość, sprzęt do ~połowy, notatka = prawa połowa (50%) */
.table--checklist{
  table-layout: fixed !important;
  width: 100%;
}

.table--checklist__col-cb{
  width: 48px;
}

.table--checklist__col-qty{
  width: 88px;
}

.table--checklist__col-name{
  min-width: 10rem;
}

.table--checklist__col-note{
  width: 50%;
  min-width: 11rem;
}

.table--checklist .table--checklist__th-cb{
  width: 48px;
  max-width: 56px;
  padding: 10px 2px !important;
  text-align: center !important;
}

.table--checklist td:first-child,
.table--checklist th.table--checklist__th-cb{
  box-sizing: border-box;
}

.table--checklist td:first-child{
  width: 48px;
  max-width: 56px;
  padding: 10px 2px !important;
  text-align: center !important;
}

.table--checklist form[data-checklist-toggle-form]{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  max-width: 100%;
  margin: 0;
}

.table--checklist th:nth-child(2),
.table--checklist td:nth-child(2){
  width: 88px;
  max-width: 120px;
  padding-left: 10px !important;
  padding-right: 10px !important;
  text-align: center !important;
  vertical-align: middle !important;
}

/* Ilość: trzymamy zwykłą komórkę tabeli (display: table-cell) — wcześniejsze
   `display: flex !important` wyrywało komórkę z layoutu tabeli, przez co jej
   `border-bottom` nie pokrywał się z sąsiednimi (rozjazd podkreślenia w
   kolumnie ilości na desktopie i — z powodu wysokiej specyficzności selektora
   — także na mobile). Centrowanie zapewniają już `text-align: center` +
   `vertical-align: middle` wyżej. */
table.table.table--packlist.table--checklist > thead > tr > th:nth-child(2),
table.table.table--packlist.table--checklist > tbody > tr > td:nth-child(2){
  display: table-cell !important;
  box-sizing: border-box;
  text-align: center !important;
  vertical-align: middle !important;
}

.table--checklist th:nth-child(3),
.table--checklist td:nth-child(3){
  min-width: 10rem;
  width: auto;
}

.table--checklist th:nth-child(4),
.table--checklist td:nth-child(4){
  width: 50%;
  min-width: 11rem;
  box-sizing: border-box;
  padding-left: 16px !important;
  padding-right: 12px !important;
  border-left: 1px solid var(--ui-border-soft);
}

.table--checklist tr.is-checked td{
  background: rgba(var(--p-teal-500), .08);
}

.packlist-checklist__checkbox-wrap{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 36px;
  padding: 0;
}

.packlist-checklist__checkbox-wrap input[type="checkbox"]{
  width: 22px;
  height: 22px;
  accent-color: var(--ui-primary);
  cursor: pointer;
}

.packlist-checklist__checkbox-wrap input[type="checkbox"]:disabled{
  cursor: not-allowed;
  opacity: .6;
}

/* Checklista — kompaktowy układ na komórce: checkbox po lewej, wszystko widoczne, duża strefa kliknięcia */
@media (max-width: 900px){
  .table--checklist{
    table-layout: auto !important;
  }
  .table--checklist thead{
    display: none;
  }
  .table--checklist tbody,
  .table--checklist tr,
  .table--checklist td{
    display: block;
    width: 100%;
    max-width: none !important;
  }
  .table--checklist tr{
    display: grid !important;
    grid-template-columns: 56px 1fr;
    grid-template-areas:
      "cb name"
      "cb qty"
      "cb note";
    align-items: center;
    column-gap: 12px;
    row-gap: 4px;
    padding: 12px 12px;
    border-bottom: 1px solid var(--line);
  }
  .table--checklist tr:last-child{
    border-bottom: 0;
  }
  .table--checklist td{
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 0 !important;
    text-align: left !important;
  }
  .table--checklist td::before{
    display: none !important;
  }
  .table--checklist td:first-child{
    grid-area: cb;
    width: 56px !important;
    max-width: 56px !important;
    align-self: center;
    justify-self: center;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 0 !important;
  }
  .table--checklist td:nth-child(2),
  table.table.table--packlist.table--checklist > tbody > tr > td:nth-child(2){
    grid-area: qty;
    width: auto !important;
    max-width: none !important;
    text-align: left !important;
    color: var(--muted);
    font-size: var(--font-size-sm);
    padding: 0 !important;
    display: block !important;
  }
  .table--checklist td:nth-child(2)::before{
    content: "Ilość: ";
    display: inline !important;
    margin: 0;
    font-weight: 700;
    color: var(--muted);
  }
  .table--checklist td:nth-child(3){
    grid-area: name;
    width: auto !important;
    min-width: 0;
  }
  .table--checklist td:nth-child(4){
    grid-area: note;
    width: auto !important;
    min-width: 0;
    border-left: 0 !important;
    padding: 0 !important;
    color: var(--muted);
    font-size: var(--font-size-sm);
  }
  /* Pusty stan ("Brak pozycji…") */
  .table--checklist tbody tr:has(td[colspan]){
    display: block !important;
    grid-template-columns: none;
    padding: 12px;
  }
  .table--checklist tbody tr:has(td[colspan]) td,
  .table--checklist tbody tr:has(td[colspan]) td:first-child{
    display: block !important;
    grid-area: auto !important;
    width: 100% !important;
    max-width: none !important;
  }

  /* Większa strefa dotyku dla checkboxa: cały label-wrap */
  .table--checklist form[data-checklist-toggle-form]{
    width: 100% !important;
  }
  .table--checklist .packlist-checklist__checkbox-wrap{
    display: flex;
    width: 100%;
    min-height: 44px;
    min-width: 44px;
  }
  .table--checklist .packlist-checklist__checkbox-wrap input[type="checkbox"]{
    width: 26px;
    height: 26px;
  }

  .packlist-checklist__bulk{
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .packlist-checklist__bulk form,
  .packlist-checklist__bulk .btn{
    width: 100%;
    white-space: normal;
    text-align: center;
  }
}

/* Supplier catalog navigation */
.inventory-advanced-nav{
  display: inline-block;
}

.inventory-advanced-nav > summary{
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--ui-muted);
}

.inventory-advanced-nav__link{
  color: var(--ui-text-strong);
  text-decoration: none;
}

.inventory-advanced-nav__link:hover{
  color: var(--ui-primary);
  text-decoration: underline;
}

.supplier-catalog-layout{
  display: grid;
  gap: 12px;
  align-items: start;
}

@media (min-width: 980px){
  .supplier-catalog-layout{
    grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);
  }
}

.supplier-catalog-sidebar{
  display: grid;
  gap: 10px;
  align-content: start;
}

.supplier-catalog-list{
  display: grid;
  gap: 8px;
}

.supplier-catalog-list__item{
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-inner);
  background: var(--ui-surface);
  text-decoration: none;
  color: var(--ui-text);
}

.supplier-catalog-list__item:hover{
  border-color: var(--ui-primary-border);
  background: var(--ui-primary-soft);
}

.supplier-catalog-list__item.is-active{
  border-color: var(--ui-primary-border);
  background: var(--ui-primary-soft);
  box-shadow: inset 0 0 0 1px var(--ui-primary-border);
}

.supplier-catalog-list__name{
  color: var(--ui-text-strong);
  font-weight: 600;
  line-height: 1.3;
}

.supplier-catalog-list__meta{
  color: var(--ui-muted);
  font-size: 12px;
  line-height: 1.3;
}

.supplier-catalog-content{
  min-width: 0;
}

.theme-dark-row{
  margin-bottom: 16px;
}

.theme-dark-switch{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

.theme-dark-switch__input{
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip: rect(0 0 0 0);
}

.theme-dark-switch__track{
  position: relative;
  width: 44px;
  height: 24px;
  flex: 0 0 44px;
  border-radius: 999px;
  background: var(--ui-border);
  transition: background 0.15s ease;
}

.theme-dark-switch__track::after{
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--ui-surface);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  transition: transform 0.15s ease;
}

.theme-dark-switch__input:checked + .theme-dark-switch__track{
  background: var(--ui-primary);
}

.theme-dark-switch__input:checked + .theme-dark-switch__track::after{
  transform: translateX(20px);
}

.theme-dark-switch__input:focus-visible + .theme-dark-switch__track{
  outline: 2px solid var(--ui-primary);
  outline-offset: 2px;
}

.theme-dark-switch__label{
  font-weight: 600;
  color: var(--ui-text);
}

.theme-upload-toolbar{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 16px;
  margin-bottom: 16px;
}

.theme-upload-form{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.theme-upload-form__select{
  max-width: 180px;
}

.theme-upload-form__file{
  max-width: min(280px, 100%);
}

.theme-upload-form__submit{
  flex-shrink: 0;
}

.theme-remove-inline{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.theme-remove-inline form{
  margin: 0;
}

.theme-settings-previews{
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

.theme-settings-preview{
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-window);
  background: var(--ui-surface);
  padding: 10px;
}

.theme-settings-preview--empty{
  border-style: dashed;
}

.theme-settings-preview__image{
  margin-top: 8px;
  width: 100%;
  max-height: 180px;
  object-fit: cover;
  border-radius: var(--ui-radius-inner);
  border: 1px solid var(--ui-border);
}

.theme-settings-preview__image--logo{
  object-fit: contain;
  background: var(--ui-surface);
  padding: 8px;
  box-sizing: border-box;
}

/* ---- Settings page: consistent high-contrast theme ---- */
.page-settings h1,
.page-settings h2,
.page-settings h3{
  color: var(--ui-text) !important;
}

.page-settings p,
.page-settings .small,
.page-settings .muted{
  color: var(--ui-muted) !important;
}

.page-settings .card__head h2{
  color: var(--ui-text) !important;
}

.ai-settings__modal-sub,
.ai-settings__meta-line,
.ai-settings__usage-hint,
.ai-settings__hint,
.ai-settings__statusline,
.ai-settings__note,
.ai-settings__key-source,
.ai-settings__reply-label,
.ai-settings__notes-lead,
.ai-settings__usage-lead{
  color: var(--ui-muted) !important;
}

.ai-settings__diag-title,
.ai-settings__usage-title,
.ai-settings__label,
.ai-settings__reply-body{
  color: var(--ui-text) !important;
}

.ai-settings__key-summary,
.ai-settings__reply,
.ai-settings__code{
  background: var(--ui-surface-soft) !important;
  border-color: var(--ui-border) !important;
  color: var(--ui-text) !important;
}

.ai-settings__pill{
  background: var(--ui-success-soft) !important;
  border-color: var(--ui-border-soft) !important;
  color: var(--ui-success) !important;
}

.ai-settings__pill--empty{
  background: var(--ui-surface) !important;
  border-color: var(--ui-border) !important;
  color: var(--ui-muted) !important;
}

/* Unified corner preset for all primary windows/panels */
.card,
.tablewrap,
.modal__dialog,
.modal__dialog--wide,
.modal__dialog--picker,
.action-menu__panel,
.sortmenu__panel,
.theme-settings-preview,
.calendar,
.calday,
.flatpickr-calendar,
.ft-help__panel{
  border-radius: var(--ui-radius-window) !important;
}

.card__head{
  border-radius: var(--ui-radius-window) var(--ui-radius-window) 0 0 !important;
}

.card__body{
  border-radius: 0 0 var(--ui-radius-window) var(--ui-radius-window) !important;
}

.modal__head,
.rental-tree__vendor-head,
.payments-card__head{
  border-top-left-radius: var(--ui-radius-window) !important;
  border-top-right-radius: var(--ui-radius-window) !important;
}

.modal__body{
  border-radius: 0 0 var(--ui-radius-window) var(--ui-radius-window) !important;
}

.card__head:only-child,
.modal__head:only-child{
  border-bottom-left-radius: var(--ui-radius-window) !important;
  border-bottom-right-radius: var(--ui-radius-window) !important;
}

.rental-tree__items,
.payments-topics{
  border-bottom-left-radius: var(--ui-radius-window) !important;
  border-bottom-right-radius: var(--ui-radius-window) !important;
}

.combo__panel{
  max-height: none !important;
  overflow: visible !important;
}

/* ---- Help tooltip (single, unified source) ---- */
.ft-titleline{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  flex-wrap: nowrap;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 8px;
}

.ft-titleline h1,
.ft-titleline h2,
.ft-titleline h3{
  margin: 0;
  flex: 0 1 auto;
  min-width: 0;
}

.ft-titleline .ft-help{
  flex: 0 0 auto;
  margin-left: 2px;
  align-self: center;
}

.ft-help{
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}

.ft-help:has(.ft-help__panel:not([hidden])){
  z-index: 50;
}

.ft-help__btn{
  width: var(--help-btn-size) !important;
  height: var(--help-btn-size) !important;
  min-width: var(--help-btn-size) !important;
  min-height: var(--help-btn-size) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border-radius: 999px !important;
  border: 1px solid var(--help-btn-border) !important;
  background: var(--help-btn-bg) !important;
  color: var(--help-btn-color) !important;
  font-size: var(--help-btn-font-size) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  font-family: var(--sans) !important;
  cursor: pointer;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.ft-help__btn:hover{
  color: var(--help-btn-hover-color) !important;
  background: var(--help-btn-hover-bg) !important;
  border-color: var(--help-btn-hover-border) !important;
}

.ft-help__btn:focus-visible{
  outline: none;
  box-shadow: var(--focus-ring);
}

.ft-help__mark{
  display: block;
  transform: translateY(-0.5px);
}

.ft-help__panel{
  position: fixed;
  z-index: 2400;
  top: 0;
  left: 0;
  min-width: 220px;
  max-width: min(340px, calc(100vw - 32px));
  max-height: min(70vh, 420px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--ui-border-strong);
  background: var(--ui-surface);
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.16);
  font-size: var(--font-size-sm);
  font-weight: 500;
  line-height: 1.5;
  color: var(--ui-text);
}

.ft-help__panel .ft-help__text{
  margin: 0;
}

.ft-help__panel .ft-help__text + .ft-help__text{
  margin-top: 8px;
}

.ft-label-with-help{
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 8px;
}

.ft-label-with-help .ft-help{
  flex: 0 0 auto;
  margin-left: 2px;
  align-self: center;
}

.ft-label-with-help > span:first-child,
.ft-label-with-help > label:first-child{
  flex: 0 1 auto;
  min-width: 0;
}

.modal__head .ft-titleline,
.modal__head .ft-help{
  align-self: flex-start;
}

.modal__head .ft-help__panel{
  right: 0;
  left: auto;
}

/* Reset old page-specific variants; keep one visual style everywhere */
.page-settings .container > .ft-titleline .ft-help__btn{
  color: var(--help-btn-color) !important;
  border-color: var(--help-btn-border) !important;
  background: var(--help-btn-bg) !important;
}

.page-settings .container > .ft-titleline .ft-help__btn:hover{
  color: var(--help-btn-hover-color) !important;
  border-color: var(--help-btn-hover-border) !important;
  background: var(--help-btn-hover-bg) !important;
}

/* Log musi mieć overflow-y + min-height:0 w kolumnie flex — inaczej długie odpowiedzi
   rozpychają panel i nie da się przewinąć rozmowy (wcześniej .log był w parze z .error-text). */
.ai-chat-widget__log{
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.ai-chat-widget__error-text{
  max-height: 160px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

/* ---- AI chat: same palette as current UI theme ---- */
.ai-chat-widget__panel{
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.22) !important;
}

.ai-chat-widget__head{
  border-bottom: 0 !important;
  background: transparent !important;
}

.ai-chat-widget__title{
  color: var(--ui-text-strong) !important;
}

.ai-chat-widget__close{
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-muted) !important;
  opacity: 1 !important;
}

.ai-chat-widget__close:hover{
  background: var(--ui-neutral-hover) !important;
  color: var(--ui-text-strong) !important;
}

.ai-chat-widget__log{
  background: transparent !important;
}

.ai-chat-widget__composer{
  border-top: 0 !important;
  background: transparent !important;
}

.ai-chat-widget__input{
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
}

.ai-chat-widget__input::placeholder{
  color: var(--ui-muted-soft) !important;
}

.ai-chat-widget__input:focus{
  border-color: var(--ui-primary) !important;
  box-shadow: 0 0 0 2px var(--ui-primary-ring) !important;
}

.ai-chat-widget__bubble{
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}

.ai-chat-widget__bubble--assistant{
  background: var(--ui-surface) !important;
  border-color: var(--ui-border-strong) !important;
}

.ai-chat-widget__bubble--assistant .ai-chat-widget__bubble-label{
  color: var(--ui-muted) !important;
}

.ai-chat-widget__bubble--assistant .ai-chat-widget__bubble-text{
  color: var(--ui-text) !important;
}

.ai-chat-widget__bubble--user{
  background: var(--ui-primary) !important;
  border-color: var(--ui-primary) !important;
  color: var(--ui-primary-on) !important;
  box-shadow: none !important;
}

.ai-chat-widget__bubble--user .ai-chat-widget__bubble-label{
  color: color-mix(in srgb, var(--ui-primary-on) 78%, transparent) !important;
}

.ai-chat-widget__bubble--user .ai-chat-widget__bubble-text{
  color: var(--ui-primary-on) !important;
}

.ai-chat-widget__error{
  border: 1px solid var(--ui-border-soft) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}

/* ---- AI chat: iMessage-style bubbles ---- */
.ai-chat-widget__bubble-label{
  display: none !important;
}

.ai-chat-widget__bubble{
  width: fit-content !important;
  max-width: 78% !important;
  padding: 9px 13px !important;
  border-radius: 20px !important;
  margin-bottom: 4px !important;
  border-width: 0 !important;
  box-shadow: none !important;
}

.ai-chat-widget__bubble + .ai-chat-widget__bubble{
  margin-top: 2px !important;
}

.ai-chat-widget__bubble--user{
  margin-left: auto !important;
  margin-right: 0 !important;
  border-bottom-right-radius: 6px !important;
}

.ai-chat-widget__bubble--assistant{
  margin-right: auto !important;
  margin-left: 0 !important;
  background: var(--ui-surface-alt) !important;
  color: var(--ui-text) !important;
  border-bottom-left-radius: 6px !important;
}

.ai-chat-widget__bubble--assistant .ai-chat-widget__bubble-text{
  color: var(--ui-text) !important;
}

.ai-chat-widget__bubble-text{
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.4 !important;
}

/* ---- Calendar refresh (Google-like, simple + consistent) ---- */
.calendar{
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: var(--ui-surface);
  padding: 12px;
}

.calendar__title{
  margin: 2px 56px 10px;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: var(--ui-text-strong);
}

.calendar__sidearrow{
  top: 8px;
  transform: none;
  width: 34px;
  height: 34px;
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface);
  color: var(--ui-muted);
  font-size: 22px;
  line-height: 1;
  box-shadow: none;
}
.calendar__sidearrow::before{
  display: none !important;
}
.calendar__sidearrow--left{
  left: 10px;
}
.calendar__sidearrow--right{
  right: 10px;
}
.calendar__sidearrow:hover{
  background: var(--ui-neutral-hover);
}
.calendar__sidearrow:focus-visible{
  outline: 2px solid var(--ui-primary);
  outline-offset: 2px;
}

.calendar__dow{
  gap: 0;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--ui-border-soft);
  padding-bottom: 6px;
}
.calendar__dow > div{
  text-align: center;
  color: var(--ui-muted);
  font-size: 11px;
  font-weight: 600;
}

.calendar__gridwrap{
  padding: 0;
  /* fallback gdy color-mix niedostępny */
  border-top: 1px solid rgba(148, 163, 184, 0.56) !important;
  border-left: 1px solid rgba(148, 163, 184, 0.56) !important;
  /* Siatka ma być czytelna w każdym presecie (jasny / ciemny / custom). */
  border-top: 1px solid color-mix(in srgb, var(--ui-text-strong) 24%, var(--ui-surface)) !important;
  border-left: 1px solid color-mix(in srgb, var(--ui-text-strong) 24%, var(--ui-surface)) !important;
  overflow: visible !important;
}
.calendar__grid{
  gap: 0;
}

.calendar__cell{
  min-height: 108px;
  padding: 6px;
  border: 0;
  /* fallback gdy color-mix niedostępny */
  border-right: 1px solid rgba(148, 163, 184, 0.52) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.52) !important;
  /* Linia komórki zawsze kontrastowa względem aktualnego tła motywu. */
  border-right: 1px solid color-mix(in srgb, var(--ui-text-strong) 22%, var(--ui-surface)) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ui-text-strong) 22%, var(--ui-surface)) !important;
  border-radius: 0;
  background: var(--ui-surface);
  box-shadow: none !important;
  transform: none !important;
  transition: none;
}
.calendar__cell:hover{
  transform: none !important;
}
.calendar__cell::after{
  display: none !important;
}

/*
 * Wracamy do poprzedniej wersji tła dni (bardziej stonowanej),
 * a różnicę robimy głównie przez wyraźniejszą siatkę.
 */
.calendar__cell.is-other:not(.is-past),
.calendar__cell.is-other.is-past{
  background: var(--ui-surface-soft) !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
}
.calendar__cell.is-other.calendar__cell--busy-event,
.calendar__cell.is-other.calendar__cell--busy-rental,
.calendar__cell.is-other.calendar__cell--busy-mixed,
.calendar__cell.is-other.is-past.calendar__cell--busy-event,
.calendar__cell.is-other.is-past.calendar__cell--busy-rental,
.calendar__cell.is-other.is-past.calendar__cell--busy-mixed{
  background: var(--ui-surface-soft) !important;
}
.calendar__cell.is-other .calendar__daynum{
  color: var(--ui-muted) !important;
}

.calendar__cell.is-past:not(.is-today){
  background: var(--ui-surface-soft);
  box-shadow: none !important;
}
.calendar__cell.is-past:not(.is-today):not(.is-selected) .calendar__daynum{
  color: var(--ui-muted);
}

.calendar__cell.is-today{
  background: var(--ui-surface);
  box-shadow: inset 0 0 0 2px var(--ui-primary) !important;
}
/* Tylko gdy „dziś” nie jest zaznaczony — inaczej primary na primary_soft gasi się w ciemnym motywie */
.calendar__cell.is-today:not(.is-selected) .calendar__daynum{
  color: var(--ui-primary);
  font-weight: 700;
}

.calendar__cell.is-selected{
  background: var(--ui-primary-soft);
  box-shadow: inset 0 0 0 2px var(--ui-primary) !important;
}
/* Ta sama specyficzność co .is-other:not(.is-past) + !important na tle — inaczej zaznaczenie majowych dni ginie */
.calendar__cell.is-selected.is-other{
  background: var(--ui-primary-soft) !important;
  box-shadow: inset 0 0 0 2px var(--ui-primary) !important;
}
.calendar__cell.is-selected .calendar__daynum{
  color: var(--ui-text-strong);
  font-weight: 700;
}

.calendar__daynum{
  font-size: 13px;
  color: var(--ui-text-strong);
}

.calendar__dot{
  width: 6px;
  height: 6px;
  border: 0;
}
.calendar__dot--event{
  background: var(--ui-danger);
}
.calendar__dot--rental{
  background: var(--ui-primary);
}

.calendar__bars{
  z-index: 4;
}
.calendar__bar{
  height: 18px;
  border-radius: 9px;
  padding: 1px 8px;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid transparent;
  box-shadow: none !important;
  transform-origin: center center !important;
  transition: transform 0.14s ease, box-shadow 0.14s ease !important;
  will-change: transform;
  text-decoration: none !important;
}
@media (hover: hover) and (pointer: fine){
  .calendar__bar:hover{
    transform: scale(1.01) !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.16) !important;
    z-index: 12;
  }
}
@media (prefers-reduced-motion: reduce){
  .calendar__bar{
    transition: none !important;
  }
  .calendar__bar:hover{
    transform: none !important;
    box-shadow: none !important;
  }
}
/*
 * Belki event / wynajem: na ciemnej siatce półprzezroczyste kolory z styles.css
 * stają się prawie czarne, a tekst zostaje ciemny — brak kontrastu.
 * Jasna „pastylka” + ciemny tekst: czytelne w jasnym i ciemnym motywie.
 */
.calendar__bar--event,
.calendar__bar.calendar__bar--past.calendar__bar--event,
.calendar__bar.calendar__bar--other-month.calendar__bar--event,
.calendar__bar.calendar__bar--past.calendar__bar--other-month.calendar__bar--event{
  background: color-mix(in srgb, var(--ui-danger) 22%, #ffffff) !important;
  border-color: color-mix(in srgb, var(--ui-danger) 48%, var(--ui-border)) !important;
  color: #3f0f18 !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
}
.calendar__bar--rental,
.calendar__bar.calendar__bar--past.calendar__bar--rental,
.calendar__bar.calendar__bar--other-month.calendar__bar--rental,
.calendar__bar.calendar__bar--past.calendar__bar--other-month.calendar__bar--rental{
  background: color-mix(in srgb, var(--ui-primary) 26%, #ffffff) !important;
  border-color: color-mix(in srgb, var(--ui-primary) 52%, var(--ui-border)) !important;
  color: #0a1628 !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
}
.calendar__bar.calendar__bar--other-month.calendar__bar--event,
.calendar__bar.calendar__bar--other-month.calendar__bar--rental{
  opacity: 0.72 !important;
}
.calendar__bar.calendar__bar--past.calendar__bar--other-month.calendar__bar--event,
.calendar__bar.calendar__bar--past.calendar__bar--other-month.calendar__bar--rental{
  opacity: 0.62 !important;
}
.calendar__bar.calendar__bar--past:not(.calendar__bar--other-month){
  opacity: 0.9 !important;
}

/* Belki z kolorem z Google / status organizacyjny — tło z inline style (ważniejsze niż --event/--rental). */
.calendar__bar--custom.calendar__bar--event,
.calendar__bar--custom.calendar__bar--rental{
  filter: none !important;
  -webkit-filter: none !important;
}
.calendar__bar--custom.calendar__bar--other-month{
  opacity: 0.78 !important;
}
.calendar__bar--custom.calendar__bar--past.calendar__bar--other-month{
  opacity: 0.68 !important;
}
.calendar__bar--custom.calendar__bar--past:not(.calendar__bar--other-month){
  opacity: 0.92 !important;
}

.calendar__bar:not(.calendar__bar--main){
  border-radius: 6px;
}
.calendar__bar--main{
  height: 28px;
  padding: 5px 8px;
  font-size: 12px;
  line-height: 16px;
  border-radius: 9px;
  z-index: 10;
}
.calendar__bar--join-left{
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
.calendar__bar--join-right{
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.calendar__bar--join-left:hover,
.calendar__bar--join-right:hover,
.calendar__bar-bridge:hover,
.calendar__bar-stem:hover{
  transform: none !important;
  box-shadow: none !important;
}
.calendar__bar,
.calendar__bar-bridge,
.calendar__bar-stem{
  z-index: 10;
}
.calendar__bar-bridge{
  position: absolute;
  height: 28px;
  padding: 0;
  border: none !important;
  pointer-events: auto;
  text-decoration: none;
  box-shadow: none !important;
}
.calendar__bar-stem{
  position: absolute;
  height: 3px;
  padding: 0;
  border: none !important;
  border-radius: 2px;
  pointer-events: auto;
  text-decoration: none;
  box-shadow: none !important;
}
.calendar__bar--seamless,
.calendar__bar--seamless.calendar__bar--event,
.calendar__bar--seamless.calendar__bar--rental,
.calendar__bar-bridge.calendar__bar--seamless,
.calendar__bar-stem.calendar__bar--seamless{
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
.calendar__cluster{
  position: absolute;
  pointer-events: none;
  z-index: 10;
  overflow: visible;
}
.calendar__cluster--linked{
  transform-origin: center center;
  transition: transform 0.14s ease, filter 0.14s ease;
  will-change: transform;
}
.calendar__cluster .calendar__bar,
.calendar__cluster .calendar__bar-bridge,
.calendar__cluster .calendar__bar-stem{
  pointer-events: auto;
}
.calendar__bar-outline{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  z-index: 1;
}
@media (hover: hover) and (pointer: fine){
  .calendar__cluster--linked:hover{
    transform: scale(1.01) !important;
    z-index: 12;
  }
  .calendar__cluster--linked:hover .calendar__bar-outline{
    filter: drop-shadow(0 2px 8px rgba(15, 23, 42, 0.16));
  }
  .calendar__cluster--linked .calendar__bar:hover,
  .calendar__cluster--linked .calendar__bar--join-left:hover,
  .calendar__cluster--linked .calendar__bar--join-right:hover,
  .calendar__cluster--linked .calendar__bar-bridge:hover,
  .calendar__cluster--linked .calendar__bar-stem:hover{
    transform: none !important;
    box-shadow: none !important;
  }
}
@media (prefers-reduced-motion: reduce){
  .calendar__cluster--linked{
    transition: none;
  }
  .calendar__cluster--linked:hover{
    transform: none !important;
  }
}
.form-row--hours{
  grid-template-columns: minmax(9rem, 1.4fr) minmax(6rem, 1fr) minmax(6rem, 1fr);
}
.form-hours__grid{
  display: grid;
  grid-template-columns: minmax(7rem, 0.85fr) minmax(8rem, 1.3fr) minmax(5.5rem, 1fr) minmax(5.5rem, 1fr) auto;
  gap: 8px 10px;
  align-items: center;
}
.form-hours__head{
  font-size: 12px;
  font-weight: 700;
  color: var(--ui-muted, var(--muted));
}
.form-hours__name label{
  display: block;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 600;
}
.form-hours__reset{
  justify-self: end;
  white-space: nowrap;
}
.ft-time{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--ui-border-strong, var(--ui-border));
  border-radius: 10px;
  background: var(--ui-surface, #fff);
  box-sizing: border-box;
}
.ft-time:focus-within{
  border-color: var(--ui-primary, #2563eb);
  box-shadow: 0 0 0 3px var(--ui-primary-ring, rgba(37, 99, 235, 0.18));
}
.ft-time__part{
  width: 2.6ch !important;
  max-width: 2.6ch !important;
  min-width: 0 !important;
  flex: 0 0 2.6ch;
  height: auto;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: center;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  line-height: 1.2;
}
.ft-time__part[data-ft-time-part="minute"]{
  font-weight: 400;
}
.ft-time__part:focus{
  outline: none;
  box-shadow: none !important;
}
.ft-time__sep{
  flex: 0 0 auto;
  padding: 0 3px;
  color: var(--ui-muted, #64748b);
  font-weight: 500;
  line-height: 1;
}
.ft-time-panel{
  position: fixed;
  z-index: 4200;
  overflow: hidden;
  border: 1px solid var(--ui-border-strong, var(--ui-border));
  border-radius: 10px;
  background: var(--ui-surface, #fff);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
}
.ft-time-panel.is-hidden{
  display: none;
}
.ft-time-panel.is-mode-hour [data-time-scroll="minute"],
.ft-time-panel.is-mode-minute [data-time-scroll="hour"]{
  display: none;
}
.ft-time-panel__scroll{
  max-height: 220px;
  overflow-y: auto;
  overscroll-behavior: contain;
  min-width: 64px;
}
.ft-time-panel__opt{
  display: block;
  width: 100%;
  padding: 7px 12px;
  border: 0;
  background: transparent;
  color: var(--ui-text, inherit);
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
  cursor: pointer;
}
.ft-time-panel__opt:hover,
.ft-time-panel__opt.is-selected{
  background: color-mix(in srgb, var(--ui-primary, #2563eb) 12%, transparent);
}
.form-hours .ft-time.is-hours-empty,
.form-hours .ft-time.is-hours-logic-bad,
.form-hours input.is-hours-empty,
.form-hours input.is-hours-logic-bad,
.form--compact input.is-fill-hint,
.form--compact textarea.is-fill-hint{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 18%, #ffffff) !important;
  border-color: color-mix(in srgb, var(--ui-danger, #dc2626) 62%, var(--ui-border, #cbd5e1)) !important;
}
.form--compact .map.is-fill-hint{
  border-color: color-mix(in srgb, var(--ui-danger, #dc2626) 62%, var(--ui-border, #cbd5e1)) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ui-danger, #dc2626) 28%, transparent);
}
.form--compact textarea[data-autosize]{
  min-height: 44px;
  resize: none;
  overflow: hidden;
  line-height: 1.45;
  padding-top: 10px;
  padding-bottom: 10px;
}
@media (max-width: 719px){
  .form-hours__grid{
    grid-template-columns: 1fr 1fr;
  }
  .form-hours__head{
    display: none;
  }
  .form-hours__name{
    grid-column: 1 / -1;
    margin-top: 4px;
  }
  .form-hours__grid input[type="date"]{
    grid-column: 1 / -1;
  }
  .form-hours__reset{
    grid-column: 1 / -1;
    justify-self: end;
  }
}

.calday{
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  background: var(--ui-surface);
  padding: 10px 12px;
}
.calday__event{
  border: 1px solid var(--ui-border);
  border-radius: 8px;
  background: var(--ui-surface);
  color: var(--ui-text-strong);
  font-size: 14px;
  font-weight: 600;
}
.calday__event:hover{
  border-color: var(--ui-primary);
  background: var(--ui-row-hover);
}

/* ---- Flatpickr refresh (Google-like simplicity) ---- */
.flatpickr-calendar.ft-gcal-picker{
  width: 322px;
  max-width: calc(100vw - 16px);
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius-window);
  background: var(--ui-surface) !important;
  box-shadow: 0 10px 28px rgba(60, 64, 67, 0.24);
  font-size: 14px;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-months{
  padding: 6px 8px 0;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-current-month{
  padding-top: 6px;
  font-size: 15px;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-calendar.ft-gcal-picker .flatpickr-current-month input.cur-year{
  font-size: 15px;
  font-weight: 600;
  color: var(--ui-text-strong);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-months .flatpickr-prev-month,
.flatpickr-calendar.ft-gcal-picker .flatpickr-months .flatpickr-next-month{
  top: 8px;
  width: 30px;
  height: 30px;
  padding: 0;
  border-radius: 999px;
  color: var(--ui-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-calendar.ft-gcal-picker .flatpickr-months .flatpickr-next-month:hover{
  background: var(--ui-neutral-hover);
  color: var(--ui-text-strong);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-weekdays{
  padding: 0 8px;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-weekday{
  color: var(--ui-muted);
  font-weight: 600;
  font-size: 11px;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-days,
.flatpickr-calendar.ft-gcal-picker .dayContainer{
  width: 304px;
  min-width: 304px;
  max-width: 304px;
}
.flatpickr-calendar.ft-gcal-picker .dayContainer{
  padding: 4px 8px 8px;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day{
  height: 38px;
  line-height: 38px;
  max-width: 40px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid transparent;
  color: var(--ui-text);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.today{
  border-color: var(--ui-primary);
  color: var(--ui-primary);
  background: var(--ui-surface);
  box-shadow: none !important;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.ft-cal-day-future,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.ft-cal-day-past{
  box-shadow: none !important;
  position: static;
  z-index: auto;
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.ft-cal-day-past{
  color: var(--ui-muted-soft);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.selected,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.startRange,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.endRange{
  background: var(--ui-primary);
  border-color: var(--ui-primary);
  color: var(--ui-primary-on);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day:hover{
  background: var(--ui-neutral-hover);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.selected:hover,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.startRange:hover,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.endRange:hover{
  background: var(--ui-primary);
}
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.flatpickr-disabled,
.flatpickr-calendar.ft-gcal-picker .flatpickr-day.notAllowed{
  color: var(--ui-muted-soft);
  opacity: .5;
}
.ft-cal-nav-arrow{
  font-size: 18px;
  line-height: 1;
}

/* =========================================================
   Simplified Global Theme (modular, reusable, consistent)
   ========================================================= */
:root{
  --ui-bg: #c3d0e1;
  --ui-surface: #e8f0f8;
  --ui-surface-soft: #dfe9f4;
  --ui-surface-alt: #d5e1ee;
  --ui-border: #afc1d6;
  --ui-border-soft: #c0cfdf;
  --ui-border-strong: #9fb2c9;
  --ui-text: #112238;
  --ui-text-strong: #0a1728;
  --ui-muted: #334b68;
  --ui-muted-soft: #566f8c;
  --ui-primary: #0f59b2;
  --ui-primary-soft: #c5dcfa;
  --ui-primary-hover: #b2cff4;
  --ui-primary-border: #84acde;
  --ui-primary-on: #ffffff;
  --ui-primary-ring: rgba(15, 89, 178, 0.28);
  --ui-row-hover: #d3e3f7;
  --ui-neutral-hover: #d0dce9;
  --ui-danger: #c62828;
  --ui-danger-soft: #fdecea;
  --ui-warning: #b06000;
  --ui-warning-soft: #fff4e5;
  --ui-success: #137333;
  --ui-success-soft: #e6f4ea;
  --ui-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.05);
}

body{
  background: var(--ui-bg) !important;
  color: var(--ui-text) !important;
}
body.has-custom-bg{
  background-color: var(--ui-bg) !important;
  background-image: var(--ft-bg-image) !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
}
body.has-custom-bg.theme-dark{
  background-image:
    linear-gradient(rgba(8, 11, 18, 0.55), rgba(8, 11, 18, 0.62)),
    var(--ft-bg-image) !important;
}
@media (min-width: 901px){
  body.has-custom-bg{
    background-attachment: fixed !important;
  }
}
.muted{
  color: var(--ui-muted) !important;
}
body::before{
  display: none !important;
}

.wrap{
  width: 100%;
  max-width: 1320px;
}

/* Topbar / navigation */
.topbar{
  background: var(--ui-surface) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03) !important;
}
.nav{
  gap: 8px !important;
}
.topbar .nav{
  display: flex !important;
  flex-wrap: nowrap !important;
  flex: 1 1 auto;
  min-width: 0;
}
.topbar__menu{
  flex-wrap: nowrap;
}
.topbar__actions{
  flex-wrap: nowrap !important;
  flex: 0 0 auto;
}
.nav__link{
  color: var(--ui-text-strong) !important;
  background: var(--ui-surface-alt) !important;
  border: 1px solid var(--ui-border) !important;
  font-weight: 600 !important;
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  box-sizing: border-box;
}
.topbar .nav > .nav__link{
  flex: 1 1 0;
  width: 0;
  min-width: 0;
  padding: 0 10px !important;
  white-space: nowrap;
}
.nav__link:hover{
  color: var(--ui-primary) !important;
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary-border) !important;
}
.nav__link.is-active{
  color: var(--ui-primary-on) !important;
  background: var(--ui-primary) !important;
  border-color: var(--ui-primary) !important;
  box-shadow: none !important;
}

.topbar__actions .nav__link,
.topbar__actions button.nav__link--action{
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
}

.topbar__actions .nav__link--settings,
.topbar__actions .nav__link--icon{
  width: var(--ui-control-height) !important;
  min-width: var(--ui-control-height) !important;
  padding: 0 !important;
}

.inbox{
  position: relative;
  flex: 0 0 auto;
  margin: 0;
}
.inbox__btn{
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: var(--ui-control-height) !important;
  min-width: var(--ui-control-height) !important;
  min-height: var(--ui-control-height) !important;
  padding: 0 !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-control-radius) !important;
  background: var(--ui-surface-alt) !important;
  color: var(--ui-text-strong) !important;
  cursor: pointer;
}
.inbox__btn::-webkit-details-marker{
  display: none;
}
.inbox__btn::marker{
  content: "";
}
.inbox[open] .inbox__btn,
.inbox__btn:hover{
  color: var(--ui-primary) !important;
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary-border) !important;
}
.inbox__icon{
  display: block;
}
.inbox__badge{
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--ui-danger, #dc2626);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 18px;
  text-align: center;
}
.inbox__panel{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 80;
  width: min(360px, calc(100vw - 24px));
  max-height: min(70vh, 480px);
  overflow: auto;
  padding: 10px 10px 12px;
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow, 0 12px 32px rgba(15, 23, 42, 0.16));
}
.inbox__group{
  margin: 8px 4px 6px;
  font-size: 12px;
  font-weight: 800;
  color: var(--ui-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: .03em;
}
.inbox__group:first-child{
  margin-top: 2px;
}
.inbox__list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.inbox__item{
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 10px;
  text-decoration: none;
  color: var(--ui-text-strong);
}
.inbox__item:hover{
  background: var(--ui-primary-soft, #eff6ff);
}
.inbox__item.is-urgent{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 16%, var(--ui-surface, #fff));
  border: 1px solid color-mix(in srgb, var(--ui-danger, #dc2626) 38%, var(--ui-border, #cbd5e1));
}
.inbox__item.is-urgent:hover{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 24%, var(--ui-surface, #fff));
}
.inbox__item.is-urgent .inbox__item-title{
  color: var(--ui-danger, #dc2626);
}
.inbox__item.is-urgent .inbox__item-detail{
  color: color-mix(in srgb, var(--ui-danger, #b91c1c) 55%, var(--ui-muted, #64748b));
}
.inbox__item-title{
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
}
.inbox__item-detail{
  font-size: 12px;
  color: var(--ui-muted, #64748b);
  line-height: 1.35;
}
.inbox__empty{
  margin: 8px 4px;
  color: var(--ui-muted, #64748b);
  font-size: 14px;
}
.view-as-bar{
  position: sticky;
  top: 0;
  z-index: 90;
  background: #f59e0b;
  color: #1c1917;
  border-bottom: 1px solid rgba(28, 25, 23, 0.12);
}
.view-as-bar__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  flex-wrap: wrap;
}
.view-as-bar__text{
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.view-as-bar__role{
  display: inline-block;
  margin-left: 4px;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(28, 25, 23, 0.1);
  font-size: 12px;
  font-weight: 800;
}

/* Cards */
.card{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--ui-shadow) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.card__head{
  background: var(--ui-surface-soft) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  border-radius: 12px 12px 0 0 !important;
}
.card__body{
  background: var(--ui-surface) !important;
}

/* Buttons */
.btn{
  border: 1px solid var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.btn:hover{
  background: var(--ui-neutral-hover) !important;
  border-color: var(--ui-border-strong) !important;
}
.btn--primary{
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary-border) !important;
  color: var(--ui-primary) !important;
}
.btn--primary:hover{
  background: var(--ui-primary-hover) !important;
}
.btn--add{
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary-border) !important;
  color: var(--ui-primary) !important;
}
.btn--danger{
  background: var(--ui-danger-soft) !important;
  border-color: var(--ui-border-soft) !important;
  color: var(--ui-danger) !important;
}
.btn--warn{
  background: var(--ui-warning-soft) !important;
  border-color: var(--ui-border-soft) !important;
  color: var(--ui-warning) !important;
}

/* Forms */
input,
select,
textarea{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border-strong) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
}
input::placeholder,
textarea::placeholder{
  color: var(--ui-muted-soft) !important;
  opacity: 0.36 !important;
  font-weight: 400 !important;
}
input:focus::placeholder,
textarea:focus::placeholder{
  opacity: 0.26 !important;
}
input:focus,
select:focus,
textarea:focus{
  outline: none;
  border-color: var(--ui-primary) !important;
  box-shadow: 0 0 0 3px var(--ui-primary-ring) !important;
}
.field label{
  color: var(--ui-text-strong) !important;
  font-weight: 600 !important;
}

.copy-event-checks{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}
.copy-event-check{
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-control-radius);
  background: var(--ui-surface-soft);
  font-weight: 500;
  cursor: pointer;
}
.copy-event-check input{
  width: 18px;
  height: 18px;
  margin: 0;
  flex: 0 0 auto;
}
.copy-event-check span{
  font-weight: 600;
}

/* Tabs */
.tab{
  background: var(--ui-surface-alt) !important;
  border: 1px solid var(--ui-border-strong) !important;
  color: var(--ui-text-strong) !important;
  font-weight: 600 !important;
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.tab:hover{
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary-border) !important;
  color: var(--ui-primary) !important;
}
.tab.is-active{
  color: var(--ui-primary-on) !important;
  background: var(--ui-primary) !important;
  border-color: var(--ui-primary) !important;
}

/* Flash / Pills */
.flash{
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.flash--ok{
  border-color: var(--ui-border-soft) !important;
  background: var(--ui-success-soft) !important;
  color: var(--ui-success) !important;
}
.flash__undo .btn{
  min-height: 44px;
  color: inherit !important;
  border-color: currentColor !important;
  background: transparent !important;
}
.flash--warn{
  border-color: var(--ui-border-soft) !important;
  background: var(--ui-warning-soft) !important;
  color: var(--ui-warning) !important;
}
.flash--error{
  border-color: var(--ui-border-soft) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}
.pill{
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
  color: var(--ui-text-strong) !important;
}
.card.is-attention-empty{
  border: 2px solid color-mix(in srgb, var(--ui-danger, #dc2626) 70%, #ffffff) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-danger, #dc2626) 22%, transparent);
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 18%, #ffffff) !important;
}
.card.is-attention-empty .card__head,
.card.is-attention-empty .card__body{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 18%, #ffffff) !important;
}
.card.is-attention-empty .card__head{
  border-bottom-color: color-mix(in srgb, var(--ui-danger, #dc2626) 38%, var(--ui-border, #cbd5e1)) !important;
}
.card.is-attention-empty .card__head h2{
  color: var(--ui-danger, #b91c1c);
}
.card.is-attention-empty .tablewrap,
.card.is-attention-empty .table,
.card.is-attention-empty .table thead,
.card.is-attention-empty .table thead th,
.card.is-attention-empty .table tbody,
.card.is-attention-empty .table tbody td{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 12%, #ffffff) !important;
}
.btn.is-fill-hint,
a.btn.is-fill-hint{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 22%, #ffffff) !important;
  border-color: var(--ui-danger, #dc2626) !important;
  color: #991b1b !important;
  font-weight: 700;
}
.is-fill-hint-text{
  color: #991b1b !important;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.45;
}
.card.is-attention-empty td.is-fill-hint-text{
  background: color-mix(in srgb, var(--ui-danger, #dc2626) 26%, #ffffff) !important;
  padding: 16px 14px !important;
}
.org-kind-type{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.org-kind-type select{
  flex: 1 1 160px;
  min-width: 0;
}
.org-kind-confirm{
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.org-kind-confirm.is-hidden{
  display: none;
}
.org-kind-confirm__ok{
  margin: 0;
  font-weight: 800;
  font-size: 13px;
  color: var(--ui-success, #137333);
}
.kind-review-banner{
  padding: 14px 14px 16px;
}
.kind-review-banner__title{
  margin: 0 0 6px;
  font-weight: 800;
  font-size: 16px;
}
.kind-review-banner__actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
.kind-review-banner__actions form{
  margin: 0;
}
.kind-review-banner__actions .btn{
  width: 100%;
  white-space: normal;
  text-align: center;
}
.pill--danger{
  border-color: var(--ui-border-soft) !important;
  background: var(--ui-danger-soft) !important;
  color: var(--ui-danger) !important;
}

/* Event labels: shared plain preset (list + event detail) */
.table--events th,
.table--events td{
  font-size: var(--font-size-md) !important;
  line-height: 1.35 !important;
  vertical-align: middle !important;
}

.table--events .eventlink,
.table--events .eventdate,
.table--events .eventdate__line{
  font-size: var(--font-size-md) !important;
  line-height: 1.35 !important;
}

.table--events td[data-label="Typ"] .pill,
.table--events td[data-label="Status"] .pill,
.event-meta-plain .pill{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  line-height: 1.25 !important;
  font-weight: 600 !important;
  display: inline-block !important;
  font-size: var(--font-size-md) !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
}

.table--events td[data-label="Status"] .pill + .pill,
.event-meta-plain .pill + .pill{
  margin-left: 8px;
}

/* Inventory availability: align values consistently to headers */
.table--inventory-avail th,
.table--inventory-avail td{
  font-size: var(--font-size-md) !important;
  line-height: 1.35 !important;
  vertical-align: middle !important;
}

.table--inventory-avail th.num,
.table--inventory-avail td.num{
  text-align: center !important;
}

.table--inventory-avail td[data-label="Sprzęt"],
.table--inventory-avail td[data-label="Kategoria"]{
  text-align: left !important;
}

.table--inventory-avail td[data-label="Dostępne"] .pill{
  display: inline !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  line-height: 1.35 !important;
}

/* Tables */
.tablewrap{
  border: 1px solid var(--ui-border) !important;
  border-radius: 10px !important;
  background: var(--ui-surface) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.table{
  background: transparent !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: var(--ui-text) !important;
}
.table th{
  background: var(--ui-surface-alt) !important;
  color: var(--ui-text-strong) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  font-weight: 600 !important;
}
.tablewrap .table thead tr:first-child th:first-child{
  border-top-left-radius: var(--ui-radius-inner) !important;
}
.tablewrap .table thead tr:first-child th:last-child{
  border-top-right-radius: var(--ui-radius-inner) !important;
}
.tablewrap .table tbody tr:last-child td:first-child{
  border-bottom-left-radius: var(--ui-radius-inner) !important;
}
.tablewrap .table tbody tr:last-child td:last-child{
  border-bottom-right-radius: var(--ui-radius-inner) !important;
}
.table td{
  border-bottom: 1px solid var(--ui-border-soft) !important;
  color: var(--ui-text) !important;
}

/* Lista wydarzeń / linki: styles.css używa var(--text) i var(--accent) — na ciemnym motywie ginęły */
.eventlink{
  color: var(--ui-text-strong) !important;
}
.eventlink:hover{
  color: var(--ui-primary) !important;
}
.link{
  color: var(--ui-primary) !important;
  border-bottom-color: var(--ui-primary-border) !important;
}
.link:hover{
  border-bottom-color: var(--ui-primary) !important;
}

.event-row--archived{
  background: var(--ui-surface-soft) !important;
  color: var(--ui-muted) !important;
}
.event-row--archived:hover{
  background: var(--ui-surface-alt) !important;
}
.event-row--archived .eventlink{
  color: var(--ui-muted) !important;
}
.event-row--archived .muted{
  color: var(--ui-muted-soft) !important;
}

.tablewrap .table tbody tr:last-child td{
  border-bottom: 0 !important;
}
.table tbody tr:hover{
  background: var(--ui-row-hover) !important;
}
.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):hover,
.table.table--checklist tbody tr:not(.table__category-row):hover,
.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):hover td,
.table.table--checklist tbody tr:not(.table__category-row):not(.is-checked):hover td{
  background: transparent !important;
}
.table.table--checklist tbody tr.is-checked:hover td{
  background: rgba(var(--p-teal-500), .08) !important;
}

/* Empty-state rows: single clean layer, no nested artifacts.
   UWAGA: nie dodajemy tu border-bottom-left/right-radius dla `tr:last-child
   td[colspan]`, bo gdy colspan nie pokrywa pełnej szerokości (np. wiersz
   notatki packlisty: colspan=3 + sąsiednia kolumna Akcje), takie zaokrąglenie
   tworzy widoczny „notch" na styku komórek przy hoverze. Dla empty-state
   (colspan = wszystkie kolumny) wystarczające zaokrąglenia od krawędzi
   tabeli zapewniają już ogólne reguły `tr:last-child td:first-child /
   td:last-child`. */
.tablewrap .table tbody td[colspan]{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 14px 12px !important;
}

@media (max-width: 900px){
  .table--mobile-collapsible tr:has(td[colspan]) td{
    display: block !important;
    width: 100% !important;
    padding-right: 0 !important;
  }
  .table--mobile-collapsible tr:has(td[colspan]) td::before,
  .table--mobile-collapsible tr:has(td[colspan]) td::after{
    display: none !important;
  }
}

/* Modal */
.modal__backdrop{
  background: rgba(17, 24, 39, 0.42) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}
.modal__dialog,
.modal__dialog--wide,
.modal__dialog--picker{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 42px rgba(15, 23, 42, 0.18) !important;
}
.modal__head{
  background: var(--ui-surface-alt) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* Generic section components used in many pages */
.todo-sidebar,
.todo-detail,
.todo-row,
.todo-topicrow,
.rental-tree__vendor,
.payments-card,
.payments-topic,
.statusline > *,
.summary-pill{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ToDo: styles.css ustawia color: var(--text) i białe „szkło” — na ciemnym motywie sidebar + wiersze muszą używać --ui-* */
.todo-sidebar__title{
  color: var(--ui-muted) !important;
}
.todo-topicrow{
  color: var(--ui-text) !important;
}
.todo-topicrow__meta{
  color: var(--ui-muted) !important;
}
.todo-topicrow:hover{
  background: var(--ui-row-hover) !important;
  border-color: var(--ui-primary-border) !important;
}
.todo-topicrow.is-active{
  background: var(--ui-primary-soft) !important;
  border-color: var(--ui-primary) !important;
}
.todo-row{
  color: var(--ui-text) !important;
}
.todo-separator{
  background: var(--ui-border) !important;
}
.todo-check{
  border-color: var(--ui-border) !important;
  background: var(--ui-surface-alt) !important;
  color: var(--ui-text-strong) !important;
}
.todo-check:hover{
  border-color: var(--ui-primary-border) !important;
  background: var(--ui-primary-soft) !important;
}
.todo-row:hover{
  border-color: var(--ui-primary-border) !important;
}
.todo-row.is-active{
  background: var(--ui-primary-soft) !important;
}

.rental-tree__vendor-head,
.payments-card__head{
  background: var(--ui-surface-alt) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* Action menu uses same simple style everywhere */
.action-menu__button{
  background: var(--ui-surface) !important;
  border-color: var(--ui-border-strong) !important;
  color: var(--ui-muted) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.action-menu__button:hover{
  background: var(--ui-neutral-hover) !important;
}
.action-menu__panel{
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12) !important;
}
.sortmenu__option{
  color: var(--ui-text-strong) !important;
}
.sortmenu__option:hover{
  background: var(--ui-neutral-hover) !important;
}

/* Sorting controls preset: subtle, not bold */
[data-sort-menu] .sortmenu__button{
  min-height: var(--ui-control-height) !important;
  border-radius: var(--ui-control-radius) !important;
  padding: 0 12px !important;
  font-size: var(--font-size-sm) !important;
  font-weight: 500 !important;
  color: var(--ui-text) !important;
  background: var(--ui-surface-alt) !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}

[data-sort-menu] .sortmenu__button [data-sort-label]{
  font-weight: 500 !important;
}

[data-sort-menu] .sortmenu__button::after{
  color: var(--ui-muted-soft) !important;
  font-size: 11px !important;
}

[data-sort-menu] .sortmenu__panel{
  border-radius: var(--ui-control-radius) !important;
  border: 1px solid var(--ui-border) !important;
  background: var(--ui-surface) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12) !important;
}

[data-sort-menu] .sortmenu__option{
  min-height: 34px;
  border-radius: var(--ui-control-radius) !important;
  font-size: var(--font-size-sm) !important;
  font-weight: 500 !important;
  color: var(--ui-text) !important;
}

[data-sort-menu] .sortmenu__option:hover{
  background: var(--ui-neutral-hover) !important;
}

/* Google Calendar event color (organizational status) */
.gcal-color-swatches{
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 2px;
  box-sizing: border-box;
}
.gcal-color-swatch{
  position: relative;
  flex: 0 0 28px;
  width: 28px;
  margin: 0;
  z-index: 0;
}
.gcal-color-swatch:hover,
.gcal-color-swatch:focus-within{
  z-index: 5;
}
.gcal-color-swatch__btn{
  display: block;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  box-sizing: border-box;
  position: relative;
}
.gcal-color-swatch__btn:disabled{
  cursor: not-allowed;
  opacity: 0.45;
}
.gcal-color-swatch__dot{
  display: block;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--ui-border);
  box-sizing: border-box;
  background: var(--gcal-swatch, var(--ui-surface-soft));
  pointer-events: none;
}
.gcal-color-swatch__btn.is-selected .gcal-color-swatch__dot{
  outline: 2px solid var(--ui-primary);
  outline-offset: 2px;
  border-color: var(--ui-border-strong);
}
.gcal-color-swatch__btn:focus-visible .gcal-color-swatch__dot{
  box-shadow: 0 0 0 3px var(--ui-primary-ring);
}

/* Tooltip koloru Google — na body (fixed), bo modal przycina overflow */
.ft-gcal-color-tip{
  position: fixed;
  z-index: 10050;
  margin: 0;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  max-width: min(280px, calc(100vw - 24px));
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--ui-text-strong);
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-control-radius);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.2);
  pointer-events: none;
  display: none;
}
.ft-gcal-color-tip.is-visible{
  display: block;
}

/* Responsive simplification */
@media (max-width: 900px){
  .topbar .nav > .nav__link{
    width: 100% !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
  }
  .wrap{
    width: 100%;
    max-width: 1200px;
  }
  .card__head{
    padding: 14px 14px 10px;
  }
  .card__body{
    padding: 12px 14px 14px;
  }
}

/* Wiersz wolnotekstowej notatki packlisty (spanning td) */
.packlist-note-row__text{
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.packlist-note-row td[colspan]{
  font-style: normal;
}
/* Desktop: spanning td w checkliście — wyrównanie do lewej i normalne paddingi
   (nadpisuje high-specificity rule od kolumny „Ilość") */
.table--checklist tr.packlist-note-row td:nth-child(2){
  text-align: left !important;
  padding-left: 16px !important;
  padding-right: 12px !important;
}
table.table.table--packlist.table--checklist > tbody > tr.packlist-note-row > td:nth-child(2){
  text-align: left !important;
}
@media (max-width: 900px){
  .table--checklist tr.packlist-note-row{
    grid-template-columns: 56px 1fr !important;
    grid-template-areas: "cb note" !important;
  }
  .table--checklist tr.packlist-note-row td:nth-child(2){
    grid-area: note !important;
    color: var(--text) !important;
    font-size: var(--font-size-md, inherit) !important;
    padding: 0 !important;
    display: block !important;
    text-align: left !important;
    border-left: 0 !important;
  }
}

/* Wiersz-nagłówek kategorii w packlistach / checkliście */
.table__category-row td{
  background: var(--table-th-bg, rgba(11,18,32,.04));
  color: var(--accent, var(--text));
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .6px;
  text-transform: uppercase;
  padding: 12px 12px 8px !important;
  border-bottom: 1px solid var(--ui-border-soft, var(--line)) !important;
  border-top: 1px solid var(--ui-border-soft, var(--line));
  text-align: left !important;
  vertical-align: middle !important;
}
.table tbody tr.table__category-row:hover{
  background: var(--table-th-bg, rgba(11,18,32,.04));
}
.table__category-row td::before{
  display: none !important;
}

/* Mobile: packlist (tr -> block) */
@media (max-width: 900px){
  .table--packlist tr.table__category-row,
  .table--packlist tr.packlist-group__header{
    margin-top: 12px;
    padding: 10px 12px !important;
    border-radius: 8px;
    background: rgb(var(--p-blue-600)) !important;
  }
  .table--packlist tbody.packlist-group:first-of-type tr.packlist-group__header,
  .table--packlist tr.table__category-row:first-child{
    margin-top: 0;
  }
  .table--packlist tr.table__category-row td,
  .table--packlist tr.packlist-group__header td{
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: 0.03em;
    line-height: 1.3;
    text-transform: uppercase;
  }
}

/* Mobile: checklist (tr -> grid). Nadpisujemy grid i wyświetlamy jak blok */
@media (max-width: 900px){
  .table--checklist tr.table__category-row{
    display: block !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    margin-top: 12px;
    padding: 10px 12px !important;
    border-radius: 8px;
    background: rgb(var(--p-blue-600)) !important;
  }
  .table--checklist tr.table__category-row:first-child{
    margin-top: 0;
  }
  .table--checklist tr.table__category-row td,
  .table--checklist tr.table__category-row td:first-child{
    display: block !important;
    grid-area: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: 0.03em;
    line-height: 1.3;
    text-transform: uppercase;
  }
}

/* ---- Attachment viewer (full-page) ---- */
.attachment-viewer{
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: calc(100vh - 80px);
}
.attachment-viewer__bar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 12px;
  background: var(--surface, #fff);
  border: 1px solid var(--border, rgba(148, 163, 184, 0.35));
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  position: sticky;
  top: 8px;
  z-index: 5;
}
.attachment-viewer__title{
  font-weight: 600;
  font-size: 15px;
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.attachment-viewer__name{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.attachment-viewer__filename{
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.attachment-viewer__counter{
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 500;
  color: var(--muted, #64748b);
  background: rgba(148, 163, 184, 0.18);
  padding: 2px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.attachment-viewer__meta{
  font-weight: 400;
  font-size: 12px;
  color: var(--muted, #64748b);
}
.attachment-viewer__actions{
  display: inline-flex;
  gap: 6px;
  flex: 0 0 auto;
}
.attachment-viewer__body{
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-2, #f1f5f9);
  border-radius: 12px;
  border: 1px solid var(--border, rgba(148, 163, 184, 0.35));
  overflow: hidden;
  min-height: 60vh;
  position: relative;
}

/* Strzałki galerii — okrągłe pływające przyciski po bokach mediów. */
.attachment-viewer__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: rgba(248, 250, 252, 0.96);
  background: rgba(15, 23, 42, 0.42);
  border: 1px solid rgba(248, 250, 252, 0.22);
  text-decoration: none;
  user-select: none;
  cursor: pointer;
  z-index: 4;
  box-shadow:
    0 8px 24px rgba(15, 23, 42, 0.32),
    0 2px 6px rgba(15, 23, 42, 0.18);
  backdrop-filter: blur(10px) saturate(1.05);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  transition:
    background-color .18s ease,
    border-color .18s ease,
    transform .18s cubic-bezier(.22, 1, .36, 1),
    box-shadow .18s ease;
}
.attachment-viewer__nav svg{
  width: 22px;
  height: 22px;
  display: block;
}
.attachment-viewer__nav:hover{
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(248, 250, 252, 0.38);
  color: #fff;
  transform: translateY(-50%) scale(1.06);
  box-shadow:
    0 12px 32px rgba(15, 23, 42, 0.4),
    0 4px 10px rgba(15, 23, 42, 0.22);
  text-decoration: none;
}
.attachment-viewer__nav:active{
  transform: translateY(-50%) scale(0.96);
  transition-duration: .08s;
}
.attachment-viewer__nav:focus-visible{
  outline: 2px solid rgba(96, 165, 250, 0.85);
  outline-offset: 3px;
}
.attachment-viewer__nav--prev{ left: 18px; }
.attachment-viewer__nav--next{ right: 18px; }

/* Strzałki w pasku tytułu — kompaktowe ikoniczne wersje btn--small */
.attachment-viewer__actions .btn--icon{
  width: 32px;
  height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.attachment-viewer__actions .btn--icon svg{
  width: 16px;
  height: 16px;
  display: block;
}
.attachment-viewer__body--pdf,
.attachment-viewer__body--text{
  padding: 0;
  background: var(--surface, #fff);
}
.attachment-viewer__body--pdf{
  overflow: auto;
  align-items: stretch;
  justify-content: flex-start;
  -webkit-overflow-scrolling: touch;
}
.attachment-viewer__body--pdf .attachment-viewer__nav,
.attachment-viewer__body--text .attachment-viewer__nav,
.attachment-viewer__body--video .attachment-viewer__nav,
.attachment-viewer__body--audio .attachment-viewer__nav{
  display: none;
}
.attachment-viewer.is-pdfjs-view{
  min-height: 0;
  height: auto;
}
.attachment-viewer.is-pdfjs-view .attachment-viewer__body--pdf{
  flex: 0 0 auto;
  display: block;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  background: #e2e8f0;
}
.attachment-viewer__pdf{
  width: 100%;
  min-width: 0;
}
.attachment-viewer__pdf-pages{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
  background: #e2e8f0;
}
.attachment-viewer__pdf-pages[hidden]{
  display: none !important;
}
.attachment-viewer__pdf-page{
  width: 100%;
  height: auto;
  display: block;
  background: #fff;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.12);
}
.attachment-viewer__pdf-status{
  padding: 28px 16px;
  text-align: center;
  color: var(--muted, #64748b);
  font-size: 15px;
}
.attachment-viewer__image{
  max-width: 100%;
  max-height: calc(100vh - 140px);
  object-fit: contain;
  display: block;
}
.attachment-viewer__frame{
  width: 100%;
  height: calc(100vh - 140px);
  border: 0;
  display: block;
  background: var(--surface, #fff);
}
.attachment-viewer__media{
  max-width: 100%;
  max-height: calc(100vh - 140px);
  display: block;
}
.attachment-viewer__media[src*="audio"],
.attachment-viewer__body--audio .attachment-viewer__media{
  width: min(620px, 90vw);
}
.attachment-viewer__fallback{
  text-align: center;
  padding: 40px 20px;
  max-width: 480px;
}
.attachment-viewer__fallback-icon{
  font-size: 48px;
  line-height: 1;
  margin-bottom: 12px;
}
.attachment-viewer__fallback-title{
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}

@media (max-width: 600px){
  .attachment-viewer{
    min-height: 0;
    gap: 8px;
  }
  .attachment-viewer__bar{
    flex-wrap: wrap;
    padding: 8px 10px;
    position: sticky;
    top: 0;
  }
  .attachment-viewer__title{
    flex: 1 1 100%;
  }
  .attachment-viewer__actions{
    flex: 1 1 100%;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
  }
  .attachment-viewer__actions .btn{
    min-height: 44px;
  }
  .attachment-viewer__image,
  .attachment-viewer__media{
    max-height: none;
    width: 100%;
    height: auto;
  }
  .attachment-viewer__frame{
    height: min(70dvh, calc(100dvh - 220px));
    max-height: none;
  }
  .attachment-viewer__body{
    min-height: 0;
  }
  .attachment-viewer__body--pdf{
    overflow: visible;
    height: auto;
    min-height: 0;
    background: #e2e8f0;
  }
  .attachment-viewer__nav{
    width: 44px;
    height: 44px;
  }
  .attachment-viewer__nav svg{
    width: 20px;
    height: 20px;
  }
  .attachment-viewer__nav--prev{ left: 8px; }
  .attachment-viewer__nav--next{ right: 8px; }
}

body.page-attachment-view .ai-chat-widget{
  display: none !important;
}
@media (max-width: 900px){
  body.page-attachment-view .wrap{
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
  }
  .attachment-viewer__body--pdf{
    overflow: visible;
    height: auto;
    min-height: 0;
    background: #e2e8f0;
  }
  .attachment-viewer__image,
  .attachment-viewer__media{
    max-height: none;
  }
}

/* ---- Attachment image thumbnails (event detail) ---- */
.attachment-thumbs{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
}
.attachment-thumb{
  position: relative;
  width: 96px;
  height: 96px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface-2, #f1f5f9);
  border: 1px solid var(--border, rgba(148, 163, 184, 0.35));
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  flex: 0 0 auto;
  transition: transform 120ms ease, box-shadow 120ms ease;
}
.attachment-thumb:hover{
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
}
.attachment-thumb__link{
  display: block;
  width: 100%;
  height: 100%;
}
.attachment-thumb__link img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.attachment-thumb__actions{
  position: absolute;
  top: 4px;
  right: 4px;
  display: flex;
  gap: 4px;
  opacity: 0;
  transition: opacity 120ms ease;
}
.attachment-thumb:hover .attachment-thumb__actions,
.attachment-thumb:focus-within .attachment-thumb__actions{
  opacity: 1;
}
.attachment-thumb__actions form{
  margin: 0;
}
.attachment-thumb__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  padding: 0;
  font-weight: 600;
}
.attachment-thumb__btn:hover{
  background: rgba(15, 23, 42, 0.92);
  color: #fff;
}
.attachment-thumb__btn--danger{
  background: rgba(220, 38, 38, 0.85);
}
.attachment-thumb__btn--danger:hover{
  background: rgba(220, 38, 38, 1);
}

@media (max-width: 600px){
  .attachment-thumb{
    width: 80px;
    height: 80px;
  }
  .attachment-thumbs{
    gap: 8px;
  }
}

/* ---- AI category suggestion indicator ---- */
.ft-label-with-help{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ai-suggest{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--muted, #94a3b8);
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.12);
  line-height: 1.4;
  transition: opacity 160ms ease;
}
.ai-suggest[hidden]{ display: none !important; }

.ai-suggest__spinner{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-top-color: transparent;
  display: inline-block;
  flex-shrink: 0;
}

.ai-suggest--thinking .ai-suggest__spinner{
  animation: ai-suggest-spin 0.7s linear infinite;
}
.ai-suggest--ok{
  color: var(--ok, #16a34a);
  background: rgba(22, 163, 74, 0.12);
}
.ai-suggest--ok .ai-suggest__spinner{
  border: 1.5px solid currentColor;
  border-right-color: currentColor;
  border-top-color: currentColor;
  animation: none;
  background: currentColor;
  opacity: 0.85;
}
.ai-suggest--err{
  color: var(--danger, #dc2626);
  background: rgba(220, 38, 38, 0.12);
}
.ai-suggest--err .ai-suggest__spinner{
  animation: none;
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-bottom-color: transparent;
}

@keyframes ai-suggest-spin{
  to { transform: rotate(360deg); }
}

@media (max-width: 900px){
  .topbar .nav > .nav__link{
    width: 100% !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
  }
  .topbar__actions{
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }
  .topbar__actions .nav__link--settings,
  .topbar__actions .nav__link--icon,
  .topbar__actions .inbox,
  .topbar__actions .inbox__btn{
    width: var(--ui-control-height) !important;
    min-width: var(--ui-control-height) !important;
    align-self: flex-start;
  }
  .theme-dark-switch--topbar .theme-dark-switch__label{
    color: var(--ui-text-strong) !important;
  }
  .theme-dark-switch--topbar .theme-dark-switch__track{
    background: var(--ui-border-strong, var(--ui-border));
  }

  .modal__dialog,
  .modal__dialog--wide,
  .modal__dialog--picker{
    border-radius: 0 !important;
    width: auto !important;
    max-width: none !important;
  }
  .modal__head{
    border-radius: 0 !important;
  }

  .table--attachments thead{
    display: none;
  }
  .table--attachments,
  .table--attachments tbody,
  .table--attachments tr,
  .table--attachments td{
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .table--attachments td{
    text-align: left !important;
  }

  .table--checklist tr.table__category-row{
    margin-top: 12px;
    padding: 10px 12px !important;
    border-radius: 8px;
    background: rgb(var(--p-blue-600)) !important;
  }
  .table--checklist tr.table__category-row:first-child{
    margin-top: 0;
  }
  .table--checklist tr.table__category-row td,
  .table--checklist tr.table__category-row td:first-child{
    width: 100% !important;
    max-width: none !important;
    white-space: normal !important;
    word-break: normal !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
  }

  .table--packlist tr.packlist-group__header,
  .table--packlist tr.table__category-row{
    margin-top: 12px;
    padding: 10px 12px !important;
    border-radius: 8px;
    background: rgb(var(--p-blue-600)) !important;
  }
  .table--packlist tbody.packlist-group:first-of-type tr.packlist-group__header,
  .table--packlist tr.table__category-row:first-child{
    margin-top: 0;
  }
  .table--packlist tr.packlist-group__header,
  .table--packlist tr.packlist-group__header:hover,
  .table--packlist tbody.packlist-group:hover .packlist-group__header,
  .table--packlist .packlist-group__header:hover td,
  .table--packlist tbody.packlist-group:hover .packlist-group__header td{
    background: rgb(var(--p-blue-600)) !important;
  }
  .table--packlist tr.packlist-group__header td,
  .table--packlist tr.table__category-row td{
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
  }
  .table--packlist .packlist-group__count{
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
    font-size: 13px;
  }

  .table--checklist td,
  .table--checklist td:first-child,
  .table--checklist td:nth-child(2),
  .table--checklist td:nth-child(3),
  .table--checklist td:nth-child(4){
    border: 0 !important;
    border-bottom: 0 !important;
  }

  .table--packlist td,
  .table--packlist .packlist-res-row td,
  .table--packlist .packlist-group .packlist-res-row:last-child td,
  .table--packlist .packlist-note-row td{
    border: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
  }

  .table--events td{
    border: 0 !important;
    border-bottom: 0 !important;
  }
}

/* Packlista + checklista: ten sam wygląd. Jedyna różnica — checkboxy. */
.table--packlist,
.table--checklist{
  --pack-accent: rgb(var(--p-blue-600));
}
.table--packlist,
.table--checklist,
.table--packlist tbody tr,
.table--checklist tbody tr,
.table--packlist tbody td,
.table--checklist tbody td{
  -webkit-tap-highlight-color: transparent;
}
.table--packlist tr.packlist-group__header,
.table--packlist tr.table__category-row,
.table--checklist tr.table__category-row{
  background: var(--pack-accent) !important;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  pointer-events: none;
}
.table--packlist tr.packlist-group__header:hover,
.table--packlist tr.packlist-group__header:active,
.table--packlist tr.packlist-group__header:focus,
.table--packlist tbody.packlist-group:hover .packlist-group__header,
.table--packlist tr.table__category-row:hover,
.table--packlist tr.table__category-row:active,
.table--checklist tr.table__category-row:hover,
.table--checklist tr.table__category-row:active,
.table--checklist tr.table__category-row:focus,
.table tbody tr.table__category-row:hover{
  background: var(--pack-accent) !important;
}
.table--packlist tr.packlist-group__header td,
.table--packlist tr.packlist-group__header:hover td,
.table--packlist tbody.packlist-group:hover .packlist-group__header td,
.table--packlist tr.table__category-row td,
.table--checklist tr.table__category-row td,
.table--checklist tr.table__category-row td:first-child{
  background: transparent !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  text-align: left !important;
}
.table--packlist .packlist-group__count{
  background: rgba(255, 255, 255, 0.25);
  color: #fff;
}
@media (min-width: 901px){
  .table--packlist .packlist-group .packlist-res-row td:first-child,
  .table--packlist .packlist-group .packlist-group__header td,
  .table--checklist tbody tr:not(.table__category-row) td:first-child{
    border-left: 3px solid var(--pack-accent) !important;
  }
}

.table--packlist .packlist-inline-input{
  display: none;
  width: 100%;
  max-width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 6px 8px;
  font: inherit;
  font-weight: 400;
  border: 1px solid var(--ui-border-strong);
  border-radius: var(--ui-control-radius);
  background: var(--ui-surface);
  color: var(--ui-text);
  box-sizing: border-box;
}
.table--packlist .packlist-inline-input--qty{
  width: 4.5rem;
  max-width: 100%;
  text-align: right;
}
.table--packlist .packlist-quick-delete{
  display: none;
  margin: 0;
}
.table--packlist .packlist-quick-delete__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #dc2626;
  color: #fff;
  font-size: 26px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
}
.table--packlist .packlist-quick-delete__btn:hover,
.table--packlist .packlist-quick-delete__btn:focus-visible{
  background: #b91c1c;
  outline: none;
}
.is-packlist-editing .packlist-cell-view{
  display: none !important;
}
.is-packlist-editing .packlist-inline-input{
  display: block;
}
.is-packlist-editing .packlist-quick-delete{
  display: inline-flex;
}
.is-packlist-editing .ft-reorder-handle{
  display: none !important;
}
.is-packlist-editing .table--packlist tr.packlist-res-row > td,
.is-packlist-editing .table--packlist tr.packlist-note-row > td{
  vertical-align: middle !important;
}
@media (max-width: 900px){
  .is-packlist-editing .table--packlist tr.packlist-res-row td:nth-child(1),
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-qty,
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-note,
  .is-packlist-editing .table--packlist tr.packlist-note-row td:first-child{
    min-height: 40px;
    display: flex !important;
    align-items: center;
  }
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-qty{
    gap: 6px;
  }
}
.is-packlist-editing.card{
  overflow: visible;
}
.is-packlist-editing #btnPacklistEdit,
#btnPacklistEdit.is-packlist-done{
  background: #16a34a !important;
  border-color: #15803d !important;
  color: #fff !important;
  position: relative;
  z-index: 3;
  animation: packlistGotowePulse 1.35s ease-in-out infinite;
}
.is-packlist-editing #btnPacklistEdit:hover,
#btnPacklistEdit.is-packlist-done:hover{
  background: #15803d !important;
  border-color: #166534 !important;
  color: #fff !important;
}
@keyframes packlistGotowePulse{
  0%, 100%{
    box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.75) !important;
    transform: scale(1);
  }
  50%{
    box-shadow: 0 0 0 8px rgba(22, 163, 74, 0.18) !important, 0 0 22px 2px rgba(22, 163, 74, 0.7) !important;
    transform: scale(1.05);
  }
}
@media (prefers-reduced-motion: reduce){
  .is-packlist-editing #btnPacklistEdit,
  #btnPacklistEdit.is-packlist-done{
    animation: none;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.45) !important;
    transform: none;
  }
}
[data-packlist-edit-root]:not(.is-packlist-editing) .table--packlist thead th:last-child,
[data-packlist-edit-root]:not(.is-packlist-editing) .table--packlist .packlist-cell-actions{
  display: none;
}
@media (max-width: 900px){
  .table--packlist:not(.is-packlist-editing) tr.packlist-res-row,
  [data-packlist-edit-root]:not(.is-packlist-editing) .table--packlist tr.packlist-res-row{
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "name"
      "qty"
      "note";
  }
  [data-packlist-edit-root]:not(.is-packlist-editing) .table--packlist tr.packlist-res-row td.packlist-cell-actions,
  [data-packlist-edit-root]:not(.is-packlist-editing) .table--packlist tr.packlist-note-row td.packlist-cell-actions{
    display: none !important;
  }
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-actions{
    display: block !important;
  }
  .is-packlist-editing .table--packlist .packlist-inline-input--qty{
    width: 100%;
    max-width: 6rem;
    text-align: left;
  }
}
.table--packlist td[data-label="Sprzęt"],
.table--checklist td[data-label="Sprzęt"],
.table--packlist td[data-label="Sprzęt"] *,
.table--checklist td[data-label="Sprzęt"] *,
.rental-tree__item-main > div:first-child{
  font-weight: 400 !important;
}

.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):hover,
.table.table--checklist tbody tr:not(.table__category-row):hover,
.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):active,
.table.table--checklist tbody tr:not(.table__category-row):active,
.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):hover td,
.table.table--checklist tbody tr:not(.table__category-row):not(.is-checked):hover td,
.table.table--packlist tbody tr:not(.packlist-group__header):not(.table__category-row):active td,
.table.table--checklist tbody tr:not(.table__category-row):not(.is-checked):active td{
  background: transparent !important;
}

@media (max-width: 900px){
  .table--packlist tbody.packlist-group{
    border-left: 3px solid var(--pack-accent) !important;
  }
  .table--packlist tr.packlist-res-row{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 44px;
    grid-template-areas:
      "name act"
      "qty act"
      "note act";
    align-items: start;
    column-gap: 8px;
    row-gap: 4px;
    padding: 12px !important;
    border-left: 0 !important;
  }
  .table--packlist tr.packlist-res-row td{
    display: block !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    text-align: left !important;
  }
  .table--packlist tr.packlist-res-row td::before{
    display: none !important;
    content: none !important;
  }
  .table--packlist tr.packlist-res-row td:nth-child(1){
    grid-area: name;
    font-weight: 400 !important;
  }
  .table--packlist tr.packlist-res-row td:nth-child(2){
    grid-area: qty;
    color: var(--muted);
    font-size: var(--font-size-sm, 13px);
  }
  .table--packlist tr.packlist-res-row td:nth-child(2)::before{
    content: "Ilość: ";
    display: inline !important;
    font-weight: 700;
    color: var(--muted);
  }
  .table--packlist tr.packlist-res-row td:nth-child(3){
    grid-area: note;
    color: var(--muted);
    font-size: var(--font-size-sm, 13px);
  }
  .table--packlist tr.packlist-res-row td:nth-child(4){
    grid-area: act;
    width: 44px !important;
    justify-self: end;
    align-self: start;
  }
  .table--checklist tbody tr:not(.table__category-row):not(:has(td[colspan])){
    border-left: 0 !important;
  }
  .table--packlist .packlist-group .packlist-res-row,
  .table--packlist .packlist-group .packlist-res-row td,
  .table--packlist .packlist-group .packlist-res-row td:first-child,
  .table--packlist .packlist-group .packlist-group__header td,
  .table--checklist tbody tr:not(.table__category-row),
  .table--checklist tbody tr:not(.table__category-row) td:first-child{
    border-left: 0 !important;
  }
  .table--checklist tbody tr:not(.table__category-row) td:first-child{
    border-left: 0 !important;
  }
  .is-packlist-editing .table--packlist tr.packlist-res-row td:nth-child(1),
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-qty,
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-note,
  .is-packlist-editing .table--packlist tr.packlist-note-row td:first-child{
    min-height: 40px;
    display: flex !important;
    align-items: center;
  }
  .is-packlist-editing .table--packlist tr.packlist-res-row td.packlist-cell-qty{
    gap: 6px;
  }
}

/* Kolory kategorii (nagłówek i pasek z lewej = ten sam kolor) */
.table--packlist [data-cat="naglosnienie"],
.table--checklist [data-cat="naglosnienie"]{
  --pack-accent: #1d4ed8; /* dźwięk, konsoleta, fale */
}
.table--packlist [data-cat="oswietlenie"],
.table--checklist [data-cat="oswietlenie"]{
  --pack-accent: #a16207; /* złote światło, żarówki */
}
.table--packlist [data-cat="konstrukcje-sceniczne"],
.table--checklist [data-cat="konstrukcje-sceniczne"]{
  --pack-accent: #475569; /* stal, kratownice */
}
.table--packlist [data-cat="multimedia"],
.table--checklist [data-cat="multimedia"]{
  --pack-accent: #6d28d9; /* ekrany, cyfra */
}
.table--packlist [data-cat="sprzet-filmowy"],
.table--checklist [data-cat="sprzet-filmowy"]{
  --pack-accent: #b91c1c; /* kino, rec */
}
.table--packlist [data-cat="sceny-i-akcesoria"],
.table--checklist [data-cat="sceny-i-akcesoria"]{
  --pack-accent: #9d174d; /* kotary, dekoracje sceniczne */
}
.table--packlist [data-cat="gastronomia"],
.table--checklist [data-cat="gastronomia"]{
  --pack-accent: #047857; /* kuchnia, jedzenie */
}
.table--packlist [data-cat="notatki"],
.table--checklist [data-cat="notatki"]{
  --pack-accent: #0f766e; /* notes */
}
.table--packlist [data-cat="inne"],
.table--checklist [data-cat="inne"]{
  --pack-accent: #64748b; /* bez kategorii */
}