[data-paged-list][aria-busy="true"] { opacity: .65; transition: opacity .15s ease; }
.paged-list-message { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-block: .75rem; padding: .75rem 1rem; border: 1px solid #bfdbfe; border-radius: .75rem; background: #eff6ff; color: #1d4ed8; font-size: .875rem; }
.paged-list-message.is-error { background: #fff1f2; color: #be123c; border-color: #fecdd3; }
html[data-theme="dark"] .paged-list-message { background: #172b46; color: #bfdbfe; border-color: #1e3a5f; }
html[data-theme="dark"] .paged-list-message.is-error { background: #3f1725; color: #fda4af; border-color: #881337; }

html,
body {
  font-family: "Plus Jakarta Sans", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html[data-theme="dark"] body {
  background-color: #020617 !important;
  color: #e2e8f0 !important;
}

html[data-theme="dark"] .bg-white {
  background-color: #111827 !important;
}

html[data-theme="dark"] .bg-slate-50 {
  background-color: #0f172a !important;
}

/* Shared page rhythm and keyboard states across the daily workflow. */
.page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.page-header { margin-bottom: 1.5rem; }
.page-header > :first-child { min-width: 0; flex: 1 1 20rem; }
.page-title { font-size: 1.5rem; line-height: 1.3; font-weight: 700; overflow-wrap: anywhere; }
.page-description { max-width: 68ch; margin-top: .5rem; font-size: .875rem; line-height: 1.6; color: var(--ink-muted); }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.page-actions > * { max-width: 100%; }
.nav-link > i { width: 1.25rem; flex-shrink: 0; text-align: center; }
.nav-link > span { min-width: 0; line-height: 1.4; }
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
:where(button, input, select, textarea):disabled,
[aria-disabled="true"] { cursor: not-allowed; opacity: .55; }
.skip-link { position: fixed; left: 1rem; top: -8rem; z-index: 100; border-radius: .75rem; background: var(--accent); color: white; padding: .75rem 1rem; }
.skip-link:focus { top: 1rem; }
.select-primary:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2364748b' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1rem;
  padding-right: 2.5rem;
}
.field-validation-error, .validation-summary-errors { color: #be123c; }
.input-validation-error { border-color: #e11d48 !important; }
.validation-summary-valid { display: none; }
html[data-theme="dark"] .page-description { color: #94a3b8; }
html[data-theme="dark"] :where(a, button, summary, input, select, textarea, [tabindex]):focus-visible { outline-color: #7dd3fc; }
html[data-theme="dark"] .field-validation-error,
html[data-theme="dark"] .validation-summary-errors { color: #fda4af; }
@media (max-width: 639px) {
  .page-header { align-items: stretch; }
  .page-actions { width: 100%; }
  .page-actions > .btn-primary { flex: 1 0 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

html[data-theme="dark"] .bg-slate-100 {
  background-color: #1e293b !important;
}

html[data-theme="dark"] .bg-slate-50\/60,
html[data-theme="dark"] .bg-slate-50\/70 {
  background-color: rgba(15, 23, 42, 0.72) !important;
}

html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-slate-300 {
  border-color: #1f2937 !important;
}

html[data-theme="dark"] .divide-slate-100 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] .divide-slate-200 > :not([hidden]) ~ :not([hidden]),
html[data-theme="dark"] .divide-y > :not([hidden]) ~ :not([hidden]) {
  border-color: #1f2937 !important;
}

html[data-theme="dark"] .bg-blue-50 {
  background-color: rgba(28, 117, 188, 0.16) !important;
}

html[data-theme="dark"] .bg-emerald-50 {
  background-color: rgba(16, 185, 129, 0.16) !important;
}

html[data-theme="dark"] .bg-amber-50 {
  background-color: rgba(245, 158, 11, 0.16) !important;
}

html[data-theme="dark"] .bg-rose-50 {
  background-color: rgba(244, 63, 94, 0.16) !important;
}

html[data-theme="dark"] .text-blue-800,
html[data-theme="dark"] .text-blue-700 {
  color: #7dd3fc !important;
}

html[data-theme="dark"] .text-emerald-700,
html[data-theme="dark"] .text-emerald-600 {
  color: #34d399 !important;
}

html[data-theme="dark"] .text-amber-700,
html[data-theme="dark"] .text-amber-600 {
  color: #fbbf24 !important;
}

html[data-theme="dark"] .text-rose-700,
html[data-theme="dark"] .text-rose-600 {
  color: #fb7185 !important;
}

/* Core containers must switch to dark surfaces too (not only utility classes) */
html[data-theme="dark"] .card,
html[data-theme="dark"] .client-modal-dialog {
  background-color: #111827 !important;
  border-color: #1f2937 !important;
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .client-modal-header {
  background-color: #0f172a !important;
  border-color: #1f2937 !important;
}

html[data-theme="dark"] .card-body,
html[data-theme="dark"] .client-modal-body {
  background-color: transparent !important;
}

html[data-theme="dark"] .text-slate-900 {
  color: #f8fafc !important;
}

html[data-theme="dark"] .text-slate-800 {
  color: #e2e8f0 !important;
}

html[data-theme="dark"] .text-slate-700 {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-slate-500,
html[data-theme="dark"] .text-slate-400 {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .hover\:bg-slate-50:hover {
  background-color: #1e293b !important;
}

html[data-theme="dark"] .input-primary,
html[data-theme="dark"] .input-primary-pill,
html[data-theme="dark"] .select-primary,
html[data-theme="dark"] .textarea-primary {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}

html[data-theme="dark"] .input-primary::placeholder,
html[data-theme="dark"] .input-primary-pill::placeholder {
  color: #64748b !important;
}

html[data-theme="dark"] .nav-link {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .nav-link:hover {
  background-color: #1e293b !important;
  color: #7dd3fc !important;
}

html[data-theme="dark"] .nav-link--active {
  background-color: rgba(28, 117, 188, 0.2) !important;
  color: #7dd3fc !important;
}

html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-secondary-sm,
html[data-theme="dark"] .btn.btn-secondary {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-secondary-sm:hover,
html[data-theme="dark"] .btn.btn-secondary:hover {
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
}

html[data-theme="dark"] .btn.btn-danger {
  background-color: #be123c !important;
  border-color: #be123c !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-primary-sm,
html[data-theme="dark"] .btn.btn-primary {
  background-color: #1c75bc !important;
  border-color: #1c75bc !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .status-chip {
  background-color: #1e293b;
  color: #cbd5e1;
}

.project-board-column {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: var(--surface-muted);
  padding: 0.875rem;
}

.project-task-card {
  border: 1px solid var(--line);
  border-radius: 0.875rem;
  background: var(--surface);
  padding: 1rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.project-board-empty {
  border: 1px dashed #cbd5e1;
  border-radius: 0.75rem;
  padding: 1rem 0.75rem;
  color: var(--ink-muted);
  font-size: 0.75rem;
  text-align: center;
}

html[data-theme="dark"] .project-board-column {
  border-color: #1f2937;
  background: #0f172a;
}

html[data-theme="dark"] .project-task-card {
  border-color: #334155;
  background: #111827;
  box-shadow: none;
}

html[data-theme="dark"] .project-board-empty {
  border-color: #334155;
  color: #94a3b8;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--ink-muted);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.theme-toggle-track {
  position: relative;
  width: 2.75rem;
  height: 1.5rem;
  border-radius: 9999px;
  border: 1px solid #cbd5e1;
  background: var(--line);
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
}

.theme-toggle-thumb {
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 9999px;
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.25);
  transform: translateX(0.1875rem);
  transition: transform 0.2s ease;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-track {
  background: rgba(28, 117, 188, 0.22);
  border-color: rgba(28, 117, 188, 0.45);
}

.theme-toggle[aria-pressed="true"] .theme-toggle-thumb {
  transform: translateX(1.375rem);
  background: var(--accent);
}

html[data-theme="dark"] .theme-toggle {
  color: #94a3b8;
}

html[data-theme="dark"] .theme-toggle-track {
  background: #1f2937;
  border-color: #334155;
}

html[data-theme="dark"] .theme-toggle-thumb {
  background: #e2e8f0;
}

html[data-theme="dark"] .theme-toggle[aria-pressed="true"] .theme-toggle-track {
  background: rgba(14, 165, 233, 0.25);
  border-color: rgba(14, 165, 233, 0.45);
}

html[data-theme="dark"] .theme-toggle[aria-pressed="true"] .theme-toggle-thumb {
  background: #38bdf8;
}

/* Final shared button contract.
   This file is loaded after output.css, so it guarantees the approved
   CTA proportions even when Tailwind component output gets partial. */
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost,
.btn-primary-pill,
.btn-primary-sm,
.btn-secondary-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  white-space: nowrap;
  text-decoration: none;
  vertical-align: middle;
  line-height: 1.2;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.1);
}

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost,
.btn-primary-pill {
  padding: 0.75rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 600;
}

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost {
  border-radius: 0.75rem;
}

.btn-primary-pill {
  border-radius: 9999px;
}

.btn-primary {
  background: var(--accent);
  color: var(--surface);
}

.btn-primary:hover {
  background: #165c94;
}

.btn-secondary {
  background: var(--surface);
  color: var(--ink-soft);
  border: 1px solid var(--line);
}

.btn-secondary:hover {
  background: var(--surface-muted);
}

.btn-ghost {
  background: transparent;
  color: #475569;
  border: 1px solid transparent;
  box-shadow: none;
}

.btn-ghost:hover {
  background: var(--surface-muted);
  color: #1e293b;
}

.btn-danger {
  background: #e11d48;
  color: var(--surface);
}

.btn-danger:hover {
  background: #be123c;
}

.btn-primary-sm,
.btn-secondary-sm {
  min-height: 2.5rem;
  padding: 0.625rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0.75rem;
}

.btn-primary-sm {
  background: var(--accent);
  color: var(--surface);
}

.btn-primary-sm:hover {
  background: #165c94;
}

.btn-secondary-sm {
  background: var(--surface);
  color: var(--ink-soft);
  border: 1px solid var(--line);
}

.btn-secondary-sm:hover {
  background: var(--surface-muted);
}

/* Shared table contract.
   Tables should always consume the full width of their container.
   Horizontal scroll should appear only when content truly requires it. */
.table-shell > .overflow-x-auto {
  width: 100%;
}

.table-native {
  width: 100% !important;
  min-width: 100% !important;
  table-layout: auto;
}

.table-native thead,
.table-native tbody,
.table-native tr {
  width: 100%;
}
.table-native.report-work-table { min-width: 42rem !important; }
.table-native.sales-list-table { min-width: 56rem !important; }

/* Filter fields keep a readable width instead of shrinking into overlapping controls. */
.filter-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.filter-grid > * { min-width: 0; }
.filter-actions { align-items: flex-end; flex-wrap: wrap; gap: .5rem; }

/* Inside slide-overs, ghost actions read like plain text.
   Force them to render as visible secondary buttons. */
.slideover-panel .btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  white-space: nowrap;
  border-radius: 0.75rem;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink-soft);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.1);
}

.slideover-panel .btn-ghost:hover {
  background: var(--surface-muted);
  color: #1e293b;
}

/* Slide-over tab buttons must stay visibly button-like. */
.slideover-panel .tab-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem 1.25rem;
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.slideover-panel .tab-button:hover {
  background: var(--surface-muted);
  color: var(--ink);
}

/* Shared slide-over field rhythm.
   Client form is the reference sizing and all slide-over forms follow it. */
.slideover-panel .input-primary,
.slideover-panel .select-primary,
.slideover-panel .textarea-primary {
  width: 100%;
  min-height: 42px;
  padding: 0.5rem 0.75rem;
  line-height: 1.35;
}

.slideover-panel .textarea-primary {
  min-height: 96px;
}

/* Keep quick proposal typography aligned with the global form language */
.client-quick-proposal-form .input-primary,
.client-quick-proposal-form .select-primary,
.client-quick-proposal-form input[type="date"] {
  font-family: inherit !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}

.client-quick-proposal-form .btn-primary,
.client-quick-proposal-form .btn-secondary {
  font-weight: 500 !important;
}

/* Shared typography baseline for all right slide-over panels */
.slideover-panel {
  font-family: "Plus Jakarta Sans", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.35;
}

/* New workflow pages render their panel inside a full-screen Alpine wrapper. */
.fixed.inset-0 > .slideover-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: min(100%, 32rem);
  height: 100%;
  overflow-y: auto;
  border-left: 1px solid var(--line);
  background: var(--surface);
  box-shadow: -18px 0 40px rgba(15, 23, 42, 0.18);
}

html[data-theme="dark"] .fixed.inset-0 > .slideover-panel {
  border-color: #1f2937;
  background: #111827;
  color: #e2e8f0;
  box-shadow: -18px 0 40px rgba(0, 0, 0, 0.35);
}

.slideover-panel .input-primary,
.slideover-panel .select-primary,
.slideover-panel .textarea-primary,
.slideover-panel input,
.slideover-panel select,
.slideover-panel textarea {
  font-family: inherit !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
}

.slideover-panel .btn-primary,
.slideover-panel .btn-secondary,
.slideover-panel button {
  font-family: inherit;
  font-size: 0.875rem;
  font-weight: 500 !important;
}

.slideover-panel .text-sm {
  font-size: 0.875rem !important;
  line-height: 1.35 !important;
}

.switch-control {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  user-select: none;
}

.switch-label {
  font-size: 0.875rem;
  color: var(--ink-soft);
  font-weight: 500;
}

.switch-input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.switch-track {
  width: 2.75rem;
  height: 1.5rem;
  border-radius: 9999px;
  border: 1px solid #cbd5e1;
  background: var(--line);
  display: inline-flex;
  align-items: center;
  transition: all 0.2s ease;
  position: relative;
}

.switch-thumb {
  width: 1.125rem;
  height: 1.125rem;
  border-radius: 9999px;
  background: var(--surface);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.25);
  transform: translateX(0.1875rem);
  transition: transform 0.2s ease;
}

.switch-input:checked + .switch-track {
  background: rgba(28, 117, 188, 0.22);
  border-color: rgba(28, 117, 188, 0.45);
}

.switch-input:checked + .switch-track .switch-thumb {
  transform: translateX(1.375rem);
  background: var(--accent);
}

.switch-input:focus-visible + .switch-track {
  outline: 2px solid rgba(28, 117, 188, 0.35);
  outline-offset: 2px;
}

html[data-theme="dark"] .switch-label {
  color: #cbd5e1;
}

html[data-theme="dark"] .switch-track {
  background: #1f2937;
  border-color: #334155;
}

html[data-theme="dark"] .switch-thumb {
  background: #e2e8f0;
}

html[data-theme="dark"] .switch-input:checked + .switch-track {
  background: rgba(14, 165, 233, 0.25);
  border-color: rgba(14, 165, 233, 0.45);
}

html[data-theme="dark"] .switch-input:checked + .switch-track .switch-thumb {
  background: #38bdf8;
}

.crm-table-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--line);
}

.crm-table-info {
  font-size: 0.875rem;
  color: var(--ink-muted);
}

.crm-table-pager {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.crm-table-page-btn {
  min-width: 2.5rem;
  min-height: 2.5rem;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink-muted);
  border-radius: 9999px;
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  transition: all 0.2s ease;
}

.crm-table-page-btn:hover:not(:disabled) {
  background: var(--surface-muted);
  color: var(--ink-soft);
}

.crm-table-page-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.crm-table-page-btn.is-current,
.crm-table-page-btn[aria-current="page"],
.crm-table-page-btn.is-current:hover,
.crm-table-page-btn[aria-current="page"]:hover {
  background: var(--accent);
  color: var(--surface);
}

.crm-table-page-dots {
  color: var(--ink-faint);
  font-size: 0.875rem;
}

.crm-table-sortable {
  cursor: pointer;
}

.crm-table-sortable:focus-visible {
  outline: 2px solid rgba(28, 117, 188, 0.35);
  outline-offset: 2px;
}

html[data-theme="dark"] .crm-table-footer {
  border-top-color: #1f2937;
}

html[data-theme="dark"] .crm-table-info,
html[data-theme="dark"] .crm-table-page-btn,
html[data-theme="dark"] .crm-table-page-dots {
  color: #94a3b8;
}

html[data-theme="dark"] .crm-table-page-btn:hover:not(:disabled) {
  background: #1e293b;
  color: #cbd5e1;
}

html[data-theme="dark"] .crm-table-page-btn.is-current,
html[data-theme="dark"] .crm-table-page-btn[aria-current="page"],
html[data-theme="dark"] .crm-table-page-btn.is-current:hover,
html[data-theme="dark"] .crm-table-page-btn[aria-current="page"]:hover {
  background: #0ea5e9;
  color: #0f172a;
}

html[data-theme="dark"] #clientsTable thead tr {
  background-color: #0f172a !important;
  color: #94a3b8 !important;
  border-color: #1f2937 !important;
}

html[data-theme="dark"] #clientsTable tbody tr {
  border-color: #1f2937 !important;
}

html[data-theme="dark"] #clientsTable tbody td {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] #clientsTable tbody td.text-slate-400 {
  color: #94a3b8 !important;
}

html[data-theme="dark"] .client-detail-page .section-title {
  color: #e2e8f0;
}

/* Generic table readability inside dark cards (clients detail tabs etc.) */
html[data-theme="dark"] table thead tr {
  background-color: #0f172a !important;
}

html[data-theme="dark"] table tbody tr {
  background-color: #111827 !important;
}

html[data-theme="dark"] table th {
  color: #94a3b8 !important;
  border-color: #1f2937 !important;
}

html[data-theme="dark"] table td {
  color: #cbd5e1 !important;
  border-color: #1f2937 !important;
}

html[data-theme="dark"] .link-primary {
  color: #7dd3fc !important;
}

html[data-theme="dark"] .link-primary:hover {
  color: #bae6fd !important;
}

.client-tabs-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0.5rem;
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 1rem;
}

.client-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  text-decoration: none;
  font-family: inherit;
  line-height: 1.1;
  border: 1px solid transparent;
  border-radius: 0.875rem;
  background: transparent;
  color: var(--ink-muted);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.75rem 1.25rem;
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease,
    box-shadow 0.2s ease, transform 0.2s ease;
}

.client-tab:hover {
  color: var(--accent);
  background: var(--surface);
  border-color: #dbe3ee;
  transform: translateY(-1px);
}

.client-tab.is-active {
  color: var(--accent);
  background: var(--surface);
  border-color: #dbe3ee;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.client-tab:focus-visible {
  outline: 2px solid rgba(28, 117, 188, 0.35);
  outline-offset: 2px;
}

.client-modal {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.client-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 23, 0.52);
}

.client-modal-dialog {
  position: relative;
  width: min(920px, 96vw);
  max-height: 86vh;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 0.875rem;
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.24);
}

.client-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid var(--line);
}

.client-modal-close-btn {
  border: 1px solid #cbd5e1;
  border-radius: 0.5rem;
  padding: 0.3rem 0.6rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--ink-soft);
  background: var(--surface);
}

.client-modal-body {
  padding: 1rem;
  overflow: auto;
  max-height: calc(86vh - 58px);
}

html[data-theme="dark"] .client-tabs-list {
  background: #0f172a;
  border-color: #1f2937;
}

html[data-theme="dark"] .client-tab {
  color: #cbd5e1;
}

html[data-theme="dark"] .client-tab:hover {
  color: #7dd3fc;
  background: #111827;
  border-color: #334155;
}

html[data-theme="dark"] .client-tab.is-active {
  color: #7dd3fc;
  background: #111827;
  border-color: #334155;
  box-shadow: 0 1px 2px rgba(2, 6, 23, 0.45);
}

html[data-theme="dark"] .client-modal-dialog {
  background: #111827;
  border-color: #1f2937;
}

html[data-theme="dark"] .client-modal-header {
  border-bottom-color: #1f2937;
}

html[data-theme="dark"] .client-modal-close-btn {
  border-color: #334155;
  color: #cbd5e1;
  background: #0f172a;
}

/* Shared list toolbar standard
   DataTable mantiginda tek iskelet: meta + filters + actions.
   Alanlar module gore degisir, iskelet degismez. */
.list-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}

.list-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.list-toolbar-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  color: var(--ink-faint);
  font-size: 0.875rem;
}

.list-toolbar-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.list-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  width: 100%;
}

.list-filter-sm,
.list-filter-md,
.list-filter-lg,
.list-filter-xl {
  width: 100%;
}

.list-filter-sm > .input-primary,
.list-filter-sm > .select-primary,
.list-filter-sm > input,
.list-filter-sm > select,
.list-filter-md > .input-primary,
.list-filter-md > .select-primary,
.list-filter-md > input,
.list-filter-md > select,
.list-filter-lg > .input-primary,
.list-filter-lg > .select-primary,
.list-filter-lg > input,
.list-filter-lg > select,
.list-filter-xl > .input-primary,
.list-filter-xl > .select-primary,
.list-filter-xl > input,
.list-filter-xl > select {
  width: 100%;
}

@media (min-width: 640px) {
  .list-filter-sm {
    width: 9rem;
  }

  .list-filter-md {
    width: 12rem;
  }

  .list-filter-lg {
    width: 14rem;
  }

  .list-filter-xl {
    width: 18rem;
  }
}

@media (min-width: 1280px) {
  .list-toolbar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .list-toolbar-group {
    width: auto;
    flex: 1 1 auto;
  }

  .list-toolbar-actions {
    width: auto;
    flex-shrink: 0;
  }
}

html[data-theme="dark"] .list-toolbar-meta {
  color: #94a3b8;
}
.list-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem;
  width: 100%;
}

.list-toolbar > input[type="hidden"] {
  display: none;
}

.list-toolbar > div {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  width: 100%;
}

.list-toolbar > div > label {
  margin: 0;
}

.list-toolbar > div > .input-primary,
.list-toolbar > div > .select-primary,
.list-toolbar > div > input,
.list-toolbar > div > select {
  width: 100%;
}

.list-toolbar > div.flex.flex-col.justify-end.gap-2 {
  width: 100%;
}

.list-toolbar > div.flex.flex-col.justify-end.gap-2 > div {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.list-toolbar > div.flex.flex-col.justify-end.gap-2 > div > .select-primary,
.list-toolbar > div.flex.flex-col.justify-end.gap-2 > div > select {
  min-width: 7rem;
}

@media (min-width: 640px) {
  .list-toolbar > div {
    width: 12rem;
  }

  .list-toolbar > div.flex.flex-col.justify-end.gap-2 {
    width: auto;
    min-width: 15rem;
  }
}

@media (min-width: 1280px) {
  .list-toolbar {
    gap: 0.875rem;
  }
}

.calendar-month-header,
.calendar-month-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-month-body {
  display: block;
}

.calendar-month-cell {
  min-width: 0;
}

.calendar-team-board-grid {
  display: grid;
  grid-template-columns: 14rem repeat(7, minmax(0, 1fr));
}

.slideover-panel .tab-button {
  border-color: var(--line);
  background: var(--surface);
  color: var(--ink-soft);
}

.slideover-panel .tab-button:hover {
  border-color: rgba(28, 117, 188, 0.18);
  background: var(--surface-muted);
}

.slideover-panel .tab-button.is-active {
  border-color: rgba(28, 117, 188, 0.2);
  background: rgba(28, 117, 188, 0.07);
  color: var(--accent);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  outline: 1px solid rgba(242, 101, 34, 0.14);
}

.slideover-panel .tab-button.is-active i {
  color: var(--accent);
}

html[data-theme="dark"] .slideover-panel .tab-button {
  border-color: #334155;
  background: #0f172a;
  color: #cbd5e1;
}

html[data-theme="dark"] .slideover-panel .tab-button:hover {
  border-color: #475569;
  background: #111827;
}

html[data-theme="dark"] .slideover-panel .tab-button.is-active {
  border-color: rgba(28, 117, 188, 0.32);
  background: rgba(28, 117, 188, 0.12);
  color: #7dd3fc;
  box-shadow: 0 1px 2px rgba(2, 6, 23, 0.42);
  outline: 1px solid rgba(242, 101, 34, 0.2);
}

html[data-theme="dark"] .slideover-panel .tab-button.is-active i {
  color: #7dd3fc;
}

.table-action-link,
.table-action-link-danger,
.table-action-button {
  cursor: pointer;
  width: 2.5rem;
  height: 2.5rem;
}

.table-action-link i,
.table-action-link-danger i,
.table-action-button i {
  font-size: 0.95rem;
}

.proposal-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
}

.proposal-status-draft {
  background: var(--surface-hover);
  color: #475569;
}

.proposal-status-waiting {
  background: #fef3c7;
  color: #b45309;
}

.proposal-status-approved {
  background: #d1fae5;
  color: #047857;
}

.proposal-status-rejected {
  background: #ffe4e6;
  color: #be123c;
}

.proposal-status-revise {
  background: #ffedd5;
  color: #c2410c;
}

html[data-theme="dark"] .proposal-status-draft {
  background: rgba(71, 85, 105, 0.22);
  color: #cbd5e1;
}

html[data-theme="dark"] .proposal-status-waiting {
  background: rgba(245, 158, 11, 0.18);
  color: #fbbf24;
}

html[data-theme="dark"] .proposal-status-approved {
  background: rgba(16, 185, 129, 0.18);
  color: #34d399;
}

html[data-theme="dark"] .proposal-status-rejected {
  background: rgba(244, 63, 94, 0.18);
  color: #fb7185;
}

html[data-theme="dark"] .proposal-status-revise {
  background: rgba(249, 115, 22, 0.18);
  color: #fb923c;
}

.public-proposal-actions .btn-primary {
  background: #1f78bf;
  border-color: #1f78bf;
  color: var(--surface);
}

.public-proposal-actions .btn-primary:hover {
  background: #17679f;
  border-color: #17679f;
}

.public-proposal-actions .btn-danger {
  background: #fff1f2;
  border: 1px solid #fecdd3;
  color: #be123c;
  box-shadow: none;
}

.public-proposal-actions .btn-danger:hover {
  background: #ffe4e6;
  border-color: #fda4af;
  color: #9f1239;
}

.public-proposal-revise-btn {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #c2410c;
}

.public-proposal-revise-btn:hover {
  background: #ffedd5;
  border-color: #fdba74;
  color: #9a3412;
}

html[data-theme="dark"] .public-proposal-actions .btn-danger {
  background: rgba(190, 24, 93, 0.16);
  border-color: rgba(244, 114, 182, 0.28);
  color: #fda4af;
}

html[data-theme="dark"] .public-proposal-actions .btn-danger:hover {
  background: rgba(190, 24, 93, 0.22);
  border-color: rgba(251, 113, 133, 0.4);
  color: #fecdd3;
}

html[data-theme="dark"] .public-proposal-revise-btn {
  background: rgba(194, 65, 12, 0.18);
  border-color: rgba(251, 146, 60, 0.28);
  color: #fdba74;
}

html[data-theme="dark"] .public-proposal-revise-btn:hover {
  background: rgba(194, 65, 12, 0.24);
  border-color: rgba(251, 146, 60, 0.4);
  color: #fed7aa;
}

/* Workflow components share the same readable rhythm in both themes. */
.section-heading { font-size: 1rem; line-height: 1.5; font-weight: 700; color: #1e293b; }
.form-field { display: flex; min-width: 0; flex-direction: column; gap: .5rem; font-size: .875rem; font-weight: 600; color: var(--ink-soft); }
.form-hint { font-size: .8125rem; line-height: 1.5; font-weight: 400; color: var(--ink-muted); }
.form-field > :is(input, select, textarea) { font-weight: 400; }
.workflow-notice { border: 1px solid #bfdbfe; border-radius: .875rem; padding: 1rem; background: #eff6ff; color: #1e40af; font-size: .875rem; line-height: 1.6; }
.workflow-notice.is-warning { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.workflow-notice.is-danger { border-color: #fecdd3; background: #fff1f2; color: #9f1239; }
.status-badge { display: inline-flex; max-width: 100%; align-items: center; gap: .375rem; border: 1px solid var(--line); border-radius: 9999px; padding: .3rem .65rem; background: var(--surface-muted); color: #475569; font-size: .75rem; line-height: 1.35; font-weight: 600; }
.status-badge.is-info { border-color: #bfdbfe; background: #eff6ff; color: #1d4ed8; }
.status-badge.is-success { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.status-badge.is-warning { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.status-badge.is-danger { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.empty-state-card { padding: clamp(1.5rem, 4vw, 2.5rem); }
.empty-state-title { line-height: 1.5; }
.empty-state-card .page-actions { justify-content: center; margin-top: 1rem; }
.page-actions { min-width: 0; }
.page-actions > :is(a, button) { white-space: normal; text-align: center; }
#mainNavigation nav > .nav-link + .nav-link { margin-top: .125rem; }
#mainNavigation .nav-link--active { font-weight: 600; box-shadow: inset 3px 0 var(--accent); }
#mainNavigation details a { display: block; line-height: 1.5; }
#mainNavigation details a[aria-current="page"] { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
#mainNavigation :is(a, summary):focus-visible { outline-offset: -2px; }
.theme-toggle { min-height: 2.75rem; border-radius: .75rem; padding: .375rem; }
:is(.input-primary, .input-primary-pill, .select-primary, .textarea-primary) { min-width: 0; max-width: 100%; }
:is(.input-primary, .input-primary-pill, .select-primary):not([multiple]) { min-height: 2.75rem; }
.textarea-primary { resize: vertical; }
:is(.input-primary, .input-primary-pill, .select-primary, .textarea-primary):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
:is(.btn-primary, .btn-primary-pill, .btn-secondary, .btn-danger, .btn-ghost) { min-height: 2.75rem; }
:is(.btn-primary, .btn-primary-sm, .btn-primary-pill):disabled { background: var(--accent) !important; }
:is(.btn-secondary, .btn-secondary-sm, .btn-ghost):disabled { background: var(--surface-hover) !important; color: var(--ink-muted) !important; }
.input-primary[readonly], .textarea-primary[readonly] { background-color: var(--surface-muted); box-shadow: none; }
.select-primary[multiple] { min-height: 8rem; padding-right: .75rem; }
html[data-theme="dark"] .section-heading { color: #e2e8f0; }
html[data-theme="dark"] .form-field { color: #cbd5e1; }
html[data-theme="dark"] .form-hint { color: #94a3b8; }
html[data-theme="dark"] .workflow-notice { border-color: #1e40af; background: rgba(30, 64, 175, .15); color: #bfdbfe; }
html[data-theme="dark"] .workflow-notice.is-warning { border-color: #854d0e; background: rgba(133, 77, 14, .15); color: #fde68a; }
html[data-theme="dark"] .workflow-notice.is-danger { border-color: #9f1239; background: rgba(159, 18, 57, .15); color: #fecdd3; }
html[data-theme="dark"] .status-badge { border-color: #334155; background: #1e293b; color: #cbd5e1; }
html[data-theme="dark"] .status-badge.is-info { border-color: #1e40af; background: rgba(30, 64, 175, .2); color: #bfdbfe; }
html[data-theme="dark"] .status-badge.is-success { border-color: #065f46; background: rgba(6, 95, 70, .2); color: #6ee7b7; }
html[data-theme="dark"] .status-badge.is-warning { border-color: #854d0e; background: rgba(133, 77, 14, .2); color: #fde68a; }
html[data-theme="dark"] .status-badge.is-danger { border-color: #9f1239; background: rgba(159, 18, 57, .2); color: #fda4af; }
html[data-theme="dark"] .empty-state-card { border-color: #334155; background: rgba(15, 23, 42, .7); }
html[data-theme="dark"] .empty-state-title { color: #e2e8f0; }
html[data-theme="dark"] .empty-state-copy { color: #94a3b8; }
html[data-theme="dark"] :is(.badge-passive, .pill, .field-display) { border-color: #334155; background: #1e293b; color: #cbd5e1; }
html[data-theme="dark"] .badge-active { background: rgba(28, 117, 188, .2); color: #7dd3fc; }
html[data-theme="dark"] #mainNavigation details a[aria-current="page"] { background: rgba(28, 117, 188, .2); color: #7dd3fc; }
html[data-theme="dark"] .btn-ghost { color: #cbd5e1; }
html[data-theme="dark"] .btn-ghost:hover { background: #1e293b; color: #f1f5f9; }
html[data-theme="dark"] .slideover-panel .btn-ghost { border-color: #334155; background: #0f172a; color: #cbd5e1; }
html[data-theme="dark"] .slideover-panel .btn-ghost:hover { background: #1e293b; color: #f1f5f9; }
html[data-theme="dark"] :is(.input-primary, .input-primary-pill, .select-primary, .textarea-primary):focus-visible { outline-color: #7dd3fc; }
html[data-theme="dark"] :is(.input-primary, .input-primary-pill, .select-primary, .textarea-primary).input-validation-error { border-color: #fb7185 !important; }
html[data-theme="dark"] :is(.btn-secondary, .btn-secondary-sm, .btn-ghost):disabled { background: #1e293b !important; color: #94a3b8 !important; }
@media (pointer: coarse) {
  :is(.panel-close-btn, .table-action-link, .table-action-link-danger, .table-action-button, .crm-table-page-btn, .btn-primary-sm, .btn-secondary-sm) { min-width: 2.75rem; min-height: 2.75rem; }
}

/* One drawer geometry for record detail and editing throughout the workspace. */
:root { --record-drawer-width: 48rem; }
.record-drawer {
  --record-drawer-line: var(--line);
  width: min(100vw, var(--record-drawer-width));
  height: 100dvh;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--surface);
}
.fixed.inset-0 > .record-drawer {
  width: min(100vw, var(--record-drawer-width));
  height: 100dvh;
  overflow: hidden;
}
.record-drawer-body {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  padding: 1rem;
  background: var(--surface);
}
.record-drawer-footer {
  flex: none;
  border-top: 1px solid var(--record-drawer-line);
  padding: 1rem;
  background: var(--surface);
}
@media (min-width: 640px) {
  .record-drawer-body,
  .record-drawer-footer { padding: 1.5rem; }
}
html[data-theme="dark"] .record-drawer,
html[data-theme="dark"] .fixed.inset-0 > .record-drawer {
  --record-drawer-line: #334155;
  border-color: #334155;
  background: #0f172a !important;
  color: #f1f5f9;
}
html[data-theme="dark"] .record-drawer-body,
html[data-theme="dark"] .record-drawer-footer { background: #0f172a; }

/* Customer drawer: one record header, one navigation line and a flat reading surface. */
.client-drawer { --client-line: var(--line); }
.record-drawer-chrome {
  display: flex;
  height: 3.5rem;
  flex: none;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--record-drawer-line, var(--line));
  padding: 0 1.5rem;
  background: var(--surface-muted);
}
.record-drawer-chrome-mark { width: .35rem; height: .95rem; border-radius: 999px; background: #f26522; }
html[data-theme="dark"] .record-drawer-chrome { border-bottom-color: #334155; background: #111e30; }
html[data-theme="dark"] #proposalCrudPanel { border-color: #334155; background: #0f172a; color: #f1f5f9; }
.client-drawer-body { background: var(--surface); }
.client-detail-masthead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--client-line);
  padding: .25rem 0 1.25rem;
}
.client-detail-avatar {
  width: 3.75rem;
  height: 3.75rem;
  flex: none;
  overflow: hidden;
  border: 1px solid var(--client-line);
  border-radius: .875rem;
  background-color: var(--surface);
  box-shadow: 0 2px 7px rgba(15, 23, 42, .04);
}
.client-detail-eyebrow { color: var(--accent); font-size: .6875rem; font-weight: 800; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; }
.client-detail-status { display: inline-flex; align-items: center; gap: .4rem; color: var(--ink-soft); font-size: .75rem; font-weight: 600; }
.client-detail-status-dot { width: .4rem; height: .4rem; border-radius: 50%; background: var(--ink-faint); }
.client-detail-status.is-active .client-detail-status-dot { background: #059669; }
.client-detail-actions { flex: none; }
.client-detail-section-nav { position: sticky; top: 0; z-index: 5; border-bottom: 1px solid var(--client-line); background: var(--surface); }
.client-detail-tab-rail { display: flex; gap: 1.5rem; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; -ms-overflow-style: none; padding-right: 2.75rem; }
.client-detail-tab-rail::-webkit-scrollbar { display: none; }
.work-area-nav { display: flex; gap: 1.5rem; overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: none; -ms-overflow-style: none; }
.work-area-nav::-webkit-scrollbar { display: none; }
.work-area-tab { display: inline-flex; min-height: 3rem; flex: none; align-items: center; border-bottom: 2px solid transparent; padding: .75rem .125rem .625rem; color: var(--ink-muted); font-size: .875rem; font-weight: 600; white-space: nowrap; }
.work-area-tab:hover { color: var(--accent); }
.work-area-tab[aria-current="page"] { border-bottom-color: var(--accent); color: #145c99; }
.work-area-tab:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.client-detail-tab-next,
.client-detail-tab-prev {
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  width: 2.5rem;
  height: 3rem;
  place-items: center;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, .82), var(--surface) 32%);
  color: var(--accent);
  cursor: pointer;
}
.client-detail-tab-prev { left: 0; right: auto; background: linear-gradient(270deg, rgba(255, 255, 255, .82), var(--surface) 32%); }
.client-detail-tab-next:focus-visible,
.client-detail-tab-prev:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.client-drawer .client-detail-tab {
  display: inline-flex;
  min-height: 3rem;
  flex: none;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: .75rem .125rem .625rem;
  background: transparent;
  box-shadow: none;
  color: var(--ink-muted);
  font-size: .8125rem;
  font-weight: 600 !important;
  white-space: nowrap;
  cursor: pointer;
}
.client-drawer .client-detail-tab:hover { color: var(--accent); }
.client-drawer .client-detail-tab.is-active { border-bottom-color: var(--accent); color: #145c99; }
.client-drawer .client-detail-tab:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
.client-drawer .client-detail-tab:disabled { cursor: progress; opacity: .75; }
.client-detail-count { border-radius: 999px; padding: .1rem .4rem; background: var(--surface-hover); color: #475569; font-size: .6875rem; font-variant-numeric: tabular-nums; }
.client-detail-content { min-width: 0; padding: 1.5rem 0 2rem; }
.client-general-properties { border-top: 1px solid var(--client-line); padding-top: .75rem; }
.client-general-properties summary { list-style: none; }
.client-general-properties summary::-webkit-details-marker { display: none; }
.client-general-properties[open] summary i { transform: rotate(180deg); }
.client-detail-content #tab-content { min-width: 0; }
.client-detail-content #tab-content > .card,
.client-detail-content #tab-content > .space-y-4 > .card {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.client-detail-content #tab-content > .space-y-4 > .card + .card { border-top: 1px solid var(--client-line); padding-top: 1.25rem; }
.client-detail-content #tab-content > .card > .card-header,
.client-detail-content #tab-content > .space-y-4 > .card > .card-header { padding: 0 0 .8rem; }
.client-detail-content #tab-content > .card > .card-body,
.client-detail-content #tab-content > .space-y-4 > .card > .card-body { padding: 1rem 0 0; }
.client-form-intro { border-bottom: 1px solid var(--client-line); padding: .25rem 0 1.25rem; }
.client-form-body { padding-top: 1.5rem; }
.client-drawer .client-core-section { border: 0; border-radius: 0; padding: 0; background: transparent; }
.client-drawer .client-core-section .section-title { color: var(--ink); font-size: .9375rem; }
.client-drawer .client-form-disclosures { border-top: 1px solid var(--client-line); }
.client-drawer .client-form-disclosure,
.client-drawer .client-form-disclosure[open] {
  overflow: visible;
  border: 0;
  border-bottom: 1px solid var(--client-line);
  border-radius: 0;
  background: transparent;
}
.client-drawer .client-disclosure-summary { min-height: 3.75rem; padding: .75rem 0; }
.client-drawer .client-disclosure-summary:hover { background: transparent; }
.client-drawer .client-disclosure-icon { width: 2.25rem; height: 2.25rem; border-radius: .625rem; background: var(--surface-hover); color: var(--ink-muted); }
.client-drawer .client-form-disclosure[open] .client-disclosure-icon { background: #e8f3fb; color: var(--accent); }
.client-drawer .client-disclosure-body { border: 0; padding: .25rem 0 1.25rem 3rem; }
.client-drawer .client-logo-field { display: flex; align-items: center; gap: 1rem; border-style: dashed; border-radius: .75rem; padding: 1rem; background: var(--surface-muted); }
.client-drawer .client-logo-preview { width: 5rem; height: 5rem; flex: none; border-radius: .625rem; box-shadow: none; }
.client-drawer .client-logo-content { flex: 1; }
.client-drawer .client-logo-actions { gap: .5rem; }
.client-drawer .client-logo-picker { min-height: 2.5rem; }
.client-drawer .client-logo-remove { min-height: 2.5rem; padding: .5rem .75rem; }
.client-drawer .client-form-actions {
  position: sticky;
  bottom: -1rem;
  margin: 1.5rem 0 -1rem;
  border-top: 1px solid var(--client-line);
  padding: 1rem 0;
  background: rgba(255, 255, 255, .96);
  box-shadow: none;
}
.client-list-shell { overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); box-shadow: 0 7px 24px rgba(15, 23, 42, .035); }
.client-list-shell > .list-filters { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
html[data-theme="dark"] .client-drawer { --client-line: #334155; background: #0f172a; }
html[data-theme="dark"] .client-drawer :is(.client-drawer-body, .client-detail-section-nav) { background: #0f172a; }
html[data-theme="dark"] .client-detail-avatar { background: #1e293b; }
html[data-theme="dark"] .client-detail-eyebrow { color: #7dd3fc; }
html[data-theme="dark"] .client-detail-status { color: #cbd5e1; }
html[data-theme="dark"] .client-drawer .client-detail-tab { color: #94a3b8; }
html[data-theme="dark"] .client-drawer .client-detail-tab:hover,
html[data-theme="dark"] .client-drawer .client-detail-tab.is-active { color: #7dd3fc; }
html[data-theme="dark"] .client-drawer .client-detail-tab.is-active { border-bottom-color: #7dd3fc; }
html[data-theme="dark"] .work-area-nav { border-bottom-color: #334155; }
html[data-theme="dark"] .work-area-tab { color: #94a3b8; }
html[data-theme="dark"] .work-area-tab:hover,
html[data-theme="dark"] .work-area-tab[aria-current="page"] { color: #7dd3fc; }
html[data-theme="dark"] .work-area-tab[aria-current="page"] { border-bottom-color: #7dd3fc; }
html[data-theme="dark"] .client-detail-tab-next { background: linear-gradient(90deg, rgba(15, 23, 42, .82), #0f172a 32%); color: #7dd3fc; }
html[data-theme="dark"] .client-detail-tab-prev { background: linear-gradient(270deg, rgba(15, 23, 42, .82), #0f172a 32%); color: #7dd3fc; }
html[data-theme="dark"] .client-drawer #tab-content a.text-vibeBlue { color: #7dd3fc; }
html[data-theme="dark"] .client-detail-count { background: #1e293b; color: #cbd5e1; }
html[data-theme="dark"] .client-drawer .client-core-section .section-title { color: #f1f5f9; }
html[data-theme="dark"] .client-drawer .client-disclosure-icon { background: #1e293b; color: #94a3b8; }
html[data-theme="dark"] .client-drawer .client-form-disclosure[open] .client-disclosure-icon { background: #173452; color: #7dd3fc; }
html[data-theme="dark"] .client-drawer .client-logo-field { border-color: #475569; background: #111e30; }
html[data-theme="dark"] .client-drawer .client-form-actions { background: rgba(15, 23, 42, .96); }
html[data-theme="dark"] .client-list-shell { border-color: #334155; background: #0f172a; }
html[data-theme="dark"] .client-list-shell > .list-filters { border-bottom-color: #334155; background: #0f172a; }
@media (max-width: 639px) {
  .list-filters .list-filter-search { flex-basis: 100%; }
  .record-drawer-chrome { padding: 0 1rem; }
  #proposalCrudPanelBody .min-w-\[18rem\] {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
    margin-left: 0;
  }
  #proposalCrudPanelBody .min-w-\[18rem\] > select { min-width: 0; flex: 1 1 auto; }
  .client-detail-actions { width: 100%; }
  .client-detail-actions .btn-secondary-sm { width: 100%; }
  .client-detail-section-nav { top: 0; }
  .client-detail-tab-rail { gap: 1.25rem; }
  .client-drawer .client-disclosure-body { padding-left: 0; }
  .client-drawer .client-logo-field { align-items: flex-start; gap: .75rem; padding: .75rem; }
  .client-drawer .client-logo-preview { width: 4rem; height: 4rem; }
}

/* Shared confirmation surface, search controls and optional record fields. */
:root { --crm-scroll-thumb: #b8c5d5; --crm-scroll-track: transparent; }
html[data-theme="dark"] { --crm-scroll-thumb: #475569; }
* { scrollbar-width: thin; scrollbar-color: var(--crm-scroll-thumb) var(--crm-scroll-track); }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: var(--crm-scroll-track); }
*::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background: var(--crm-scroll-thumb); background-clip: padding-box; }
.crm-confirm-dialog {
  width: min(28rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  margin: auto;
  border: 1px solid var(--line);
  border-radius: 1rem;
  padding: 0;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 24px 64px rgb(15 23 42 / .24);
  overscroll-behavior: contain;
}
.crm-confirm-dialog::backdrop { background: rgb(15 23 42 / .48); }
.crm-confirm-content { display: flex; align-items: flex-start; gap: 1rem; padding: 1.5rem; }
.crm-confirm-icon { display: grid; width: 2.5rem; height: 2.5rem; flex: none; place-items: center; border-radius: .75rem; background: #fff7ed; color: #c2410c; }
.crm-confirm-dialog[data-intent="danger"] .crm-confirm-icon { background: #fff1f2; color: #be123c; }
.crm-confirm-title { margin: .125rem 0 .5rem; font-size: 1rem; font-weight: 700; line-height: 1.5; }
.crm-confirm-message { margin: 0; color: #475569; font-size: .875rem; line-height: 1.65; overflow-wrap: anywhere; }
.crm-confirm-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .75rem; border-top: 1px solid var(--line); padding: 1rem 1.5rem; background: var(--surface-muted); }
.crm-confirm-actions button { position: relative; min-height: 2.75rem; }
.crm-confirm-spinner { display: none; position: absolute; left: calc(50% - .5rem); }
.crm-confirm-actions [aria-busy="true"] > span { opacity: 0; }
.crm-confirm-actions [aria-busy="true"] .crm-confirm-spinner { display: inline-block; }
form[aria-busy="true"] [type="submit"][aria-disabled="true"] { opacity: .7; cursor: progress; }
.crm-confirm-error { margin: 0 1.5rem 1.25rem; border-left: 3px solid #e11d48; padding: .75rem; color: #be123c; background: #fff1f2; font-size: .875rem; }
.crm-confirm-error[hidden], .search-clear[hidden] { display: none; }
.search-control { position: relative; }
.search-control input[type="search"] { padding-right: 2.875rem; }
.search-control input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
.search-clear { position: absolute; right: .25rem; bottom: .25rem; display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: .5rem; color: var(--ink-muted); cursor: pointer; }
.search-clear:hover { background: #e8f3fb; color: #145c99; }
.search-clear:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.inquiry-filters { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; align-items: end; gap: 1rem; padding: 1.25rem; }
.inquiry-filter-actions { display: flex; align-items: center; gap: .5rem; }
.proposal-list-table { width: 100%; table-layout: fixed; }
.proposal-list-table :is(th, td) { padding: 1rem; text-align: left; vertical-align: middle; white-space: normal; overflow-wrap: anywhere; }
.proposal-list-table th { background: var(--surface-muted); color: var(--ink-muted); font-size: .6875rem; font-weight: 600; letter-spacing: .05em; }
.proposal-list-table td { color: #475569; }
.proposal-list-table th:nth-child(1) { width: 16%; }
.proposal-list-table th:nth-child(2) { width: 22%; }
.proposal-list-table th:nth-child(3) { width: 13%; }
.proposal-list-table th:nth-child(4) { width: 16%; }
.proposal-list-table th:nth-child(5) { width: 13%; }
.proposal-list-table th:nth-child(6) { width: 20%; }
.proposal-list-identity { color: #145c99; font-weight: 650; }
.proposal-list-identity:hover, .proposal-list-opportunity:hover { text-decoration: underline; }
.proposal-list-customer { display: block; color: var(--ink); font-weight: 550; }
.proposal-list-secondary { display: block; margin-top: .25rem; color: var(--ink-muted); font-size: .75rem; line-height: 1.5; }
.proposal-list-opportunity { color: #145c99; }
.proposal-list-table .proposal-list-total { font-weight: 650; font-variant-numeric: tabular-nums; text-align: right; }
.proposal-list-table th:nth-child(5) { text-align: right; }
.proposal-list-table th:last-child { text-align: right; }
.proposal-list-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem; }
@media (min-width: 768px) and (pointer: fine) {
  .proposal-list-actions > a { min-width: 2rem; width: 2rem; padding: 0; }
}
.proposal-list-table .proposal-status-badge { white-space: normal; }
html[data-theme="dark"] .proposal-list-table th { background: #111e30; color: #94a3b8; }
html[data-theme="dark"] .proposal-list-table td { color: #cbd5e1; }
html[data-theme="dark"] .proposal-list-customer { color: #f1f5f9; }
html[data-theme="dark"] .proposal-list-secondary { color: #94a3b8; }
html[data-theme="dark"] .proposal-list-identity,
html[data-theme="dark"] .proposal-list-opportunity { color: #7dd3fc; }
.record-form > .business-record-header { margin-bottom: 1.5rem; }
.record-form-section-title { display: block; font-size: .9375rem; font-weight: 650; line-height: 1.5; color: var(--ink); }
.record-form-section-copy { display: block; margin-top: .2rem; font-size: .8125rem; font-weight: 400; line-height: 1.5; color: var(--ink-muted); }
.record-form-disclosure { border-top: 1px solid var(--record-drawer-line, var(--line)); }
.record-form-summary { display: flex; min-height: 4rem; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; list-style: none; cursor: pointer; }
.record-form-summary::-webkit-details-marker { display: none; }
.record-form-summary > i { color: var(--ink-muted); font-size: .75rem; }
.record-form-summary:hover .record-form-section-title { color: var(--accent); }
.record-form-summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: .25rem; }
.record-form-disclosure[open] > .record-form-summary > i { transform: rotate(180deg); }
.record-form-disclosure > div { padding: .5rem 0 1rem; }
.record-form-actions { position: sticky; z-index: 3; bottom: -1rem; display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin: 1.5rem -1rem -1rem; border-top: 1px solid var(--record-drawer-line, var(--line)); padding: 1rem; background: var(--surface); }
html[data-theme="dark"] .crm-confirm-dialog { border-color: #334155; background: #0f172a; color: #f1f5f9; }
html[data-theme="dark"] .crm-confirm-message { color: #cbd5e1; }
html[data-theme="dark"] .crm-confirm-actions { border-color: #334155; background: #111e30; }
html[data-theme="dark"] .crm-confirm-icon { background: #422719; color: #fdba74; }
html[data-theme="dark"] .crm-confirm-dialog[data-intent="danger"] .crm-confirm-icon,
html[data-theme="dark"] .crm-confirm-error { background: #3c1724; color: #fda4af; }
html[data-theme="dark"] .search-clear { color: #94a3b8; }
html[data-theme="dark"] .search-clear:hover { background: #173452; color: #7dd3fc; }
html[data-theme="dark"] .record-form-section-title { color: #f1f5f9; }
html[data-theme="dark"] .record-form-section-copy,
html[data-theme="dark"] .record-form-summary > i { color: #94a3b8; }
html[data-theme="dark"] .record-form-summary:hover .record-form-section-title { color: #7dd3fc; }
html[data-theme="dark"] .record-form-actions { background: #0f172a; }
@media (min-width: 640px) {
  .record-form-actions { bottom: -1.5rem; margin-right: -1.5rem; margin-left: -1.5rem; margin-bottom: -1.5rem; padding: 1rem 1.5rem; }
}
@media (max-width: 639px) {
  .inquiry-filters { grid-template-columns: minmax(0, 1fr); padding: 1rem; }
  .inquiry-filter-actions > :is(button, a) { flex: 1; }
  .crm-confirm-content { gap: .75rem; padding: 1.25rem; }
  .crm-confirm-actions { padding: 1rem 1.25rem; }
}
@media (max-width: 767px) {
  .proposal-list-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .proposal-list-table :is(tbody, tr) { display: block; width: 100%; }
  .proposal-list-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .875rem 1rem; padding: 1.25rem 1rem; }
  .proposal-list-table td { display: block; min-width: 0; padding: 0; border: 0; }
  .proposal-list-table td:nth-child(2), .proposal-list-table td:last-child { grid-column: 1 / -1; }
  .proposal-list-table td:nth-child(1) { grid-column: 1; }
  .proposal-list-table td:nth-child(3) { grid-column: 2; grid-row: 1; text-align: right; }
  .proposal-list-table td:nth-child(4)::before,
  .proposal-list-table td:nth-child(5)::before { content: attr(data-label); display: block; margin-bottom: .3rem; color: var(--ink-muted); font-size: .6875rem; font-weight: 400; }
  .proposal-list-table td:last-child { border-top: 1px solid var(--line); padding-top: .75rem; }
  .proposal-list-actions { gap: .5rem; }
  html[data-theme="dark"] .proposal-list-table td:last-child { border-color: #334155; }
  html[data-theme="dark"] .proposal-list-table td::before { color: #94a3b8; }
}


/* =====================================================================
   Kompakt ölçek: tipografi ve yoğunluk (tek kaynak)
   ---------------------------------------------------------------------
   Tailwind text-* yardımcıları --text-* değişkenlerini okur; burada daraltılan
   değişkenler sayfalardaki tüm ham text-* kullanımlarını aynı anda küçültür.
   Bu dosya katmansız (unlayered) yüklendiği için utility sınıflarını da ezer.
   Ölçek: sayfa başlığı 20px · bölüm 15px · gövde 13px · meta 12px · gösterge 22px
   Yoğunluk: tablo satırı ~40px · kontrol 36px · kart iç boşluğu 16/20px
   ===================================================================== */
:root {
  --text-xs: .75rem;      --text-xs--line-height: 1rem;
  --text-sm: .8125rem;    --text-sm--line-height: 1.25rem;
  --text-base: .875rem;   --text-base--line-height: 1.375rem;
  --text-lg: .9375rem;    --text-lg--line-height: 1.375rem;
  --text-xl: 1.0625rem;   --text-xl--line-height: 1.5rem;
  --text-2xl: 1.25rem;    --text-2xl--line-height: 1.625rem;
  --text-3xl: 1.375rem;   --text-3xl--line-height: 1.75rem;
  --text-4xl: 1.625rem;   --text-4xl--line-height: 2rem;
}
body { font-size: .875rem; }

/* Başlık hiyerarşisi: sayfa > bölüm > alt bölüm; sayfalar kendi boyutunu seçmez */
.page-header { margin-bottom: 1rem; gap: .75rem; }
.page-title { font-size: 1.25rem; line-height: 1.3; }
.page-description { margin-top: .25rem; font-size: .8125rem; line-height: 1.5; }
main h2 { font-size: .9375rem; line-height: 1.4; font-weight: 700; }
main h3 { font-size: .875rem; line-height: 1.4; }
.section-heading { font-size: .9375rem; line-height: 1.4; }
.section-title { font-size: .875rem; }
.business-record-title { font-size: 1.125rem; margin-top: .125rem; }
.business-record-subtitle { margin-top: .2rem; }
.business-record-strong { font-size: 1rem !important; }
.business-record-fact { padding: .625rem 0; }
.business-record-facts { column-gap: 1.25rem; }
.business-record-section { padding: .875rem 0; }
.business-record-section-title { margin-bottom: .5rem; }
.business-record-icon { width: 2.5rem; height: 2.5rem; }
.record-form > .business-record-header { margin-bottom: 1rem; }

/* Kontroller: 36px yükseklik, 13px yazı */
.btn-primary, .btn-secondary, .btn-danger, .btn-ghost, .btn-primary-pill { min-height: 2.25rem; padding: .5rem 1rem; font-size: .8125rem; }
.btn-primary-sm, .btn-secondary-sm { min-height: 2rem; padding: .375rem .75rem; font-size: .8125rem; }
:is(.input-primary, .input-primary-pill, .select-primary, .field-display):not([multiple]) { min-height: 2.25rem; padding: .4375rem .75rem; font-size: .8125rem; line-height: 1.25rem; }
.select-primary { padding-right: 2.25rem; }
.textarea-primary { padding: .5rem .75rem; font-size: .8125rem; line-height: 1.4; }
.form-field { gap: .3rem; font-size: .8125rem; }
.form-hint { font-size: .75rem; line-height: 1.45; }
.filter-grid { gap: .75rem; }
.workflow-notice { padding: .75rem 1rem; font-size: .8125rem; line-height: 1.5; border-radius: .75rem; }
.status-badge { padding: .2rem .55rem; font-size: .6875rem; }
.empty-state-card { padding: clamp(1rem, 3vw, 1.75rem); }

/* Kartlar ve listeler */
.card-header { padding: .75rem 1.25rem; }
.card-body { padding: 1rem 1.25rem; }
.card-footer { padding: .625rem 1.25rem; }
.card.p-5, .card.p-6, section.card.p-5, section.card.p-6 { padding: 1rem 1.25rem; }
main .card > .divide-y > * { padding-top: .625rem; padding-bottom: .625rem; }
.table-native > thead > tr > th { padding: .5rem .875rem; font-size: .6875rem; letter-spacing: .04em; }
.table-native > tbody > tr > :is(th, td) { padding: .5rem .875rem; }
.crm-table-footer { padding: .625rem 1rem; }

/* Sol menü */
.nav-link { min-height: 2.25rem; padding-top: .375rem; padding-bottom: .375rem; font-size: .8125rem; }
#mainNavigation > div:first-child { padding-top: .875rem; padding-bottom: .875rem; }

/* Dokunmatik cihazlarda hedef boyutu korunur */
@media (pointer: coarse) {
  .btn-primary, .btn-secondary, .btn-danger, .btn-ghost, .btn-primary-pill, .input-primary, .input-primary-pill, .select-primary, .textarea-primary { min-height: 2.75rem; }
  .nav-link { min-height: 2.75rem; }
  .table-native > tbody > tr > :is(th, td) { padding-top: .75rem; padding-bottom: .75rem; }
}


/* Yoğun veri tablosu: liste sayfalarının masaüstü görünümü (≥ md); dar ekranda .data-list-* kartları kullanılır.
   Satır tıklaması wwwroot/js/data-table.js ile a[data-row-link] bağlantısını tetikler. */
.data-table { min-width: 48rem !important; }
.data-table > tbody > tr[data-href] { cursor: pointer; }
.data-table > tbody > tr:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.data-table .cell-primary { font-weight: 600; color: var(--ink); }
.data-table .cell-primary a { color: inherit; }
.data-table .cell-primary a:hover { color: var(--accent); }
.data-table .cell-muted { color: var(--ink-muted); font-size: .75rem; }
.data-table .cell-truncate { max-width: 26rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.data-table .cell-nowrap { white-space: nowrap; }
.data-table .cell-num, .data-table > thead > tr > th.cell-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.data-table .cell-status { white-space: nowrap; }
.data-table .status-badge { vertical-align: middle; }
html[data-theme="dark"] .data-table .cell-primary { color: #f1f5f9; }
html[data-theme="dark"] .data-table .cell-muted { color: #94a3b8; }

.data-list-mobile { display: grid; gap: .5rem; padding: .75rem; }
@media (min-width: 48rem) { .data-list-mobile { display: none; } }  /* md ve üstünde tablo görünür; katmansız kural md:hidden yardımcısını ezdiği için burada kapatılır */
.data-list-item { display: block; border: 1px solid var(--line); border-radius: .75rem; padding: .625rem .75rem; background: var(--surface); color: inherit; }
.data-list-item:hover { border-color: var(--accent); }
.data-list-item-title { display: flex; justify-content: space-between; gap: .5rem; font-size: .8125rem; font-weight: 600; }
.data-list-item-title > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.data-list-item-copy { margin-top: .125rem; font-size: .8125rem; color: var(--ink-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.data-list-item-meta { margin-top: .25rem; display: flex; flex-wrap: wrap; gap: .25rem .75rem; font-size: .75rem; color: var(--ink-muted); }
html[data-theme="dark"] .data-list-item { border-color: #334155; background: #0f172a; }
html[data-theme="dark"] .data-list-item-copy { color: #cbd5e1; }
html[data-theme="dark"] .data-list-item-meta { color: #94a3b8; }

/* Liste sayfalarının üst çerçevesi: içerik üst boşluğu, bölüm aralığı, sekme ve filtre yüksekliği */
#mainContent { padding-top: 1.25rem; padding-bottom: 1.5rem; }
main .space-y-6 > :not(:last-child) { margin-block-start: 0; margin-block-end: 1rem; }
.work-area-tab { min-height: 2.5rem; padding: .5rem .125rem .4375rem; font-size: .8125rem; }
.list-filters { gap: .5rem; }
main section.card > div.border-b:first-child { padding-top: .5rem; padding-bottom: .5rem; }

/* Özet şeridi (detay sayfalarının üst bölümü): küçük etiket, 16px değer, tek satır açıklama */
.kpi-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: .5rem; margin: 0; }
.kpi { min-width: 0; border: 1px solid var(--line); border-radius: .75rem; background: var(--surface); padding: .5rem .75rem; }
.kpi dt { font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-muted); }
.kpi dd { margin: .125rem 0 0; font-size: 1rem; font-weight: 700; line-height: 1.3; color: var(--ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi small { display: block; margin-top: .125rem; font-size: .75rem; color: var(--ink-muted); }
.kpi-inline { font-size: .8125rem; color: var(--ink-soft); }
.kpi-inline strong { font-size: 1rem; color: var(--ink); font-variant-numeric: tabular-nums; }
html[data-theme="dark"] .kpi { border-color: #334155; background: #0f172a; }
html[data-theme="dark"] .kpi dd, html[data-theme="dark"] .kpi-inline strong { color: #f1f5f9; }
html[data-theme="dark"] .kpi dt, html[data-theme="dark"] .kpi small { color: #94a3b8; }
html[data-theme="dark"] .kpi-inline { color: #cbd5e1; }
button.work-area-tab { background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; }

/* Tablo içi işlem düğmeleri: 32px (dokunmatikte yukarıdaki pointer:coarse kuralı 44px'e çıkarır) */
.table-action-link, .table-action-link-danger, .table-action-button { width: 2rem; height: 2rem; }
.table-action-link i, .table-action-link-danger i, .table-action-button i { font-size: .875rem; }
/* Liste başlığı: sekmeler, arama ve filtreler tablo kartının ilk satırında; "Uygula" yok, yazarken ve seçince yenilenir.
   Sayfalama tek alt çubuk: "1–25 / 262 kayıt" · ‹ 1 2 3 … 11 › · sayfa boyutu. Kartın dışında filtre kartı kullanılmaz. */
.list-head { display: flex; flex-wrap: wrap; align-items: center; gap: .375rem .75rem; padding: .375rem .875rem; border-bottom: 1px solid var(--line); }
.list-head > .work-area-nav { flex: 1 1 auto; min-width: 0; border-bottom: 0; }
.list-head > h2:not(.sr-only) { margin-right: auto; }
.list-head > form.list-search { margin-left: auto; }
form.list-search { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
:is(.card, .client-list-shell) > form.list-search:first-child { padding: .5rem .875rem; border-bottom: 1px solid var(--line); }
form.list-search .search-control { position: relative; flex: 1 1 14rem; min-width: 10rem; max-width: 24rem; }
form.list-search .search-control > .search-icon { position: absolute; left: .625rem; top: 50%; transform: translateY(-50%); color: var(--ink-faint); font-size: .75rem; pointer-events: none; }
form.list-search .search-control > input[type="search"] { padding-left: 2rem; padding-right: 2.25rem; }
form.list-search .search-clear { top: 50%; right: .125rem; bottom: auto; width: 2rem; height: 2rem; transform: translateY(-50%); }
form.list-search > select.select-primary, form.list-search > label.form-field { flex: 0 1 auto; width: auto; min-width: 8rem; max-width: 14rem; }
form.list-search > label.form-field > select.select-primary { width: auto; }
form.list-search > .btn-ghost, form.list-search > .btn-secondary { min-height: 2.25rem; padding: .375rem .625rem; }
form.list-search .sr-only { position: absolute; }
html[data-theme="dark"] .list-head, html[data-theme="dark"] :is(.card, .client-list-shell) > form.list-search:first-child { border-bottom-color: #334155; }

.crm-table-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .375rem .75rem; padding: .375rem .875rem; border-top: 1px solid var(--line); }
.card > .crm-table-footer, .client-list-shell > .crm-table-footer { border-radius: 0; }
.crm-table-info { margin-right: auto; font-size: .75rem; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.crm-table-pager { display: inline-flex; align-items: center; gap: .125rem; }
.crm-table-page-btn { display: inline-flex; min-width: 2rem; height: 2rem; min-height: 0; align-items: center; justify-content: center; padding: 0 .375rem; border: 1px solid transparent; border-radius: .5rem; background: transparent; color: var(--ink-muted); font-size: .75rem; font-weight: 600; font-variant-numeric: tabular-nums; transition: background-color .15s ease, color .15s ease; }
.crm-table-page-btn:hover { background: var(--surface-hover); color: var(--ink); }
.crm-table-page-btn[aria-current="page"], .crm-table-page-btn[aria-current="page"]:hover { background: var(--accent); color: var(--surface); }
.crm-table-page-btn.is-disabled { opacity: .35; pointer-events: none; }
.crm-table-page-dots { min-width: 1.25rem; text-align: center; font-size: .75rem; color: var(--ink-faint); }
form.crm-table-size { display: inline-flex; align-items: center; gap: .375rem; margin: 0; font-size: .75rem; color: var(--ink-muted); }
form.crm-table-size > label { display: inline-flex; align-items: center; gap: .375rem; }
.crm-table-footer form.crm-table-size select.select-primary { width: auto; min-height: 2rem; padding: .125rem 1.75rem .125rem .5rem; font-size: .75rem; line-height: 1.25rem; background-position: right .5rem center; }
@media (max-width: 639px) { form.crm-table-size > label > span { display: none; } }
html[data-theme="dark"] .crm-table-footer { border-top-color: #334155; }
html[data-theme="dark"] .crm-table-page-btn:hover { background: #1e293b; color: #f1f5f9; }
html[data-theme="dark"] .crm-table-page-btn[aria-current="page"], html[data-theme="dark"] .crm-table-page-btn[aria-current="page"]:hover { background: #0ea5e9; color: #0f172a; }
form.list-search.card { padding: .5rem .875rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); }
form.list-search .search-control.is-wide { max-width: none; }
html[data-theme="dark"] form.list-search.card { border-color: #334155; background: #0f172a; }

/* Sol menü: dört grup (Çalışma, Müşteri, Finans, Sistem), 11px grup etiketi, tek aktif işareti (sol çizgi + zemin), alt bağlantılar .nav-sublink.
   Hesap menüsü sol altta açılır (profil, arayüz ayarları, çıkış). Üst çubuk 56px; footer yok. */
.nav-group-label { margin: .875rem .75rem .25rem; font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-faint); }
#mainNavigation nav > .nav-group-label:first-child { margin-top: .125rem; }
#mainNavigation .nav-link { position: relative; gap: .625rem; }
#mainNavigation .nav-icon { width: 1.25rem; flex-shrink: 0; text-align: center; font-size: .8125rem; }
#mainNavigation .nav-link--active { background: rgba(28, 117, 188, .08); }
#mainNavigation .nav-details > summary { list-style: none; cursor: pointer; }
#mainNavigation .nav-details > summary::-webkit-details-marker { display: none; }
#mainNavigation .nav-chevron { margin-left: auto; font-size: .625rem; color: var(--ink-faint); transition: transform .15s ease; }
#mainNavigation .nav-details[open] > summary .nav-chevron { transform: rotate(180deg); }
#mainNavigation .nav-sub { display: flex; flex-direction: column; gap: .125rem; padding: .25rem 0 .5rem 1.875rem; }
#mainNavigation .nav-sublink { display: flex; align-items: center; min-height: 2rem; padding: .25rem .625rem; border-radius: .5rem; font-size: .8125rem; line-height: 1.3; color: var(--ink-muted); transition: background-color .15s ease, color .15s ease; }
#mainNavigation .nav-sublink:hover { background: var(--surface-hover); color: var(--accent); }
#mainNavigation .nav-sublink[aria-current="page"] { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
html[data-theme="dark"] .nav-group-label { color: #64748b; }
html[data-theme="dark"] #mainNavigation .nav-sublink { color: #94a3b8; }
html[data-theme="dark"] #mainNavigation .nav-sublink:hover { background: #1e293b; color: #7dd3fc; }
html[data-theme="dark"] #mainNavigation .nav-sublink[aria-current="page"] { background: rgba(28, 117, 188, .2); color: #7dd3fc; }

.profile-trigger { display: flex; width: 100%; align-items: center; gap: .625rem; padding: .375rem .5rem; border-radius: .75rem; text-align: left; transition: background-color .15s ease; }
.profile-trigger:hover, .profile-trigger[aria-expanded="true"] { background: var(--surface-hover); }
.profile-avatar { display: grid; width: 2.25rem; height: 2.25rem; flex-shrink: 0; place-items: center; border-radius: 9999px; background: rgba(28, 117, 188, .12); color: var(--accent); font-size: .75rem; font-weight: 700; }
.profile-popover { position: absolute; left: 0; right: 0; bottom: calc(100% + .375rem); z-index: 50; padding: .375rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--surface); box-shadow: 0 12px 32px rgba(15, 23, 42, .12); }
.profile-popover form { margin: 0; }
.profile-popover-item { display: flex; width: 100%; min-height: 2.25rem; align-items: center; gap: .625rem; padding: .375rem .625rem; border-radius: .5rem; font-size: .8125rem; font-weight: 500; color: var(--ink-soft); text-align: left; transition: background-color .15s ease, color .15s ease; }
.profile-popover-item:hover { background: var(--surface-hover); color: var(--ink); }
.profile-popover-item > i { width: 1.25rem; flex-shrink: 0; text-align: center; font-size: .8125rem; color: var(--ink-faint); }
.profile-popover-item.is-danger { color: #be123c; }
.profile-popover-item.is-danger:hover { background: #fff1f2; color: #9f1239; }
.profile-popover-item.is-danger > i { color: inherit; }
html[data-theme="dark"] .profile-trigger:hover, html[data-theme="dark"] .profile-trigger[aria-expanded="true"] { background: #1e293b; }
html[data-theme="dark"] .profile-popover { border-color: #334155; background: #0f172a; box-shadow: 0 12px 32px rgba(0, 0, 0, .45); }
html[data-theme="dark"] .profile-popover-item { color: #cbd5e1; }
html[data-theme="dark"] .profile-popover-item:hover { background: #1e293b; color: #f1f5f9; }
html[data-theme="dark"] .profile-popover-item.is-danger { color: #fda4af; }
html[data-theme="dark"] .profile-popover-item.is-danger:hover { background: rgba(159, 18, 57, .2); }

.icon-button { display: inline-flex; width: 2.25rem; height: 2.25rem; flex-shrink: 0; align-items: center; justify-content: center; border-radius: .5rem; color: var(--ink-muted); font-size: .875rem; transition: background-color .15s ease, color .15s ease; }
.icon-button:hover { background: var(--surface-hover); color: var(--ink); }
html[data-theme="dark"] .icon-button { color: #94a3b8; }
html[data-theme="dark"] .icon-button:hover { background: #1e293b; color: #f1f5f9; }
.app-header { height: 3.5rem; }
.app-header .search-control { max-width: 22rem; }
.app-header .search-control > input[type="search"] { padding-left: 2rem; }
.app-header .search-icon { position: absolute; left: .625rem; top: 50%; transform: translateY(-50%); color: var(--ink-faint); font-size: .75rem; pointer-events: none; }

/* Tanımlar sayfası: gruplanmış bağlantı kartları */
.lookup-grid { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.lookup-card { display: flex; align-items: center; gap: .75rem; padding: .625rem .75rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--surface); font-size: .8125rem; color: var(--ink); transition: border-color .15s ease, background-color .15s ease; }
.lookup-card:hover { border-color: var(--accent); background: #f8fbfe; }
.lookup-card-icon { display: grid; width: 2.25rem; height: 2.25rem; flex-shrink: 0; place-items: center; border-radius: .625rem; background: var(--accent-soft); color: var(--accent); font-size: .875rem; }
html[data-theme="dark"] .lookup-card { border-color: #334155; background: #0f172a; color: #f1f5f9; }
html[data-theme="dark"] .lookup-card:hover { border-color: #7dd3fc; background: #111e30; }

/* 3. aşama: tek rozet, tek uyarı, tek KPI, tek boş durum; tablo başlıkları normal yazım; çekmece başlığı normal yazım.
   Renk belirteçleri: bileşenler ham renk yerine bu değişkenleri kullanır; koyu tema yalnızca değişkenleri değiştirir. */
:root { --surface: #fff; --surface-muted: #f8fafc; --surface-hover: #f1f5f9; --line: #e2e8f0; --ink: #0f172a; --ink-soft: #334155; --ink-muted: #64748b; --ink-faint: #94a3b8; --accent: #1c75bc; --accent-soft: rgba(28, 117, 188, .1); }
html[data-theme="dark"] { --surface: #0f172a; --surface-muted: #111e30; --surface-hover: #1e293b; --line: #334155; --ink: #f1f5f9; --ink-soft: #cbd5e1; --ink-muted: #94a3b8; --ink-faint: #64748b; --accent: #7dd3fc; --accent-soft: rgba(28, 117, 188, .2); }

.workflow-notice.is-success { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
html[data-theme="dark"] .workflow-notice.is-success { border-color: #065f46; background: rgba(6, 95, 70, .15); color: #6ee7b7; }
.workflow-notice + .workflow-notice { margin-top: .5rem; }

/* Rozetler: status-badge ölçüsü (11px, 600, normal yazım). Teklif rozetleri ve eski chip/pill sınıfları aynı ölçüye çekilir. */
.proposal-status-badge, .pill, .status-chip, .accent-chip, .badge-active, .badge-passive { display: inline-flex; align-items: center; gap: .375rem; border: 1px solid var(--line); border-radius: 9999px; padding: .2rem .55rem; font-size: .6875rem; line-height: 1.35; font-weight: 600; letter-spacing: 0; text-transform: none; }
.proposal-status-draft, .pill, .status-chip, .badge-passive { border-color: var(--line); background: var(--surface-muted); color: #475569; }
.proposal-status-waiting { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.proposal-status-approved, .badge-active { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.proposal-status-rejected { border-color: #fecdd3; background: #fff1f2; color: #be123c; }
.proposal-status-revise, .accent-chip { border-color: #fed7aa; background: #fff7ed; color: #c2410c; }
html[data-theme="dark"] :is(.proposal-status-draft, .pill, .status-chip, .badge-passive) { border-color: #334155; background: #1e293b; color: #cbd5e1; }
html[data-theme="dark"] .proposal-status-waiting { border-color: #854d0e; background: rgba(133, 77, 14, .2); color: #fde68a; }
html[data-theme="dark"] :is(.proposal-status-approved, .badge-active) { border-color: #065f46; background: rgba(6, 95, 70, .2); color: #6ee7b7; }
html[data-theme="dark"] .proposal-status-rejected { border-color: #9f1239; background: rgba(159, 18, 57, .2); color: #fda4af; }
html[data-theme="dark"] :is(.proposal-status-revise, .accent-chip) { border-color: #9a3412; background: rgba(154, 52, 18, .2); color: #fdba74; }

/* Tablo başlıkları: normal yazım, 11px, yarı kalın; büyük harf yalnız KPI etiketi ve section-kicker'da kalır */
.table-native > thead > tr > th, .table-native > thead > tr > th > * { text-transform: none; letter-spacing: .02em; }
.table-native > thead > tr > th { font-size: .6875rem; font-weight: 600; color: var(--ink-muted); }
.table-native > thead > tr > th a.sort-link { display: inline-flex; align-items: center; gap: .25rem; color: inherit; }
.table-native > thead > tr > th a.sort-link:hover { color: var(--accent); }
.table-native > thead > tr > th a.sort-link > i { font-size: .625rem; color: #cbd5e1; }
.table-native > thead > tr > th[aria-sort] a.sort-link { color: var(--accent); }
.table-native > thead > tr > th[aria-sort] a.sort-link > i { color: var(--accent); }
.record-drawer-chrome :is(p, h2) { font-size: .8125rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-soft); }
html[data-theme="dark"] .record-drawer-chrome :is(p, h2) { color: #e2e8f0; }

/* KPI: sınıf tabanlı eşdeğerler (dt/dd kullanılamayan yerler için) ve ana sayfa için büyük varyant */
.kpi-label { display: flex; align-items: center; gap: .375rem; font-size: .6875rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-muted); }
.kpi-label > i { font-size: .6875rem; color: var(--ink-faint); }
.kpi-value { display: block; margin-top: .125rem; font-size: 1rem; font-weight: 700; line-height: 1.3; color: var(--ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi-strip.is-hero .kpi { padding: .75rem .875rem; }
.kpi-strip.is-hero .kpi-value { font-size: 1.25rem; margin-top: .25rem; }
a.kpi { color: inherit; transition: border-color .15s ease, background-color .15s ease; }
a.kpi:hover { border-color: var(--accent); background: #f8fbfe; }
.kpi.is-accent .kpi-label > i { color: #f26522; }
.kpi .kpi-value.text-emerald-600, .kpi dd.text-rose-600, .kpi dd.text-amber-700 { color: revert-layer; }
html[data-theme="dark"] .kpi-label { color: #94a3b8; }
html[data-theme="dark"] .kpi-value { color: #f1f5f9; }
html[data-theme="dark"] a.kpi:hover { border-color: #7dd3fc; background: #111e30; }

/* Boş durum: tek bileşen; tablo kartı içinde kenar boşluğu .75rem */
.empty-state-card.m-3 { margin: .75rem; }
.empty-state-title { font-size: .9375rem; }