/* Global product identity, shared by every account. No stored theme flags.
   Map colours and geometry deliberately remain in styles.css / mobile.css. */
:root {
  --brand-primary: #086b57;
  --brand-primary-hover: #075b4b;
  --brand-accent: #00d95f; /* Existing logo identity; logo artwork stays intact. */
  --brand-dark: #123c35;
  --brand-text: #18332e;
  --brand-muted: #60766f;
  --brand-soft: #f0f8f4;
  --surface: #fff;
  --surface-secondary: #f7f9f8;
  --border: #dde7e3;
  --border-strong: #cadad4;
  --danger: #a33a3a;
  --danger-bg: #fff5f5;
  --ui-focus-soft: rgb(8 107 87 / 14%);
  --ui-border-accent: rgb(8 107 87 / 32%);
  --ui-radius-control: 12px;
  --ui-radius-card: 14px;
  --ui-radius-pill: 999px;
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-6: 24px;
  --ui-shadow-float: 0 8px 28px rgb(18 60 53 / 10%);
}
/* Scope all presentation defaults away from Leaflet and its controls. */
:where(.topbar,.sidebar,.mobile-ui,.dialog-card,.call-notebook-panel) {
  color: var(--brand-text);
  --muted: var(--brand-muted);
  --line: var(--border);
  --panel: var(--surface);
}
.topbar { background: var(--surface); border-color: var(--border); box-shadow: none; gap: var(--ui-space-4); }
.brand-title { color: var(--brand-dark); font-weight: 700; letter-spacing: -.035em; }
.topbar-actions { gap: var(--ui-space-2); }
.hotel-count,.email-queue-button,.refresh-button {
  min-height: 44px; padding: 10px 16px; border: 1px solid var(--border);
  border-radius: var(--ui-radius-pill); background: var(--surface); color: var(--brand-primary);
  font-weight: 600; box-shadow: none;
}
.hotel-count { background: var(--brand-soft); color: var(--brand-dark); }
.email-queue-button:hover,.refresh-button:hover { background: var(--brand-soft); border-color: var(--border-strong); box-shadow: none; }
/* One count/badge system across the header, hotel panel and CRM queues. */
.email-queue-count,.acquisition-count,.acquisition-workflow-tabs strong,
.recent-handled-count,.recent-handled-heading > span,.call-queue-date-badge,
.upcoming-call-date,#call-notebook-heading-count,.acquisition-crm-badge {
  display: inline-flex; align-items: center; justify-content: center; min-height: 24px;
  padding: 4px 8px; border: 0; border-radius: var(--ui-radius-pill);
  color: var(--brand-primary); background: var(--brand-soft); font-weight: 600; box-shadow: none;
}
.sidebar,.search-panel,.acquisition-panel { background: var(--surface); box-shadow: none; }
.workspace-mode-bar { border-bottom-color: var(--border); }
.workspace-mode-switch,.search-mode-switch {
  background: var(--surface-secondary); border: 1px solid var(--border);
  border-radius: var(--ui-radius-control); box-shadow: none; padding: 4px; gap: 4px;
}
.workspace-mode-tab { display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--brand-dark); border-radius: 8px; font-weight: 600; }
.workspace-mode-tab svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.workspace-mode-tab.is-active { background: var(--brand-primary); color: var(--surface); box-shadow: none; }
.workspace-mode-tab:not(.is-active):hover { background: var(--brand-soft); color: var(--brand-primary); }
.search-mode-tab { border-radius: 8px; color: var(--brand-muted); font-weight: 500; }
.search-mode-tab.is-active { background: var(--brand-soft); color: var(--brand-primary); box-shadow: inset 0 -2px var(--brand-primary); }
.acquisition-workflow-tabs { gap: 8px; margin-bottom: 16px; }
.acquisition-workflow-tabs button { border-color: var(--border); border-radius: var(--ui-radius-control); color: var(--brand-muted); background: var(--surface); font-weight: 600; }
.acquisition-workflow-tabs button:hover { background: var(--brand-soft); border-color: var(--border-strong); }
.acquisition-workflow-tabs button.is-active { background: var(--brand-primary); color: var(--surface); border-color: var(--brand-primary); box-shadow: none; }
.acquisition-workflow-tabs button.is-active strong { color: var(--brand-primary); background: var(--brand-soft); }
:where(.sidebar,.mobile-ui,.dialog-card) :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {
  border-color: var(--border); border-radius: var(--ui-radius-control); background-color: var(--surface); color: var(--brand-text); box-shadow: none;
}
:where(.sidebar,.mobile-ui) :is(input:not([type=checkbox]):not([type=radio]),select) { min-height: 44px; }
:where(.topbar,.sidebar,.mobile-ui,.dialog-card,.call-notebook-panel) :is(button,a,input,select,textarea,[tabindex]):focus-visible {
  outline: 3px solid var(--brand-primary); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ui-focus-soft);
}
:where(.sidebar,.mobile-ui,.dialog-card) :is(input,select,textarea):focus { border-color: var(--brand-primary); }
:where(.topbar,.sidebar,.mobile-ui,.dialog-card) button:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
:where(.topbar,.sidebar,.mobile-ui,.dialog-card) button:not(:disabled):active { filter: brightness(.96); }
.school-search input,.custom-hotel-search input {
  padding-left: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2360766f' stroke-width='1.7'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 14px center;
}
:where(.sidebar,.dialog-card,.call-notebook-panel) .eyebrow { color: var(--brand-muted); font-size: .68rem; font-weight: 600; letter-spacing: .09em; }
:where(.sidebar,.dialog-card,.call-notebook-panel) :is(h2,h3,h4) { color: var(--brand-dark); }
.acquisition-school-card,.call-queue-card,.upcoming-call-card,.hotel-card {
  background: var(--surface); border-color: var(--border); border-radius: var(--ui-radius-card); box-shadow: none;
}
.acquisition-school-card:hover,.acquisition-school-card:focus-within { border-color: var(--border-strong); box-shadow: none; transform: none; }
.acquisition-school-card.has-crm { border-width: 1px; border-color: var(--border-strong); box-shadow: inset 3px 0 var(--brand-primary); }
.acquisition-school-card.has-crm:hover,.acquisition-school-card.has-crm:focus-within { box-shadow: inset 3px 0 var(--brand-primary); }
.acquisition-school-actions { gap: 8px; padding: 12px; border-top-color: var(--border); background: var(--surface); }
.acquisition-school-action { min-height: 40px; border: 1px solid var(--border); border-radius: 10px; color: var(--brand-muted); background: var(--surface); box-shadow: none; font-weight: 600; }
.acquisition-school-action:hover { background: var(--surface-secondary); border-color: var(--border-strong); }
.acquisition-school-action.is-email { background: var(--brand-soft); color: var(--brand-primary); border-color: var(--border-strong); }
.acquisition-school-action.is-call,.call-queue-call,.call-queue-save,.primary-dialog-action { background: var(--brand-primary); border-color: var(--brand-primary); color: var(--surface); box-shadow: none; }
.acquisition-school-action.is-call:hover,.call-queue-call:hover,.call-queue-save:hover,.primary-dialog-action:hover { background: var(--brand-primary-hover); color: var(--surface); }
.acquisition-school-action.is-note { color: var(--brand-muted); border-color: var(--border); background: var(--surface); }
.acquisition-warning-filter { background: var(--surface); border-color: var(--border); color: var(--danger); }
.acquisition-warning-filter:hover,.acquisition-warning-filter.is-active { background: var(--danger-bg); border-color: var(--danger); box-shadow: none; }
.acquisition-warning-filter strong { color: var(--danger); background: var(--danger-bg); }
.acquisition-school-card.has-warning { border-color: var(--danger); box-shadow: inset 3px 0 var(--danger); }
:where(.sidebar) :is(.empty-state,.recent-handled-empty,.acquisition-empty,.call-queue-empty) {
  padding: 16px; border: 0; border-radius: var(--ui-radius-control); background: var(--surface-secondary); color: var(--brand-muted); box-shadow: none; line-height: 1.6;
}
.recent-handled-section,.results-section { border-color: var(--border); }
.upcoming-call-note,.call-note-schedule-summary,.acquisition-completed-next { background: var(--brand-soft); color: var(--brand-text); }
.detail-tabs button.is-active { color: var(--brand-primary); border-color: var(--brand-primary); }
@media (max-width: 767px) {
  .mobile-toolbar,.mobile-nav { background: var(--surface); border-color: var(--border); }
  .mobile-search,.mobile-filter,.mobile-sheet-actions button { border-color: var(--border); border-radius: var(--ui-radius-control); color: var(--brand-dark); box-shadow: none; }
  .mobile-sheet { background: var(--surface); border-color: var(--border); box-shadow: var(--ui-shadow-float); }
  .mobile-nav button[aria-current=page],.mobile-type-chips button[aria-pressed=true] { background: var(--brand-soft); color: var(--brand-primary); border-color: var(--border-strong); }
  .mobile-primary,.mobile-sheet-actions button:first-child { background: var(--brand-primary); color: var(--surface); border-color: var(--brand-primary); }
  .mobile-ui .acquisition-school-action { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  :where(.topbar,.sidebar,.mobile-ui) *, :where(.topbar,.sidebar,.mobile-ui) *::before { transition: none; }
}
/* Existing account/status controls, shared between every private workspace. */
aside[aria-label="Soukromé CRM"] { color: var(--brand-text); }
aside[aria-label="Soukromé CRM"] :is(button,a) {
  display: inline-flex; align-items: center; justify-content: center; min-height: 32px;
  padding: 4px 10px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); color: var(--brand-primary); text-decoration: none; font: inherit;
}
aside[aria-label="Soukromé CRM"] :is(button,a):hover { background: var(--brand-soft); }
aside[aria-label="Soukromé CRM"] :is(button,a):focus-visible { outline: 3px solid var(--brand-primary); outline-offset: 2px; }
@media (max-width: 767px) {
  /* Same account node/handlers, hosted in More instead of covering navigation. */
  .mobile-more-pane aside[aria-label="Soukromé CRM"] {
    position: static !important; max-width: 100% !important; margin-top: 16px;
    box-shadow: none !important; border-color: var(--border) !important;
  }
  .mobile-more-pane aside[aria-label="Soukromé CRM"] :is(button,a) { min-height: 44px; }
}
@media (max-width: 767px) {
  .mobile-ui .topbar-actions .email-queue-button > span { display: inline; }
  .mobile-ui .topbar-actions .email-queue-button > svg { display: block; flex: 0 0 18px; }
}