/*
 * Receivables UI (statement tab, reminder dialogs, settings drawer) - see includes/scripts/ux/40-receivables.js.
 * Uses the design tokens of fm-ui.css (--fm-*); the fallbacks keep it readable on pages that do not define them (customer form iframe).
 */
/* ---- statement tab ---- */
#csPanel{--rc-ink:var(--fm-ink,#1b2437);--rc-muted:var(--fm-muted,#667085);--rc-line:var(--fm-line,#e4e8f0);--rc-brand:var(--fm-primary,#0369a1);--rc-soft:#f3f8fc}
.cs-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:18px 0 14px}
.cs-toolbar label{display:flex;flex-direction:column;font-size:12px;color:var(--rc-muted);gap:3px}
.cs-toolbar .form-control{height:38px;min-width:150px}
.cs-sep{flex:1 1 20px}
.cs-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}
.cs-card{background:#fff;border:1px solid var(--rc-line);border-radius:14px;padding:12px 14px;box-shadow:0 1px 2px rgba(15,42,61,.04)}
.cs-card small,.cs-age small{display:block;color:var(--rc-muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em}
.cs-card b{font-size:19px;color:var(--rc-ink);font-variant-numeric:tabular-nums}
.cs-card.is-owed{border-color:#fecaca;background:#fff7f7}.cs-card.is-owed b{color:#b91c1c}
.cs-card.is-clear{border-color:#bbf7d0;background:#f6fff9}.cs-card.is-clear b{color:#15803d}
.cs-ageing{background:#fff;border:1px solid var(--rc-line);border-radius:14px;padding:12px 14px;margin-bottom:14px}
.cs-ageing h4,.cs-foot h4{margin:0 0 8px;font-size:13px;color:var(--rc-muted);text-transform:uppercase;letter-spacing:.06em}
.cs-bar{display:flex;height:10px;border-radius:99px;overflow:hidden;background:#eef2f7;margin-bottom:10px}
.cs-seg{display:block;height:100%}
.cs-current{--c:#22c55e}.cs-d1{--c:#f59e0b}.cs-d31{--c:#f97316}.cs-d61{--c:#ef4444}.cs-d90{--c:#991b1b}
.cs-seg{background:var(--c)}
.cs-ages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.cs-age{border-left:4px solid var(--c);padding:2px 0 2px 8px}.cs-age b{font-variant-numeric:tabular-nums}
.cs-note{margin:8px 0 0;color:var(--rc-muted);font-size:12.5px}
.cs-tablewrap{background:#fff;border:1px solid var(--rc-line);border-radius:14px;overflow:auto}
.cs-table{width:100%;border-collapse:collapse;font-size:13.5px}
.cs-table th{background:var(--rc-soft);color:var(--rc-muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;text-align:left;padding:9px 12px;white-space:nowrap}
.cs-table td{padding:9px 12px;border-top:1px solid var(--rc-line);vertical-align:top}
.cs-table .r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cs-table tr.cs-open td{background:var(--rc-soft);font-weight:700}
.cs-t-payment td:nth-child(2),.cs-t-credit td:nth-child(2){color:#15803d;font-weight:600}.cs-t-refund td:nth-child(2){color:#b45309;font-weight:600}
.cs-empty{padding:22px;text-align:center;color:var(--rc-muted)}
.cs-body.is-loading{opacity:.5;pointer-events:none}
.cs-skel{height:220px;border-radius:14px;background:linear-gradient(90deg,#eef2f7,#f8fafc,#eef2f7);background-size:200% 100%;animation:csSkel 1.2s infinite linear}
@keyframes csSkel{to{background-position:-200% 0}}
.cs-foot{margin-top:16px}
.cs-optout{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cs-log{list-style:none;margin:0;padding:0;font-size:13px}.cs-log li{padding:6px 0;border-top:1px solid var(--rc-line)}
.cs-tag{display:inline-block;border-radius:99px;padding:1px 9px;font-size:11.5px;background:#eef2f7}.cs-tag-sent{background:#dcfce7;color:#166534}.cs-tag-failed{background:#fee2e2;color:#991b1b}.cs-tag-pending{background:#fef3c7;color:#92400e}
@media (max-width:760px){
	.cs-cards{grid-template-columns:1fr 1fr}.cs-ages{grid-template-columns:1fr 1fr}
	.cs-table thead{display:none}.cs-table,.cs-table tbody,.cs-table tr,.cs-table td{display:block;width:100%}
	.cs-table tr{border-top:1px solid var(--rc-line);padding:6px 0}.cs-table td{border:0;padding:3px 12px;display:flex;justify-content:space-between;gap:12px;text-align:right}
	.cs-table td[data-label]::before{content:attr(data-label);color:var(--rc-muted);font-size:12px;text-align:left}
	.cs-table tr.cs-open td[colspan]{display:block;text-align:left}
}
/* ---- dialogs + settings drawer ---- */
.rc-modal{position:fixed;inset:0;z-index:100000;background:rgba(15,42,61,.45);display:flex;align-items:center;justify-content:center;padding:14px}
.rc-box{background:#fff;border-radius:18px;max-width:560px;width:100%;max-height:92vh;overflow:auto;padding:22px 24px;box-shadow:0 24px 70px rgba(8,47,73,.3);color:#1b2437}
.rc-box h3,.rc-settings h4{margin:0 0 6px}.rc-settings h4{font-size:13px;color:#667085;text-transform:uppercase;letter-spacing:.06em;margin:18px 0 8px}
.rc-muted,.rc-settings small{color:#667085;font-size:13px}.rc-settings small{display:block;margin-top:3px}
.rc-field{display:block;margin:0 0 12px}.rc-field span{display:block;font-size:12.5px;color:#667085;margin-bottom:3px}
.rc-check{display:flex;gap:8px;align-items:center;margin:6px 0;cursor:pointer}
.rc-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin-top:16px}.rc-actions .rc-muted{margin-right:auto}
.rc-docs{max-height:260px;overflow:auto;border:1px solid #e4e8f0;border-radius:12px;margin:10px 0 14px}
.rc-doc{display:flex;gap:10px;align-items:baseline;padding:9px 12px;border-top:1px solid #e4e8f0;margin:0;cursor:pointer}.rc-doc:first-child{border-top:0}
.rc-doc span{color:#667085;font-size:12.5px;flex:1}.rc-doc em{font-style:normal;font-weight:700;font-variant-numeric:tabular-nums}.rc-doc.is-off{opacity:.55}
.rc-warn{background:#fffbeb;border:1px solid #fde68a;color:#78350f;border-radius:10px;padding:8px 12px;margin:8px 0}
.rc-three{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.rc-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rc-lvl{border:1px solid #e4e8f0;border-radius:12px;padding:8px 12px;margin:0 0 8px}.rc-lvl summary{cursor:pointer;font-weight:600}
@media (max-width:560px){.rc-three{grid-template-columns:1fr}}