/* focus-workspace-preview.css, the rules scoped to the crm page: loads with the first visit of that page (data-rattib-style="crm" in index.html) and sits right after the shell part in the cascade. Source order is the parent sheet's. */
/* Clients: existing queue/table and body-mounted profile; no controller changes. */
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm {
  --tool-accent: var(--preview-accent); --tool-surface: var(--preview-row); --tool-line: var(--preview-line);
  font-family: var(--preview-ui); color: var(--preview-ink); min-inline-size: 0;
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-head {
  display: grid; grid-template-columns: minmax(0,1fr); align-items: start; gap: 18px;
  margin: 6px 0 22px; padding: 0; border: 0; background: none; box-shadow: none;
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-board-title,.crm-board-actions) { max-inline-size: none; inline-size: 100%; min-inline-size: 0; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-head::before,
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-head::after,
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-title::after { display: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm h1 { margin: 0; font: 400 clamp(34px,3.6vw,48px)/1.2 var(--preview-display); letter-spacing: -.04em; color: var(--preview-ink); }
html[lang="ar"][data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm h1 { font-size: 32px; letter-spacing: 0; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-studio-lead { margin: 10px 0 0; max-inline-size: 68ch; color: var(--preview-muted); font: 400 13px/1.7 var(--preview-ui); }
html[data-theme="light"][data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-studio-lead,.follow-bucket-title) { color: var(--preview-ink); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-pipeline {
  display: block; max-inline-size: none; padding: 12px 16px; margin: 18px 0 0; border: 1px solid var(--preview-line); border-radius: 16px;
  background: var(--preview-surface); color: var(--preview-muted); font-size: 13px; line-height: 1.7; box-shadow: none;
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .pipeline-jump { display: inline-flex; margin-inline-start: 8px; padding: 9px 12px; min-block-size: 44px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-actions {
  display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: thin; scroll-padding-inline: 4px; scroll-behavior: auto;
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-actions button { flex: 0 0 auto; white-space: nowrap; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(button,summary) {
  min-block-size: 44px; border: 1px solid var(--preview-line); border-radius: 12px; padding: 10px 13px;
  background: var(--preview-field); background-image: none; color: var(--preview-ink); box-shadow: none; font: 500 13px/1.5 var(--preview-ui);
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(#add-client,#crm-empty-add):not(:disabled) { background: var(--preview-action); color: var(--preview-action-ink); border-color: transparent; font-weight: 600; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-view,.crm-filters,.crm-tag-filters) { display: flex; flex-wrap: wrap; gap: 7px; margin-block: 10px; border: 0; padding: 0; background: transparent; box-shadow: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-view { display: inline-flex; vertical-align: top; inline-size: fit-content; padding: 4px; border: 1px solid var(--preview-line); border-radius: 16px; background: var(--preview-surface); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-filter-disclosure { display: inline-block; vertical-align: top; margin: 10px 0; margin-inline-start: 8px; padding: 4px 0; max-inline-size: 100%; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-filter-disclosure > summary { inline-size: fit-content; background: var(--preview-surface); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-filter-disclosure[open] { display: block; margin-inline-start: 0; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .chip { background: var(--preview-soft); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.chip.active,.chip[aria-pressed="true"]) { background: var(--preview-surface); border-color: var(--preview-accent); color: var(--preview-ink); box-shadow: inset 0 0 0 1px var(--preview-line); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .chip-count { background: transparent; color: var(--preview-muted); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(input,textarea,.localized-control-input) { min-block-size: 44px; border: 1px solid var(--preview-control-line); border-radius: 12px; padding: 10px 12px; color: var(--preview-ink); background: var(--preview-field); box-shadow: none; font: 400 14px/1.5 var(--preview-ui); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-search { margin: 16px 0 24px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm #crm-search { background: var(--preview-surface); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-queue { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-bucket { min-inline-size: 0; margin: 0; padding: 0; background: none; border: 0; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-bucket-title { inline-size: fit-content; margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--preview-line); border-radius: 10px; background: var(--preview-dialog-surface); font: 500 13px/1.5 var(--preview-ui); color: var(--preview-ink); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-card-list { display: grid; grid-template-columns: minmax(0,1fr); gap: 14px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.follow-card,.crm-empty,.table-wrap) {
  padding: 20px; min-inline-size: 0; background: var(--preview-surface); background-image: none; border: 1px solid var(--preview-line); border-radius: 22px; color: var(--preview-ink); box-shadow: var(--preview-shadow); backdrop-filter: none; -webkit-backdrop-filter: none;
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-card-top { display: grid; grid-template-columns: minmax(0,1fr) minmax(145px,.7fr); gap: 14px; padding-block-end: 14px; margin-block-end: 14px; border-color: var(--preview-line); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-card-name { font: 500 20px/1.4 var(--preview-ui); color: var(--preview-ink); overflow-wrap: anywhere; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.follow-card-kicker,.follow-card-meta,.crm-follow-label,.date-hint) { color: var(--preview-muted); font: 400 12px/1.6 var(--preview-ui); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.work-gate-strip,.work-gate-chip,.follow-urgency-chip,.chase-chip,.quote-valid-chip,.crm-tag-chip) { background: var(--preview-row); color: var(--preview-muted); border-color: var(--preview-line); box-shadow: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-tags-edit { margin-block-start: 8px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-tag-chip { padding: 4px 10px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.follow-next-action,.follow-card-send) { margin-block: 12px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-primary-actions,.crm-action-details-body) { display: flex; flex-wrap: wrap; gap: 8px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-primary-actions button { flex: 1 1 130px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table .crm-primary-actions button { flex: 0 1 auto; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm:has(.crm-empty:not([hidden])) #add-client { color: var(--preview-ink); background: var(--preview-field); border-color: var(--preview-line); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-action-details { margin-block-start: 12px; border-top: 1px solid var(--preview-line); padding-top: 8px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-action-details summary { border-color: transparent; padding-inline: 0; background: transparent; color: var(--preview-muted); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .table-wrap { padding: 0; overflow-x: auto; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(table,thead,tfoot,tr,td,th) { background: transparent; color: var(--preview-ink); border-color: var(--preview-line); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm th { color: var(--preview-muted); font-size: 12px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table thead th { color: var(--preview-ink); background: var(--preview-dialog-surface); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm td { padding: 16px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table :is(tr.overdue,tr.due-today) td { box-shadow: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table :is(tr.overdue,tr.due-today) td:first-child { border-inline-start: 3px solid var(--preview-accent); }
@media (min-width:701px) {
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table { min-inline-size: 1180px; table-layout: fixed; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(1) { inline-size: 230px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(4) { inline-size: 140px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(6) { inline-size: 170px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(7) { inline-size: 150px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(8) { inline-size: 230px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #crm-table.crm-compact-table :is(th,td):nth-child(10) { inline-size: 230px; }
}
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed :is(#client-profile-dialog,#create-draft-dialog) { color: var(--preview-ink); background: var(--preview-dialog-surface); background-image: none; border: 1px solid var(--preview-line); border-radius: 24px; padding: 24px; font-family: var(--preview-ui); box-shadow: var(--preview-shadow); backdrop-filter: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed :is(#client-profile-dialog,#create-draft-dialog) h2 { color: var(--preview-ink); font: 400 32px/1.3 var(--preview-display); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed :is(#client-profile-dialog,#create-draft-dialog) :is(input,textarea,.localized-control-input) { background: var(--preview-field); color: var(--preview-ink); border: 1px solid var(--preview-control-line); border-radius: 12px; font: 400 16px/1.5 var(--preview-ui); }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #client-profile-dialog :is(.client-profile-note,.client-profile-detail-count) { color: var(--preview-muted); font-size: 13px; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #client-profile-dialog :is(.client-profile-more,.client-profile-work-section,.client-profile-confirm) { background: var(--preview-row); border-color: var(--preview-line); border-radius: 16px; box-shadow: none; }
html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed :is(#client-profile-dialog,#create-draft-dialog) button { color: var(--preview-ink); background: var(--preview-field); border-color: var(--preview-line); border-radius: 12px; font: 500 14px/1.5 var(--preview-ui); min-block-size: 44px; }
@media (max-width:700px) {
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-head { gap: 10px; margin-block-end: 8px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-actions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; overflow: visible; padding: 2px 0; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-actions button { min-inline-size: 0; min-block-size: 48px; padding: 8px 6px; white-space: normal; font-size: 12px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm h1 { font-size: 34px; }
  html[lang="ar"][data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm h1 { font-size: 28px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-queue { grid-template-columns: minmax(0,1fr); gap: 24px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-card-top { grid-template-columns: minmax(0,1fr); }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.follow-card,.crm-empty) { padding: 18px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(input,textarea,.localized-control-input) { font-size: 16px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-pipeline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 12px; margin-block-start: 12px; font-size: 12px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .pipeline-jump { margin: 0; padding-inline: 10px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-view button,.crm-filter-disclosure > summary) { font-size: 12px; padding-inline: 11px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm :is(.crm-view,.crm-filter-disclosure) { margin-block: 4px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-search { margin-block: 4px 12px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .follow-bucket-title { margin-block-end: 8px; }
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed :is(#client-profile-dialog,#create-draft-dialog) { padding: 18px; }
}
@media (max-width:360px) {
  html[data-rattib-material="glass"][data-route-surface="crm"]:not(#_) body.workspace-framed #panel-crm .crm-board-actions { grid-template-columns: repeat(3,minmax(0,1fr)); }
}