/* Zachowuje stałą szerokość viewportu, gdy dynamiczne elementy (np. Select2
 * i okna modalne) włączają lub wyłączają pionowy scrollbar strony. */
html {
  scrollbar-gutter: stable;
}

/* Te rejestry mają poziomy scroll DataTables i pozostają w DOM pod modalem.
 * Stały gutter dokumentu rezerwuje już miejsce na pionowy scrollbar, dlatego
 * dodatkowa kompensacja Bootstrapa powodowałaby przesunięcie całego widoku. */
body.modal-open:has(#table_payments),
body.modal-open:has(#table_message_register) {
  --bs-scrollbar-width: 0px !important;
  padding-right: 0 !important;
}

.app-brand-logo.soda img {
  width: 32px;
}

.app-brand-text.soda {
  font-size: 1.375rem;
}

.menu .app-brand.soda {
  height: 64px;
}

.menu-item-disabled {
  opacity: 0.45;
}

.menu-item-disabled>.menu-link {
  pointer-events: none;
  cursor: default;
}

.menu-item-disabled .menu-icon,
.menu-item-disabled .menu-link,
.menu-item-disabled .menu-link div {
  color: #a8a8b3 !important;
}

.menu-header-disabled {
  opacity: 0.45;
}

.auth-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  min-height: 100%;
}

.auth-content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.auth-qr-frame {
  width: 220px;
  margin: 0;
  padding: 0;
  display: block;
}

.svg-wrapper {
  position: relative;
  width: 220px;
  height: 220px;
  margin: 0;
  padding: 0;
}

.svg-wrapper svg {
  display: block;
  width: 220px;
  height: 220px;
}

.svg-wrapper img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180px;
  height: 180px;
  transform: translate(-50%, -50%);
  display: block;
  padding: 0;
}

#rect_auth_qr_base_frame {
  stroke-width: 1.5;
}

#rect_auth_qr_frame,
#path_auth_qr_corner {
  stroke-width: 2.5;
}

.login-wave {
  position: relative;
  width: 100vw;
  overflow: hidden;
}

.login-wave .login-bg {
  width: 100%;
  height: auto;
  display: block;
}

.login-theme-btn {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 2500;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
}

.login-theme-btn:hover {
  background: var(--bs-hover-bg);
}

.login-title,
.login-slogan {
  display: inline-block;
  transform-origin: top;
  transition: transform 0.55s ease, opacity 0.55s ease;
  opacity: 1;
}

#p_login_slogan,
.flip-show,
.flip-hide {
  display: block !important;
  width: 100%;
}

.flip-hide {
  transform: rotateX(90deg);
  opacity: 0;
}

.flip-show {
  transform: rotateX(0deg);
  opacity: 1;
}

#form_login.w-px-400,
.login-form.w-px-400 {
  width: 100% !important;
  max-width: 400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.version-footer {
  margin-top: auto;
  opacity: 0.6;
  font-size: 0.8rem;
}

#p_app_version {
  opacity: 0;
  transition: opacity 1.2s cubic-bezier(0.3, 0, 0.1, 1);
}

#p_app_version.is-visible {
  opacity: 1;
}

#div_terms {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(3px);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

#div_terms_box {
  background: var(--bs-body-bg);
  width: min(90%, 680px);
  max-height: 85vh;
  overflow-y: auto;
  border-radius: 14px;
  padding: 28px 32px;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.25);
  animation: termsFadeIn 0.25s ease-out;
}

.terms-content {
  max-height: 65vh;
  overflow-y: auto;
  padding-right: 4px;
}

@keyframes termsFadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.soda-modal {
  font-family: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
}

.soda-modal h2 {
  font-size: 1.35rem !important;
  font-weight: 600;
  margin-bottom: 0.75rem;
  line-height: 1.4;
}

.soda-modal h4 {
  font-size: 0.95rem !important;
  font-weight: 600;
  margin-bottom: 0.75rem;
  line-height: 1.4;
}

.soda-modal p {
  font-size: 0.8rem !important;
  line-height: 1.45rem;
  margin-bottom: 0.75rem;
}

.soda-modal li {
  font-size: 0.8rem;
  margin-bottom: 0.4rem;
}

.modal-content {
  border-radius: 0.75rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

.modal-content.modal-info {
  border-top: 4px solid var(--bs-primary);
}

.modal-content.modal-success {
  border-top: 4px solid var(--bs-success);
}

.modal-content.modal-warning {
  border-top: 4px solid var(--bs-warning);
}

.modal-content.modal-danger {
  border-top: 4px solid var(--bs-danger);
}

.modal-content.modal-warning .modal-header,
.modal-content.modal-danger .modal-header,
.modal-content.modal-info .modal-header,
.modal-content.modal-success .modal-header {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.02), transparent);
}

.invoice-signature-alert {
  --soda-signature-alert-rgb: var(--bs-success-rgb);
  --soda-signature-alert-color: var(--bs-success);
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border: var(--bs-border-width) solid color-mix(in sRGB, var(--soda-signature-alert-color) 28%, var(--bs-paper-bg));
  border-radius: var(--bs-border-radius);
  background:
    linear-gradient(180deg,
      rgba(var(--soda-signature-alert-rgb), 0.12) 0%,
      rgba(var(--soda-signature-alert-rgb), 0.08) 100%);
}

.invoice-signature-alert.alert-success {
  --soda-signature-alert-rgb: var(--bs-success-rgb);
  --soda-signature-alert-color: var(--bs-success);
}

.invoice-signature-alert.alert-danger {
  --soda-signature-alert-rgb: var(--bs-danger-rgb);
  --soda-signature-alert-color: var(--bs-danger);
}

.invoice-signature-alert__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.invoice-signature-alert__body {
  min-width: 0;
}

.invoice-signature-alert__body .fw-semibold {
  margin-bottom: 0;
}

.invoice-signature-alert__body .small {
  line-height: 1.5;
}

@media (max-width: 575.98px) {
  .invoice-signature-alert {
    align-items: flex-start;
  }
}

.modal .tab-content,
.modal .tab-pane {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

@media (min-width: 1200px) {
  .modal-xl {
    max-width: 1400px;
  }

  .modal-lg {
    max-width: 1040px;
  }

}

@media (min-width: 1600px) {
  .modal-xl {
    max-width: 1600px;
  }

  .modal-lg {
    max-width: 1200px;
  }

}

.btn-close-x {
  position: fixed;
  inset-block-start: 0.9rem;
  inset-inline-end: 1rem;
}

.offcanvas .btn-close-x {
  position: absolute;
  inset-block-start: 1rem;
  inset-inline-end: 1rem;
  z-index: 2;
}

.offcanvas .offcanvas-header {
  padding-inline-end: 3.5rem;
}

.modal-locked .btn-close-x i {
  pointer-events: none;
}

:root[data-skin="bordered"] .modal-accent:not(.modal-transparent) .modal-content,
[data-bs-theme="light"][data-skin="bordered"] .modal-accent:not(.modal-transparent) .modal-content {
  --bs-modal-border-width: 0px;
}

.modal-container {
  min-height: 400px !important;
  display: flex !important;
  flex-direction: column;
}

/* Wspólna akcja ikonowa dla tabel formularzy: neutralna w spoczynku,
   w kolorze aktywnego motywu po najechaniu lub przejściu klawiaturą. */
.soda-grid-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.375rem;
  min-height: 2.375rem;
  padding: 0.5rem;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--bs-heading-color);
  line-height: 1;
  text-decoration: none;
  box-shadow: none;
  transition: color 0.15s ease-in-out;
}

.soda-grid-action:is(:hover, :focus-visible) {
  outline: 0;
  color: var(--bs-primary) !important;
  box-shadow: none;
}

.soda-grid-header {
  --bs-table-color: var(--bs-heading-color);
  --bs-table-bg: var(--bs-gray-50);
  --bs-table-border-color: var(--bs-border-color);
}

.soda-save-and-close-item {
  min-width: 12.5rem;
}

.soda-save-and-close-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  white-space: nowrap;
}

.modal-scrollable ul.list-group {
  border: 1px solid var(--bs-border-color) !important;
  border-radius: 0.375rem !important;
  overflow: hidden !important;
  overflow-y: auto !important;
  height: 313px !important;
  max-height: 313px !important;
  min-height: 313px !important;
}

.modal-scrollable ul.list-group::-webkit-scrollbar {
  width: 4px;
}

.modal-scrollable ul.list-group::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
}

.modal-scrollable ul.list-group li.list-group-item:not(.sortable-drag) {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid var(--bs-border-color) !important;
  border-radius: 0 !important;
}

.modal-scroll-wrapper {
  max-height: 650px;
  overflow-y: auto;
  position: relative;
}

.modal-scroll-wrapper table {
  border-collapse: separate;
  border-spacing: 0;
}

.modal-scroll-wrapper thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background-color: color-mix(in sRGB, var(--bs-base-color) 6%, var(--bs-paper-bg)) !important;
}

.modal-scroll-wrapper::-webkit-scrollbar {
  width: 6px;
}

.modal-scroll-wrapper::-webkit-scrollbar-thumb {
  background-color: rgba(var(--bs-primary-rgb), 0.25);
  border-radius: 4px;
}

.modal-scroll-wrapper::-webkit-scrollbar-track {
  background: transparent;
}

.modal-spinner-overlay {
  position: absolute;
  inset: 0;
  z-index: 1056;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: none;
}

html[data-bs-theme="light"] .modal-spinner-overlay {
  background: rgba(255, 255, 255, 0.55);
}

html[data-bs-theme="dark"] .modal-spinner-overlay {
  background: rgba(20, 24, 32, 0.55);
}

.soda-spinner-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

html[data-bs-theme="light"] .soda-spinner-overlay {
  background: rgba(255, 255, 255, 0.72);
}

html[data-bs-theme="dark"] .soda-spinner-overlay {
  background: rgba(20, 24, 32, 0.72);
}

.soda-spinner-overlay__content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal.modal-spinner-blocked {
  pointer-events: none;
}

.modal.modal-spinner-blocked .modal-spinner-overlay {
  pointer-events: all;
}

body.soda-spinner-blocked {
  overflow: hidden;
}

.soda-unsupported-resolution {
  display: none;
}

@media (max-width: 1279.98px) {
  body {
    overflow: hidden !important;
  }

  body>.layout-wrapper,
  body>.layout-overlay,
  body>.drag-target,
  body>.authentication-wrapper {
    display: none !important;
  }

  .soda-unsupported-resolution {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(2rem, 6vw, 5rem);
    background: var(--bs-body-bg);
  }

  .soda-unsupported-resolution__content {
    width: min(100%, 48rem);
  }

  .soda-unsupported-resolution__header {
    line-height: 1.7rem !important;
  }

  .soda-unsupported-resolution__text {
    line-height: 1.3rem !important;
  }
}

#soda-blur-overlay {
  position: fixed;
  inset: 0;
  backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity 2s ease, backdrop-filter 2s ease;
  z-index: 99999;
}

#soda-blur-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

#div_modal_session .progress {
  height: 6px;
  background-color: rgba(0, 0, 0, 0.08);
  border-radius: 999px;
  overflow: hidden;
}

#div_modal_session_progress {
  width: 100%;
  height: 100%;
  background-color: #f44336;
}

.card.no-shadow {
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

.card.no-shadow .card-header {
  background: transparent !important;
  border-bottom: none !important;
}

.card.no-shadow .card-body {
  padding-left: 0;
  padding-right: 0;
}

#ed_compose_modal #ed_compose_form,
#div_invoice_data_modal #form_invoice_data {
  margin-block-start: 1.2rem;
}

#ed_compose_modal #ed_compose_wizard,
#div_invoice_data_modal #invoice_data_wizard {
  display: block;
  background: transparent;
}

#ed_compose_modal .invoice-data-wizard-card,
#div_invoice_data_modal .invoice-data-wizard-card {
  border: 1px solid var(--bs-border-color);
  box-shadow: none;
  overflow: visible;
}

#ed_compose_modal .invoice-data-wizard-card .bs-stepper-header,
#div_invoice_data_modal .invoice-data-wizard-card .bs-stepper-header {
  padding-block: 1.25rem 0.75rem;
  border: 0;
}

#ed_compose_modal .invoice-data-wizard-card .bs-stepper-content,
#div_invoice_data_modal .invoice-data-wizard-card .bs-stepper-content {
  padding-block: 0.75rem 1.5rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#ed_compose_modal .invoice-data-step-body,
#div_invoice_data_modal .invoice-data-step-body {
  padding: 0;
}

#div_invoice_data_modal .invoice-data-auto-number-label {
  min-height: 0;
}

#ed_compose_modal #ed_compose_navigation,
#div_invoice_data_modal #div_invoice_data_navigation {
  min-height: 2.375rem;
}

#ed_compose_modal .invoice-data-navigation-button,
#div_invoice_data_modal .invoice-data-navigation-button {
  /* min-inline-size: 9.5rem; */
  padding-inline: 1.75rem;
  /* font-weight: 600; */
}

#ed_compose_modal .bs-stepper-title,
#div_invoice_data_modal .bs-stepper-title {
  position: relative;
  display: inline-block;
  padding-inline-end: 1rem;
}

#ed_compose_modal .bs-stepper-title.tab-dirty::after,
#div_invoice_data_modal .bs-stepper-title.tab-dirty::after {
  top: 50%;
  right: 0.125rem;
  left: auto;
  display: block;
}

#div_invoice_data_items_table tbody tr:last-child>td {
  border-bottom: 0;
}

/*
 * W rozszerzonym widoku pozycji domyślny padding tabeli Vuexy zajmował
 * znaczną część szerokości w każdej z dziesięciu kolumn. Zwężamy wyłącznie
 * ten grid, zachowując standardowe odstępy w pozostałych tabelach SODA.
 */
#table_invoice_data_items > :not(caption) > * > * {
  padding-inline: 0.375rem;
}

#table_invoice_data_items .form-control {
  min-width: 0;
  padding-inline: 0.625rem;
}

#table_invoice_data_items .form-select {
  min-width: 0;
  padding-inline-start: 0.625rem;
  padding-inline-end: 1.75rem;
  background-position: right 0.5rem center;
  background-size: 1.25rem 1.25rem;
}

/*
 * Edytor zadań planu korzysta z tego samego zwartego układu co pozycje
 * ręcznie wystawianej faktury. Reguły są ograniczone do tabeli w modalu.
 */
#table_budget_allocations > :not(caption) > * > * {
  padding-inline: 0.375rem;
}

#table_budget_allocations .form-control {
  min-width: 0;
  padding-inline: 0.625rem;
}

#table_budget_allocations .form-select {
  min-width: 0;
  padding-inline-start: 0.625rem;
  padding-inline-end: 1.75rem;
  background-position: right 0.5rem center;
  background-size: 1.25rem 1.25rem;
}

#table_budget_allocations {
  width: 100%;
  table-layout: fixed;
}

#table_invoice_data_items,
#div_invoice_data_totals table,
#div_invoice_data_step5 .invoice-preview-items table {
  width: 100%;
  table-layout: fixed;
}

#table_invoice_data_items .invoice-item-net,
#table_invoice_data_items .invoice-item-gross,
#div_invoice_data_totals th,
#div_invoice_data_totals td,
#div_invoice_data_step5 .invoice-preview-items th:not(:first-child),
#div_invoice_data_step5 .invoice-preview-items td:not(:first-child) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#div_invoice_data_step5 .invoice-data-review {
  min-width: 0;
}

#div_invoice_data_step5 .invoice-preview-header {
  padding: 1.25rem 1.5rem;
}

#div_invoice_data_step5 .invoice-data-review-meta td:first-child {
  width: 1%;
}

#div_invoice_data_step5 .invoice-data-review-ksef {
  color: var(--bs-secondary-color);
}

#div_invoice_data_step5 .invoice-data-review-ksef .ti {
  color: var(--bs-primary);
  width: 4.5rem;
  height: 4.5rem;
  font-size: 4.5rem;
  line-height: 1;
}

#div_invoice_data_step5 .invoice-data-review-parties>div {
  min-width: 0;
}

#div_invoice_data_step5 .invoice-data-review-parties p {
  overflow-wrap: anywhere;
}

#div_invoice_data_step5 .invoice-preview-items {
  max-height: 14rem;
}

#div_invoice_data_step5 .invoice-preview-summary {
  margin-top: 1.5rem;
}

@media (max-width: 767.98px) {
  #div_invoice_data_step5 .invoice-data-review-meta td:first-child {
    width: auto;
    white-space: normal;
  }

  #div_invoice_data_step5 .invoice-data-review-ksef {
    flex-direction: row !important;
    gap: 0.75rem;
  }

  #div_invoice_data_step5 .invoice-data-review-ksef .ti {
    width: 3rem;
    height: 3rem;
    font-size: 3rem;
  }

  #div_invoice_data_step5 .invoice-data-review-ksef .mt-2 {
    margin-top: 0 !important;
  }
}

#div_invoice_data_modal .modal-content {
  position: relative;
}

#div_invoice_number_series_overlay .modal-dialog,
#div_budget_request_number_series_overlay .modal-dialog {
  --bs-modal-width: 48rem;
  max-width: min(48rem, calc(100% - 2rem));
}

.invoice-number-series-item {
  padding: 0;
}

.invoice-number-series-item:last-child {
  border-bottom: 0;
}

.invoice-number-series-list-actions {
  border-top: 1px solid var(--bs-border-color);
}

.invoice-number-series-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  block-size: 5.5rem;
  padding-block: 0.75rem;
}

.invoice-number-series-pattern {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  min-block-size: 1.875rem;
  overflow-wrap: anywhere;
}

.invoice-number-series-pattern-text {
  min-width: 0;
}

.invoice-number-series-selected-badge {
  --bs-badge-font-size: 0.8125rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  line-height: 1;
  vertical-align: middle;
}

.invoice-number-series-content {
  min-width: 0;
}

.invoice-number-series-actions {
  align-self: center;
  flex: 0 0 auto;
}

@media (max-width: 767.98px) {
  .invoice-number-series-row {
    display: flex !important;
    block-size: auto;
    min-block-size: 5.5rem;
  }

  .invoice-number-series-pattern {
    flex-wrap: wrap;
  }

  .invoice-number-series-actions {
    width: 100%;
  }
}

/* Kontrolki liczbowe zgodne z rezerwacją numerów w module Korespondencje. */
#div_invoice_number_series_overlay .invoice-number-series-number:focus-within,
#div_budget_request_number_series_overlay .invoice-number-series-number:focus-within {
  box-shadow: 0 0 0 var(--bs-border-width) var(--bs-primary) !important;
}

#div_invoice_number_series_overlay .invoice-number-series-number:focus-within::before,
#div_budget_request_number_series_overlay .invoice-number-series-number:focus-within::before {
  box-shadow: none !important;
}

#div_invoice_number_series_overlay .invoice-number-series-number:focus-within>.form-control,
#div_invoice_number_series_overlay .invoice-number-series-number:focus-within>.btn,
#div_budget_request_number_series_overlay .invoice-number-series-number:focus-within>.form-control,
#div_budget_request_number_series_overlay .invoice-number-series-number:focus-within>.btn {
  border-color: var(--bs-primary) !important;
  box-shadow: none !important;
}

#div_invoice_number_series_overlay .invoice-number-series-number:focus-within>:not(:last-child),
#div_budget_request_number_series_overlay .invoice-number-series-number:focus-within>:not(:last-child) {
  box-shadow: var(--bs-border-width) 0 0 var(--bs-primary) !important;
}

#div_invoice_number_series_overlay .invoice-number-series-number>.btn:last-child,
#div_budget_request_number_series_overlay .invoice-number-series-number>.btn:last-child {
  margin-inline-end: 0 !important;
}

.centered-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.rounded_frame {
  position: relative;
  width: 300px;
  aspect-ratio: 1 / 1;
  border: none;
}

.rounded_frame .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -58%);
  text-align: center;
  width: 100%;
}

.text-red {
  color: #db133c !important;
}

.text-end {
  text-align: right;
  white-space: nowrap;
}

.soda-chevron {
  font-size: 1.1rem;
  transition: transform 0.2s ease;
}

.soda-chevron.rotated {
  transform: rotate(90deg);
}

.soda-force-hidden {
  display: none !important;
  visibility: hidden !important;
}

.disabled-action {
  opacity: 0.4;
  pointer-events: none;
  cursor: not-allowed;
}

.bw-text {
  color: #000;
}

[data-bs-theme="dark"] .bw-text {
  color: #fff;
}

.mh-500 {
  min-height: 500px;
}

.no-data-container {
  padding-top: 8.5rem;
}

.modal .no-data-container {
  padding-top: 0;
}

.no-data-container i {
  opacity: 0.6;
}

.no-data-container h6 {
  font-weight: 600;
}

.no-data-widget-container {
  padding-top: 8.5rem;
}

.progress .progress-bar {
  box-shadow: none;
}

.flatpickr-calendar {
  z-index: 2000 !important;
}

/* Popup datepickers need side gutter for selected/range shadows; the inline app calendar has its own sizing. */
.flatpickr-calendar:not(.inline) {
  inline-size: 17.5rem;
}

.flatpickr-calendar:not(.inline) .flatpickr-innerContainer,
.flatpickr-calendar:not(.inline) .flatpickr-innerContainer .flatpickr-rContainer {
  inline-size: 100%;
}

.flatpickr-calendar:not(.inline) .flatpickr-weekdays,
.flatpickr-calendar:not(.inline) .flatpickr-days {
  inline-size: 15.75rem;
  margin-inline: auto;
}

.flatpickr-calendar:not(.inline) .flatpickr-days {
  overflow: visible;
}

.flatpickr-calendar:not(.inline) .flatpickr-days .dayContainer {
  margin-inline: auto;
}

.aa-DetachedContainer {
  z-index: 1040;
}

/*
 * Keep the detached search suggestions framed by stable vertical gutters.
 * When the index is taller than the modal, only the suggestions scroll.
 */
.aa-DetachedOverlay .aa-DetachedContainer {
  display: flex;
  flex-direction: column;
}

.aa-DetachedOverlay .aa-Panel:has(> .p-5.p-lg-12) {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-block-size: 0;
  overflow: hidden;
  padding-block: 1.25rem;
}

.aa-DetachedOverlay .aa-Panel>.p-5.p-lg-12 {
  flex: 1 1 auto;
  min-block-size: 0;
  overflow-y: auto;
  padding-block: 0 !important;
}

@media (min-width: 992px) {
  .aa-DetachedOverlay .aa-Panel:has(> .p-5.p-lg-12) {
    padding-block: 3rem;
  }
}

.spinner-border-lg,
.spinner-grow-lg,
.modal-spinner-overlay .spinner-border,
.modal-spinner-overlay .spinner-grow,
.soda-spinner-overlay .spinner-border,
.soda-spinner-overlay .spinner-grow {
  --bs-spinner-border-width: 0.4em;
  --bs-spinner-height: 3rem;
  --bs-spinner-width: 3rem;
  color: var(--bs-primary);
}

.form-label {
  font-size: 0.9375rem;
}

.soda-required-marker::after {
  content: ' *';
  color: var(--bs-danger);
  font-weight: 700;
}

.soda-required-markers-hidden .soda-required-marker::after {
  display: none;
}

.form-control-validation .input-group~.invalid-feedback {
  display: block;
}

.input-group {
  flex-wrap: nowrap !important;
}

.input-group>.form-control {
  flex: 1 1 auto !important;
  width: 1% !important;
  min-width: 0 !important;
}

/* Zakres numerów ma jedną obwódkę focus w kolorze aktywnego motywu. */
#div_e_delivery_reservation_modal .e-delivery-reservation-number:focus-within {
  box-shadow: 0 0 0 var(--bs-border-width) var(--bs-primary) !important;
}

#div_e_delivery_reservation_modal .e-delivery-reservation-number:focus-within::before {
  box-shadow: none !important;
}

#div_e_delivery_reservation_modal .e-delivery-reservation-number:focus-within>.form-control,
#div_e_delivery_reservation_modal .e-delivery-reservation-number:focus-within>.btn {
  border-color: var(--bs-primary) !important;
  box-shadow: none !important;
}

#div_e_delivery_reservation_modal .e-delivery-reservation-number:focus-within>:not(:last-child) {
  box-shadow: var(--bs-border-width) 0 0 var(--bs-primary) !important;
}

#div_e_delivery_reservation_modal .e-delivery-reservation-number>.btn:last-child {
  margin-inline-end: 0 !important;
}

.form-password-toggle .input-group.input-group-merge {
  border: var(--bs-border-width) solid color-mix(in sRGB, var(--bs-base-color) 22%, var(--bs-paper-bg));
  border-radius: var(--bs-border-radius);
  background-color: transparent;
  overflow: hidden;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-password-toggle .input-group.input-group-merge>.form-control,
.form-password-toggle .input-group.input-group-merge>.input-group-text {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.form-password-toggle .input-group.input-group-merge>.form-control {
  position: relative;
  z-index: 1;
}

.form-password-toggle .input-group.input-group-merge>.input-group-text {
  position: relative;
  z-index: 6;
  pointer-events: auto;
}

.form-password-toggle .input-group.input-group-merge> :not(:first-child) {
  margin-left: 0 !important;
}

.form-password-toggle .input-group.input-group-merge:focus-within {
  border-color: var(--bs-primary);
  box-shadow:
    inset 0 0 0 1px var(--bs-primary),
    0 0.125rem 0.375rem 0 rgba(var(--bs-primary-rgb), 0.3);
}

.input-group:has(.form-control.is-invalid) {
  border: 2px solid var(--bs-danger);
  border-radius: var(--bs-border-radius);
}

.input-group:has(.form-control.is-invalid) .form-control,
.input-group:has(.form-control.is-invalid) .input-group-text {
  border: none !important;
  box-shadow: none !important;
  background: transparent;
}

.input-group:has(.form-control.is-invalid):focus-within {
  border-color: var(--bs-danger);
  box-shadow: 0 0 0 0.25rem rgba(var(--bs-danger-rgb), 0.25);
}

.input-group:has(.form-control.is-invalid):hover {
  border-color: var(--bs-danger);
  box-shadow: none;
}

.input-group:has(.form-control.is-invalid) .input-group-text,
.input-group:has(.form-control.is-invalid) .input-group-text i {
  color: var(--bs-danger);
}

.input-group:has(.form-control.is-invalid)+.invalid-feedback,
.form-control.is-invalid~.invalid-feedback {
  display: block;
}

.btn-file-clear {
  display: flex;
  align-items: center;
  justify-content: center;
}

.input-group.file-clear-hidden>.form-control[type="file"] {
  border-top-right-radius: var(--bs-border-radius) !important;
  border-bottom-right-radius: var(--bs-border-radius) !important;
}

.input-group:not(.file-clear-hidden)>.form-control[type="file"] {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.form-check-input:disabled {
  opacity: 1 !important;
  cursor: default;
}

.form-check-input:disabled:checked {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.form-check-input:disabled+.form-check-label {
  opacity: 1 !important;
  color: inherit;
}

.nav-tabs .nav-link,
.nav-pills .nav-link {
  position: relative;
  text-transform: none;
}

.tab-dirty::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  transform: translateY(-50%);
  background-color: currentColor;
  pointer-events: none;
  opacity: 0.9;
}

.swal2-container .swal2-popup .swal2-title {
  color: var(--bs-body-color);
  font-size: 2rem;
  font-weight: 500;
}

.swal2-container .swal2-modal.swal2-popup .swal2-title {
  line-height: 1.175;
  margin-block: 1.2rem 1rem;
  max-inline-size: 16em;
}

.swal2-container .swal2-modal.swal2-popup .swal2-actions {
  margin-block-start: 1rem;
  margin-bottom: 1.2rem;
}

div:where(.swal2-container) .swal2-html-container {
  z-index: 1;
  justify-content: center;
  margin: 0;
  padding: 0 2em 2em;
  overflow: auto;
  color: inherit;
  font-size: 1em;
  font-weight: normal;
  line-height: normal;
  text-align: center;
  word-wrap: break-word;
  word-break: break-word;
}

.container-xxl.flex-grow-1 {
  min-width: 0;
}

.card-datatable {
  overflow-x: auto !important;
}

.card-datatable table.dataTable {
  min-width: 100%;
}

/*
 * Przy scrollX DataTables wylicza szerokość kopii nagłówka na podstawie
 * zawartości kolumn. Dla pustej tabeli wynik może być węższy od kontenera,
 * mimo że właściwa tabela ma min-width: 100%. Nagłówek powinien wypełniać
 * dostępne miejsce, ale nadal może być szerszy, gdy kolumny wymagają scrolla.
 */
.card-datatable .dt-scroll-head-inner,
.card-datatable .dt-scroll-headInner {
  min-width: 100%;
}

.card-datatable .dt-scroll-head-inner>table.dataTable,
.card-datatable .dt-scroll-headInner>table.dataTable,
.card-datatable .dt-scroll-body>table.dataTable {
  min-width: 100%;
}

.dt-search .form-control:focus,
.dt-length .form-select:focus {
  box-shadow: none;
}

.dt-search .soda-dt-search-field {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.dt-search .soda-dt-search-field .form-control {
  padding-right: 2.75rem;
}

.dt-search .soda-dt-search-field .form-control::-webkit-search-cancel-button,
.dt-search .soda-dt-search-field .form-control::-webkit-search-decoration {
  display: none;
  -webkit-appearance: none;
  appearance: none;
}

.dt-search .soda-dt-search-field .form-control::-ms-clear {
  display: none;
  width: 0;
  height: 0;
}

.dt-search .soda-dt-search-clear {
  position: absolute;
  top: 50%;
  right: 0.75rem;
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  color: var(--bs-heading-color);
  background: transparent;
  border: 0;
  opacity: 0.82;
  transform: translateY(-50%);
}

.dt-search .soda-dt-search-clear:hover,
.dt-search .soda-dt-search-clear:focus-visible {
  color: var(--bs-heading-color);
  opacity: 1;
}

.dt-search .soda-dt-search-clear i {
  font-size: 1.25rem;
  line-height: 1;
}

.dt-buttons {
  display: none !important;
}

.dt-grow {
  width: 100%;
  white-space: normal;
}

.dt-column-filters th {
  padding: 0.25rem;
}

.dt-column-filters input {
  width: 100%;
  font-size: 0.75rem;
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  border: 1px solid var(--bs-border-color);
}

.dt-scroll-body {
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 100, 120, 0.45) transparent;
}

.dt-scroll-body::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.dt-scroll-body::-webkit-scrollbar-track {
  background: transparent;
}

.dt-scroll-body::-webkit-scrollbar-thumb {
  background-color: rgba(100, 100, 120, 0.45);
  border-radius: 10px;
}

.dt-scroll-body::-webkit-scrollbar-thumb:hover {
  background-color: rgba(100, 100, 120, 0.65);
}

.dataTable thead th,
.dataTable thead th .dt-column-title {
  font-size: 0.9375rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
}

table.dataTable th,
table.dataTable td {
  white-space: nowrap;
}

table.dataTable thead .dt-column-order::before,
table.dataTable thead .dt-column-order::after {
  visibility: visible !important;
  opacity: 0.35 !important;
  background-color: var(--bs-secondary-color) !important;
}

table.dataTable thead .dt-ordering-asc .dt-column-order::before,
table.dataTable thead .dt-ordering-desc .dt-column-order::after {
  opacity: 0.9 !important;
  background-color: var(--bs-heading-color) !important;
}

table.dataTable th.text-end {
  padding-right: 1.75rem !important;
  padding-left: 0.5rem;
}

table.dataTable td.text-end {
  padding-right: 0.75rem !important;
  padding-left: 0.5rem;
}

table.dataTable td.dt-new-indicator,
table.dataTable th.dt-new-indicator {
  position: relative;
  padding-left: 28px;
  padding-right: 8px;
  white-space: nowrap;
}

table.dataTable td.dt-new-indicator .dt-checkbox-row {
  margin-left: 15px;
}

table.dataTable .dt-checkbox-all {
  margin-left: 0;
}

table.dataTable[data-has-new-indicator="1"] .dt-checkbox-all {
  margin-left: 19px;
}

table.dataTable td.dt-new-indicator::before {
  content: '';
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: var(--bs-primary);
  /* box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.25); */
  opacity: 0;
  transform: translateY(-50%);
  position: absolute;
  left: 20px;
  top: 50%;
  pointer-events: none;
}

table.dataTable tbody tr.row-new td.dt-new-indicator::before {
  opacity: 1;
}

table.dataTable tbody tr.row-user-flag td.dt-new-indicator::before {
  opacity: 1;
  box-shadow: none !important;
}

table.dataTable td.dt-new-indicator.dt-user-flag-green::before {
  background-color: #34c759 !important;
}

table.dataTable td.dt-new-indicator.dt-user-flag-orange::before {
  background-color: #ff9500 !important;
}

table.dataTable td.dt-new-indicator.dt-user-flag-blue::before {
  background-color: #007aff !important;
}

table.dataTable td.dt-new-indicator.dt-user-flag-red::before {
  background-color: #ff3b30 !important;
}

table.dataTable td.dt-new-indicator.dt-user-flag-black::before {
  background-color: #1c1c1e !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.38) !important;
}

table.dataTable tbody tr.row-new {
  animation: sodaRowNewFadeIn 0.35s ease-out;
  font-weight: 600 !important;
}

table.dataTable tbody tr.row-new>td {
  background-color: rgba(var(--bs-primary-rgb), 0.06);
  font-weight: 600 !important;
}

table.dataTable tbody tr.row-new:hover>td {
  background-color: rgba(var(--bs-primary-rgb), 0.12);
}

table.dataTable tbody tr.row-new a {
  font-weight: 600;
}

table.dataTable tbody tr.row-new .badge {
  font-weight: 500;
}

.invoice-user-flag-menu {
  position: relative;
}

.invoice-user-flag-menu>.invoice-user-flag-submenu {
  top: -0.5rem;
  right: auto;
  left: calc(100% - 0.125rem);
  min-width: 13rem;
}

.invoice-user-flag-menu>.invoice-user-flag-submenu.invoice-user-flag-submenu--left {
  right: calc(100% - 0.125rem);
  left: auto;
}

.invoice-user-flag-menu:hover>.invoice-user-flag-submenu,
.invoice-user-flag-menu:focus-within>.invoice-user-flag-submenu {
  display: block;
}

.invoice-user-flag-option {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.invoice-user-flag-menu-toggle {
  display: flex;
  align-items: center;
}

.invoice-user-flag-option .invoice-user-flag-check {
  margin-left: auto;
}

.invoice-user-flag-swatch {
  width: 0.625rem;
  height: 0.625rem;
  flex: 0 0 0.625rem;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(var(--bs-body-color-rgb), 0.16);
}

.invoice-user-flag-swatch--green { background-color: #34c759; }
.invoice-user-flag-swatch--orange { background-color: #ff9500; }
.invoice-user-flag-swatch--blue { background-color: #007aff; }
.invoice-user-flag-swatch--red { background-color: #ff3b30; }
.invoice-user-flag-swatch--black { background-color: #1c1c1e; }

@media (max-width: 575.98px) {
  .invoice-user-flag-menu>.invoice-user-flag-submenu {
    position: static;
    min-width: calc(100% - 1rem);
    max-width: none;
    margin: 0.25rem 0.5rem;
    transform: none;
  }
}

table.dataTable tbody tr.row-warning>td {
  background-color: rgba(var(--bs-warning-rgb), 0.12);
}

table.dataTable tbody tr.row-warning:hover>td {
  background-color: rgba(var(--bs-warning-rgb), 0.18);
}

table.dataTable tbody tr.row-danger>td {
  background-color: rgba(var(--bs-danger-rgb), 0.12);
}

table.dataTable tbody tr.row-danger:hover>td {
  background-color: rgba(var(--bs-danger-rgb), 0.18);
}

@keyframes sodaRowNewFadeIn {
  from {
    background-color: rgba(var(--bs-primary-rgb), 0.18);
  }

  to {
    background-color: rgba(var(--bs-primary-rgb), 0.06);
  }
}

.table th {
  font-size: 0.9375rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
}

.table-notif-settings th:first-child,
.table-notif-settings td:first-child {
  padding-left: 0;
}

.table-notif-settings th:last-child,
.table-notif-settings td:last-child {
  padding-right: 0;
}

.table-notif-settings thead,
.table-notif-settings thead th {
  border-top: none !important;
}

.table-notif-settings thead th {
  padding-top: 0 !important;
}

.table-notif-settings tbody tr:hover>* {
  background-color: transparent !important;
}

.table tr.text-danger>td {
  color: var(--bs-danger) !important;
}

.profile-tab-start {
  padding-top: 0 !important;
}

.profile-tab-start> :first-child {
  margin-top: 0 !important;
}

.soda-settings-shell {
  overflow: hidden;
}

.soda-settings-shell>.soda-page-header {
  min-height: 4.5rem;
}

.soda-settings-layout {
  align-items: stretch;
}

.soda-settings-sidebar {
  min-height: 100%;
  background: var(--bs-card-bg, var(--bs-body-bg));
}

.soda-settings-sidebar-pane {
  padding: 1.5rem 1rem 1.5rem 1.25rem;
}

.soda-settings-main {
  padding: 1.25rem;
}

.soda-settings-main .nav-align-top>.nav {
  margin-bottom: 1rem !important;
}

.soda-settings-summary-divider {
  height: 1px;
  background: var(--bs-border-color);
}

.soda-mobile-pairing {
  display: block;
}

.soda-mobile-pairing__code {
  display: grid;
  gap: 0.25rem;
  padding: 0.875rem 1rem;
  border: 1px dashed var(--bs-border-color);
  border-radius: 0.5rem;
  background: var(--bs-body-bg);
}

.soda-mobile-pairing__code span {
  font-family: var(--bs-font-monospace);
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
  color: var(--bs-heading-color);
}

.soda-mobile-pairing__code small,
.soda-mobile-device-row small {
  color: var(--bs-secondary-color);
}

.soda-mobile-pairing__code[data-state="active"] {
  border-color: var(--bs-primary);
}

.soda-mobile-pairing__code[data-state="expired"] {
  border-color: var(--bs-danger);
}

.soda-mobile-pairing__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.soda-mobile-device-list {
  display: grid;
  gap: 0.625rem;
}

.soda-mobile-device-list:empty {
  display: none;
}

.soda-mobile-device-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0;
  border-top: 1px solid var(--bs-border-color);
}

.soda-mobile-device-row__body {
  min-width: 0;
}

.soda-mobile-device-row__body strong,
.soda-mobile-device-row__body small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soda-mobile-device-empty {
  padding-top: 0.25rem;
  color: var(--bs-secondary-color);
}

.soda-settings-sidebar-pane .soda-settings-summary-divider {
  margin-left: -1.25rem;
  margin-right: -1rem;
}

.soda-settings-summary-list {
  color: var(--bs-body-color);
}

.soda-settings-summary-list .h6,
.soda-settings-sidebar .customer-info h5 {
  color: var(--bs-heading-color);
}

.soda-settings-main .tab-pane>.card:last-child {
  margin-bottom: 0 !important;
}

.company-bank-accounts .accordion-item {
  overflow: hidden;
}

.company-bank-account-header {
  min-width: 0;
}

.company-bank-account-header__title,
.company-bank-account-header__number {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.company-bank-account-header__number {
  color: var(--bs-secondary-color);
  font-size: var(--bs-body-font-size);
  font-weight: 400;
}

.company-bank-account-badges {
  flex: 0 0 auto;
}

.company-bank-account-form .form-label {
  margin-bottom: 0.375rem;
}

.soda-accordion-heading-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  padding-right: 0.75rem;
}

.soda-accordion-heading-label {
  min-width: 0;
}

.soda-accordion-heading-badge {
  justify-self: end;
  flex: 0 0 auto;
}

@media (max-width: 575.98px) {
  .company-bank-account-badges {
    width: 100%;
  }
}

.table-frame {
  border: 1px solid var(--bs-border-color);
  border-radius: var(--bs-border-radius) !important;
}

@media (max-width: 767.98px) {
  .soda-settings-sidebar.border-end {
    border-right: 0 !important;
    border-top: 1px solid var(--bs-border-color) !important;
  }

  .soda-settings-sidebar-pane,
  .soda-settings-main {
    padding: 1rem;
  }
}

.table-inner-borders th,
.table-inner-borders td {
  border: none;
}

.table-inner-borders th+th,
.table-inner-borders td+td {
  border-left: 1px solid var(--bs-border-color);
}

.table-inner-borders tbody tr+tr td {
  border-top: 1px solid var(--bs-border-color);
}

.table-attachments-flash {
  animation: sodaAttachmentsFlash 0.35s ease-out;
}

.table-attachments-flash tbody tr>td {
  background-color: transparent;
}

@keyframes sodaAttachmentsFlash {
  from {
    background-color: rgba(var(--bs-primary-rgb), 0.12);
  }

  to {
    background-color: transparent;
  }
}

.table-invoices {
  border-top: none !important;
}

.table-invoices thead,
.table-invoices thead th {
  border-top: none !important;
}

.table-invoices td:nth-child(4) {
  max-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.plain-scroll-wrapper {
  max-height: 650px;
  overflow-y: auto;
  position: relative;
}

.plain-scroll-wrapper table {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  width: 100%;
  font-size: small;
}

.plain-scroll-wrapper table td,
.plain-scroll-wrapper table th {
  padding: 2px 0;
  line-height: 1.25;
  vertical-align: middle;
}

.plain-scroll-wrapper thead th {
  font-size: small;
  font-weight: 500;
  top: 0;
  z-index: 3;
}

.plain-scroll-wrapper pre {
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  font-family: "Courier New", Consolas, "Liberation Mono", monospace;
  font-size: 12px;
  line-height: 1.35;
}

.plain-scroll-wrapper::-webkit-scrollbar {
  width: 6px;
}

.plain-scroll-wrapper::-webkit-scrollbar-thumb {
  background-color: rgba(var(--bs-primary-rgb), 0.25);
  border-radius: 4px;
}

.plain-scroll-wrapper::-webkit-scrollbar-track {
  background: transparent;
}

.thin-scroll {
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 100, 120, 0.45) transparent;
}

.thin-scroll::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.thin-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.thin-scroll::-webkit-scrollbar-thumb {
  background-color: rgba(100, 100, 120, 0.45);
  border-radius: 10px;
}

.thin-scroll::-webkit-scrollbar-thumb:hover {
  background-color: rgba(100, 100, 120, 0.65);
}

.invoice-preview-header {
  background-color: var(--bs-gray-100);
  border-radius: 0.375rem;
  margin: 1.5rem;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--bs-border-color);
}

.invoice-preview-actions {
  max-width: 195px;
}

.invoice-preview-dropdown {
  min-width: 200px !important;
  text-align: left !important;
  margin-left: -5px !important;
}

/* Otwarte menu jest przenoszone do body, aby nie przycinał go scroll modala. */
.invoice-preview-dropdown--portal {
  z-index: 1090 !important;
}

.invoice-warehouse-docs-modal-content {
  position: relative;
  max-height: min(820px, calc(100vh - 2rem));
}

.invoice-warehouse-docs-modal-content>.btn-close-x {
  position: absolute;
  z-index: 2;
}

.invoice-warehouse-docs-table {
  margin-bottom: 0;
  overflow-x: auto;
}

.invoice-warehouse-docs-table table {
  min-width: 1020px;
}

.invoice-warehouse-docs-table td {
  vertical-align: middle;
}

.invoice-modal-layout {
  --invoice-modal-panel-min-height: clamp(620px, 72vh, 860px);
  --invoice-modal-action-spacing: 1.5rem;
  display: flex;
  align-items: stretch;
  min-height: var(--invoice-modal-panel-min-height);
}

.invoice-modal-sidebar {
  display: flex;
  flex: 0 0 260px;
  flex-direction: column;
  min-width: 260px;
  min-height: var(--invoice-modal-panel-min-height);
}

.invoice-document-modal .invoice-modal-sidebar {
  flex-basis: max-content;
  min-width: max-content;
}

.invoice-document-modal .invoice-modal-sidebar__nav {
  width: max-content;
}

.invoice-document-modal .invoice-modal-sidebar__nav .nav-link {
  white-space: nowrap;
}

.invoice-modal-sidebar__nav {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  margin-right: 0 !important;
}

.invoice-modal-layout>.tab-content {
  flex: 1 1 auto;
  min-height: var(--invoice-modal-panel-min-height);
  min-width: 0;
}

.invoice-modal-sidebar__action {
  width: 100%;
  text-align: left !important;
}

.invoice-modal-sidebar__qr {
  display: flex;
  justify-content: center;
  padding-top: 1.5rem;
}

.invoice-modal-layout>.tab-content>.tab-pane>.card,
#div_invoice_preview_content>.card {
  min-height: var(--invoice-modal-panel-min-height);
}

.invoice-workflow-card__actions {
  margin-top: 0;
}

.invoice-items-table.invoice-preview-items {
  margin-bottom: 0;
}

.invoice-preview-summary {
  margin-top: var(--invoice-modal-action-spacing);
}

.invoice-preview-summary .invoice-items-table {
  margin-bottom: 0;
}

.invoice-preview-summary .invoice-ksef-qr-wrapper:not(.d-none)+.invoice-preview-actions {
  margin-top: var(--invoice-modal-action-spacing);
}

.invoice-items-table.split-cost-items-wrapper {
  max-height: clamp(30rem, 56vh, 42rem);
  max-height: clamp(30rem, 56dvh, 42rem);
  margin-bottom: var(--invoice-modal-action-spacing);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.split-item-allocation-row .input-split-allocation-quantity {
  flex: 0 0 6.5rem;
  width: 6.5rem;
}

.split-item-allocation-row .select-split-item-cost-center {
  min-width: 9rem;
}

.split-cost-item-name .split-item-allocation-error {
  display: block;
  margin-top: 0.25rem;
  line-height: 1.25;
}

.invoice-workflow-card__summary-wrap {
  margin-bottom: 0 !important;
}

.invoice-workflow-card__summary-wrap:not(.d-none) {
  margin-bottom: var(--invoice-modal-action-spacing) !important;
}

.invoice-workflow-card__summary-wrap .invoice-items-table {
  margin-bottom: 0;
}

.invoice-visualization-viewer {
  position: fixed;
  inset: 0;
  z-index: 100000;
  padding: 0;
  background: transparent;
  backdrop-filter: none;
}

.invoice-visualization-window {
  position: fixed;
  z-index: 100001;
  display: flex;
  flex-direction: column;
  width: min(1120px, calc(100vw - 2rem));
  height: min(82vh, 900px);
  min-width: 720px;
  min-height: 520px;
  max-width: calc(100vw - 2rem);
  max-height: calc(100vh - 2rem);
  margin: 0;
  overflow: hidden;
  resize: both;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  box-shadow: 0 1.5rem 3rem rgba(33, 43, 54, 0.2);
}

.invoice-visualization-window__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1.25rem;
  border-bottom: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  cursor: move;
}

.invoice-visualization-window__brand {
  padding: 0;
}

.invoice-visualization-window__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.invoice-visualization-window__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
}

.invoice-visualization-window__body {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  background: var(--bs-gray-100);
}

.invoice-visualization-window__loading {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  background: rgba(255, 255, 255, 0.82);
}

#iframe_invoice_visualization {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

body.invoice-visualization-dragging,
body.invoice-visualization-dragging * {
  user-select: none !important;
}

.invoice-meta-table td {
  padding: 0.15rem 0;
  line-height: 1.35;
  vertical-align: top;
}

.invoice-meta-table td:first-child {
  white-space: nowrap;
  padding-right: 1rem;
  color: var(--bs-secondary-color);
}

.invoice-ksef-number {
  display: inline-flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  max-width: none;
  font-size: 0.95rem;
}

.invoice-ksef-number .copy-icon {
  flex: 0 0 auto;
}

.invoice-modal-fill-card {
  height: var(--invoice-modal-panel-min-height);
  min-height: var(--invoice-modal-panel-min-height);
  display: flex;
  flex-direction: column;
}

.invoice-modal-fill-scroll {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: none;
}

.invoice-modal-empty-section {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.invoice-modal-fill-scroll>.no-data-container,
.invoice-modal-empty-section>.no-data-container,
.invoice-modal-fill-scroll>.card-body {
  flex: 1 1 auto;
}

/*
 * Faktury mają różną ilość treści na poszczególnych zakładkach. Wariant
 * adaptacyjny zachowuje spokojne minimum, ale nie rozciąga krótkich widoków do
 * dawnej stałej wysokości. Długą zawartość ogranicza viewport, dzięki czemu
 * dolna krawędź modala zawsze pozostaje widoczna.
 */
.invoice-document-modal {
  --invoice-document-modal-viewport-gap: 1rem;
  --invoice-document-modal-viewport-inset: 2rem;
}

.invoice-document-modal .modal-dialog {
  margin-top: var(--invoice-document-modal-viewport-gap);
  margin-bottom: var(--invoice-document-modal-viewport-gap);
}

.invoice-document-modal .modal-content {
  max-height: calc(100vh - var(--invoice-document-modal-viewport-inset));
  max-height: calc(100dvh - var(--invoice-document-modal-viewport-inset));
  overflow: hidden;
}

.invoice-document-modal .modal-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

/*
 * Scrollbar modala zajmuje część jego szerokości po prawej stronie. Odejmujemy
 * jego faktyczną szerokość od odstępu treści, aby widoczny zewnętrzny inset
 * pozostał taki sam jak po lewej również na Windowsie.
 */
.invoice-balanced-body-modal {
  --invoice-modal-body-scrollbar-width: var(--soda-invoice-modal-scrollbar-width, 0px);
}

.invoice-balanced-body-modal .modal-body {
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.invoice-document-modal.invoice-balanced-body-modal .modal-body>.px-3.py-5 {
  padding-inline-end: max(0px, calc(0.75rem - var(--invoice-modal-body-scrollbar-width))) !important;
}

#ed_compose_modal.invoice-balanced-body-modal #ed_compose_wizard_card,
#div_invoice_data_modal.invoice-balanced-body-modal #div_invoice_data_wizard_card {
  margin-inline-end: max(0px, calc(1.25rem - var(--invoice-modal-body-scrollbar-width))) !important;
}

.invoice-document-modal .invoice-modal-layout {
  --invoice-modal-panel-min-height: clamp(360px, 44vh, 520px);
  --invoice-modal-panel-min-height: clamp(360px, 44dvh, 520px);
}

.invoice-document-modal .invoice-modal-fill-card {
  height: auto;
}

/*
 * Na ekranach o fizycznej wysokości Full HD lub mniejszej profil wyświetlacza
 * przenosi markę, dane dokumentu, status i zamknięcie do jednego niskiego
 * wiersza. Klasa profilu jest ustawiana przed załadowaniem CSS, dlatego modal
 * nie przeskakuje między wariantami podczas otwierania.
 */
@media (min-width: 1280px) {
  html.soda-display-height-compact .modal {
    --bs-modal-margin: 0px;
  }

  html.soda-display-height-compact .invoice-document-modal {
    --invoice-document-modal-viewport-gap: 0px;
    --invoice-document-modal-viewport-inset: 0px;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-rows: auto minmax(0, 1fr);
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-content>.app-brand {
    align-self: center;
    grid-column: 1;
    grid-row: 1;
    padding: 0.5rem 0 0.5rem 1rem !important;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-header {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    justify-content: flex-start !important;
    padding: 0.625rem 1rem 0.375rem !important;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-header>.text-center {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
    text-align: left !important;
    white-space: nowrap;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-header h4 {
    flex: 0 0 auto;
    color: var(--bs-body-color);
    font-size: 0.95rem !important;
    font-weight: 700;
    line-height: inherit;
    margin-bottom: 0 !important;
    transform: translateY(-1px);
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-header .text-muted {
    min-width: 0;
    font-size: 0.95rem !important;
    margin-bottom: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    transform: translateY(-1px);
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-header .text-muted::before {
    margin-right: 0.75rem;
    color: var(--bs-secondary-color);
    content: "\00b7";
  }

  html.soda-display-height-compact .invoice-compact-header-modal .header-status-wrapper {
    flex: 0 0 auto;
    min-height: 0;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .header-status-wrapper:empty {
    display: none;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .header-status-wrapper:not(:empty)::before {
    margin-right: 0.75rem;
    color: var(--bs-secondary-color);
    content: "\00b7";
  }

  html.soda-display-height-compact .invoice-compact-header-modal .btn-close-x {
    position: static;
    align-self: center;
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    padding: 0.5rem 1rem;
  }

  html.soda-display-height-compact .invoice-compact-header-modal .modal-body {
    grid-column: 1 / -1;
    grid-row: 2;
    min-height: 0;
  }

  html.soda-display-height-compact .invoice-document-modal .modal-body>.px-3.py-5 {
    padding-top: 0.25rem !important;
    padding-bottom: 1rem !important;
  }

  html.soda-display-height-compact #div_invoice_data_modal #form_invoice_data {
    margin-block-start: 0.25rem;
  }

  html.soda-display-height-compact #div_invoice_data_modal #div_invoice_data_step5 .invoice-preview-header {
    margin-bottom: 1rem !important;
    padding: 0.75rem 1rem;
  }

  html.soda-display-height-compact #div_invoice_data_modal #div_invoice_data_step5 .invoice-preview-header h4 {
    margin-bottom: 0.5rem !important;
    color: var(--bs-body-color);
    font-size: 0.95rem !important;
    font-weight: 600;
    line-height: inherit;
  }

  html.soda-display-height-compact .invoice-document-modal #div_invoice_preview_content>.card>.invoice-preview-header {
    margin: 1rem;
    padding: 0.75rem 1rem;
  }

  html.soda-display-height-compact .invoice-document-modal #div_invoice_preview_content>.card>.invoice-preview-header h4 {
    margin-bottom: 0.5rem !important;
    color: var(--bs-body-color);
    font-size: 0.95rem !important;
    font-weight: 600;
    line-height: inherit;
  }

  html.soda-display-height-compact .invoice-document-modal #div_upo_preview_content .invoice-upo-title {
    color: var(--bs-body-color);
    font-size: 0.95rem !important;
    font-weight: 600;
    line-height: inherit;
  }

  html.soda-display-height-compact .invoice-document-modal #div_invoice_preview_content>.card>.card-body:not(.invoice-preview-header) {
    padding-right: 1rem !important;
    padding-bottom: 1rem !important;
    padding-left: 1rem !important;
  }
}

#tr_invoice_ksef_number td:last-child {
  white-space: nowrap;
}

.invoice-items-table {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.375rem;
  margin-bottom: 1.75rem;
  overflow: hidden;
}

.invoice-items-table table {
  border-collapse: separate;
  border-spacing: 0;
}

.invoice-items-table thead,
.invoice-items-table thead tr,
.invoice-items-table thead th {
  border: 0 !important;
}

.invoice-items-table th.text-end,
.invoice-items-table td.text-end {
  padding-right: 0.75rem;
  padding-left: 0.5rem;
}

.invoice-items-table tbody tr:first-child td {
  border-top: 1px solid var(--bs-border-color);
}

.invoice-items-table tbody tr:last-child td {
  border-bottom: 0;
}

.invoice-items-wrapper {
  max-height: 238px;
  overflow-y: auto;
  border-radius: 6px;
}

.invoice-items-wrapper.large {
  max-height: 400px;
}

.invoice-items-wrapper table {
  border-collapse: separate;
  border-spacing: 0;
}

.invoice-items-wrapper thead {
  position: sticky;
  top: 0;
  z-index: 4;
}

.invoice-items-wrapper thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background-color: var(--bs-table-bg, #2f3349) !important;
  background-clip: padding-box;
}

.invoice-items-wrapper .invoice-summary-row td {
  position: sticky;
  bottom: 0;
  z-index: 9;
  background-image: none !important;
  backdrop-filter: none !important;
  --bs-bg-opacity: 1;
  background-color: color-mix(in sRGB, var(--bs-base-color) 6%, var(--bs-paper-bg)) !important;
  font-size: 0.9375rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: normal;
  color: var(--bs-heading-color);
}

.invoice-summary-row {
  cursor: default;
  position: sticky;
  bottom: 0;
  z-index: 10;
  background-color: var(--bs-body-bg);
  box-shadow: 0 -1px 0 var(--bs-border-color);
}

.table-hover tbody tr.invoice-summary-row:hover>* {
  --bs-table-bg-state: transparent !important;
  --bs-bg-opacity: 1;
  background-color: color-mix(in sRGB, var(--bs-base-color) 6%, var(--bs-paper-bg)) !important;
}

.invoice-ksef-qr-wrapper {
  display: inline-block;
  padding: 8px;
  /* QR frame aligned with card styling; revert this block to restore the old primary 4px border. */
  border: 1px solid var(--bs-border-color);
  border-radius: 14px;
  background-color: var(--bs-body-bg);
}

.invoice-ksef-qr-wrapper img {
  display: block;
  width: 177px;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

img.soda-style-qr,
img.soda-style-qr-ready {
  display: block;
  filter: none !important;
  image-rendering: pixelated;
}

.attachment-row {
  cursor: pointer;
}

tr.attachment-row {
  cursor: default;
}

.header-status-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 28px;
}

.header-status-wrapper .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.header-status-wrapper.badge-anim-out {
  animation: badgeSlideOut 0.18s ease-in forwards;
}

.header-status-wrapper.badge-anim-in {
  animation: badgeSlideIn 0.22s ease-out forwards;
}

@keyframes badgeSlideOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(6px);
  }
}

@keyframes badgeSlideIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.avatar-mask {
  width: 300px;
  height: 300px;
  margin: 0 auto;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  background: rgba(0, 0, 0, 0.25);
  user-select: none;
  touch-action: none;
}

.avatar-mask img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center;
  cursor: grab;
  will-change: transform;
}

.avatar-mask img:active {
  cursor: grabbing;
}

.avatar-svg-mode {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  object-fit: contain;
}

.import-dropzone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  border: 2px dashed rgba(0, 0, 0, 0.35);
  border-radius: 18px;
  cursor: pointer;
  transition: border-color 0.2s ease;
}

.import-dropzone:hover,
.import-dropzone.is-dragover {
  border-color: var(--bs-success);
}

.import-dropzone.is-dragover .import-dropzone-inner {
  transform: scale(1.03);
}

.import-dropzone.is-valid {
  border-color: #29c66f;
}

.import-dropzone.is-valid .import-dropzone-inner {
  background-color: #29c66f;
}

.import-dropzone.is-locked {
  pointer-events: none;
  cursor: not-allowed;
}

[data-bs-theme="dark"] .import-dropzone {
  border-color: rgba(255, 255, 255, 0.35);
}

.import-dropzone-inner {
  width: 150px;
  height: 150px;
  border-radius: 12px;
  background-color: rgba(41, 198, 111, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.big-icon {
  font-size: 120px;
  line-height: 1;
  color: #fff;
}

.modal-main-icon {
  width: 150px;
  height: 150px;
  border-radius: 12px;
  background-color: #29c66f;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.soda-ai-alert {
  position: relative;
}

.soda-ai-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 1.5rem;
}

.soda-ai-text {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 1.5rem;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(-10px);
  transition: opacity 0.35s ease, transform 0.35s ease;
}

.soda-ai-copy {
  display: inline;
}

.soda-ai-text.show {
  opacity: 1;
  transform: translateX(0);
}

.soda-ai-text .ti {
  font-size: 1em;
  line-height: 1;
  opacity: 0.9;
}

.soda-ai-alert-wrap .soda-ai-wrapper,
.soda-ai-alert-wrap .soda-ai-text {
  align-items: flex-start;
}

.soda-ai-alert-wrap .soda-ai-text {
  white-space: normal;
}

.soda-ai-label {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 1.5rem;
  line-height: 1.5rem;
  overflow: visible !important;
}

.soda-ai-label.ai-active .soda-ai-base {
  opacity: 0;
}

.soda-ai-base {
  position: relative;
  z-index: 1;
  transition: opacity 0.25s ease;
}

.soda-ai-animated {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(-10px);
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease, transform 0.35s ease;
  z-index: 2;
}

.soda-ai-animated.show {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.soda-ai-animated .ti {
  font-size: 1em;
  line-height: 1;
  opacity: 0.9;
}

.xml-editor-wrapper {
  height: calc(100vh - 260px);
  max-height: 60vh;
  overflow: hidden;
}

.xml-editor-wrapper .CodeMirror {
  height: 100%;
  width: 100%;
  border-radius: 8px;
  border: 1px solid var(--bs-border-color);
}

.CodeMirror {
  font-size: 13px;
  line-height: 1.55;
}

.CodeMirror.cm-readonly .CodeMirror-cursor {
  display: none;
}

.CodeMirror-linenumber {
  padding: 0 6px 0 4px;
  font-size: 13px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.cm-s-eclipse.cm-readonly {
  background-color: #f4f5f7 !important;
  opacity: 0.65;
  filter: grayscale(0.35);
}

.cm-s-eclipse:not(.cm-readonly) {
  background-color: #fff !important;
  opacity: 1;
  filter: none;
}

.cm-s-eclipse .CodeMirror-gutters {
  border-right: 1px solid rgba(0, 0, 0, 0.08);
}

.cm-s-eclipse:not(.cm-readonly) .CodeMirror-gutters {
  background-color: #f1f2f4;
}

.cm-s-eclipse:not(.cm-readonly) .CodeMirror-linenumber {
  color: #8a8d93;
}

.cm-s-eclipse:not(.cm-readonly) .CodeMirror-activeline-gutter {
  background-color: rgba(0, 0, 0, 0.04);
}

.cm-s-eclipse:not(.cm-readonly) .CodeMirror-activeline-gutter .CodeMirror-linenumber {
  color: #2b2e34;
  font-weight: 500;
}

.cm-s-eclipse.cm-readonly .CodeMirror-gutters {
  background-color: #e9eaed;
}

.cm-s-eclipse.cm-readonly .CodeMirror-linenumber {
  color: #9aa0a6;
  opacity: 0.7;
}

.cm-s-eclipse.cm-readonly .CodeMirror-activeline-gutter {
  background-color: rgba(0, 0, 0, 0.02);
}

.cm-s-monokai.cm-readonly {
  background-color: #2a2f36 !important;
  opacity: 0.9;
}

.cm-s-monokai:not(.cm-readonly) {
  background-color: #1f2328 !important;
  opacity: 1;
  filter: none;
}

.cm-s-monokai .CodeMirror-gutters {
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.cm-s-monokai:not(.cm-readonly) .CodeMirror-gutters {
  background-color: #1a1e23;
}

.cm-s-monokai:not(.cm-readonly) .CodeMirror-linenumber {
  color: #8b8f97;
}

.cm-s-monokai:not(.cm-readonly) .CodeMirror-activeline-gutter {
  background-color: rgba(255, 255, 255, 0.045);
}

.cm-s-monokai:not(.cm-readonly) .CodeMirror-activeline-gutter .CodeMirror-linenumber {
  color: #cfd3dc;
  font-weight: 500;
}

.cm-s-monokai.cm-readonly .CodeMirror-gutters {
  background-color: #22272e;
}

.cm-s-monokai.cm-readonly .CodeMirror-linenumber {
  color: #7a8089;
  opacity: 0.75;
}

.cm-s-monokai.cm-readonly .CodeMirror-activeline-gutter {
  background-color: rgba(255, 255, 255, 0.025);
}

.clip-copy-flash {
  animation: ccCopyFlash 0.35s ease;
}

@keyframes ccCopyFlash {
  0% {
    box-shadow: inset 0 0 0 0 rgba(40, 199, 111, 0);
  }

  40% {
    box-shadow: inset 0 0 0 9999px rgba(40, 199, 111, 0.12);
  }

  100% {
    box-shadow: inset 0 0 0 0 rgba(40, 199, 111, 0);
  }
}

.copy-clip-text,
.copy-clip-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.copy-clip-text .copy-icon,
.copy-clip-label .copy-icon {
  font-size: 16px;
  opacity: 0.45;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.copy-clip-text:hover .copy-icon,
.copy-clip-label:hover .copy-icon {
  opacity: 0.85;
  transform: scale(1.05);
}

.copy-clip-text.copied,
.copy-clip-label.copied,
input.copied,
textarea.copied,
select.copied {
  animation: copyFlash 0.35s ease;
}

[data-bs-theme="dark"] .copy-clip-text .copy-icon,
[data-bs-theme="dark"] .copy-clip-label .copy-icon {
  opacity: 0.55;
}

[data-bs-theme="dark"] .copy-clip-text:hover .copy-icon,
[data-bs-theme="dark"] .copy-clip-label:hover .copy-icon {
  opacity: 0.9;
}

@keyframes copyFlash {
  0% {
    background-color: transparent;
  }

  40% {
    background-color: rgba(40, 199, 111, 0.15);
  }

  100% {
    background-color: transparent;
  }
}

.log-wrapper {
  padding: 0 24px;
}

.log-container {
  max-height: 65vh;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 8px;
  background: rgb(2, 0, 22);
  scrollbar-gutter: stable;
}

.ksef-log-state .no-data-container {
  width: 100%;
  padding: 3rem 1.5rem;
}

.ksef-log-list {
  display: grid;
  font-family: "Courier New", Courier, monospace;
  font-size: 14px;
  line-height: 1.35;
  text-align: left;
  color: #86fb55;
  padding: 8px 14px;
}

.ksef-log-entry {
  min-width: 0;
  padding: 5px 2px 6px;
  border-bottom: 1px solid rgba(134, 251, 85, 0.14);
}

.ksef-log-entry:last-child {
  border-bottom: 0;
}

.ksef-log-entry__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  white-space: nowrap;
}

.ksef-log-entry__timestamp,
.ksef-log-entry__status,
.ksef-log-entry__tag {
  display: inline-flex;
  align-items: center;
  font-size: inherit;
  font-weight: 600;
}

.ksef-log-entry__timestamp {
  color: rgba(134, 251, 85, 0.82);
}

.ksef-log-entry__status {
  color: #86fb55;
}

.ksef-log-entry__tag {
  color: rgba(134, 251, 85, 0.7);
}

.ksef-log-entry__message {
  min-width: 0;
  margin-top: 1px;
  padding-left: 0;
  font-size: 13px;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
}

.ksef-log-entry__company {
  display: inline-block;
  max-width: 32ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

.navbar-live-datetime {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  min-width: 220px;
  line-height: 1.1;
}

.navbar-live-date {
  font-size: 0.8rem;
  color: var(--bs-secondary-color, #a8acc4);
  font-weight: 500;
  margin-bottom: 0.2rem;
  white-space: nowrap;
}

.navbar-live-time {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--bs-heading-color, #fff);
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.navbar-user-meta {
  max-width: 220px;
  line-height: 1.15;
}

.navbar-user-name {
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.navbar-user-dep {
  display: block;
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Top navbar: spójne wyrównanie czasu, dzwonka i danych użytkownika */
#layout-navbar .navbar-user-box {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  --navbar-user-circle-size: 2.375rem;
}

#layout-navbar .navbar-user-box>.navbar-live-datetime {
  margin-right: 0 !important;
  min-height: 3.5rem;
  position: relative;
  top: 2px;
}

#layout-navbar .navbar-user-box>.navbar-nav {
  margin-left: 0 !important;
  align-items: center;
  gap: 0.75rem;
}

#layout-menu .menu-company-switcher-slot {
  flex: 0 0 auto;
  padding: 0.35rem 0.75rem 0.75rem;
}

#layout-menu .menu-company-switcher {
  position: relative;
  width: 100%;
}

#layout-menu .menu-company-switcher-trigger,
#layout-menu .menu-company-static {
  width: 100%;
  min-height: 2.75rem;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--bs-border-color, #dbdade);
  border-radius: var(--bs-border-radius, 0.375rem);
  color: var(--bs-heading-color, inherit);
  background: transparent;
}

#layout-menu .menu-company-switcher-trigger:hover,
#layout-menu .menu-company-switcher-trigger:focus {
  background: var(--bs-tertiary-bg, rgba(47, 43, 61, 0.04));
  color: var(--bs-heading-color, inherit);
}

#layout-menu .menu-company-name {
  min-width: 0;
  flex: 1 1 auto;
  font-weight: 600;
  text-align: left;
}

#layout-menu .menu-company-switcher .dropdown-menu {
  width: 100%;
  min-width: 100%;
}

#layout-menu .menu-company-switcher .dropdown-item.active {
  color: var(--bs-primary);
  background: var(--bs-primary-bg-subtle, rgba(115, 103, 240, 0.12));
}

/* Przy otwartym wyborze podmiotu przyciemniamy wyłącznie menu boczne. */
#layout-menu::after {
  position: absolute;
  z-index: 1;
  background: rgba(23, 25, 37, 0.58);
  content: "";
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease, visibility 0s linear 0.15s;
  visibility: hidden;
}

body.soda-company-switcher-open #layout-menu::after {
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0s;
  visibility: visible;
}

body.soda-company-switcher-open #layout-menu .menu-inner-shadow {
  z-index: 0;
}

body.soda-company-switcher-open #layout-menu .menu-company-switcher-slot {
  position: relative;
  z-index: 2;
}

body.soda-company-switcher-open #layout-menu .menu-company-switcher-trigger,
body.soda-company-switcher-open #layout-menu .menu-company-switcher .dropdown-menu {
  background: var(--bs-paper-bg, var(--bs-body-bg));
  box-shadow: 0 0.75rem 2rem rgba(23, 25, 37, 0.28);
}

@media (max-width: 767.98px) {
  #layout-navbar .navbar-live-datetime {
    display: none;
  }
}

@media (min-width: 1200px) {

  .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) #layout-menu .menu-company-switcher-trigger,
  .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) #layout-menu .menu-company-static {
    width: 2.75rem;
    padding: 0.5rem;
    justify-content: center;
  }

  .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) #layout-menu .menu-company-name,
  .layout-menu-collapsed:not(.layout-menu-hover):not(.layout-menu-expanded) #layout-menu .menu-company-switcher-trigger::after {
    display: none;
  }
}

#layout-navbar .navbar-user-box .dropdown-notifications {
  margin-right: 0 !important;
}

#layout-navbar .navbar-user-box .dropdown-notifications .nav-link {
  width: var(--navbar-user-circle-size);
  height: var(--navbar-user-circle-size);
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#layout-navbar .navbar-user-box .dropdown-notifications .nav-link.disabled {
  opacity: 0.45;
  pointer-events: none;
  cursor: default;
}

#layout-navbar .navbar-user-box .dropdown-notifications .nav-link.has-unread-notices .tabler-bell {
  transform-origin: 50% 12%;
  animation: soda-navbar-bell-ring 2.8s ease-in-out infinite;
  will-change: transform;
}

@keyframes soda-navbar-bell-ring {

  0%,
  68%,
  100% {
    transform: rotate(0deg) scale(1);
  }

  4% {
    transform: rotate(0deg) scale(1.16);
  }

  9% {
    transform: rotate(-14deg) scale(1.14);
  }

  14% {
    transform: rotate(12deg) scale(1.14);
  }

  19% {
    transform: rotate(-8deg) scale(1.1);
  }

  24% {
    transform: rotate(6deg) scale(1.06);
  }

  31% {
    transform: rotate(0deg) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  #layout-navbar .navbar-user-box .dropdown-notifications .nav-link.has-unread-notices .tabler-bell {
    animation: none;
  }
}

#layout-navbar .navbar-user-box .dropdown-user .nav-link {
  padding-left: 0 !important;
}

#layout-navbar .navbar-user-box .dropdown-user .avatar {
  position: relative;
  top: 2px;
}

#layout-navbar .navbar-user-box .dropdown-user .dropdown-menu {
  margin-top: -1.65rem !important;
}

#layout-navbar .navbar-user-box .dropdown-notifications .dropdown-menu {
  margin-top: -0.55rem !important;
}

#layout-navbar .navbar-user-box .navbar-user-meta {
  margin-right: 0.5rem !important;
  min-height: 3.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  top: 2px;
}

.dashboard-reveal {
  opacity: 0;
  transform: translateY(14px);
  filter: blur(4px);
  transition: opacity 0.55s ease, transform 0.55s ease, filter 0.55s ease;
}

.dashboard-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.dashboard-hidden {
  opacity: 0 !important;
  transform: translateY(10px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

#div_widget_assigned_to_me .icon-48px,
#div_widget_assigned_to_me .icon-48px::before {
  block-size: 40px !important;
  font-size: 40px !important;
  inline-size: 40px !important;
}

.dashboard-performed-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(1.25rem, 2.2vw, 3rem);
  width: 100%;
}

.dashboard-performed-item {
  min-width: 0;
}

.dashboard-performed-progress {
  width: 100% !important;
}

@media (max-width: 575.98px) {
  .dashboard-performed-grid {
    grid-template-columns: 1fr;
    row-gap: 1.5rem;
  }

  .dashboard-performed-progress {
    width: 75% !important;
  }
}

.sortable-drag {
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
  z-index: 999999 !important;
  display: flex !important;
}

.sortable-list-available,
.sortable-list-selected {
  min-height: 200px;
  padding-bottom: 50px;
  transition: background-color 0.2s ease;
}

.sortable-list-available .sortable-drag {
  background-color: var(--bs-success) !important;
}

.sortable-list-selected .sortable-drag {
  background-color: var(--bs-danger) !important;
}

.sortable-list-selected.has-default-item li:first-child .d-flex {
  flex-wrap: nowrap !important;
}

.sortable-list-selected.has-default-item li:first-child span span::after {
  content: " (domyślnie)";
  font-size: 0.75rem;
  color: var(--bs-secondary-color) !important;
  font-weight: normal;
  margin-left: 5px;
}

.sortable-list-selected li.no-access span span::after {
  content: " (nie masz uprawnień)";
  font-size: 0.75rem;
  color: var(--bs-secondary-color) !important;
  font-weight: normal;
  margin-left: 5px;
}

.notif-group-table tbody tr.notif-no-access {
  opacity: 0.72;
}

.notif-group-table tbody tr td:first-child {
  padding-left: 1.75rem;
}

.notif-group-table thead th:first-child {
  padding-left: 1.75rem;
}

.notif-group-table thead th {
  padding-bottom: 1rem !important;
}

.notif-group-table tbody tr:last-child td {
  border-bottom: none !important;
}

.notif-group-table tr.notif-no-access .form-check-input:disabled {
  opacity: 0.65 !important;
}

.notif-group-table tr.notif-no-access .form-check-input:disabled:checked {
  background-color: var(--bs-secondary-color) !important;
  border-color: var(--bs-secondary-color) !important;
}

.effect-flash-green {
  animation: flash-green 0.35s ease-out;
}

.effect-flash-red {
  animation: flash-red 0.35s ease-out;
}

@keyframes flash-green {
  0% {
    background-color: var(--bs-success);
  }

  100% {
    background-color: transparent;
  }
}

@keyframes flash-red {
  0% {
    background-color: var(--bs-danger);
  }

  100% {
    background-color: transparent;
  }
}

.list-group-item {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}

.list-group-item.category-item {
  font-weight: 600 !important;
}

.btn span.d-none.d-sm-inline-block,
.dropdown-toggle span.d-none.d-sm-inline-block {
  display: inline-block !important;
}

.soda-page-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 1rem 1rem;
}

.soda-page-header__title-wrap {
  flex: 1 1 auto;
  min-width: 0;
}

.soda-page-header__title {
  margin: 0;
  color: var(--bs-heading-color);
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 2rem;
}

.soda-page-header__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  flex: 0 0 auto;
}

.soda-page-header__filters {
  flex: 0 0 100%;
  width: 100%;
  margin-top: 0.75rem;
}

@media (max-width: 576px) {
  .auth-right {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}

@media (max-width: 768px) {
  .soda-page-header {
    align-items: stretch;
  }

  .soda-page-header__actions {
    width: 100%;
  }

  .soda-header-actions {
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 10px !important;
  }

  .soda-header-actions>*,
  .soda-header-actions .btn,
  .soda-header-actions .btn-group,
  .soda-header-actions .dropdown {
    width: 100% !important;
    display: block !important;
  }

  .soda-header-actions .btn-group .btn {
    width: 100% !important;
  }

  div.dataTables_wrapper div.dataTables_length,
  div.dataTables_wrapper div.dataTables_filter {
    text-align: center !important;
    margin-bottom: 1rem !important;
    width: 100% !important;
  }

  div.dataTables_wrapper div.dataTables_filter input {
    width: 100% !important;
    margin-left: 0 !important;
  }

  .dataTables_wrapper .row>div {
    width: 100% !important;
    display: block !important;
    margin-bottom: 10px;
  }
}

/* ==========================================================================
   SODA — okrągłe avatary / logotypy z ramką zależną od stylu
   ========================================================================== */

/*
 * Wspólna baza.
 * Box-shadow zamiast border, żeby nie zmieniać wymiaru obrazka.
 */
#img_profile_avatar,
#img_comp_avatar,
img[id^="img_profile_avatar"],
img[id^="img_comp_avatar"],
.customer-avatar-section img.rounded-circle,
.company-avatar-section img.rounded-circle,
img.soda-avatar,
img.soda-company-logo {
  border-radius: 50% !important;
  box-shadow:
    0 0 0 2px var(--soda-avatar-ring-color, var(--bs-primary)) !important;
}

/*
 * Opcjonalnie delikatne tło pod przezroczystymi PNG/SVG.
 */
#img_profile_avatar,
#img_profile_avatar_crop,
#img_comp_avatar,
img[id^="img_profile_avatar"],
img[id^="img_comp_avatar"],
.customer-avatar-section img.rounded-circle,
.company-avatar-section img.rounded-circle,
.avatar-mask img,
img.soda-avatar,
img.soda-company-logo {
  background-color: var(--soda-avatar-bg, transparent) !important;
}

/* SODA domyślna — aktualny kolor primary z customizera */
html:not(.soda-style-amber):not(.soda-style-neon-blue) {
  --soda-avatar-ring-color: var(--bs-primary);
  --soda-avatar-bg: transparent;
}

/*
 * SODA — avatar/cropper wrapper.
 * Wspólna ramka dla edytora/croppera avatara.
 */
.avatar-mask {
  position: relative !important;
  background-color: var(--soda-avatar-bg, transparent) !important;
  border-radius: 50% !important;
  overflow: hidden !important;

  /* bez box-shadow tutaj, bo obrazek może go przykrywać */
  box-shadow: none !important;
}

/*
 * Obręcz nad obrazkiem.
 */
.avatar-mask::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  pointer-events: none !important;

  border-radius: 50% !important;

  box-shadow:
    inset 0 0 0 3px var(--soda-avatar-ring-color, var(--bs-primary)) !important;
}

#modal_profile_avatar_crop #img_profile_avatar_crop,
#modal_comp_avatar_crop #img_comp_avatar_crop,
#modal_profile_avatar_crop .avatar-mask img,
#modal_comp_avatar_crop .avatar-mask img {
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

/* ==========================================================================
   SODA — custom-option / Vuexy customizer: jedna ramka globalnie
   ========================================================================== */

html {
  --soda-custom-option-border: var(--bs-border-color);
  --soda-custom-option-border-hover: var(--bs-primary);
  --soda-custom-option-border-active: var(--bs-primary);
}

/*
 * Łapiemy wszystkie custom-option w preferencjach i customizerze,
 * również układ/menu/navbar/content, nie tylko kolor i motyw.
 */
#div_pref_style_customizer .custom-option,
#div_pref_color_customizer .custom-option,
[id^="div_pref_"] .template-customizer .custom-option,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option,
.template-customizer .custom-option,
#template-customizer .custom-option {
  border: 2px solid var(--soda-custom-option-border) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/*
 * Wewnętrzny content nie może rysować drugiej ramki.
 */
#div_pref_style_customizer .custom-option .custom-option-content,
#div_pref_color_customizer .custom-option .custom-option-content,
[id^="div_pref_"] .template-customizer .custom-option .custom-option-content,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option .custom-option-content,
.template-customizer .custom-option .custom-option-content,
#template-customizer .custom-option .custom-option-content {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/*
 * Hover — jedna ramka na zewnętrznym .custom-option.
 */
#div_pref_style_customizer .custom-option:hover,
#div_pref_color_customizer .custom-option:hover,
[id^="div_pref_"] .template-customizer .custom-option:hover,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option:hover,
.template-customizer .custom-option:hover,
#template-customizer .custom-option:hover {
  border-color: var(--soda-custom-option-border-hover) !important;
  box-shadow: none !important;
}

/*
 * Checked / active — jedna ramka na zewnętrznym .custom-option.
 */
#div_pref_style_customizer .custom-option.checked,
#div_pref_style_customizer .custom-option:has(input:checked),
#div_pref_color_customizer .custom-option.checked,
#div_pref_color_customizer .custom-option:has(input:checked),
[id^="div_pref_"] .template-customizer .custom-option.checked,
[id^="div_pref_"] .template-customizer .custom-option:has(input:checked),
[id^="div_pref_"] [class*="template-customizer-"] .custom-option.checked,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option:has(input:checked),
.template-customizer .custom-option.checked,
.template-customizer .custom-option:has(input:checked),
#template-customizer .custom-option.checked,
#template-customizer .custom-option:has(input:checked) {
  border-color: var(--soda-custom-option-border-active) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/*
 * Vuexy czasem aktywuje .custom-option-content — gasimy też w active.
 */
#div_pref_style_customizer .custom-option.checked .custom-option-content,
#div_pref_style_customizer .custom-option:has(input:checked) .custom-option-content,
#div_pref_color_customizer .custom-option.checked .custom-option-content,
#div_pref_color_customizer .custom-option:has(input:checked) .custom-option-content,
[id^="div_pref_"] .template-customizer .custom-option.checked .custom-option-content,
[id^="div_pref_"] .template-customizer .custom-option:has(input:checked) .custom-option-content,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option.checked .custom-option-content,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option:has(input:checked) .custom-option-content,
.template-customizer .custom-option.checked .custom-option-content,
.template-customizer .custom-option:has(input:checked) .custom-option-content,
#template-customizer .custom-option.checked .custom-option-content,
#template-customizer .custom-option:has(input:checked) .custom-option-content {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* ==========================================================================
   SODA — customizer/custom-option: globalna grubość ramek
   ========================================================================== */

:root {
  --soda-custom-option-border-width: 2px;
}

/*
 * Amber i Neon Blue mają cieńszą, terminalową ramkę.
 */
html.soda-style-amber,
html.soda-style-neon-blue {
  --soda-custom-option-border-width: 1px;
}

/*
 * Łapiemy wszystkie custom-option w preferencjach i customizerze,
 * również układ/menu/navbar/content, nie tylko kolor i motyw.
 */
#div_pref_style_customizer .custom-option,
#div_pref_color_customizer .custom-option,
[id^="div_pref_"] .template-customizer .custom-option,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option,
.template-customizer .custom-option,
#template-customizer .custom-option {
  border: var(--soda-custom-option-border-width) solid var(--soda-custom-option-border) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* ==========================================================================
   SODA — accordion: otwarty nagłówek bez dolnych zaokrągleń
   ========================================================================== */

.accordion .accordion-button:not(.collapsed) {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.accordion .accordion-button.collapsed {
  border-bottom-left-radius: var(--bs-accordion-border-radius, var(--bs-border-radius)) !important;
  border-bottom-right-radius: var(--bs-accordion-border-radius, var(--bs-border-radius)) !important;
}

/* ==========================================================================
   SODA — Vuexy customizer: ukrycie przycisku resetu
   ========================================================================== */

#template-customizer .template-customizer-reset-btn,
.template-customizer .template-customizer-reset-btn {
  display: none !important;
}

/* ==========================================================================
   SODA — Vuexy customizer: podpisy opcji niżej
   ========================================================================== */

.template-customizer-layout .custom-option+.form-check-label,
.template-customizer-layouts .custom-option+.form-check-label,
.template-customizer-layoutNavbarOptions .custom-option+.form-check-label,
.template-customizer-content .custom-option+.form-check-label,
.template-customizer-theme .custom-option+.form-check-label,
.template-customizer-skins .custom-option+.form-check-label,
#template-customizer .custom-option+.form-check-label,
[id^="div_pref_"] [class*="template-customizer-"] .custom-option+.form-check-label {
  display: block !important;
  margin-top: 0.5rem !important;
}

/* ==========================================================================
   SODA — Ikony pulpitu
   ========================================================================== */
.soda-icon {
  display: inline-block;
  width: 1em;
  height: 1em;

  background-color: currentColor;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-size: contain;
  mask-size: contain;
}

.soda-icon-file-stack {
  -webkit-mask-image: url("../img/ico/file-stack.svg");
  mask-image: url("../img/ico/file-stack.svg");
}

.soda-icon-invoice {
  -webkit-mask-image: url("../img/ico/invoice.svg");
  mask-image: url("../img/ico/invoice.svg");
}

.soda-icon-checklist {
  -webkit-mask-image: url("../img/ico/checklist.svg");
  mask-image: url("../img/ico/checklist.svg");
}

.soda-icon-calendar-week {
  -webkit-mask-image: url("../img/ico/calendar-week.svg");
  mask-image: url("../img/ico/calendar-week.svg");
}

.invoice-pending-action-btn {
  min-width: 250px;
}

.invoice-pin-modal-dialog {
  --invoice-pin-digit-size: 3.25rem;
  --invoice-pin-gap: 0.75rem;
  --invoice-pin-row-width: calc((8 * var(--invoice-pin-digit-size)) + (7 * var(--invoice-pin-gap)));
  max-width: calc(var(--invoice-pin-row-width) + 3rem);
}

.invoice-pin-modal-content {
  overflow: hidden;
}

body.purchase-request-pin-modal-open #div_purchase_request_pin_modal {
  z-index: 20060 !important;
}

body.vacation-request-pin-modal-open #div_vacation_request_pin_modal {
  z-index: 20060 !important;
}

body.invoice-warehouse-docs-modal-open #div_invoice_warehouse_docs_modal {
  z-index: 20060 !important;
}

body.invoice-warehouse-docs-confirm-open #div_modal_info {
  z-index: 20080 !important;
}

body.purchase-request-pin-modal-open .modal-backdrop {
  z-index: 20050 !important;
}

body.vacation-request-pin-modal-open .modal-backdrop {
  z-index: 20050 !important;
}

body.invoice-warehouse-docs-modal-open .modal-backdrop {
  z-index: 20050 !important;
}

body.invoice-warehouse-docs-confirm-open .modal-backdrop {
  z-index: 20070 !important;
}

.invoice-pin-inputs {
  width: fit-content;
  max-width: 100%;
  gap: var(--invoice-pin-gap);
  justify-content: flex-start !important;
}

.invoice-pin-modal-footer {
  margin: 0;
  padding: 0 1.5rem 1.5rem;
  border-top: 0;
  justify-content: flex-start;
}

.invoice-pin-modal-footer>* {
  margin: 0 !important;
}

.invoice-pin-modal-actions {
  width: var(--invoice-pin-row-width);
  max-width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
}

.invoice-pin-inputs .invoice-pin-digit,
.invoice-pin-inputs .purchase-request-pin-digit,
.invoice-pin-inputs .vacation-request-pin-digit {
  width: var(--invoice-pin-digit-size);
  min-width: var(--invoice-pin-digit-size);
  max-width: var(--invoice-pin-digit-size);
  flex: 0 0 var(--invoice-pin-digit-size);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--bs-heading-color);
  -webkit-text-fill-color: var(--bs-heading-color);
  caret-color: var(--bs-primary);
  background-color: var(--bs-body-bg);
  line-height: 1;
}

@media (max-width: 575.98px) {
  .invoice-modal-layout {
    --invoice-modal-panel-min-height: 0px;
    flex-direction: column;
    min-height: 0;
  }

  .invoice-document-modal .invoice-modal-layout {
    --invoice-modal-panel-min-height: 0px;
  }

  .invoice-modal-sidebar {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin-right: 0 !important;
    margin-bottom: 1rem;
  }

  .invoice-document-modal .invoice-modal-sidebar {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
  }

  .invoice-document-modal .invoice-modal-sidebar__nav {
    width: 100%;
  }

  .invoice-modal-layout>.tab-content,
  .invoice-modal-layout>.tab-content>.tab-pane>.card,
  #div_invoice_preview_content>.card {
    min-height: 0;
  }

  .invoice-modal-fill-card {
    height: auto;
    min-height: 0;
  }

  .invoice-visualization-viewer {
    padding: 0;
  }

  .invoice-visualization-window {
    width: calc(100vw - 1rem);
    height: calc(100vh - 1rem);
    min-width: 0;
    min-height: 0;
    max-width: calc(100vw - 1rem);
    max-height: calc(100vh - 1rem);
  }

  .invoice-visualization-window__header {
    flex-direction: column;
    align-items: stretch;
  }

  .invoice-visualization-window__actions {
    justify-content: flex-end;
  }

  .invoice-pin-modal-dialog {
    --invoice-pin-digit-size: 2.35rem;
    max-width: calc(100vw - 2rem);
  }

  .invoice-pin-modal-footer {
    margin: 0;
    padding: 0 1.5rem 1.5rem;
  }

  .invoice-pin-modal-actions {
    width: auto;
  }

  .invoice-pin-inputs .invoice-pin-digit,
  .invoice-pin-inputs .purchase-request-pin-digit,
  .invoice-pin-inputs .vacation-request-pin-digit {
    padding-left: 0;
    padding-right: 0;
  }
}

.badge-flow-next-assigned {
  color: color-mix(in srgb, var(--bs-warning) 42%, var(--bs-heading-color) 58%) !important;
  border: var(--bs-border-width) solid color-mix(in srgb, var(--bs-warning) 34%, var(--bs-heading-color) 66%) !important;
  background-color: rgba(var(--bs-warning-rgb), 0.08) !important;
}

.badge-flow-next-settled {
  color: color-mix(in srgb, var(--bs-info) 50%, var(--bs-heading-color) 50%) !important;
  border: var(--bs-border-width) solid color-mix(in srgb, var(--bs-info) 36%, var(--bs-heading-color) 64%) !important;
  background-color: rgba(var(--bs-info-rgb), 0.08) !important;
}

.badge-flow-next-accepted {
  color: color-mix(in srgb, var(--bs-success) 44%, var(--bs-heading-color) 56%) !important;
  border: var(--bs-border-width) solid color-mix(in srgb, var(--bs-success) 34%, var(--bs-heading-color) 66%) !important;
  background-color: rgba(var(--bs-success-rgb), 0.08) !important;
}

.badge-flow-next-posted {
  color: color-mix(in srgb, var(--bs-dark) 72%, var(--bs-heading-color) 28%) !important;
  border: var(--bs-border-width) solid color-mix(in srgb, var(--bs-dark) 55%, var(--bs-body-color) 45%) !important;
  background-color: rgba(var(--bs-dark-rgb), 0.05) !important;
}


/* App Calendar
******************************************************************************* */
.app-calendar-wrapper {
  --soda-app-sidebar-width: min(290px, 18.125rem);
}

.app-mail-wrapper {
  --soda-app-sidebar-width: min(290px, 18.125rem);
}

html[data-soda-root-font-step="-2"] .app-calendar-wrapper,
html[data-soda-root-font-step="-2"] .app-mail-wrapper {
  --soda-app-sidebar-width: min(290px, 17.5rem);
}

.app-calendar-wrapper {
  position: relative;
}

.app-calendar-wrapper .app-calendar-sidebar {
  position: absolute;
  z-index: 4;
  overflow: hidden;
  flex-basis: var(--soda-app-sidebar-width);
  flex-grow: 0;
  background-color: var(--bs-paper-bg);
  block-size: 100%;
  inline-size: var(--soda-app-sidebar-width);
  inset-inline-start: calc(var(--soda-app-sidebar-width) * -1 - 1.2rem);
  transition: all 0.2s;
}

.app-calendar-wrapper .app-calendar-sidebar.show {
  inset-inline-start: 0;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar {
  border: 0;
  box-shadow: none;
}

.app-calendar-wrapper .app-calendar-sidebar .inline-calendar,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar.inline {
  inset-block-start: 0;
  margin-block-start: 0;
  padding: 0;
  position: relative;
  z-index: 2;
  pointer-events: auto;
}

.app-calendar-wrapper .app-calendar-sidebar .inline-calendar {
  display: block;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar.inline {
  inline-size: 100%;
  margin-inline: 0;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-innerContainer {
  margin-inline: auto;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-innerContainer .flatpickr-rContainer {
  inline-size: auto;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-month,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-weekday,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-weekdays {
  background: transparent;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-months {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  inline-size: 16rem;
  margin-bottom: 0.5rem;
  /* margin-inline: auto; */
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-month {
  align-items: center;
  block-size: auto;
  display: flex;
  flex: 1 1 auto;
  order: 1;
  overflow: visible;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-current-month {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-start;
  inline-size: auto;
  inset-inline-start: auto;
  padding: 0;
  position: static;
  text-align: start;
  transform: none;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-prev-month,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-next-month {
  inset: auto;
  margin: 0;
  position: static;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-prev-month {
  order: 2;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-next-month {
  order: 3;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-current-month .cur-month,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-current-month .numInput.cur-year {
  color: var(--bs-heading-color);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-weekdays {
  inline-size: 16rem;
  margin-inline: auto;
  margin-block-start: 0;
  max-inline-size: 16rem;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-weekdays .flatpickr-weekdaycontainer {
  justify-content: space-around;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-days {
  border: 0;
  margin-inline: auto;
  justify-content: center;
  inline-size: 16rem;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-days .dayContainer {
  inline-size: 16rem;
  justify-content: space-around;
  margin-inline: auto;
  max-inline-size: 16rem;
  min-inline-size: 16rem;
  row-gap: 0.3125rem;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-days .flatpickr-day,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-weekwrapper span.flatpickr-day {
  block-size: 2.25rem;
  line-height: 2.25rem;
  max-inline-size: 2.25rem;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-days .flatpickr-day.today,
.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar .flatpickr-days .flatpickr-day.selected {
  box-shadow: none;
}

.app-calendar-wrapper .app-calendar-sidebar .flatpickr-calendar:focus {
  outline: 0;
}

.app-calendar-wrapper .app-calendar-content {
  position: relative;
}

.app-calendar-wrapper .app-calendar-sidebar-calendar-section {
  border-bottom: 1px solid var(--bs-border-color);
}

.app-calendar-wrapper .app-calendar-sidebar-calendar-section,
.app-calendar-wrapper .app-calendar-sidebar-filter-section {
  padding-inline-end: 0.375rem !important;
  padding-inline-start: 1rem !important;
}

#div_app_calendar_sidebar,
#div_app_mail_sidebar {
  flex: 0 0 var(--soda-app-sidebar-width) !important;
  width: var(--soda-app-sidebar-width);
  max-width: var(--soda-app-sidebar-width);
  min-width: var(--soda-app-sidebar-width);
}

.app-calendar-wrapper .app-calendar-section-title {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5rem;
  margin-bottom: 0.5rem;
}

.app-calendar-wrapper .app-calendar-sidebar .form-check {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  margin-inline-start: 0;
  padding-inline-start: 0;
}

.app-calendar-wrapper .app-calendar-sidebar .form-check .form-check-input {
  flex: 0 0 auto;
  margin: 0;
  position: static;
}

.app-calendar-wrapper .app-calendar-sidebar .calendar-select-all {
  margin-top: 0.25rem;
}

.app-calendar-wrapper .fc .fc-toolbar-title {
  font-size: 1.125rem !important;
  line-height: 1.5rem !important;
  margin: 0 !important;
  font-weight: 600;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
}

.app-calendar-wrapper .fc .fc-toolbar-title .app-calendar-toolbar-title-main {
  display: block;
  font-size: 1.125rem;
  line-height: 1.5rem;
  font-weight: 600;
  color: var(--bs-heading-color);
}

.app-calendar-wrapper .fc .fc-toolbar-title .app-calendar-toolbar-title-meta {
  display: block;
  color: var(--bs-secondary-color);
  font-size: 0.86rem;
  font-weight: 400;
  line-height: 1.2;
}

@media (max-width: 767.98px) {
  .app-calendar-wrapper .fc .fc-toolbar-title {
    font-size: 0.9375rem !important;
    line-height: 1.25rem !important;
  }

  .app-calendar-wrapper .fc .fc-toolbar-title .app-calendar-toolbar-title-main {
    font-size: 0.9375rem;
    line-height: 1.25rem;
  }

  .app-calendar-wrapper .fc .fc-toolbar-title .app-calendar-toolbar-title-meta {
    font-size: 0.8rem;
  }
}

.app-calendar-wrapper .fc-toolbar-chunk {
  overflow: auto;
}

.app-calendar-wrapper .fc-toolbar-chunk:first-child {
  align-items: flex-start;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.65rem;
  margin-inline-start: 0;
}

.app-calendar-wrapper .fc-toolbar-chunk:first-child .fc-toolbar-title {
  margin-inline-start: 0;
}

.app-calendar-wrapper #div_calendar.app-calendar-month-title-fixed .fc-toolbar-chunk:first-child .fc-toolbar-title {
  flex: 0 0 15ch;
  inline-size: 15ch;
}

.app-calendar-wrapper .fc-toolbar-chunk:last-child {
  gap: 0.75rem;
}

.app-calendar-wrapper .fc .fc-prev-button {
  padding-inline: 0 !important;
}

.app-calendar-wrapper .fc .fc-btn_add_event-button,
.app-calendar-wrapper .fc .fc-btn_refresh_calendar-button {
  border-block-width: 1px !important;
  border-inline-start-width: 1px !important;
  border-inline-end-width: 1px !important;
}

.app-calendar-wrapper .fc .fc-btn_add_event-button {
  align-items: center;
  background-color: var(--bs-primary);
  border: 1px solid var(--bs-primary);
  border-radius: var(--bs-border-radius);
  color: #fff;
  display: inline-flex !important;
  font-size: 0.9375rem;
  font-weight: 500;
  justify-content: center;
  min-block-size: calc(2.25rem + 2px);
  padding-block: 0.375rem;
  padding-inline: 1rem;
  white-space: nowrap;
}

.app-calendar-wrapper .fc .fc-btn_add_event-button:hover,
.app-calendar-wrapper .fc .fc-btn_add_event-button:focus,
.app-calendar-wrapper .fc .fc-btn_add_event-button:active {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}

.app-calendar-wrapper .fc .fc-btn_refresh_calendar-button {
  align-items: center;
  background-color: transparent;
  border: 1px solid var(--bs-primary);
  border-radius: var(--bs-border-radius);
  color: var(--bs-primary);
  display: inline-flex !important;
  font-size: 0.9375rem;
  font-weight: 500;
  justify-content: center;
  min-block-size: calc(2.25rem + 2px);
  padding-block: 0.375rem;
  padding-inline: 1rem;
  white-space: nowrap;
}

.app-calendar-wrapper .fc .fc-btn_refresh_calendar-button:hover,
.app-calendar-wrapper .fc .fc-btn_refresh_calendar-button:focus,
.app-calendar-wrapper .fc .fc-btn_refresh_calendar-button:active {
  background-color: transparent;
  border-color: var(--bs-primary);
  color: var(--bs-primary);
  box-shadow: none;
}

.app-calendar-wrapper table.fc-scrollgrid {
  border-inline-end: 0;
  border-inline-start: 0;
}

.app-calendar-wrapper table.fc-scrollgrid th,
.app-calendar-wrapper table.fc-scrollgrid td {
  border-inline-end: 0;
}

.app-calendar-wrapper .fc-timeGridDay-view table.fc-scrollgrid tbody tr:not(.fc-scrollgrid-section:first-of-type) td,
.app-calendar-wrapper .fc-timeGridWeek-view table.fc-scrollgrid tbody tr:not(.fc-scrollgrid-section:first-of-type) td {
  border-block-end: 0;
}

.app-calendar-wrapper .fc-dayGridMonth-view table.fc-scrollgrid td {
  border-block-end: 0;
}

.app-calendar-wrapper .fc .fc-header-toolbar {
  align-items: center;
  gap: 1rem;
  margin-block: 0 !important;
  min-block-size: 4.15rem;
}

.app-calendar-wrapper .app-calendar-content .card-body {
  padding-top: 0.25rem;
}

.app-calendar-wrapper .fc-view-container {
  margin-block: 0;
  margin-inline: -1.6rem;
}

.app-calendar-wrapper .fc-dayGridMonth-view .fc-daygrid-day-frame {
  aspect-ratio: 1 / 1;
  block-size: auto;
  max-block-size: none;
  min-block-size: 0;
  padding-block: 0.375rem 0.5rem;
}

.app-calendar-wrapper .fc .fc-daygrid-day-top {
  padding-inline: 0.375rem;
}

.app-calendar-wrapper .fc .fc-col-header-cell,
.app-calendar-wrapper .fc .fc-col-header-cell-cushion {
  background-color: var(--bs-paper-bg);
  color: var(--bs-heading-color) !important;
}

.app-calendar-wrapper .fc .fc-daygrid-day-events {
  margin-block: 0.5rem 0;
  min-block-size: 4.875rem;
  padding-inline: 0;
}

.app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event,
.app-calendar-wrapper .fc .fc-daygrid-day-events .fc-more-link {
  margin-inline: 0.25rem;
}

.app-calendar-wrapper .fc .fc-daygrid-event-harness {
  margin-block-end: 0.25rem;
}

.app-calendar-wrapper .fc .fc-daygrid-event-harness+.fc-daygrid-event-harness .fc-daygrid-event {
  margin-block-start: 0;
}

.app-calendar-wrapper .fc .fc-daygrid-more-link {
  margin-block-start: 0.125rem;
  padding-inline: 0;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc-dayGridMonth-view .fc-daygrid-day-frame,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc-dayGridMonth-view .fc-daygrid-day-frame {
  padding-block: 0.25rem 0.375rem;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-day-events,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-day-events {
  margin-block-start: 0.25rem;
  min-block-size: 0;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-event-harness,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-event-harness {
  margin-block-end: 0.125rem;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event {
  align-items: center;
  min-block-size: 1.45rem;
  padding-block: 0.0625rem;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event-main,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event-main,
html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event-title,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-day-events .fc-event-title {
  line-height: 1.12;
}

html[data-soda-root-font-step="-1"] .app-calendar-wrapper .fc .fc-daygrid-more-link,
html[data-soda-root-font-step="-2"] .app-calendar-wrapper .fc .fc-daygrid-more-link {
  font-size: 0.86rem;
  line-height: 1.1;
  margin-block-start: 0;
}

.app-calendar-wrapper .fc .fc-event.fc-event-mirror,
.app-calendar-wrapper .fc .fc-event-mirror,
.app-calendar-wrapper .fc .fc-daygrid-event.fc-event-mirror,
.app-calendar-wrapper .fc .fc-h-event,
.app-calendar-wrapper .fc .fc-h-event.fc-event-mirror,
.app-calendar-wrapper .fc .fc-h-event.fc-event-selected,
.app-calendar-wrapper .fc .fc-event-selected,
.app-calendar-wrapper .fc .fc-event-selected::before,
.app-calendar-wrapper .fc .fc-event:focus,
.app-calendar-wrapper .fc .fc-event:focus-visible {
  --fc-event-border-color: transparent;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
  border-color: transparent !important;
}

.app-calendar-wrapper .fc .fc-event-selected::before {
  display: none !important;
}

.app-calendar-wrapper .event-sidebar .select2 .select2-selection__choice {
  display: inline-flex;
  align-items: center;
}

.soda-select2-choice-preview .select2-selection__choice {
  cursor: pointer;
}

.soda-purchase-request-option {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 991.98px) {
  .app-calendar-wrapper .fc-dayGridMonth-view .fc-daygrid-day-frame {
    aspect-ratio: auto;
    block-size: 7.5rem;
    max-block-size: 7.5rem;
    min-block-size: 7.5rem;
  }
}

@media (min-width: 992px) {
  .app-calendar-wrapper .app-calendar-sidebar {
    position: static;
    background-color: transparent;
    block-size: auto;
    overflow: visible;
  }

  .app-calendar-wrapper .app-calendar-sidebar .flatpickr-days {
    background-color: transparent;
  }
}

/* Przesunięcie tytułu i liczby wydarzeń bardziej w lewo */
.fc-header-toolbar .fc-toolbar-chunk:first-child {
  margin-left: -4px !important;
  margin-top: -5px !important;
}

.fc .fc-button-group {
  padding-top: 2px !important;
}