/**
 * Culltron BusinessCore app shell — phone-first.
 * Palette: dark ink sidebar, light paper workspace, accent reserved for
 * primary actions & active nav (always white text ON accent — never accent
 * text on dark). --cbc-accent is injected inline from Settings (white-label).
 */

:root {
	--cbc-accent: #6c5ce7;
	--cbc-accent-text: #5b21b6;
	--cbc-accent-ink: #ffffff;
	--cbc-ink: #10131a;        /* sidebar / bare screens */
	--cbc-ink-2: #181c26;
	--cbc-ink-line: #262b38;
	--cbc-bg: #f4f3ef;         /* workspace */
	--cbc-panel: #faf9f6;
	--cbc-card: #ffffff;
	--cbc-line: #e6e4dd;
	--cbc-text: #1c2126;
	--cbc-dim: #6b7280;
	--cbc-good: #1a7f37;
	--cbc-warn: #a05f0a;
	--cbc-bad: #b3261e;
	--cbc-radius: 14px;
	--cbc-shadow: 0 1px 2px rgba(16,19,26,.06), 0 4px 14px rgba(16,19,26,.05);
}

/* Books cockpit */
.cbc-books-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;background:linear-gradient(135deg,var(--cbc-card),color-mix(in srgb,var(--cbc-accent) 10%,var(--cbc-card)))}
.cbc-books-hero h2{margin:.25rem 0}.cbc-eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--cbc-accent-text)}
.cbc-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.cbc-kpi{padding:18px;border:1px solid var(--cbc-border);border-radius:var(--cbc-radius);background:var(--cbc-card)}
.cbc-kpi span,.cbc-kpi small{display:block;color:var(--cbc-muted)}.cbc-kpi strong{display:block;font-size:1.45rem;margin:.35rem 0}.cbc-books-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:14px}
.cbc-books-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--cbc-border);color:inherit;text-decoration:none}.cbc-books-row:last-child{border-bottom:0}.cbc-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.cbc-quick{display:flex;justify-content:space-between;padding:12px;border:1px solid var(--cbc-border);border-radius:10px;color:inherit;text-decoration:none}.cbc-quick:hover{border-color:var(--cbc-accent)}
@media(max-width:850px){.cbc-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cbc-books-grid{grid-template-columns:1fr}}@media(max-width:520px){.cbc-kpi-grid,.cbc-quick-grid{grid-template-columns:1fr}.cbc-books-hero{display:block}}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
.screen-reader-text {
	position: absolute !important; width: 1px !important; height: 1px !important;
	padding: 0 !important; margin: -1px !important; overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
}
body.cbc-body {
	margin: 0;
	background: var(--cbc-bg);
	color: var(--cbc-text);
	font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, sans-serif;
}
body.cbc-body a { color: inherit; text-decoration: none; }
img { max-width: 100%; }

/* ------------------------------------------------------------------ layout */
.cbc-layout { display: flex; min-height: 100vh; }
.cbc-sidebar {
	width: 250px; flex: 0 0 250px;
	background: var(--cbc-ink);
	color: #e8eaf0;
	display: flex; flex-direction: column;
	position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.cbc-sidebar-backdrop { display: none; }
.cbc-sidebar-brand { display: flex; gap: 10px; align-items: center; padding: 18px 16px 12px; border-bottom: 1px solid var(--cbc-ink-line); }
.cbc-sidebar-brand strong { display: block; font-size: 16px; color: #fff; }
.cbc-sidebar-brand small { color: #98a0b3; font-size: 11px; }
.cbc-logo-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--cbc-accent); flex: 0 0 14px; }
.cbc-nav { flex: 1; padding: 6px 10px 20px; }
.cbc-nav-group { margin-top: 14px; }
.cbc-nav-group-label { display: block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #7d8598; padding: 0 8px 6px; }
.cbc-nav-link { display: block; padding: 10px 12px; border-radius: 10px; color: #d4d8e2; font-size: 14px; font-weight: 500; }
.cbc-nav-link:hover { background: var(--cbc-ink-2); color: #fff; }
.cbc-nav-link.is-active { background: var(--cbc-accent); color: var(--cbc-accent-ink); font-weight: 700; }
.cbc-sidebar-foot { border-top: 1px solid var(--cbc-ink-line); padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
.cbc-sidebar-foot a { color: #b6bcc9; }
.cbc-user { color: #98a0b3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; }

.cbc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cbc-topbar {
	display: flex; align-items: center; gap: 12px;
	padding: 12px 18px; border-bottom: 1px solid var(--cbc-line);
	background: rgba(244, 243, 239, .9); backdrop-filter: blur(8px);
	position: sticky; top: 0; z-index: 40;
}
.cbc-burger { display: none; background: #fff; border: 1px solid var(--cbc-line); border-radius: 10px; color: var(--cbc-text); font-size: 20px; cursor: pointer; padding: 4px 10px; }
.cbc-topbar-title { font-weight: 700; font-size: 15px; }
.cbc-topbar-spacer { flex: 1; }
.cbc-topbar-link { font-size: 13px; color: var(--cbc-dim); font-weight: 600; }
.cbc-work { padding: 18px; max-width: 1500px; width: 100%; margin: 0 auto; }

/* Tables remain usable on phones without making the complete app canvas wider
   than the viewport. The table itself keeps its readable column widths and the
   wrapper becomes the deliberate horizontal scroll boundary. */
.cbc-table-wrap { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cbc-table { width: 100%; border-collapse: collapse; }

/* ------------------------------------------------------------------ cards */
.cbc-card {
	background: var(--cbc-card); border: 1px solid var(--cbc-line);
	border-radius: var(--cbc-radius); padding: 16px; margin-bottom: 14px;
	box-shadow: var(--cbc-shadow);
}
.cbc-card h2, .cbc-card h3 { margin: 0 0 8px; }
.cbc-card-sub { color: var(--cbc-dim); font-size: 13px; }
.cbc-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.cbc-stat { text-align: left; }
.cbc-stat .cbc-stat-label { color: var(--cbc-dim); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.cbc-stat .cbc-stat-value { font-size: 24px; font-weight: 800; margin-top: 2px; color: var(--cbc-text); }
.cbc-stat.good .cbc-stat-value { color: var(--cbc-good); }
.cbc-stat.bad .cbc-stat-value { color: var(--cbc-bad); }
.cbc-stat.warn .cbc-stat-value { color: var(--cbc-warn); }

.cbc-row-card {
	display: flex; justify-content: space-between; gap: 12px; align-items: center;
	background: var(--cbc-card); border: 1px solid var(--cbc-line);
	border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; cursor: pointer;
	box-shadow: var(--cbc-shadow);
}
.cbc-row-card:hover { border-color: var(--cbc-accent); }
.cbc-row-main { min-width: 0; }
.cbc-row-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cbc-row-sub { color: var(--cbc-dim); font-size: 12.5px; margin-top: 2px; }
.cbc-row-end { text-align: right; flex: 0 0 auto; }
.cbc-row-amount { font-weight: 700; }

/* ------------------------------------------------------------------ badges */
.cbc-badge {
	display: inline-block; padding: 3px 9px; border-radius: 999px;
	font-size: 11px; font-weight: 700; letter-spacing: .02em;
	background: #edece6; color: #5a6068; text-transform: uppercase;
}
.cbc-badge.paid, .cbc-badge.confirmed, .cbc-badge.accepted, .cbc-badge.approved, .cbc-badge.done, .cbc-badge.active, .cbc-badge.finalized, .cbc-badge.returned, .cbc-badge.matched { background: #ddf2e3; color: #14682d; }
.cbc-badge.overdue, .cbc-badge.declined, .cbc-badge.rejected, .cbc-badge.cancelled, .cbc-badge.reversed, .cbc-badge.emergency { background: #fadfdd; color: #96231c; }
.cbc-badge.needs_review, .cbc-badge.pending, .cbc-badge.partial, .cbc-badge.suggested, .cbc-badge.urgent, .cbc-badge.doing, .cbc-badge.out { background: #fbeccd; color: #8a520a; }
.cbc-badge.sent, .cbc-badge.unpaid, .cbc-badge.todo, .cbc-badge.open, .cbc-badge.enquiry { background: #dde8fb; color: #1d4f96; }
.cbc-badge.draft { background: #edece6; color: #5a6068; }

/* ------------------------------------------------------------------ forms */
.cbc-field { margin-bottom: 12px; }
.cbc-field label { display: block; font-size: 12.5px; font-weight: 600; color: #3d434c; margin-bottom: 4px; }
.cbc-inline-field { display: grid; gap: 4px; min-width: 150px; color: #3d434c; font-size: 12px; font-weight: 700; }
.cbc-inline-field .cbc-input, .cbc-inline-field .cbc-select { min-width: 150px; }
.cbc-input, .cbc-select, .cbc-textarea {
	width: 100%; background: #fff;
	border: 1px solid #d8d6cd; border-radius: 10px;
	color: var(--cbc-text); padding: 11px 12px; font-size: 15px;
}
.cbc-input:focus, .cbc-select:focus, .cbc-textarea:focus { outline: 3px solid var(--cbc-accent); outline-offset: 1px; border-color: var(--cbc-accent); box-shadow: 0 0 0 5px rgba(16,19,26,.08); }
.cbc-textarea { min-height: 84px; resize: vertical; }
.cbc-check { display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 4px 0; font-size: 14px; margin-bottom: 10px; cursor: pointer; }
.cbc-form-grid { display: grid; gap: 0 14px; grid-template-columns: 1fr 1fr; }
.cbc-form-grid .full { grid-column: 1 / -1; }

.cbc-btn {
	display: inline-block; border: 0; cursor: pointer; text-align: center;
	background: var(--cbc-accent); color: var(--cbc-accent-ink); font-weight: 700; font-size: 14.5px;
	padding: 12px 18px; border-radius: 12px;
}
.cbc-btn:hover { filter: brightness(.94); }
.cbc-btn.ghost { background: #fff; border: 1px solid #d8d6cd; color: var(--cbc-text); font-weight: 600; }
.cbc-btn.ghost:hover { filter: none; background: var(--cbc-panel); border-color: #c6c4ba; }
.cbc-btn.danger { background: var(--cbc-bad); }
.cbc-btn.good { background: var(--cbc-good); }
.cbc-btn.small { padding: 8px 12px; font-size: 13px; border-radius: 10px; }
.cbc-btn.block { display: block; width: 100%; }
.cbc-btn[disabled] { opacity: .5; cursor: not-allowed; }
.cbc-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.cbc-btn:focus-visible, .cbc-burger:focus-visible, .cbc-fab:focus-visible,
.cbc-nav-link:focus-visible, .cbc-topbar-link:focus-visible, .cbc-logout:focus-visible,
.cbc-row-card:focus-visible, .cbc-fab-menu a:focus-visible, .cbc-fab-menu button:focus-visible,
.cbc-shell input:focus-visible, .cbc-shell select:focus-visible, .cbc-shell textarea:focus-visible,
.cbc-login-card input:focus-visible, .cbc-login-card select:focus-visible, .cbc-login-card textarea:focus-visible {
	outline: 3px solid var(--cbc-accent); outline-offset: 3px;
}
.cbc-sidebar .cbc-nav-link:focus-visible, .cbc-sidebar .cbc-logout:focus-visible { outline-color: #fff; }

/* ------------------------------------------------------------------ modal */
.cbc-modal-back {
	position: fixed; inset: 0; background: rgba(16, 19, 26, .55); z-index: 90;
	display: flex; align-items: flex-end; justify-content: center; padding: 0;
}
.cbc-modal {
	background: #fff; border: 1px solid var(--cbc-line);
	border-radius: 18px 18px 0 0; width: 100%; max-width: 680px;
	max-height: 92vh; overflow-y: auto; padding: 18px;
	box-shadow: 0 -10px 40px rgba(16,19,26,.25);
}
.cbc-modal h3 { margin-top: 0; }
@media (min-width: 720px) {
	.cbc-modal-back { align-items: center; padding: 24px; }
	.cbc-modal { border-radius: 18px; box-shadow: 0 20px 60px rgba(16,19,26,.3); }
}

/* ------------------------------------------------------------------ lines editor */
.cbc-lines { margin: 10px 0; }
.cbc-line-row {
	display: grid; grid-template-columns: minmax(180px,1fr) 64px 82px 92px 92px 30px;
	gap: 8px; align-items: center; margin-bottom: 8px;
}
.cbc-line-row .cbc-input { padding: 9px 10px; font-size: 14px; }
.cbc-line-del { background: none; border: 0; color: var(--cbc-bad); font-size: 18px; cursor: pointer; }
.cbc-totals { text-align: right; margin-top: 10px; font-size: 14px; color: var(--cbc-dim); }
.cbc-totals strong { color: var(--cbc-text); font-size: 17px; }

/* ------------------------------------------------------------------ kanban */
.cbc-kanban { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(230px, 1fr)); overflow-x: auto; }
.cbc-kcol { background: var(--cbc-panel); border: 1px solid var(--cbc-line); border-radius: var(--cbc-radius); padding: 10px; min-height: 160px; }
.cbc-kcol h4 { margin: 4px 6px 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--cbc-dim); }
.cbc-kcard { background: #fff; border: 1px solid var(--cbc-line); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; box-shadow: var(--cbc-shadow); }
.cbc-kcard .cbc-row-sub { margin-top: 4px; }
.cbc-kmove { display: flex; gap: 6px; margin-top: 8px; }
.cbc-kmove button { flex: 1; font-size: 12px; padding: 6px; border-radius: 8px; border: 1px solid #d8d6cd; background: #fff; color: var(--cbc-dim); cursor: pointer; }
.cbc-kmove button:hover { border-color: var(--cbc-accent); color: var(--cbc-text); }

/* ------------------------------------------------------------------ bank recon cards */
.cbc-bank-card { border-left: 4px solid var(--cbc-line); }
.cbc-bank-card.credit { border-left-color: var(--cbc-good); }
.cbc-bank-card.debit { border-left-color: var(--cbc-bad); }
.cbc-suggest { background: var(--cbc-panel); border: 1px dashed var(--cbc-accent); border-radius: 10px; padding: 10px 12px; margin-top: 10px; font-size: 13.5px; }

/* chips (OCR suggestions) */
.cbc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cbc-chip { background: var(--cbc-panel); border: 1px solid var(--cbc-accent); color: var(--cbc-text); border-radius: 999px; font-size: 12px; padding: 4px 10px; font-weight: 600; }

/* ------------------------------------------------------------------ alerts */
.cbc-alert { border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; font-size: 14px; }
.cbc-alert.warn { background: #fbeccd; border: 1px solid #eed9a5; color: #7a4a08; }
.cbc-alert.bad { background: #fadfdd; border: 1px solid #efc0bc; color: #8a201a; }
.cbc-alert.good { background: #ddf2e3; border: 1px solid #b9e2c5; color: #135c28; }
.cbc-empty { text-align: center; color: var(--cbc-dim); padding: 34px 12px; }
.cbc-empty .big { font-size: 34px; display: block; margin-bottom: 8px; }

/* ------------------------------------------------------------------ FAB */
.cbc-fab-wrap { position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 80; }
.cbc-fab {
	width: 58px; height: 58px; border-radius: 50%; border: 0; cursor: pointer;
	background: var(--cbc-accent); color: var(--cbc-accent-ink); font-size: 30px; font-weight: 700;
	box-shadow: 0 8px 24px rgba(16, 19, 26, .3);
}
.cbc-fab-menu { position: absolute; right: 0; bottom: 68px; background: #fff; border: 1px solid var(--cbc-line); border-radius: 14px; padding: 8px; width: 210px; box-shadow: 0 12px 34px rgba(16,19,26,.22); }
.cbc-fab-menu a, .cbc-fab-menu button { display: block; width: 100%; text-align: left; background: none; border: 0; color: var(--cbc-text); font-size: 14px; padding: 10px 12px; border-radius: 10px; cursor: pointer; }
.cbc-fab-menu a:hover, .cbc-fab-menu button:hover { background: var(--cbc-panel); }

/* Settings workspace: section navigation replaces an exhausting single
   column while keeping every field available on small screens. */
.cbc-settings-nav { position: sticky; top: 0; z-index: 20; display: flex; gap: 8px; overflow-x: auto; padding: 10px; margin-bottom: 14px; background: rgba(255,255,255,.96); border: 1px solid var(--cbc-line); border-radius: 14px; backdrop-filter: blur(10px); }
.cbc-settings-nav button { flex: 0 0 auto; border: 1px solid var(--cbc-line); border-radius: 999px; padding: 9px 14px; background: #fff; color: var(--cbc-text); font-weight: 700; cursor: pointer; }
.cbc-settings-nav button.active { background: var(--cbc-accent); border-color: var(--cbc-accent); color: var(--cbc-accent-ink); }
.cbc-settings-panel[hidden] { display: none !important; }
.cbc-setup-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 12px; }
.cbc-setup-step { padding: 12px; border: 1px solid var(--cbc-line); border-radius: 12px; background: var(--cbc-panel); }
.cbc-setup-step strong { display: block; margin-bottom: 4px; }
.cbc-setup-step.good { border-color: var(--cbc-good); }
.cbc-quota-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 10px; width: 100%; }
.cbc-quota { padding: 12px; border: 1px solid var(--cbc-line); border-radius: 12px; background: var(--cbc-panel); }
.cbc-quota-head { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 8px; }
.cbc-quota-track { height: 9px; overflow: hidden; border-radius: 999px; background: #d9dee7; }
.cbc-quota-fill { display: block; height: 100%; border-radius: inherit; background: var(--cbc-accent); }
.cbc-quota-meta { margin-top: 7px; font-size: 12px; color: var(--cbc-dim); }
@media (max-width: 860px) { .cbc-setup-grid { grid-template-columns: 1fr; } .cbc-settings-nav { top: 54px; } }

/* ------------------------------------------------------------------ bare screens (login / portal denied) stay dark & premium */
body.cbc-bare { background: var(--cbc-ink); color: #eef1f4; }
.cbc-bare-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; }
.cbc-login-card { width: 100%; max-width: 420px; background: var(--cbc-ink-2); border: 1px solid var(--cbc-ink-line); border-radius: 18px; padding: 26px; box-shadow: 0 24px 70px rgba(0,0,0,.45); }
.cbc-login-card .cbc-card-sub { color: #9aa2b5; }
.cbc-login-card .cbc-field label { color: #b6bcc9; }
.cbc-login-card .cbc-input { background: var(--cbc-ink); border-color: var(--cbc-ink-line); color: #eef1f4; }
.cbc-login-card .cbc-input:focus { border-color: var(--cbc-accent); box-shadow: none; }
.cbc-login-card .cbc-btn.ghost { background: transparent; border-color: var(--cbc-ink-line); color: #d4d8e2; }
.cbc-login-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.cbc-demo-logins { margin-top: 16px; border-top: 1px dashed var(--cbc-ink-line); padding-top: 14px; }
.cbc-demo-logins button { margin: 0 6px 6px 0; }
body.cbc-bare .cbc-alert.bad { background: rgba(179,38,30,.16); border-color: rgba(179,38,30,.5); color: #f3a9a4; }

/* ------------------------------------------------------------------ mobile */
@media (max-width: 860px) {
	.cbc-sidebar { position: fixed; z-index: 100; left: 0; transform: translateX(-110%); visibility: hidden; transition: transform .22s ease, visibility 0s linear .22s; height: 100vh; }
	.cbc-sidebar.open { transform: translateX(0); visibility: visible; transition-delay: 0s; box-shadow: 0 18px 60px rgba(16,19,26,.45); }
	.cbc-sidebar-backdrop { position: fixed; z-index: 99; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; background: rgba(16, 19, 26, .55); cursor: pointer; }
	.cbc-sidebar-backdrop:not([hidden]) { display: block; }
	body.cbc-nav-open { overflow: hidden; }
	.cbc-burger { display: block; }
	.cbc-work { padding: 14px 12px 90px; }
	.cbc-form-grid { grid-template-columns: 1fr; }
	.cbc-line-row { grid-template-columns: minmax(150px,1fr) 52px 66px 78px 78px 26px; overflow-x:auto; }
	.cbc-kanban { grid-template-columns: repeat(3, 78vw); }
}

@media (max-width: 720px) {
	.cbc-topbar { flex-wrap: wrap; }
	.cbc-burger { order: 1; }
	.cbc-topbar-title { order: 2; min-width: 0; max-width: calc(100vw - 158px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	.cbc-topbar-spacer { order: 3; }
	.cbc-topbar-link { order: 4; flex: 0 0 auto; }
	.cbc-gsearch { order: 5; flex: 1 0 100%; width: 100%; min-width: 0; margin: 4px 0 0; }
}

/* ------------------------------------------------ premium mail workspace */
.cbc-eyebrow { display:block; margin-bottom:5px; color:var(--cbc-accent-text); font-size:10px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.cbc-mail-head, .cbc-calendar-head, .cbc-support-hero { display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap; }
.cbc-mail-head h2, .cbc-calendar-head h2, .cbc-support-hero h2 { margin:0 0 4px; }
.cbc-mail-head .cbc-actions, .cbc-calendar-head .cbc-actions { margin:0; }
.cbc-mail-accountbar { display:grid; grid-template-columns:minmax(240px,420px) 1fr auto; gap:14px; align-items:end; padding:12px 14px; }
.cbc-mail-accountbar .cbc-field { margin:0; }
.cbc-mail-quota-summary { display:flex; flex-direction:column; min-width:0; padding-bottom:5px; }
.cbc-mail-quota-summary strong { overflow:hidden; text-overflow:ellipsis; }
.cbc-mail-quota-summary span { color:var(--cbc-dim); font-size:12px; }
.cbc-mail-safety { margin-bottom:10px; font-size:12.5px; }
.cbc-mail-workspace { display:grid; grid-template-columns:210px minmax(300px,360px) minmax(360px,1fr); min-height:650px; height:calc(100vh - 275px); max-height:820px; background:var(--cbc-card); border:1px solid var(--cbc-line); border-radius:16px; box-shadow:var(--cbc-shadow); overflow:hidden; margin-bottom:14px; }
.cbc-mail-folders, .cbc-mail-listpane, .cbc-mail-reader { min-width:0; min-height:0; }
.cbc-mail-folders { display:flex; flex-direction:column; background:var(--cbc-panel); border-right:1px solid var(--cbc-line); overflow-y:auto; }
.cbc-mail-pane-title, .cbc-mail-list-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px; border-bottom:1px solid var(--cbc-line); }
.cbc-mail-pane-title span, .cbc-mail-list-head span { color:var(--cbc-dim); font-size:11px; }
.cbc-mail-folder { width:100%; display:grid; grid-template-columns:22px 1fr auto; gap:7px; align-items:center; padding:10px 12px; border:0; background:transparent; color:var(--cbc-text); text-align:left; cursor:pointer; }
.cbc-mail-folder:hover { background:rgba(108,92,231,.08); }
.cbc-mail-folder.is-active { background:var(--cbc-accent); color:var(--cbc-accent-ink); font-weight:800; }
.cbc-mail-folder-icon { text-align:center; opacity:.8; font-size:17px; }
.cbc-mail-folder b { min-width:22px; padding:1px 6px; border-radius:99px; background:#fff; color:var(--cbc-accent-text); font-size:11px; text-align:center; }
.cbc-mail-folder small { opacity:.55; }
.cbc-mail-folder-note { margin:auto 10px 10px; padding:10px; border:1px dashed var(--cbc-line); border-radius:10px; color:var(--cbc-dim); font-size:11px; line-height:1.4; }
.cbc-mail-listpane { display:grid; grid-template-rows:auto auto 1fr auto; border-right:1px solid var(--cbc-line); overflow:hidden; }
.cbc-mail-search { display:grid; grid-template-columns:1fr auto; gap:7px; padding:10px; background:var(--cbc-panel); border-bottom:1px solid var(--cbc-line); }
.cbc-mail-search .cbc-input { padding:8px 10px; font-size:13px; }
.cbc-mail-list { overflow-y:auto; }
.cbc-mail-message { width:100%; display:block; padding:13px 14px; border:0; border-bottom:1px solid var(--cbc-line); background:#fff; color:var(--cbc-text); text-align:left; cursor:pointer; }
.cbc-mail-message:hover, .cbc-mail-message.is-active { background:#f3f1ff; }
.cbc-mail-message.is-active { box-shadow:inset 3px 0 var(--cbc-accent); }
.cbc-mail-message.is-unread { background:#fbfaff; }
.cbc-mail-message.is-unread strong, .cbc-mail-message.is-unread .cbc-mail-subject { font-weight:800; }
.cbc-mail-message-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.cbc-mail-message-top strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:650; }
.cbc-mail-message-top time { flex:0 0 auto; color:var(--cbc-dim); font-size:10.5px; }
.cbc-mail-subject, .cbc-mail-snippet { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbc-mail-subject { margin-top:3px; font-size:13px; }
.cbc-mail-snippet { margin-top:2px; color:var(--cbc-dim); font-size:11.5px; }
.cbc-mail-pager { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 10px; background:var(--cbc-panel); border-top:1px solid var(--cbc-line); font-size:11px; color:var(--cbc-dim); }
.cbc-mail-reader { overflow-y:auto; background:#fff; padding:22px; }
.cbc-mail-empty-reader { display:flex; min-height:100%; align-items:center; justify-content:center; flex-direction:column; color:var(--cbc-dim); text-align:center; }
.cbc-mail-empty-reader > span { font-size:38px; opacity:.35; }
.cbc-mail-empty-reader h3 { margin:6px 0 0; color:var(--cbc-text); }
.cbc-mail-empty-reader p { max-width:320px; font-size:13px; }
.cbc-mail-reader-head { padding-bottom:16px; border-bottom:1px solid var(--cbc-line); }
.cbc-mail-reader-head h3 { margin:0 0 8px; font-size:21px; line-height:1.25; overflow-wrap:anywhere; }
.cbc-mail-reader-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1px 12px; color:var(--cbc-dim); font-size:12px; }
.cbc-mail-reader-meta strong, .cbc-mail-reader-meta span { overflow-wrap:anywhere; }
.cbc-mail-reader-meta time { grid-column:2; grid-row:1 / span 2; }
.cbc-mail-body { margin:18px 0; padding:0; border:0; background:transparent; color:var(--cbc-text); font:14px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; white-space:pre-wrap; overflow-wrap:anywhere; }
.cbc-mail-attachments { margin:14px 0; padding:12px; border:1px solid var(--cbc-line); border-radius:12px; background:var(--cbc-panel); }
.cbc-mail-attachments h4 { margin:0 0 8px; }
.cbc-mail-attachment { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:9px 0; border-top:1px solid var(--cbc-line); }
.cbc-mail-attachment:first-of-type { border-top:0; }
.cbc-mail-attachment span { min-width:0; overflow-wrap:anywhere; }
.cbc-mail-attachment strong, .cbc-mail-attachment small { display:block; }
.cbc-mail-attachment small { color:var(--cbc-dim); font-size:10.5px; }
.cbc-mail-attachment.risk-high { border-left:3px solid var(--cbc-bad); padding-left:9px; }
.cbc-mail-attachment.risk-medium { border-left:3px solid var(--cbc-warn); padding-left:9px; }
.cbc-mail-loading, .cbc-mail-error { padding:20px 14px; color:var(--cbc-dim); font-size:13px; }
.cbc-mail-error { color:var(--cbc-bad); }
.cbc-mail-back { display:none; margin:0 0 12px; padding:0; border:0; background:none; color:var(--cbc-accent); font-weight:800; cursor:pointer; }
.cbc-mail-quotas summary, .cbc-kb-article summary, .cbc-tutorial summary { cursor:pointer; font-weight:800; }
.cbc-mail-quotas .cbc-quota-grid { margin-top:14px; }
.cbc-mail-compose-note { margin:-2px 0 14px; padding:9px 11px; border-radius:10px; background:var(--cbc-panel); color:var(--cbc-dim); font-size:12px; }
.cbc-mail-cc-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.cbc-mail-compose-body { min-height:210px; }

/* -------------------------------------------- calendar and support centre */
.cbc-calendar-tools { display:flex; align-items:center; gap:9px 16px; flex-wrap:wrap; padding:11px 14px; }
.cbc-calendar-view-switch { display:flex; gap:6px; margin-right:auto; }
.cbc-calendar-view-switch .is-active { border-color:var(--cbc-accent); background:var(--cbc-accent); color:var(--cbc-accent-ink); }
.cbc-calendar-filter { display:flex; min-height:44px; align-items:center; gap:7px; padding:0 3px; font-size:12px; cursor:pointer; }
.cbc-calendar-filter input[type="checkbox"] { width:24px; height:24px; min-width:24px; min-height:24px; margin:0; flex:0 0 24px; accent-color:var(--cbc-accent); }
.cbc-calendar-nav { display:flex; align-items:center; justify-content:center; gap:8px; padding:9px 12px; }
.cbc-calendar-month-wrap { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
.cbc-calendar-month-wrap[hidden], .cbc-calendar-agenda[hidden] { display:none !important; }
.cbc-cal-dot { width:9px; height:9px; flex:0 0 9px; display:inline-block; border-radius:50%; background:#64748b; }
.cbc-cal-dot.manual, .cbc-calendar-event.manual { background:#ede9fe; color:#5b21b6; }
.cbc-cal-dot.task, .cbc-calendar-event.task { background:#eef2ff; color:#3730a3; }
.cbc-cal-dot.project, .cbc-calendar-event.project { background:#e0f2fe; color:#075985; }
.cbc-cal-dot.project_due, .cbc-calendar-event.project_due { background:#ffedd5; color:#9a3412; }
.cbc-cal-dot.leave, .cbc-calendar-event.leave { background:#f3e8ff; color:#6b21a8; }
.cbc-cal-dot.hire, .cbc-calendar-event.hire { background:#dcfce7; color:#166534; }
.cbc-cal-dot.invoice, .cbc-calendar-event.invoice { background:#fee2e2; color:#991b1b; }
.cbc-cal-dot.quote, .cbc-calendar-event.quote { background:#fef3c7; color:#92400e; }
.cbc-cal-dot.lead, .cbc-calendar-event.lead { background:#ccfbf1; color:#115e59; }
.cbc-calendar-filter .cbc-cal-dot { background:currentColor; }
.cbc-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border:1px solid var(--cbc-line); border-radius:14px; overflow:hidden; background:var(--cbc-card); box-shadow:var(--cbc-shadow); margin-bottom:14px; }
.cbc-calendar-weekday { padding:8px; background:var(--cbc-ink); color:#dce0e9; font-size:10px; font-weight:800; letter-spacing:.08em; text-align:center; text-transform:uppercase; }
.cbc-calendar-day { min-height:132px; padding:8px; border-right:1px solid var(--cbc-line); border-top:1px solid var(--cbc-line); background:#fff; overflow:hidden; }
.cbc-calendar-day:nth-child(7n) { border-right:0; }
.cbc-calendar-day.is-out { background:var(--cbc-panel); }
.cbc-calendar-day.is-today { box-shadow:inset 0 0 0 2px var(--cbc-accent); }
.cbc-calendar-date { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; font-size:12px; font-weight:800; }
.cbc-calendar-date span { color:var(--cbc-accent-text); font-size:9px; text-transform:uppercase; }
.cbc-calendar-event { display:block; min-height:32px; margin:3px 0; padding:4px 6px; border-radius:7px; font-size:10.5px; line-height:1.25; }
.cbc-calendar-event-button { width:100%; border:0; font:inherit; text-align:left; cursor:pointer; }
.cbc-calendar-event-button:hover, .cbc-calendar-event-button:focus-visible { outline:2px solid var(--cbc-accent); outline-offset:1px; }
.cbc-calendar-event span, .cbc-calendar-event small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbc-calendar-event small { opacity:.72; font-size:9px; }
.cbc-calendar-agenda h3 { display:flex; align-items:center; gap:8px; }
.cbc-agenda-date { margin:18px 0 7px; color:var(--cbc-dim); font-size:11px; letter-spacing:.07em; text-transform:uppercase; }
.cbc-agenda-row { display:grid; width:100%; min-height:44px; grid-template-columns:12px 1fr auto; gap:10px; align-items:center; padding:10px 5px; border:0; border-top:1px solid var(--cbc-line); background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.cbc-agenda-row:hover, .cbc-agenda-row:focus-visible { background:var(--cbc-panel); }
.cbc-agenda-row span:nth-child(2) { min-width:0; }
.cbc-agenda-row strong, .cbc-agenda-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbc-agenda-row small { color:var(--cbc-dim); font-size:11px; }
.cbc-agenda-row b { color:var(--cbc-accent-text); font-size:11px; }
.cbc-calendar-all-day { display:flex; min-height:44px; align-items:center; gap:9px; cursor:pointer; }
.cbc-calendar-all-day input[type="checkbox"] { width:24px; height:24px; min-width:24px; min-height:24px; margin:0; accent-color:var(--cbc-accent); }
.cbc-calendar-description { white-space:pre-wrap; overflow-wrap:anywhere; }
.cbc-support-hero .cbc-card-sub { max-width:720px; }
.cbc-support-search { display:grid; grid-template-columns:auto minmax(240px,600px) auto; align-items:center; gap:12px; }
.cbc-support-search .cbc-input { padding:9px 12px; }
.cbc-tutorial-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; }
.cbc-tutorial { margin:0; }
.cbc-tutorial-meta { display:flex; justify-content:space-between; gap:8px; align-items:center; color:var(--cbc-dim); font-size:11px; }
.cbc-tutorial h3 { margin-top:10px; }
.cbc-tutorial details { border-top:1px solid var(--cbc-line); padding-top:11px; }
.cbc-tutorial details[open] summary { color:var(--cbc-accent-text); }
.cbc-tutorial ol { padding-left:22px; }
.cbc-tutorial li { margin:8px 0; }
.cbc-tutorial-check { display:grid; gap:3px; margin:12px 0; padding:10px; border-left:3px solid var(--cbc-good); background:#f2fbf4; font-size:12px; }
.cbc-tutorial-lock { margin-top:10px; padding:9px 11px; border:1px dashed var(--cbc-line); border-radius:10px; background:var(--cbc-panel); color:var(--cbc-dim); font-size:11.5px; }
.cbc-kb-cats { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; }
.cbc-kb-cats .cbc-chip { cursor:pointer; }
.cbc-kb-cats .cbc-chip.is-active { background:var(--cbc-accent); color:var(--cbc-accent-ink); }
.cbc-kb-article { padding:0; overflow:hidden; }
.cbc-kb-article summary { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 17px; list-style:none; }
.cbc-kb-article summary::-webkit-details-marker { display:none; }
.cbc-kb-article summary span, .cbc-kb-article summary small, .cbc-kb-article summary strong, .cbc-kb-article summary em { display:block; }
.cbc-kb-article summary small { margin-bottom:3px; color:var(--cbc-accent-text); font-size:9px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.cbc-kb-article summary strong { font-size:16px; }
.cbc-kb-article summary em { margin-top:3px; color:var(--cbc-dim); font-size:12px; font-style:normal; font-weight:400; }
.cbc-kb-article summary > b { font-size:22px; }
.cbc-kb-article[open] summary > b { transform:rotate(45deg); }
.cbc-kb-body { padding:2px 17px 17px; border-top:1px solid var(--cbc-line); }
.cbc-kb-body p { max-width:900px; }
.cbc-kb-link { color:var(--cbc-accent-text) !important; font-size:12px; font-weight:800; }

/* Dashboard visual hierarchy. Keep owner data scannable without mixing hard
   coded colours into a white-label theme. */
.cbc-dashboard-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin:0 0 16px;padding:24px 26px;border:1px solid var(--cbc-line);border-radius:18px;background:radial-gradient(circle at 86% 10%,color-mix(in srgb,var(--cbc-accent) 18%,transparent),transparent 42%),linear-gradient(135deg,var(--cbc-card),color-mix(in srgb,var(--cbc-accent) 9%,var(--cbc-card)));box-shadow:var(--cbc-shadow);overflow:hidden}
.cbc-dashboard-intro-copy{min-width:0}.cbc-dashboard-kicker{display:block;margin-bottom:6px;color:var(--cbc-accent-text);font-size:10px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.cbc-dashboard-intro h1{max-width:720px;margin:0;color:var(--cbc-text);font-size:clamp(24px,3vw,38px);line-height:1.08;letter-spacing:-.025em}.cbc-dashboard-intro p{max-width:650px;margin:9px 0 0;color:var(--cbc-dim);font-size:14px}.cbc-dashboard-intro-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;flex:0 0 auto}.cbc-dashboard-intro-actions .cbc-btn{white-space:nowrap}.cbc-dashboard-intro-actions .cbc-btn span{margin-left:4px}
.cbc-triage-card{margin-bottom:14px;border-left:4px solid var(--cbc-accent);background:linear-gradient(135deg,var(--cbc-card),color-mix(in srgb,var(--cbc-accent) 5%,var(--cbc-card)))}.cbc-triage-card h3{margin:0 0 8px}.cbc-triage-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid color-mix(in srgb,var(--cbc-line) 72%,transparent);flex-wrap:wrap}.cbc-triage-copy{flex:1 1 220px;min-width:0;overflow-wrap:anywhere}.cbc-btn-whatsapp{background:#128c7e!important;color:#fff!important}.cbc-btn-whatsapp:hover{background:#0b6b60!important;filter:none!important}.cbc-pinned-task{display:flex;align-items:center;gap:10px}.cbc-pinned-task a{margin-left:auto;white-space:nowrap}
.cbc-dashboard-stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:4px}.cbc-dashboard-stat{position:relative;overflow:hidden;border-top:3px solid var(--cbc-accent);transition:transform .16s ease,box-shadow .16s ease}.cbc-dashboard-stat::after{position:absolute;right:-30px;bottom:-38px;width:110px;height:110px;border-radius:50%;background:color-mix(in srgb,var(--cbc-accent) 13%,transparent);content:"";pointer-events:none}.cbc-dashboard-stat.good{border-top-color:var(--cbc-good)}.cbc-dashboard-stat.good::after{background:color-mix(in srgb,var(--cbc-good) 12%,transparent)}.cbc-dashboard-stat.bad{border-top-color:var(--cbc-bad)}.cbc-dashboard-stat.bad::after{background:color-mix(in srgb,var(--cbc-bad) 11%,transparent)}.cbc-dashboard-stat.warn{border-top-color:var(--cbc-warn)}.cbc-dashboard-stat.warn::after{background:color-mix(in srgb,var(--cbc-warn) 12%,transparent)}.cbc-dashboard-stat:hover,.cbc-dashboard-queue:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(16,19,26,.1)}.cbc-overdue-note{color:var(--cbc-bad)}.cbc-dashboard-queues{margin-top:4px}.cbc-dashboard-queue{display:block;color:inherit}.cbc-dashboard-queue h3{display:flex;align-items:center;gap:7px}.cbc-dashboard-queue h3 .cbc-badge{margin-left:auto}.cbc-dashboard-queue .cbc-card-sub{display:block}
@media (max-width:980px){.cbc-dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.cbc-dashboard-intro{align-items:flex-start;flex-direction:column}.cbc-dashboard-intro-actions{justify-content:flex-start}}
@media (max-width:520px){.cbc-dashboard-stats{grid-template-columns:1fr}.cbc-dashboard-intro{padding:20px}.cbc-dashboard-intro-actions,.cbc-dashboard-intro-actions .cbc-btn{width:100%}.cbc-dashboard-intro-actions .cbc-btn{display:block}.cbc-pinned-task{align-items:flex-start;flex-direction:column}.cbc-pinned-task a{margin-left:0}}

@media (max-width: 1120px) {
	.cbc-mail-workspace { grid-template-columns:180px 300px minmax(320px,1fr); }
}
@media (max-width: 860px) {
	.cbc-mail-workspace { height:calc(100vh - 260px); grid-template-columns:180px 300px minmax(320px,1fr); overflow-x:auto; }
	.cbc-support-search { grid-template-columns:1fr; }
}
@media (max-width: 720px) {
	.cbc-mail-accountbar { grid-template-columns:1fr auto; }
	.cbc-mail-quota-summary { grid-column:1/-1; grid-row:2; }
	.cbc-mail-workspace { display:block; height:auto; min-height:520px; max-height:none; overflow:visible; }
	.cbc-mail-folders { max-height:none; border:0; border-bottom:1px solid var(--cbc-line); overflow:hidden; }
	.cbc-mail-pane-title { padding:10px 12px; }
	#cbc-mail-folders { display:flex; overflow-x:auto; padding:7px; gap:5px; }
	.cbc-mail-folder { flex:0 0 auto; width:auto; grid-template-columns:18px auto auto; border:1px solid var(--cbc-line); border-radius:999px; padding:7px 10px; }
	.cbc-mail-folder-note { display:none; }
	.cbc-mail-listpane { min-height:510px; border:0; }
	.cbc-mail-reader { display:none; min-height:510px; padding:15px; }
	.cbc-mail-workspace.is-reading .cbc-mail-folders, .cbc-mail-workspace.is-reading .cbc-mail-listpane { display:none; }
	.cbc-mail-workspace.is-reading .cbc-mail-reader { display:block; }
	.cbc-mail-back { display:block; }
	.cbc-mail-reader-meta { grid-template-columns:1fr; }
	.cbc-mail-reader-meta time { grid-column:1; grid-row:auto; }
	.cbc-mail-cc-grid { grid-template-columns:1fr; gap:0; }
	.cbc-calendar-tools { align-items:flex-start; }
	.cbc-calendar-view-switch { flex:1 0 100%; }
	.cbc-calendar-view-switch .cbc-btn { flex:1; justify-content:center; }
	.cbc-calendar-nav { justify-content:space-between; }
	.cbc-calendar-month-wrap:not([hidden]) { display:block; margin:0 -2px 14px; padding-bottom:4px; }
	.cbc-calendar-grid { min-width:760px; margin-bottom:0; }
	.cbc-calendar-event { min-height:44px; padding:7px; }
	.cbc-calendar-agenda { margin-top:0; }
	.cbc-tutorial-grid { grid-template-columns:1fr; }
	.cbc-support-hero .cbc-btn { width:100%; }
	.cbc-invoice-card, .cbc-payment-card { align-items:stretch; flex-direction:column; }
	.cbc-invoice-card .cbc-row-end, .cbc-payment-card .cbc-row-end { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; text-align:left; }
	.cbc-invoice-card .cbc-row-end { flex-wrap:wrap; }
	.cbc-invoice-card .cbc-row-end .cbc-row-amount { flex:1 0 100%; font-size:17px; }
	.cbc-invoice-card .cbc-row-end .cbc-row-sub { margin:0 auto 0 0; }
}

/* ------------------------------------------------------------------ print */
@media print {
	.cbc-sidebar, .cbc-topbar, .cbc-fab-wrap, .cbc-actions, .cbc-btn { display: none !important; }
	body.cbc-body { background: #fff; color: #111; }
	.cbc-card, .cbc-row-card { background: #fff; border-color: #ccc; break-inside: avoid; box-shadow: none; }
	.cbc-work { max-width: none; padding: 0; }
}
