/* Shared working-surface typography. Loaded last; screen only. Never controls
   visibility, permissions or form state. Public pages and printed documents keep
   their own styles. The same scale applies to desktop and phone. */
@media screen {
  :root {
    --panel-background: #f1f4f8;
    --panel-surface: #fff;
    --panel-surface-soft: #f6f8fb;
    --panel-border: #ccd6e3;
    --panel-text: #17263c;
    --panel-muted: #4b5d74;
    --panel-accent: #165dcc;
    --panel-accent-soft: #edf3ff;
    --panel-radius: 12px;
    --panel-shadow: 0 2px 6px #152a4405;
  }
  :root[data-panel-theme="dark"] {
    --panel-background: #0d1726;
    --panel-surface: #162438;
    --panel-surface-soft: #1c2d44;
    --panel-border: #3a4d65;
    --panel-text: #f0f5fc;
    --panel-muted: #b9c7d9;
    --panel-accent: #8bbcff;
    --panel-accent-soft: #223b5d;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) {
    font-size: 1rem; line-height: 1.55; letter-spacing: normal;
    color: var(--panel-text); --ink: var(--panel-text); --muted: var(--panel-muted);
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(p,dd,td,textarea,input,select) {
    font-size: 1rem; line-height: 1.55;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(label,.field-label,dt,th,small,summary,.section-note,.erp-form-status,.workspace-help,.settings-toggle) {
    font-size: .875rem; line-height: 1.55;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(h2,h3,h4) {
    color: var(--panel-text); letter-spacing: -.015em; line-height: 1.4;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) h2 { font-size: 1.25rem; }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) h3 { font-size: 1.125rem; }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) h4 { font-size: 1rem; }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) .button {
    min-height: 44px; font-size: .9375rem; line-height: 1.4; font-weight: 600; padding: 10px 15px; border-radius: 8px;
    white-space: normal; overflow-wrap: anywhere;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(input,select):not([type="checkbox"]):not([type="radio"]) { min-height: 44px; }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(.field-label,label,dt,small,.section-note) { color: var(--panel-muted); }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :is(input,textarea)::placeholder { color: var(--panel-muted); opacity: 1; }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog,.company-onboarding-modal,.order-workflow-modal) :focus-visible { outline: 3px solid var(--panel-accent); outline-offset: 3px; }

  #console-view .console-main { padding-inline: clamp(16px,2.4vw,36px); }
  #console-view .panel-topbar { min-height: 68px; padding: 10px 0; margin-bottom: 14px; }
  #console-view .panel-topbar-context > span { font-size: .8125rem; }
  #console-view .panel-topbar-context strong { font-size: .9375rem; }
  #console-view .company-role-context { font-size: .8125rem; margin-bottom: 6px; }
  #console-view .admin-panel-context { border: 1px solid var(--panel-border); border-left: 3px solid var(--panel-accent); border-radius: 8px; background: var(--panel-surface); padding: 8px 12px; margin-bottom: 20px; font-size: .875rem; }
  #console-view .admin-panel-context .button { min-height: 40px; padding: 7px 12px; font-size: .875rem; }
  #console-view .console-header { margin-bottom: 18px; gap: 16px; }
  #console-view .console-header h1 { font-size: clamp(1.75rem,2.1vw,2rem); line-height: 1.2; letter-spacing: -.035em; font-weight: 700; }
  #console-view .console-header p { font-size: 1rem; color: var(--panel-muted); margin-top: 8px; }
  #console-view .section-kicker { font-size: .8125rem; font-weight: 650; letter-spacing: .05em; }
  #console-view .section-heading { margin-bottom: 12px; }
  #console-view .console-section { margin-top: 20px; }
  #console-view :is(.metric-grid,.erp-summary-grid) { gap: 14px; margin-bottom: 20px; }
  #console-view :is(.metric-card,.erp-summary-grid > article) { padding: 18px 20px; min-height: 118px; border-color: var(--panel-border); }
  #console-view :is(.metric-card > span,.erp-summary-grid span) { font-size: .9375rem; color: var(--panel-muted); font-weight: 600; }
  #console-view :is(.metric-card strong,.erp-summary-grid strong) { font-size: 2rem; margin: 8px 0 4px; letter-spacing: -.025em; line-height: 1.2; }
  #console-view :is(.metric-card small,.erp-summary-grid small) { font-size: .875rem; }
  #console-view .metric-card-primary :is(span,strong,small) { color: #fff; }
  #console-view :is(.console-nav-item,.console-nav-group-toggle) { font-size: .9375rem; line-height: 1.45; }
  #console-view .console-nav-item:not(.is-active) { color: var(--panel-muted); font-weight: 500; }
  #console-view :is(.panel-organization-switcher,.account-menu-identity strong,.account-menu-identity small) { font-size: .875rem; }

  /* Common row anatomy, shared by sales, operations, company and inbox. */
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog) :is(.company-list-heading,.company-state,.platform-company-health,.company-card-stats,.lead-head,.erp-head,.lead-source,.source-badge,.status-badge,.lead-status,.settlement-state,.followup-state,.followup-kind,.settlement-reference,.followup-contact,.followup-date,.order-board-reference,.order-board-details,.order-board-move,.order-board-hint,.lead-board-reference,.lead-board-contact,.lead-board-detail,.lead-board-created,.lead-board-service,.lead-board-card-footer,.lead-board-range,.service-task-meta,.service-task-order,.calendar-event-kind,.calendar-event-context,.calendar-event-meta,.bookings-time,.bookings-reason,.today-day-label,.today-scope-button span,.workspace-daybar > p,.workspace-tabs button,.message-sender,.message-pagination span,.conversation-preview,.conversation-item-footer,.conversation-item-heading time,.inbox-item-preview,.inbox-item-meta,.notification-kind,.notification-time,.customer-history-meta,.customer-history-summary,.availability-slot span,.public-booking-link-row span) {
    font-size: .875rem; line-height: 1.55;
  }
  :is(#console-view,#erp-drawer,.lead-drawer,.platform-admin-dialog) :is(.company-card-header strong,.platform-company-billing strong,.lead-client-name,.order-board-title,.lead-board-title,.erp-detail-row strong,.service-task-notes,.bookings-order-option,.availability-slot strong,.notification-title,.message-bubble p) { font-size: 1rem; line-height: 1.55; }
  #console-view :is(.lead-row,.erp-row) { padding-block: 16px; line-height: 1.5; }
  #console-view :is(.lead-row,.erp-row) > span { font-size: .9375rem; }
  #console-view :is(.lead-row,.erp-row) > span::before { font-size: .875rem; }
  #console-view :is(.order-board-card,.lead-board-item,.service-task-row,.calendar-event,.bookings-row,.notification-row) { border-color: var(--panel-border); border-radius: 10px; }
  #console-view .company-actions .button { min-height: 40px; font-size: .875rem; }
  #console-view .company-list-heading { letter-spacing: normal; text-transform: none; }
  #console-view .company-card-stats strong { font-size: 1rem; color: var(--panel-text); }
  #console-view .conversation-item-heading strong { font-size: 1rem; }
  #console-view .message-bubble { font-size: 1rem; line-height: 1.6; }
  #console-view .message-bubble footer { font-size: .8125rem; line-height: 1.5; }
  #console-view :is(.conversation-work-hint,.conversation-work-summary,#conversation-work-message,.cof-state,.cof-preview figcaption,.co-field-definition legend) { font-size: .875rem; line-height: 1.55; }
  #console-view .conversation-workspace { font-size: .875rem; }
  :is(#console-view,#erp-drawer) :is(.co-row strong,.co-values dd,.cof-history li,.public-booking-service-heading strong) { font-size: 1rem; }
  :is(#console-view,#erp-drawer) :is(.co-values dt,.co-field-definition legend,.cof-state,.public-booking-service-heading span,.availability-week-day > strong) { font-size: .875rem; }
  #console-view .calendar-day-number { font-size: 1rem; }
  #console-view .calendar-day-count { color: var(--panel-accent); }
  :is(#console-view,#erp-drawer) .workspace-tabs button { color: var(--panel-muted); }
  :is(#console-view,#erp-drawer) .workspace-tabs button:is(:hover,[aria-selected="true"]) { color: var(--panel-accent); }
  [data-panel-theme="dark"] #console-view .calendar-day[aria-pressed="true"] { background: var(--panel-accent-soft); border-color: var(--panel-accent); }
  #console-view :is(.calendar-day-count,.calendar-month-table th) { font-size: .8125rem; }
  #erp-drawer .detail-section h3 { font-size: 1.125rem; }
  #erp-drawer :is(.erp-detail-row small,.erp-detail-heading > span,.erp-finance-grid span,.workspace-record-summary dt) { font-size: .875rem; }
  #erp-drawer .erp-finance-grid strong { font-size: 1.5rem; }
  #erp-drawer .workspace-record-summary dd { font-size: 1rem; }
  #erp-drawer .workspace-record-summary .workspace-record-name { font-size: 1.25rem; }
  #erp-drawer .workspace-editor > summary { font-size: 1rem; }

  /* Finance: one grouped working area; balances never depend on color alone. */
  #console-view :is(.settlement-section,.followup-section) { background: var(--panel-surface); border: 1px solid var(--panel-border); border-radius: 12px; padding: 20px; gap: 18px; }
  #console-view .settlement-section { grid-template-columns: minmax(180px,.65fr) minmax(0,1.35fr); }
  #console-view .settlement-section > .section-heading { margin: 0; align-self: center; }
  #console-view .settlement-section > :is(.settlement-filters,.settlement-list,.order-board-pagination) { grid-column: 1 / -1; }
  #console-view :is(.settlement-currency-summary,.followup-currency-summary) { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 12px; }
  #console-view :is(.settlement-currency-card,.followup-currency-card) { min-width: 0; width: auto; background: var(--panel-accent-soft); border-color: var(--panel-border); padding: 16px 18px; gap: 5px; }
  #console-view :is(.settlement-currency-card strong,.followup-currency-card strong) { color: var(--panel-accent); font-size: .875rem; letter-spacing: .04em; }
  #console-view :is(.settlement-currency-card span,.followup-currency-card span) { color: var(--panel-text); font-size: 1.25rem; line-height: 1.5; font-weight: 700; overflow-wrap: anywhere; }
  #console-view :is(.settlement-currency-card small,.followup-currency-card small) { color: var(--panel-muted); font-size: .875rem; }
  #console-view :is(.settlement-filters,.followup-filters) { padding: 16px; background: var(--panel-surface-soft); border: 1px solid var(--panel-border); border-radius: 10px; }
  #console-view :is(.settlement-row,.followup-row) { padding: 18px; gap: 20px; background: var(--panel-surface); color: var(--panel-text); border-color: var(--panel-border); }
  #console-view .settlement-row { border-left-color: var(--settlement-color); grid-template-columns: minmax(0,1fr) minmax(250px,.8fr) auto; }
  #console-view :is(.settlement-row h3,.followup-row h3) { font-size: 1.125rem; color: var(--panel-text); margin: 10px 0 6px; }
  #console-view :is(.settlement-customer,.settlement-date,.followup-contact,.followup-date) { color: var(--panel-muted); font-size: .875rem; margin-block: 5px; }
  #console-view .settlement-reference { color: var(--panel-muted); letter-spacing: normal; }
  #console-view :is(.followup-customer,.followup-value strong) { color: var(--panel-text); font-size: 1rem; }
  #console-view .followup-value span { color: var(--panel-muted); font-size: .875rem; line-height: 1.55; }
  #console-view .settlement-row-heading { justify-content: flex-start; gap: 10px; }
  #console-view .settlement-state { padding: 4px 10px; font-weight: 650; }
  #console-view .settlement-amounts { gap: 12px 20px; padding: 14px 16px; background: var(--panel-surface-soft); border-radius: 8px; grid-template-columns: repeat(2,minmax(0,1fr)); }
  #console-view .settlement-amounts dt { font-size: .875rem; color: var(--panel-muted); }
  #console-view .settlement-amounts dd { font-size: 1.125rem; font-weight: 700; color: var(--panel-text); font-variant-numeric: tabular-nums; }
  #console-view .settlement-amounts > div:nth-child(3) { grid-column: 1 / -1; border-top: 1px solid var(--panel-border); padding-top: 10px; }
  #console-view .settlement-amounts > div:nth-child(3) dd { font-size: 1.375rem; }
  #console-view .order-board-pagination { gap: 12px; flex-wrap: wrap; }
  [data-panel-theme="dark"] #console-view :is(.settlement-summary-grid,.erp-summary-grid) strong { color: var(--panel-text); }
  [data-panel-theme="dark"] #console-view .settlement-state { color: #ffd794; background: #42311b; }
  [data-panel-theme="dark"] #console-view .settlement-state.is-requires_quote { color: #dbc8ff; background: #352947; }
  [data-panel-theme="dark"] #console-view .settlement-state.is-requires_review { color: #ffb3ba; background: #482730; }
  [data-panel-theme="dark"] #console-view .settlement-state.is-partial { color: #add9ff; background: #1e3b54; }
  [data-panel-theme="dark"] #console-view .settlement-state:is(.is-settled,.is-overpaid) { color: #a0e9c4; background: #1c4036; }
  [data-panel-theme="dark"] #console-view .settlement-warning { color: #ffb3ba; }
}
@media screen and (max-width: 1180px) {
  #console-view .settlement-row { grid-template-columns: minmax(0,1fr) minmax(220px,.8fr); }
  #console-view .settlement-row > .button { grid-column: 1 / -1; justify-self: end; }
  #console-view .followup-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #console-view :is(.settlement-filters,.followup-filters) { grid-template-columns: minmax(0,1fr); }
}
@media screen and (max-width: 780px) {
  #console-view .settlement-section { grid-template-columns: minmax(0,1fr); }
  #console-view :is(.settlement-row,.settlement-filters,.followup-filters) { grid-template-columns: minmax(0,1fr); }
  #console-view .settlement-row > .button { grid-column: auto; width: 100%; justify-self: stretch; }
  #console-view :is(.settlement-section,.followup-section) { padding: 14px; }
  #console-view .settlement-amounts { padding: 12px; }
  #console-view .panel-topbar { flex-wrap: wrap; gap: 10px; }
  #console-view .admin-panel-context { align-items: flex-start; gap: 10px; }
  #console-view .admin-panel-context .button { flex-shrink: 0; }
}
@media screen and (max-width: 600px) {
  #console-view .console-main { padding-inline: 14px; }
  #console-view :is(.metric-card,.erp-summary-grid > article) { padding: 16px; min-height: 0; }
  #console-view .erp-summary-grid > article { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 4px 12px; align-items: center; }
  #console-view .erp-summary-grid > article strong { grid-column: 2; grid-row: 1 / span 2; margin: 0; font-size: 1.75rem; }
  #console-view .erp-summary-grid > article small { grid-column: 1; }
  #console-view .calendar-day-count { font-size: .75rem; }
  #console-view .calendar-day-number { font-size: .875rem; }
  #console-view .calendar-month-table th { font-size: .8125rem; }
}
