/* V2 foundation. Published custom brand tokens continue to own colors, font and radii. */
html[data-crm-ui="v2"] { --sidebar-width: 248px; --header-height: 60px; --font-mono: 'Geist Mono', monospace; --secondary: #0E6B40; --secondary-hover: #0A5733; --danger: #A8200F; --danger-hover: #8F1A0A; --accent: #8A4B00; font-size: 14px; }
/* Only the validated default stylesheet receives the design's default palette. */
html[data-crm-ui="v2"]:not([data-brand-client]),
html[data-crm-ui="v2"]:has(link[data-crm-brand-stylesheet][href$="/client/css/default"]),
html[data-crm-ui="v2"]:has(link[data-crm-brand-stylesheet][href$="/css/default/default"]) {
    --primary: #00707F; --primary-hover: #005C69; --primary-light: #E3F6F8; --primary-rgb: 0,112,127;
    --primary-color: #00707F; --primary-dark: #005C69; --brand-link: #00707F; --brand-link-hover: #005C69; --brand-on-accent: #FFFFFF;
    --bg-primary: #F3F5F6; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF; --bg-tertiary: #F8FAFA; --bg-input: #FFFFFF; --bg-hover: #EEF3F4;
    --text-primary: #0B1F2A; --text-secondary: #3E525C; --text-muted: #5B6D76; --text-inverse: #FFFFFF;
    --border-color: #E1E6E9; --border-focus: #00707F;
    --font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --radius-sm: 9px; --radius-md: 9px; --radius-lg: 12px; --radius-xl: 14px;
}
html[data-crm-ui="v2"][data-theme="dark"] { color-scheme: dark; --secondary: #7AD9A1; --secondary-hover: #9CEAB9; --danger: #FFA398; --danger-hover: #FFC0B9; --accent: #FFD180; }
html[data-crm-ui="v2"][data-theme="dark"]:not([data-brand-client]),
html[data-crm-ui="v2"][data-theme="dark"]:has(link[data-crm-brand-stylesheet][href$="/client/css/default"]),
html[data-crm-ui="v2"][data-theme="dark"]:has(link[data-crm-brand-stylesheet][href$="/css/default/default"]) {
    --primary: #087F8D; --primary-hover: #0A92A1; --primary-light: #123B43; --primary-rgb: 8,127,141;
    --primary-color: #71DCE5; --primary-dark: #9EEBF0; --brand-link: #71DCE5; --brand-link-hover: #9EEBF0;
    --bg-primary: #101C23; --bg-secondary: #17272F; --bg-card: #17272F; --bg-tertiary: #1D303A; --bg-input: #13232B; --bg-hover: #203841;
    --text-primary: #EBF2F5; --text-secondary: #C0D0D7; --text-muted: #9AB0BA; --border-color: #314752; --border-focus: #71DCE5;
}
html[data-crm-ui="v2"] body { background: var(--bg-primary); color: var(--text-primary); font-family: var(--font-family); line-height: 1.45; font-variant-numeric: tabular-nums; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .toast-container) { font-family: var(--font-family); }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay) :is(h1, .page-title) { font-size: 22px; line-height: 1.3; font-weight: 650; letter-spacing: -.025em; }
html[data-crm-ui="v2"] .page-content { padding: 24px; min-width: 0; }
html[data-crm-ui="v2"] .page-content :is(h2, h3, .card-title) { font-weight: 650; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .main-header) .btn {
    min-height: 36px; gap: 8px; padding: 8px 13px; border-radius: var(--radius-md); font-size: 13px; font-weight: 600; line-height: 1.35; box-shadow: none; transform: none;
}
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .main-header) .btn-primary { background: var(--primary); color: var(--brand-on-accent); border: 1px solid transparent; box-shadow: none; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .main-header) .btn-primary:hover { background: var(--primary-hover); box-shadow: none; transform: none; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay) .btn-secondary { background: var(--bg-secondary); border: 1px solid var(--border-color); color: var(--text-primary); }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay) :is(.btn:disabled, button:disabled) { opacity: .55; cursor: not-allowed; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .crm-v2-shell) :is(button, a, input, select, textarea, summary):focus-visible { outline: 2px solid var(--border-focus, var(--brand-link)); outline-offset: 3px; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .modal-overlay) :is(.form-control, .form-input, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, textarea) { background-color: var(--bg-input); color: var(--text-primary); border-color: var(--border-color); border-radius: var(--radius-md); min-height: 38px; font-family: inherit; font-size: 14px; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .modal-overlay) :is(input, textarea)::placeholder { color: var(--text-muted); opacity: 1; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .modal-overlay) :is(label, .form-label) { font-size: 12.5px; font-weight: 600; }
html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay) .card { background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-lg); box-shadow: none; }
html[data-crm-ui="v2"] .page-content :is(.card-header, .card-footer) { border-color: var(--border-color); }
html[data-crm-ui="v2"] .page-content :is(.table-container, .table-responsive, .table-wrap) { max-width: 100%; overflow-x: auto; border-radius: var(--radius-lg); }
html[data-crm-ui="v2"] .page-content table { width: 100%; font-size: 13px; border-collapse: collapse; }
html[data-crm-ui="v2"] .page-content th { color: var(--text-secondary); background: var(--bg-tertiary); font-size: 12px; font-weight: 600; white-space: nowrap; }
html[data-crm-ui="v2"] .page-content :is(th, td) { border-color: var(--border-color); padding: 12px 16px; }
html[data-crm-ui="v2"] .page-content tbody tr:hover { background: var(--bg-hover); }
html[data-crm-ui="v2"] .page-content :is(.empty-state, .error-state, .enriched-empty-state) { padding: 36px 20px; text-align: center; color: var(--text-secondary); }
html[data-crm-ui="v2"] .page-content :is(.empty-icon, .empty-state-icon) { color: var(--brand-link); font-size: 28px; }
html[data-crm-ui="v2"] :is(.auth-wrapper, .page-content, .modal-overlay) .spinner { border-color: var(--border-color); border-top-color: var(--brand-link); }
html[data-crm-ui="v2"] .page-content .page-guide-banner { display: none; }
html[data-crm-ui="v2"] .modal-overlay { background: rgba(5,35,48,.48); backdrop-filter: none; padding: 16px; }
html[data-crm-ui="v2"] .modal-overlay :is(.modal, .modal-content) { background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-color); border-radius: var(--radius-xl); box-shadow: 0 24px 80px rgba(5,35,48,.2); max-width: 100%; max-height: calc(100dvh - 32px); }
html[data-crm-ui="v2"] .toast-container { max-width: min(420px, calc(100vw - 32px)); }
html[data-crm-ui="v2"] .toast-container .toast { border: 1px solid var(--border-color); background: var(--bg-secondary); color: var(--text-primary); box-shadow: 0 6px 24px rgba(5,35,48,.12); border-radius: var(--radius-md); }
@media (max-width: 768px) {
    html[data-crm-ui="v2"] .page-content { padding: 16px; }
    html[data-crm-ui="v2"] :is(.page-content, .auth-wrapper, .onboarding-overlay, .crm-v2-overlay, .modal-overlay, .main-header) :is(.btn, .form-control, .form-input, select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])) { min-height: 44px; }
    html[data-crm-ui="v2"] .toast-container { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) {
    html[data-crm-ui="v2"] :is(.crm-v2-shell, .crm-v2-overlay, .auth-wrapper, .onboarding-overlay) * { scroll-behavior: auto; transition-duration: .01ms; animation-duration: .01ms; animation-iteration-count: 1; }
}

/* Onboarding channel preparation and canonical account evidence. */
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(230px, 1fr); gap: 24px; margin-top: 24px; text-align: left; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-grid h3 { margin: 0 0 16px; font-size: 14px; font-weight: 650; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-guide ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 17px; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-guide li { display: flex; align-items: flex-start; gap: 12px; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-guide li > span { display: grid; place-items: center; flex: 0 0 32px; height: 32px; border-radius: var(--radius-md); background: var(--primary-light); color: var(--brand-link); font-weight: 650; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-guide strong { font-size: 13px; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-grid p { margin: 5px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--text-secondary); }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-prepare { padding: 14px; margin-top: 20px; background: var(--bg-tertiary); border: 1px solid var(--border-color); border-radius: var(--radius-md); }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status { padding: 20px; align-self: start; min-width: 0; background: var(--bg-tertiary); border: 1px solid var(--border-color); border-radius: var(--radius-lg); }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status .crm-v2-setup-channel-state { margin-bottom: 16px; font-size: 13px; font-weight: 650; color: var(--text-primary); }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status [data-setup-channel-status="recorded"] { color: var(--secondary); }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status li { display: grid; gap: 4px; padding: 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-md); font-size: 12px; overflow-wrap: anywhere; }
html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-status > button { margin-top: 16px; }
@media (max-width: 1000px) { html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 768px) { html[data-crm-ui="v2"] .crm-v2-setup .crm-v2-setup-channel-grid .onboarding-btn { min-height: 44px; } }
html[data-crm-ui="v2"] .crm-v2-meta-connection { padding:16px; margin-bottom:24px; background:var(--bg-card); border:1px solid var(--border-color); border-radius:var(--radius-md); }
html[data-crm-ui="v2"] .crm-v2-meta-connection .crm-v2-meta-stages { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; padding:0; list-style:none; }
html[data-crm-ui="v2"] .crm-v2-meta-connection .crm-v2-meta-stages li { display:block; padding:5px 8px; border-radius:6px; font-size:11px; color:var(--text-muted); background:var(--bg-tertiary); }
html[data-crm-ui="v2"] .crm-v2-meta-connection .crm-v2-meta-stages li[aria-current] { color:var(--brand-link); outline:1px solid var(--border-focus); }
html[data-crm-ui="v2"] .crm-v2-meta-connection .crm-v2-meta-stages li.complete { color:var(--text-primary); }