/* SIDATA brand header. Scoped to the header; the CRM workspace is unchanged. */
header.top {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 82px;
  padding: 10px 24px;
  gap: 5px 3px;
  align-items: center;
  color: #243c50;
  background: linear-gradient(112deg, #f9fcff 0%, #eaf4fc 42%, #f6faff 72%, #fff9e9 100%);
  border-bottom: 1px solid #dce8f0;
  box-shadow: 0 4px 24px #224e6c08;
}
header.top::before {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  left: -70px;
  top: -100px;
  width: 440px;
  height: 300px;
  background: radial-gradient(ellipse at 35% 40%, #82c8ea38, transparent 57%), radial-gradient(ellipse at 70% 65%, #ffdc6d30, transparent 48%);
  animation: sidata-aurora 16s ease-in-out infinite alternate;
  will-change: transform;
}
header.top .logo {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-shrink: 0;
  min-width: 180px;
  height: 56px;
  margin: 0 18px 0 0;
  padding: 6px 15px;
  border: 1px solid #ffffff;
  border-radius: 16px;
  background: #ffffffec;
  box-shadow: 0 3px 16px #336a8c0a, inset 0 0 0 1px #e8f1f7;
  letter-spacing: 0;
}
header.top .logo img {display: block; width: 126px; height: 42px; object-fit: contain;}
header.top .logo .brand-crm {color: #607f94; font-size: 10px; font-weight: 600; letter-spacing: 1.7px; border-left: 1px solid #dfe9ef; padding-left: 10px;}
header.top .logo::before, header.top .logo::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  background: #408db7;
  opacity: .5;
  left: 5px;
  top: 13px;
  animation: sidata-orbit 9s ease-in-out infinite alternate;
}
header.top .logo::after {width: 4px; height: 4px; background: #e7ba39; left: auto; right: 8px; top: auto; bottom: 9px; animation-delay: -4s;}
header.top a {
  color: #496579;
  padding: 11px 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  transition: background-color .2s ease, color .2s ease;
}
header.top a:hover {color: #1e638b; background: #ffffffa3;}
header.top a.on {color: #205f83; background: #ffffffc9; border-color: #d6e7f1; box-shadow: 0 2px 7px #35698406;}
header.top a:focus-visible {outline: 2px solid #408db7; outline-offset: 3px;}
header.top .who {color: #526d80; font-size: 12px; line-height: 1.8;}
header.top .who select {background: #ffffffc9; color: #3c5a70; border: 1px solid #d4e3ed; border-radius: 9px; padding: 5px 8px; margin-right: 7px;}
header.top a.exit {padding: 6px 10px; color: #607a8d; font-size: 12px; background: #ffffff80; border-color: #dce7ee;}
@keyframes sidata-aurora {from {transform: translate3d(-12px, 0, 0) rotate(-5deg);} to {transform: translate3d(24px, 9px, 0) rotate(5deg);}}
@keyframes sidata-orbit {from {transform: translate3d(0, 0, 0); opacity: .3;} to {transform: translate3d(3px, 12px, 0); opacity: .65;}}
@media (max-width: 1200px) {
  header.top {padding: 10px 18px; gap: 5px;}
  header.top .sp {display: none;}
  header.top .logo {margin-right: 12px;}
  header.top .who {margin-left: auto;}
}
@media (max-width: 680px) {
  header.top {padding: 10px 12px; gap: 5px 3px;}
  header.top .logo {min-width: 156px; height: 50px; padding: 5px 8px; gap: 7px; margin-right: 0; order: 0; border-radius: 13px;}
  header.top .logo img {width: 108px; height: 36px;}
  header.top .logo .brand-crm {font-size: 9px; padding-left: 8px; letter-spacing: 1px;}
  header.top .who {order: 1; flex: 1 1 110px; min-width: 0; font-size: 11px; text-align: right;}
  header.top .who select {display: block; margin: 0 0 2px auto; max-width: 100%; font-size: 11px;}
  header.top::after {content: ""; flex-basis: 100%; order: 2; height: 0;}
  header.top a.exit {order: 4; margin-left: 0;}
  header.top > a:not(.exit) {order: 3; padding: 7px 9px; font-size: 12px;}
}
@media (prefers-reduced-motion: reduce) {
  header.top::before, header.top .logo::before, header.top .logo::after {animation: none; will-change: auto;}
  header.top a {transition: none;}
}

header.top .logo {border-color: transparent; background: transparent; box-shadow: none;}

/* Two clear sections, with the related tools below the header. */
header.top .primary-nav {display:flex;align-items:center;gap:6px;}
header.top .primary-nav a {display:inline-flex;align-items:center;gap:4px;}
.section-nav {display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);}
.section-nav a {display:inline-flex;align-items:center;gap:5px;padding:8px 15px;border-radius:8px;color:var(--muted);font-weight:500;text-decoration:none;}
.section-nav a:hover {background:var(--sky);color:var(--blue-d);}
.section-nav a.selected {background:var(--sky);color:var(--blue-d);box-shadow:inset 0 0 0 1px var(--line);}
.section-nav a:focus-visible {outline:2px solid var(--blue);outline-offset:2px;}
@media(max-width:680px){header.top .primary-nav{order:3;flex:1;gap:5px;}header.top .primary-nav a{padding:8px 12px;font-size:13px;} .section-nav{gap:3px;margin-bottom:14px;} .section-nav a{padding:7px 10px;font-size:12px;}}

/* Compact mobile header and a two-row summary. */
header.top .mobile-menu {display:contents;}
header.top .menu-toggle {display:none;}
@media(max-width:680px){
 header.top.has-mobile-menu {min-height:70px;justify-content:space-between;gap:4px;padding:8px 12px;}
 header.top.has-mobile-menu::after {display:none;}
 header.top.has-mobile-menu .logo {margin-right:0;}
 header.top.has-mobile-menu .menu-toggle {display:inline-flex;align-items:center;gap:7px;order:1;min-height:40px;padding:8px 10px;background:#ffffffa6;color:#305b76;border:1px solid #d7e5ed;border-radius:10px;font-size:12px;}
 header.top.has-mobile-menu .menu-toggle:focus-visible {outline:2px solid #408db7;outline-offset:2px;}
 header.top.has-mobile-menu .mobile-menu {display:none;order:2;flex-basis:100%;padding:12px 0 3px;border-top:1px solid #dce8ee;margin-top:6px;}
 header.top.has-mobile-menu .mobile-menu[data-open=true] {display:flex;flex-direction:column;align-items:stretch;gap:12px;}
 header.top.has-mobile-menu .mobile-menu .primary-nav {order:0;flex:0 0 auto;gap:7px;}
 header.top.has-mobile-menu .mobile-menu .primary-nav a {flex:1;justify-content:center;}
 header.top.has-mobile-menu .mobile-menu .who {order:1;flex:0 0 auto;margin:0;text-align:left;font-size:12px;}
 header.top.has-mobile-menu .mobile-menu .who select {display:block;width:100%;max-width:none;margin:0 0 7px;font-size:13px;}
 header.top.has-mobile-menu .mobile-menu .exit {order:2;align-self:flex-start;margin:0;}
 .stats {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;}
 .stats .stat {grid-column:span 2;min-width:0;padding:8px 5px;text-align:center;font-size:11px;line-height:1.4;}
 .stats .stat:nth-child(n+4) {grid-column:span 3;}
 .stats .stat b {font-size:15px;white-space:nowrap;}
}

/* Summary counters act as accessible quick filters. */
.stats button.stat {background:var(--card);color:var(--muted);border:1px solid var(--line);font-weight:400;cursor:pointer;text-align:left;transition:background-color .15s ease,border-color .15s ease;}
.stats button.stat b {color:var(--ink);}
.stats button.stat:hover {background:var(--sky);border-color:var(--blue);filter:none;}
.stats button.stat.active {background:var(--sky);border-color:var(--blue);color:var(--blue-d);box-shadow:inset 0 0 0 1px var(--blue);}
.stats button.stat:focus-visible {outline:2px solid var(--blue);outline-offset:3px;}
.stat-filter-summary {display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 0 12px;padding:9px 12px;background:var(--sky);border:1px solid var(--line);border-radius:8px;color:var(--blue-d);font-size:13px;}
@media(max-width:680px){.stats button.stat{text-align:center;}}
@media(prefers-reduced-motion:reduce){.stats button.stat{transition:none;}}

/* Lead title: clear, gentle entry into the card. */
.board .card a.t {
 display:flex;align-items:center;justify-content:space-between;gap:12px;
 min-height:44px;box-sizing:border-box;margin:0 0 10px;padding:10px 12px;
 border-radius:9px;background:var(--sky);color:var(--blue-d);
 box-shadow:0 3px 10px rgba(54,122,160,.13);
 font-weight:650;line-height:1.45;text-decoration:none;overflow-wrap:anywhere;
 transition:background-color .18s ease,box-shadow .18s ease;
}
.board .card a.t::after {content:"\2192";flex:0 0 auto;font-size:20px;font-weight:500;line-height:1;}
@media(hover:hover){.board .card a.t:hover {background:color-mix(in srgb,var(--sky) 80%,var(--blue) 20%);box-shadow:0 5px 15px rgba(54,122,160,.22);text-decoration:none;}}
.board .card a.t:focus-visible {outline:2px solid var(--blue);outline-offset:3px;box-shadow:0 4px 14px rgba(54,122,160,.22);}
@media(prefers-reduced-motion:reduce){.board .card a.t{transition:none;}}

/* Larger lead creation and search controls. */
main .row:has(>input[placeholder^="Пошук:"]) {gap:10px;align-items:center;}
main .row:has(>input[placeholder^="Пошук:"]) >button.sun {
 flex:0 0 156px;min-height:48px;padding:12px 18px;border:0;border-radius:10px;
 color:#fff;font-size:15px;font-weight:700;line-height:1.35;white-space:nowrap;
 background:linear-gradient(115deg,#244e91 0%,#247c9c 35%,#3165af 68%,#244e91 100%);
 background-size:280% 100%;box-shadow:0 5px 22px rgba(45,166,235,.48),0 0 12px rgba(98,205,255,.3);
 animation:sidata-lead-gradient 7s ease-in-out infinite,sidata-lead-glow 2.4s ease-in-out infinite;
 transition:filter .18s ease,transform .18s ease;
}
main .row:has(>input[placeholder^="Пошук:"]) >button.sun:hover {filter:brightness(1.09);}
main .row:has(>input[placeholder^="Пошук:"]) >button.sun:active {transform:translateY(1px);}
main .row:has(>input[placeholder^="Пошук:"]) >button.sun:focus-visible {outline:3px solid var(--blue);outline-offset:4px;}
main .row >input[placeholder^="Пошук:"] {
 flex:1 1 260px;max-width:440px;min-width:0;min-height:48px;box-sizing:border-box;
 padding:12px 14px;border-radius:10px;font-size:15px;
}
@keyframes sidata-lead-gradient {0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes sidata-lead-glow {0%,100%{box-shadow:0 5px 22px rgba(45,166,235,.48),0 0 12px rgba(98,205,255,.3),0 0 0 2px rgba(78,188,250,.12)}50%{box-shadow:0 7px 32px rgba(35,158,238,.72),0 0 20px rgba(104,211,255,.55),0 0 0 5px rgba(78,188,250,.22)}}
@media(max-width:680px){
 main .row:has(>input[placeholder^="Пошук:"]) >button.sun {flex-basis:138px;padding:12px 14px;font-size:14px;}
 main .row >input[placeholder^="Пошук:"] {flex:1 1 calc(100% - 148px);max-width:none;font-size:14px;}
}
@media(prefers-reduced-motion:reduce){
 main .row:has(>input[placeholder^="Пошук:"]) >button.sun {animation:none;transition:none;}
}

/* A brighter light sweep across the new-lead button. */
main .row:has(>input[placeholder^="Пошук:"]) >button.sun {position:relative;overflow:hidden;isolation:isolate;}
main .row:has(>input[placeholder^="Пошук:"]) >button.sun::after {
 content:"";position:absolute;inset:-60% auto -60% -85%;width:55%;pointer-events:none;
 background:linear-gradient(90deg,transparent,rgba(255,255,255,.22) 22%,rgba(255,255,235,.78) 50%,rgba(255,255,255,.22) 78%,transparent);
 transform:skewX(-22deg);animation:sidata-lead-shine 4.5s ease-in-out infinite;
}
@keyframes sidata-lead-shine {0%,12%{left:-85%;opacity:0}18%{opacity:1}42%{left:145%;opacity:1}48%,100%{left:145%;opacity:0}}
@media(prefers-reduced-motion:reduce){main .row:has(>input[placeholder^="Пошук:"]) >button.sun::after {display:none;animation:none;}}
