/* Filed OPS — Pro UI v3 | 2026-09-23
   A final, reversible presentation layer for the existing PHP SaaS. The older
   design rules stay installed to preserve working functionality and fallbacks.
   No layout rule below modifies access control, forms or payment flows. */

/* 1 — Shared scale: clear typography, consistent density, no decorative AI effects. */
.crm-body {
  --pro-bg:#f5f7fb;
  --pro-surface:#ffffff;
  --pro-title:#182a42;
  --pro-body:#364b63;
  --pro-subtle:#738399;
  --pro-border:#e5ebf2;
  --pro-shadow:0 2px 7px rgba(22,42,74,.022),0 11px 24px rgba(22,42,74,.035);
  background:var(--pro-bg);
  color:var(--pro-body);
}
.crm-body .main {background:var(--pro-bg)!important;min-width:0;}
.crm-body .content {max-width:1580px!important;padding:30px clamp(18px,2.6vw,44px) 70px!important;}
.crm-body .content, .crm-body .content > * {min-width:0;}
.crm-body .content :is(h1,h2,h3){color:var(--pro-title);}
.crm-body :is(.btn,.icon-btn,.tab,.status-filter,.source-filter-chip,.nav a) {transition:background-color .14s,border-color .14s,color .14s,box-shadow .14s;}
.crm-body .btn {border-radius:10px;line-height:1.3;min-height:42px;padding:9px 16px;font-weight:700;box-shadow:none;}
.crm-body .btn-primary {box-shadow:0 2px 5px color-mix(in srgb, var(--brand) 12%, transparent);}
.crm-body .btn:focus-visible,.crm-body .icon-btn:focus-visible,
.crm-body .tab:focus-visible,.crm-body .status-filter:focus-visible {outline:3px solid color-mix(in srgb,var(--brand) 38%,white);outline-offset:2px;}
.crm-body :is(.input,.select,.textarea) {border:1px solid #d9e1eb;background:#fff;border-radius:11px;color:var(--pro-body);min-height:43px;}
.crm-body :is(.input,.select,.textarea):focus {border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 13%, transparent);}
.crm-body :is(.input,.select,.textarea)::placeholder {color:#9ba9ba;}
.crm-body :is(.card,.data-card,.settings-card,.panel,.document-card,.lead-filter-card,
              .integration-card,.billing-mini-card,.subscription-overview-card) {
  border:1px solid var(--pro-border);
  border-radius:15px;
  background:var(--pro-surface);
  box-shadow:var(--pro-shadow);
}
.crm-body :is(.page-head,.modern-page-head,.detail-page-head) {margin-bottom:22px;align-items:center;}
.crm-body :is(.page-head h1,.modern-page-head h1,.form-page-head h2,.detail-page-head h1) {
  color:var(--pro-title);font-size:clamp(25px,2.2vw,30px);font-weight:800;letter-spacing:-.036em;line-height:1.2;margin:5px 0 9px;
}
.crm-body :is(.page-head p,.modern-page-head p,.detail-page-head p) {font-size:13px;max-width:810px;color:var(--pro-subtle);line-height:1.58;margin-top:0;}
.crm-body .eyebrow {font-size:10px;line-height:1.4;letter-spacing:.09em;color:var(--brand-dark);font-weight:800;}
.crm-body .page-actions {align-items:center;gap:9px;}
.crm-body .page-actions .btn {white-space:normal;text-align:center;}
.crm-body :is(.rich-empty-state,.empty-state,.mini-empty,.notif-page-empty) {padding:32px 18px;text-align:center;color:var(--pro-subtle);}
.crm-body .rich-empty-state h3 {font-size:16px;font-weight:780;}
.crm-body :is(.rich-empty-state,.empty-state) p {max-width:410px;margin:8px auto 14px;line-height:1.6;font-size:12.5px;}

/* 2 — Sidebar, search and utility bar; same SVGs and route groups as the server. */
@media(min-width:901px) {
  .crm-body {--sidebarW:228px;}
  .crm-body .sidebar {width:var(--sidebarW)!important;min-width:var(--sidebarW)!important;background:#fff!important;border-right:1px solid var(--pro-border);}
  .crm-body.sidebar-collapsed {--sidebarW:68px;}
}
.crm-body .sidebar {background:#fff!important;border-right:1px solid var(--pro-border);box-shadow:none;}
.crm-body .sidebar-top {border-bottom:1px solid var(--pro-border);padding-left:16px;}
.crm-body .nav {gap:2px;padding:10px 10px 18px;}
.crm-body .nav a,.crm-body .nav-create {border-radius:10px;min-height:40px;font-size:12.5px;font-weight:690;letter-spacing:-.005em;}
.crm-body .nav a {color:#52647b;}
.crm-body .nav a:hover,.crm-body .nav-create:hover {background:#f4f7fb;color:var(--pro-title);}
.crm-body .nav a.active {background:color-mix(in srgb,var(--brand) 9%,white);color:var(--brand-dark);box-shadow:none;border-left:0;font-weight:790;}
.crm-body .nav a.active .nav-icon {color:var(--brand);}
.crm-body .nav .nav-icon svg {height:17px;width:17px;}
.crm-body .ux-nav-label {font-size:9.5px;letter-spacing:.12em;padding:14px 11px 4px;color:#9aa7b8;}
.crm-body .nav-divider {border-color:var(--pro-border);margin:6px 7px;}
.crm-body .topbar {background:rgba(255,255,255,.985)!important;border-color:var(--pro-border);box-shadow:none;}
.crm-body .global-search input {height:41px;border:1px solid #e9edf5!important;border-radius:12px;background:#f5f7fb;color:#415671;padding-inline:39px 36px;}
.crm-body .top-icon {color:#536983;border-radius:10px;}
.crm-body .top-icon:hover {background:#f2f6fd;}
.crm-body .user-menu .avatar {background:#eaf8ef;color:#29914c;}
.crm-body .notif-pop {border:1px solid var(--pro-border);border-radius:16px;box-shadow:0 18px 42px rgba(15,37,67,.14);}
.crm-body .notif-pop :is(.notif-item,.notif-pop-head,.notif-pop-footer){max-width:100%;overflow-wrap:anywhere;}

/* 3 — The approved dashboard concept. Figures always come from the controller. */
.crm-body .overview-shell {max-width:1430px;margin:0 auto;gap:24px;min-width:0;}
.crm-body .overview-hero {align-items:center;gap:20px;padding:4px 2px 0;}
.crm-body .overview-date {font-size:12px;font-weight:650;letter-spacing:0;color:#72849a;margin:0 0 12px;}
.crm-body .overview-hero h1 {font-size:clamp(30px,2.8vw,38px);line-height:1.16;letter-spacing:-.039em;color:#162c48;}
.crm-body .overview-hero h1 .overview-greeting-icon {display:inline-flex;vertical-align:middle;margin-left:8px;color:#e5a141;}
.crm-body .overview-greeting-icon svg {width:23px;height:23px;}
.crm-body .overview-hero p {font-size:13px;color:#8291a3;margin-top:7px;}
.crm-body .overview-date-pill,.crm-body .icon-square {border-radius:10px;min-height:41px;background:#fff;color:#506783;border-color:var(--pro-border);box-shadow:none;}
.crm-body .overview-kpi-grid {gap:12px;}
.crm-body .overview-kpi-card {min-height:184px;padding:16px 16px 15px;gap:12px;border-radius:13px;box-shadow:var(--pro-shadow);}
.crm-body .overview-kpi-card:before {width:3px;border-radius:13px 0 0 13px;}
.crm-body .overview-kpi-head {gap:11px;align-items:center;}
.crm-body .overview-kpi-icon {width:45px;height:45px;min-width:45px;border-radius:12px;}
.crm-body .overview-kpi-icon svg {width:22px;height:22px;}
.crm-body .overview-kpi-title {font-size:12px;color:#536780;font-weight:710;}
.crm-body .overview-kpi-head strong {font-size:29px;line-height:1.2;letter-spacing:-.035em;margin-top:1px;}
.crm-body .overview-inline-badge {font-size:10px;min-height:26px;padding:5px 9px;border-radius:8px;}
.crm-body .overview-kpi-foot {display:grid;grid-template-columns:1fr;gap:6px;margin-top:3px;}
.crm-body .overview-kpi-foot div {display:flex;align-items:center;justify-content:space-between;gap:8px;}
.crm-body .overview-kpi-foot b {font-size:11px;color:#64758a;font-weight:650;}
.crm-body .overview-kpi-foot small {font-size:11px;color:#263f61;font-weight:800;flex:0 0 auto;}
.crm-body .overview-section {padding:18px 18px 19px;border-radius:14px;}
.crm-body .overview-section-head {align-items:center;gap:16px;}
.crm-body .overview-section-head h2 {font-size:16px;letter-spacing:-.024em;}
.crm-body .overview-overline {font-size:10px;margin-bottom:5px;text-transform:uppercase;letter-spacing:.09em;font-weight:820;color:var(--brand-dark);}
.crm-body .overview-section-head p {font-size:11.5px;color:#8392a5;margin-top:5px;}
.crm-body .overview-insight-grid {margin-top:17px;gap:12px;}
.crm-body .overview-insight-card {border-radius:12px;min-height:99px;padding:14px;gap:10px;}
.crm-body .overview-insight-card:hover {border-color:#d6e3f2;background:#fcfdff;}
.crm-body .overview-insight-left {gap:11px;}
.crm-body .overview-insight-left small {font-size:12px;margin-bottom:4px;}
.crm-body .overview-insight-left strong {font-size:18px;}
.crm-body .overview-insight-left p {font-size:11px;margin-top:5px;}
.crm-body .overview-link {font-size:11.5px;color:var(--brand-dark);font-weight:760;}
.crm-body .overview-link svg {width:14px;height:14px;}
.crm-body .overview-spark-group {gap:4px;min-width:70px;flex:0 1 96px;}
.crm-body .overview-spark-group span {width:8px;}
.crm-body .overview-bottom-grid {gap:14px;grid-template-columns:minmax(0,1.48fr) minmax(315px,.96fr);}
.crm-body .overview-panel,.crm-body .overview-performance-card {padding:17px 18px 18px;border-radius:14px;}
.crm-body .overview-panel {min-height:280px;}
.crm-body .overview-summary-strip {margin:0;padding:12px 14px;gap:10px;border-radius:10px;background:#fbfcff;}
.crm-body .overview-summary-strip small {font-size:10px;}
.crm-body .overview-summary-strip strong {font-size:17px;}
.crm-body .overview-table-row {grid-template-columns:55px minmax(0,1fr) auto 23px;min-height:64px;gap:10px;}
.crm-body .overview-time {font-size:12px;letter-spacing:-.012em;}
.crm-body .overview-event {position:relative;padding-left:14px;}
.crm-body .overview-event:before {content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:4px;background:#79c88e;}
.crm-body .overview-event strong {font-size:12px;}
.crm-body .overview-event small {font-size:10.5px;}
.crm-body .overview-dots {display:inline-grid;place-items:center;color:#829bb9;width:23px;height:30px;border-radius:7px;}
.crm-body .overview-dots:hover {background:#f0f5fc;color:var(--brand);}
.crm-body .overview-status .badge {font-size:10px;min-height:25px;}
.crm-body .overview-performance-card {gap:0;}
.crm-body .overview-performance-card .overview-section-head.compact {margin-bottom:10px;}
.crm-body .overview-performance-card .overview-section-head h2 {font-size:14px;}
.crm-body .overview-filter-pill {min-height:31px;font-size:10.5px;border-radius:8px;padding:6px 10px;}
.crm-body .performance-item {border:0;border-bottom:1px solid var(--pro-border);border-radius:0;min-height:85px;padding:12px 1px;gap:10px;}
.crm-body .performance-item:last-child {border-bottom:0;}
.crm-body .performance-icon {width:42px;height:42px;border-radius:13px;}
.crm-body .performance-icon svg {width:20px;height:20px;}
.crm-body .performance-item small {font-size:11px;}
.crm-body .performance-item strong {font-size:20px;}
.crm-body .performance-item p {font-size:10.5px;}
.crm-body .performance-sparkline {min-width:88px;gap:3px;}
.crm-body .performance-sparkline span {width:7px;}
.crm-body .overview-shell-staff .overview-bottom-grid {margin-top:1px;}

/* 4 — Existing views: unified cards, neutral table backgrounds and structured filters. */
.crm-body :is(.list-toolbar,.lead-filter-card,.team-plan-usage,.inventory-filterbar,
              .notification-center-toolbar,.finance-metrics,.finance-panel,.report-grid>.card,
              .integration-card,.app-card,.billing-plan-section,.time-clock-card,.expense-form) {
  border-radius:14px;border-color:var(--pro-border);box-shadow:var(--pro-shadow);
}
.crm-body .list-toolbar {padding:13px 15px;gap:11px;flex-wrap:wrap;}
.crm-body :is(.searchbar,.modern-searchbar) {margin:0;min-width:0;flex:1 1 400px;align-items:center;}
.crm-body :is(.modern-searchbar,.searchbar) .input-with-icon {min-width:180px;}
.crm-body .searchbar .input {max-width:none;min-height:43px;}
.crm-body .searchbar .btn {height:43px;}
.crm-body :is(.status-filters,.lead-source-chips,.notification-status-tabs,.inventory-tabs) {
  display:flex;gap:7px;flex-wrap:wrap;max-width:100%;min-width:0;
}
.crm-body :is(.status-filter,.source-filter-chip) {box-shadow:none;min-height:36px;font-size:11px;padding:7px 11px;border-color:#e3e9f1;}
.crm-body :is(.status-filter,.source-filter-chip).active {box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 19%, transparent);}
.crm-body .data-card {min-width:0;overflow:hidden;border-radius:14px;}
.crm-body .data-card>.table-wrap {max-width:100%;}
.crm-body .modern-table thead th {position:static;background:#f8fafe;border-color:var(--pro-border);padding:13px 15px;font-size:10px;letter-spacing:.06em;}
.crm-body .modern-table tbody td {padding:13px 15px;color:#45586c;font-size:12px;line-height:1.55;}
.crm-body .modern-table tbody tr:hover td {background:#fbfcff;}
.crm-body .entity-avatar {background:#edf5fa;border-radius:11px;color:#38698d;}
.crm-body .entity-cell strong {color:#273e56;font-size:12px;}
.crm-body .entity-cell small {font-size:10.5px;}
.crm-body .source-chip {white-space:normal;overflow-wrap:anywhere;}
.crm-body .icon-btn {border-color:#e2eaf2;box-shadow:none;}
.crm-body .modern-table td.row-actions {white-space:nowrap;text-align:right;}
@media(min-width:901px) {
  /* Keep genuine table semantics. A flex <td> creates overlap/misalignment. */
  .crm-body .modern-table td.row-actions {display:table-cell!important;vertical-align:middle!important;}
  .crm-body .modern-table td.row-actions :is(form,.icon-btn) {display:inline-flex!important;vertical-align:middle;}
  .crm-body .modern-table td.row-actions .icon-btn {margin:0 0 0 4px;width:36px;min-width:36px;height:36px;}
}
.crm-body .lead-summary-grid {grid-template-columns:repeat(5,minmax(0,1fr));}
.crm-body .lead-summary-card {padding:14px;border-radius:13px;min-height:90px;}
.crm-body .lead-summary-card strong {font-size:25px;}
.crm-body .lead-summary-card small {font-size:11px;}
.crm-body .lead-filter-card {display:grid;gap:12px;padding:14px 16px;margin-bottom:17px;}
.crm-body .lead-filter-form {display:flex;gap:9px;align-items:center;flex-wrap:wrap;}
.crm-body .lead-filter-form>.input-with-icon {flex:2 1 310px;min-width:160px;}
.crm-body .lead-filter-form>.select {flex:1 1 150px;width:auto;max-width:250px;min-width:130px;}
.crm-body .lead-filter-form>.btn {flex:0 0 auto;}
.crm-body .lead-source-chips {gap:7px;}
.crm-body .team-plan-usage {background:#fff;border:1px solid var(--pro-border);padding:16px 18px;}
.crm-body .team-usage-bar {height:7px;border-radius:30px;background:#ecf0f5;overflow:hidden;}
.crm-body .team-usage-bar span {border-radius:30px;}

/* 5 — Creation/edit pages, billing and integrations. */
.crm-body :is(.entity-form,.inventory-import-form,.integration-modal-form) {gap:15px;}
.crm-body .entity-form.card {padding:18px;}
.crm-body .form-section {border-radius:13px;background:#fcfdff;padding:17px;border-color:#ebeff5;}
.crm-body .form-section-head {gap:12px;}
.crm-body .form-section-head h3 {font-size:15px;color:var(--pro-title);}
.crm-body .form-section-head p {font-size:11px;line-height:1.5;}
.crm-body .form-group {gap:6px;}
.crm-body .form-group label {font-size:11.5px;color:#576a80;}
.crm-body .form-page-actions {padding-top:7px;}
.crm-body .document-card,.crm-body .detail-grid>.card {border-radius:14px;}
.crm-body .detail-kv dt {font-size:11px;}
.crm-body .detail-kv dd {font-size:12px;}
.crm-body .document-summary {gap:9px;}
.crm-body .document-summary>div {border-radius:11px;background:#fbfcff;}
.crm-body .document-total {font-size:25px;}
.crm-body .tabs {gap:4px;overflow-x:auto;scrollbar-width:thin;}
.crm-body .tab {white-space:nowrap;min-height:42px;}
.crm-body :is(.subscription-overview-card,.billing-mini-card,.subscription-plan-card,.apps-grid .app-card,.marketing-source-card) {border-radius:14px;box-shadow:var(--pro-shadow);}
.crm-body .app-card :is(.app-config-link,.btn) {min-height:39px;}
.crm-body .integration-head h3 {font-size:15px;}
.crm-body .integration-card .muted {line-height:1.6;}
.crm-body .integration-modal-form :is(input,select,textarea) {max-width:100%;}
.crm-body :is(.finance-metric,.inventory-kpis .stat,.insights-grid .stat) {border-radius:13px;box-shadow:var(--pro-shadow);}
.crm-body .pipeline-col {border:1px solid var(--pro-border);border-radius:14px;background:#fff;}
.crm-body .pipeline-col-head {border-bottom:1px solid var(--pro-border);}
.crm-body .pipeline-card {border:1px solid #e8eef5;border-radius:11px;box-shadow:0 3px 8px rgba(15,35,64,.035);}
.crm-body .notification-center-card {border-radius:15px;}
.crm-body .notif-pop {max-width:calc(100vw - 22px);}
.crm-body .modal-panel {border-radius:16px;max-width:min(850px,calc(100vw - 22px));}
.crm-body .modal-panel :is(.input,.select,.textarea) {font-size:13px;}

/* 6 — Schedule: fully readable day/week/list on a phone, no clipping. */
.crm-body .schedule-toolbar {gap:13px;}
.crm-body .schedule-title {gap:10px;}
.crm-body .schedule-heading h1 {color:var(--pro-title);font-size:clamp(21px,2.4vw,30px);}
.crm-body .schedule-page :is(.schedule-list-view,.week-calendar,.month-calendar,.schedule-google-state) {border-radius:14px;border-color:var(--pro-border);box-shadow:var(--pro-shadow);}
.crm-body .schedule-list-item {border-bottom-color:var(--pro-border);gap:12px;}
.crm-body .schedule-list-copy strong {font-size:13px;color:#2d435d;}
.crm-body .schedule-list-copy :is(span,small) {font-size:11px;color:#7c8da0;}
.crm-body .schedule-event {border-radius:8px;min-width:0;overflow:hidden;}
.crm-body .schedule-event-top {min-width:0;}
.crm-body .schedule-event-top strong {white-space:normal;overflow-wrap:anywhere;}
.crm-body .schedule-filters {background:#fff;border:1px solid var(--pro-border);padding:10px 11px;border-radius:12px;}

/* 7 — Master and auth: matching visual foundation; no flow overrides. */
.master-body .master-main {background:var(--pro-bg,#f5f7fb);}
.master-body .master-card,.master-body .master-kpi {border:1px solid #e5ebf2;border-radius:14px;box-shadow:0 7px 19px rgba(17,42,74,.038);}
.master-body .master-sidebar {background:#fff;}
.master-body .master-content-shell {max-width:1520px;}
.master-body .master-page-head h1,.master-body .master-page-head-clean h1 {letter-spacing:-.035em;color:#182a42;}
.login-shell,.master-login-body {background:linear-gradient(155deg,#f8fbff,#f1f5fa);}
.login-card {border-color:#e5ebf2;border-radius:17px;box-shadow:0 20px 45px rgba(22,42,74,.075);}
.login-card h1 {letter-spacing:-.03em;}
.onboarding-body :is(.input,.select,.textarea) {border-radius:10px;}

/* 8 — Mobile/PWA: readable cards, labels and actions on their own line. */
@media(max-width:1300px) {
  .crm-body .lead-summary-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
  .crm-body .overview-kpi-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  .crm-body .overview-bottom-grid {grid-template-columns:minmax(0,1fr);}
}
@media(max-width:900px) {
  .crm-body .content {padding:20px 16px calc(92px + env(safe-area-inset-bottom))!important;}
  .crm-body .overview-hero {align-items:flex-start;}
  .crm-body .overview-kpi-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  .crm-body .overview-insight-grid {grid-template-columns:1fr;}
  .crm-body .lead-summary-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
  .crm-body .lead-filter-form>.select {max-width:none;flex:1 1 42%;}
  .crm-body .lead-source-chips {flex-wrap:wrap!important;overflow:visible!important;}
  .crm-body .page-head,.crm-body .modern-page-head {align-items:stretch;}
  .crm-body .status-filters {flex-wrap:wrap!important;overflow:visible!important;}
  .crm-body .schedule-page .schedule-toolbar {max-width:100%;min-width:0;}
  .crm-body .schedule-page .schedule-list-copy {min-width:0;overflow-wrap:anywhere;}
  .crm-body .schedule-page .week-calendar.single-day {min-width:0;max-width:100%;width:100%;}
  .crm-body .schedule-page .single-day .week-head,
  .crm-body .schedule-page .single-day .week-grid {grid-template-columns:56px minmax(0,1fr)!important;min-width:0!important;}
  .crm-body .notif-pop {
    position:fixed!important;left:10px!important;right:10px!important;top:var(--notif-offset,76px)!important;
    max-height:calc(100dvh - var(--notif-offset,76px) - 18px)!important;
    overflow:auto!important;width:auto!important;max-width:none!important;overscroll-behavior:contain;
  }
  .crm-body .modal-panel {max-height:calc(100dvh - 18px)!important;overflow:hidden!important;}
  .crm-body .modal-body {min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
  .crm-body .data-card:has(.mobile-card-table) {border:0!important;box-shadow:none!important;background:transparent!important;}
  .crm-body .table-wrap:has(> table.mobile-card-table) {overflow:visible!important;}
  .crm-body .mobile-card-table tbody {padding:0!important;gap:11px!important;}
  .crm-body .mobile-card-table tbody tr {border:1px solid var(--pro-border)!important;border-radius:13px!important;box-shadow:var(--pro-shadow)!important;padding:6px 13px!important;overflow:visible!important;background:#fff;}
  .crm-body .mobile-card-table tbody td {
    display:grid!important;grid-template-columns:minmax(80px,29%) minmax(0,1fr)!important;
    gap:7px 12px!important;padding:9px 0!important;border-bottom:1px solid #edf1f5!important;
    background:none!important;min-height:35px;word-break:normal!important;
  }
  .crm-body .mobile-card-table tbody td:first-child:has(.entity-cell) {
    display:block!important;padding:11px 0 13px!important;
  }
  .crm-body .mobile-card-table tbody td:first-child:has(.entity-cell):before {display:none!important;}
  .crm-body .mobile-card-table tbody td:first-child .entity-cell {padding:0;width:100%;}
  .crm-body .mobile-card-table tbody td.row-actions {
    display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-end!important;
    gap:8px!important;padding:11px 0 7px!important;margin:0!important;border-top:0!important;border-bottom:0!important;
  }
  .crm-body .mobile-card-table tbody td.row-actions:before {display:none!important;}
  .crm-body .mobile-card-table tbody td.row-actions .icon-btn {width:42px!important;min-width:42px!important;height:42px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;margin:0!important;position:static!important;}
  .crm-body .mobile-card-table tbody td.row-actions .inline-form {display:inline-flex!important;flex:0 0 auto!important;margin:0!important;}
  .crm-body .mobile-card-table tbody td.no-mobile-label:before {display:none!important;}
  .crm-body .mobile-card-table tbody td.no-mobile-label {display:block!important;}
  .crm-body .form-section {padding:14px;}
}
@media(max-width:600px) {
  .crm-body .content {padding:16px 12px calc(94px + env(safe-area-inset-bottom))!important;}
  .crm-body .overview-shell {gap:16px;}
  .crm-body .overview-hero h1 {font-size:27px;}
  .crm-body .overview-hero p {font-size:12px;}
  .crm-body .overview-kpi-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .crm-body .overview-kpi-card {min-height:160px;padding:12px 12px 13px;gap:9px;}
  .crm-body .overview-kpi-head {align-items:start;gap:8px;}
  .crm-body .overview-kpi-icon {width:32px;height:32px;min-width:32px;border-radius:9px;}
  .crm-body .overview-kpi-icon svg {width:17px;height:17px;}
  .crm-body .overview-kpi-title {font-size:11px;}
  .crm-body .overview-kpi-head strong {font-size:25px;}
  .crm-body .overview-kpi-foot {gap:5px;}
  .crm-body .overview-kpi-foot b {font-size:10px;max-width:88px;line-height:1.3;}
  .crm-body .overview-kpi-foot small {font-size:10px;}
  .crm-body .overview-inline-badge {position:absolute;top:43px;right:10px;padding:3px 5px;font-size:9px;min-height:20px;}
  .crm-body .overview-section,.crm-body .overview-panel,.crm-body .overview-performance-card {padding:14px;border-radius:13px;}
  .crm-body .overview-hero-actions {justify-content:flex-start;}
  .crm-body .overview-insight-card {padding:12px;}
  .crm-body .overview-spark-group {display:none;}
  .crm-body .overview-table-row {grid-template-columns:43px minmax(0,1fr) 20px!important;gap:6px 9px;}
  .crm-body .overview-time {font-size:11px;}
  .crm-body .overview-status {grid-column:2;justify-self:start;}
  .crm-body .overview-dots {grid-column:3;grid-row:1 / span 2;align-self:center;display:inline-grid;}
  .crm-body .overview-summary-strip {grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px;padding:10px;}
  .crm-body .lead-summary-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
  .crm-body .lead-summary-card {gap:8px;padding:11px;min-height:77px;}
  .crm-body .lead-summary-card span:first-child {width:31px;height:31px;border-radius:9px;}
  .crm-body .lead-summary-card strong {font-size:22px;}
  .crm-body .lead-summary-card small {font-size:10px;}
  .crm-body .lead-filter-form {display:grid;grid-template-columns:1fr!important;gap:9px;}
  .crm-body .lead-filter-form>*,.crm-body .lead-filter-form>.select {width:100%;max-width:100%;min-width:0;}
  .crm-body .mobile-card-table tbody td {grid-template-columns:minmax(70px,28%) minmax(0,1fr)!important;gap:6px 8px!important;}
  .crm-body .mobile-card-table tbody td:before {font-size:9px!important;}
  .crm-body .mobile-card-table tbody td.row-actions {justify-content:flex-end!important;}
  .crm-body .performance-sparkline {display:none;}
  .crm-body .kv,.crm-body .detail-kv {grid-template-columns:minmax(100px,34%) minmax(0,1fr)!important;}
}
@media(max-width:375px) {
  .crm-body .overview-kpi-foot div {align-items:flex-start;}
  .crm-body .overview-kpi-foot b {max-width:75px;}
  .crm-body .overview-kpi-card {min-height:176px;}
  .crm-body .mobile-card-table tbody td:not(:first-child):not(.row-actions) {grid-template-columns:1fr!important;gap:3px!important;}
  .crm-body .overview-insight-left .overview-kpi-icon {display:none;}
}
@media(prefers-reduced-motion:reduce) {
  .crm-body .overview-kpi-card,.crm-body .overview-insight-card,.crm-body .btn {transition:none!important;transform:none!important;}
}

/* 9 — Inbox and customer-facing document portals follow the same restrained style. */
.crm-body .inbox-overview-card,
.crm-body .inbox-filter-card,
.crm-body .inbox.inbox-v0816 {border:1px solid var(--pro-border);border-radius:14px;box-shadow:var(--pro-shadow);}
.crm-body .inbox-list-head,
.crm-body .thread-head {background:#fff;border-bottom:1px solid var(--pro-border);}
.crm-body .conv {border-bottom-color:#edf1f6;}
.crm-body .conv:hover {background:#f8fbff;}
.crm-body .conv.active {background:color-mix(in srgb,var(--brand) 8%, white);border-left-color:var(--brand);}
.crm-body .conv-name,.crm-body .thread-person strong {color:var(--pro-title);font-weight:780;}
.crm-body .messages {background:#f8fafe;}
.crm-body .message.inbound {border-color:#e4ebf4;background:#fff;}
.crm-body .composer {border-top-color:var(--pro-border);background:#fff;}
.portal-shell {background:#f5f7fb;}
.portal-card {border:1px solid #e5ebf2;border-radius:17px;box-shadow:0 16px 36px rgba(15,35,68,.06);}
.portal-card :is(h1,h2,h3) {color:#182a42;letter-spacing:-.02em;}
@media(max-width:760px) {
  .crm-body .inbox.inbox-v0816 {border-radius:12px;max-width:100%;}
  .crm-body .inbox-list-head {min-width:0;}
  .crm-body .thread-head {gap:9px;flex-wrap:wrap;}
  .crm-body .thread-head-actions {min-width:0;flex-wrap:wrap;}
  .portal-shell {padding:14px 10px;}
  .portal-card {border-radius:13px;}
}

/* Filed OPS v0.8.65 UX rev4: settings tabs, billing actions, softer focus & sidebar. */
.crm-body :is(.input,.select,.textarea,.customer-picker-input,input:not([type="checkbox"]):not([type="radio"]),select,textarea):is(:focus,:focus-visible),
.master-body :is(.input,.select,.textarea,input:not([type="checkbox"]):not([type="radio"]),select,textarea):is(:focus,:focus-visible) {
  outline: none !important;
  outline-offset: 0 !important;
  border-color: color-mix(in srgb, var(--brand,#276cea) 38%, #dce3ec) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand,#276cea) 9%, transparent) !important;
}
.crm-body :is(.btn,.icon-btn,.tab,.status-filter,.settings-tab,.nav a):focus-visible,
.master-body :is(.btn,.icon-btn,.tab):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand,#276cea) 36%, #fff) !important;
  outline-offset: 2px !important;
}
.crm-body .sidebar {background:#fff !important;}
.crm-body .sidebar-top {border-bottom:1px solid #eff2f7;padding:12px 15px;margin-bottom:8px;}
.crm-body .nav {gap:4px;padding:6px 8px 14px;scrollbar-width:thin;scrollbar-color:#d2dce9 transparent;}
.crm-body .nav a {min-height:43px;padding:10px 12px;gap:11px;font-size:12.5px;letter-spacing:0;}
.crm-body .nav a.active {background:color-mix(in srgb,var(--brand) 8%,#fff);border:1px solid color-mix(in srgb,var(--brand) 10%,#fff);box-shadow:none;}
.crm-body .nav a.active::before {content:none !important;}
.crm-body .nav a:hover {background:#f5f8fe;}
.crm-body .ux-nav-label {padding:14px 12px 5px;letter-spacing:.1em;color:#97a5b8;font-size:9px;}
.crm-body .nav-divider {border-color:#e8edf4;margin:8px 7px 4px;}
.crm-body .sidebar-collapse-control {
  width:34px;height:34px;
  border-radius:11px;
  border:1px solid #e0e8f2;
  background:#fff;
  box-shadow:0 5px 16px rgba(20,44,76,.09);
  color:#536e8e;
  transition:color .16s ease,background .16s ease;
}
.crm-body .sidebar-collapse-control:hover {color:var(--brand-dark);background:#f4f7fe;}
.crm-body .sidebar-collapse-control .icon-svg {width:17px;height:17px;}
.crm-body .sidebar-expand-icon {display:none !important;}
@media (min-width:901px) {
  .crm-body .sidebar-collapse-control {left:calc(var(--sidebarW) - 17px) !important;}
  .crm-body.sidebar-collapsed .sidebar-collapse-control {left:calc(var(--sidebarW) - 17px) !important;}
}

.crm-body .settings-tabs-page-head {
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  margin:4px 0 21px;
}
.crm-body .settings-tabs-page-head h1 {font-size:clamp(25px,2.4vw,34px);letter-spacing:-.04em;color:#172b45;margin:5px 0 7px;}
.crm-body .settings-tabs-page-head p {font-size:13px;color:#75859a;line-height:1.55;margin:0;}
.crm-body .settings-tabs-page-head .btn {white-space:nowrap;}
.crm-body .settings-tabs-nav {
  display:flex;gap:7px;align-items:center;overflow-x:auto;overscroll-behavior-x:contain;
  scrollbar-width:thin;scrollbar-color:#dce4f0 transparent;
  padding:5px 4px 12px;margin-bottom:17px;border-bottom:1px solid #e6ecf3;
}
.crm-body .settings-tab {
  display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:8px;
  min-height:43px;padding:10px 15px;border-radius:10px;
  background:#fff;border:1px solid #e7edf4;color:#61748b;
  font-size:12px;font-weight:760;white-space:nowrap;
}
.crm-body .settings-tab:hover {background:#f7f9ff;color:#284d82;}
.crm-body .settings-tab.active {color:var(--brand-dark);background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 20%,white);}
.crm-body .settings-tab svg {width:16px;height:16px;flex:0 0 auto;}
.crm-body .settings-tabs-ready > .settings-tab-panel[hidden] {display:none !important;}
.crm-body .settings-tab-panel {min-width:0;display:grid;align-content:start;gap:15px;}
.crm-body .settings-tab-panel > .card {margin-top:0 !important;}
.crm-body .settings-tab-panel .settings-preference-card,
.crm-body .settings-tab-panel .settings-branding-card,
.crm-body .settings-tab-panel .settings-team-cost,
.crm-body .settings-tab-panel .settings-communications-card,
.crm-body .settings-tab-panel .settings-payments-card {box-shadow:var(--pro-shadow);border-radius:15px;}
.crm-body .settings-tab-panel .settings-grid {margin:0;}
.crm-body .settings-section-intro,
.crm-body .settings-tab-panel-header {display:block;margin:0 0 2px;}
.crm-body .settings-section-intro h1,
.crm-body .settings-tab-panel-header h2 {font-size:19px;letter-spacing:-.025em;color:#1d3550;margin:2px 0 5px;}
.crm-body .settings-section-intro p,
.crm-body .settings-tab-panel-header p {margin:0;font-size:12px;color:#7d8da0;line-height:1.5;}
.crm-body .settings-integrations-shortcut {
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;
  padding:13px 16px;border:1px solid #e3eaf4;border-radius:13px;background:#f7faff;
  color:#566e8c;font-size:12px;font-weight:680;
}
.crm-body .settings-integrations-shortcut span {display:inline-flex;align-items:center;gap:8px;}

.crm-body .billing-page-head {margin-bottom:18px;}
.crm-body .billing-page-actions {align-items:center;gap:9px;}
.crm-body .billing-page-actions .btn {white-space:nowrap;}
.crm-body .subscription-overview-card {border-color:#e3eaf4;box-shadow:var(--pro-shadow);}
.crm-body .subscription-overview-main {padding-bottom:18px;}
.crm-body .subscription-plan-copy h2 {letter-spacing:-.032em;}
.crm-body #billing-plans {scroll-margin-top:calc(var(--crm-topbar-h,65px) + var(--crm-banner-h,0px) + 18px);}
.crm-body .billing-plan-section {
  border:1px solid #e3eaf4;border-radius:16px;background:#fff;
  padding:22px;box-shadow:var(--pro-shadow);
}
.crm-body .billing-plan-section>.section-title-row {margin-bottom:14px;}
.crm-body .billing-plan-helper {
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;
  padding:11px 14px;margin:6px 0 18px;
  border:1px solid #e6edf6;border-radius:11px;background:#f8faff;
  color:#647791;font-size:11.5px;
}
.crm-body .billing-plan-helper span {display:inline-flex;align-items:center;gap:8px;}
.crm-body .billing-plan-helper strong {color:#8a4f20;}
.crm-body .subscription-plan-card {
  min-width:0;border:1px solid #e4eaf2;background:#fff;border-radius:13px;
  box-shadow:0 6px 20px rgba(19,40,67,.04);padding:19px;
}
.crm-body .subscription-plan-card.is-current {border-color:color-mix(in srgb,var(--brand) 28%,white);box-shadow:0 6px 20px rgba(19,40,67,.045);}
.crm-body .subscription-plan-form {border-top:1px solid #eef2f7;padding-top:15px;}
.crm-body .subscription-plan-form .btn {min-height:46px;white-space:normal;}
.crm-body .billing-plan-unavailable {margin-top:auto;padding:11px 12px;display:flex;align-items:flex-start;gap:7px;background:#fff9ee;border-radius:10px;font-size:11px;line-height:1.5;color:#9c6322;}
.crm-body .billing-courtesy-banner {border-color:#d6e8fa;background:#f6faff;}
.crm-body .subscription-overview-card .subscription-primary-action {border-top:1px solid #eef2f7;margin-top:0;}
@media(max-width:900px){
  .crm-body .settings-tabs-page-head {flex-direction:column;align-items:stretch;}
  .crm-body .settings-tabs-page-head .btn {align-self:flex-start;}
  .crm-body .billing-page-actions {width:100%;justify-content:flex-start;}
  .crm-body .billing-page-actions>* {max-width:100%;}
}
@media(max-width:650px){
  .crm-body .settings-tabs-nav {margin-inline:-2px;}
  .crm-body .settings-tab {padding:10px 12px;}
  .crm-body .billing-plan-section {padding:15px;}
  .crm-body .billing-page-actions {flex-direction:column;align-items:stretch;}
  .crm-body .billing-page-actions :is(.btn,form) {width:100%;}
}
/* Keep the same bars icon visible in the collapsed state as well. */
.crm-body.sidebar-collapsed .sidebar-collapse-control .sidebar-collapse-icon,
body.sidebar-collapsed .sidebar-collapse-control .sidebar-collapse-icon {display:inline-flex !important;}
.crm-body .billing-price-clarification {display:block;margin-top:6px;color:#73869c;font-size:11px;line-height:1.4;}
.crm-body .billing-cycle-price-note {display:block;margin:0 0 4px;color:#7990a7;font-size:11px;line-height:1.4;}
.crm-body .subscription-plan-form button:disabled {background:#f0f4f8;border-color:#e1e8f0;color:#8998a7;box-shadow:none;cursor:not-allowed;}