/* ═══════════════════════════════════════════════════════════════════════════
   admin.bulgharhomes.com като Mac версия на BH CRM. 15.09.2026.
   Раффи: „искам admin.bulgharhomes.com да е Mac версията на приложението… модерна, готина“;
   одобрено по картинка („Супер е“).

   Пласт над admin.html и admin-crm.css: същите токени, видът на родното приложение
   (тъмносиньо меню, бели карти върху кремаво, инициали, IBM Plex Serif за числа).
   На широк екран (≥1180px) „Днес“, „Хора“ и „Дневник“ стоят вляво, а избраният човек
   се отваря вдясно (#content.split, логиката е в switchView на admin.html).
   Тъмна тема няма нарочно: § 5ц казва, че admin.html не се пипа за нея.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Числата: IBM Plex Serif 700 от шрифтовете на сайта (admin хостът ги пуска, § 5п). Сменя ли се хешът
   на Design export-а, пътят тук се сменя с него. */
@font-face { font-family: 'BH Plex'; font-weight: 700; font-display: swap;
  src: url('../ds/bulghar-homes-design-system-019e27ca-c6b4-7400-851f-333dd01623b2/fonts/ibm-plex-serif-700-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'BH Plex'; font-weight: 700; font-display: swap;
  src: url('../ds/bulghar-homes-design-system-019e27ca-c6b4-7400-851f-333dd01623b2/fonts/ibm-plex-serif-700-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }


body { font-family: var(--mac-ui); background: var(--mac-paper); font-feature-settings: "locl" 0; }
.btn, .sb-nav-item, .stat-label, .tbl th, .badge, .doc-status, .prop-badge { font-family: var(--mac-ui); }
.crm-num, .crm-kpi b, .stat-value { font-family: var(--mac-num); font-weight: 700; }

/* ── Меню вляво ───────────────────────────────────────────────────────── */
#sidebar { width: 252px; padding: 14px 12px 12px; border-right: 0;
  background: linear-gradient(180deg, var(--hero-from) 0%, var(--navy-deep) 100%); }
.sb-logo { border: 0; padding: 10px 6px 16px; }
.sb-logo-wrap { gap: 11px; }
.sb-logo img { width: 38px; height: 38px; padding: 6px; border-radius: 11px; background: var(--navy); box-shadow: inset 0 0 0 1px rgba(203, 178, 106, .35); }
.sb-logo-text strong { font-family: var(--mac-num); font-size: 16.5px; letter-spacing: -.01em; }
.sb-logo-text small { color: rgba(245, 237, 214, .66); letter-spacing: .14em; font-size: 10px; }
.sb-search { font-family: inherit; display: flex; align-items: center; gap: 8px; width: 100%; height: 34px; padding: 0 10px; margin: 0 0 12px;
  border: 0; border-radius: 9px; background: rgba(245, 237, 214, .08); color: rgba(245, 237, 214, .72); font-size: 13px; cursor: pointer; text-align: left; }
.sb-search:hover { background: rgba(245, 237, 214, .12); }
.sb-search svg { width: 14px; height: 14px; flex: none; }
.sb-search span { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-search kbd { font: 600 11px var(--mac-ui); background: rgba(245, 237, 214, .12); border-radius: 5px; padding: 1px 6px; }
.sb-nav { padding: 0; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
.sb-nav-item { border-radius: 9px; border-right: 0; padding: 9px 10px; font-size: 14px; font-weight: 500; color: rgba(245, 237, 214, .82); }
.sb-nav-item:hover { background: rgba(245, 237, 214, .07); color: var(--cream); }
.sb-nav-item.active { background: rgba(203, 178, 106, .16); color: var(--gold-light); font-weight: 600; border-right-color: transparent; }
.sb-nav-item svg { width: 18px; height: 18px; opacity: .9; }
.sb-nav-item .tag-unread { margin-left: auto; background: var(--mac-late); color: #fff; font-family: var(--mac-num); font-size: 11px; padding: 1px 7px; }
#sb-inq-badge.tag-unread { background: var(--gold); color: var(--navy-deep); }
.sb-group { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(245, 237, 214, .62); padding: 16px 10px 6px; }
.sb-sep { display: none; }
.sb-new { font-family: inherit; margin-top: 12px; height: 42px; border: 0; border-radius: 11px; background: var(--gold); color: var(--navy-deep);
  font-size: 14.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; }
.sb-new:hover { background: var(--gold-light); }
.sb-new:focus-visible, .sb-search:focus-visible, .sb-nav-item:focus-visible, .sb-logout:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.sb-footer { border: 0; padding: 14px 4px 2px; display: flex; align-items: center; gap: 10px; }
.sb-me { width: 30px; height: 30px; border-radius: 50%; background: var(--gold); color: var(--navy-deep); display: grid; place-items: center; font: 700 13px var(--mac-num); flex: none; }
.sb-admin-info { margin: 0; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12.5px; color: rgba(245, 237, 214, .8); }
.sb-logout { background: none; border: 0; color: rgba(245, 237, 214, .72); width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; cursor: pointer; }
.sb-logout:hover { background: rgba(245, 237, 214, .08); color: var(--cream); }

/* ── Изгледите ────────────────────────────────────────────────────────── */
#content { background: var(--mac-paper); }
.crm-top { background: transparent; border-bottom: 0; padding: 24px 28px 4px; position: static; align-items: flex-end; }
.crm-top h1 { font-family: var(--mac-num); font-size: 34px; letter-spacing: -.01em; line-height: 1.1; }
.crm-top .crm-sub-title { font-size: 12.5px; font-weight: 600; color: var(--ink-3); margin-top: 4px; }
.crm-wrap { padding: 12px 28px 48px; gap: 20px; }
.crm-btn { border-radius: 10px; font-family: inherit; }
.crm-btn-sm { border-radius: 9px; }
.crm-btn-pri:hover { background: var(--navy-mid); }

.crm-kpis { gap: 10px; }
.crm-kpi { border: 0; border-radius: 14px; padding: 13px 14px; box-shadow: 0 1px 0 var(--mac-line); }
.crm-kpi b { font-size: 28px; }
.crm-kpi b.red { color: var(--mac-late); }

.crm-section-h h2 { font-size: 12px; letter-spacing: .09em; }
.crm-section-h h2 .n { font-family: var(--mac-num); }
.crm-list { gap: 0; background: var(--bg-card); border-radius: var(--mac-radius); overflow: hidden; }
.crm-row { border: 0; border-radius: 0; padding: 12px 14px; gap: 12px; background: var(--bg-card); }
.crm-row + .crm-row { box-shadow: inset 0 1px 0 var(--mac-line); }
.crm-row::before { display: none; }
.crm-row.sel { background: var(--mac-gold-wash); }
.crm-row-main:hover .crm-name { color: var(--gold-ink); }
.crm-name { font-size: 15px; font-weight: 600; }
.crm-meta .late { color: var(--mac-late); }
.crm-av { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: var(--mac-soft); color: var(--navy); font: 700 14px var(--mac-num); }
/* 09.10.2026 (Дебъг 3, т. 15): --gold-ink върху --mac-gold-wash е 4.39:1 при 12-14 px; #6b5924 е 5.68:1 */
.crm-row.sev-red .crm-av, .crm-row.sev-gold .crm-av { background: var(--mac-gold-wash); color: var(--gold-ink-deep); }
.crm-av svg { width: 17px; height: 17px; }
.crm-chip { border-radius: 8px; }
.crm-note { border: 0; border-radius: 14px; background: var(--mac-gold-wash); }
.crm-empty { border: 0; border-radius: var(--mac-radius); }
.crm-box { border: 0; border-radius: var(--mac-radius); padding: 16px 18px; }
.crm-box-h h3 { font-size: 11.5px; }
.crm-deal { border-color: var(--mac-line); border-radius: 12px; }
.crm-step { border-radius: 8px; }
.crm-sheet { border-radius: 18px; }
.crm-field input, .crm-field select, .crm-field textarea, .crm-input { border-radius: 10px; }
details.crm-more > summary { font-weight: 600; }

/* ── Картата на човек: горната част като в приложението ───────────────── */
.crm-hero { background: linear-gradient(160deg, var(--hero-from), var(--navy-deep)); color: var(--cream); padding: 26px 30px 22px;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap; border-radius: 0 0 26px 26px; }
.crm-hero-back { width: 100%; color: var(--gold-light); font-size: 14px; text-decoration: none; }
.crm-hero-av { width: 84px; height: 84px; border-radius: 50%; background: var(--gold); color: var(--navy-deep); display: grid; place-items: center;
  font: 700 30px var(--mac-num); box-shadow: 0 0 0 5px rgba(203, 178, 106, .22); flex: none; }
.crm-hero-main { flex: 1; min-width: 220px; }
.crm-hero h1 { font-family: var(--mac-num); font-size: 28px; line-height: 1.15; color: var(--cream); }
.crm-hero .crm-chips { margin-top: 9px; }
.crm-hero .crm-chip { background: rgba(245, 237, 214, .13); border-color: transparent; color: var(--cream); }
.crm-hero .crm-chip.warn { background: rgba(219, 192, 120, .22); color: var(--gold-light); }
.crm-hero .crm-chip.red { background: rgba(214, 120, 110, .24); color: var(--cream); }
.crm-hero .crm-chip.green { background: rgba(140, 190, 160, .22); color: var(--cream); }
.crm-hero .crm-chip.gold { background: rgba(203, 178, 106, .22); color: var(--gold-light); }
.crm-hero-acts { display: flex; gap: 10px; }
.crm-q { font-family: inherit; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 58px; font-size: 11.5px; font-weight: 600;
  color: rgba(245, 237, 214, .88); text-decoration: none; background: none; border: 0; cursor: pointer; }
.crm-q i { width: 50px; height: 50px; border-radius: 15px; background: rgba(245, 237, 214, .12); display: grid; place-items: center; }
.crm-q i svg { width: 20px; height: 20px; stroke: var(--cream); fill: none; stroke-width: 2; }
.crm-q:hover i { background: rgba(245, 237, 214, .2); }
.crm-q.gold i { background: var(--gold); }
.crm-q.gold i svg { stroke: var(--navy-deep); }
.crm-q[aria-disabled="true"] { opacity: .35; pointer-events: none; }
.crm-q:focus-visible { outline: none; }
.crm-q:focus-visible i { outline: 2px solid var(--gold-light); outline-offset: 2px; }
#view-contact > .crm-wrap { padding-top: 18px; }

/* ── „Фирма“ в браузъра ───────────────────────────────────────────────── */
.crm-fin { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.crm-fin-m { background: var(--mac-paper); border-radius: 14px; padding: 13px 14px; display: flex; flex-direction: column; gap: 6px; }
.crm-fin-m h4 { font-size: 14px; font-weight: 600; color: var(--ink); text-transform: capitalize; }
.crm-fin-m div { display: flex; justify-content: space-between; font-size: 13px; color: var(--ink-2); }
.crm-fin-m b { font-family: var(--mac-num); font-size: 15px; color: var(--ink); }
.crm-fin-m b.gold { color: var(--gold-ink); }
.crm-fin-m b.late { color: var(--mac-late); }
.crm-idrow { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid var(--mac-line); }
.crm-idrow:first-of-type { border-top: 0; }
.crm-idrow .crm-av { width: 34px; height: 34px; }
.crm-idrow .crm-av.late { background: var(--mac-late-wash); color: var(--mac-late); }
.crm-copy { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--mac-line); font-size: 14px; }
.crm-copy:first-of-type { border-top: 0; }
.crm-copy dt { color: var(--ink-3); font-size: 13px; }
.crm-copy dd { color: var(--ink); word-break: break-word; }

/* ── „Предстои“: публикациите и задачите по дни (16.09.2026) ─────────── */
.crm-wrap.crm-up { display: grid; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); gap: 22px; align-items: start; }
.crm-up-side { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 16px; }
.crm-up-side .crm-kpis { grid-template-columns: 1fr 1fr 1fr; }
.crm-up-side .crm-kpi b { font-size: 24px; }
.crm-up-hero { background: linear-gradient(160deg, var(--hero-from), var(--navy-deep)); color: var(--cream); border-radius: var(--mac-radius); padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.crm-up-hero span { font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-light); }
.crm-up-hero b { font-family: var(--mac-num); font-size: 20px; line-height: 1.25; }
.crm-up-hero small { font-size: 13px; color: rgba(245, 237, 214, .8); }
.crm-up-alert { background: var(--mac-late-wash); border-radius: var(--mac-radius); padding: 13px 16px; display: flex; flex-direction: column; gap: 3px; font-size: 13.5px; color: var(--ink); }
.crm-up-alert b { color: var(--mac-late); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; }
.crm-up-chans { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.crm-up-chan { background: var(--mac-paper); border-radius: 12px; padding: 9px 11px; display: grid; grid-template-columns: 1fr auto; align-items: baseline; }
.crm-up-chan span { font-size: 13px; font-weight: 600; color: var(--ink); }
.crm-up-chan b { font-family: var(--mac-num); font-size: 18px; color: var(--ink); }
.crm-up-chan small { grid-column: 1 / -1; font-size: 12px; color: var(--ink-3); }
.crm-up-chan.warn small { color: var(--mac-late); font-weight: 600; }
.crm-up-feed { display: flex; flex-direction: column; gap: 14px; }
.crm-up-day { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: start; }
.crm-up-date { display: flex; flex-direction: column; align-items: center; background: var(--bg-card); border-radius: 14px; padding: 8px 4px; line-height: 1.1; position: sticky; top: 16px; }
.crm-up-date b { font-family: var(--mac-num); font-size: 24px; color: var(--ink); }
.crm-up-date span { font-size: 11px; font-weight: 700; color: var(--ink-2); margin-top: 2px; }
.crm-up-date small { font-size: 11px; color: var(--ink-3); }
.crm-up-day.today .crm-up-date { background: var(--navy); }
.crm-up-day.today .crm-up-date b, .crm-up-day.today .crm-up-date span { color: var(--gold-light); }
.crm-up-day.today .crm-up-date small { color: rgba(245, 237, 214, .7); }
.crm-up-item { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 12px 14px; color: var(--ink); text-decoration: none; background: var(--bg-card); }
.crm-up-item + .crm-up-item { box-shadow: inset 0 1px 0 var(--mac-line); }
a.crm-up-item:hover { background: var(--mac-list); }
a.crm-up-item:hover .crm-up-title { color: var(--gold-ink); }
.crm-up-time { font-family: var(--mac-num); font-size: 14px; color: var(--ink-2); padding-top: 1px; }
.crm-up-item.k-task .crm-up-time { font-family: var(--mac-ui); font-size: 12.5px; font-weight: 600; color: var(--gold-ink); }
.crm-up-main { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.crm-up-title { font-size: 15px; font-weight: 600; line-height: 1.3; }
.crm-up-main small { font-size: 12.5px; color: var(--ink-3); }
.crm-up-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.crm-up-tag { font-size: 11.5px; font-weight: 700; padding: 2px 7px; border-radius: 7px; background: var(--mac-soft); color: var(--ink-2); }
.crm-up-tag.task { background: var(--mac-gold-wash); color: var(--gold-ink); }
.crm-up-st { font-size: 11.5px; font-weight: 700; padding: 2px 7px; border-radius: 7px; }
.crm-up-st.st-ok { background: var(--success-wash); color: var(--success-ink); }
.crm-up-st.st-unclear { background: var(--mac-gold-wash); color: var(--gold-ink); }
.crm-up-st.st-gap { background: var(--mac-late-wash); color: var(--mac-late); }
.crm-up-go { color: var(--gold-ink); font-weight: 700; }
@media (max-width: 1180px) { .crm-wrap.crm-up { grid-template-columns: 1fr; } .crm-up-side { position: static; } }
@media (max-width: 820px) {
  .crm-up-day { grid-template-columns: 1fr; gap: 6px; }
  .crm-up-date { position: static; flex-direction: row; gap: 6px; background: transparent; padding: 0 4px; align-items: baseline; }
  .crm-up-date b { font-size: 18px; }
  .crm-up-day.today .crm-up-date { background: transparent; }
  .crm-up-day.today .crm-up-date b, .crm-up-day.today .crm-up-date span { color: var(--gold-ink); }
  .crm-up-item { grid-template-columns: 56px minmax(0, 1fr) auto; }
}

/* ── Широк екран: списъкът вляво, човекът вдясно ──────────────────────── */
@media (min-width: 1180px) {
  .crm-hero-back { display: none; }
  #content.split { display: grid; grid-template-columns: minmax(380px, 440px) minmax(0, 1fr); height: 100vh; overflow: hidden; }
  #content.split > .split-list { height: 100vh; overflow-y: auto; background: var(--mac-list); border-right: 1px solid var(--mac-line); min-height: 0; }
  #content.split > #view-contact { height: 100vh; overflow-y: auto; min-height: 0; }
  #content.split > .split-list .crm-top { padding: 22px 18px 4px; }
  #content.split > .split-list .crm-top h1 { font-size: 30px; }
  #content.split > .split-list .crm-top-actions { display: none; }
  #content.split > .split-list .crm-wrap { padding: 10px 16px 40px; gap: 16px; }
  #content.split > .split-list .crm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #content.split > .split-list .crm-row-act > :not(a[href^="tel:"]):not([data-act="convert"]) { display: none; }
  #content.split > .split-list .crm-row2 { grid-template-columns: 1fr !important; }
  #content.split #view-contact .crm-wrap { max-width: none; }
}

/* ── Старите изгледи (портал, имоти, запитвания) в същия вид ──────────── */
.topbar { background: transparent; border-bottom: 0; padding: 24px 28px 6px; }
.topbar-title { font-family: var(--mac-num); font-size: 30px; }
.stat-card, .table-card { border: 0; border-radius: var(--mac-radius); }
.tbl th { background: var(--mac-list); }

/* ── Телефон в браузъра: стъклена лента ───────────────────────────────── */
@media (max-width: 820px) {
  .crm-tabbar { left: 10px; right: 10px; bottom: calc(8px + env(safe-area-inset-bottom)); border: 0; border-radius: 30px; padding: 6px 4px;
    background: rgba(255, 255, 255, .8); -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6);
    box-shadow: 0 8px 30px rgba(22, 28, 51, .14); }
  #content { padding-bottom: calc(var(--crm-tabbar-h) + 26px + env(safe-area-inset-bottom)); }
  .crm-top { padding: calc(16px + env(safe-area-inset-top)) 16px 4px; }
  .crm-top h1 { font-size: 30px; }
  .crm-hero { padding: calc(16px + env(safe-area-inset-top)) 18px 20px; }
  .crm-hero-acts { width: 100%; justify-content: space-between; }
  .crm-row { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .crm-row-main { flex: 1 1 60%; }
  .crm-row-act { width: 100%; padding-left: 50px; }
  .crm-copy { grid-template-columns: 90px minmax(0, 1fr) auto; }
}
