:root {
  color-scheme: light;
  --ink: #18202a;
  --muted: #637082;
  --line: #d9dee7;
  --paper: #f6f7f9;
  --white: #ffffff;
  --teal: #0d6f6b;
  --teal-dark: #084d4a;
  --gold: #bb7b16;
  --red: #b13a2f;
  --green: #2b7a42;
  --blue: #315f9b;
  --shadow: 0 18px 50px rgba(25, 34, 45, 0.16);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
}

button,
input,
select {
  font: inherit;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 86px;
  padding: 18px 28px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(12px);
}

.eyebrow,
.source span,
.search span {
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

h1,
h2,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 26px;
  line-height: 1.15;
}

h2 {
  margin-bottom: 10px;
  font-size: 17px;
}

.source {
  min-width: 230px;
  text-align: right;
}

.source strong {
  display: block;
  font-size: 14px;
}

.source span,
.source strong {
  display: none;
}

main {
  padding: 22px 28px 36px;
}

.notification-center {
  position: sticky;
  top: 86px;
  z-index: 4;
  padding: 10px 28px 0;
  pointer-events: none;
}

.notification-center[hidden] {
  display: none !important;
}

.notification-stack {
  display: grid;
  gap: 8px;
}

.notification {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 10px 26px rgba(25, 34, 45, 0.12);
  pointer-events: auto;
}

.notification.alert {
  border-left-color: var(--gold);
}

.notification.ok {
  border-left-color: var(--green);
}

.notification strong,
.notification span {
  display: block;
}

.notification span {
  margin-top: 3px;
  color: var(--muted);
  line-height: 1.35;
}

.notification-actions,
.upload-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.upload-actions {
  margin-top: 10px;
}

.matched-docs {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.matched-doc {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8faf9;
  color: var(--muted);
  font-size: 14px;
}

.matched-doc strong {
  color: var(--ink);
}

.brand-home {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 280px));
  gap: 16px;
  justify-content: center;
  padding: 56px 28px;
}

.brand-home-kpis {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 12px;
  width: min(1112px, 100%);
}

.brand-home-kpi {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.brand-home-kpi strong {
  font-size: 25px;
}

.brand-home-kpi span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.brand-home[hidden],
.login-screen[hidden],
.sales-shell[hidden],
main[hidden] {
  display: none !important;
}

.login-screen {
  min-height: calc(100vh - 86px);
  display: grid;
  place-items: center;
  padding: 32px;
}

.login-card {
  width: min(420px, 100%);
  display: grid;
  gap: 14px;
  padding: 26px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 8px;
  background: var(--white);
  box-shadow: var(--shadow);
}

.login-card h2 {
  margin: 0;
  font-size: 28px;
}

.login-card label {
  display: grid;
  gap: 6px;
}

.login-card label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.login-card input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
}

.login-error {
  min-height: 20px;
  margin: 0;
  color: var(--red);
  font-weight: 700;
}

.sales-shell {
  display: grid;
  gap: 16px;
  padding: 18px 24px 32px;
}

.sales-hero,
.sales-controls,
.sales-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.sales-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px;
}

.sales-hero h2 {
  margin-bottom: 6px;
  font-size: 24px;
}

.sales-hero p {
  margin-bottom: 0;
  color: var(--muted);
}

.sales-brand-switch {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.sales-brand-switch .active {
  background: var(--teal);
  color: var(--white);
}

.sales-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 240px);
  gap: 12px;
  padding: 14px;
}

.sales-panel {
  overflow: hidden;
}

.sales-table-wrap {
  max-height: calc(100vh - 380px);
}

.sales-sale-button {
  min-width: 110px;
}

.sales-mode .source {
  min-width: auto;
}

.brand-card {
  display: grid;
  gap: 10px;
  min-height: 180px;
  padding: 22px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
  text-align: left;
  box-shadow: 0 14px 30px rgba(25, 34, 45, 0.08);
}

.brand-card[data-brand="kawasaki"] {
  border-left-color: var(--green);
}

.brand-card[data-brand="second_hand"] {
  border-left-color: #2f6eb6;
}

.stock-source-links {
  display: grid;
  gap: 4px;
}

.stock-source-links a {
  font-weight: 800;
}

.stock-row-review {
  background: #fff8e6;
}

@media (max-width: 900px) {
  .brand-home,
  .brand-home-kpis {
    grid-template-columns: 1fr;
  }
}

.brand-card span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.brand-card strong {
  font-size: 26px;
}

.brand-card small {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.4;
}

.brand-card:hover {
  transform: translateY(-1px);
}

body.brand-loading .brand-card {
  cursor: wait;
  opacity: 0.7;
}

body.brand-loading .brand-card:focus-visible {
  outline: 3px solid var(--teal);
  outline-offset: 3px;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.metric {
  min-height: 104px;
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--teal);
  border-radius: 8px;
  background: var(--white);
}

.metric:nth-child(2) {
  border-left-color: var(--blue);
}

.metric:nth-child(3) {
  border-left-color: var(--gold);
}

.metric:nth-child(4) {
  border-left-color: var(--green);
}

.metric span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.metric strong {
  display: block;
  margin-top: 8px;
  font-size: 25px;
  line-height: 1.1;
}

.metric small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  line-height: 1.35;
}

.controls {
  display: grid;
  grid-template-columns: auto minmax(260px, 1fr) minmax(190px, auto) minmax(190px, auto);
  gap: 10px;
  align-items: end;
  margin-bottom: 16px;
}

.segments {
  display: inline-flex;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.segment,
.secondary,
.icon-button {
  border: 0;
  cursor: pointer;
}

.segment {
  min-height: 38px;
  padding: 0 13px;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
}

.segment.active {
  background: var(--teal);
  color: var(--white);
}

.search {
  display: block;
}

.search input,
select {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
}

.layout {
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr);
  gap: 16px;
}

#dashboardShell.home-mode .metrics,
#dashboardShell.home-mode .controls,
#dashboardShell.home-mode .side,
#dashboardShell.home-mode .table-head,
#dashboardShell.home-mode thead {
  display: none;
}

#dashboardShell.home-mode .layout {
  display: block;
}

#dashboardShell.home-mode .table-panel {
  border: 0;
  background: transparent;
}

#dashboardShell.home-mode .table-wrap {
  max-height: none;
  min-height: 0;
  overflow: visible;
}

#dashboardShell.home-mode table {
  min-width: 0;
}

#dashboardShell.home-mode th,
#dashboardShell.home-mode td {
  border-bottom: 0;
}

/* Serit artik bu kurala dahil degil: detay ekranlarinda da gorunur kalmali. */
#dashboardShell.focused-mode .metrics,
#dashboardShell.focused-mode .side {
  display: none;
}

#dashboardShell.focused-mode .layout {
  display: block;
}

#dashboardShell.focused-mode .table-panel {
  width: 100%;
}

#dashboardShell.focused-mode .controls {
  grid-template-columns: minmax(260px, 1fr) minmax(170px, 220px) minmax(170px, 220px);
}

#dashboardShell.focused-mode .table-wrap {
  max-height: calc(100vh - 285px);
  min-height: 320px;
  overflow: auto;
}

.side {
  display: grid;
  gap: 16px;
  align-content: start;
}

.panel,
.table-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.panel {
  padding: 16px;
}

.breakdown,
.doc-counts {
  display: grid;
  gap: 10px;
}

.bar-row {
  display: grid;
  gap: 6px;
}

.bar-label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}

.bar {
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: #e9edf2;
}

.bar-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--teal);
}

.doc-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid #edf0f4;
  color: var(--muted);
  font-size: 13px;
}

.doc-line:last-child {
  border-bottom: 0;
}

.table-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border-bottom: 1px solid var(--line);
}

.table-actions {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.table-head p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 13px;
}

.view-totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: #fbfcfd;
}

.view-totals:empty,
.selection-totals:empty {
  display: none;
}

.view-total {
  min-height: 68px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.view-total-action {
  width: 100%;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.view-total-action:hover,
.view-total-action:focus-visible {
  border-color: #72a99b;
  outline: none;
  box-shadow: 0 8px 20px rgb(18 83 66 / 13%);
  transform: translateY(-1px);
}

.view-total span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.view-total strong {
  display: block;
  margin-top: 8px;
  font-size: 18px;
}

.view-total small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.view-total.alert {
  border-color: #edc8c2;
  background: #fff8f7;
}

.view-total.alert span,
.view-total.alert strong {
  color: var(--red);
}

.payment-summary-shell {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.payment-summary-controls {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) auto auto minmax(160px, 0.7fr) minmax(160px, 0.7fr);
  gap: 10px;
  align-items: center;
}

.payment-summary-controls > div {
  min-height: 60px;
  padding: 10px 12px;
  border: 1px solid #edf0f4;
  border-radius: 8px;
  background: #fbfcfd;
}

.payment-summary-controls span,
.payment-summary-cards span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.payment-summary-controls strong,
.payment-summary-cards strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 18px;
}

.payment-summary-controls small {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.payment-summary-toggle.active {
  background: var(--teal);
  color: var(--white);
}

.payment-summary-detail {
  display: grid;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid #edf0f4;
}

.payment-summary-claim {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #cfe0dc;
  border-radius: 8px;
  background: #f5fbf8;
}

.payment-summary-claim.alert {
  border-color: #ecd7a6;
  background: #fffaf0;
}

.payment-summary-claim strong {
  color: var(--ink);
  font-size: 14px;
}

.payment-summary-claim span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.payment-summary-cards {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
}

.payment-summary-cards > div {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.payment-summary-cards > div.alert {
  border-color: #edc8c2;
  background: #fff8f7;
}

.payment-summary-cards > div.alert span,
.payment-summary-cards > div.alert strong,
.payment-overpaid {
  color: var(--red);
}

.payment-summary-table {
  display: grid;
  max-height: 260px;
  overflow: auto;
  border: 1px solid #edf0f4;
  border-radius: 8px;
}

.payment-summary-row {
  display: grid;
  grid-template-columns: 90px 130px minmax(180px, 1fr) minmax(170px, 1fr) repeat(4, 120px);
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid #edf0f4;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.payment-summary-row:last-child {
  border-bottom: 0;
}

.payment-summary-row strong {
  color: var(--ink);
}

.payment-summary-empty {
  padding: 12px;
  border: 1px dashed #cfe0dc;
  border-radius: 8px;
  background: #fbfdfc;
  color: var(--muted);
  font-weight: 800;
}

.selection-totals {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
  min-height: 83px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: #f5faf9;
}

.selection-total,
.selection-empty {
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid #c9ddd9;
  border-radius: 8px;
  background: var(--white);
}

.selection-total span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.selection-total strong {
  display: block;
  margin-top: 7px;
  font-size: 17px;
}

.selection-empty {
  display: flex;
  align-items: center;
  color: var(--muted);
  font-weight: 700;
}

.selection-empty.idle {
  grid-column: 1 / -1;
  border-style: dashed;
  background: #fbfdfc;
}

.secondary {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 8px;
  background: #e8f1f0;
  color: var(--teal-dark);
  font-weight: 800;
}

.secondary.ghost {
  background: #f2f4f7;
  color: var(--muted);
}

.secondary:disabled {
  cursor: default;
  opacity: 0.45;
}

.upload-row td {
  padding: 0;
}

.upload-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: #fbfdfc;
}

.upload-panel strong {
  display: block;
  margin-bottom: 4px;
  font-size: 17px;
}

.upload-panel p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.upload-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.upload-form input[type="file"] {
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.upload-error {
  color: var(--red) !important;
  font-weight: 800;
}

.workflow-row td {
  padding: 0;
}

.workflow-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 12px;
  padding: 16px;
  background: #fbfcfd;
}

.workflow-card {
  display: grid;
  grid-template-rows: 1fr auto auto;
  gap: 12px;
  min-height: 178px;
  padding: 15px;
  border: 1px solid var(--line);
  border-left: 5px solid #cfd8df;
  border-radius: 8px;
  background: var(--white);
}

.workflow-card.emphasis {
  border-left-color: var(--teal);
  background: #f7fbfa;
}

.workflow-card strong {
  display: block;
  margin-bottom: 8px;
  color: var(--ink);
  font-size: 18px;
}

.workflow-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.workflow-meta {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid #edf0f4;
}

.workflow-meta span {
  color: var(--ink);
  font-size: 21px;
  font-weight: 900;
}

.workflow-meta small {
  max-width: 145px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-align: right;
}

.workflow-open {
  justify-self: start;
}

.table-wrap {
  overflow: auto;
  max-height: calc(100vh - 413px);
  min-height: 320px;
  overflow-anchor: none;
}

.table-wrap.pdf-stream-wrap {
  max-height: none;
  overflow: visible;
}

#dashboardShell.focused-mode .table-wrap.pdf-stream-wrap {
  max-height: none;
  min-height: 0;
  overflow: visible;
}

table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

table.real-stock-table {
  min-width: 2600px;
}

table.workflow-table {
  min-width: 0;
}

table.pdf-stream-table {
  min-width: 0;
}

table.pdf-stream-table th {
  display: none;
}

table.pdf-stream-table td {
  padding: 0;
  border-bottom: 0;
}

th,
td {
  padding: 12px 14px;
  border-bottom: 1px solid #edf0f4;
  text-align: left;
  vertical-align: middle;
}

th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f9fafb;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.select-cell {
  width: 52px;
  min-width: 52px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
}

.select-box {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.select-box input {
  position: fixed;
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
}

.pdf-stream {
  display: grid;
  gap: 18px;
  padding: 16px;
}

.pdf-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
}

.pdf-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  background: #fbfcfd;
}

.pdf-card-head h3 {
  margin: 8px 0 4px;
  font-size: 20px;
  line-height: 1.2;
}

.pdf-card-head p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
}

.pdf-card-side {
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 125px;
  text-align: right;
}

.pdf-card-side strong {
  font-size: 18px;
}

.pdf-card-side a {
  color: var(--teal-dark);
  font-weight: 800;
}

.pdf-merged-card {
  border-color: #c9dddd;
}

.pdf-merged-card > .pdf-card-head {
  position: sticky;
  top: 0;
  z-index: 2;
  border-bottom-color: #c9dddd;
  background: #f7fbfa;
}

.pdf-merged-files {
  display: grid;
  gap: 0;
}

.pdf-unified-records {
  display: grid;
  gap: 10px;
  padding: 14px;
  background: #f7faf9;
}

.pdf-unified-records .pdf-result {
  background: var(--white);
}

.pdf-merged-file {
  border-top: 1px solid var(--line);
}

.pdf-merged-file:first-child {
  border-top: 0;
}

.pdf-merged-file-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 12px 16px;
  background: var(--surface);
}

.pdf-merged-file-head h4 {
  margin: 7px 0 4px;
  font-size: 18px;
  line-height: 1.25;
}

.pdf-merged-file-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.pdf-frame-slot {
  display: grid;
  place-items: center;
  min-height: min(88vh, 980px);
  background: #eef2f5;
  color: var(--muted);
  font-weight: 800;
}

.pdf-frame-slot iframe {
  display: block;
  width: 100%;
  height: min(88vh, 980px);
  border: 0;
  background: var(--white);
}

.pdf-workspace {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.pdf-workspace-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.pdf-mode-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.pdf-mode-button.active {
  background: var(--teal);
  color: var(--white);
}

.pdf-sort-label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.pdf-sort-label select {
  min-width: 168px;
  text-transform: none;
}

.pdf-workspace-note {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  padding: 10px 12px;
  border: 1px solid #d7e8e5;
  border-radius: 8px;
  background: #f4fbf9;
  color: var(--muted);
  font-weight: 700;
}

.pdf-workspace-note strong {
  color: var(--teal-dark);
}

.pdf-card-samples {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.pdf-card-samples span {
  max-width: 360px;
  overflow: hidden;
  padding: 5px 8px;
  border-radius: 6px;
  background: #eef5f3;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdf-mini-action {
  padding: 8px 10px;
  font-size: 13px;
}

.pdf-search-results {
  display: grid;
  gap: 10px;
}

.pdf-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.pdf-result h3 {
  margin: 8px 0 4px;
  font-size: 18px;
  line-height: 1.25;
}

.pdf-result p,
.pdf-result small {
  display: block;
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
}

.pdf-result-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 150px;
  text-align: right;
}

.pdf-result-actions strong {
  font-size: 18px;
}

.pdf-result-actions a {
  color: var(--teal-dark);
  font-weight: 800;
}

.pdf-empty {
  padding: 24px;
}

@media (max-width: 760px) {
  .pdf-workspace {
    padding: 10px;
  }

  .pdf-workspace-toolbar,
  .pdf-workspace-note,
  .pdf-result {
    align-items: stretch;
  }

  .pdf-mode-tabs,
  .pdf-sort-label,
  .pdf-result,
  .pdf-result-actions {
    width: 100%;
  }

  .pdf-mode-tabs,
  .pdf-result,
  .pdf-result-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .pdf-result-actions {
    justify-items: stretch;
    text-align: left;
  }

  .pdf-card-head {
    grid-template-columns: 1fr;
  }

  .pdf-merged-file-head {
    grid-template-columns: 1fr;
  }

  .pdf-card-side {
    align-items: flex-start;
  }
}

.honda-pdf-direct {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #eef2f5;
}

.honda-pdf-direct iframe {
  display: block;
  width: 100%;
  height: calc(100vh - 230px);
  min-height: 620px;
  border: 0;
  background: var(--white);
}

.select-box span {
  width: 18px;
  height: 18px;
  border: 2px solid #aeb8c5;
  border-radius: 5px;
  background: var(--white);
}

.select-box input:checked + span {
  border-color: var(--teal);
  background: var(--teal);
  box-shadow: inset 0 0 0 3px var(--white);
}

tbody tr {
  cursor: pointer;
}

tbody tr:hover {
  background: #f3f8f7;
}

tbody tr.row-manual-demo {
  background: #fff8db;
  box-shadow: inset 4px 0 0 #d3a31f;
}

tbody tr.row-manual-demo:hover {
  background: #fff1bd;
}

tbody tr.row-missing-purchase {
  background: #fff1ef;
  box-shadow: inset 4px 0 0 #c95f54;
}

tbody tr.row-missing-purchase:hover {
  background: #ffe4e0;
}

.status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  background: #e7f2ec;
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

.status.bought {
  background: #eef2f8;
  color: var(--blue);
}

.status.alert {
  background: #f8ebe9;
  color: var(--red);
}

.status.demo {
  background: #fff1d8;
  color: var(--gold);
}

.status.showroom {
  background: #e8f1f0;
  color: var(--teal-dark);
}

.model {
  font-weight: 800;
}

.muted {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.money {
  font-weight: 800;
  white-space: nowrap;
}

.negative {
  color: var(--green);
}

.drawer {
  position: fixed;
  inset: 0;
  z-index: 10;
  display: none;
  justify-content: flex-end;
  background: rgba(24, 32, 42, 0.36);
}

.drawer.open {
  display: flex;
}

.drawer-inner {
  width: min(720px, 100%);
  height: 100%;
  overflow: auto;
  background: var(--white);
  box-shadow: var(--shadow);
}

.drawer-top {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 24px;
  border-bottom: 1px solid var(--line);
}

.drawer-top h2 {
  margin: 8px 0 6px;
  font-size: 24px;
}

.drawer-top p {
  margin-bottom: 0;
}

.badge {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  background: #e8f1f0;
  color: var(--teal-dark);
  font-size: 12px;
  font-weight: 800;
}

.icon-button {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: #edf0f4;
  color: var(--ink);
  font-size: 25px;
  line-height: 1;
}

.drawer-totals {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--line);
}

.total-box {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.total-box span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.total-box strong {
  display: block;
  margin-top: 7px;
  font-size: 16px;
}

.docs {
  display: grid;
  gap: 12px;
  padding: 18px 24px 28px;
}

.operation-body {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.operation-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.operation-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.operation-fields label {
  display: grid;
  gap: 5px;
}

.operation-fields label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.operation-fields input,
.operation-fields select,
.operation-fields textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
}

.operation-fields textarea {
  resize: vertical;
}

.operation-note {
  grid-column: 1 / -1;
}

.operation-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.sale-modal,
.approval-modal {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(24, 32, 42, 0.42);
}

.sale-modal.open,
.approval-modal.open {
  display: flex;
}

.focused-pdf-modal {
  position: fixed;
  inset: 0;
  z-index: 28;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.72);
}

.focused-pdf-modal.open {
  display: flex;
}

.focused-pdf-dialog {
  width: min(1180px, 100%);
  max-height: min(920px, calc(100vh - 48px));
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: var(--shadow);
}

.focused-pdf-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--line);
}

.focused-pdf-top h2 {
  margin: 8px 0 6px;
  font-size: 24px;
}

.focused-pdf-top p {
  margin-bottom: 0;
}

.focused-pdf-highlight {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 22px;
  background: #fff8d8;
  border-bottom: 1px solid #eadf9c;
}

.focused-pdf-highlight span,
.focused-pdf-highlight small {
  color: #705b00;
  font-weight: 800;
}

.focused-pdf-highlight strong {
  padding: 8px 12px;
  background: #ffeb3b;
  border: 2px solid #df4f28;
  color: var(--text);
}

.focused-pdf-actions {
  padding: 12px 22px;
  border-bottom: 1px solid var(--line);
}

.focused-pdf-frame {
  min-height: 0;
  overflow: auto;
  padding: 18px;
  background: #252525;
}

.focused-pdf-pages {
  display: grid;
  gap: 18px;
}

.focused-pdf-page {
  max-width: min(100%, 980px);
  margin: 0 auto;
}

.focused-pdf-page-label {
  display: inline-flex;
  margin: 0 0 8px;
  padding: 6px 10px;
  border-radius: 6px;
  background: #f8fafc;
  color: var(--muted);
  font-weight: 800;
}

.focused-pdf-frame img {
  display: block;
  max-width: min(100%, 980px);
  height: auto;
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.28);
}

.focused-pdf-error {
  display: none;
  max-width: min(100%, 980px);
  margin: 0 auto;
  padding: 14px 16px;
  border: 1px solid #f1c8c1;
  border-radius: 6px;
  background: #fff4f1;
  color: #96372d;
  font-weight: 800;
}

.focused-pdf-page.is-error img {
  display: none;
}

.focused-pdf-page.is-error .focused-pdf-error {
  display: block;
}

.sale-dialog {
  width: min(760px, 100%);
  max-height: min(780px, calc(100vh - 48px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: var(--shadow);
}

.approval-dialog {
  width: min(1100px, 100%);
  max-height: min(900px, calc(100vh - 48px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  box-shadow: var(--shadow);
}

.approval-dialog-top {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
  background: var(--white);
}

.approval-dialog-top h2 {
  margin: 8px 0 6px;
  font-size: 24px;
}

.approval-dialog-top p {
  margin-bottom: 0;
}

.approval-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}

.approval-summary article {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8faf9;
}

.approval-summary span,
.approval-summary strong {
  display: block;
}

.approval-summary span,
.approval-row-meta {
  color: var(--muted);
  font-size: 12px;
}

.approval-rows,
.approval-manual-panel {
  display: grid;
  gap: 10px;
  padding: 18px 22px;
}

.approval-manual-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
  background: #fffaf0;
}

.approval-manual-panel label,
.approval-row-controls label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.approval-manual-panel select,
.approval-row-controls select,
.approval-row-controls input {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
}

.approval-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr);
  gap: 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--teal);
  border-radius: 8px;
}

.approval-row.no-match {
  border-left-color: var(--gold);
}

.approval-row h3 {
  margin: 0 0 5px;
  font-size: 15px;
}

.approval-row p {
  margin-bottom: 5px;
}

.approval-row-controls {
  display: grid;
  gap: 8px;
}

.approval-system-suggestion {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  border: 1px solid #cfe3df;
  border-radius: 8px;
  background: #f0f8f6;
  color: var(--muted);
  font-size: 12px;
}

.approval-system-suggestion strong {
  color: var(--ink);
}

.approval-dialog > .upload-error {
  margin: 0;
  padding: 0 22px 12px;
}

.approval-dialog-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 22px;
  border-top: 1px solid var(--line);
  background: var(--white);
}

.sale-dialog-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
}

.sale-dialog-top h2 {
  margin: 8px 0 6px;
  font-size: 24px;
}

.sale-dialog-top p {
  margin-bottom: 0;
}

.sale-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 18px 22px;
}

.sale-fields label {
  display: grid;
  gap: 6px;
}

.sale-fields .wide {
  grid-column: 1 / -1;
}

.sale-fields label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.sale-fields input,
.sale-fields textarea {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
  font: inherit;
}

.sale-fields textarea {
  resize: vertical;
}

.sale-fields input:disabled {
  background: #f3f5f7;
  color: var(--muted);
}

.delivery-unknown {
  align-content: end;
  grid-template-columns: auto 1fr;
  gap: 8px 10px;
  padding: 9px 0;
}

.delivery-unknown input {
  min-height: auto;
  align-self: center;
}

.delivery-unknown span {
  align-self: center;
}

.sale-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 22px 22px;
  border-top: 1px solid var(--line);
}

.doc {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.doc header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  background: #f8fafb;
  border-bottom: 1px solid var(--line);
}

.doc h3 {
  margin: 0;
  font-size: 14px;
}

.doc a {
  color: var(--teal-dark);
  font-weight: 800;
  text-decoration: none;
}

.doc dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin: 0;
  padding: 12px;
}

.doc dt {
  color: var(--muted);
  font-size: 12px;
}

.doc dd {
  margin: 3px 0 0;
  font-weight: 700;
  word-break: break-word;
}

.visual-card {
  position: relative;
  min-height: 220px;
  overflow: hidden;
  background: #eef2f4;
}

.visual-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.visual-overlay {
  position: absolute;
  left: 12px;
  bottom: 12px;
  display: grid;
  gap: 4px;
  max-width: min(560px, calc(100% - 24px));
  padding: 10px 12px;
  border: 1px solid rgba(214, 222, 229, 0.9);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 28px rgba(22, 32, 44, 0.14);
}

.visual-overlay strong,
.visual-overlay span {
  line-height: 1.25;
}

.visual-overlay span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.visual-missing {
  display: none;
  padding: 18px;
  color: var(--muted);
  font-weight: 700;
}

.visual-card.image-missing .visual-missing {
  display: block;
}

.visual-card.image-missing .visual-overlay {
  position: static;
  margin: 12px;
}

.bonus-lines {
  display: grid;
  gap: 0;
}

.bonus-panel header {
  align-items: flex-start;
}

.bonus-panel header h3 {
  margin-bottom: 6px;
}

.bonus-panel header p {
  max-width: 680px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.bonus-summary,
.bonus-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.bonus-summary.ok,
.bonus-status.ok {
  background: #e8f1eb;
  color: #2e6f47;
}

.bonus-summary.missing,
.bonus-status.missing {
  background: #f6e8e4;
  color: #9b3d2f;
}

.bonus-status.watch {
  background: #f6efd8;
  color: #9a6a12;
}

.bonus-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}

.bonus-overview div {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfd;
}

.bonus-overview span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.bonus-overview strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
}

.bonus-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border-bottom: 1px solid #edf0f4;
}

.bonus-line:last-child {
  border-bottom: 0;
}

.bonus-line strong,
.bonus-line span,
.bonus-line small {
  display: block;
}

.bonus-line small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.bonus-line-missing {
  background: #fff8f6;
}

.bonus-line-watch {
  background: #fffcf2;
}

.bonus-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.bonus-evidence a,
.bonus-evidence small {
  padding: 4px 7px;
  border-radius: 999px;
  background: #eef4f3;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.bonus-evidence a.bonus-evidence-link {
  background: #e4f3ee;
  color: var(--teal-dark);
  border: 1px solid #bcd8d2;
}

.bonus-evidence a.bonus-evidence-link:hover {
  background: #d7ece6;
}

.bonus-evidence a.transaction-evidence-link {
  background: #fff4cf;
  border-color: #e8d28e;
  color: #6e5400;
}

.bonus-evidence a.sepa-evidence-link {
  background: #edf3ff;
  border-color: #c8d7f3;
  color: #2d4f84;
}

.doc-evidence {
  padding: 0 16px 16px;
}

.transaction-card header {
  align-items: center;
}

.transaction-summary {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 12px;
  padding: 12px;
}

.transaction-purchase-status {
  display: grid;
  gap: 5px;
  margin: 12px 12px 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f5fbf8;
}

.transaction-purchase-status.ok {
  border-color: #c4decf;
  background: #eff8f2;
}

.transaction-purchase-status.alert {
  border-color: #edd2cc;
  background: #fff7f5;
}

.transaction-purchase-status strong {
  color: var(--ink);
  font-size: 14px;
}

.transaction-purchase-status span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.transaction-summary span,
.transaction-summary small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.transaction-summary strong {
  justify-self: end;
}

.transaction-unmatched {
  display: grid;
  gap: 6px;
  margin: 0 12px 12px;
  padding: 10px 12px;
  border: 1px solid #ecd7a6;
  border-radius: 8px;
  background: #fffaf0;
}

.transaction-unmatched strong {
  color: #6e5400;
  font-size: 13px;
}

.transaction-unmatched span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.transaction-list-shell {
  border-top: 1px solid var(--line);
}

.transaction-list {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
}

.transaction-row {
  display: grid;
  grid-template-columns: minmax(88px, 112px) minmax(0, 1fr) minmax(170px, max-content);
  gap: 8px 14px;
  align-items: start;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--teal);
  border-radius: 8px;
  background: #fbfdfc;
  color: var(--text);
  text-decoration: none;
}

.transaction-row.outgoing {
  border-left-color: #a15f17;
}

.transaction-row.incoming {
  border-left-color: #2f7c56;
}

.transaction-row strong {
  min-width: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.transaction-row span,
.transaction-row small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.transaction-row small {
  grid-column: 2 / -1;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.transaction-row em {
  color: var(--ink);
  font-style: normal;
  font-weight: 900;
  line-height: 1.25;
  max-width: 280px;
  text-align: right;
  white-space: normal;
  overflow-wrap: anywhere;
}

.transaction-mark {
  padding: 1px 3px;
  border: 2px solid #df4f28;
  background: #ffeb3b;
  color: var(--text);
}

.bonus-line > div:last-child {
  display: grid;
  gap: 6px;
  justify-items: end;
}

.empty {
  padding: 28px;
  color: var(--muted);
  text-align: center;
}

@media (max-width: 1080px) {
  .metrics {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }

  .controls,
  .layout {
    grid-template-columns: 1fr;
  }

  .side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .topbar,
  main {
    padding-left: 16px;
    padding-right: 16px;
  }

  .topbar,
  .table-head,
  .drawer-top,
  .sale-dialog-top {
    align-items: flex-start;
    flex-direction: column;
  }

  .source {
    min-width: 0;
    text-align: left;
  }

  .metrics,
  .side,
  .drawer-totals,
  .view-totals,
  .selection-totals,
  .sale-fields {
    grid-template-columns: 1fr;
  }

  .sale-modal {
    padding: 12px;
  }

  .sale-dialog {
    max-height: calc(100vh - 24px);
  }

  .segments {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .transaction-row {
    grid-template-columns: 1fr;
  }

  .transaction-row small {
    grid-column: 1;
  }

  .transaction-row em {
    max-width: none;
    text-align: left;
  }

  .table-wrap {
    max-height: none;
  }
}

/* Professional UI polish: visual-only layer, no data or logic changes. */
:root {
  --text: var(--ink);
  --paper: #f3f5f7;
  --surface: #ffffff;
  --surface-soft: #fafbfd;
  --line: #d5dce5;
  --line-soft: #edf1f5;
  --shadow-card: 0 8px 22px rgba(25, 34, 45, 0.06);
  --shadow-hover: 0 14px 34px rgba(25, 34, 45, 0.1);
  --focus-ring: 0 0 0 3px rgba(13, 111, 107, 0.18);
}

body {
  background:
    linear-gradient(180deg, #f7f9fb 0, var(--paper) 260px),
    var(--paper);
  font-family: "Inter", "Segoe UI", Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.45;
  text-rendering: geometricPrecision;
}

.topbar {
  min-height: 78px;
  padding: 16px 28px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 22px rgba(25, 34, 45, 0.05);
}

h1 {
  font-size: 28px;
  letter-spacing: 0;
}

h2 {
  font-size: 18px;
  letter-spacing: 0;
}

main {
  padding-top: 20px;
}

.login-card,
.brand-card,
.sales-brand-card,
.metric,
.panel,
.table-panel,
.workflow-card,
.view-total,
.total-box,
.pdf-card,
.honda-pdf-direct,
.doc,
.sale-dialog,
.drawer-inner {
  box-shadow: var(--shadow-card);
}

.brand-card,
.sales-brand-card,
.workflow-card,
.metric,
.secondary,
.segment,
.icon-button {
  transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.brand-card:hover,
.sales-brand-card:hover,
.workflow-card:hover,
.metric:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-hover);
}

.metric,
.view-total,
.total-box {
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-soft) 100%);
}

.metric strong,
.workflow-meta span,
.view-total strong,
.money {
  letter-spacing: 0;
}

.controls {
  position: static;
  top: auto;
  z-index: 4;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(243, 245, 247, 0.95);
  backdrop-filter: blur(10px);
}

.segments {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  background: var(--surface);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
}

.segment:hover {
  background: #edf4f2;
  color: var(--teal-dark);
}

.segment.active {
  box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.08);
}

.secondary:hover,
.icon-button:hover {
  background: #dfe9e7;
  color: var(--teal-dark);
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
a:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.search input,
select,
.login-card input,
.sale-fields input,
.sale-fields textarea,
.operation-fields input,
.operation-fields textarea,
.operation-fields select {
  border-color: #cfd7e1;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.search input:focus,
select:focus,
.login-card input:focus,
.sale-fields input:focus,
.sale-fields textarea:focus,
.operation-fields input:focus,
.operation-fields textarea:focus,
.operation-fields select:focus {
  border-color: var(--teal);
  outline: none;
  box-shadow: var(--focus-ring);
}

.side {
  position: sticky;
  top: 156px;
}

.panel,
.table-panel {
  overflow: hidden;
  background: var(--surface);
}

.table-head {
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-soft) 100%);
}

.table-head h2 {
  margin-bottom: 4px;
}

.view-totals,
.selection-totals {
  background: #f8fbfb;
}

.table-wrap {
  background: var(--surface);
}

table {
  font-variant-numeric: tabular-nums;
}

th {
  background: #f7f9fb;
  box-shadow: 0 1px 0 var(--line);
  white-space: nowrap;
}

td {
  background-clip: padding-box;
}

tbody tr {
  transition: background-color 0.12s ease;
}

tbody tr:nth-child(even):not(.row-manual-demo):not(.row-missing-purchase) {
  background: #fcfdfe;
}

tbody tr:hover {
  background: #eef7f5;
}

.status,
.badge,
.bonus-evidence a,
.transaction-row,
.transaction-purchase-status,
.transaction-unmatched {
  box-shadow: 0 1px 0 rgba(25, 34, 45, 0.04);
}

.drawer {
  background: rgba(24, 32, 42, 0.42);
  backdrop-filter: blur(2px);
}

.drawer-inner {
  width: min(880px, 100%);
  border-left: 1px solid var(--line);
}

.drawer-top {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(10px);
}

.docs {
  background: #fbfcfd;
}

.doc,
.transaction-card,
.bonus-card,
.operation-card {
  border-color: var(--line);
  background: var(--surface);
}

.pdf-card-head {
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-soft) 100%);
}

.pdf-frame-slot,
.honda-pdf-direct {
  background: #e9eef3;
}

.empty {
  background: #fbfcfd;
}

.admin-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  align-items: end;
}

.admin-form label,
.admin-reset {
  display: grid;
  gap: 6px;
}

.admin-form label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.admin-form input,
.admin-form select,
.admin-reset input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #cfd7e1;
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--surface);
  color: var(--ink);
  font: inherit;
}

.admin-form-note {
  color: var(--muted);
  font-weight: 700;
}

.admin-error {
  color: var(--danger);
  font-weight: 800;
}

.admin-user-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.admin-reset {
  grid-template-columns: minmax(180px, 1fr) auto;
  align-items: center;
}

@media (max-width: 1080px) {
  .controls {
    position: static;
  }

  .side {
    position: static;
  }
}

@media (max-width: 720px) {
  body {
    font-size: 14px;
  }

  .topbar {
    min-height: 0;
  }

  .controls {
    padding: 8px;
  }

  .drawer-inner {
    width: 100%;
  }

  .admin-reset {
    grid-template-columns: 1fr;
  }
}
.inline-sort {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-left: 0.8rem;
  font-size: 0.82rem;
  font-weight: 700;
}

.inline-sort select {
  min-width: 10rem;
  padding: 0.4rem 0.55rem;
}

.inline-sort input[type="date"] {
  width: 9.5rem;
  padding: 0.4rem 0.55rem;
}

.financial-chart-title,
.stock-document-group > h3 {
  margin: 1rem 0 0.45rem;
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.approval-new-bike-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
  grid-column: 1 / -1;
  padding: 0.75rem;
  border: 1px solid var(--line, #d8ddd9);
  border-radius: 0.75rem;
  background: #f7faf8;
}

.approval-new-bike-fields label {
  display: grid;
  gap: 0.3rem;
}

.financial-bar {
  display: grid;
  grid-template-columns: minmax(6rem, 1fr) 2fr auto;
  align-items: center;
  gap: 0.45rem;
  margin: 0.65rem 0;
}

.financial-bar i {
  display: block;
  min-width: 3px;
  height: 0.55rem;
  border-radius: 999px;
  background: #1c6b56;
}

#dashboardShell.finance-mode .layout {
  grid-template-columns: 1fr;
}

#dashboardShell.finance-mode .side {
  grid-template-columns: minmax(210px, 0.28fr) minmax(0, 1fr);
  align-items: start;
}

#dashboardShell.finance-mode .table-wrap {
  max-height: 62vh;
}

.vat-switch {
  display: inline-flex;
  gap: 0.35rem;
  margin: 0.45rem 0.4rem 0.2rem 0;
  padding: 0.25rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: #f4f7f5;
}

.vat-switch button {
  min-height: 34px;
  padding: 0 0.8rem;
  border-radius: 0.55rem;
}

.vat-switch button.active {
  background: var(--teal);
  color: var(--white);
}

.finance-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.financial-charts {
  padding: 1rem;
  border-bottom: 1px solid var(--line);
  background: #fbfcfd;
}

.financial-quality-panel {
  margin-bottom: 0.9rem;
  padding: 1rem;
  border: 1px solid #cbded8;
  border-radius: 0.9rem;
  background: linear-gradient(135deg, #f4faf7 0%, #fff 70%);
}

.financial-quality-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.8rem;
}

.financial-quality-head h3,
.financial-quality-head small { margin: 0; }
.financial-quality-head small { color: var(--muted); font-weight: 800; }

.financial-quality-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
}

.financial-quality-grid button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 48px;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 0.65rem;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.financial-quality-grid button:hover,
.financial-quality-grid button:focus-visible {
  border-color: #72a99b;
  outline: none;
  background: #f0f8f4;
}

.financial-quality-grid span { color: var(--muted); font-size: 0.75rem; font-weight: 750; }
.financial-quality-grid strong { font-size: 0.92rem; }

.finance-chart-card {
  min-width: 0;
  padding: 0.9rem;
  border: 1px solid var(--line);
  border-radius: 0.9rem;
  background: linear-gradient(155deg, #ffffff 0%, #f6faf8 100%);
  box-shadow: 0 5px 16px rgb(18 48 40 / 7%);
}

.finance-chart-card h3 {
  margin: 0 0 0.8rem;
  color: var(--ink);
  font-size: 0.88rem;
}

.finance-chart-row {
  display: grid;
  grid-template-columns: minmax(6rem, 0.8fr) minmax(0, 2fr);
  gap: 0.55rem;
  align-items: start;
  margin: 0.6rem 0;
}

.finance-chart-row > span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-chart-series,
.finance-series-line {
  display: grid;
  gap: 0.22rem;
}

.finance-series-line i {
  display: block;
  min-height: 0.48rem;
  border-radius: 999px;
  background: #6d8f84;
  transition: width 180ms ease;
}

.finance-series-line {
  width: 100%;
  padding: 0.15rem 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.finance-series-line:hover,
.finance-series-line:focus-visible {
  outline: none;
  filter: saturate(1.25);
}

.finance-series-line:hover small,
.finance-series-line:focus-visible small { color: var(--ink); }

.finance-series-line i.teal { background: #1c8064; }
.finance-series-line i.navy { background: #274b64; }
.finance-series-line i.gold { background: #bf8731; }

.finance-series-line small {
  color: var(--muted);
  font-size: 0.65rem;
}

.financial-detail-dialog { width: min(1320px, 100%); }

#financialDetailBody {
  display: grid;
  gap: 1rem;
  padding: 1.1rem 1.25rem 1.35rem;
}

.financial-detail-explanation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.financial-detail-explanation > div {
  padding: 0.85rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: #f8faf9;
}

.financial-detail-explanation span,
.financial-reason-select span {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--teal);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
}

.financial-detail-explanation p { margin: 0; color: var(--ink); line-height: 1.5; }

.financial-reason-select { display: grid; grid-template-columns: minmax(130px, 0.25fr) minmax(260px, 0.75fr); align-items: center; gap: 0.75rem; }
.financial-reason-select span { margin: 0; }
.financial-reason-select select { width: 100%; min-height: 42px; padding: 0.5rem 0.65rem; border: 1px solid var(--line); border-radius: 0.6rem; background: #fff; }

.financial-brand-breakdown {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
}

.financial-brand-breakdown > div { padding: 0.75rem; border: 1px solid var(--line); border-radius: 0.65rem; background: #fff; }
.financial-brand-breakdown span,
.financial-brand-breakdown strong { display: block; }
.financial-brand-breakdown span { color: var(--muted); font-size: 0.72rem; font-weight: 800; }
.financial-brand-breakdown strong { margin-top: 0.3rem; }

.financial-detail-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 0.75rem; }
.financial-detail-table { width: 100%; min-width: 1060px; border-collapse: collapse; }
.financial-detail-table th { position: sticky; top: 0; z-index: 1; padding: 0.65rem; background: #eef4f1; color: var(--muted); font-size: 0.68rem; text-align: left; text-transform: uppercase; }
.financial-detail-table td { padding: 0.75rem 0.65rem; border-top: 1px solid var(--line); vertical-align: top; font-size: 0.78rem; }
.financial-detail-table td strong,
.financial-detail-table td small,
.financial-detail-table td a { display: block; margin-bottom: 0.24rem; }
.financial-detail-table td small { color: var(--muted); line-height: 1.35; }
.financial-reason { display: block; margin-bottom: 0.4rem; padding: 0.4rem 0.5rem; border-left: 3px solid #bf8731; background: #fff8e9; }
.financial-reason strong { color: #7d5414; font-size: 0.68rem; }
.financial-row-reasons { color: #8a5c18 !important; }
.financial-detail-empty { padding: 2rem; border: 1px dashed var(--line); border-radius: 0.75rem; color: var(--muted); text-align: center; }

@media (max-width: 720px) {
  .approval-new-bike-fields { grid-template-columns: 1fr; }
  .inline-sort { margin: 0.6rem 0 0; }
  #dashboardShell.finance-mode .side,
  .finance-chart-grid { grid-template-columns: 1fr; }
  .financial-quality-grid,
  .financial-detail-explanation,
  .financial-brand-breakdown { grid-template-columns: 1fr; }
  .financial-reason-select { grid-template-columns: 1fr; }
}
.stock-document-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 12px; }
.stock-document-card { display: flex; align-items: stretch; gap: 18px; min-width: 0; padding: 14px; background: #fff; border: 1px solid #e0e8e8; border-radius: 16px; color: #203435; text-decoration: none; transition: border-color .16s, box-shadow .16s; }
.stock-document-card:hover, .stock-document-card:focus-visible { border-color: #27716d; box-shadow: 0 5px 18px #244b4912; outline-offset: 3px; }
.stock-document-preview { position: relative; width: 112px; min-width: 112px; height: 144px; overflow: hidden; border: 1px solid #e3e8e8; border-radius: 9px; background: #f0f4f3; }
.stock-document-preview img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.stock-document-preview > span:first-child { display: block; padding: 30px; color: #687d7b; text-align: center; }
.stock-document-format { position: absolute; bottom: 7px; left: 7px; background: #fff; padding: 3px 6px; border-radius: 4px; font-size: 10px; font-weight: 750; letter-spacing: .06em; }
.stock-document-info { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 4px 0; }
.stock-document-kind { color: #52716e; font-size: 11px; font-weight: 650; }
.stock-document-info h4 { font-size: 18px; margin: 6px 0 8px; overflow-wrap: anywhere; }
.stock-document-info p { font-size: 12px; margin: 0 0 7px; color: #526665; }
.stock-document-info small { font-size: 11px; color: #71807f; line-height: 1.5; overflow-wrap: anywhere; }
.document-identity-override { margin-top: 7px; padding: 7px 9px; border-left: 3px solid #c98926; border-radius: 5px; background: #fff7e5; color: #775216 !important; }
.stock-document-action { margin-top: auto; padding-top: 12px; color: #20645e; font-size: 12px; font-weight: 700; }
.stock-document-card.is-unresolved .stock-document-action { color: #916313; }
.stock-document-group { margin-bottom: 24px; }
.stock-document-group > h3 span { display: inline-block; margin-left: 5px; padding: 2px 7px; background: #e9f1ef; border-radius: 6px; font-size: 11px; }
.stock-pdf-chip { background: #edf5f2; color: #245c56; border: 1px solid #dbe9e4; border-radius: 7px; padding: 5px 8px; font-size: 12px; cursor: pointer; }
.stock-document-history { margin-top: 20px; color: #687d7b; }
.focused-pdf-dialog { border-radius: 18px; }
.focused-pdf-page-label [data-vin-result] { margin-left: 12px; font-size: 12px; font-weight: 500; }
.pdf-result-document { display: flex; align-items: flex-start; gap: 18px; min-width: 0; }
.pdf-result { border: 1px solid #dce7e8; border-radius: 18px; box-shadow: 0 5px 20px #163c4610; background: linear-gradient(120deg, #fff 70%, #f2f9f8); }
.pdf-result h3 { overflow-wrap: anywhere; line-height: 1.45; }
.pdf-result-document > div { min-width: 0; }
.pdf-result-document small { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #637480; line-height: 1.6; }
.pdf-page-count { display: inline-block; padding: 5px 9px; border-radius: 8px; background: #eaf2fa; color: #355673; font-size: 12px; font-weight: 600; }
.crm-open { overflow:hidden; }
.crm-panel { position:fixed; inset:0; z-index:5000; overflow:auto; background:#eef4f5; color:#19363c; padding:24px; }
.crm-panel[hidden],.crm-form[hidden] { display:none; }
.crm-shell { max-width:1450px; margin:auto; }
.crm-header,.crm-toolbar,.crm-task-top,.crm-person>div { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.crm-header h2 { font-size:32px; margin:8px 0; }
.crm-people,.crm-tasks { display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:16px; margin:20px 0; }
.crm-person,.crm-task { border:1px solid #d9e4e6; border-radius:18px; padding:22px; background:#fff; box-shadow:0 8px 28px #18384008; }
.crm-person small,.crm-task small { display:block; color:#61767d; line-height:1.7; }
.crm-presence { font-size:12px; color:#647780; }
.crm-presence.is-online { color:#187556; }
.crm-task.is-working { border-left:5px solid #288b80; }
.crm-task h3,.crm-person h3 { overflow-wrap:anywhere; line-height:1.5; }
.crm-toolbar { justify-content:flex-start; margin:28px 0 16px; }
.crm-toolbar label,.crm-form label { display:flex; flex-direction:column; gap:7px; font-size:13px; }
.crm-panel input,.crm-panel select,.crm-panel textarea { border:1px solid #c9d8db; background:white; border-radius:9px; padding:11px; color:#19363c; min-width:0; max-width:100%; }
.crm-form { padding:24px; border-radius:16px; background:#fff; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.crm-form h3,.crm-wide { grid-column:1/-1; }.crm-form textarea{min-height:80px;}
.crm-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:18px; }
.crm-actions button { padding:9px 13px; border:1px solid #cfdddf; border-radius:9px; color:#225b5d; background:#f2f7f7; cursor:pointer; }
.crm-notes { white-space:pre-wrap; overflow-wrap:anywhere; }.crm-summary{color:#597078;font-size:13px;line-height:1.8;}
.crm-description { white-space:pre-wrap; overflow-wrap:anywhere; font-size:15px; line-height:1.65; color:#234349; }
.crm-bike { padding:10px 12px; border-radius:10px; background:#edf5f3; color:#235f56; font-weight:650; }
.crm-progress { height:8px; overflow:hidden; margin:15px 0 6px; border-radius:99px; background:#e3eceb; }
.crm-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#27796f,#53b7a8); }
.crm-kpis { display:grid; grid-template-columns:repeat(5,minmax(120px,1fr)); gap:12px; margin:18px 0; }
.crm-kpis article { padding:16px; border:1px solid #d6e5e2; border-radius:14px; background:linear-gradient(145deg,#fff,#f1f8f6); }
.crm-kpis span,.crm-kpis strong { display:block; }.crm-kpis span{font-size:12px;color:#607673}.crm-kpis strong{font-size:24px;margin-top:7px;color:#173f3b}
.crm-report-tools { display:flex; align-items:end; gap:10px; flex-wrap:wrap; }.crm-report-tools>div{flex-basis:100%}.crm-report-tools label{display:grid;gap:6px;font-size:12px}
.crm-panel.is-employee .crm-people { grid-template-columns:minmax(0,600px); }
.crm-panel.is-employee .crm-person { padding:16px; box-shadow:none; }
.crm-panel.is-employee .employee-toolbar label:first-child { display:none; }
.crm-panel.is-employee .crm-history,.crm-panel.is-employee .crm-header p { display:none; }
.crm-panel.is-employee .crm-task { max-width:760px; padding:18px; box-shadow:0 6px 20px #1838400c; }
#crmError:not(:empty) { margin:15px 0; padding:14px; background:#fff0e9; border:1px solid #e5b397; border-radius:10px; color:#803c20; }
.crm-history { background:white; border-radius:14px; padding:20px; }.crm-history p{font-size:13px;line-height:1.6;border-bottom:1px solid #edf1f2;padding-bottom:8px;}
.crm-panel footer { padding:22px 0; color:#637880; font-size:12px; line-height:1.8; }
@media(max-width:700px){.crm-panel{padding:10px}.crm-form{grid-template-columns:1fr;padding:16px}.crm-header h2{font-size:25px}.crm-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-people,.crm-tasks{grid-template-columns:1fr;gap:10px;margin:12px 0}.crm-task{padding:16px}.crm-actions button{flex:1;min-height:46px}.crm-panel.is-employee .crm-toolbar{margin:14px 0}.crm-panel.is-employee .crm-report-tools{padding:12px;background:#fff;border-radius:12px}.crm-panel input,.crm-panel select,.crm-panel textarea{font-size:16px}}
.pdf-result-thumb { width: 116px; height: 148px; flex: 0 0 116px; padding: 0; overflow: hidden; border: 1px solid #dde4ea; border-radius: 10px; background: #f4f6f8; cursor: pointer; }
.pdf-result-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
@media (max-width: 640px) { .pdf-result-document { gap: 10px; } .pdf-result-thumb { width: 72px; height: 102px; flex-basis: 72px; } }
.crm-live-visible { padding-bottom:100px; }
.crm-live-bar { position:fixed; left:20px; right:20px; bottom:14px; z-index:30; display:flex; align-items:center; gap:16px; padding:14px 20px; border:1px solid #c6dcd8; border-radius:18px; background:rgba(247,252,251,.97); box-shadow:0 8px 35px #16393424; backdrop-filter:blur(12px); }
.crm-live-bar[hidden] { display:none; }.crm-live-bar>strong{color:#255b56;white-space:nowrap}.crm-live-bar button{flex:1;min-width:0;border:0;border-left:1px solid #d8e4e2;background:transparent;text-align:left;padding:4px 16px;color:#223e43;cursor:pointer}.crm-live-bar button span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;margin-top:5px}.crm-live-bar small{color:#667e7f;font-size:11px;max-width:140px}
@media(max-width:700px){.crm-live-bar{left:6px;right:6px;gap:6px;padding:10px;flex-wrap:wrap}.crm-live-bar>strong,.crm-live-bar small{display:none}.crm-live-bar button{padding:4px 8px}.crm-live-visible{padding-bottom:110px}}
.crm-service-editor{border-top:1px solid #d7e5e3;padding-top:20px}.crm-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.crm-service-editor>label{margin-top:14px}.crm-estimate-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.crm-estimate-line{display:grid;grid-template-columns:1fr 1.4fr 2fr .7fr .9fr auto;gap:10px;align-items:end;padding:12px 0;border-top:1px solid #edf2f1}.crm-service-editor button,.crm-service-card button,.crm-report-tools button{border:1px solid #cbddda;background:#edf6f3;padding:10px 14px;border-radius:9px;color:#245e54;cursor:pointer}.crm-help{color:#667c78;font-size:12px;line-height:1.7}.crm-service-card{border-top:1px solid #e0eae8;margin:18px 0;padding:16px 0}.crm-order-ref{font-size:11px;color:#627e77;overflow-wrap:anywhere}.crm-checklist{display:grid;gap:9px;margin:14px 0}.crm-checklist label{display:flex;align-items:center;gap:10px}.crm-checklist input{width:18px;height:18px}.crm-service-card details{font-size:13px;line-height:1.8}.crm-report-tools{margin:16px 0}.crm-report-tools p{font-size:13px;line-height:1.6}.crm-toolbar>input{max-width:260px}.crm-person select{margin-top:12px;max-width:100%}
@media(max-width:700px){.crm-service-grid{grid-template-columns:1fr}.crm-estimate-line{grid-template-columns:1fr 1fr}.crm-estimate-header{align-items:start;flex-direction:column}}
.crm-finance { margin:20px 0; padding:22px; border:1px solid #cddfdb; border-radius:20px; background:linear-gradient(145deg,#f9fdfc,#edf6f4); box-shadow:0 16px 45px #143b3512; }
.crm-finance>header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.crm-finance h3 { margin:5px 0; font-size:24px; color:#173e38; }.crm-finance h4{margin-top:0}.crm-finance p{color:#627874;line-height:1.6}
.crm-finance button { border:1px solid #bdd8d2; border-radius:10px; padding:10px 14px; background:#fff; color:#205f56; font-weight:650; cursor:pointer; }
.crm-finance button:disabled{opacity:.55;cursor:wait}.crm-finance-tabs{display:flex;gap:8px;margin:18px 0;flex-wrap:wrap}.crm-finance-tabs .is-active{background:#286f65;color:#fff}
.crm-finance-kpis { display:grid; grid-template-columns:repeat(5,minmax(125px,1fr)); gap:10px; margin:18px 0; }.crm-finance-kpis article{padding:14px;border:1px solid #d2e3df;border-radius:13px;background:#fff}.crm-finance-kpis span,.crm-finance-kpis strong{display:block}.crm-finance-kpis span{font-size:11px;color:#667d78}.crm-finance-kpis strong{font-size:20px;margin-top:6px;color:#174b43}
.crm-finance-columns { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(380px,1.2fr); gap:18px; }.crm-finance form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start;padding:18px;border:1px solid #d9e7e4;border-radius:14px;background:#fff}.crm-finance form h4,.crm-finance form p,.crm-finance form>button{grid-column:1/-1}.crm-finance label{display:grid;gap:6px;font-size:12px;color:#506d67}.crm-finance input,.crm-finance select,.crm-finance textarea{width:100%;box-sizing:border-box}
.crm-stock-card,.crm-ledger article,.crm-invoice-card{padding:15px;margin-bottom:10px;border:1px solid #dce7e4;border-radius:13px;background:#fff}.crm-stock-card>div,.crm-ledger article>div,.crm-invoice-card>div{display:flex;justify-content:space-between;gap:12px}.crm-stock-card span,.crm-stock-card small,.crm-ledger span,.crm-ledger small{display:block;color:#657b76;margin-top:5px}.crm-stock-card.is-low{border-left:5px solid #d58a38;background:#fffaf3}.crm-finance-search{margin-bottom:10px}
.crm-invoice-create{margin-bottom:16px}.crm-invoice-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}.crm-invoice-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.crm-invoice-card dl div{padding:9px;background:#f2f7f5;border-radius:8px}.crm-invoice-card dt{font-size:11px;color:#667b77}.crm-invoice-card dd{margin:4px 0 0;font-weight:700}.crm-invoice-card form{margin-top:12px}.crm-invoice-summary{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;padding:10px;border-radius:10px;background:#eef7f4;color:#275f57}
.crm-finance [data-finance-error]:not(:empty){margin:12px 0;padding:11px;border:1px solid #e5b397;border-radius:9px;background:#fff0e9;color:#803c20}
@media(max-width:900px){.crm-finance-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-finance-columns{grid-template-columns:1fr}.crm-estimate-line{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.crm-finance{padding:14px}.crm-finance>header{flex-direction:column}.crm-finance form{grid-template-columns:1fr}.crm-finance-kpis{grid-template-columns:1fr 1fr}.crm-invoice-list{grid-template-columns:1fr}}
/* CRM customer directory and service agenda */
.crm-customers { margin: 20px 0; padding: 18px; background: #fff; border: 1px solid #dce6e4; border-radius: 16px; }
.crm-customer-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:14px 0; border-bottom:1px solid #e6eeec; }
.crm-customer-row > div { flex:1; min-width:180px; }
.crm-customer-row small { display:block; color:#60716f; margin-top:5px; }
.crm-customers form { padding:16px; margin-top:12px; background:#f4f8f7; border-radius:12px; }
.crm-customers input,.crm-customers textarea { max-width:100%; }
.crm-customers label { display:grid; gap:7px; color:#536c68; font-size:13px; }
.crm-customers .crm-service-grid input,.crm-customers .crm-service-grid textarea { width:100%; box-sizing:border-box; }
.crm-customers button { border:1px solid #d5e4e0; border-radius:10px; padding:10px 15px; background:#edf5f2; color:#285f59; font:inherit; font-weight:600; cursor:pointer; }
.crm-customers button:hover { background:#dfeee8; }
.crm-customers button:disabled { opacity:.55; cursor:wait; }
.crm-customers form > button { margin:16px 8px 0 0; }
.crm-customers input[type=checkbox] { width:auto; }
.crm-customers [data-ack-label] { display:flex; align-items:center; margin-top:14px; }
.crm-panel [hidden] { display:none !important; }
.crm-form [data-pick],.crm-form [data-unlink] { border:1px solid #d5e4e0; border-radius:10px; padding:10px 15px; background:#edf5f2; color:#285f59; cursor:pointer; }

/* --- Stok ekrani sadelestirmesi (2026-09-16) ------------------------------- */

/* Siralama tablo basliklarindan yapiliyor; ayri bir sort kontrolu yok. */
th.sortable { padding: 0; }
th.sortable button {
  width: 100%;
  background: none;
  border: 0;
  padding: 10px 12px;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
th.sortable button:hover { background: rgba(15, 23, 42, 0.05); }
th.sortable.sorted button { color: #0f172a; font-weight: 700; }
.sort-arrow { font-size: 11px; opacity: 0.75; }

/* Durum kartlari ayni zamanda durum filtresi. Aktif olan belirgin. */
.stock-status-card {
  cursor: pointer;
  border: 1px solid transparent;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.stock-status-card:hover { background: rgba(15, 23, 42, 0.04); }
.stock-status-card.is-active {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}
.stock-status-card.is-active span,
.stock-status-card.is-active strong,
.stock-status-card.is-active small { color: #fff; }

/* Paketler: kompakt, tabloyu buyutmeyen serbest metin alani. */
.packages-cell { max-width: 150px; }
.packages-input {
  width: 100%;
  min-width: 90px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  padding: 4px 6px;
  font: inherit;
  font-size: 13px;
  color: inherit;
}
.packages-input:hover { border-color: rgba(15, 23, 42, 0.18); }
.packages-input:focus {
  border-color: #0f766e;
  background: #fff;
  outline: none;
}
.packages-input::placeholder { color: rgba(15, 23, 42, 0.3); }

/* Dagilim varsayilan kapali, geri planda. */
.panel-collapsible > summary {
  cursor: pointer;
  list-style: none;
  font-size: 13px;
  font-weight: 600;
  color: rgba(15, 23, 42, 0.65);
  padding: 2px 0;
}
.panel-collapsible > summary::-webkit-details-marker { display: none; }
.panel-collapsible > summary::before { content: "▸ "; font-size: 10px; }
.panel-collapsible[open] > summary::before { content: "▾ "; }
.panel-collapsible > summary:hover { color: #0f172a; }

/* Dil dugmesi: geri planda, sabit genislikte (TR/EN gecisinde baslik oynamasin). */
.lang-toggle {
  min-width: 42px;
  font-weight: 700;
  letter-spacing: 0.04em;
  opacity: 0.75;
}
.lang-toggle:hover { opacity: 1; }

/* --- Yan panel kaldirildi, ozet popup'a tasindi (2026-09-16) ---------------- */

/* Bir select'e hidden vermek CSS display kurallarina yenilebiliyor; sinif kesin. */
.is-hidden { display: none !important; }

/* Yan panel gidince tablo tum genisligi kullanmali. */
.layout { grid-template-columns: 1fr; }

.summary-button { font-size: 13px; }

.summary-dialog { max-width: 520px; }
.summary-modal-body {
  display: grid;
  gap: 20px;
  padding: 4px 2px 2px;
}
.summary-modal-body h3 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(15, 23, 42, 0.6);
  text-transform: none;
}

/* ---------------------------------------------------------------------------
   Ust sekme seridi
   Serit basligin hemen altinda ve sabit duruyor; boylece hangi ekranda olursan
   ol Ana Sayfa'ya veya baska bir sekmeye tek tikla donulebiliyor. Eskiden filtre
   satirinin icindeydi ve detay ekranlarinda tamamen gizleniyordu.
   --topbar-h app.js tarafindan olculup yaziliyor; sabit sayiya bagli degil.
--------------------------------------------------------------------------- */
.mainnav {
  position: sticky;
  top: var(--topbar-h, 78px);
  z-index: 4;
  padding: 0 28px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(12px);
}

.mainnav .segments {
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.mainnav .segments::-webkit-scrollbar {
  display: none;
}

.mainnav .segment {
  flex: 0 0 auto;
  min-height: 48px;
  padding: 0 18px;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

.mainnav .segment:hover {
  background: transparent;
  color: var(--teal-dark);
}

.mainnav .segment.active {
  border-bottom-color: var(--teal);
  background: transparent;
  color: var(--teal-dark);
  font-weight: 700;
  box-shadow: none;
}

@media (max-width: 900px) {
  .mainnav {
    padding: 0 12px;
  }

  .mainnav .segments {
    display: flex;
    grid-template-columns: none;
  }

  .mainnav .segment {
    min-height: 44px;
    padding: 0 13px;
  }
}

/* ---------------------------------------------------------------------------
   Baslik logosu
--------------------------------------------------------------------------- */
.brand-mark {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.brand-mark img {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  object-fit: contain;
}

@media (max-width: 700px) {
  .brand-mark img {
    width: 30px;
    height: 30px;
  }
}

/* ---------------------------------------------------------------------------
   Ekip seridi: varsayilan kapali
   Serit ekranin altina sabitlenmisti ve belge/fatura panelinin alt kenarini
   kapatiyordu. Artik kucuk bir dugmeye inmis durumda; basinca aciliyor.
   Durum govdedeki sinifta tutuluyor cunku crm.js seridin icerigini her
   guncellemede bastan yaziyor -- seridin icine konan bir dugme silinirdi.
--------------------------------------------------------------------------- */
.crm-live-toggle {
  position: fixed;
  right: 18px;
  bottom: 16px;
  z-index: 31;
  display: none;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid #c6dcd8;
  border-radius: 999px;
  background: rgba(247, 252, 251, 0.97);
  box-shadow: 0 4px 16px rgba(22, 57, 52, 0.12);
  color: #255b56;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  backdrop-filter: blur(10px);
}

body.crm-live-visible .crm-live-toggle {
  display: inline-flex;
}

.crm-live-toggle::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2f8f83;
}

.crm-live-toggle:hover {
  background: #edf6f4;
}

/* Kapaliyken: serit gizli, dugme gorunur, sayfanin alt bosluguna gerek yok. */
body.crm-live-collapsed .crm-live-bar {
  display: none;
}

body.crm-live-visible.crm-live-collapsed {
  padding-bottom: 0;
}

/* Acikken dugme seridin ustune binmesin diye serit biraz yukari alinir. */
body.crm-live-visible:not(.crm-live-collapsed) .crm-live-toggle {
  bottom: auto;
  top: auto;
  right: 18px;
  bottom: 118px;
}

/* ---------------------------------------------------------------------------
   Tasi menusu
   Kucuk ve sakin: dugmenin altinda acilir, tabloyu itmez, kapanmasi kolay.
--------------------------------------------------------------------------- */
.stock-move-menu {
  position: absolute;
  z-index: 40;
  min-width: 190px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  box-shadow: 0 10px 30px rgba(25, 34, 45, 0.14);
}

.stock-move-menu[hidden] {
  display: none;
}

.stock-move-title {
  margin: 4px 8px 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-move-menu button {
  display: block;
  width: 100%;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--ink, #1f2933);
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

.stock-move-menu button:hover {
  background: #edf4f2;
  color: var(--teal-dark);
}

/* Tema dugmesi — dil dugmesiyle ayni gorunum, tek karakterlik isaret. */
.theme-toggle {
  min-width: 34px;
  padding: 0 10px;
  font-size: 15px;
  line-height: 1;
}

/* ---------------------------------------------------------------------------
   Yapiskan tablo basligi
   .table-wrap overflow:auto ile kendi icinde kayar. Basligin top degeri
   sayfa menusune degil bu kaydirma alanina gore hesaplanir.
--------------------------------------------------------------------------- */
thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--surface, #ffffff);
  /* Satirlar basligin altindan gecerken alt cizgi kaybolmasin. */
  box-shadow: inset 0 -1px 0 var(--line, #d9dee7);
}

/* Ana sayfada baslik zaten gizli; yapiskanliga gerek yok. */
#dashboardShell.home-mode thead th {
  position: static;
}

/* ---------------------------------------------------------------------------
   Global arama (Ctrl/Cmd + K)
   Ekranin ustune degil, ustten bir miktar asagiya konumlanir: goz zaten orada.
--------------------------------------------------------------------------- */
.global-search {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 12vh 16px 16px;
  background: rgba(15, 23, 32, 0.45);
  backdrop-filter: blur(3px);
}

.global-search[hidden] {
  display: none;
}

.global-search-box {
  width: 100%;
  max-width: 620px;
  overflow: hidden;
  border: 1px solid var(--line, #d9dee7);
  border-radius: 14px;
  background: var(--surface, #ffffff);
  box-shadow: 0 24px 60px rgba(15, 23, 32, 0.28);
}

.global-search-box input {
  width: 100%;
  min-height: 52px;
  padding: 0 18px;
  border: 0;
  border-bottom: 1px solid var(--line, #d9dee7);
  background: transparent;
  color: var(--ink, #18202a);
  font-size: 16px;
  outline: none;
}

.global-search-results {
  max-height: 46vh;
  overflow-y: auto;
  padding: 6px;
}

.global-search-group {
  margin: 8px 10px 4px;
  color: var(--muted, #637082);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.global-search-row {
  display: block;
  width: 100%;
  padding: 8px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink, #18202a);
  text-align: left;
  cursor: pointer;
}

.global-search-row strong {
  display: block;
  font-size: 14px;
}

.global-search-row small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: var(--muted, #637082);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.global-search-row:hover,
.global-search-row.is-active {
  background: #edf4f2;
}

.global-search-empty {
  margin: 0;
  padding: 18px;
  color: var(--muted, #637082);
  font-size: 13px;
  text-align: center;
}

.global-search-hint {
  margin: 0;
  padding: 8px 14px;
  border-top: 1px solid var(--line, #d9dee7);
  color: var(--muted, #637082);
  font-size: 11px;
}

@media (max-width: 700px) {
  .global-search {
    padding: 6vh 10px 10px;
  }
}

/* ---------------------------------------------------------------------------
   Hareket hassasiyeti
   Isletim sisteminde "hareketi azalt" secili olan kullanicilar icin gecisler
   kapatilir. Arayuz aynen calisir, yalnizca animasyon olmaz.
   Tamamen kaldirmak yerine cok kisa birakiliyor: bazi tarayicilarda 0s gecis
   transitionend olayini hic tetiklemiyor.
--------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Stok sayimi — fiziksel sayim sirasinda satir basina isaretleme.
   Acik tema bolumunde durmali: karanlik tema isaretinin altindaki her sey
   build_dark_theme.py calistiginda siliniyor. */
.stock-count-summary { margin: 0; padding: 14px 20px; color: var(--ink); background: var(--surface-soft); }
.stock-count-cell { width: 110px; }
.stock-count-check { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; white-space: nowrap; }
.stock-count-check input { width: 24px; height: 24px; accent-color: var(--teal, #24766d); cursor: pointer; }
.stock-count-check:has(input:checked) { color: var(--teal-dark, #24766d); font-weight: 700; }
#stockCountToggle[aria-pressed="true"] { outline: 2px solid var(--teal, #24766d); outline-offset: 2px; }

/* ==== KARANLIK TEMA — build_dark_theme.py tarafindan uretildi ==== */
/* Acik temaya DOKUNULMADI. Bu blok silinirse arayuz eski haline doner.
   Ton (hue) korunur, yalnizca aydinlik ters cevrilir -- marka renkleri ayni kalir.
   Uretilen kural sayisi: 235 */

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e6ebf1;            /* ana metin */
  --text: #e6ebf1;
  --muted: #9aa7b8;          /* ikincil metin */
  --line: #2b3440;           /* kenarlik */
  --line-soft: #222a34;
  --paper: #12171d;          /* sayfa zemini */
  --surface: #1a2028;        /* kart/tablo yuzeyi */
  --surface-soft: #151b22;
  --white: #1a2028;          /* 'beyaz' artik koyu yuzey demek */
  --teal: #3fa79f;           /* vurgu: ton korundu, aydinlatildi */
  --teal-dark: #6cc5bd;
  --gold: #d9a441;
  --red: #e07a6d;
  --green: #5cbf7a;
  --blue: #6fa0e0;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.55);
  --shadow-card: 0 8px 22px rgba(0, 0, 0, 0.40);
  --shadow-hover: 0 14px 34px rgba(0, 0, 0, 0.50);
  --focus-ring: 0 0 0 3px rgba(63, 167, 159, 0.35);
}

/* Zemin ve metin acikca yazilir: body bu degiskenleri kullanmayan bir
   kuraldan geliyorsa yine de dogru renkte olsun. */
:root[data-theme="dark"] body { background: #12171d; color: #e6ebf1; }

:root[data-theme="dark"] .topbar { background: rgba(31, 31, 31, 0.94); }
:root[data-theme="dark"] .notification { box-shadow: 0 10px 26px rgba(0, 0, 0, 0.30); }
:root[data-theme="dark"] .matched-doc { background: #1d2822; }
:root[data-theme="dark"] .brand-card { box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22); }
:root[data-theme="dark"] .brand-card[data-brand="second_hand"] { border-left-color: #699dd8; }
:root[data-theme="dark"] .stock-row-review { background: #4c3700; }
:root[data-theme="dark"] .bar { background: #1f2834; }
:root[data-theme="dark"] .doc-line { border-bottom: 1px solid #1e2631; }
:root[data-theme="dark"] .view-totals { background: #16202b; }
:root[data-theme="dark"] .view-total-action:hover, :root[data-theme="dark"] .view-total-action:focus-visible { border-color: #abccc3; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.31); }
:root[data-theme="dark"] .view-total.alert { border-color: #562219; background: #420800; }
:root[data-theme="dark"] .payment-summary-controls > div { border: 1px solid #1e2631; background: #16202b; }
:root[data-theme="dark"] .payment-summary-detail { border-top: 1px solid #1e2631; }
:root[data-theme="dark"] .payment-summary-claim { border: 1px solid #2c433e; background: #143223; }
:root[data-theme="dark"] .payment-summary-claim.alert { border-color: #674f16; background: #462f00; }
:root[data-theme="dark"] .payment-summary-cards > div { background: #16202b; }
:root[data-theme="dark"] .payment-summary-cards > div.alert { border-color: #562219; background: #420800; }
:root[data-theme="dark"] .payment-summary-table { border: 1px solid #1e2631; }
:root[data-theme="dark"] .payment-summary-row { border-bottom: 1px solid #1e2631; }
:root[data-theme="dark"] .payment-summary-empty { border: 1px dashed #2c433e; background: #162b20; }
:root[data-theme="dark"] .selection-totals { background: #172f2a; }
:root[data-theme="dark"] .selection-total, :root[data-theme="dark"] .selection-empty { border: 1px solid #2d4742; }
:root[data-theme="dark"] .selection-empty.idle { background: #162b20; }
:root[data-theme="dark"] .secondary { background: #203432; }
:root[data-theme="dark"] .secondary.ghost { background: #1c232e; }
:root[data-theme="dark"] .upload-panel { background: #162b20; }
:root[data-theme="dark"] .workflow-grid { background: #16202b; }
:root[data-theme="dark"] .workflow-card { border-left: 5px solid #2d3943; }
:root[data-theme="dark"] .workflow-card.emphasis { background: #172e28; }
:root[data-theme="dark"] .workflow-meta { border-top: 1px solid #1e2631; }
:root[data-theme="dark"] th, :root[data-theme="dark"] td { border-bottom: 1px solid #1e2631; }
:root[data-theme="dark"] th { background: #1b2228; }
:root[data-theme="dark"] .pdf-card-head { background: #16202b; }
:root[data-theme="dark"] .pdf-merged-card { border-color: #2d4747; }
:root[data-theme="dark"] .pdf-merged-card > .pdf-card-head { border-bottom-color: #2d4747; background: #172e28; }
:root[data-theme="dark"] .pdf-unified-records { background: #1b2a25; }
:root[data-theme="dark"] .pdf-frame-slot { background: #1d2831; }
:root[data-theme="dark"] .pdf-workspace-note { border: 1px solid #26413c; background: #13332a; }
:root[data-theme="dark"] .pdf-card-samples span { background: #1d312b; }
:root[data-theme="dark"] .honda-pdf-direct { background: #1d2831; }
:root[data-theme="dark"] .select-box span { border: 2px solid #3b4552; }
:root[data-theme="dark"] tbody tr:hover { background: #1b2e2a; }
:root[data-theme="dark"] tbody tr.row-manual-demo { background: #534300; }
:root[data-theme="dark"] tbody tr.row-manual-demo:hover { background: #685200; }
:root[data-theme="dark"] tbody tr.row-missing-purchase { background: #470900; }
:root[data-theme="dark"] tbody tr.row-missing-purchase:hover { background: #500a00; }
:root[data-theme="dark"] .status { background: #1d3629; }
:root[data-theme="dark"] .status.bought { background: #162336; }
:root[data-theme="dark"] .status.alert { background: #3c1813; }
:root[data-theme="dark"] .status.demo { background: #553600; }
:root[data-theme="dark"] .status.showroom { background: #203432; }
:root[data-theme="dark"] .drawer { background: rgba(232, 236, 242, 0.36); }
:root[data-theme="dark"] .badge { background: #203432; }
:root[data-theme="dark"] .icon-button { background: #1e2631; }
:root[data-theme="dark"] .total-box { background: #16202b; }
:root[data-theme="dark"] .sale-modal, :root[data-theme="dark"] .approval-modal { background: rgba(232, 236, 242, 0.42); }
:root[data-theme="dark"] .focused-pdf-modal { background: rgba(232, 236, 247, 0.72); }
:root[data-theme="dark"] .focused-pdf-highlight { background: #554500; border-bottom: 1px solid #6c6017; }
:root[data-theme="dark"] .focused-pdf-highlight span, :root[data-theme="dark"] .focused-pdf-highlight small { color: #fff3c1; }
:root[data-theme="dark"] .focused-pdf-highlight strong { background: #fff48f; border: 2px solid #eb9078; }
:root[data-theme="dark"] .focused-pdf-frame { background: #ebebeb; }
:root[data-theme="dark"] .focused-pdf-page-label { background: #14222f; }
:root[data-theme="dark"] .focused-pdf-frame img { background: #1f1f1f; box-shadow: 0 16px 36px rgba(0, 0, 0, 0.58); }
:root[data-theme="dark"] .focused-pdf-error { border: 1px solid #591e14; background: #460f00; color: #cb5f53; }
:root[data-theme="dark"] .approval-summary article { background: #1d2822; }
:root[data-theme="dark"] .approval-manual-panel { background: #462f00; }
:root[data-theme="dark"] .approval-system-suggestion { border: 1px solid #28453f; background: #18332c; }
:root[data-theme="dark"] .sale-fields input:disabled { background: #1d252c; }
:root[data-theme="dark"] .doc header { background: #19252b; }
:root[data-theme="dark"] .visual-card { background: #1f2a2f; }
:root[data-theme="dark"] .visual-overlay { border: 1px solid rgba(41, 53, 64, 0.9); background: rgba(31, 31, 31, 0.94); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.33); }
:root[data-theme="dark"] .bonus-summary.ok, :root[data-theme="dark"] .bonus-status.ok { background: #203426; color: #49b071; }
:root[data-theme="dark"] .bonus-summary.missing, :root[data-theme="dark"] .bonus-status.missing { background: #3e1e15; color: #cd6859; }
:root[data-theme="dark"] .bonus-status.watch { background: #493c11; color: #e5a123; }
:root[data-theme="dark"] .bonus-overview div { background: #16202b; }
:root[data-theme="dark"] .bonus-line { border-bottom: 1px solid #1e2631; }
:root[data-theme="dark"] .bonus-line-missing { background: #430f00; }
:root[data-theme="dark"] .bonus-line-watch { background: #453500; }
:root[data-theme="dark"] .bonus-evidence a, :root[data-theme="dark"] .bonus-evidence small { background: #1f2f2d; }
:root[data-theme="dark"] .bonus-evidence a.bonus-evidence-link { background: #1a3b30; border: 1px solid #2e4f48; }
:root[data-theme="dark"] .bonus-evidence a.bonus-evidence-link:hover { background: #1f4138; }
:root[data-theme="dark"] .bonus-evidence a.transaction-evidence-link { background: #5a4500; border-color: #745d18; color: #fff1c2; }
:root[data-theme="dark"] .bonus-evidence a.sepa-evidence-link { background: #001848; border-color: #132a56; color: #4b79c2; }
:root[data-theme="dark"] .transaction-purchase-status { background: #143223; }
:root[data-theme="dark"] .transaction-purchase-status.ok { border-color: #2a4b38; background: #173421; }
:root[data-theme="dark"] .transaction-purchase-status.alert { border-color: #4e251c; background: #430d00; }
:root[data-theme="dark"] .transaction-unmatched { border: 1px solid #674f16; background: #462f00; }
:root[data-theme="dark"] .transaction-unmatched strong { color: #fff1c2; }
:root[data-theme="dark"] .transaction-row { background: #162b20; }
:root[data-theme="dark"] .transaction-row.outgoing { border-left-color: #e28e32; }
:root[data-theme="dark"] .transaction-row.incoming { border-left-color: #4cbb84; }
:root[data-theme="dark"] .transaction-mark { border: 2px solid #eb9078; background: #fff48f; }
:root[data-theme="dark"] body { background:
    linear-gradient(180deg, #17222e 0, var(--paper) 260px),
    var(--paper); }
:root[data-theme="dark"] .topbar { background: rgba(31, 31, 31, 0.97); box-shadow: 0 8px 22px rgba(0, 0, 0, 0.17); }
:root[data-theme="dark"] .controls { background: rgba(29, 37, 44, 0.95); }
:root[data-theme="dark"] .segments { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.85); }
:root[data-theme="dark"] .segment:hover { background: #1e312b; }
:root[data-theme="dark"] .segment.active { box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.22); }
:root[data-theme="dark"] .secondary:hover, :root[data-theme="dark"] .icon-button:hover { background: #263734; }
:root[data-theme="dark"] .search input, :root[data-theme="dark"] select, :root[data-theme="dark"] .login-card input, :root[data-theme="dark"] .sale-fields input, :root[data-theme="dark"] .sale-fields textarea, :root[data-theme="dark"] .operation-fields input, :root[data-theme="dark"] .operation-fields textarea, :root[data-theme="dark"] .operation-fields select { border-color: #2a3644; box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.85); }
:root[data-theme="dark"] .view-totals, :root[data-theme="dark"] .selection-totals { background: #192b2b; }
:root[data-theme="dark"] th { background: #17222e; }
:root[data-theme="dark"] tbody tr:nth-child(even):not(.row-manual-demo):not(.row-missing-purchase) { background: #102030; }
:root[data-theme="dark"] tbody tr:hover { background: #18342e; }
:root[data-theme="dark"] .status, :root[data-theme="dark"] .badge, :root[data-theme="dark"] .bonus-evidence a, :root[data-theme="dark"] .transaction-row, :root[data-theme="dark"] .transaction-purchase-status, :root[data-theme="dark"] .transaction-unmatched { box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15); }
:root[data-theme="dark"] .drawer { background: rgba(232, 236, 242, 0.42); }
:root[data-theme="dark"] .drawer-top { background: rgba(31, 31, 31, 0.98); }
:root[data-theme="dark"] .docs { background: #16202b; }
:root[data-theme="dark"] .pdf-frame-slot, :root[data-theme="dark"] .honda-pdf-direct { background: #1d2935; }
:root[data-theme="dark"] .empty { background: #16202b; }
:root[data-theme="dark"] .admin-form input, :root[data-theme="dark"] .admin-form select, :root[data-theme="dark"] .admin-reset input { border: 1px solid #2a3644; }
:root[data-theme="dark"] .approval-new-bike-fields { border: 1px solid var(--line, #343835); background: #1b2a20; }
:root[data-theme="dark"] .financial-bar i { background: #c4f0e4; }
:root[data-theme="dark"] .vat-switch { background: #1f2a22; }
:root[data-theme="dark"] .financial-charts { background: #16202b; }
:root[data-theme="dark"] .financial-quality-panel { border: 1px solid #2c463e; background: linear-gradient(135deg, #163123 0%, #1f1f1f 70%); }
:root[data-theme="dark"] .financial-quality-grid button { background: #1f1f1f; }
:root[data-theme="dark"] .financial-quality-grid button:hover, :root[data-theme="dark"] .financial-quality-grid button:focus-visible { border-color: #abccc3; background: #183325; }
:root[data-theme="dark"] .finance-chart-card { background: linear-gradient(155deg, #1f1f1f 0%, #192d23 100%); box-shadow: 0 5px 16px rgba(0, 0, 0, 0.21); }
:root[data-theme="dark"] .finance-series-line i { background: #a1b7b0; }
:root[data-theme="dark"] .finance-series-line i.teal { background: #2ccb9f; }
:root[data-theme="dark"] .finance-series-line i.navy { background: #c8dcea; }
:root[data-theme="dark"] .finance-series-line i.gold { background: #dbb171; }
:root[data-theme="dark"] .financial-detail-explanation > div { background: #1d2822; }
:root[data-theme="dark"] .financial-reason-select select { background: #1f1f1f; }
:root[data-theme="dark"] .financial-brand-breakdown > div { background: #1f1f1f; }
:root[data-theme="dark"] .financial-detail-table th { background: #1f2f27; }
:root[data-theme="dark"] .financial-reason { border-left: 3px solid #dbb171; background: #4a3300; }
:root[data-theme="dark"] .financial-reason strong { color: #f4ddba; }
:root[data-theme="dark"] .financial-row-reasons { color: #d89026 !important; }
:root[data-theme="dark"] .stock-document-card { background: #1f1f1f; border: 1px solid #283636; color: #e2eded; }
:root[data-theme="dark"] .stock-document-card:hover, :root[data-theme="dark"] .stock-document-card:focus-visible { border-color: #c1eae7; }
:root[data-theme="dark"] .stock-document-preview { border: 1px solid #293232; background: #202c29; }
:root[data-theme="dark"] .stock-document-preview > span:first-child { color: #98a9a7; }
:root[data-theme="dark"] .stock-document-format { background: #1f1f1f; }
:root[data-theme="dark"] .stock-document-kind { color: #7ea19e; }
:root[data-theme="dark"] .stock-document-info p { color: #7d9795; }
:root[data-theme="dark"] .stock-document-info small { color: #a3aaa9; }
:root[data-theme="dark"] .document-identity-override { border-left: 3px solid #e3b368; background: #4d3500; color: #f3dfbe !important; }
:root[data-theme="dark"] .stock-document-action { color: #c8edea; }
:root[data-theme="dark"] .stock-document-card.is-unresolved .stock-document-action { color: #e29a1e; }
:root[data-theme="dark"] .stock-document-group > h3 span { background: #20332e; }
:root[data-theme="dark"] .stock-pdf-chip { background: #1c322a; color: #ccebe8; border: 1px solid #243c33; }
:root[data-theme="dark"] .stock-document-history { color: #98a9a7; }
:root[data-theme="dark"] .pdf-result { border: 1px solid #26383a; background: linear-gradient(120deg, #1f1f1f 70%, #17322e); }
:root[data-theme="dark"] .pdf-result-document small { color: #93a2ac; }
:root[data-theme="dark"] .pdf-page-count { background: #0f263e; color: #5485b0; }
:root[data-theme="dark"] .crm-panel { background:#1d2e31; color:#deeef1; }
:root[data-theme="dark"] .crm-person, :root[data-theme="dark"] .crm-task { border:1px solid #293b3e; background:#1f1f1f; }
:root[data-theme="dark"] .crm-person small, :root[data-theme="dark"] .crm-task small { color:#91a3a9; }
:root[data-theme="dark"] .crm-presence { color:#94a4ac; }
:root[data-theme="dark"] .crm-presence.is-online { color:#bff2e1; }
:root[data-theme="dark"] .crm-task.is-working { border-left:5px solid #45cabb; }
:root[data-theme="dark"] .crm-panel input, :root[data-theme="dark"] .crm-panel select, :root[data-theme="dark"] .crm-panel textarea { border:1px solid #2f4246; background:#1f1f1f; color:#deeef1; }
:root[data-theme="dark"] .crm-form { background:#1f1f1f; }
:root[data-theme="dark"] .crm-actions button { border:1px solid #2d4043; color:#ccebec; background:#1c2e2e; }
:root[data-theme="dark"] .crm-summary { color:#879ea6; }
:root[data-theme="dark"] .crm-description { color:#d7e8ec; }
:root[data-theme="dark"] .crm-bike { background:#1c322d; color:#cbece7; }
:root[data-theme="dark"] .crm-progress { background:#243533; }
:root[data-theme="dark"] .crm-progress span { background:linear-gradient(90deg,#3dbeaf,#94d2c9); }
:root[data-theme="dark"] .crm-kpis article { border:1px solid #29403b; background:linear-gradient(145deg,#1f1f1f,#19312a); }
:root[data-theme="dark"] .crm-kpis span { color:#8ea3a1; }
:root[data-theme="dark"] .crm-kpis strong { color:#dcf2f0; }
:root[data-theme="dark"] #crmError:not(:empty) { background:#4a1800; border:1px solid #6d391b; color:#c95e32; }
:root[data-theme="dark"] .crm-history { background:#1f1f1f; }
:root[data-theme="dark"] .crm-history p { border-bottom:1px solid #212c2e; }
:root[data-theme="dark"] .crm-panel footer { color:#93a5ac; }
:root[data-theme="dark"] .crm-panel.is-employee .crm-report-tools { background:#1f1f1f; }
:root[data-theme="dark"] .pdf-result-thumb { border: 1px solid #24303a; background: #1c242c; }
:root[data-theme="dark"] .crm-live-bar { border:1px solid #2d4944; background:rgba(18, 49, 43, 0.97); }
:root[data-theme="dark"] .crm-live-bar>strong { color:#cdebe8; }
:root[data-theme="dark"] .crm-live-bar button { border-left:1px solid #2b3e3b; color:#daeaec; }
:root[data-theme="dark"] .crm-live-bar small { color:#96aaab; }
:root[data-theme="dark"] .crm-service-editor { border-top:1px solid #293f3c; }
:root[data-theme="dark"] .crm-estimate-line { border-top:1px solid #212e2c; }
:root[data-theme="dark"] .crm-service-editor button, :root[data-theme="dark"] .crm-service-card button, :root[data-theme="dark"] .crm-report-tools button { border:1px solid #2d4541; background:#1a342b; color:#cbebe6; }
:root[data-theme="dark"] .crm-help { color:#96a8a5; }
:root[data-theme="dark"] .crm-service-card { border-top:1px solid #253734; }
:root[data-theme="dark"] .crm-order-ref { color:#92aaa4; }
:root[data-theme="dark"] .crm-finance { border:1px solid #2c453f; background:linear-gradient(145deg,#103229,#1a342e); }
:root[data-theme="dark"] .crm-finance h3 { color:#ddf2ef; }
:root[data-theme="dark"] .crm-finance p { color:#91a5a1; }
:root[data-theme="dark"] .crm-finance button { border:1px solid #2e4e47; background:#1f1f1f; color:#cbede8; }
:root[data-theme="dark"] .crm-finance-tabs .is-active { background:#c2e9e3; color:#1f1f1f; }
:root[data-theme="dark"] .crm-finance-kpis article { border:1px solid #29433d; background:#1f1f1f; }
:root[data-theme="dark"] .crm-finance-kpis span { color:#96a9a5; }
:root[data-theme="dark"] .crm-finance-kpis strong { color:#d6f2ee; }
:root[data-theme="dark"] .crm-finance form { border:1px solid #283f3a; background:#1f1f1f; }
:root[data-theme="dark"] .crm-finance label { color:#7b9e97; }
:root[data-theme="dark"] .crm-stock-card, :root[data-theme="dark"] .crm-ledger article, :root[data-theme="dark"] .crm-invoice-card { border:1px solid #273934; background:#1f1f1f; }
:root[data-theme="dark"] .crm-stock-card span, :root[data-theme="dark"] .crm-stock-card small, :root[data-theme="dark"] .crm-ledger span, :root[data-theme="dark"] .crm-ledger small { color:#94a7a3; }
:root[data-theme="dark"] .crm-stock-card.is-low { border-left:5px solid #e5b784; background:#442800; }
:root[data-theme="dark"] .crm-invoice-card dl div { background:#1c2e27; }
:root[data-theme="dark"] .crm-invoice-card dt { color:#95a7a4; }
:root[data-theme="dark"] .crm-invoice-summary { background:#18342b; color:#cbeae5; }
:root[data-theme="dark"] .crm-finance [data-finance-error]:not(:empty) { border:1px solid #6d391b; background:#4a1800; color:#c95e32; }
:root[data-theme="dark"] .crm-customers { background: #1f1f1f; border: 1px solid #293935; }
:root[data-theme="dark"] .crm-customer-row { border-bottom:1px solid #23332f; }
:root[data-theme="dark"] .crm-customer-row small { color:#8e9f9d; }
:root[data-theme="dark"] .crm-customers form { background:#1c2c28; }
:root[data-theme="dark"] .crm-customers label { color:#7f9c98; }
:root[data-theme="dark"] .crm-customers button { border:1px solid #29403a; background:#1c322a; color:#cbe9e6; }
:root[data-theme="dark"] .crm-customers button:hover { background:#1f3b30; }
:root[data-theme="dark"] .crm-form [data-pick], :root[data-theme="dark"] .crm-form [data-unlink] { border:1px solid #29403a; background:#1c322a; color:#cbe9e6; }
:root[data-theme="dark"] th.sortable button:hover { background: rgba(232, 236, 247, 0.05); }
:root[data-theme="dark"] th.sortable.sorted button { color: #e8ecf7; }
:root[data-theme="dark"] .stock-status-card:hover { background: rgba(232, 236, 247, 0.04); }
:root[data-theme="dark"] .stock-status-card.is-active { background: #bef7f2; border-color: #bef7f2; color: #1f1f1f; }
:root[data-theme="dark"] .stock-status-card.is-active span, :root[data-theme="dark"] .stock-status-card.is-active strong, :root[data-theme="dark"] .stock-status-card.is-active small { color: #1f1f1f; }
:root[data-theme="dark"] .packages-input:hover { border-color: rgba(232, 236, 247, 0.18); }
:root[data-theme="dark"] .packages-input:focus { border-color: #bef7f2; background: #1f1f1f; }
:root[data-theme="dark"] .packages-input::placeholder { color: rgba(232, 236, 247, 0.3); }
:root[data-theme="dark"] .panel-collapsible > summary { color: rgba(232, 236, 247, 0.65); }
:root[data-theme="dark"] .panel-collapsible > summary:hover { color: #e8ecf7; }
:root[data-theme="dark"] .summary-modal-body h3 { color: rgba(232, 236, 247, 0.6); }
:root[data-theme="dark"] .mainnav { background: rgba(31, 31, 31, 0.97); }
:root[data-theme="dark"] .crm-live-toggle { border: 1px solid #2d4944; background: rgba(18, 49, 43, 0.97); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.30); color: #cdebe8; }
:root[data-theme="dark"] .crm-live-toggle::before { background: #53c7b8; }
:root[data-theme="dark"] .crm-live-toggle:hover { background: #1a342e; }
:root[data-theme="dark"] .stock-move-menu { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.33); }
:root[data-theme="dark"] .stock-move-menu button { color: var(--ink, #e3e8ee); }
:root[data-theme="dark"] .stock-move-menu button:hover { background: #1e312b; }
:root[data-theme="dark"] thead th { background: var(--surface, #1f1f1f); }
:root[data-theme="dark"] .global-search { background: rgba(237, 242, 247, 0.45); }
:root[data-theme="dark"] .global-search-box { border: 1px solid var(--line, #28303f); background: var(--surface, #1f1f1f); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.58); }
:root[data-theme="dark"] .global-search-box input { border-bottom: 1px solid var(--line, #28303f); color: var(--ink, #e8ecf2); }
:root[data-theme="dark"] .global-search-group { color: var(--muted, #949ead); }
:root[data-theme="dark"] .global-search-row { color: var(--ink, #e8ecf2); }
:root[data-theme="dark"] .global-search-row small { color: var(--muted, #949ead); }
:root[data-theme="dark"] .global-search-row:hover, :root[data-theme="dark"] .global-search-row.is-active { background: #1e312b; }
:root[data-theme="dark"] .global-search-empty { color: var(--muted, #949ead); }
:root[data-theme="dark"] .global-search-hint { border-top: 1px solid var(--line, #28303f); color: var(--muted, #949ead); }
:root[data-theme="dark"] .stock-count-check:has(input:checked) { color: var(--teal-dark, #39bcae); }
:root[data-theme="dark"] #stockCountToggle[aria-pressed="true"] { outline: 2px solid var(--teal, #39bcae); }

/* Sistem tercihi karanlikken, kullanici acik secmediyse ayni kurallar gecerli. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { color-scheme: dark; }
}