/* Mobile customer presentation only. Desktop remains in its own shadow styles. */
body[data-mobile-view="customers"] .main { background:#faf8ff; }
body.customers-mode,body[data-mobile-view="customers"] { overflow-x:hidden!important;max-width:100vw; }
body[data-mobile-view="customers"] { scrollbar-width:none; }
body[data-mobile-view="customers"]::-webkit-scrollbar { width:0;height:0;display:none; }
html:has(body[data-mobile-view="customers"]) { scrollbar-width:none; }
html:has(body[data-mobile-view="customers"])::-webkit-scrollbar { width:0;height:0;display:none; }
body[data-mobile-view="customers"] .standard-topbar { display:grid;grid-template-columns:minmax(0,1fr) 40px;grid-template-rows:40px;gap:8px;box-sizing:border-box;width:100%;height:calc(58px + env(safe-area-inset-top));min-height:calc(58px + env(safe-area-inset-top));margin:0 0 8px;padding:calc(8px + env(safe-area-inset-top)) 14px 10px;border:0;border-radius:0;background:#006495;box-shadow:0 2px 6px #0f172a12; }
body[data-mobile-view="customers"] .standard-topbar .standard-search-box { grid-column:1;grid-row:1;width:100%;min-width:0;height:40px;min-height:40px;border:0;border-radius:20px;background:#fff;box-shadow:none; }
body[data-mobile-view="customers"] .standard-topbar .standard-search-box input { width:100%;min-width:0;height:38px;min-height:38px;padding-left:32px;background:transparent;font:14px/20px Inter,Arial,sans-serif; }
body[data-mobile-view="customers"] .standard-topbar .standard-search-box > .icon { left:10px;width:16px;height:16px;color:#94a3b8; }
body[data-mobile-view="customers"] .standard-topbar .mobile-customer-locate { display:grid;place-items:center;grid-column:2;grid-row:1;width:40px;height:40px;min-height:40px;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#ffffff26;color:#fff; }
body[data-mobile-view="customers"] .standard-topbar .topbar-title,body[data-mobile-view="customers"] .standard-topbar > .mobile-subpage-back,body[data-mobile-view="customers"] .standard-topbar .mobile-module-sort,body[data-mobile-view="customers"] .standard-topbar .mobile-module-filter,body[data-mobile-view="customers"] #mobileOrdersSectionSwitch,body[data-mobile-view="customers"] #mobileModuleSummary { display:none; }
body[data-mobile-view="customers"] #customersView { padding:0 16px 32px;background:#faf8ff; }
#customerMobileHost[hidden] { display:none; }
#customerMobileHost { width:100%;max-width:100%;min-width:0;overflow-x:hidden; }
.cm-list-summary { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;margin-bottom:8px;border-radius:16px;background:#fff;box-shadow:0 2px 8px #0f172a0a;font-family:Inter,Arial,sans-serif; }
.cm-list-summary h2 { margin:0;font:900 12px/20px "Plus Jakarta Sans",Arial,sans-serif; }.cm-list-summary p { margin:2px 0 0;font-size:11px;color:#434656; }.cm-list-summary > div:last-child { text-align:right;min-width:0; }.cm-list-summary small { color:#434656;font-size:12px; }.cm-list-summary strong { display:block;color:#131b2e;font:700 16px/20px "Plus Jakarta Sans",Arial,sans-serif;overflow-wrap:anywhere; }
.cm-list-cards { display:grid;gap:8px; }.cm-list-empty { padding:16px;color:#434656;text-align:center; }
.cm-list-more { width:100%;min-height:36px;margin-top:8px;padding:8px 12px;border:0;border-radius:12px;background:#f2f3ff;color:#006495;font:500 12px/16px Inter,Arial,sans-serif; }
.cm-list-more[hidden] { display:none; }
.cm-list-card { display:flex;flex-direction:column;gap:12px;width:100%;max-width:100%;min-width:0;overflow:hidden;padding:16px;border-radius:16px;background:#fff;box-shadow:0 2px 8px #0f172a0a;font:12px/16px Inter,Arial,sans-serif;color:#131b2e; }
.cm-list-top { display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0; }
.cm-list-profile { display:flex;align-items:center;gap:12px;flex:1;min-width:0; }
.cm-list-avatar { position:relative;flex:0 0 48px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;color:#006495;background:#dae2fd;font:600 16px/22px "Plus Jakarta Sans",Arial,sans-serif; }
.cm-list-avatar img { width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #e2e7ff; }.cm-list-avatar i { position:absolute;bottom:0;right:0;width:14px;height:14px;border:2px solid #fff;border-radius:50%;background:#006c49; }
.cm-list-identity { min-width:0;flex:1; }.cm-list-identity > div { display:flex;align-items:center;gap:6px;min-width:0; }.cm-list-identity button { display:block;min-width:0;min-height:0;padding:0;border:0;background:none;color:#131b2e;text-align:left;font:700 14px/20px "Plus Jakarta Sans",Arial,sans-serif;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }.cm-list-identity small { display:flex;align-items:center;gap:4px;font-size:11px;margin-top:2px;color:#434656;overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }.cm-list-identity .icon,.cm-list-identity svg { width:15px;height:15px;flex:0 0 15px;color:#737687; }
.cm-list-metrics { text-align:right;flex-shrink:0;max-width:46%; }.cm-list-metrics strong { display:block;margin-top:2px;font:700 14px/20px "Plus Jakarta Sans",Arial,sans-serif;overflow-wrap:anywhere; }.cm-list-metrics strong.empty { color:#737687; }.cm-list-metrics small { display:block;font-size:11px;color:#434656; }.cm-list-dollar { display:grid;place-items:center;flex:0 0 20px;width:20px;height:20px;border-radius:50%;color:#ba1a1a;background:#ffdad6;font-weight:700;font-size:11px; }
.cm-list-bottom { display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid #eaedff; }.cm-list-bottom p { display:flex;align-items:center;gap:4px;min-width:0;margin:0;color:#434656;font-size:11px; }.cm-list-bottom p .icon,.cm-list-bottom p svg { width:16px;height:16px;flex:0 0 16px;color:#737687; }.cm-list-bottom > div { display:flex;gap:8px;flex-shrink:0; }
.cm-list-contact { display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;min-height:36px;padding:0;border:0;border-radius:50%;background:#f2f3ff;color:#006c49;text-decoration:none;box-shadow:0 1px 3px #0000000d; }.cm-list-contact.sms { background:#dce1ff;color:#006495; }.cm-list-contact:disabled { opacity:.4;color:#737687;background:#eaedff; }.cm-list-contact .icon,.cm-list-contact svg { width:18px;height:18px; }
.cme-dialog { width:calc(100% - 32px);max-width:480px;max-height:min(795px,calc(100dvh - 32px));margin:auto;padding:0;border:1px solid #eaedff99;border-radius:24px;overflow:hidden;background:#fff;color:#131b2e;box-shadow:0 25px 50px #00000040;font:400 14px/20px Inter,Arial,sans-serif; }
.cme-dialog::backdrop { background:#0f172a99;backdrop-filter:blur(4px); }body:has(.cme-dialog[open]),html:has(.cme-dialog[open]) { overflow:hidden; }
.cme-dialog * { box-sizing:border-box; }.cme-dialog [hidden] { display:none; }
.cme-card { display:flex;flex-direction:column;max-height:min(795px,calc(100dvh - 32px));margin:0;gap:0;padding:0; }
.cme-card > header { display:flex;align-items:center;gap:12px;flex-shrink:0;padding:16px 20px;border-bottom:1px solid #eaedff; }.cme-header-icon { width:40px;height:40px;flex:0 0 40px;display:grid;place-items:center;border-radius:16px;background:#dce1ff80;color:#006495; }.cme-header-icon .icon,.cme-header-icon svg { width:22px;height:22px; }.cme-card h3 { margin:0;font:700 16px/20px "Plus Jakarta Sans",Arial,sans-serif; }.cme-card > header small { display:block;margin-top:2px;color:#434656;font:400 12px/16px Inter,Arial,sans-serif; }.cme-card > header button { display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;min-height:32px;padding:0;margin-left:auto;border:0;border-radius:50%;color:#434656;background:#f2f3ff; }.cme-card > header button .icon,.cme-card > header button svg { width:20px;height:20px; }
.cme-body { display:flex;flex-direction:column;gap:16px;min-height:0;flex:1;overflow-y:auto;padding:16px 20px; }.cme-type-body { display:flex;flex-direction:column;gap:16px;min-width:0; }.cme-field { display:flex;flex-direction:column;gap:6px;min-width:0;margin:0; }.cme-field > span { display:flex;align-items:center;justify-content:space-between;gap:4px;font:600 12px/16px Inter,Arial,sans-serif; }.cme-field > span small { font:400 11px/14px Inter,Arial,sans-serif;color:#737687; }.cme-required { color:#ba1a1a; }
.cme-control { display:flex;align-items:center;gap:10px;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #eaedff;border-radius:12px;background:#f2f3ff;box-shadow:0 1px 3px #0000000d; }.cme-control:focus-within { border-color:#006495;background:#fff; }.cme-control > .icon,.cme-control > .icon svg { width:20px;height:20px;flex:0 0 20px;color:#006495; }.cme-control input,.cme-control select,.cme-control textarea { appearance:none;display:block;flex:1;width:100%;min-width:0;height:auto;min-height:20px;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;outline:0;color:#131b2e;font:500 14px/20px Inter,Arial,sans-serif; }.cme-control input::placeholder,.cme-control textarea::placeholder { color:#737687; }.cme-field.compact .cme-control input,.cme-field.compact .cme-control select { font-size:12px;line-height:16px; }.cme-control select { font:400 12px/16px Inter,Arial,sans-serif; }.cme-control select + .icon,.cme-control select + .icon svg { color:#737687; }
.cme-types { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border:1px solid #eaedff;border-radius:16px;background:#f2f3ff; }.cme-types button { display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:36px;padding:8px 6px;border:0;border-radius:12px;background:transparent;color:#434656;font:500 12px/16px Inter,Arial,sans-serif;white-space:nowrap; }.cme-types button.active { background:#fff;color:#006495;box-shadow:0 1px 3px #0000000d;font-weight:600; }.cme-types .icon,.cme-types svg { width:18px;height:18px; }
.cme-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }.cme-grid > * { min-width:0; }.cme-grid .cme-control { gap:6px; }.cme-grid .cme-control > .icon,.cme-grid .cme-control > .icon svg { width:18px;height:18px;flex-basis:18px; }
.cme-address { display:flex;flex-direction:column;gap:8px;min-width:0; }.cme-address > span { display:flex;justify-content:space-between;align-items:center;gap:8px;font:600 12px/16px Inter,Arial,sans-serif; }.cme-address > span b { font-weight:600; }.cme-address > span small { font:400 11px/14px Inter,Arial,sans-serif;color:#737687; }.cme-textarea { align-items:flex-start;padding:8px 12px; }.cme-textarea > .icon,.cme-textarea > .icon svg { margin-top:2px;width:18px;height:18px;color:#737687; }.cme-textarea textarea { resize:none;font:400 12px/20px Inter,Arial,sans-serif; }
.cme-tax-row { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end; }.cme-tax-row > button { display:flex;align-items:center;justify-content:center;gap:6px;height:44px;min-height:44px;padding:0 14px;border:0;border-radius:12px;background:#dce1ff;color:#006495;font:600 12px/16px Inter,Arial,sans-serif;box-shadow:0 1px 3px #0000000d; }.cme-tax-row .icon,.cme-tax-row svg { width:18px;height:18px; }
.cme-gps { display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid #eaedff;border-radius:16px;background:#f2f3ffb3; }.cme-gps header { display:flex;align-items:center;justify-content:space-between;gap:6px; }.cme-gps header strong { display:flex;align-items:center;gap:6px;min-width:0;font:600 12px/16px Inter,Arial,sans-serif; }.cme-gps header .icon,.cme-gps header svg { flex:0 0 18px;width:18px;height:18px;color:#006495; }.cme-gps header > span { flex-shrink:0;padding:2px 8px;border-radius:999px;background:#ffddb8;color:#653e00;font:600 11px/14px Inter,Arial,sans-serif;box-shadow:0 1px 3px #0000000d; }.cme-gps > div { padding:8px 12px;border:1px solid #eaedff;border-radius:12px;background:#fff;color:#737687;font:italic 12px/16px Inter,Arial,sans-serif;overflow-wrap:anywhere; }.cme-gps button { display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:36px;padding:10px 12px;border:0;border-radius:12px;background:#dce1ff;color:#006495;font:600 12px/16px Inter,Arial,sans-serif;box-shadow:0 1px 3px #0000000d; }.cme-gps button .icon,.cme-gps button svg { width:18px;height:18px; }
.cme-contract,.cme-extra { min-width:0; }.cme-contract > summary,.cme-extra > summary { display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px dashed #00649599;border-radius:12px;color:#006495;background:#dce1ff33;cursor:pointer;list-style:none;font:600 12px/16px Inter,Arial,sans-serif; }.cme-contract > summary::-webkit-details-marker,.cme-extra > summary::-webkit-details-marker { display:none; }.cme-contract > summary > .icon:last-child,.cme-extra > summary > .icon { margin-left:auto; }.cme-contract > summary .icon,.cme-contract > summary svg,.cme-extra > summary .icon,.cme-extra > summary svg { width:18px;height:18px;flex:0 0 18px; }.cme-contract[open] > summary > .icon:last-child,.cme-extra[open] > summary > .icon { transform:rotate(180deg); }.cme-contract > div,.cme-extra > div { display:flex;flex-direction:column;gap:10px;padding:12px;margin-top:8px;border:1px solid #eaedff;border-radius:16px;background:#f2f3ffb3; }.cme-contract .cme-control,.cme-extra .cme-control { background:#fff;min-height:36px;padding:8px 12px; }.cme-extra > summary { border:0;background:transparent;color:#737687; }
.cme-upload { display:flex;flex-direction:column;gap:6px;font-size:12px; }.cme-upload input { width:100%;font-size:12px; }.cme-upload img { width:64px;height:64px;object-fit:cover;border-radius:50%; }.cme-supplier { display:flex;align-items:center;gap:8px;margin:0;font-size:12px; }.cme-supplier input { width:16px;height:16px;min-height:0; }
.cme-card > footer { display:flex;gap:12px;flex-shrink:0;padding:16px 20px;border-top:1px solid #eaedff;background:#f2f3ff66; }.cme-card > footer button { display:flex;align-items:center;justify-content:center;gap:6px;flex:1;min-width:0;min-height:36px;padding:10px 8px;border:1px solid #c3c5d9;border-radius:12px;background:#fff;color:#131b2e;font:600 12px/16px Inter,Arial,sans-serif;box-shadow:0 1px 3px #0000000d; }.cme-card > footer button[type=submit] { border-color:#006495;background:#006495;color:#fff;font-weight:700;box-shadow:0 4px 6px #0000001a; }.cme-card > footer .icon,.cme-card > footer svg { width:18px;height:18px;flex:0 0 18px; }.cme-card > footer button.cme-delete { flex:0 0 auto;color:#ba1a1a; }.cme-card button:disabled { opacity:.5; }

.cm-detail-dialog { width: calc(100% - 32px); max-width: 480px; max-height: 90dvh; margin: auto; padding: 0; border: 1px solid #eaedff99; border-radius: 24px; overflow: hidden; background: #fff; color: #131b2e; box-shadow: 0 25px 50px #00000040; font: 12px/16px Inter,Arial,sans-serif; }
.cm-detail-dialog::backdrop { background: #0f172a99; backdrop-filter: blur(4px); }
.cm-detail-card { display: flex; flex-direction: column; max-height: 90dvh; }
.cm-detail-header { display: flex; align-items: center; gap: 8px; flex-shrink: 0; padding: 16px 20px; border-bottom: 1px solid #eaedff; }
.cm-header-icon { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 12px; color: #006495; background: #dce1ff80; }
.cm-header-icon svg { width: 20px; height: 20px; }
.cm-detail-header h3 { margin: 0; font: 700 16px/22px "Plus Jakarta Sans",Arial,sans-serif; }
.cm-detail-header small { color: #434656; font-size: 12px; }
.cm-detail-header button { width: 32px; height: 32px; min-height: 32px; margin-left: auto; padding: 0; border: 0; border-radius: 50%; background: #f2f3ff; color: #434656; font-size: 22px; }
.cm-detail-body { display: flex; flex-direction: column; gap: 16px; min-width: 0; min-height: 0; flex: 1; overflow-y: auto; padding: 16px 20px; }
.cm-detail-body > section { min-width: 0; }
.cm-profile { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid #eaedff80; border-radius: 16px; background: #f2f3ff99; }
.cm-avatar { position: relative; display: grid; place-items: center; flex: 0 0 56px; width: 56px; height: 56px; border: 2px solid #dce1ff; border-radius: 50%; background: #006495; color: #fff; font: 700 18px/24px "Plus Jakarta Sans",Arial,sans-serif; }
.cm-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.cm-avatar i { position: absolute; bottom: 0; right: 0; width: 14px; height: 14px; border: 2px solid #fff; border-radius: 50%; background: #006c49; }
.cm-profile > div:last-child { min-width: 0; flex: 1; }
.cm-profile h4 { margin: 0; font: 700 16px/22px "Plus Jakarta Sans",Arial,sans-serif; overflow-wrap: anywhere; }
.cm-profile-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.cm-profile-badges > span { padding: 2px 8px; border-radius: 6px; background: #eaedff; color: #434656; font-size: 11px; font-weight: 500; }
.cm-profile-badges > .debt,.cm-status.debt { color: #ba1a1a; background: #ffdad699; }.cm-profile-badges > .paid,.cm-status.paid { color: #006c49; background: #006c491a; }
.cm-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); flex-shrink: 0; min-width: 0; gap: 4px; border-bottom: 1px solid #eaedff; }
.cm-tabs button { display: flex; align-items: center; justify-content: center; gap: 4px; min-width: 0; min-height: 36px; padding: 8px 0; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: #434656; font: 500 12px/16px Inter,Arial,sans-serif; white-space: nowrap; }
.cm-tabs button.active { color: #006495; border-bottom-color: #006495; font-weight: 600; }
.cm-tabs .icon,.cm-tabs svg { width: 18px; height: 18px; flex: 0 0 18px; }
.cm-kpis { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.cm-kpis > div { display: grid; gap: 4px; padding: 12px; border: 1px solid #eaedff; border-radius: 16px; background: #fff; }
.cm-kpis > div:last-child { border-color: #ffdad6; background: #ffdad64d; }
.cm-kpis span { color: #434656; }.cm-kpis strong { color: #006495; font: 700 16px/22px "Plus Jakarta Sans",Arial,sans-serif; overflow-wrap: anywhere; }.cm-kpis > div:last-child strong { color: #ba1a1a; }.cm-kpis small { color: #006c49; font-size: 11px; }
.cm-contact { display: grid; gap: 12px; padding: 12px; margin-top: 16px; border: 1px solid #eaedff; border-radius: 16px; }
.cm-contact > div { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding-top: 8px; border-top: 1px solid #f2f3ff; }
.cm-contact > div:first-child { padding-top: 0; border: 0; }
.cm-contact > div > span { display: flex; align-items: center; gap: 8px; color: #434656; flex-shrink: 0; }
.cm-contact strong { min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;text-align:right;overflow-wrap:anywhere;font-weight:500; }
.cm-contact .icon,.cm-contact svg { width: 18px; height: 18px; color: #737687; }
.cm-history-summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px; border: 1px solid #eaedff; border-radius: 12px; background: #f2f3ff99; }
.cm-history-summary > div { flex: 1; min-width: 0; }.cm-history-summary > div+div { padding-left: 8px; border-left: 1px solid #eaedff; }
.cm-history-summary small { display: block; color: #434656; font-size: 11px; }.cm-history-summary b { font-size: 15px; color: #006495; overflow-wrap: anywhere; }
.cm-history-list { display: grid; gap: 8px; margin-top: 12px; }
.cm-history-list article { display: grid; gap: 6px; padding: 12px; border: 1px solid #eaedff; border-radius: 12px; background: #fff; box-shadow: 0 1px 3px #0000000d; }
.cm-history-list header { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }.cm-history-list header > strong { margin-left: auto; font-size: 16px; }.cm-history-list header > b { color: #006495; font-size: 13px; }
.cm-status { padding: 2px 8px; border-radius: 999px; font-size: 11px; }
.cm-history-list p { margin: 0; color: #434656; font-size: 12px; }.cm-history-list footer { display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap;padding-top:4px;border-top:1px solid #f2f3ff;color:#737687;font-size:11px; }
.cm-debt-summary { display: grid; gap: 8px; padding: 12px; border: 1px solid #ffdad6; border-radius: 16px; background: #ffdad64d; }.cm-debt-summary small { color: #434656; font-size: 11px; }.cm-debt-summary > strong { color: #ba1a1a; font: 700 22px/28px "Plus Jakarta Sans",Arial,sans-serif; }
.cm-debt-summary > div:not(.cm-progress) { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px; padding-top: 8px; border-top: 1px solid #ffdad666; font-size: 12px; }
.cm-progress { height: 6px; overflow: hidden; border-radius: 999px; background: #eaedff; }.cm-progress i { display: block; height: 100%; border-radius: inherit; background: #ba1a1a; }
.cm-detail-body h5 { margin: 12px 0 0; color: #434656; font-size: 12px; font-weight: 500; }
.cm-history-list header b.cm-red { color: #ba1a1a; }.cm-history-list header b.cm-green { color: #006c49; }
.cm-detail-actions { display: flex; gap: 12px; flex-shrink: 0; padding: 16px 20px; border-top: 1px solid #eaedff; background: #f2f3ff66; }
.cm-detail-actions button,.cm-collect { display: flex; align-items: center; justify-content: center; gap: 6px; flex: 1; min-height: 40px; padding: 10px 8px; border: 1px solid #c3c5d9; border-radius: 12px; background: #fff; color: #131b2e; font: 500 12px/16px Inter,Arial,sans-serif; }
.cm-detail-actions button:last-child,.cm-collect { color: #fff; border-color: #006495; background: #006495; font-weight: 700; }.cm-collect { width: 100%; margin-top: 12px; }
.cm-detail-actions .icon,.cm-detail-actions svg { width: 18px; height: 18px; }
.cm-detail-dialog [hidden] { display: none; }
.cm-collection-field { display: grid; grid-template-columns: minmax(0,1fr); gap: 6px; min-width: 0; margin: 0; color: #434656; font-size: 12px; }
.cm-collection-field input { box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; height: 40px; min-height: 40px; padding: 8px 12px; border: 1px solid #c3c5d94d; border-radius: 12px; background: #f2f3ff; color: #131b2e; font: 400 12px/16px Inter,Arial,sans-serif; }
.cm-collection-field input[type=date] { display: block; min-inline-size: 0; inline-size: 100%; max-inline-size: 100%; appearance: none; -webkit-appearance: none; text-align: left; }
.cm-collection-field input[type=date]::-webkit-date-and-time-value { min-width: 0; text-align: left; }
.cm-signature-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.cm-signature-heading button { padding: 4px 8px; min-height: 28px; border: 1px solid #c3c5d9; border-radius: 8px; background: #fff; font-size: 12px; }
.cm-signature { display: block; width: 100%; height: 170px; border: 1px solid #c3c5d9; border-radius: 12px; background: #fff; touch-action: none; }
body:has(.cm-detail-dialog[open]),html:has(.cm-detail-dialog[open]) { overflow:hidden; }
.cm-collection { display:flex;flex-direction:column;gap:12px;box-sizing:border-box;width:100%;max-width:100%;min-width:0;margin:12px 0 0;padding:12px;border:2px solid #0064954d;border-radius:16px;background:#fff;box-shadow:0 1px 3px #0000000d; }
.cm-collection > header { display:flex;align-items:center;justify-content:space-between;gap:8px; }.cm-collection > header strong { display:flex;align-items:center;gap:8px;font-size:15px;color:#006495; }.cm-collection > header strong > .icon { display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#dce1ff; }.cm-collection > header > span { padding:2px 8px;border-radius:999px;background:#dce1ff80;color:#006495;font-size:11px; }
.cm-collection fieldset { display:grid;grid-template-columns:minmax(0,1fr);gap:10px;min-width:0;margin:0;padding:0;border:0; }.cm-collection-field > span { display:flex;justify-content:space-between;align-items:center;gap:8px; }.cm-collection-field small { font-size:11px;color:#006495;font-weight:600; }
.cm-amount-input { display:flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid #c3c5d9;border-radius:12px;background:#f2f3ff; }.cm-amount-input:focus-within { border-color:#006495;background:#fff; }.cm-amount-input input { border:0;background:transparent;text-align:left;font-size:18px;font-weight:700;color:#006495;padding:0;height:32px;min-height:32px;outline:0; }.cm-amount-input > span { font-size:14px; }
.cm-amount-chips { display:flex;flex-wrap:wrap;gap:6px; }.cm-amount-chips button { min-height:26px;padding:4px 8px;border:0;border-radius:8px;background:#eaedff;color:#131b2e;font:500 11px/16px Inter,Arial,sans-serif; }.cm-amount-chips button:first-child { background:#006495;color:#fff;font-weight:600; }
.cm-payment-methods { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }.cm-payment-methods label { display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;margin:0;padding:8px;border:1px solid #eaedff;border-radius:12px;background:#fff;color:#434656;font-size:12px; }.cm-payment-methods label:has(input:checked) { border:2px solid #006495;background:#dce1ff4d;color:#006495;font-weight:600; }.cm-payment-methods input { position:absolute;opacity:0;width:1px;height:1px; }.cm-payment-methods label:focus-within { outline:2px solid #006495;outline-offset:2px; }
.cm-collection .icon,.cm-collection svg { width:18px;height:18px; }.cm-collection input[name=note] { font-size:12px;text-align:left;font-weight:400; }.cm-collection [data-cmc-after] { display:grid;gap:8px; }.cm-collection [hidden] { display:none; }.cm-collection .cm-collect { margin:0; }.cm-collection button:disabled { opacity:.5; }
.cm-ledger-heading { display:flex;align-items:center;justify-content:space-between;gap:8px; }.cm-ledger-heading small { font-size:11px;font-weight:400; }
.cm-list-summary .cm-currency,.cm-list-metrics .cm-currency { display:inline;margin:0;font:inherit;color:inherit; }
.cm-detail-body .cm-currency { display:inline;margin:0;font:400 12px/16px Inter,Arial,sans-serif;color:#434656; }
.cm-contact .cm-quick-call { display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:#006c491a;color:#006c49; }.cm-contact .cm-quick-call .icon,.cm-contact .cm-quick-call svg { width:14px;height:14px;color:#006c49; }
.cm-contact strong.cm-address-value { display:flex;flex-direction:column;align-items:flex-end;gap:4px; }.cm-address-value small { display:flex;align-items:center;gap:4px;color:#006c49;font:500 11px/14px Inter,Arial,sans-serif; }.cm-address-value small .icon,.cm-address-value small svg { width:14px;height:14px;color:#006c49; }
.cm-history-delivery { color:#006c49;font-weight:500; }.cm-history-delivery.pending { color:#7a4c00; }
@media (max-width:360px) {
  .cm-detail-body { padding-right:12px;padding-left:12px; }
  .cm-tabs { gap:2px; }
  .cm-tabs button { font-size:11px;gap:2px; }
  .cm-tabs .icon,.cm-tabs svg { width:16px;height:16px;flex-basis:16px; }
  body[data-mobile-view="customers"] #customersView { padding-right:10px;padding-left:10px; }
  .cm-list-card { padding:12px;gap:10px; }
  .cm-list-profile { gap:8px; }
  .cm-list-avatar { flex-basis:44px;width:44px;height:44px; }
  .cm-list-identity button { font-size:14px;line-height:20px; }
  .cm-list-identity small { font-size:11px; }
  .cm-list-metrics { max-width:40%; }
  .cm-list-metrics strong { font-size:14px;line-height:20px; }
  .cm-list-contact { flex-basis:32px;width:32px;height:32px;min-height:32px; }
}