/* Secondary layouts tuned to the existing light/dark Co-Work tokens. */
.cw-ops .ca-tab-suite {
  width: 100%;
  min-width: 0;
}
.cw-ops .ca-tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
  min-width: 0;
  margin: 0 0 16px;
  padding: 0 2px;
  overflow-x: auto;
  border-bottom: 1px solid var(--rf-border);
  scrollbar-width: thin;
}
.cw-ops .ca-tabs .ca-tab {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 8px 15px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 8px 8px 0 0;
  background: transparent;
  color: var(--rf-muted);
  font: inherit;
  white-space: nowrap;
  box-shadow: none;
}
.cw-ops .ca-tabs .ca-tab[aria-selected="true"] {
  color: var(--rf-accent);
  border-bottom-color: var(--rf-accent);
  background: color-mix(in srgb, var(--rf-selection) 56%, transparent);
  font-weight: 650;
}
.cw-ops .ca-tabs .ca-tab:focus-visible,
.cw-ops .ca-settings-nav .ca-setting-link:focus-visible {
  outline: 2px solid var(--rf-accent);
  outline-offset: 2px;
}
.cw-ops .ca-tab-panes,
.cw-ops .ca-tab-panel {
  min-width: 0;
  width: 100%;
}
.cw-ops .ca-tab-panel[hidden] {
  display: none !important;
}
.cw-ops .ca-employees-suite .ca-tab-panel > .panel,
.cw-ops .ca-employees-suite .ca-tab-panel > form,
.cw-ops .ca-crm-suite .ca-tab-panel > .crm-toolbar,
.cw-ops .ca-crm-suite .ca-tab-panel > #crmResults,
.cw-ops .ca-meetings-suite .ca-tab-panel > .oa-host {
  width: 100%;
  min-width: 0;
}
.cw-ops .ca-employees-suite .ca-tab-panel > form[data-form="employee"],
.cw-ops .ca-employees-suite .ca-tab-panel > form[data-form="absence"],
.cw-ops .ca-employees-suite .ca-tab-panel > section.panel {
  margin-top: 14px;
}
.cw-ops .ca-employees-suite .ca-tab-panel > .panel.table,
.cw-ops .ca-crm-suite #crmResults > .panel.table {
  width: 100%;
  max-width: none;
}
.cw-ops #crmSummary {
  width: 100%;
  min-width: 0;
}
.cw-ops .ca-crm-suite .crm-toolbar {
  margin-bottom: 14px;
}
.cw-ops .ca-crm-suite #crmResults > p[role="status"] {
  margin: 0 0 10px;
  color: var(--rf-muted);
}
.cw-ops .ca-meetings-suite .ca-tab-panel > .ops-calendar,
.cw-ops .ca-meetings-suite .ca-tab-panel > details {
  width: 100%;
}

/* Settings keeps the original controls and section nodes mounted; inactive panels sit off-canvas so existing dirty-form guards still see them. */
.cw-ops .ca-settings-layout {
  position: relative;
  display: grid;
  grid-template-columns: minmax(165px, 220px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  width: 100%;
  min-width: 0;
  direction: ltr;
}
.cw-ops .ca-settings-nav {
  position: sticky;
  top: 150px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  max-height: calc(100dvh - 170px);
  overflow-y: auto;
  padding: 9px;
  border: 1px solid var(--rf-border);
  border-radius: 14px;
  background: var(--rf-glass);
  direction: inherit;
}
.cw-ops .ca-setting-link {
  width: 100%;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: var(--rf-muted);
  font: inherit;
  text-align: start;
  overflow-wrap: anywhere;
  box-shadow: none;
}
.cw-ops .ca-setting-link[aria-selected="true"] {
  color: var(--rf-accent);
  border-color: color-mix(in srgb, var(--rf-accent) 28%, var(--rf-border));
  background: var(--rf-selection);
  font-weight: 650;
}
.cw-ops .ca-setting-profile-link {
  padding-inline-start: 22px;
  font-size: .94em;
}
.cw-ops .ca-settings-stage {
  position: relative;
  min-width: 0;
  min-height: 140px;
}
.cw-ops .ca-setting-panel {
  min-width: 0;
  width: 100%;
}
.cw-ops .ca-setting-panel.ca-inactive {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: -200vw;
  width: min(900px, 80vw);
  visibility: hidden;
  pointer-events: none;
}
.cw-ops .ca-setting-panel:not(.ca-inactive) {
  position: relative;
}
.cw-ops .ca-setting-panel > .ws-settings {
  width: 100%;
}
.cw-ops .ca-setting-panel #profiles[data-ca-profile-index="0"] > .panel:not(:nth-child(1)),
.cw-ops .ca-setting-panel #profiles[data-ca-profile-index="1"] > .panel:not(:nth-child(2)),
.cw-ops .ca-setting-panel #profiles[data-ca-profile-index="2"] > .panel:not(:nth-child(3)),
.cw-ops .ca-setting-panel #profiles[data-ca-profile-index="3"] > .panel:not(:nth-child(4)) {
  display: none !important;
}
.cw-ops .ca-settings-state {
  margin-top: 12px;
  color: var(--rf-muted);
}

/* Paid advertising: move only the existing field header/cell nodes into compact budget cards and readable field rows. */
.cw-ops .ca-ad-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 14px 4px;
}
.cw-ops .ca-ad-summary-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--rf-border);
  border-radius: 12px;
  background: var(--rf-field);
}
.cw-ops .ca-ad-summary-table,
.cw-ops .ca-ad-details-table {
  width: 100%;
  min-width: 0 !important;
  border-collapse: collapse;
  table-layout: fixed;
}
.cw-ops .ca-ad-summary-table th,
.cw-ops .ca-ad-details-table th {
  padding: 11px 13px 5px;
  border: 0;
  background: transparent;
  color: var(--rf-muted);
  font-size: 12px;
  font-weight: 500;
  text-align: start;
  overflow-wrap: anywhere;
}
.cw-ops .ca-ad-summary-table td,
.cw-ops .ca-ad-details-table td {
  padding: 4px 13px 13px;
  border: 0;
  background: transparent;
  vertical-align: middle;
}
.cw-ops .ca-ad-summary-table td input {
  width: 100%;
  min-height: 42px;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: var(--rf-text);
  font-size: clamp(19px, 2vw, 27px);
  font-weight: 650;
  box-shadow: none;
}
.cw-ops .ca-ad-details-wrap {
  margin: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--rf-border);
}
.cw-ops .ca-ad-details-heading {
  margin: 0 0 9px;
  color: var(--rf-text);
  font-size: 15px;
}
.cw-ops .ca-ad-details-table tbody tr + tr {
  border-top: 1px solid var(--rf-border);
}
.cw-ops .ca-ad-details-table th {
  width: 34%;
  padding-inline-start: 0;
}
.cw-ops .ca-ad-details-table td input {
  width: 100%;
  min-height: 40px;
  color: var(--rf-text);
}
.cw-ops .ca-ad-identity table {
  width: 100%;
  min-width: 0 !important;
}
.cw-ops .ca-ad-identity th,
.cw-ops .ca-ad-identity td {
  padding: 8px 10px;
}

/* Native file input remains intact and labelled; the visible picker copy is localized. */
.cw-ops .mp-picker {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  max-width: 100%;
  overflow: hidden;
  border: 1px dashed var(--rf-border);
  border-radius: 10px;
  padding: 8px 12px;
  background: var(--rf-field);
  color: var(--rf-text);
  text-align: center;
  cursor: pointer;
}
.cw-ops .mp-picker:focus-within {
  outline: 2px solid var(--rf-accent);
  outline-offset: 2px;
}
.cw-ops .mp-picker .ca-file-picker-label {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}
.cw-ops .mp-picker input[type="file"] {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

/* Calendar client selection precedes the month grid; export remains in its original lower position. */
.cw-ops .pc-calendar > .pc-client-section {
  margin: 14px 0 16px;
  padding: 12px 0 14px;
  border-top: 0;
  border-bottom: 1px solid var(--rf-border);
}

/* The final proposal puts the chart before task and follow-up cards. Keep that order in all non-CRM section views. */
body.cw-ops:not([data-cw-view="crm"]):not([data-cw-view="overview"]) #content > .oa-host {
  order: -10 !important;
}
body.cw-ops[data-cw-view="tasks"] #content > .oa-host {
  order: -10 !important;
}
body.cw-ops[data-cw-view="followup"] #content > .oa-host {
  order: -10 !important;
}

/* In Arabic, the existing finance KPI node order reads right-to-left: net, expenses, revenue. */
:root[data-language="ar"] body.cw-ops #financeWorkspace .fmw-kpis-primary {
  direction: rtl !important;
}

@media (max-width: 760px) {
  .cw-ops .ca-settings-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  .cw-ops .ca-settings-nav {
    position: relative;
    top: auto;
    flex-direction: row;
    align-items: stretch;
    max-height: none;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
  }
  .cw-ops .ca-settings-nav .ca-setting-link {
    width: auto;
    flex: 0 0 auto;
    min-width: 120px;
  }
  .cw-ops .ca-setting-profile-link {
    padding-inline-start: 12px;
  }
  .cw-ops .ca-ad-summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 175px), 1fr));
    gap: 8px;
    margin-inline: 10px;
  }
  .cw-ops .ca-ad-details-wrap {
    margin-inline: 10px;
  }
}
@media (max-width: 520px) {
  .cw-ops .ca-ad-summary-grid {
    grid-template-columns: 1fr;
  }
  .cw-ops .ca-ad-details-table,
  .cw-ops .ca-ad-details-table tbody,
  .cw-ops .ca-ad-details-table tr,
  .cw-ops .ca-ad-details-table th,
  .cw-ops .ca-ad-details-table td {
    display: block;
    width: 100%;
  }
  .cw-ops .ca-ad-details-table tbody tr {
    padding: 9px 0;
  }
  .cw-ops .ca-ad-details-table th,
  .cw-ops .ca-ad-details-table td {
    padding-inline: 0;
  }
  .cw-ops .ca-ad-details-table td {
    padding-top: 2px;
  }
}
/* Compact monthly activity to the proposal's full-width strip. */
.cw-ops .oa-host{padding:0!important}
.cw-ops .oa-shell{padding:14px 16px!important;border:0!important;background:transparent!important}
.cw-ops .oa-shell>header{margin:0 0 10px!important;gap:12px}
.cw-ops .oa-shell>header h3{font-size:16px;margin:0}
.cw-ops .oa-grid>.oa-card:only-child{grid-column:1/-1}
.cw-ops .oa-card{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.cw-ops .oa-card h4{font-size:13px;margin:0 0 6px}
.cw-ops .oa-chart{margin:0}
.cw-ops .oa-chart svg{height:96px!important;min-height:0!important;max-height:96px!important;width:100%;display:block}
.cw-ops .oa-legend{margin:6px 0!important}
.cw-ops .oa-data{margin-top:6px!important;font-size:12px}
.cw-ops .oa-status-list{margin:6px 0 0!important;padding:0!important}
.cw-ops .ca-settings-layout details.ws-settings>summary{display:none}
.cw-ops #workspaceOrder button{background:var(--rf-surface)!important;color:var(--rf-muted)!important;border:1px solid var(--rf-border)!important;min-height:34px;padding:6px 10px}
.cw-ops #companyCalendar fieldset{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:6px 0;padding:8px 10px;min-width:0}
.cw-ops #companyCalendar fieldset legend{float:inline-start;width:70px;padding:0;font-size:13px}
.cw-ops #companyCalendar fieldset label{display:flex;align-items:center;gap:5px;flex:1 1 130px;margin:0;font-size:12px}
.cw-ops #companyCalendar fieldset label:has(input[type=radio]){flex:0 0 auto}
.cw-ops #companyCalendar fieldset input[type=time]{width:100px;min-width:0;min-height:34px;padding:4px}
.cw-ops .oa-shell>header label{display:flex;align-items:center;gap:8px;margin:0;font-size:12px}
.cw-ops .oa-shell>header input[data-analytics-year]{width:82px;min-height:30px;margin:0;padding:4px 8px}
.cw-ops .oa-card>h4{display:none}
.cw-ops .oa-chart{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px}
.cw-ops .oa-chart>svg,.cw-ops .oa-chart>.oa-month-axis{grid-column:1/-1}
.cw-ops .oa-chart>.oa-legend{grid-column:1;grid-row:3;justify-self:start}
.cw-ops .oa-chart>.oa-data{grid-column:2;grid-row:3;padding:0!important;border:0!important}
.cw-ops .oa-chart>.oa-data[open]{grid-column:1/-1;grid-row:4}
.cw-ops #companyCalendar fieldset{position:relative;display:block!important;border:0!important;border-bottom:1px solid var(--rf-border)!important;border-radius:0!important;margin:0!important;padding:8px 0!important;padding-inline-start:82px!important}
.cw-ops #companyCalendar fieldset legend{position:absolute;float:none;inset-inline-start:0;top:16px;width:70px;margin:0}
.cw-ops #companyCalendar .ccal-day-fields{display:flex!important;flex-wrap:wrap;align-items:center;gap:8px;min-height:34px}
.cw-ops #companyCalendar .ccal-day-fields>label{flex:1 1 125px;justify-content:space-between;min-width:0}
.cw-ops #companyCalendar .ccal-toggle{display:flex;flex:0 0 auto;gap:8px}
.cw-ops #companyCalendar .ccal-toggle label{flex:0 0 auto;min-width:0;gap:4px}
@media(max-width:600px){.cw-ops #companyCalendar fieldset{padding-inline-start:0!important}.cw-ops #companyCalendar fieldset legend{position:static;width:auto;padding:4px 0}.cw-ops .oa-chart>.oa-data{grid-column:1/-1;grid-row:4}.cw-ops .oa-chart>.oa-legend{grid-column:1/-1}}
/* Keep localized search actions readable on phone widths. */
.cw-ops form.fu-search{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cw-ops form.fu-search>input{flex:1 1 150px;min-width:0!important;width:auto!important}
.cw-ops form.fu-search>button{flex:0 0 auto;min-width:110px;white-space:nowrap;min-height:40px}
/* Mobile drawer must escape the app stacking context and sit above its shade. */
@media(max-width:850px){
  .cw-ops .app{z-index:auto!important}
  .cw-ops .rf-sidebar{z-index:100!important;background:var(--rf-surface)!important;filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .rf-nav-open .rf-shade{z-index:80!important;background:rgba(10,14,20,.38)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .cw-ops .rf-menu{z-index:110!important}
}
