/* Shared live CRM theme. Print documents and the isolated preview have separate styles. */
:root {
  --bg: #eeeee5;
  --surface: #fafaf3;
  --surface-2: #eceee2;
  --line: #d7dace;
  --line-2: #e2e4d8;
  --cream: #19211d;
  --cream-2: #4d5c50;
  --muted: #657162;
  --faint: #a9b3a1;
  --c-pine: #315f51;
  --c-build: #a9c6b1;
  --c-integrate: #557b85;
  --c-advise: #a26944;
  --c-educate: #ead095;
  --danger: #b63d20;
  --danger-soft: #c6442012;
  --good: #315f51;
  --good-soft: #315f5114;
  --warn: #876b1f;
  --warn-soft: #f1ce4630;
  --studio-charcoal: #191e1b;
  --studio-orange: #c64420;
  --studio-yellow: #f1ce46;
  --font-display: 'DM Sans', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'DM Sans', ui-sans-serif, system-ui, sans-serif;
  --radius: 18px;
  --radius-sm: 10px;
  --gutter: clamp(24px, 3.2vw, 52px);
}
body.crm-theme { background: var(--studio-charcoal); padding: 12px; }
.crm-theme .app-shell {
  position: relative; min-height: calc(100vh - 24px); border-radius: 26px;
  background: radial-gradient(ellipse at 24% 0%, #f8e7ab 0%, transparent 36%),
    radial-gradient(ellipse at 0% 12%, #f2d9ca 0%, transparent 34%),
    radial-gradient(ellipse at 97% 94%, #dce8d6 0%, transparent 46%), var(--bg);
  box-shadow: inset 0 1px 0 #ffffff80; isolation: isolate;
}
.crm-theme .app-main { background: transparent; margin-left: 90px; min-width: 0; }
.crm-theme .page-wrap { padding: 28px var(--gutter) 60px; max-width: 1720px; margin: auto; }
.studio-topbar { display: flex; align-items: center; gap: 30px; margin-bottom: 44px; min-width: 0; }
.studio-wordmark { display: inline-flex; align-items: center; gap: 9px; font-size: 22px; font-weight: 600; letter-spacing: -.9px; white-space: nowrap; color: var(--cream); text-decoration: none; }
.studio-wordmark:hover { text-decoration: none; }
.studio-mark { display: grid; place-items: center; width: 35px; height: 35px; background: var(--studio-charcoal); color: #faf8ed; border-radius: 11px; font-size: 26px; letter-spacing: -2px; padding-right: 2px; }
.studio-ai { font-weight: 400; }
.studio-topnav { display: flex; gap: 5px; margin-left: auto; }
.studio-topnav a { display: block; padding: 9px 17px; border-radius: 24px; font-size: 12px; text-decoration: none; color: var(--cream-2); }
.studio-topnav a[aria-current], .studio-topnav a:hover { background: var(--studio-charcoal); color: #faf8ed; }
.studio-account { flex-shrink: 0; width: 33px; height: 33px; display: grid; place-items: center; border: 3px solid #fff8; background: #dec6a7; color: #3e493b; border-radius: 50%; font-size: 12px; text-decoration: none; }
.crm-theme .sidebar {
  position: fixed; left: 24px; top: 109px; bottom: 24px; height: auto; width: 72px;
  padding: 10px 6px; gap: 0; border: 0; border-radius: 27px;
  background: var(--studio-charcoal); color: #e5e9df; box-shadow: 0 10px 25px #1a231c26;
  scrollbar-width: thin; scrollbar-color: #607164 transparent;
}
.crm-theme .sidebar-brand { display: none; }
.crm-theme .sidebar-nav { flex: 1; gap: 3px; }
.crm-theme .sidebar-link {
  position: relative; flex-direction: column; justify-content: center; gap: 3px; min-height: 44px;
  padding: 6px 2px; border-radius: 13px; border: 0; color: #c2cfc0; font-size: 9px; line-height: 1.2;
  text-align: center; flex-shrink: 0; font-weight: 400;
}
.crm-theme .sidebar-link:hover, .crm-theme .sidebar-link.is-active { background: #35483b; color: #fff9e8; padding-left: 2px; border: 0; }
.nav-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.crm-theme .sidebar .nav-badge { position: absolute; top: 2px; right: 2px; padding: 1px 4px; min-width: 16px; background: var(--studio-yellow); color: var(--studio-charcoal); font-size: 8px; }
.crm-theme .sidebar-footer { border-color: #72877440; padding-top: 8px; margin-top: 9px; }
.crm-theme .sidebar-user { display: none; }
.crm-theme .sidebar-footer .sidebar-link { min-height: 37px; }
.crm-theme h1 { font-weight: 500; letter-spacing: -1.6px; line-height: 1.12; }
.crm-theme .page-head { margin-bottom: 28px; }
.crm-theme .page-head h1 { font-size: clamp(30px, 3vw, 44px); }
.crm-theme .lede { max-width: 740px; font-size: 14px; line-height: 1.7; color: var(--cream-2); }
.crm-theme .eyebrow { font-size: 10px; letter-spacing: 1.2px; color: var(--muted); }
.crm-theme .eyebrow::before, .crm-theme .eyebrow::after { content: none; }
.crm-theme :is(.card, .dash-card, .today-card, .stats-bar, .empty-state, .harvey-card, .harvey-empty, .conn-status, .note-card, .network-card, .project-card) {
  border-radius: 21px; border-color: #ffffffd1;
  background: linear-gradient(135deg, #fffdf3c7, #f8faf5c7);
  box-shadow: inset 0 1px 0 #ffffffb0, 0 7px 22px #353c2905;
}
.crm-theme .card { padding: 25px; }
.crm-theme .card h2 { font-size: 17px; font-weight: 500; letter-spacing: -.4px; }
.crm-theme .stats-bar { padding: 22px; gap: 22px; }
.crm-theme .stat-value { font-weight: 500; letter-spacing: -1px; }
.crm-theme .stat-label { text-transform: none; letter-spacing: 0; font-size: 12px; }
.crm-theme .stat-hint { font-size: 11px; }
.crm-theme :is(.btn, button.btn, a.btn) { font-family: var(--font-body); border-radius: 25px; text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 500; line-height: 1.4; }
.crm-theme .btn.small { font-size: 12px; padding: 9px 15px; }
.crm-theme .btn-primary { background: var(--studio-charcoal); border-color: var(--studio-charcoal); color: #fffcef; }
.crm-theme .btn-primary:hover { background: #315f51; border-color: #315f51; }
.crm-theme .btn-danger, .crm-theme .btn.danger { color: var(--danger); }
.crm-theme input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
.crm-theme select, .crm-theme textarea { border-radius: 11px; background-color: #fcfcf5b3; border-color: #d2d8c9; color: var(--cream); font-family: var(--font-body); }
.crm-theme input[type=checkbox], .crm-theme input[type=radio] { accent-color: var(--c-pine); }
.crm-theme :is(button, a, input, select, textarea):focus-visible { outline: 2px solid #987d32; outline-offset: 3px; }
.crm-theme .flash { background: #edf2e2; border: 1px solid #cfddc6; border-radius: 14px; }
.crm-theme table { background: transparent; }
.crm-theme th { color: var(--muted); font-size: 11px; font-weight: 500; letter-spacing: .2px; }
.crm-theme td { border-color: #dce1d38c; }
.crm-theme :is(.view-toggle, .c-tabs, .internal-tabs) { border-radius: 24px; }
.crm-theme .c-tabs { padding: 5px; border-bottom: 0; background: #f5f6ed8c; gap: 4px; margin-bottom: 24px; flex-wrap: wrap; }
.crm-theme .c-tab { border: 0; border-radius: 22px; padding: 9px 15px; font-size: 12px; color: var(--cream-2); }
.crm-theme .c-tab.active { background: var(--studio-charcoal); color: #fff9e8; border: 0; }
.crm-theme .c-tab.active::after { display: none; }
.crm-theme .c-tab.active .tab-count { background: #ffffff24; color: #fff9e8; }
.crm-theme .c-header { padding: 26px; border-radius: 22px; border: 1px solid #fff9; background: linear-gradient(125deg,#fff8eabf,#f3f7ecb3); margin-bottom: 18px; }
.crm-theme .c-name-line h1 { font-size: 32px; }
.crm-theme .c-breadcrumb { font-size: 11px; margin-bottom: 17px; }
.crm-theme .c-contact-strip { font-size: 12px; gap: 12px; }
.crm-theme .profile-grid-row, .crm-theme .contact-card { border-color: #dce1d3; }
.crm-theme .contact-card { border-radius: 15px; padding: 19px; background: #f6f8ee; }
.crm-theme .contact-card-name { font-size: 17px; font-weight: 500; }
.crm-theme .contact-role-pill { border-radius: 16px; }
.crm-theme .profile-head h2, .crm-theme .contacts-head h2 { font-size: 18px; font-weight: 500; }
.crm-theme .home-greeting { font-size: clamp(32px, 3.5vw, 48px); letter-spacing: -1.7px; }
.crm-theme .home-name { color: var(--c-pine); }
.crm-theme .home-timestamp { font-size: 10px; letter-spacing: 1px; }
.crm-theme .home-section-label { text-transform: none; font-size: 17px; font-weight: 500; letter-spacing: -.3px; color: var(--cream); }
.crm-theme .dash-card { padding: 25px; }
.crm-theme .dash-card-head h3 { font-size: 14px; font-weight: 500; letter-spacing: 0; }
.crm-theme .dash-big-num { font-size: 38px; font-weight: 500; letter-spacing: -1.5px; }
.crm-theme .dash-grid-state .dash-card:first-child {
  background: linear-gradient(135deg,#376757,#2e584c); color: #faf8eb;
  --cream: #faf8eb; --cream-2: #e0e8d8; --muted: #d1e0cc; border-color: #ffffff40;
}
.crm-theme .dash-grid-state .dash-card:nth-child(2) { background: var(--studio-yellow); border-color: #f9df78; --cream: #28291b; --cream-2: #424632; --muted: #575e3c; }
.crm-theme .dash-grid-state .dash-card:nth-child(3) { background: var(--studio-charcoal); color: #faf8eb; --cream: #faf8eb; --cream-2: #e0e8d8; --muted: #d1e0cc; border-color: #414c40; }
.crm-theme .dash-grid-state .dash-card :is(h3, .dash-big-num, strong) { color: var(--cream); }
.crm-theme .dash-grid-state .dash-sub, .crm-theme .dash-stage-label { color: var(--muted); }
.crm-theme .dash-stage-track { background: #ffffff20; }
.crm-theme .dash-stage-count { color: var(--cream); }
.crm-theme :is(.tp-roadmap, .tp-project, .tp-empty-state, .tp-modal) { border-radius: 21px; border-color: #ffffffd1; background: #fafbf3d9; }
.crm-theme .tp-cal { overflow-x: auto; }
.crm-theme :is(.tp-cal-head, .tp-cal-row) { min-width: 820px; }
.crm-theme .tp-newbtn { background: var(--studio-charcoal); color: #fffcef; border-radius: 25px; text-transform: none; letter-spacing: 0; }
.crm-theme .tp-cal-day-today { color: #fffcef; }
.crm-theme :is(.tp-header h1, .tp-roadmap-title h2) { font-style: normal; font-weight: 500; }
.crm-theme .today-card { padding: 20px; }
.crm-theme .today-card h3 { font-size: 14px; font-weight: 500; }
.crm-theme .pipeline-col { background: #e5e8db80; border-radius: 19px; padding: 10px; }
.crm-theme .pipeline .lead-card { background: #fbfcf5; border: 1px solid #ffffffbd; border-radius: 16px; box-shadow: 0 5px 14px #283b2606; }
.crm-theme .pipeline-col[data-stage='Scoped'] .lead-card { background: #315f51; --cream: #faf8eb; --cream-2: #e0e8d8; --muted: #d1e0cc; color: #faf8eb; }
.crm-theme .pipeline-col[data-stage='In Build'] .lead-card { background: #c64420; --cream: #fff9ef; --cream-2: #fff0df; --muted: #ffe8d2; color: #fff9ef; }
.crm-theme .pipeline-col[data-stage='Discovery'] .lead-card { background: #f1ce46; --cream: #28291b; --cream-2: #424632; --muted: #575e3c; }
.crm-theme .pipeline .lead-card h3, .crm-theme .pipeline .lead-card a { color: inherit; }
.crm-theme .pipeline .lead-card .deal-value { color: var(--cream); }
.crm-theme .clients-list { border-radius: 20px !important; border-color: #fff !important; background: #fbfcf4c4 !important; }
.crm-theme .harvey-hero { background: linear-gradient(120deg,#315f51,#254b3e); box-shadow: inset 0 1px 0 #ffffff24; }
.crm-theme .harvey-settings, .crm-theme .harvey-dialog { background: #fafbf3; border-color: #fff; border-radius: 21px; }
.crm-theme .harvey-card .harvey-fit { background: #f1ce464d; color: #62511b; }
.crm-theme .harvey-status { background: transparent; }
.crm-theme .harvey-notice { background: #f6e9b98c; border-color: #fff8; border-radius: 15px; }
.crm-theme .conn-status-ok { background: #e4efdc; border-color: #cbdcc2; }
.crm-theme .conn-label { color: var(--c-pine); }
.crm-theme dialog, .crm-theme .modal-content, .crm-theme .modal-card { border-radius: 23px; background: #f8f9ef; border-color: #fff; }
.crm-theme dialog::backdrop { background: #29332766; backdrop-filter: blur(5px); }
.crm-theme.is-signed-out .app-main { margin-left: 0; }
.crm-theme.is-signed-out .app-shell { align-items: center; }
@media (max-height: 850px) and (min-width: 901px) {
  .crm-theme .sidebar { top: 100px; bottom: 20px; }
  .crm-theme .sidebar-link { min-height: 37px; padding-block: 4px; gap: 2px; font-size: 8px; }
  .crm-theme .sidebar .nav-icon { width: 16px; height: 16px; }
}
@media (max-width: 1100px) {
  .studio-topbar { gap: 14px; }
  .studio-topnav a { padding: 8px 12px; }
  .crm-theme .c-header { flex-wrap: wrap; gap: 18px; }
}
@media (max-width: 900px) {
  body.crm-theme { padding: 7px; }
  .crm-theme .app-shell { min-height: calc(100vh - 14px); border-radius: 22px; }
  .crm-theme .app-main { margin-left: 0; }
  .crm-theme .page-wrap { padding: 26px 24px 50px; }
  .crm-theme .sidebar { left: 0; top: 0; bottom: 0; height: 100dvh; width: 240px; padding: 70px 15px 20px; border-radius: 0 24px 24px 0; z-index: 30; }
  .crm-theme .sidebar-link { flex-direction: row; justify-content: flex-start; gap: 13px; padding: 11px 15px; font-size: 13px; min-height: 41px; }
  .crm-theme .sidebar-link.is-active { padding-left: 15px; }
  .crm-theme .sidebar .nav-badge { position: static; margin-left: auto; font-size: 10px; }
  .crm-theme .sidebar-user { display: block; color: #cbd8c7; }
  .crm-theme .mobile-hamburger { top: 26px; left: 22px; width: 35px; height: 35px; background: #f9f9ed; border-color: #d1d9c9; border-radius: 50%; }
  .studio-topbar { flex-wrap: wrap; gap: 14px; margin-bottom: 30px; padding-left: 45px; }
  .studio-wordmark { font-size: 20px; }
  .studio-account { margin-left: auto; }
  .studio-topnav { order: 3; margin-left: -45px; width: calc(100% + 45px); gap: 3px; padding-top: 8px; }
  .studio-topnav a { font-size: 12px; padding: 8px 15px; }
  .crm-theme .card { padding: 20px; }
  .crm-theme .stats-bar { flex-wrap: wrap; }
}
@media (max-width: 600px) {
  .crm-theme .page-wrap { padding-inline: 18px; }
  .studio-wordmark { font-size: 18px; gap: 7px; }
  .studio-mark { width: 29px; height: 29px; font-size: 22px; border-radius: 9px; }
  .studio-topbar { gap: 10px; }
  .studio-account { width: 29px; height: 29px; }
  .crm-theme .page-head.with-actions { flex-wrap: wrap; gap: 16px; }
  .crm-theme .c-header { padding: 20px; }
  .crm-theme .c-name-line { flex-wrap: wrap; }
  .crm-theme .c-name-line h1 { font-size: 27px; overflow-wrap: anywhere; }
  .crm-theme .c-header-actions { flex-wrap: wrap; }
  .crm-theme .c-tab { padding: 8px 10px; font-size: 11px; }
  .crm-theme .dash-card { padding: 21px; }
  .crm-theme .tp-roadmap { padding: 20px 16px; }
  .crm-theme .tp-roadmap-title { flex-wrap: wrap; gap: 14px; }
  .crm-theme .btn { white-space: normal; }
  .crm-theme .studio-topnav a { padding-inline: 13px; }
}
@media (prefers-reduced-motion: reduce) { .crm-theme *, .crm-theme *::before, .crm-theme *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }
@media print {
  body.crm-theme { padding: 0; background: white; }
  .crm-theme .sidebar, .studio-topbar, .crm-theme .mobile-hamburger { display: none !important; }
  .crm-theme .app-main { margin: 0; }
  .crm-theme .app-shell { background: white; box-shadow: none; }
}
