/* Zadanie serwisowe — wyłącznie ten formularz; wspólne tokeny i istniejące kontrolki. */
#modal-root .serwis-okno {
  --okno-w: 1180px;   /* położenie, wysokość i rogi: wspólna zasada dużych okien — 20-okna-polozenie.css (wariant „nowe” to zwykłe okno) */
  background: var(--surface);
}
#modal-root .serwis-okno.serwis-okno-nowe { --okno-w: 720px; }
#modal-root .serwis-okno > header { align-items: flex-start; padding: var(--s-4) var(--s-3) var(--s-3) var(--s-5); border-bottom: 1px solid var(--line); }
#modal-root .serwis-okno > header > div { min-width: 0; }
#modal-root .serwis-okno > header h2 { font: var(--w-bold) var(--t-lg)/var(--lh-base) var(--font-tytul); }
#modal-root .serwis-okno > header p { margin-top: 2px; font-size: var(--t-sm); overflow-wrap: anywhere; }
.serwis-cialo { flex: 1; min-height: 0; overflow: auto; padding: var(--s-3) var(--s-4); }
.serwis-kolumny { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--s-4); }
.serwis-kolumny.serwis-nowe { grid-template-columns: minmax(0, 1fr); }
.serwis-formularz { display: flex; flex-direction: column; gap: var(--s-3); min-width: 0; padding: var(--s-3); border: 1px solid var(--line); border-radius: var(--r); }
.serwis-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-2); color: var(--text-muted); font-size: var(--t-xs); }
.serwis-pola { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.serwis-opis, .serwis-pliki { display: flex; flex-direction: column; gap: var(--s-1); min-width: 0; }
.serwis-opis > span { color: var(--text-muted); font-size: var(--t-xs); font-weight: var(--w-bold); }
.serwis-pliki-naglowek { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-2); }
.serwis-pliki-naglowek > strong { font-size: var(--t-xs); color: var(--text-muted); }
.serwis-nota { margin: 0; color: var(--text-muted); font-size: var(--t-xs); line-height: var(--lh-base); }
#modal-root .serwis-okno .project-field-card { padding: 0; gap: var(--s-1); border: 0; background: transparent; }
#modal-root .serwis-okno .project-field-card > span { font-size: var(--t-xs); }
#modal-root .serwis-okno .warranty-assignees-card { margin: 0; }
#modal-root .serwis-okno .project-card-title-row { padding: 0; }
#modal-root .serwis-okno .project-people-picker { padding: 0; border: 0; }
#modal-root .serwis-okno .project-people-grid { max-height: calc(var(--h-control) * 4); }
#modal-root .serwis-okno .rich-toolbar { padding: var(--s-1); gap: var(--s-1); flex-wrap: wrap; overflow: visible; min-height: var(--h-control); }
#modal-root .serwis-okno .rich-toolbar button { display: inline-flex; align-items: center; justify-content: center; width: var(--h-control-sm); height: var(--h-control-sm); }
#modal-root .serwis-okno .rich-expand-wrap { margin-left: auto; }
#modal-root .serwis-okno .rich-editable { min-height: 88px; padding: var(--s-2) var(--s-3); font-size: var(--t-base); line-height: 1.5; }
#modal-root .serwis-okno .attachment-list { flex-wrap: wrap; }
#modal-root .serwis-okno .attachment-pill { max-width: 100%; }
#modal-root .serwis-okno .attachment-pill > span { min-width: 0; overflow-wrap: anywhere; }
#modal-root .serwis-okno .serwis-rozmowa { display: flex; flex-direction: column; min-width: 0; height: auto; max-height: none; padding: 0; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); overflow: hidden; }
#modal-root .serwis-okno .serwis-rozmowa .project-chat-title { padding: var(--s-3); font-size: var(--t-base); border: 0; }
#modal-root .serwis-okno .serwis-rozmowa > .serwis-nota { padding: 0 var(--s-3) var(--s-2); }
#modal-root .serwis-okno .project-chat-people { padding: 0 var(--s-3) var(--s-2); }
#modal-root .serwis-okno .project-chat-history { min-height: 260px; max-height: 360px; padding: var(--s-3); background: var(--surface-2); flex: none; }
#modal-root .serwis-okno .project-chat-compose { padding: var(--s-2) var(--s-3) var(--s-3); gap: var(--s-2); }
#modal-root .serwis-okno .chat-pole { display: flex; flex-direction: column; gap: var(--s-2); }
#modal-root .serwis-okno .chat-rich-editor .rich-editable { min-height: 56px; padding-right: var(--s-3); }
#modal-root .serwis-okno .serwis-wyslij { align-self: flex-end; position: static; min-height: var(--h-control); }
#modal-root .serwis-okno > footer { padding: var(--s-2) var(--s-4); background: var(--surface); }
:root[data-ui="tablet"] .serwis-kolumny { grid-template-columns: minmax(0, 1fr); }
