/* Finance shares the salon palette and keeps cash apart from earned amounts. */
.finance-stats .stat-value { font-size: clamp(22px, 2.3vw, 28px); }
.finance-toolbar { margin-bottom: 20px; align-items: flex-end; }
.finance-date-range { display: flex; align-items: flex-end; gap: 12px; }
.finance-date-range > span { color: var(--subtle); font-size: 12px; padding-bottom: 11px; }
.finance-date-range .field label, .finance-period-field label { color: var(--muted); font-size: 10px; }
.finance-date-range .field input { min-height: 37px; padding: 8px 10px; font-size: 11px; }
.finance-method-balances { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.finance-method-balances > span { display: flex; gap: 8px; padding: 8px 11px; border: 1px solid var(--border); border-radius: 8px; color: var(--muted); background: var(--surface); font-size: 10px; }
.finance-method-balances strong { color: var(--text); font-weight: 550; font-variant-numeric: tabular-nums; }
.finance-date { color: var(--muted); font-size: 10px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.finance-direction { display: inline-flex; align-items: center; gap: 5px; color: var(--primary-text); background: var(--primary-soft); padding: 4px 8px; border-radius: 5px; font-size: 9px; font-weight: 550; }
.finance-direction::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.finance-direction.out { color: var(--red); background: var(--red-soft); }
.finance-amount { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.finance-amount.positive { color: var(--primary); }
.finance-amount.negative { color: var(--red); }
.finance-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 3px; }
.finance-row-actions .btn { font-size: 9px; padding-inline: 8px; }
.finance-stock { display: inline-block; padding: 4px 8px; color: var(--primary-text); background: var(--primary-soft); border-radius: 5px; font-size: 10px; white-space: nowrap; }
.finance-stock.low { color: var(--orange); background: var(--orange-soft); }
.finance-product-preview, .finance-note-preview { display: block; max-width: 260px; color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.finance-period-field { max-width: 190px; }
.finance-period-field input { min-height: 37px !important; padding: 8px 10px !important; font-size: 11px !important; }
.finance-period-note { margin: 0; color: var(--muted); font-size: 10px; text-align: right; line-height: 1.8; }
.finance-ledger-panel { margin-top: 23px; }
.finance-advance-balance { color: var(--orange); }
.finance-form-spacer { margin-top: 17px; }
.finance-form-note { margin-top: 18px; line-height: 1.8; }
.notice.finance-form-note { margin-bottom: 0; }
.finance-modal-summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 17px; margin-bottom: 22px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); }
.finance-modal-summary span { color: var(--muted); font-size: 11px; }
.finance-modal-summary strong { color: var(--text); font-size: 19px; font-weight: 600; letter-spacing: -.04em; white-space: nowrap; }
.finance-sale-lines { display: grid; gap: 12px; margin: 22px 0 8px; }
.finance-sale-line { display: grid; grid-template-columns: minmax(0, 1fr) 64px 84px 28px; align-items: center; gap: 11px; padding: 14px; border: 1px solid var(--border); background: var(--surface-soft); border-radius: 10px; }
.finance-sale-line .field label { font-size: 10px; margin-bottom: 5px; }
.finance-sale-line .field input, .finance-sale-line .field select { min-height: 36px; font-size: 11px; padding: 8px 9px; background: var(--surface); }
.finance-sale-line .field-hint { font-size: 8px; margin-top: 6px; }
.finance-quantity-field { align-self: start; }
.finance-quantity-field input { text-align: center; }
.finance-line-total { font-size: 12px; font-weight: 600; letter-spacing: -.015em; text-align: right; font-variant-numeric: tabular-nums; }
.finance-remove-line { width: 26px; height: 28px; color: var(--muted); }
.finance-remove-line:hover { color: var(--red); background: var(--red-soft); }
.finance-remove-line svg { width: 14px; height: 14px; }
.finance-sale-totals { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 4px 12px; padding: 16px 17px; margin: 19px 0 22px; color: var(--primary-text); border-radius: 10px; background: var(--primary-soft); }
.finance-sale-totals > span { font-size: 11px; }
.finance-sale-totals > strong { grid-column: 2; font-size: 20px; letter-spacing: -.045em; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.finance-sale-totals > small { grid-column: 1 / -1; color: var(--muted); font-size: 10px; }
.finance-sale-detail-table { border: 1px solid var(--border); border-radius: 10px; margin: 18px 0 20px; }
.finance-sale-detail-table th, .finance-sale-detail-table td { padding: 10px 13px; font-size: 10px; }
.finance-sale-detail-table th { border-top: 0; }
.finance-detail-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
.finance-refund-review { padding: 19px; margin-bottom: 22px; border: 1px solid color-mix(in srgb, var(--orange) 15%, var(--border)); background: var(--orange-soft); border-radius: 12px; }
.finance-refund-review .eyebrow { color: var(--orange); font-size: 8px; margin-bottom: 10px; }
.finance-refund-review h3 { font-size: 16px; margin: 0 0 11px; }
.finance-refund-review ul { display: grid; gap: 5px; list-style: none; margin: 0 0 17px; padding: 0; color: var(--muted); font-size: 11px; }
.finance-refund-review > div { display: flex; justify-content: space-between; gap: 14px; padding-top: 12px; border-top: 1px solid color-mix(in srgb, var(--orange) 15%, var(--border)); font-size: 11px; }
.finance-refund-review > div > strong { font-size: 17px; font-weight: 600; letter-spacing: -.035em; }
.finance-refund-review p { margin: 13px 0 0; color: var(--muted); font-size: 10px; line-height: 1.9; }
.finance-confirm-copy { color: var(--muted); font-size: 12px; line-height: 1.8; margin-bottom: 12px; }
#finance-range-error:not(:empty) { margin-top: -7px; margin-bottom: 15px; }
/* Cash desk: realised movements, manual accounts and source receivables. */
.app-shell .finance-control-strip { display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--border)); background: color-mix(in srgb, var(--primary-soft) 65%, var(--surface)); border-radius: 16px; padding: 16px 20px; margin-bottom: 22px; }
.finance-control-strip > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.finance-control-strip > div > svg { width: 20px; height: 20px; color: var(--primary); flex-shrink: 0; }
.finance-control-strip strong { display: block; font-size: 13px; font-weight: 650; }
.finance-control-strip small { display: block; margin-top: 3px; font-size: 12px; color: var(--muted); line-height: 1.6; }
.finance-live-label { white-space: nowrap; color: var(--primary-text); font-size: 11px; font-weight: 600; background: var(--surface); border: 1px solid var(--border); padding: 7px 10px; border-radius: 20px; }
.finance-live-label::before { content: ''; width: 5px; height: 5px; background: var(--primary); border-radius: 50%; display: inline-block; margin-right: 6px; vertical-align: middle; }
.app-shell .finance-account-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 24px 0; }
.finance-account-card { appearance: none; border: 1px solid var(--border); background: var(--surface); border-radius: 18px; padding: 22px; color: var(--text); text-align: left; cursor: pointer; min-width: 0; transition: border-color .18s, transform .18s; }
.finance-account-card:hover { transform: translateY(-2px); border-color: var(--primary); }
.finance-account-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.finance-account-card > span { display: flex; gap: 8px; align-items: center; font-size: 12px; font-weight: 600; color: var(--muted); line-height: 1.5; }
.finance-account-card > span > svg { width: 17px; height: 17px; color: var(--primary); flex-shrink: 0; }
.finance-account-card.payable > span > svg { color: var(--orange); }
.finance-account-card strong { display: block; margin: 15px 0 6px; font-size: clamp(24px, 2vw, 31px); line-height: 1.1; letter-spacing: -.045em; font-weight: 650; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.finance-account-card small { color: var(--muted); font-size: 11px; line-height: 1.6; }
.app-shell .finance-control-panel { border-radius: 22px; overflow: hidden; }
.app-shell .finance-control-panel > .panel-heading { align-items: center; flex-wrap: wrap; gap: 20px; }
.finance-cash-tabs { display: flex; gap: 4px; background: var(--surface-soft); border: 1px solid var(--border); border-radius: 12px; padding: 4px; max-width: 100%; }
.finance-cash-tabs button { appearance: none; border: 0; background: transparent; color: var(--muted); border-radius: 8px; padding: 10px 12px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.finance-cash-tabs button.active { background: var(--surface); box-shadow: 0 2px 8px rgb(0 0 0 / 6%); color: var(--text); }
.finance-cash-tabs button:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.finance-cash-tabs button > span { margin-left: 6px; font-size: 10px; background: var(--primary-soft); color: var(--primary-text); border-radius: 5px; padding: 2px 5px; }
.finance-list-tools { display: flex; align-items: center; gap: 12px; padding: 0 26px 22px; }
.finance-list-tools .finance-search { flex: 1; max-width: 460px; }
.finance-list-tools .field { min-width: 0; }
.finance-list-tools .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.finance-list-tools :is(input, select) { width: 100%; min-height: 43px; border: 1px solid var(--border); background: var(--surface-soft); color: var(--text); border-radius: 10px; font: inherit; font-size: 13px; padding: 10px 12px; }
.finance-filter-count { margin-left: auto; font-size: 11px; color: var(--muted); white-space: nowrap; }
.app-shell .finance-control-table table { min-width: 900px; }
.app-shell .finance-control-table td { vertical-align: middle; }
.finance-control-table tr[hidden] { display: none; }
.app-shell .finance-control-table .cell-main { font-weight: 650; }
.finance-wrap { max-width: 290px; white-space: normal; overflow-wrap: anywhere; line-height: 1.55; }
.finance-actor { display: block; max-width: 160px; font-size: 12px; line-height: 1.6; color: var(--muted); }
.finance-payment-status { display: inline-flex; align-items: center; gap: 6px; border-radius: 7px; padding: 5px 8px; background: var(--surface-soft); color: var(--muted); font-size: 11px; line-height: 1.4; font-weight: 600; white-space: nowrap; }
.finance-payment-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.finance-payment-status.paid { background: var(--primary-soft); color: var(--primary-text); }
.finance-payment-status.partial { background: var(--orange-soft); color: var(--orange); }
.finance-account-kind { display: inline-block; color: var(--primary-text); background: var(--primary-soft); border-radius: 5px; padding: 3px 6px; margin-top: 7px; font-size: 10px; font-weight: 600; }
.finance-account-kind.payable { color: var(--orange); background: var(--orange-soft); }
.finance-overdue { color: var(--red) !important; font-size: 12px; }
.finance-no-results { text-align: center; padding: 36px 24px; color: var(--muted); font-size: 13px; }
.finance-section-note { color: var(--muted); background: var(--surface-soft); padding: 14px 18px; margin: 0 26px 22px; border-radius: 10px; font-size: 12px; line-height: 1.8; }
.finance-debt-detail-head h3, .finance-receipt-preview h3 { margin: 10px 0 4px; font-size: 23px; line-height: 1.4; letter-spacing: -.03em; overflow-wrap: anywhere; }
.finance-debt-detail-head p, .finance-receipt-preview > p { margin: 0 0 14px; color: var(--muted); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.finance-debt-detail-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border); background: var(--surface-soft); border-radius: 15px; margin: 24px 0; overflow: hidden; }
.finance-debt-detail-totals > div { padding: 16px; min-width: 0; }
.finance-debt-detail-totals > div + div { border-left: 1px solid var(--border); }
.finance-debt-detail-totals span { display: block; font-size: 11px; color: var(--muted); margin-bottom: 5px; }
.finance-debt-detail-totals strong { display: block; font-size: 17px; letter-spacing: -.04em; overflow-wrap: anywhere; }
.finance-detail-meta { margin: 20px 0; font-size: 12px; }
.finance-detail-meta > div { display: flex; gap: 20px; justify-content: space-between; padding: 11px 0; border-bottom: 1px solid var(--border); }
.finance-detail-meta dt { color: var(--muted); flex-shrink: 0; }
.finance-detail-meta dd { margin: 0; text-align: right; font-weight: 550; overflow-wrap: anywhere; }
.finance-history-heading { font-size: 14px; margin: 24px 0 14px; }
.finance-history-list { display: grid; gap: 0; }
.finance-history-row { display: flex; gap: 13px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.finance-history-dot { display: flex; align-items: center; justify-content: center; width: 29px; height: 29px; flex-shrink: 0; border-radius: 50%; background: var(--primary-soft); color: var(--primary-text); }
.finance-history-dot svg { width: 14px; height: 14px; }
.finance-history-row > div { min-width: 0; }
.finance-history-row strong { display: block; font-size: 13px; margin-bottom: 4px; }
.finance-history-row > div > span { display: block; color: var(--muted); font-size: 11px; line-height: 1.6; }
.finance-history-row p { margin: 6px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.finance-receipt-preview { border: 1px dashed var(--border); border-radius: 16px; padding: 24px; }
.finance-receipt-preview .eyebrow { font-size: 10px; }
.finance-receipt-amount { font-size: 36px; font-weight: 650; letter-spacing: -.05em; margin: 20px 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.finance-receipt-preview .field-hint { margin-bottom: 0; }
@media (max-width: 980px) {
  .finance-account-card { padding: 18px; }
  .finance-live-label { display: none; }
  .finance-cash-tabs { flex-wrap: wrap; }
}
@media (max-width: 640px) {
  .app-shell .finance-account-overview { grid-template-columns: 1fr; gap: 10px; margin-block: 20px; }
  .finance-account-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px 12px; padding: 17px; border-radius: 14px; }
  .finance-account-card strong { grid-column: 2; grid-row: 1 / 3; margin: 0; font-size: 22px; }
  .finance-account-card small { grid-column: 1; font-size: 10px; }
  .finance-account-card > span { font-size: 11px; }
  .app-shell .finance-control-strip { padding: 14px; margin-bottom: 18px; }
  .finance-control-strip small { font-size: 11px; }
  .app-shell .finance-control-panel > .panel-heading { padding: 20px 17px 16px; }
  .finance-cash-tabs { width: 100%; justify-content: stretch; }
  .finance-cash-tabs button { flex: 1; padding: 9px 6px; font-size: 11px; }
  .finance-cash-tabs button > span { margin-left: 3px; }
  .finance-list-tools { padding: 0 17px 17px; flex-wrap: wrap; gap: 9px; }
  .finance-list-tools .finance-search { flex-basis: 100%; max-width: none; }
  .finance-list-tools :is(input, select) { font-size: 16px; }
  .finance-list-tools > .field:not(.finance-search) { flex: 1; }
  .finance-section-note { margin: 0 17px 17px; }
  .finance-debt-detail-totals { gap: 0; }
  .finance-debt-detail-totals > div { padding: 12px 10px; }
  .finance-debt-detail-totals strong { font-size: 15px; }
  .finance-receipt-preview { padding: 18px; }
  .finance-detail-meta > div { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { .finance-account-card { transition: none; } .finance-account-card:hover { transform: none; } }
@media (max-width: 1100px) {
  .finance-method-balances { justify-content: flex-start; }
  .finance-toolbar { align-items: flex-start; }
  .finance-stats .stat-value { font-size: 23px; }
  .finance-row-actions { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  .finance-cash-panel table { min-width: 760px; }
  .finance-stats .stat-value { font-size: 23px; }
  .finance-period-note { text-align: left; font-size: 9px; }
  .finance-date-range { width: 100%; }
  .finance-date-range .field { flex: 1; }
  .finance-method-balances { width: 100%; }
  .finance-method-balances > span { flex: 1; justify-content: space-between; font-size: 9px; padding: 8px; }
}
@media (max-width: 480px) {
  .finance-stats .stat-value { font-size: 20px; }
  .finance-ledger-panel .panel-heading { align-items: flex-start; flex-wrap: wrap; }
  .finance-period-field { width: 100%; max-width: none; }
  .finance-period-note { width: 100%; }
  .finance-date-range { gap: 8px; }
  .finance-date-range > span { display: none; }
  .finance-date-range .field input { padding: 8px; font-size: 10px; }
  .finance-modal-summary { align-items: flex-start; flex-direction: column; gap: 6px; }
  .finance-sale-line { grid-template-columns: minmax(0, 1fr) 62px 26px; gap: 10px; padding: 12px; }
  .finance-sale-line > .field:first-child { grid-column: 1 / 3; }
  .finance-sale-line > .finance-quantity-field { grid-column: 1; grid-row: 2; max-width: 75px; }
  .finance-line-total { grid-column: 2 / 4; grid-row: 2; align-self: center; font-size: 13px; }
  .finance-remove-line { grid-column: 3; grid-row: 1; align-self: start; margin-top: 21px; }
  .finance-sale-totals { padding: 14px; }
  .finance-sale-totals > strong { font-size: 19px; }
  .finance-refund-review { padding: 16px; }
  .finance-refund-review > div { flex-direction: column; gap: 5px; }
  .finance-detail-actions > .btn { flex: 1; }
}
@media (max-width: 760px) {
  .app-shell .finance-toolbar .finance-date-range .field input,
  .app-shell .finance-toolbar .finance-period-field input,
  .app-shell .finance-list-tools .field :is(input, select),
  .modal form[id^="finance-"] :is(input, select, textarea) { font-size: 16px !important; }
}
@media (max-width: 600px) {
  .app-shell .finance-control-table { padding: 0 16px 16px; overflow: visible; }
  .app-shell .finance-control-table table { display: block; width: 100%; min-width: 0; }
  .app-shell .finance-control-table thead { display: none; }
  .app-shell .finance-control-table tbody { display: grid; gap: 12px; }
  .app-shell .finance-control-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 15px 12px; padding: 18px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
  .app-shell .finance-control-table tr[hidden] { display: none; }
  .app-shell .finance-control-table td { display: block; min-width: 0; padding: 0; border: 0; text-align: left; overflow-wrap: anywhere; }
  .app-shell .finance-control-table td::before { display: block; font-size: 10px; font-weight: 500; color: var(--muted); margin-bottom: 6px; }
  .app-shell .finance-control-table td:nth-child(1),
  .app-shell .finance-control-table td:nth-child(2) { grid-column: 1 / -1; }
  .app-shell .finance-control-table td:nth-child(1) { padding-bottom: 12px; border-bottom: 1px solid var(--border); }
  .app-shell .finance-control-table td:nth-child(1) .cell-main { font-size: 14px; }
  .app-shell .finance-control-table td:nth-child(2)::before { content: 'Tarih'; }
  .app-shell .finance-control-table td:nth-child(3)::before { content: 'İşlem tutarı'; }
  .app-shell .finance-control-table td:nth-child(4)::before { content: 'Ödeme durumu'; }
  .app-shell .finance-control-table td:nth-child(5)::before { content: 'Kalan tutar'; }
  .app-shell .finance-control-table td:nth-child(5) { align-self: end; white-space: normal; font-size: 18px; font-weight: 700; }
  .app-shell .finance-control-table td:nth-child(6) { display: flex; align-items: flex-end; justify-content: flex-end; }
  .app-shell .finance-control-table td:nth-child(6) .finance-row-actions { justify-content: flex-end; }
  .app-shell .finance-control-table .finance-wrap, .app-shell .finance-control-table .finance-actor { max-width: none; }
  .app-shell .finance-control-table .finance-payment-status { padding-inline: 6px; font-size: 10px; }
  .app-shell .finance-control-table[data-finance-table="cash"] td:nth-child(2)::before { content: 'İşlem'; }
  .app-shell .finance-control-table[data-finance-table="cash"] td:nth-child(3)::before { content: 'Ödeme durumu'; }
  .app-shell .finance-control-table[data-finance-table="cash"] td:nth-child(4)::before { content: 'Kaydeden'; }
  .app-shell .finance-control-table[data-finance-table="cash"] td:nth-child(5)::before { content: 'Gerçekleşen tutar'; }
  .app-shell .finance-control-table[data-finance-table="debts"] td:nth-child(2)::before { content: 'Vade'; }
}