/* ============ ExpresOS — warstwa marki i modułów firmowych (na bazie systemu Agentic OS) ============ */
:root {
  --accent-h: 197;                       /* EXPRESOKNA #009DDD */
  --accent: hsl(197 100% 52%);
  --accent-soft: hsl(197 100% 52% / 0.14);
  --accent-2: hsl(76 68% 52%);           /* EXPRESOKNA #ACD82F */
  --grad: linear-gradient(135deg, hsl(197 100% 46%) 0%, hsl(76 68% 50%) 100%);
  --glow: 0 0 0 1px hsl(197 100% 52% / 0.35), 0 8px 30px -8px hsl(197 100% 46% / 0.55);
  --bg: #05080d;
  --bg-2: #0a0f17;
}
:root[data-theme='light'] {
  --accent: hsl(197 100% 40%);
  --accent-soft: hsl(197 100% 43% / 0.1);
  --accent-2: hsl(80 70% 36%);
  --bg: #f3f6f9;
  --bg-2: #e9eef3;
}
body::before {
  background:
    radial-gradient(900px 600px at 8% -10%, hsl(197 100% 50% / 0.15), transparent 60%),
    radial-gradient(800px 600px at 105% 10%, hsl(76 70% 50% / 0.09), transparent 60%),
    radial-gradient(700px 500px at 50% 120%, hsl(210 80% 55% / 0.07), transparent 60%);
}

/* ---------- toolbar / filters ---------- */
.toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.toolbar .input { width: auto; min-width: 180px; padding: 8px 12px; }
.search { position: relative; }
.toolbar .search { flex: 1; min-width: 220px; }
.search .input { width: 100%; padding-left: 36px; }
.search .icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--dim); width: 16px; height: 16px; }
.seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 11px; background: var(--bg-2); border: 1px solid var(--border); flex-wrap: wrap; }
.seg button { border: 0; background: transparent; padding: 6px 11px; border-radius: 8px; cursor: pointer; color: var(--muted); font-size: 12.5px; font-weight: 560; display: inline-flex; gap: 6px; align-items: center; }
.seg button.active { background: var(--panel-solid); color: var(--text); box-shadow: var(--shadow); }
.seg button .n { font-family: var(--mono); font-size: 10.5px; color: var(--dim); }

/* ---------- data table ---------- */
.table-wrap { overflow-x: auto; margin: 0 -6px; }
table.data { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
table.data th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dim); font-weight: 650; padding: 8px 10px; border-bottom: 1px solid var(--border-strong); white-space: nowrap; }
table.data td { padding: 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
table.data tr.clickable { cursor: pointer; transition: background 0.15s; }
table.data tr.clickable:hover td { background: var(--panel-hover); }
table.data td.num, table.data th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.data .t-main { font-weight: 600; }
table.data .t-sub { font-size: 11.5px; color: var(--dim); }

/* ---------- status pills ---------- */
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 99px; font-size: 11.5px; font-weight: 620; white-space: nowrap; background: var(--panel-hover); color: var(--muted); }
.pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pill.s-robocza, .pill.s-nieaktywny, .pill.s-niski { color: var(--muted); }
.pill.s-wysłana, .pill.s-lead, .pill.s-w-toku { color: var(--accent); background: var(--accent-soft); }
.pill.s-negocjacje, .pill.s-wysoki, .pill.s-do-zrobienia { color: var(--warn); background: var(--warn-soft); }
.pill.s-zaakceptowana, .pill.s-aktywny, .pill.s-stały, .pill.s-zrobione { color: var(--success); background: var(--success-soft); }
.pill.s-odrzucona, .pill.s-wygasła, .pill.s-pilny { color: var(--danger); background: var(--danger-soft); }
.pill.s-normalny { color: var(--text); }

/* ---------- forms ---------- */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.form-grid .full { grid-column: 1 / -1; }
.modal.wide { max-width: 780px; }
.modal .input, .modal .textarea { font-size: 13.5px; }

/* ---------- drawer (detail panel) ---------- */
.drawer-ov { position: fixed; inset: 0; z-index: 90; background: rgba(3, 4, 10, 0.45); backdrop-filter: blur(3px); animation: fadeIn 0.18s both; }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 91; width: min(620px, 100vw); background: var(--panel-solid); border-left: 1px solid var(--border-strong); box-shadow: -30px 0 80px -30px rgba(0,0,0,.6); display: flex; flex-direction: column; animation: drawerIn 0.3s var(--ease) both; }
.drawer-head { padding: 18px 20px 14px; border-bottom: 1px solid var(--border); display: flex; gap: 12px; align-items: flex-start; }
.drawer-head h2 { margin: 0; font-size: 18px; letter-spacing: -0.02em; }
.drawer-body { flex: 1; overflow-y: auto; padding: 18px 20px 28px; display: flex; flex-direction: column; gap: 18px; }
.drawer-sec h3 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dim); display: flex; align-items: center; gap: 8px; }
.drawer-sec h3 .actions { margin-left: auto; text-transform: none; letter-spacing: 0; }
@keyframes drawerIn { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.kv { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 6px 12px; font-size: 13px; }
.kv dt { color: var(--dim); }
.kv dd { margin: 0; overflow-wrap: anywhere; }

/* ---------- timeline ---------- */
.tline { display: flex; flex-direction: column; gap: 0; }
.tline-item { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 10px; padding: 6px 0; font-size: 13px; }
.tline-item .d { width: 8px; height: 8px; border-radius: 50%; background: var(--border-strong); margin-top: 6px; }
.tline-item.note .d { background: var(--accent); }
.tline-item.ai .d { background: var(--accent-2); }
.tline-item .when { font-size: 11px; color: var(--dim); }

/* ---------- kanban (tasks) ---------- */
.kanban { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: start; }
.kcol { background: var(--panel); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; min-height: 200px; transition: border-color .2s, background .2s; }
.kcol.drop { border-color: var(--accent); background: var(--accent-soft); }
.kcol-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-weight: 650; font-size: 13px; }
.kcol-head .n { font-family: var(--mono); font-size: 11px; color: var(--dim); }
.kcard { background: var(--panel-solid); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; cursor: grab; transition: transform .15s var(--ease), border-color .2s; }
.kcard:hover { border-color: var(--border-strong); transform: translateY(-1px); }
.kcard.dragging { opacity: 0.5; }
.kcard .t { font-weight: 600; font-size: 13px; }
.kcard .m { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; font-size: 11.5px; color: var(--dim); align-items: center; }
.kcard.overdue { border-left: 3px solid var(--danger); }

/* ---------- files ---------- */
.crumbs { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.crumbs a { color: var(--muted); cursor: pointer; padding: 2px 6px; border-radius: 6px; }
.crumbs a:hover { background: var(--panel-hover); color: var(--text); text-decoration: none; }
.crumbs a:last-child { color: var(--text); font-weight: 600; }
.dropzone { border: 2px dashed var(--border-strong); border-radius: var(--radius); padding: 18px; text-align: center; color: var(--muted); transition: border-color .2s, background .2s; font-size: 13px; }
.dropzone.over { border-color: var(--accent); background: var(--accent-soft); color: var(--text); }
.ficon { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; flex: none; font-size: 9.5px; font-weight: 800; letter-spacing: .02em; color: #fff; background: var(--dim); text-transform: uppercase; }
.ficon.dir { background: var(--accent-soft); color: var(--accent); }
.ficon.pdf { background: hsl(355 70% 52%); } .ficon.docx, .ficon.doc, .ficon.odt { background: hsl(215 75% 52%); }
.ficon.xlsx, .ficon.xls, .ficon.csv { background: hsl(145 55% 40%); } .ficon.md { background: hsl(265 60% 58%); }
.ficon.jpg, .ficon.jpeg, .ficon.png, .ficon.webp, .ficon.heic { background: hsl(35 85% 50%); } .ficon.eml, .ficon.msg { background: hsl(190 70% 42%); }
.preview-frame { width: 100%; height: 62vh; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.preview-img { max-width: 100%; max-height: 62vh; border-radius: 12px; display: block; margin: auto; }
.preview-text { white-space: pre-wrap; font-family: var(--mono); font-size: 12px; line-height: 1.55; max-height: 62vh; overflow: auto; background: var(--bg-2); border: 1px solid var(--border); border-radius: 12px; padding: 14px; }
mark { background: hsl(76 70% 50% / 0.3); color: inherit; border-radius: 3px; padding: 0 2px; }

/* ---------- brain ---------- */
.brain-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 16px; min-height: calc(100vh - 150px); }
.note-tree { overflow-y: auto; max-height: calc(100vh - 220px); }
.note-tree .sec { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--dim); margin: 12px 4px 4px; font-weight: 650; }
.note-tree a { display: block; padding: 5px 8px; border-radius: 8px; color: var(--text); font-size: 13px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.note-tree a:hover { background: var(--panel-hover); text-decoration: none; }
.note-tree a.active { background: var(--accent-soft); color: var(--accent); }
.hit { padding: 10px 8px; border-bottom: 1px solid var(--border); cursor: pointer; border-radius: 8px; }
.hit:hover { background: var(--panel-hover); }
.hit .p { font-size: 11px; color: var(--dim); font-family: var(--mono); }
.hit .s { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.graph-box { height: calc(100vh - 230px); min-height: 420px; border-radius: 12px; overflow: hidden; background: var(--bg-2); border: 1px solid var(--border); position: relative; }
.graph-legend { position: absolute; left: 12px; bottom: 12px; display: flex; gap: 10px; flex-wrap: wrap; font-size: 11.5px; color: var(--muted); background: var(--panel); padding: 6px 10px; border-radius: 10px; border: 1px solid var(--border); }
.graph-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
.note-editor { width: 100%; min-height: 60vh; font-family: var(--mono); font-size: 13px; }

/* ---------- dashboard ---------- */
.bars { display: flex; align-items: flex-end; gap: 8px; height: 150px; padding-top: 10px; }
.bars .b { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; justify-content: flex-end; min-width: 0; }
.bars .b i { display: block; width: 100%; max-width: 38px; border-radius: 8px 8px 3px 3px; background: var(--grad); min-height: 3px; transition: height 0.8s var(--ease); }
.bars .b span { font-size: 10.5px; color: var(--dim); white-space: nowrap; }
.pipeline { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.pipeline .st { padding: 10px; border-radius: 12px; background: var(--bg-2); border: 1px solid var(--border); cursor: pointer; transition: border-color .2s; }
.pipeline .st:hover { border-color: var(--accent); }
.pipeline .st .n { font-size: 20px; font-weight: 760; letter-spacing: -0.03em; }
.pipeline .st .v { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }

/* ---------- assistant extras ---------- */
.provider-pill { display: inline-flex; gap: 6px; align-items: center; }
.chat-scroll .md table { display: table; }

@media (max-width: 1100px) {
  .pipeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .brain-grid { grid-template-columns: minmax(0, 1fr); }
  .note-tree { max-height: 260px; }
}
@media (max-width: 860px) {
  .kanban { grid-template-columns: minmax(0, 1fr); }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .toolbar .input { min-width: 0; flex: 1; }
  .kv { grid-template-columns: 100px minmax(0, 1fr); }
  .hide-sm { display: none; }
}
@media (max-width: 560px) {
  .pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pipeline .st .pill { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .kcol { min-height: 0; }
  .drawer-head { padding: 14px; }
  .drawer-body { padding: 14px 14px 90px; }
}

/* ============ Konta i uprawnienia ============ */
.me-chip {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; text-align: left;
  border-radius: 12px; border: 1px solid var(--border); background: var(--bg-2); color: var(--text);
  font: inherit; cursor: pointer; transition: border-color .18s ease, transform .18s ease;
}
.me-chip:hover { border-color: hsl(var(--accent-h) 90% 60% / .5); transform: translateY(-1px); }
.me-chip > .grow { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.me-chip b { font-weight: 650; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.me-avatar {
  flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px;
  background: var(--grad); color: #fff; font-weight: 750; font-size: 13px;
}
.g-1 { grid-template-columns: minmax(0, 1fr); }

.access-wrap { overflow-x: auto; margin: 0 -4px; padding: 0 4px; }
table.access { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; }
table.access th, table.access td { padding: 6px 6px; border-bottom: 1px solid var(--border); vertical-align: middle; }
table.access thead th { position: sticky; top: 0; background: var(--bg-2); font-weight: 600; color: var(--muted); text-align: left; white-space: nowrap; }
table.access tbody th { text-align: left; font-weight: 600; white-space: nowrap; }
table.access tbody th .t-sub { font-weight: 400; }
table.access tr.dept-row th { padding-top: 14px; color: var(--accent); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; border-bottom: 0; }
table.access select.input { padding: 4px 6px; font-size: 12px; min-width: 128px; height: auto; }
table.access select.changed { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.scope-none { color: var(--dim); }
.role-badge { white-space: nowrap; }

/* ============ Operacje (Codex) ============ */
.ops-toolbar .search { min-width: min(340px, 100%); }
.ops-toolbar > #status { width: 170px; min-width: 150px; }
.ops-date-filter { display: flex; align-items: center; gap: 6px; color: var(--dim); font-size: 11px; font-weight: 650; }
.ops-date-filter .input { width: 138px; min-width: 138px; }
.ops-list-summary { min-height: 26px; padding: 0 4px 6px; }
.ops-cell-client { max-width: 220px; }
.ops-cell-address { max-width: 240px; }
.ops-cell-ref { max-width: 170px; }
.ops-inline-error { margin: 0 0 10px; padding: 9px 11px; border: 1px solid var(--danger); border-radius: 10px; background: var(--danger-soft); color: var(--danger); font-size: 12px; }
.ops-row-alert td:first-child { box-shadow: inset 3px 0 0 var(--danger); }

.ops-progress { display: grid; grid-template-columns: minmax(54px, 1fr) 34px; align-items: center; gap: 7px; min-width: 94px; }
.ops-progress > span { height: 6px; overflow: hidden; border-radius: 99px; background: var(--bg-2); border: 1px solid var(--border); }
.ops-progress i { display: block; height: 100%; border-radius: inherit; background: var(--grad); }
.ops-progress b { color: var(--muted); font: 600 10.5px var(--mono); text-align: right; }

.ops-detail-list { display: flex; flex-direction: column; gap: 6px; }
.ops-detail-row { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); color: var(--text); text-align: left; }
button.ops-detail-row { font: inherit; cursor: pointer; }
.ops-detail-link:hover { border-color: var(--accent); background: var(--accent-soft); }
.ops-alert { display: flex; gap: 10px; align-items: flex-start; padding: 11px 12px; border: 1px solid hsl(0 75% 55% / .45); border-radius: 12px; background: var(--danger-soft); color: var(--danger); }
.ops-alert .small { color: inherit; opacity: .85; }

.ops-schedule-toolbar { min-height: 42px; }
.schedule-nav button { white-space: nowrap; }
.schedule-nav button:first-child .icon { transform: rotate(180deg); }
.schedule-week-label { font-size: 14px; font-variant-numeric: tabular-nums; }
.schedule-layout { display: grid; grid-template-columns: minmax(0, 1fr) 286px; gap: 14px; align-items: start; }
.schedule-week { display: grid; grid-template-columns: repeat(6, minmax(148px, 1fr)); gap: 8px; min-width: 0; overflow-x: auto; padding: 1px 1px 8px; scroll-snap-type: x proximity; }
.schedule-day { min-height: 480px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); scroll-snap-align: start; transition: border-color .15s, background .15s; }
.schedule-day.today { border-color: hsl(var(--accent-h) 90% 55% / .7); box-shadow: inset 0 3px 0 var(--accent); }
.schedule-day.drop { border-color: var(--accent); background: var(--accent-soft); }
.schedule-day > header { display: flex; justify-content: space-between; gap: 6px; align-items: baseline; padding: 10px; border-bottom: 1px solid var(--border); background: var(--bg-2); }
.schedule-day > header span { overflow: hidden; color: var(--muted); font-size: 11px; font-weight: 650; text-overflow: ellipsis; }
.schedule-day > header b { color: var(--dim); font: 600 10px var(--mono); white-space: nowrap; }
.schedule-day-body { display: flex; flex-direction: column; gap: 7px; min-height: 430px; padding: 8px; }
.schedule-empty { min-height: 82px; display: grid; place-items: center; border: 1px dashed var(--border-strong); border-radius: 10px; color: var(--dim); font-size: 11px; }

.schedule-card { display: flex; flex-direction: column; gap: 5px; width: 100%; padding: 9px; border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 10px; background: var(--panel-solid); color: var(--text); text-align: left; cursor: pointer; transition: transform .15s var(--ease), border-color .15s; }
.schedule-card:hover { transform: translateY(-1px); border-color: var(--accent); }
.schedule-card:active { transform: translateY(0); }
.schedule-card.kind-dostawa { border-left-color: var(--accent-2); }
.schedule-card.kind-serwis { border-left-color: var(--warn); }
.schedule-card.kind-pomiar { border-left-color: var(--muted); }
.schedule-card.status-zrobione { opacity: .65; }
.schedule-card.status-odwołane { opacity: .55; text-decoration: line-through; }
.schedule-card-top { display: flex; justify-content: space-between; gap: 4px; align-items: center; }
.schedule-card-top > b { font: 650 10.5px var(--mono); }
.schedule-card-top .pill { max-width: 84px; overflow: hidden; padding: 1px 6px; text-overflow: ellipsis; font-size: 9px; }
.schedule-card-title { font-size: 12px; font-weight: 670; line-height: 1.3; overflow-wrap: anywhere; }
.schedule-card-meta, .schedule-card-address { overflow: hidden; color: var(--dim); font-size: 10.5px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }

.unscheduled-column { position: sticky; top: 82px; max-height: calc(100dvh - 118px); overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--panel); }
.unscheduled-head { display: flex; justify-content: space-between; align-items: center; padding: 13px 14px; border-bottom: 1px solid var(--border); background: var(--bg-2); }
.unscheduled-head h2 { margin: 0 0 2px; font-size: 14px; }
.unscheduled-head > .icon { color: var(--accent); }
.unscheduled-list { display: flex; flex-direction: column; gap: 8px; max-height: calc(100dvh - 182px); overflow-y: auto; padding: 10px; }
.unscheduled-more { width: 100%; justify-content: center; flex: 0 0 auto; }
.unscheduled-list .empty { min-height: 220px; }
.unscheduled-card { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--border); border-radius: 11px; background: var(--panel-solid); cursor: grab; transition: border-color .15s, transform .15s var(--ease); }
.unscheduled-card:hover, .unscheduled-card:focus-visible { border-color: var(--accent); outline: 0; transform: translateY(-1px); }
.unscheduled-card.dragging { opacity: .48; }
.unscheduled-card > b { font-size: 12.5px; }
.unscheduled-card .btn { align-self: flex-start; margin-top: 2px; }

@media (max-width: 1180px) {
  .hide-md { display: none; }
  .schedule-layout { grid-template-columns: minmax(0, 1fr) 250px; }
  .schedule-week { grid-template-columns: repeat(6, minmax(138px, 1fr)); }
}
@media (max-width: 900px) {
  .schedule-layout { grid-template-columns: minmax(0, 1fr); }
  .schedule-week { grid-template-columns: repeat(6, minmax(156px, 1fr)); }
  .schedule-day { min-height: 360px; }
  .schedule-day-body { min-height: 310px; }
  .unscheduled-column { position: static; max-height: none; }
  .unscheduled-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
}
@media (max-width: 620px) {
  .ops-toolbar > * { flex: 1 1 100%; }
  .ops-toolbar > #status, .ops-date-filter .input { width: 100%; }
  .ops-date-filter { display: grid; grid-template-columns: 82px minmax(0, 1fr); }
  .ops-list-summary { align-items: flex-start; flex-direction: column; }
  .ops-schedule-toolbar .schedule-nav { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
  .schedule-week-label { order: 2; width: 100%; text-align: center; }
  .schedule-week { grid-template-columns: repeat(6, minmax(82vw, 1fr)); }
  .schedule-day { min-height: 320px; }
  .schedule-day-body { min-height: 270px; }
  .unscheduled-list { grid-template-columns: minmax(0, 1fr); }
  .ops-detail-row { align-items: flex-start; }
}

/* ============ Wycena z pomiaru (Codex) ============ */
.estimate-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; align-items: start; }
.estimate-sidebar { min-width: 0; padding: 12px; }
.estimate-sidebar .card-head { margin-bottom: 10px; }
.estimate-upload { display: flex; min-height: 150px; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 18px 12px; text-align: center; }
.estimate-upload > .icon { width: 28px; height: 28px; color: var(--accent); }
.estimate-upload.uploading { pointer-events: none; opacity: .65; }
.estimate-upload.uploading > .icon { animation: spin 1s linear infinite; }
.estimate-list { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; padding: 1px 1px 5px; scroll-snap-type: x proximity; }
.estimate-list-empty { padding: 14px 4px; }
.estimate-list-item { display: flex; min-width: min(78vw, 280px); flex: 0 0 auto; flex-direction: column; gap: 5px; padding: 11px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); color: var(--text); font: inherit; text-align: left; cursor: pointer; scroll-snap-align: start; }
.estimate-list-item:hover, .estimate-list-item.active { border-color: var(--accent); background: var(--accent-soft); }
.estimate-list-item strong { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.estimate-workspace { display: flex; min-width: 0; flex-direction: column; gap: 12px; }
.estimate-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.estimate-detail-head h2 { margin: 0; font-size: clamp(18px, 4vw, 24px); }
.estimate-detail-head > div { min-width: 0; }
.estimate-detail-head .small { overflow-wrap: anywhere; }
.estimate-status { display: inline-flex; align-items: center; width: max-content; padding: 3px 7px; border: 1px solid var(--border); border-radius: 99px; background: var(--bg-2); color: var(--muted); font-size: 10px; font-weight: 700; white-space: nowrap; }
.estimate-status.status-analiza { border-color: hsl(var(--accent-h) 80% 55% / .5); background: var(--accent-soft); color: var(--accent); }
.estimate-status.status-do-sprawdzenia { border-color: hsl(38 85% 55% / .55); background: hsl(38 85% 55% / .12); color: var(--warn); }
.estimate-status.status-gotowa { border-color: hsl(145 65% 45% / .5); background: hsl(145 65% 45% / .12); color: var(--success); }
.estimate-status.status-error { border-color: hsl(0 75% 55% / .5); background: var(--danger-soft); color: var(--danger); }
.estimate-analysis { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid hsl(var(--accent-h) 85% 55% / .4); border-radius: var(--radius); background: var(--accent-soft); color: var(--accent); }
.estimate-analysis > div { display: flex; flex-direction: column; gap: 2px; }
.estimate-file-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: start; }
.estimate-preview { min-width: 0; }
.estimate-preview-frame, .estimate-preview-image { display: block; width: 100%; height: min(54dvh, 520px); border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); object-fit: contain; }
.estimate-header-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.estimate-client-field { position: relative; }
.estimate-client-results { position: absolute; z-index: 20; top: calc(100% + 4px); right: 0; left: 0; max-height: 240px; overflow-y: auto; padding: 5px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--panel-solid); box-shadow: var(--shadow); }
.estimate-client-results button { display: flex; width: 100%; flex-direction: column; gap: 2px; padding: 9px; border: 0; border-radius: 7px; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.estimate-client-results button:hover, .estimate-client-results button:focus-visible { background: var(--accent-soft); outline: 0; }
.estimate-client-results button span { color: var(--dim); font-size: 11px; }
.estimate-items-card { min-width: 0; overflow: visible; }
.estimate-items-card .card-head .btn { margin-left: auto; }
.estimate-items-wrap { width: 100%; min-width: 0; max-width: 100%; overflow: visible; }
.estimate-items { display: block; width: 100%; min-width: 0; max-width: 100%; border-collapse: collapse; }
.estimate-items thead { display: none; }
.estimate-items tbody { display: grid; gap: 10px; }
.estimate-items tr { display: grid; max-width: 100%; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 11px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.estimate-items tr.estimate-item-outside { border-color: var(--warn); box-shadow: inset 3px 0 0 var(--warn); }
.estimate-items td { display: flex; min-width: 0; flex-direction: column; gap: 4px; padding: 0; border: 0; }
.estimate-items td::before { content: attr(data-label); color: var(--dim); font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.estimate-items td:first-child, .estimate-items td:last-child { align-items: flex-start; justify-content: flex-end; }
.estimate-items .input { width: 100%; min-width: 0; min-height: 44px; padding: 9px 10px; font-size: 16px; }
.estimate-catalog-cell { grid-column: 1 / -1; min-width: 0; max-width: 100%; }
.estimate-catalog-meta { color: var(--dim); font-size: 10.5px; line-height: 1.35; overflow-wrap: anywhere; }
.estimate-combobox { position: relative; width: 100%; min-width: 0; max-width: 100%; }
.estimate-combobox-results { display: flex; width: 100%; max-height: min(45dvh, 280px); flex-direction: column; gap: 2px; margin-top: 4px; overflow-y: auto; padding: 5px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--panel-solid); box-shadow: var(--shadow); }
.estimate-combobox-results.hidden { display: none; }
.estimate-combobox-results button { display: flex; width: 100%; min-width: 0; min-height: 44px; flex-direction: column; justify-content: center; gap: 2px; padding: 8px 9px; border: 0; border-radius: 7px; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.estimate-combobox-results button:hover, .estimate-combobox-results button:focus-visible, .estimate-combobox-results button.active { background: var(--accent-soft); outline: 0; }
.estimate-combobox-results button strong { font-size: 12px; line-height: 1.35; }
.estimate-combobox-results button span { color: var(--dim); font-size: 10.5px; line-height: 1.35; }
.estimate-combobox-empty { padding: 10px; color: var(--dim); font-size: 11px; }
.estimate-item-feedback { grid-template-columns: minmax(0, 1fr) !important; margin-top: -10px; padding-top: 8px !important; border-top: 0 !important; border-radius: 0 0 11px 11px !important; background: transparent !important; }
.estimate-item-feedback > td { grid-column: 1 / -1; }
.estimate-item-feedback > td::before { display: none; }
.estimate-match-note, .estimate-item-feedback .estimate-dim-warning { display: flex; width: 100%; align-items: flex-start; gap: 7px; padding: 8px 10px; border: 1px solid hsl(38 85% 55% / .4); border-radius: 9px; background: hsl(38 85% 55% / .12); color: var(--warn); font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.estimate-match-note .icon, .estimate-item-feedback .estimate-dim-warning .icon { flex: none; margin-top: 1px; }
.estimate-advanced { width: 100%; margin-top: 3px; border-top: 1px solid var(--border); }
.estimate-advanced summary { display: flex; min-height: 44px; align-items: center; color: var(--muted); font-size: 11px; font-weight: 650; cursor: pointer; }
.estimate-advanced summary:focus-visible { border-radius: 6px; outline: 2px solid var(--accent); outline-offset: 2px; }
.estimate-advanced label { display: flex; flex-direction: column; gap: 5px; padding-bottom: 4px; color: var(--dim); font-size: 10.5px; }
.estimate-catalog-retry { align-self: flex-start; padding: 3px 0; border: 0; background: transparent; color: var(--accent); font: inherit; font-size: 10.5px; font-weight: 600; cursor: pointer; }
.estimate-template-cell { grid-column: 1 / -1; }
.estimate-template-suggestion { min-height: 42px; padding: 7px 2px; border: 0; background: transparent; color: var(--accent); font-family: inherit; font-size: 11px; font-weight: 600; line-height: 1.35; text-align: left; cursor: pointer; }
.estimate-template-suggestion:hover { text-decoration: underline; }
.estimate-template-suggestion:disabled { color: var(--dim); cursor: default; text-decoration: none; }
.estimate-dim-warning { display: flex; align-items: flex-start; gap: 4px; color: var(--warn); font-size: 10px; line-height: 1.3; }
.estimate-dim-warning .icon { flex: none; }
.estimate-confidence { display: inline-flex; width: max-content; padding: 3px 7px; border-radius: 99px; background: var(--bg-2); color: var(--muted); font: 650 10px var(--mono); }
.estimate-confidence.low { background: hsl(38 85% 55% / .14); color: var(--warn); }
.estimate-remove { min-width: 42px; min-height: 42px; justify-content: center; color: var(--danger); }
.estimate-actions { display: flex; flex-wrap: wrap; gap: 8px; position: sticky; bottom: 8px; z-index: 8; box-shadow: var(--shadow); }
.estimate-actions .btn { flex: 1 1 190px; justify-content: center; }
.estimate-inline-error { padding: 10px 12px; border: 1px solid hsl(0 75% 55% / .45); border-radius: 10px; background: var(--danger-soft); color: var(--danger); font-size: 12px; overflow-wrap: anywhere; }
.estimate-catalog-error { display: flex; align-items: flex-start; gap: 10px; padding: 11px 12px; border: 1px solid hsl(38 85% 55% / .45); border-radius: 11px; background: hsl(38 85% 55% / .12); color: var(--warn); }
.estimate-catalog-error > .icon { flex: none; margin-top: 2px; }
.estimate-catalog-error > div { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 2px; }
.estimate-catalog-error span { font-size: 11px; overflow-wrap: anywhere; }

.estimate-articles-card { min-width: 0; overflow: visible; }
.estimate-articles-card .card-head { flex-wrap: wrap; }
.estimate-articles-card .card-head .btn { margin-left: auto; }
.estimate-articles { display: flex; min-width: 0; flex-direction: column; gap: 9px; }
.estimate-articles-empty { padding: 8px 2px; }
.estimate-article-row { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 9px; padding: 11px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.estimate-article-row .field { min-width: 0; }
.estimate-article-name { display: flex; min-width: 0; flex-direction: column; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 600; }
.estimate-article-row .input { width: 100%; min-width: 0; min-height: 44px; font-size: 16px; }
.estimate-article-match, .estimate-article-missing { display: flex; align-items: flex-start; gap: 5px; margin-top: 4px; font-size: 10.5px; line-height: 1.35; overflow-wrap: anywhere; }
.estimate-article-match { color: var(--success); }
.estimate-article-missing { color: var(--warn); }
.estimate-article-match .icon, .estimate-article-missing .icon { flex: none; }
.estimate-article-row > .estimate-remove { justify-self: start; }

@media (max-width: 900px) {
  .estimate-actions { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

@media (min-width: 960px) {
  .estimate-header-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .estimate-notes { grid-column: 1 / -1; }
  .estimate-items-wrap { overflow-x: auto; }
  .estimate-items { display: table; min-width: 1480px; max-width: none; }
  .estimate-items thead { display: table-header-group; }
  .estimate-items tbody { display: table-row-group; }
  .estimate-items tr { display: table-row; padding: 0; border: 0; background: transparent; }
  .estimate-items td, .estimate-items th { display: table-cell; padding: 7px 4px; border-bottom: 1px solid var(--border); vertical-align: top; }
  .estimate-items th { color: var(--dim); font-size: 10px; font-weight: 650; text-align: left; white-space: nowrap; }
  .estimate-items td::before { display: none; }
  .estimate-items td:first-child, .estimate-items td:last-child { text-align: center; }
  .estimate-items .input { min-width: 72px; min-height: 36px; padding: 7px 8px; font-size: 12px; }
  .estimate-items [data-field="opening"] { min-width: 92px; }
  .estimate-items [data-field="template"] { min-width: 250px; }
  .estimate-items [data-field="note"] { min-width: 160px; }
  .estimate-pattern-cell { min-width: 290px; }
  .estimate-catalog-cell { grid-column: auto; }
  .estimate-item-feedback { display: table-row !important; margin-top: 0; }
  .estimate-item-feedback > td { padding: 5px 4px 10px; border-bottom: 1px solid var(--border); }
  .estimate-article-row { grid-template-columns: minmax(260px, 2fr) minmax(90px, .45fr) minmax(200px, 1.2fr) auto; align-items: start; }
  .estimate-article-row .input { min-height: 36px; font-size: 12px; }
  .estimate-article-note { grid-column: auto; }
  .estimate-template-cell { grid-column: auto; }
}

@media (max-width: 420px) {
  .estimate-items tr { grid-template-columns: minmax(0, 1fr); }
  .estimate-items td, .estimate-catalog-cell { grid-column: 1 / -1; }
  .estimate-items-card .card-head .btn, .estimate-articles-card .card-head .btn { width: 100%; margin-left: 0; justify-content: center; }
}

@media (min-width: 960px) {
  .estimate-layout { grid-template-columns: minmax(230px, 285px) minmax(0, 1fr); }
  .estimate-sidebar { position: sticky; top: 78px; max-height: calc(100dvh - 94px); overflow: hidden; }
  .estimate-list { max-height: calc(100dvh - 330px); flex-direction: column; overflow-x: hidden; overflow-y: auto; }
  .estimate-list-item { width: 100%; min-width: 0; }
}

@media (min-width: 1240px) {
  .estimate-file-grid { grid-template-columns: minmax(300px, .8fr) minmax(460px, 1.2fr); }
}

/* ============ Wincon (Claude) ============ */
.badge.src-wincon { color: hsl(28 95% 58%); background: hsl(28 95% 55% / .13); border-color: transparent; font-weight: 650; letter-spacing: .02em; }
.quotes-table td { vertical-align: top; }
.quotes-table .nowrap, .nowrap { white-space: nowrap; }
.quotes-table .cell-wide { max-width: 260px; }
.quotes-table .cell-mid { max-width: 180px; }
.quotes-table tr.row-new td { animation: row-new 2.4s ease-out 1; }
@keyframes row-new { 0% { background: hsl(28 95% 55% / .28); } 100% { background: transparent; } }
.wsync { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.wsync .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--dim); }
.wsync .dot.ok { background: var(--success, hsl(145 63% 45%)); }
.wsync .dot.bad { background: var(--danger, hsl(0 80% 60%)); }
@media (prefers-reduced-motion: reduce) { .quotes-table tr.row-new td { animation: none; } }
/* Sticky action bar of the measurement estimate: opaque, so content scrolling under it never shows through. */
.estimate-actions.card { background: var(--bg-2); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }

/* ============ Pomiary, montaż i koszty materiałowe ============ */
.estimate-header { position: relative; overflow: visible; }
.estimate-header:has(.estimate-client-results:not(.hidden)) { z-index: 12; }
.estimate-client-results { z-index: 30; }
.estimate-installation-toggle { justify-content: flex-start; }
.estimate-switch { display: flex; min-height: 40px; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); color: var(--text); font-size: 13px; cursor: pointer; }
.estimate-switch input { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.estimate-installation-warning, .quote-measurement-warning { display: flex; align-items: flex-start; gap: 9px; margin-top: 12px; padding: 11px 12px; border: 1px solid hsl(0 75% 55% / .5); border-radius: 10px; background: var(--danger-soft); color: var(--danger); }
.estimate-installation-warning > div { display: flex; flex-direction: column; gap: 2px; }
.estimate-installation-warning span, .quote-measurement-warning span { color: inherit; font-size: 11px; opacity: .88; }
.estimate-installation-warning .icon, .quote-measurement-warning .icon { flex: none; margin-top: 1px; }

.estimate-measurement { min-width: 0; }
.estimate-measurement .card-head { flex-wrap: wrap; }
.estimate-measurement .card-head .btn { margin-left: auto; }
.measurement-empty { padding: 14px 2px; }
.measurement-files { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.measurement-file { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-width: 0; padding: 7px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.measurement-thumb { display: flex; width: 64px; height: 64px; flex: none; align-items: center; justify-content: center; overflow: hidden; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--panel-solid); color: var(--muted); cursor: pointer; }
.measurement-thumb:hover, .measurement-thumb:focus-visible { border-color: var(--accent); outline: 2px solid var(--accent-soft); }
.measurement-thumb img { width: 100%; height: 100%; object-fit: cover; }
.measurement-pdf { flex-direction: column; gap: 2px; text-decoration: none; }
.measurement-pdf .icon { width: 22px; height: 22px; }
.measurement-pdf span { font: 700 9px var(--mono); }
.measurement-file-meta { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.measurement-file-meta > span { overflow: hidden; font-size: 12px; font-weight: 620; text-overflow: ellipsis; white-space: nowrap; }
.measurement-file-meta small { color: var(--dim); font-size: 10px; }
.measurement-detach { min-width: 40px; min-height: 40px; justify-content: center; }
.measurement-lightbox { width: min(1100px, 94vw); max-width: 94vw; padding: 12px; }
.measurement-lightbox-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.measurement-lightbox-head strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.measurement-lightbox-image { display: block; width: 100%; max-height: calc(90dvh - 90px); border-radius: 10px; object-fit: contain; background: var(--bg-2); }
.estimate-variants { display: flex; flex-direction: column; gap: 9px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--border); }
.estimate-variants > .row { gap: 10px; flex-wrap: wrap; }
.estimate-variants > .row > strong { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--dim); }
button.measurement-variant { width: 100%; border: 1px solid var(--border); background: var(--bg-2); color: var(--text); font: inherit; text-align: left; }
button.measurement-variant:hover { border-color: var(--accent); }

.quote-installation { gap: 4px; white-space: nowrap; }
.quote-installation-missing { gap: 4px; border-color: hsl(0 75% 55% / .45); background: var(--danger-soft); color: var(--danger); white-space: nowrap; }
#missing-measurement.active { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
.quote-measurements > h3 { flex-wrap: wrap; }
.quote-measurements > h3 .actions { display: flex; }
.quote-measurement-warning { flex-wrap: wrap; margin: 0 0 10px; }
.quote-measurement-list, .client-measurements { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.quote-measurement-card, .client-measurement-card { display: flex; min-width: 0; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.quote-measurement-card .row, .client-measurement-card .row { align-items: flex-start; gap: 10px; }
.measurement-linker { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.measurement-linker > strong { font-size: 12px; }
.measurement-linker .row { align-items: stretch; gap: 8px; }
.measurement-linker select { min-width: 0; }
.measurement-links { display: flex; flex-wrap: wrap; gap: 6px; }
.measurement-links .btn { max-width: 100%; }

.material-breakdown { display: flex; flex-direction: column; gap: 10px; }
.material-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.material-summary > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); }
.material-summary span { color: var(--dim); font-size: 10px; text-transform: uppercase; letter-spacing: .05em; }
.material-summary strong { overflow-wrap: anywhere; font-size: 14px; }
.material-bar { display: flex; width: 100%; height: 13px; overflow: hidden; border: 1px solid var(--border); border-radius: 99px; background: var(--bg-2); }
.material-bar > span { width: var(--share); min-width: 0; background: var(--accent); }
.material-bar > span:nth-child(2) { background: var(--accent-2); }
.material-bar > span:nth-child(3) { background: var(--warn); }
.material-bar > span:nth-child(4) { background: hsl(270 70% 60%); }
.material-bar > span:nth-child(5n) { background: hsl(28 90% 58%); }
.material-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 12px; }
.material-groups > div { display: flex; min-width: 0; justify-content: space-between; gap: 8px; font-size: 11px; }
.material-groups span { color: var(--muted); }
.material-groups b { white-space: nowrap; }
.material-positions { min-width: 520px; }

@media (min-width: 620px) {
  .measurement-files { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .estimate-items { min-width: 1480px; }
}
@media (max-width: 560px) {
  .estimate-measurement .card-head .btn { width: 100%; margin-left: 0; justify-content: center; }
  .measurement-linker .row { flex-direction: column; }
  .material-summary { grid-template-columns: minmax(0, 1fr); }
  .material-groups { grid-template-columns: minmax(0, 1fr); }
}

/* ============ Serwis: reklamacje, wizyty i protokoły ============ */
.visually-hidden {
  position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
.service-overview, .service-my-visits, .service-list-section { margin-bottom: 26px; }
.service-overview-skeleton { height: 440px; }
.service-visits-skeleton { height: 220px; margin-bottom: 26px; }
.service-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 0 2px 12px; }
.service-section-head h2 { margin: 0; font-size: 17px; letter-spacing: -.02em; }
.service-section-head p { margin: 2px 0 0; color: var(--muted); font-size: 11.5px; }
.service-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.service-metric { min-height: 116px; padding: 16px; }
.service-metric-value { font: 720 25px/1.1 var(--font); letter-spacing: -.035em; }
.service-metric-label { margin-top: 9px; color: var(--muted); font-size: 12px; font-weight: 650; }
.service-metric-detail { margin-top: 2px; color: var(--muted); font-size: 10.5px; }
.service-insights { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 12px; margin-top: 12px; }
.service-insights > .card { min-width: 0; padding: 16px; }
.service-status-bar { display: flex; width: 100%; height: 12px; overflow: hidden; border-radius: 8px; background: var(--bg-2); }
.service-status-bar > span { width: var(--share); min-width: 3px; background: var(--accent); }
.service-status-bar > span:nth-child(2n) { background: var(--accent-2); }
.service-status-bar > span:nth-child(3n) { background: var(--warn); }
.service-status-bar > span:nth-child(4n) { background: var(--success); }
.service-status-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 12px; margin-top: 12px; }
.service-status-list button { display: flex; min-width: 0; min-height: 34px; align-items: center; gap: 8px; padding: 3px 5px; border: 0; border-radius: 8px; background: transparent; color: var(--text); cursor: pointer; text-align: left; }
.service-status-list button:hover, .service-status-list button:focus-visible { background: var(--panel-hover); }
.service-status-list button > span { min-width: 0; overflow: hidden; }
.service-status-list .pill { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.service-status-list b { margin-left: auto; font: 650 11px var(--mono); }
.service-status-open .pill { color: var(--accent); background: var(--accent-soft); }
.service-status-closed .pill { color: var(--muted); background: var(--bg-2); }
.service-bars { display: flex; height: 148px; align-items: end; gap: 5px; padding-top: 4px; }
.service-bars > div { display: grid; height: 100%; min-width: 0; flex: 1; grid-template-rows: minmax(0, 1fr) auto auto; align-items: end; gap: 2px; text-align: center; }
.service-bars span { display: block; width: min(100%, 26px); min-height: 4px; align-self: end; justify-self: center; border-radius: 6px 6px 2px 2px; background: var(--grad); }
.service-bars b { color: var(--text); font: 650 9.5px var(--mono); }
.service-bars small { color: var(--muted); font: 9px var(--mono); }
.service-ranking { display: flex; flex-direction: column; gap: 7px; }
.service-rank-row { display: grid; min-width: 0; grid-template-columns: minmax(90px, 150px) minmax(40px, 1fr) 28px; align-items: center; gap: 8px; }
.service-rank-row > span { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.service-rank-row i { width: 100%; height: 5px; border-radius: 4px; background: linear-gradient(90deg, var(--accent) var(--share), var(--border) var(--share)); }
.service-rank-row b { font: 650 10px var(--mono); text-align: right; }
.service-cost-overview { margin-top: 12px; padding: 18px; }
.service-cost-overview .card-head { align-items: flex-start; }
.service-cost-overview .card-head h3 { margin: 0; }
.service-cost-total { color: var(--accent); font: 750 24px/1.1 var(--mono); font-variant-numeric: tabular-nums; letter-spacing: -.035em; }
.service-cost-breakdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin-top: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--border); }
.service-cost-breakdown > div { display: flex; min-height: 78px; flex-direction: column; justify-content: center; gap: 4px; padding: 12px; background: var(--bg-2); }
.service-cost-breakdown span, .service-cost-breakdown small { color: var(--muted); font-size: 9.5px; }
.service-cost-breakdown b { font: 680 14px var(--mono); font-variant-numeric: tabular-nums; }
.service-cost-top { margin-top: 18px; }
.service-cost-top h4 { margin: 0 0 8px; font-size: 11px; }
.service-cost-top-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.service-cost-top-list > button { display: grid; min-width: 0; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 9px; border: 1px solid transparent; border-radius: 9px; background: var(--bg-2); color: var(--text); text-align: left; cursor: pointer; transition: border-color .2s var(--ease), background .2s var(--ease), transform .2s var(--ease); }
.service-cost-top-list > button:hover, .service-cost-top-list > button:focus-visible { border-color: var(--accent); background: var(--accent-soft); }
.service-cost-top-list > button:active { transform: translateY(1px); }
.service-cost-rank { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 7px; background: var(--panel-solid); color: var(--muted); font: 650 9px var(--mono); }
.service-cost-top-list button > span:nth-child(2), .service-cost-components { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.service-cost-top-list button > span:nth-child(2) b, .service-cost-top-list button > span:nth-child(2) small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-cost-top-list small { color: var(--muted); font-size: 9px; }
.service-cost-components { align-items: flex-end; }
.service-cost-components strong { font: 680 11px var(--mono); white-space: nowrap; }

.service-visit-days { display: flex; flex-direction: column; gap: 13px; }
.service-visit-day > h3 { margin: 0 0 7px 2px; color: var(--muted); font-size: 11px; font-weight: 650; text-transform: capitalize; }
.service-visit-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 9px; }
.service-visit-card { display: flex; min-width: 0; flex-direction: column; padding: 0; overflow: hidden; }
.service-visit-main { display: flex; min-width: 0; min-height: 118px; flex: 1; flex-direction: column; align-items: flex-start; gap: 3px; padding: 13px 14px 10px; border: 0; background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.service-visit-main:not(:disabled):hover, .service-visit-main:not(:disabled):focus-visible { background: var(--panel-hover); outline-offset: -3px; }
.service-visit-main:disabled { cursor: default; opacity: 1; }
.service-visit-time { color: var(--accent); font: 700 13px var(--mono); }
.service-visit-main strong { overflow-wrap: anywhere; font-size: 13px; }
.service-visit-main > span:not(.service-visit-time), .service-visit-main small { color: var(--muted); font-size: 11px; }
.service-visit-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 9px; border-top: 1px solid var(--border); background: var(--bg-2); }
.service-visit-actions .btn { min-width: 0; justify-content: center; white-space: nowrap; }

.service-toolbar { position: sticky; top: 70px; z-index: 10; padding: 8px; border: 1px solid var(--border); border-radius: 13px; background: color-mix(in srgb, var(--panel-solid) 92%, transparent); backdrop-filter: blur(14px); }
.service-toolbar > #status { width: 190px; min-width: 170px; }
.service-list-card { padding: 12px 14px 14px; }
.service-list-summary { padding: 2px 2px 10px; }
.service-table { min-width: 990px; }
.service-row { cursor: pointer; }
.service-row:hover td, .service-row:focus-visible td { background: var(--panel-hover); }
.service-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.service-client-name { max-width: 210px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-counts { display: inline-flex; flex-wrap: wrap; gap: 7px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.service-mobile-list { display: none; }

.service-drawer { width: min(860px, 100vw) !important; height: 100dvh; }
.service-drawer-head { align-items: center; }
.service-head-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 5px; color: var(--muted); font-size: 11px; }
.service-drawer-body { gap: 22px; }
.service-contact-card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-2); }
.service-contact-card > div:not(.service-contact-actions) { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.service-contact-card span, .service-contact-card small { color: var(--muted); font-size: 10.5px; }
.service-contact-card strong { overflow-wrap: anywhere; font-size: 13px; }
.service-contact-actions { display: flex; grid-column: 1 / -1; gap: 8px; }
.service-kv { grid-template-columns: minmax(100px, .45fr) minmax(0, 1fr); }
.service-description { margin-top: 12px; padding: 12px; border-left: 3px solid var(--accent); border-radius: 0 10px 10px 0; background: var(--bg-2); }
.service-description p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.service-description p + p { margin-top: 9px; }
.service-items { min-width: 720px; }
.service-items td small { display: block; margin-top: 3px; color: var(--muted); white-space: pre-wrap; }
.service-used-parts { min-width: 650px; }
.service-used-parts td small { display: block; margin-top: 2px; color: var(--muted); }
.service-timeline { position: relative; display: flex; flex-direction: column; gap: 0; }
.service-timeline::before { content: ''; position: absolute; top: 14px; bottom: 14px; left: 16px; width: 1px; background: var(--border-strong); }
.service-timeline article { position: relative; display: grid; grid-template-columns: 33px minmax(0, 1fr); gap: 10px; padding: 8px 0; }
.service-timeline-mark { z-index: 1; display: grid; width: 33px; height: 33px; place-items: center; border: 1px solid var(--border-strong); border-radius: 50%; background: var(--panel-solid); color: var(--accent); }
.service-timeline article > div { display: flex; min-width: 0; flex-wrap: wrap; align-content: flex-start; gap: 2px 8px; }
.service-timeline b { font-size: 12px; }
.service-timeline article span, .service-timeline article small { color: var(--muted); font-size: 11px; }
.service-timeline p { width: 100%; margin: 3px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
.service-section-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 9px; }
.service-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 9px; }
.service-file { min-width: 0; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); color: var(--text); text-align: left; }
.service-file:hover, .service-file:focus-visible { border-color: var(--accent); text-decoration: none; }
.service-photo { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; padding: 0; cursor: pointer; }
.service-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s var(--ease); }
.service-photo:hover img { transform: scale(1.025); }
.service-photo > span { position: absolute; right: 0; bottom: 0; left: 0; overflow: hidden; padding: 20px 8px 7px; background: linear-gradient(transparent, rgba(5, 8, 13, .88)); color: #fff; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.service-document { display: flex; min-height: 72px; align-items: center; gap: 9px; padding: 9px; }
.service-document > span { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.service-document b { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.service-document small { color: var(--muted); font-size: 9.5px; }
.service-lightbox { width: min(1100px, 94vw); max-width: 94vw; padding: 12px; }
.service-lightbox-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.service-lightbox-head strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.service-lightbox-image { display: block; width: 100%; max-height: calc(90dvh - 90px); border-radius: 10px; background: var(--bg-2); object-fit: contain; }
.service-note-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; margin-bottom: 12px; }
.service-note-form .btn { min-height: 38px; }
.service-notes, .service-reports { display: flex; flex-direction: column; gap: 8px; }
.service-notes article, .service-reports > article { padding: 11px 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.service-notes article > div { display: flex; justify-content: space-between; gap: 8px; }
.service-notes b { font-size: 11px; }
.service-notes time { color: var(--muted); font-size: 10px; }
.service-notes p { margin: 5px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
.service-report-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.service-report-head > div { display: flex; flex-direction: column; }
.service-report-head span { color: var(--muted); font-size: 10px; }
.service-report-body p { margin: 10px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
.service-report-body p strong { display: block; margin-bottom: 2px; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.service-report-meta { display: flex; flex-wrap: wrap; gap: 9px 16px; margin-top: 9px; color: var(--muted); font-size: 10.5px; }
.service-report-meta span { display: inline-flex; align-items: center; gap: 4px; }
.service-signature-preview { display: block; width: min(240px, 100%); margin-top: 10px; overflow: hidden; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: #fff; cursor: pointer; }
.service-signature-preview img { display: block; width: 100%; max-height: 90px; object-fit: contain; }
.service-report-modal { max-width: 720px; }
.service-report-form .foot { margin-top: 2px; }
.service-report-parts { display: flex; flex-direction: column; gap: 8px; }
.service-report-parts > span { color: var(--muted); font-size: 12px; font-weight: 550; }
.service-part-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; }
.service-part-results { display: flex; max-height: 190px; flex-direction: column; gap: 4px; overflow-y: auto; }
.service-part-choice { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-2); color: var(--text); text-align: left; cursor: pointer; }
.service-part-choice:hover, .service-part-choice:focus-visible, .service-part-choice.active { border-color: var(--accent); background: var(--accent-soft); }
.service-part-choice > span:first-child { display: flex; min-width: 0; flex-direction: column; }
.service-part-choice > span:last-child { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; }
.service-part-choice b { overflow-wrap: anywhere; font-size: 11px; }
.service-part-choice small, .service-part-choice > span:last-child { color: var(--muted); font-size: 9.5px; }
.service-production-parts { display: flex; flex-direction: column; gap: 6px; padding: 9px; border: 1px dashed var(--border-strong); border-radius: 9px; }
.service-production-parts > span { color: var(--muted); font-size: 10px; font-weight: 650; }
.service-production-parts > div { display: flex; flex-wrap: wrap; gap: 5px; }
.service-production-parts .btn { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.service-selected-parts { display: flex; flex-direction: column; gap: 6px; }
.service-selected-part { display: grid; grid-template-columns: minmax(140px, 1fr) 108px 78px 76px minmax(110px, .75fr) 34px; align-items: end; gap: 7px; padding: 9px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); }
.service-selected-part > div { display: flex; min-width: 0; flex-direction: column; align-self: center; }
.service-selected-part b { overflow-wrap: anywhere; font-size: 11px; }
.service-selected-part small, .service-selected-part label { color: var(--muted); font-size: 9.5px; }
.service-selected-part label { display: flex; flex-direction: column; gap: 3px; }
.service-selected-part .input { min-width: 0; }
.service-part-unit { align-self: center; color: var(--muted); font-size: 10px; }
.service-no-parts { display: flex; min-height: 40px; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); color: var(--text); font-size: 11px; cursor: pointer; }
.service-no-parts input { width: 18px; height: 18px; accent-color: var(--accent); }
.service-parts-validation { min-height: 16px; color: var(--warn); font-size: 10.5px; font-weight: 600; }
.service-parts-validation.error { color: var(--danger); }
.service-signature-field { display: flex; flex-direction: column; gap: 6px; }
.service-signature-field > span { color: var(--muted); font-size: 12px; font-weight: 550; }
.service-signature-field > small { color: var(--muted); font-size: 10.5px; }
.service-signature-field canvas { display: block; width: 100%; height: 190px; border: 1px solid var(--border-strong); border-radius: 10px; background: #fff; cursor: crosshair; touch-action: none; }
.service-signature-field .btn { align-self: flex-start; min-height: 40px; }

.service-cost-card { padding: 16px; border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--border)); border-radius: 14px; background: color-mix(in srgb, var(--accent-soft) 25%, var(--panel-solid)); }
.service-cost-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.service-cost-title h3 { margin: 0; }
.service-cost-title p { margin: 3px 0 0; color: var(--muted); font-size: 9.5px; }
.service-cost-title > strong { color: var(--accent); font: 760 22px/1.1 var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.service-cost-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.service-cost-summary > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; padding: 11px; border-radius: 10px; background: var(--bg-2); }
.service-cost-summary span, .service-cost-summary small { color: var(--muted); font-size: 9px; }
.service-cost-summary b { font: 680 13px var(--mono); font-variant-numeric: tabular-nums; }
.service-cost-warnings { display: flex; align-items: flex-start; gap: 9px; margin-top: 10px; padding: 10px; border: 1px solid color-mix(in srgb, var(--warn) 55%, var(--border)); border-radius: 10px; background: color-mix(in srgb, var(--warn) 9%, var(--bg-2)); color: var(--warn); }
.service-cost-warnings > div { display: flex; flex-direction: column; gap: 2px; }
.service-cost-warnings b { font-size: 10.5px; }
.service-cost-warnings span { font-size: 9.5px; }
.service-cost-subsection { margin-top: 16px; }
.service-cost-subsection h4 { margin: 0 0 8px; font-size: 11px; }
.service-cost-table { min-width: 790px; }
.service-cost-table td { vertical-align: middle; }
.service-cost-table td small { display: block; max-width: 190px; overflow-wrap: anywhere; color: var(--muted); }
.service-inline-cost { display: flex; width: 142px; align-items: center; gap: 4px; }
.service-inline-cost .input { min-width: 0; width: 98px; font-variant-numeric: tabular-nums; }
.service-travel-costs { display: flex; flex-direction: column; gap: 6px; }
.service-travel-costs form { display: grid; grid-template-columns: minmax(0, 1fr) 105px auto; align-items: end; gap: 8px; padding: 9px; border-radius: 9px; background: var(--bg-2); }
.service-travel-costs form > div, .service-travel-costs label { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.service-travel-costs b { font-size: 10.5px; }
.service-travel-costs small, .service-travel-costs label span { overflow-wrap: anywhere; color: var(--muted); font-size: 9px; }
.service-travel-costs .input { font-variant-numeric: tabular-nums; }

.service-settings-card .card-head > div { display: flex; min-width: 0; flex-wrap: wrap; align-items: baseline; gap: 5px 9px; }
.service-settings-card .field .hint { margin-top: 3px; line-height: 1.35; }
.service-distance-help { min-height: 49px; padding: 10px 12px; border-left: 3px solid var(--accent); border-radius: 0 9px 9px 0; background: var(--bg-2); }
.service-distance-help > div { display: none; }
.service-distance-help > div.active { display: flex; flex-direction: column; gap: 2px; }
.service-distance-help b { font-size: 10.5px; }
.service-distance-help span { color: var(--muted); font-size: 10px; line-height: 1.45; }
.service-settings-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }

.schedule-card.wincon-service { border-left-color: hsl(var(--visit-hue) 70% 54%); border-style: solid; background: color-mix(in srgb, var(--panel-solid) 94%, hsl(var(--visit-hue) 70% 54%)); }
article.schedule-card.wincon-service { cursor: default; }
.schedule-card.wincon-service:hover { border-color: hsl(var(--visit-hue) 70% 54%); }
.schedule-source { overflow: hidden; color: hsl(var(--visit-hue) 75% 64%); font-size: 8.5px; font-weight: 750; letter-spacing: .03em; text-overflow: ellipsis; white-space: nowrap; }
.schedule-visits-error { display: flex; align-items: center; gap: 7px; }

@media (max-width: 900px) {
  .service-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-insights { grid-template-columns: minmax(0, 1fr); }
  .service-toolbar { top: 64px; }
  .service-cost-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-cost-top-list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 620px) {
  .service-overview, .service-my-visits, .service-list-section { margin-bottom: 22px; }
  .service-overview-skeleton { height: 620px; }
  .service-metrics { gap: 8px; }
  .service-metric { min-height: 102px; padding: 13px; }
  .service-metric-value { font-size: 21px; }
  .service-insights { gap: 8px; margin-top: 8px; }
  .service-status-list { grid-template-columns: minmax(0, 1fr); }
  .service-bars { height: 130px; }
  .service-visit-cards { grid-template-columns: minmax(0, 1fr); }
  .service-visit-actions { position: sticky; bottom: calc(70px + env(safe-area-inset-bottom)); z-index: 2; }
  .service-toolbar { position: static; }
  .service-toolbar > *, .service-toolbar > #status { width: 100%; flex: 1 1 100%; }
  .service-toolbar .seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-toolbar .seg button { min-height: 44px; justify-content: center; }
  .service-toolbar .input, .service-drawer .input, .service-drawer .textarea, .service-report-modal .input, .service-report-modal .textarea { min-height: 44px; font-size: 16px; }
  .service-table-wrap { display: none; }
  .service-mobile-list { display: grid; gap: 8px; }
  .service-list-card { padding: 9px; }
  .service-complaint-card { display: flex; width: 100%; min-height: 44px; flex-direction: column; gap: 5px; padding: 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); color: var(--text); text-align: left; cursor: pointer; }
  .service-complaint-card:hover, .service-complaint-card:focus-visible { border-color: var(--accent); background: var(--accent-soft); }
  .service-complaint-card-top { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; }
  .service-complaint-card > strong { overflow-wrap: anywhere; font-size: 13px; }
  .service-complaint-card > small { color: var(--muted); font-size: 10.5px; }
  .service-complaint-card-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; color: var(--muted); font-size: 10px; }
  .service-complaint-card .service-counts { margin-top: 3px; }
  .service-drawer { inset: 0; width: 100vw !important; max-width: none; border-left: 0; }
  .service-drawer-head { padding-top: max(14px, env(safe-area-inset-top)); }
  .service-drawer-body { padding-bottom: max(90px, calc(74px + env(safe-area-inset-bottom))); }
  .service-contact-card { grid-template-columns: minmax(0, 1fr); }
  .service-contact-actions { position: sticky; bottom: calc(68px + env(safe-area-inset-bottom)); z-index: 4; grid-column: 1; padding: 7px; border: 1px solid var(--border-strong); border-radius: 11px; background: var(--panel-solid); box-shadow: var(--shadow); }
  .service-contact-actions .btn { flex: 1; min-height: 44px; justify-content: center; }
  .service-items, .service-used-parts, .service-cost-table { display: block; min-width: 0; }
  .service-items thead, .service-used-parts thead, .service-cost-table thead { display: none; }
  .service-items tbody, .service-used-parts tbody, .service-cost-table tbody { display: grid; gap: 8px; }
  .service-items tr, .service-used-parts tr, .service-cost-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); }
  .service-items td, .service-used-parts td, .service-cost-table td { display: flex; min-width: 0; flex-direction: column; gap: 2px; padding: 0; border: 0; overflow-wrap: anywhere; }
  .service-items td::before, .service-used-parts td::before, .service-cost-table td::before { content: attr(data-label); color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
  .service-items td:nth-child(2) { grid-column: 1 / -1; }
  .service-section-actions .btn { min-height: 44px; flex: 1 1 150px; justify-content: center; }
  .service-files { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-part-search { grid-template-columns: minmax(0, 1fr); }
  .service-part-search .btn { min-height: 44px; justify-content: center; }
  .service-production-parts .btn { min-height: 44px; flex: 1 1 100%; justify-content: flex-start; }
  .service-selected-part { grid-template-columns: minmax(0, 1fr) minmax(90px, .65fr) 42px; align-items: end; }
  .service-selected-part > div, .service-selected-part-name, .service-part-note { grid-column: 1 / -1; }
  .service-selected-part .service-part-unit { display: flex; min-height: 44px; align-items: center; }
  .service-selected-part > button { min-height: 44px; }
  .service-selected-part > [data-remove-part] { grid-column: 3; justify-self: end; }
  .service-document { grid-column: 1 / -1; }
  .service-note-form { grid-template-columns: minmax(0, 1fr); }
  .service-note-form .btn { min-height: 44px; justify-content: center; }
  .service-report-modal { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; overflow-y: auto; padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom)); border: 0; border-radius: 0; }
  .service-report-form { grid-template-columns: minmax(0, 1fr); }
  .service-report-form .field, .service-report-form .full { grid-column: 1; }
  .service-report-form .foot { position: sticky; bottom: 0; z-index: 3; padding: 9px 0 max(2px, env(safe-area-inset-bottom)); background: var(--panel-solid); }
  .service-report-form .foot .btn { min-height: 44px; flex: 1; justify-content: center; }
  .service-signature-field canvas { height: 180px; }
  .service-cost-overview { padding: 14px; }
  .service-cost-total { font-size: 18px; }
  .service-cost-breakdown { gap: 1px; }
  .service-cost-breakdown > div { min-height: 70px; padding: 10px; }
  .service-cost-top-list > button { grid-template-columns: 24px minmax(0, 1fr); }
  .service-cost-components { grid-column: 2; align-items: flex-start; }
  .service-cost-title { align-items: flex-end; }
  .service-cost-title > strong { font-size: 18px; }
  .service-cost-summary { grid-template-columns: minmax(0, 1fr); }
  .service-cost-table td:first-child, .service-cost-table td:last-child { grid-column: 1 / -1; }
  .service-inline-cost { width: 100%; }
  .service-inline-cost .input { width: 100%; }
  .service-travel-costs form { grid-template-columns: minmax(0, 1fr); }
  .service-travel-costs .btn { min-height: 44px; justify-content: center; }
  .service-settings-actions .btn { min-height: 44px; flex: 1 1 180px; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .service-photo img { transition: none; }
  .service-photo:hover img { transform: none; }
}

/* ---------- Wycena materiałowa — szczegóły (Claude) ---------- */
.material-note { margin: .5rem 0; line-height: 1.45; }
.material-h { margin: 1rem 0 .4rem; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; color: var(--text-2, var(--muted)); }
.material-section { border: 1px solid var(--line, hsl(220 15% 25% / .6)); border-radius: 12px; margin: .4rem 0; background: var(--bg-2, transparent); overflow: hidden; }
.material-section > summary { display: grid; grid-template-columns: 1fr auto auto; gap: .2rem .8rem; align-items: baseline; padding: .65rem .85rem .65rem 1.5rem; cursor: pointer; list-style: none; position: relative; }
.material-section > summary::-webkit-details-marker { display: none; }
.material-section > summary::before { content: '▸'; position: absolute; left: .6rem; top: .65rem; opacity: .6; transition: transform .2s ease; }
.material-section[open] > summary::before { transform: rotate(90deg); }
.material-section > summary .small { grid-column: 1 / -1; }
.material-section > summary:hover { background: hsl(220 30% 50% / .08); }
.material-section .table-wrap { padding: 0 .4rem .5rem; }
.material-lines td { vertical-align: top; }
.material-lines td:first-child { min-width: 22ch; }
.material-lines td .small { max-width: 34ch; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .material-section > summary { grid-template-columns: 1fr auto; }
  .material-lines th:last-child, .material-lines td:last-child { display: none; }
}

/* ============ Produkcja — pulpit hali i paczki (Codex) ============ */
.pill.s-Otwarte { color: var(--accent); background: var(--accent-soft); }
.pill.s-Zablokowane { color: var(--danger); background: var(--danger-soft); }
.pill.s-W-produkcji { color: var(--warn); background: var(--warn-soft); }
.pill.s-Zakończone { color: var(--success); background: var(--success-soft); }
.pill.s-Archiwum { color: var(--muted); background: var(--panel-hover); }
.production-dashboard,
.production-section { margin-bottom: 30px; }
.production-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 13px; }
.production-section-head h2 { margin: 0; font-size: 18px; letter-spacing: -.025em; text-wrap: balance; }
.production-section-head p { max-width: 64ch; margin: 3px 0 0; color: var(--muted); font-size: 11.5px; line-height: 1.45; text-wrap: pretty; }
.production-live-mark { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; color: var(--muted); font-size: 10.5px; }
.production-live-mark i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }

.production-dashboard-skeleton { height: 430px; }
.production-stations-skeleton { height: 255px; }
.production-packs-skeleton { height: 270px; }
.production-drawer-skeleton { height: 65vh; }
.production-metrics { display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); gap: 8px; }
.production-metric { min-width: 0; min-height: 112px; padding: 15px 14px 17px; border: 1px solid var(--border); border-radius: 13px; background: color-mix(in srgb, var(--panel-solid) 92%, var(--bg-2)); box-shadow: 0 14px 34px -28px hsl(var(--accent-h) 50% 8% / .9); }
.production-metric > span { display: block; overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 650; letter-spacing: .035em; text-overflow: ellipsis; white-space: nowrap; }
.production-metric strong { display: block; margin-top: 11px; font: 760 25px/1 var(--mono); font-variant-numeric: tabular-nums; letter-spacing: -.045em; }
.production-metric small { display: block; margin-top: 8px; overflow-wrap: anywhere; color: var(--dim); font-size: 9.5px; line-height: 1.3; }
.production-metric.danger { border-color: color-mix(in srgb, var(--danger) 46%, var(--border)); background: color-mix(in srgb, var(--danger-soft) 60%, var(--panel-solid)); }
.production-metric.danger strong { color: var(--danger); }
.production-metric.warn { border-color: color-mix(in srgb, var(--warn) 46%, var(--border)); background: color-mix(in srgb, var(--warn-soft) 55%, var(--panel-solid)); }
.production-metric.warn strong { color: var(--warn); }

.production-insights { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 10px; margin-top: 10px; }
.production-chart-card { min-width: 0; padding: 15px 16px 13px; border: 1px solid var(--border); border-radius: 14px; background: var(--panel-solid); }
.production-chart-card > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.production-chart-card h3 { margin: 0; font-size: 12px; letter-spacing: -.01em; }
.production-chart-card > div:first-child > span { color: var(--dim); font-size: 9.5px; }
.production-daily-chart { display: grid; height: 170px; grid-template-columns: repeat(30, minmax(3px, 1fr)); align-items: end; gap: clamp(2px, .35vw, 6px); padding-top: 15px; }
.production-daily-column { display: grid; height: 100%; min-width: 0; grid-template-rows: 15px minmax(0, 1fr) 17px; align-items: end; justify-items: center; }
.production-daily-column b { color: var(--muted); font: 600 8.5px var(--mono); }
.production-daily-column i { display: block; width: 100%; max-width: 20px; min-height: 2px; height: var(--production-bar); border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 82%, white), var(--accent)); box-shadow: 0 -5px 15px -9px var(--accent); transition: height .35s var(--ease), filter .2s ease; }
.production-daily-column:hover i { filter: brightness(1.2); }
.production-daily-column span { min-width: 27px; color: var(--dim); font: 500 8px var(--mono); text-align: center; }
.production-station-bars { display: flex; min-height: 170px; flex-direction: column; justify-content: center; gap: 8px; padding-top: 12px; }
.production-station-bar { display: grid; grid-template-columns: minmax(85px, 1fr) minmax(90px, 1.8fr) 30px; align-items: center; gap: 8px; }
.production-station-bar > span { overflow: hidden; color: var(--muted); font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.production-station-bar > i { display: block; height: 6px; overflow: hidden; border-radius: 99px; background: var(--bg-2); }
.production-station-bar > i b { display: block; width: var(--production-bar); height: 100%; border-radius: inherit; background: var(--accent-2); }
.production-station-bar > strong { font: 650 10px var(--mono); text-align: right; }

.production-stations-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); gap: 9px; }
.production-station-card { min-width: 0; min-height: 190px; padding: 16px; border: 1px solid var(--border); border-top: 3px solid var(--border-strong); border-radius: 12px 12px 15px 15px; background: color-mix(in srgb, var(--panel-solid) 93%, var(--bg-2)); box-shadow: 0 18px 38px -35px hsl(var(--accent-h) 60% 5% / .95); }
.production-station-card.mandatory { border-top-color: var(--accent); }
.production-station-title { display: flex; min-height: 48px; align-items: flex-start; justify-content: space-between; gap: 8px; }
.production-station-title > div { min-width: 0; }
.production-station-title span { display: block; overflow: hidden; color: var(--dim); font-size: 9px; letter-spacing: .045em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.production-station-title h3 { margin: 4px 0 0; overflow-wrap: anywhere; font-size: 15px; line-height: 1.15; letter-spacing: -.02em; }
.production-station-title > b { flex: 0 0 auto; padding: 3px 6px; border-radius: 5px; background: var(--accent-soft); color: var(--accent); font-size: 8px; letter-spacing: .035em; text-transform: uppercase; }
.production-station-counts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 13px 0; overflow: hidden; border-radius: 9px; background: var(--border); }
.production-station-counts > div { min-width: 0; padding: 10px 6px; background: var(--bg-2); text-align: center; }
.production-station-counts strong { display: block; font: 750 19px/1 var(--mono); font-variant-numeric: tabular-nums; }
.production-station-counts span { display: block; margin-top: 5px; color: var(--dim); font-size: 8.5px; }
.production-last-scan { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.production-last-scan .icon { flex: 0 0 auto; }
.production-last-scan b { color: var(--text); font-weight: 620; }

.production-toolbar { position: sticky; top: 66px; z-index: 8; padding: 8px; border: 1px solid var(--border); border-radius: 13px; background: color-mix(in srgb, var(--panel-solid) 92%, transparent); box-shadow: 0 10px 30px -24px hsl(var(--accent-h) 60% 4% / .9); backdrop-filter: blur(14px); }
.production-toolbar > #production-status { width: 172px; min-width: 150px; }
.production-toolbar .search { flex: 1; min-width: 230px; }
.production-packs-shell { padding: 12px; }
.production-list-summary { display: flex; min-height: 29px; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 0 3px 8px; color: var(--dim); font-size: 10px; }
.production-packs-table table { min-width: 760px; }
.production-packs-table td { transition: background .18s ease; }
.production-packs-table tr:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.production-packs-table tr.production-pack-late td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.production-pack-number { display: flex; align-items: center; gap: 6px; }
.production-pack-number b { max-width: 230px; overflow: hidden; font: 650 11.5px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.production-packs-table td > small { display: block; max-width: 240px; margin-top: 3px; overflow: hidden; color: var(--dim); font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.production-progress { display: grid; min-width: 115px; grid-template-columns: minmax(62px, 1fr) 43px; align-items: center; gap: 8px; }
.production-progress > span { height: 7px; overflow: hidden; border: 1px solid var(--border); border-radius: 99px; background: var(--bg-2); }
.production-progress i { display: block; width: var(--production-progress); height: 100%; border-radius: inherit; background: var(--grad); transition: width .3s var(--ease); }
.production-progress b { font: 620 10px var(--mono); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.production-pack-dates { display: flex; min-width: 120px; flex-direction: column; gap: 3px; font-size: 9.5px; }
.production-pack-dates b { font-weight: 620; }
.production-pack-dates.late > span:first-child,
.production-pack-dates.late > span:first-child b { color: var(--danger); }
.production-pack-activity { color: var(--muted); font-size: 10px; white-space: nowrap; }
.production-pack-cards { display: none; }

.production-drawer-head h2 span { font-size: 14px; }
.production-drawer-body { gap: 22px; }
.production-pack-overview { display: grid; grid-template-columns: 1.35fr repeat(3, minmax(100px, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--border); }
.production-pack-overview > div { display: flex; min-width: 0; min-height: 74px; flex-direction: column; justify-content: center; gap: 7px; padding: 11px; background: var(--bg-2); }
.production-pack-overview > div > span { color: var(--dim); font-size: 9px; }
.production-pack-overview > div > b { overflow-wrap: anywhere; font: 620 11px var(--mono); }
.production-pack-orders { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.production-pack-orders > button,
.production-pack-orders > div { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); color: var(--text); text-align: left; }
.production-pack-orders > button { font: inherit; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.production-pack-orders > button:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.production-pack-orders > button:active { transform: translateY(1px); }
.production-pack-orders > button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.production-pack-orders > button > span:first-child,
.production-pack-orders > div > span:first-child { display: flex; min-width: 0; flex-direction: column; }
.production-pack-orders b { overflow: hidden; font: 620 10.5px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.production-pack-orders small { margin-top: 3px; overflow: hidden; color: var(--dim); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.production-items-section > h3 { justify-content: space-between; }
.production-items-section > h3 label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 9.5px; font-weight: 550; letter-spacing: 0; text-transform: none; cursor: pointer; }
.production-items-section > h3 input { width: 15px; height: 15px; accent-color: var(--accent); }
.production-order-group { margin-top: 12px; }
.production-order-group > h4 { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 7px; color: var(--muted); font: 650 10.5px var(--mono); }
.production-order-group > h4 span { color: var(--dim); font: 500 9px var(--font); }
.production-order-group > div { display: flex; flex-direction: column; gap: 7px; }
.production-item { padding: 11px; border: 1px solid var(--border); border-left: 3px solid var(--warn); border-radius: 10px; background: var(--bg-2); }
.production-item.finished { border-left-color: var(--success); }
.production-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.production-item-head > span { display: flex; min-width: 0; flex-direction: column; }
.production-item-head > span:last-child { flex: 0 0 auto; align-items: flex-end; text-align: right; }
.production-item-head b { overflow-wrap: anywhere; font-size: 10.5px; }
.production-item-head small { margin-top: 2px; color: var(--dim); font-size: 9px; }
.production-scan-path { display: flex; align-items: stretch; gap: 5px; margin-top: 9px; overflow-x: auto; padding: 2px 1px 4px; scrollbar-width: thin; }
.production-scan-path > span { display: flex; flex: 0 0 auto; min-width: 112px; flex-direction: column; padding: 7px 8px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel-solid); }
.production-scan-path b { font-size: 9px; }
.production-scan-path small { margin-top: 3px; color: var(--dim); font-size: 8px; }
.production-scan-path > i { align-self: center; color: var(--dim); font-style: normal; }

.order-production-packs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; margin-bottom: 10px; }
.order-production-packs > button { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.order-production-packs > button:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.order-production-packs > button:active { transform: translateY(1px); }
.order-production-packs > button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.order-production-packs > button > span { display: flex; min-width: 0; flex-direction: column; }
.order-production-packs > button > span:last-child { flex: 0 0 auto; align-items: flex-end; }
.order-production-packs b { overflow: hidden; font: 620 10px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.order-production-packs small { margin-top: 3px; overflow: hidden; color: var(--dim); font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
.order-production-items { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; }
.order-production-items > div { display: grid; grid-template-columns: 1.2fr 1fr 74px; align-items: center; gap: 10px; padding: 9px 10px; border-bottom: 1px solid var(--border); }
.order-production-items > div:last-child { border-bottom: 0; }
.order-production-items .order-production-items-head { background: var(--bg-2); color: var(--dim); font-size: 8.5px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.order-production-items > div > span { display: flex; min-width: 0; flex-direction: column; }
.order-production-items b { overflow: hidden; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.order-production-items small { margin-top: 2px; overflow: hidden; color: var(--dim); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.order-production-items .done,
.order-production-items .open { display: inline-flex; align-items: center; justify-self: start; padding: 3px 6px; border-radius: 5px; font-size: 8.5px; font-weight: 650; }
.order-production-items .done { background: var(--success-soft); color: var(--success); }
.order-production-items .open { background: var(--warn-soft); color: var(--warn); }

@media (max-width: 1120px) {
  .production-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .production-insights { grid-template-columns: minmax(0, 1fr); }
  .production-station-bars { min-height: 140px; }
}

@media (max-width: 760px) {
  .production-dashboard,
  .production-section { margin-bottom: 24px; }
  .production-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .production-metric { min-height: 101px; padding: 13px; }
  .production-section-head { align-items: flex-start; }
  .production-daily-chart { height: 145px; gap: 2px; }
  .production-daily-column b { display: none; }
  .production-toolbar { position: static; }
  .production-toolbar .seg { display: grid; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .production-toolbar .seg button { min-height: 42px; justify-content: center; }
  .production-toolbar > #production-status,
  .production-toolbar .search,
  .production-toolbar > .btn { width: 100%; min-width: 0; }
  .production-toolbar .input { min-height: 44px; font-size: 16px; }
  .production-packs-table { display: none; }
  .production-pack-cards { display: grid; gap: 8px; }
  .production-pack-card { display: flex; width: 100%; min-width: 0; flex-direction: column; gap: 12px; padding: 12px; border: 1px solid var(--border); border-left: 3px solid var(--border-strong); border-radius: 11px; background: var(--bg-2); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
  .production-pack-card.late { border-left-color: var(--danger); }
  .production-pack-card:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
  .production-pack-card:active { transform: translateY(1px); }
  .production-pack-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .production-pack-card-head,
  .production-pack-card-foot { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 10px; }
  .production-pack-card-head > span { display: flex; min-width: 0; flex-direction: column; }
  .production-pack-card-head > span:last-child { flex: 0 0 auto; align-items: flex-end; gap: 4px; }
  .production-pack-card-head b { overflow: hidden; font: 650 12px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
  .production-pack-card-head small,
  .production-pack-card-foot > small { margin-top: 3px; color: var(--dim); font-size: 9px; }
  .production-pack-card .production-progress { width: 100%; grid-template-columns: minmax(0, 1fr) 44px; }
  .production-pack-card-foot { align-items: flex-end; }
  .production-pack-card-foot > small { text-align: right; }
  .production-pack-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .production-pack-orders,
  .order-production-packs { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 520px) {
  .production-section-head { flex-direction: column; gap: 7px; }
  .production-live-mark { align-self: flex-start; }
  .production-stations-grid { grid-template-columns: minmax(0, 1fr); }
  .production-station-card { min-height: 180px; }
  .production-packs-shell { padding: 8px; }
  .production-list-summary { flex-direction: column; gap: 3px; }
  .production-pack-overview { grid-template-columns: minmax(0, 1fr); }
  .production-pack-overview > div { min-height: 62px; }
  .production-item-head { flex-direction: column; gap: 6px; }
  .production-item-head > span:last-child { align-items: flex-start; text-align: left; }
  .production-items-section > h3 { align-items: flex-start; flex-direction: column; }
  .production-items-section > h3 label { min-height: 36px; }
  .order-production-items { border: 0; gap: 7px; }
  .order-production-items .order-production-items-head { display: none; }
  .order-production-items > div { grid-template-columns: minmax(0, 1fr) auto; gap: 7px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-2); }
  .order-production-items > div > span:nth-child(2) { grid-column: 1; }
  .order-production-items > div > span:last-child { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
}

@media (prefers-reduced-motion: reduce) {
  .production-daily-column i,
  .production-progress i,
  .production-pack-card,
  .production-pack-orders > button,
  .order-production-packs > button { transition: none; }
}

/* ============ Powiadomienia, rabaty i uzupełnienia Produkcji (Codex) ============ */
.notification-root { position: relative; flex: 0 0 auto; }
.notification-bell {
  position: relative; display: grid; width: 40px; height: 40px; place-items: center; padding: 0;
  border: 1px solid var(--border); border-radius: 11px; background: var(--panel); color: var(--muted);
  cursor: pointer; transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}
.notification-bell:hover, .notification-bell.has-unread { border-color: var(--border-strong); color: var(--text); background: var(--panel-hover); }
.notification-bell:active { transform: translateY(1px) scale(.98); }
.notification-bell:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.notification-bell .icon { width: 19px; height: 19px; }
.notification-count {
  position: absolute; top: -6px; right: -7px; display: grid; min-width: 18px; height: 18px; place-items: center; padding: 0 4px;
  border: 2px solid var(--bg); border-radius: 9px; background: var(--accent); color: #fff;
  font: 750 9px/1 var(--mono); font-variant-numeric: tabular-nums;
}
.notification-count.has-alerts { background: var(--danger); }
.notification-backdrop { position: fixed; inset: 0; z-index: 70; background: transparent; }
.notification-panel {
  position: fixed; z-index: 71; top: var(--notification-top, 72px); right: var(--notification-right, 16px); display: flex; width: min(430px, calc(100vw - 32px));
  max-height: min(720px, calc(100dvh - 88px)); flex-direction: column; overflow: hidden;
  border: 1px solid var(--border-strong); border-radius: 16px; background: var(--panel-solid);
  box-shadow: 0 28px 75px -28px hsl(var(--accent-h) 55% 3% / .95); animation: notificationIn .2s var(--ease) both;
}
@keyframes notificationIn { from { opacity: 0; transform: translateY(-8px) scale(.985); } to { opacity: 1; transform: none; } }
.notification-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 12px; border-bottom: 1px solid var(--border); }
.notification-panel-head h2 { margin: 2px 0 0; font-size: 18px; letter-spacing: -.025em; }
.notification-tools { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--border); background: var(--bg-2); }
.notification-tools .seg { flex-wrap: nowrap; }
.notification-read-all { padding: 5px 0; border: 0; background: transparent; color: var(--accent); font: 600 10.5px var(--font); text-align: right; cursor: pointer; }
.notification-read-all:hover { text-decoration: underline; }
.notification-read-all:focus-visible { border-radius: 5px; outline: 2px solid var(--accent); outline-offset: 2px; }
.notification-read-all:disabled { color: var(--dim); cursor: default; text-decoration: none; }
.notification-list { min-height: 190px; overflow-y: auto; overscroll-behavior: contain; }
.notification-item {
  position: relative; display: grid; width: 100%; grid-template-columns: 38px minmax(0, 1fr) 8px; align-items: flex-start; gap: 10px;
  padding: 13px 14px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text);
  font: inherit; text-align: left; cursor: pointer; transition: background .18s ease, transform .18s ease;
}
.notification-item:last-child { border-bottom: 0; }
.notification-item:hover { background: var(--panel-hover); }
.notification-item:active { transform: scale(.995); }
.notification-item:focus-visible { z-index: 1; outline: 2px solid var(--accent); outline-offset: -2px; }
.notification-item:disabled { cursor: wait; opacity: .65; }
.notification-item.unread { background: color-mix(in srgb, var(--accent-soft) 46%, transparent); }
.notification-kind { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 10px; background: var(--accent-soft); color: var(--accent); }
.notification-kind .icon { width: 17px; height: 17px; }
.notification-item.severity-warning .notification-kind { background: var(--warn-soft); color: var(--warn); }
.notification-item.severity-alert .notification-kind { background: var(--danger-soft); color: var(--danger); }
.notification-copy { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.notification-title { overflow-wrap: anywhere; font-size: 12.5px; font-weight: 650; line-height: 1.35; }
.notification-item.unread .notification-title { font-weight: 750; }
.notification-body { display: -webkit-box; overflow: hidden; color: var(--muted); font-size: 10.5px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.notification-time { margin-top: 2px; color: var(--dim); font-size: 9.5px; }
.notification-unread-dot { width: 7px; height: 7px; margin-top: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.severity-alert .notification-unread-dot { background: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
.notification-empty { display: flex; min-height: 220px; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 28px; color: var(--dim); text-align: center; }
.notification-empty .icon { width: 28px; height: 28px; margin-bottom: 4px; }
.notification-empty strong { color: var(--muted); font-size: 13px; }
.notification-empty span { max-width: 30ch; font-size: 10.5px; line-height: 1.45; }
.notification-empty.error .icon, .notification-empty.error strong { color: var(--danger); }
.notification-loading { display: grid; gap: 8px; padding: 12px; }
.notification-loading .skeleton { height: 67px; }

.quote-discount-alert { display: flex; align-items: flex-start; gap: 10px; padding: 12px 13px; border: 1px solid color-mix(in srgb, var(--danger) 58%, var(--border)); border-radius: 12px; background: var(--danger-soft); color: var(--danger); }
.quote-discount-alert > .icon { flex: 0 0 auto; margin-top: 1px; }
.quote-discount-alert > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.quote-discount-alert strong { font-size: 13px; }
.quote-discount-alert span { font-size: 10.5px; line-height: 1.45; }
.quote-discount-filter.active, .quote-discount-filter[aria-pressed='true'] { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }
.quote-discount-badge { border-color: color-mix(in srgb, var(--danger) 55%, transparent); background: var(--danger-soft); color: var(--danger); font-family: var(--font); }
.quote-pricing { display: flex; flex-direction: column; gap: 12px; }
.quote-pricing > h3 { margin-bottom: 0; }
.quote-pricing-current { display: grid; gap: 7px; }
.quote-pricing-current > span, .quote-pricing-categories legend { color: var(--dim); font-size: 9.5px; font-weight: 650; letter-spacing: .045em; text-transform: uppercase; }
.quote-pricing-current > div { display: flex; flex-wrap: wrap; gap: 6px; }
.quote-discount-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg-2); color: var(--muted); font: 550 10px var(--mono); }
.quote-discount-chip b { color: var(--text); font: 650 9.5px var(--font); }
.quote-pricing-baseline { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 3px 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-2); }
.quote-pricing-baseline > span { color: var(--muted); font-size: 10.5px; }
.quote-pricing-baseline strong { font: 700 15px var(--mono); font-variant-numeric: tabular-nums; }
.quote-pricing-baseline small { grid-column: 1 / -1; color: var(--dim); font-size: 9.5px; }
.quote-pricing-preview-note { display: flex; align-items: flex-start; gap: 8px; padding: 9px 10px; border-radius: 9px; background: var(--accent-soft); color: var(--accent); font-size: 10.5px; line-height: 1.45; }
.quote-pricing-preview-note .icon { flex: 0 0 auto; margin-top: 1px; }
.quote-pricing-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.quote-pricing-quick .btn.active { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.quote-pricing-inputs { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: end; gap: 12px; }
.quote-pricing-range { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 39px; color: var(--dim); font: 500 9px var(--mono); }
.quote-pricing-range input { width: 100%; accent-color: var(--accent); cursor: pointer; }
.quote-pricing-categories { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; border: 0; }
.quote-pricing-categories legend { width: 100%; margin-bottom: 2px; }
.quote-pricing-categories label { display: inline-flex; align-items: center; gap: 6px; min-height: 35px; padding: 6px 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-2); color: var(--muted); font-size: 10.5px; cursor: pointer; }
.quote-pricing-categories label:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); background: var(--accent-soft); color: var(--text); }
.quote-pricing-categories input { width: 15px; height: 15px; margin: 0; accent-color: var(--accent); }
.quote-pricing-feedback { min-height: 0; color: var(--dim); font-size: 10.5px; }
.quote-pricing-feedback:not(:empty) { min-height: 32px; padding: 8px 10px; border-radius: 8px; background: var(--bg-2); }
.quote-pricing-feedback.error { background: var(--danger-soft); color: var(--danger); }
.quote-pricing-result { transition: opacity .18s ease; }
.quote-pricing-result.loading { opacity: .48; }
.quote-pricing-result-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--border); border-radius: 11px; background: var(--border); }
.quote-pricing-result-grid > div { display: flex; min-width: 0; min-height: 74px; flex-direction: column; justify-content: center; gap: 5px; padding: 10px; background: var(--bg-2); }
.quote-pricing-result-grid span { color: var(--dim); font-size: 9px; }
.quote-pricing-result-grid strong { overflow-wrap: anywhere; font: 700 13px var(--mono); font-variant-numeric: tabular-nums; }
.quote-pricing-result-grid small { color: var(--muted); font: 600 9px var(--mono); }
.quote-pricing-diff.positive strong { color: var(--success); }
.quote-pricing-diff.negative strong { color: var(--danger); }
.quote-pricing-items { margin-top: 10px; border-top: 1px solid var(--border); }
.quote-pricing-items > summary { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 10.5px; font-weight: 650; cursor: pointer; }
.quote-pricing-items > summary span { color: var(--dim); font: 550 9.5px var(--mono); }
.quote-pricing-items table { min-width: 690px; }
.quote-pricing-items td b { display: block; max-width: 250px; overflow: hidden; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.quote-pricing-items td small { display: block; margin-top: 2px; color: var(--dim); font-size: 8.5px; }
.quote-pricing-items tr.quote-pricing-fixed { opacity: .66; }
.quote-pricing-unavailable { padding: 11px 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }

.production-metrics { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.production-metric-action { appearance: none; width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.production-metric-action:hover { border-color: var(--warn); transform: translateY(-1px); }
.production-metric-action:active { transform: translateY(1px); }
.production-metric-action:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.production-metric-action.active, .production-metric-action[aria-pressed='true'] { border-color: var(--warn); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--warn) 65%, transparent), 0 15px 34px -28px var(--warn); }

@media (max-width: 760px) {
  .notification-panel { position: fixed; inset: 0; width: 100vw; max-height: 100dvh; border: 0; border-radius: 0; animation-name: notificationMobileIn; }
  @keyframes notificationMobileIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
  .notification-panel-head { padding: max(15px, env(safe-area-inset-top)) 16px 13px; }
  .notification-tools { align-items: stretch; flex-direction: column; }
  .notification-tools .seg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .notification-tools .seg button { min-height: 40px; justify-content: center; }
  .notification-read-all { min-height: 36px; text-align: center; }
  .notification-list { flex: 1; padding-bottom: max(16px, env(safe-area-inset-bottom)); }
  .quote-pricing-inputs { grid-template-columns: minmax(0, 1fr); }
  .quote-pricing-inputs .input { min-height: 44px; font-size: 16px; }
  .quote-pricing-result-grid { grid-template-columns: minmax(0, 1fr); }
  .quote-pricing-result-grid > div { min-height: 62px; }
}

@media (prefers-reduced-motion: reduce) {
  .notification-panel, .notification-bell, .notification-item, .quote-pricing-result, .production-metric-action { animation: none; transition: none; }
}

/* ============ Logistyka: planowanie tras i widok kierowcy ============ */
.log-shell { display: flex; flex-direction: column; gap: 16px; }
.log-tabs { max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.log-tabs button { flex: 0 0 auto; }
#log-content { display: flex; min-width: 0; flex-direction: column; gap: 16px; }
.log-filterbar, .log-plan-head { display: flex; align-items: end; gap: 12px; }
.log-filterbar .field, .log-plan-head .field { min-width: 170px; }
.log-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.log-kpi .value { overflow-wrap: anywhere; }
.log-planner-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(300px, .6fr); gap: 16px; align-items: start; }
.log-orders, .log-vehicle-choices { display: flex; max-height: 560px; flex-direction: column; gap: 8px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; }
.log-order, .log-vehicle-choice { display: flex; min-width: 0; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-2); cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.log-order:hover, .log-vehicle-choice:hover { border-color: var(--border-strong); background: var(--panel-hover); }
.log-order:has(input:checked), .log-vehicle-choice:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 52%, var(--border)); }
.log-order.missing { border-color: color-mix(in srgb, var(--danger) 55%, var(--border)); background: var(--danger-soft); }
.log-order > input, .log-vehicle-choice > input { width: 18px; height: 18px; flex: 0 0 auto; margin: 0; accent-color: var(--accent); }
.log-order b, .log-order small, .log-vehicle-choice b, .log-vehicle-choice small { display: block; overflow-wrap: anywhere; }
.log-order small, .log-vehicle-choice small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.log-order-meta { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 5px; }
.log-order-meta small { margin: 0; text-transform: capitalize; }
.log-main-action { width: 100%; min-height: 48px; margin-top: 14px; }
.log-proposal-head, .log-section-head, .log-driver-head, .log-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.log-proposal-head h2, .log-section-head h2, .log-driver-head h2, .log-detail-head h2 { margin: 0; font-size: 18px; letter-spacing: -.02em; }
.log-warning-text { color: var(--warn); }
.log-route-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 14px; align-items: start; }
.log-route-card.overload { border-color: var(--danger); }
.log-route-card.overload .progress > i { background: var(--danger); }
.log-capacity { display: grid; gap: 6px; margin-bottom: 13px; }
.log-route-config { display: grid; grid-template-columns: minmax(110px, .45fr) minmax(170px, 1fr); gap: 10px; margin-bottom: 13px; }
.log-stop-list { display: flex; min-height: 54px; flex-direction: column; gap: 7px; padding: 4px; border: 1px dashed transparent; border-radius: 12px; }
.log-stop-list:empty { border-color: var(--border-strong); }
.log-stop-list:empty::after { content: 'Przeciągnij tu zamówienie'; padding: 18px; color: var(--dim); text-align: center; }
.log-stop { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 9px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); cursor: grab; transition: border-color .16s ease, opacity .16s ease, transform .16s ease; }
.log-stop:hover { border-color: var(--border-strong); }
.log-stop.dragging, .log-timeline-stop.dragging { opacity: .45; transform: scale(.985); }
.log-stop b, .log-stop small { display: block; overflow-wrap: anywhere; }
.log-stop small { color: var(--muted); font-size: 10.5px; }
.log-seq { display: grid; width: 27px; height: 27px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--accent-soft); color: var(--accent); font-size: 11px; font-weight: 750; }
.log-plan-move { display: flex; flex: 0 0 auto; align-items: center; gap: 3px; }
.log-plan-move .btn { width: 30px; min-width: 30px; height: 30px; padding: 0; }
.log-plan-move select { width: 112px; min-height: 32px; padding: 5px 7px; font-size: 10px; }
.log-unassigned { margin-top: 14px; border-color: color-mix(in srgb, var(--danger) 40%, var(--border)); }
.log-unassigned-row { display: grid; grid-template-columns: minmax(90px, .45fr) minmax(120px, 1fr) auto; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--border); }
.log-unassigned-row .badge { max-width: 320px; white-space: normal; text-align: right; }
.log-savebar { position: sticky; z-index: 12; bottom: 12px; display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 14px; padding: 11px 12px; border: 1px solid var(--border-strong); border-radius: 14px; background: color-mix(in srgb, var(--panel-solid) 92%, transparent); box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.log-inline-error, .log-distance-warning { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--border)); border-radius: 11px; background: var(--danger-soft); color: var(--danger); overflow-wrap: anywhere; }
.log-distance-warning { border-color: color-mix(in srgb, var(--warn) 45%, var(--border)); background: var(--warn-soft); color: var(--warn); }
.log-distance-warning span { flex: 1; }
.log-route-days, .log-driver-routes { display: flex; flex-direction: column; gap: 14px; }
.log-route-list { display: flex; flex-direction: column; }
.log-route-row { display: flex; width: 100%; min-width: 0; align-items: center; gap: 12px; padding: 12px 6px; border: 0; border-top: 1px solid var(--border); background: transparent; color: var(--text); text-align: left; cursor: pointer; transition: background .16s ease; }
.log-route-row:hover { background: var(--panel-hover); }
.log-route-row b, .log-route-row small { display: block; }
.log-route-row small { margin-top: 2px; color: var(--muted); font-size: 10.5px; }
.log-route-time { width: 52px; flex: 0 0 auto; font: 700 13px var(--mono); }
.log-route-numbers { min-width: 90px; text-align: right; }
.log-detail-head { flex-wrap: wrap; }
.log-route-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--border); }
.log-route-summary > div { display: flex; min-height: 70px; flex-direction: column; justify-content: center; gap: 4px; padding: 10px 12px; background: var(--bg-2); }
.log-route-summary span { color: var(--dim); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.log-route-summary b { overflow-wrap: anywhere; font-size: 12px; }
.log-route-controls { display: flex; align-items: end; gap: 9px; margin-top: 14px; }
.log-route-controls .field { width: min(220px, 100%); }
.log-costs { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); color: var(--muted); font-size: 11px; }
.log-costs b { color: var(--text); font-family: var(--mono); }
.log-timeline-card { overflow: hidden; }
.log-timeline { position: relative; display: flex; flex-direction: column; }
.log-timeline::before { content: ''; position: absolute; top: 23px; bottom: 23px; left: 20px; width: 2px; background: var(--border-strong); }
.log-timeline-stop { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 10px 4px; border-radius: 12px; }
.log-timeline-stop[draggable='true'] { cursor: grab; }
.log-timeline-stop.next { margin: 4px 0; padding: 14px 9px; background: var(--accent-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 38%, transparent); }
.log-timeline-stop.finished { opacity: .68; }
.log-timeline-marker { position: relative; z-index: 1; display: flex; justify-content: center; }
.log-timeline-marker span { display: grid; width: 32px; height: 32px; place-items: center; border: 3px solid var(--panel-solid); border-radius: 50%; background: var(--accent); color: #fff; font-size: 11px; font-weight: 750; }
.log-timeline-stop.finished .log-timeline-marker span { background: var(--success); }
.log-timeline-body { display: flex; min-width: 0; flex-direction: column; gap: 7px; padding-top: 4px; }
.log-stop-address { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.log-stop-facts { display: flex; flex-wrap: wrap; gap: 5px; }
.log-stop-facts span { padding: 3px 7px; border-radius: 7px; background: var(--bg-2); color: var(--muted); font-size: 9.5px; }
.log-stop-facts b { color: var(--text); }
.log-stop-actions, .log-driver-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.log-stop-actions .btn { min-height: 38px; }
.log-detail-nudge { display: inline-flex; gap: 4px; }
.log-driver-route { padding: 20px; }
.log-driver-route-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.log-driver-route-head h2 { margin: 2px 0 0; font-size: 20px; }
.log-driver-actions { margin: 12px 0; }
.log-driver-actions .btn { min-height: 50px; }
.log-complete-form { display: flex; flex-direction: column; gap: 13px; }
.log-signature { display: block; width: 100%; height: 190px; border: 2px dashed var(--border-strong); border-radius: 12px; background: #fff; cursor: crosshair; touch-action: none; }
.log-vehicles { align-items: start; }
.log-vehicle-spec { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 12px; margin: 0; padding: 12px; border-radius: 11px; background: var(--bg-2); }
.log-vehicle-spec dt { color: var(--muted); font-size: 11px; }
.log-vehicle-spec dd { margin: 0; font: 600 11px var(--mono); }
.log-vehicle-edit { display: flex; flex-direction: column; gap: 12px; margin-top: 13px; }

@media (max-width: 980px) {
  .log-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-planner-grid { grid-template-columns: minmax(0, 1fr); }
  .log-route-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .log-shell { gap: 12px; }
  .log-tabs { display: flex; width: 100%; }
  .log-tabs button { min-height: 44px; padding: 8px 12px; }
  .log-filterbar, .log-plan-head { align-items: stretch; flex-direction: column; }
  .log-filterbar .field, .log-plan-head .field { width: 100%; min-width: 0; }
  .log-filterbar .input, .log-plan-head .input, .log-route-config .input, .log-route-controls .input, .log-vehicle-edit .input, .log-complete-form .input, .log-complete-form .textarea { min-height: 46px; font-size: 16px; }
  .log-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .log-route-board { grid-template-columns: minmax(0, 1fr); }
  .log-route-config { grid-template-columns: minmax(0, 1fr); }
  .log-order { align-items: flex-start; flex-wrap: wrap; }
  .log-order-meta { width: 100%; flex-direction: row; align-items: center; padding-left: 29px; }
  .log-stop { align-items: flex-start; flex-wrap: wrap; }
  .log-stop > .grow { width: calc(100% - 40px); flex: 1 1 calc(100% - 40px); }
  .log-plan-move { width: 100%; padding-left: 36px; }
  .log-plan-move .btn { min-width: 44px; height: 44px; }
  .log-plan-move select { min-height: 44px; flex: 1; font-size: 14px; }
  .log-unassigned-row { grid-template-columns: minmax(0, 1fr); }
  .log-unassigned-row .badge { max-width: none; text-align: left; }
  .log-savebar { bottom: calc(78px + env(safe-area-inset-bottom)); flex-direction: column; align-items: stretch; }
  .log-savebar .btn { min-height: 50px; }
  .log-route-row { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 8px; }
  .log-route-row > .badge { grid-column: 2 / -1; justify-self: start; }
  .log-route-numbers { min-width: 72px; }
  .log-detail-head { align-items: stretch; flex-direction: column; }
  .log-detail-head > .btn, .log-detail-head > a { min-height: 48px; }
  .log-route-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-route-controls { align-items: stretch; flex-direction: column; }
  .log-route-controls .field { width: 100%; }
  .log-route-controls .btn { min-height: 46px; }
  .log-timeline-stop { grid-template-columns: 36px minmax(0, 1fr); gap: 7px; padding: 9px 0; }
  .log-timeline::before { left: 16px; }
  .log-timeline-marker span { width: 30px; height: 30px; }
  .log-stop-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-stop-actions .btn { min-height: 48px; white-space: normal; }
  .log-detail-nudge { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-driver-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .log-driver-actions .btn { width: 100%; }
  .modal:has(.log-complete-form) { display: flex; width: 100vw; max-width: none; min-height: 100dvh; max-height: 100dvh; flex-direction: column; border: 0; border-radius: 0; padding: max(18px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom)); }
  .modal:has(.log-complete-form) .log-complete-form { flex: 1; overflow-y: auto; }
  .modal:has(.log-complete-form) .foot { position: sticky; bottom: 0; display: grid; grid-template-columns: minmax(0, 1fr); padding-top: 10px; background: var(--panel-solid); }
  .modal:has(.log-complete-form) .foot .btn { min-height: 50px; }
  .log-signature { height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  .log-order, .log-vehicle-choice, .log-stop, .log-route-row { transition: none; }
}

/* [hidden] always wins over component display rules (e.g. a flex panel closed with the hidden attribute). */
[hidden] { display: none !important; }

/* ============ Rabaty: osobne stawki kategorii ============ */
.quote-pricing-project { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
.quote-pricing-project-head { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.quote-pricing-project-head .field { width: min(290px, 100%); }
.quote-project-rate, .quote-category-rate { display: flex; align-items: center; gap: 7px; }
.quote-project-rate .input { width: 112px; }
.quote-project-rate > span, .quote-category-rate > span:last-child { color: var(--muted); font: 650 11px var(--mono); }
.quote-project-state { color: var(--muted); font-size: 10px; text-align: right; }
.quote-pricing-project.mixed { border-color: color-mix(in srgb, var(--warn) 38%, var(--border)); }
.quote-pricing-project.mixed .quote-project-state { color: var(--warn); }
.quote-pricing-category-table { overflow-x: auto; border: 1px solid var(--border); border-radius: 11px; }
.quote-pricing-category-table table { width: 100%; min-width: 650px; border: 0; }
.quote-pricing-category-table th { color: var(--dim); font-size: 9px; white-space: nowrap; }
.quote-pricing-category-table td { vertical-align: middle; }
.quote-pricing-category-table td:first-child { width: 34%; }
.quote-pricing-category-table td strong { font-size: 10.5px; }
.quote-category-current { color: var(--muted); font: 600 10px var(--mono); white-space: nowrap; }
.quote-category-rate .input { width: 86px; min-height: 36px; font-family: var(--mono); }
.quote-category-net { display: flex; align-items: center; gap: 7px; font: 600 10px var(--mono); white-space: nowrap; }
.quote-category-net > span:first-child { color: var(--muted); }
.quote-category-net > span:nth-child(2) { color: var(--dim); }
.quote-category-net strong { color: var(--text); font-family: inherit; }
.quote-pricing-category-table tr.changed { background: color-mix(in srgb, var(--accent-soft) 62%, transparent); }
.quote-pricing-category-table tr.changed .quote-category-net strong { color: var(--accent); }
.quote-pricing-actions { display: flex; justify-content: flex-end; }
.quote-pricing input[aria-invalid='true'] { border-color: var(--danger); box-shadow: 0 0 0 1px color-mix(in srgb, var(--danger) 35%, transparent); }

@media (max-width: 760px) {
  .quote-pricing-project-head { align-items: stretch; flex-direction: column; }
  .quote-pricing-project-head .field, .quote-project-rate .input { width: 100%; }
  .quote-project-rate .input, .quote-category-rate .input { min-height: 44px; font-size: 16px; }
  .quote-project-state { text-align: left; }
  .quote-pricing-quick { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .quote-pricing-quick .btn { min-width: 0; min-height: 42px; padding-inline: 4px; }
  .quote-pricing-category-table { overflow: visible; border: 0; }
  .quote-pricing-category-table table, .quote-pricing-category-table tbody { display: block; min-width: 0; }
  .quote-pricing-category-table thead { display: none; }
  .quote-pricing-category-table tr { display: grid; gap: 9px; margin-bottom: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-2); }
  .quote-pricing-category-table td { display: grid; grid-template-columns: minmax(105px, .7fr) minmax(0, 1fr); align-items: center; gap: 10px; width: auto !important; padding: 0; border: 0; }
  .quote-pricing-category-table td::before { content: attr(data-label); color: var(--dim); font-size: 9px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
  .quote-category-rate { min-width: 0; }
  .quote-category-rate .input { width: 100%; }
  .quote-category-net { flex-wrap: wrap; white-space: normal; }
  .quote-pricing-actions .btn { width: 100%; min-height: 44px; }
}

/* Phones: iOS Safari zooms into any field under 16px (the page then looks cut off on the right),
   and the estimate's four action buttons must not stay pinned over half of the form. */
@media (max-width: 760px) {
  input.input, select.input, textarea.input, .textarea, .modal .input, .modal .textarea,
  .estimate-items .input, .estimate-article-row .input { font-size: 16px; }
  /* One slim row pinned just above the bottom navigation, scrolled sideways; Utwórz w Winconie first. */
  .estimate-actions {
    position: sticky; bottom: calc(78px + env(safe-area-inset-bottom)); z-index: 8;
    flex-wrap: nowrap; overflow-x: auto; gap: 6px; padding: 8px; scrollbar-width: none;
  }
  .estimate-actions::-webkit-scrollbar { display: none; }
  .estimate-actions .btn { flex: 0 0 auto; min-height: 40px; padding: 8px 12px; font-size: 13px; white-space: nowrap; }
  .estimate-actions #estimate-wincon { order: -1; }
}

/* Wincon printout (PDF) in the quote drawer */
.quote-print-row { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.quote-print-row select { flex: 1 1 auto; min-width: 0; }
@media (max-width: 760px) { .quote-print-row { flex-direction: column; align-items: stretch; } .quote-print-row .btn { min-height: 44px; justify-content: center; } }