/* Neutral operational controls across CRM. Financial outflows, actual errors and
   established appointment colors retain their semantic meaning. */
#adminApp {
  --brand-red: var(--admin-accent);
  --brand-red-dark: var(--admin-accent-hover);
  --admin-active: var(--admin-selection);
  --rose: #e9ecf0;
  accent-color: var(--admin-accent);
  caret-color: var(--admin-accent);
}
#adminApp :is(.finance-metrics, .finance-workbench, .finance-transactions, .finance-expense-form,
  .workflow-error, .staff-editor-error, .btn-danger, .availability-warning, .planner-conflict-label,
  .communication-item-delete-confirm, .communication-message-delete-confirm, .communication-delete-chat-confirm,
  [role="alert"]) {
  --brand-red: #c91f26;
  --brand-red-dark: #a91820;
}
#adminApp :is(.work-page-head, .page-head, .overview-planner-head) > div > .kicker { display: none; }
#adminApp :is(.work-page-head, .page-head) h1 { font-size: clamp(24px, 2.4vw, 32px); font-weight: 600; line-height: 1.25; }
#adminApp :is(.work-page-head, .page-head) p:not(.kicker) { font-weight: 400; line-height: 1.5; }
#adminApp :is(.segmented-tabs, .client-segments, .client-status-tabs, .nav-submenu) button.active,
#adminApp :is(.nav-client-list, .nav-employee-list) button.active {
  color: var(--admin-accent-hover);
  background: var(--admin-selection);
  border-color: var(--admin-border);
  box-shadow: none;
}
#adminApp :is(.segmented-tabs, .client-segments, .client-status-tabs) button.active b {
  background: #dce1e7;
  color: var(--admin-accent-hover);
}
#adminApp .segmented-tabs button { font-weight: 600; }
#adminApp .crm-conversion-flow b { color: var(--ink); font-weight: 600; }
#adminApp .crm-funnel > header em.is-clear { background: var(--admin-soft); color: var(--admin-muted); font-weight: 500; }
#adminApp .crm-funnel > header em.has-overdue { background: #fbefef; color: #9e3c40; font-weight: 600; }
#adminApp :is(.crm-funnel, .crm-conversion) > header strong,
#adminApp .crm-stage-card strong { font-weight: 600; }
#adminApp .crm-stage-card:focus-visible,
#adminApp .crm-stage-card:hover { border-color: var(--admin-focus); }
#adminApp :is(.input, .textarea):focus { border-color: var(--admin-focus); box-shadow: none; }
#adminApp .nav-employee-avatar { background: #e9ecf0; color: #59616f; }
.sidebar-account-avatar {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
  background: #e5e9ee;
  color: #687082;
}
.sidebar-account-avatar svg { display: block; width: 18px; height: 18px; }
.admin-nav .sidebar-account { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; padding-inline: 4px; gap: 4px 8px; }
.sidebar-account > div { display: contents; }
.sidebar-account-avatar { grid-column: 1; grid-row: 1 / 3; align-self: start; margin-top: 4px; }
.sidebar-account strong { grid-column: 2 / 4; grid-row: 1; overflow-wrap: break-word; }
.sidebar-account small { grid-column: 2; grid-row: 2; align-self: center; }
.sidebar-account .admin-logout-button { grid-column: 3; grid-row: 2; padding-inline: 8px; }
#adminApp :is(.finance-period-tabs, .finance-chart-switch) button.active { color: var(--admin-accent); box-shadow: none; }
#adminApp .settings-text-link { color: var(--admin-accent); }
#adminApp .broadcast-page .broadcast-audience-chip.active { background: var(--admin-selection); color: var(--admin-accent); border-color: var(--admin-border); }
#adminApp .broadcast-audience-chip.active .broadcast-audience-icon { color: var(--admin-accent); }
#adminApp .broadcast-audience-chip.active > small,
#adminApp .broadcast-page-status b { background: #dce1e7; color: var(--admin-accent); }
#adminApp .client-mobile-row-details > button { background: var(--admin-accent); }
#adminApp .communication-channel-nav button.active,
#adminApp .work-schedule-inspector .work-day-team-row.selected,
#adminApp .communication-telegram-asset-grid button.selected { background: var(--admin-selection); color: var(--admin-accent); }
#adminApp .communication-channel-nav button.active b { background: #dce1e7; color: var(--admin-accent); }
#adminApp .communications-page .message-bubble.outgoing { background: var(--admin-accent); color: #fff; }
#adminApp .work-shift-time-trigger:focus,
#adminApp .work-shift-time-dropdown.open .work-shift-time-trigger { border-color: var(--admin-focus); box-shadow: none; }

/* Settings are peer groups, so they share a horizontal responsive grid. */
.figma-settings .settings-directory { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; align-items: start; }
.figma-settings .settings-directory-group { padding: 24px; }
.figma-settings .settings-directory-group h2 { font-weight: 600; margin-bottom: 16px; }
.figma-settings .settings-directory-group button { min-height: 44px; width: 100%; text-align: left; padding: 10px 0; line-height: 22px; letter-spacing: 0; }
.figma-settings .settings-directory-group button + button { border-top: 1px solid #eef0f3; }
.figma-settings .settings-directory-group button:hover { background: #f6f7f9; text-decoration: none; }

/* Team roster: one day header, quiet editable shifts, explicit days off. */
.calm-team-schedule .work-schedule-panel { border: 1px solid var(--admin-border); border-radius: 12px; overflow: hidden; background: #fff; }
.calm-team-schedule .work-schedule-panel-head { padding: 20px; gap: 16px; }
.calm-team-schedule .work-schedule-panel-head .section-title { font-size: 18px; line-height: 26px; font-weight: 600; }
.calm-team-schedule .work-schedule-panel-head .meta { font-size: 13px; line-height: 20px; font-weight: 400; margin-top: 4px; }
.calm-team-schedule .work-schedule-toolbar .icon-btn { color: var(--admin-accent); border-color: var(--admin-border); width: 36px; height: 36px; }
.calm-team-schedule .work-schedule-hint { margin: 0; padding: 0 20px 16px; color: var(--admin-muted); font-size: 13px; line-height: 20px; }
.calm-team-schedule .work-schedule-scroll { max-height: calc(100dvh - 240px); border-top: 1px solid var(--admin-border); }
.calm-team-schedule .work-schedule-grid { min-width: 900px; }
.calm-team-schedule .work-schedule-head,
.calm-team-schedule .work-schedule-row { grid-template-columns: 160px repeat(var(--schedule-day-count, 7), minmax(100px, 1fr)); }
.calm-team-schedule .work-schedule-month { min-width: calc(160px + var(--schedule-day-count, 31) * 110px); }
.calm-team-schedule .work-schedule-month .work-schedule-head,
.calm-team-schedule .work-schedule-month .work-schedule-row { grid-template-columns: 160px repeat(var(--schedule-day-count, 31), 110px); }
.calm-team-schedule .work-schedule-head { background: #f6f7f9; }
.calm-team-schedule .work-schedule-head > span { padding: 0; min-height: 84px; border-right: 0; display: grid; place-items: stretch; }
.calm-team-schedule .work-schedule-head > span:first-child { padding: 16px; align-items: center; justify-items: start; background: #f6f7f9; font-size: 13px; font-weight: 500; text-transform: none; }
.calm-team-schedule .work-schedule-head button { width: 100%; display: grid; align-content: center; justify-items: center; gap: 2px; padding: 12px 4px; border: 0; background: transparent; color: var(--ink); }
.calm-team-schedule .work-schedule-head button:hover { background: #e9ecf0; }
.calm-team-schedule .work-schedule-head .is-selected-day { background: #e9ecf0; box-shadow: inset 0 -2px 0 #687082; }
.calm-team-schedule .work-schedule-head strong { font-size: 13px; line-height: 18px; font-weight: 600; text-transform: capitalize; }
.calm-team-schedule .work-schedule-head small,
.calm-team-schedule .work-schedule-head em { font-size: 12px; line-height: 18px; font-weight: 400; color: var(--admin-muted); font-style: normal; }
.calm-team-schedule .work-person { min-height: 60px; padding: 12px 16px; gap: 4px; border-right: 0; background: #fff; box-shadow: 1px 0 0 #e2e6ed; }
.calm-team-schedule .work-person strong { font-size: 14px; line-height: 20px; font-weight: 600; }
.calm-team-schedule .role-chip { font-size: 12px; line-height: 18px; font-weight: 400; }
.calm-team-schedule .work-shift-cell,
.calm-team-schedule .work-shift-cell.active { background: #fff; border-right: 0; min-height: 60px; padding: 10px 6px; box-shadow: none; }
.calm-team-schedule .work-shift-input { border: 1px solid transparent; border-radius: 6px; padding: 8px 2px; font-size: 13px; line-height: 20px; font-weight: 500; color: var(--ink); background: #edf0f3; }
.calm-team-schedule .work-shift-cell.off .work-shift-input { background: transparent; color: #687082; font-weight: 400; }
.calm-team-schedule .work-shift-cell.off .work-shift-input::placeholder { color: #687082; }
.calm-team-schedule .work-shift-cell.selected { background: #f6f7f9; box-shadow: none; }
.calm-team-schedule .work-shift-cell.selected .work-shift-input,
.calm-team-schedule .work-shift-input:focus { border-color: #687082; outline: none; background: #e9ecf0; }
.calm-team-schedule .work-schedule-inspector { border-radius: 12px; }
.calm-team-schedule .work-inspector-head h2 { font-size: 22px; font-weight: 600; }
.calm-team-schedule .work-schedule-mobile-summary { background: #fff; }
.calm-team-schedule .work-schedule-mobile-summary .kicker { display: none; }
.calm-team-schedule .work-schedule-mobile-days button.active { background: var(--admin-selection); color: var(--admin-accent-hover); border-color: #687082; }
.calm-team-schedule .work-schedule-mobile-row { box-shadow: none; border-color: var(--admin-border); }
.calm-team-schedule .work-schedule-mobile-row :is(strong, b) { font-weight: 600; }
.calm-team-schedule .work-schedule-mobile-row em { background: #edf0f3; color: var(--admin-muted); font-weight: 500; }
.calm-team-schedule .work-schedule-mobile-row small { font-size: 12px; line-height: 18px; font-weight: 400; }

/* Migration remains an explicit preparation flow; no auto-launch behavior. */
.migration-page { max-width: 1280px; padding: 32px 24px; }
.migration-page h1 { margin: 0; font-size: 28px; line-height: 36px; font-weight: 600; }
.migration-page > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.migration-page > header p { margin: 8px 0 0; font-size: 14px; line-height: 22px; color: var(--admin-muted); }
.migration-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 24px; align-items: start; }
.migration-page .workflow-form { display: flex; flex-direction: column; gap: 24px; margin: 0; }
.migration-page .workflow-form > section { margin: 0; }
.migration-section, .migration-state { padding: 24px; border: 1px solid var(--admin-border); border-radius: 12px; background: #fff; min-width: 0; }
.migration-page h2 { margin: 0 0 8px; font-size: 16px; line-height: 24px; font-weight: 600; }
.migration-page .migration-section > p, .migration-page .migration-state > p { margin: 0 0 16px; font-size: 14px; line-height: 22px; color: var(--admin-muted); }
.migration-page label { display: grid; gap: 8px; font-size: 14px; line-height: 22px; font-weight: 500; }
.migration-page .input, .migration-page .textarea { width: 100%; font-size: 16px; line-height: 24px; font-weight: 400; }
.migration-page .textarea { min-height: 136px; }
.migration-page .textarea::placeholder { font-size: 14px; color: #687082; }
.migration-page .migration-save { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.migration-save span { font-size: 13px; color: var(--admin-muted); }
.migration-state dl { margin: 20px 0; }
.migration-state dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--admin-border); font-size: 14px; line-height: 20px; }
.migration-state dt { color: var(--admin-muted); }
.migration-state dd { margin: 0; font-weight: 500; }
.migration-page .migration-launch { display: grid; gap: 16px; padding-top: 20px; border-top: 1px solid var(--admin-border); }
.migration-page .workflow-checkbox { display: flex; align-items: flex-start; gap: 8px; font-weight: 400; }
.migration-page details { margin-top: 20px; font-size: 14px; }
.migration-page summary { min-height: 44px; padding-block: 12px; cursor: pointer; }
.migration-page .migration-state .btn { white-space: normal; }
@media (max-width: 1000px) { .migration-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .calm-team-schedule .work-schedule-panel-head { padding: 16px; align-items: flex-start; }
  .calm-team-schedule .work-schedule-hint { padding: 0 16px 16px; }
  .calm-team-schedule .work-schedule-toolbar .icon-btn { width: 44px; height: 44px; }
  .calm-team-schedule .work-schedule-panel-head .section-title { font-size: 16px; line-height: 24px; }
  .calm-team-schedule .work-schedule-mobile-row :is(strong, b) { font-size: 14px; }
  .migration-page { padding: 24px 16px; }
  .migration-page > header { flex-direction: column; gap: 16px; }
  .migration-page h1 { font-size: 24px; line-height: 32px; }
  .migration-layout, .migration-page .workflow-form { gap: 16px; }
  .migration-section, .migration-state { padding: 20px; }
}
