:root{ --cs-primary:#0a3d62; --cs-primary-600:#093453; --cs-accent:#2f6fab; --cs-muted:#637083; --cs-border:#e6e8ef; --cs-border-strong:#d8dde7; --cs-card:#ffffff; --cs-bg:#f6f8fb; --cs-hero:#f7f9fc; --cs-section:#f5f7fa; --cs-radius:.75rem; }
html,body{background:var(--cs-bg); color:#0e1629;} body{min-height:100dvh;}
.navbar{background:#ffffff;} .navbar.border-bottom{border-bottom:1px solid var(--cs-border)!important;}
.navbar .navbar-brand{font-weight:600; letter-spacing:.2px;} .navbar .nav-link{color:#374151;} .navbar .nav-link:hover{color:var(--cs-primary);}
/* Active state for navbar links */
.navbar .nav-link.active,
.navbar .nav-link[aria-current="page"]{
  color: var(--cs-primary) !important;
  font-weight: 600;
}

/* необязательная тонкая полоска под активным пунктом */
.navbar .nav-link.active::after,
.navbar .nav-link[aria-current="page"]::after{
  content: "";
  display: block;
  height: 2px;
  margin-top: 2px;
  background: var(--cs-primary);
  border-radius: 2px;
}
.hero{background:linear-gradient(180deg, rgba(10,61,98,0.04), rgba(10,61,98,0.00) 180px),repeating-linear-gradient(135deg, rgba(9,52,83,0.03) 0px, rgba(9,52,83,0.03) 2px, transparent 2px, transparent 10px),var(--cs-hero);border-bottom:1px solid var(--cs-border);}
.hero .badge-soft{display:inline-block; border:1px solid var(--cs-border); background:#f8fafc; color:#374151;}
.btn-primary{background:var(--cs-primary); border-color:var(--cs-primary);} .btn-primary:hover{background:var(--cs-primary-600); border-color:var(--cs-primary-600);}
.btn-outline-primary{color:var(--cs-primary); border-color:var(--cs-primary);} .btn-outline-primary:hover{background:var(--cs-primary); border-color:var(--cs-primary);}
.cs-card{background:linear-gradient(180deg,#ffffff,#fbfcff 80%); border:1px solid var(--cs-border); border-radius:var(--cs-radius); box-shadow:0 2px 10px rgba(16,24,40,0.04);}
.rounded-2xl{border-radius:var(--cs-radius)!important;} .shadow-soft{box-shadow:0 2px 10px rgba(16,24,40,0.04)!important;}
.icon-pill{width:44px;height:44px;display:grid;place-items:center;border-radius:.6rem;background:#f1f4f9;border:1px solid var(--cs-border);color:var(--cs-primary);}
.section-title{letter-spacing:.2px;} section{position:relative;} section+section{border-top:1px solid var(--cs-border);} #services{background:var(--cs-section);} #about{background:#fff;} #contact{background:var(--cs-section);}
a.link-underline{position:relative;text-decoration:none;color:var(--cs-accent);} a.link-underline::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:var(--cs-accent);transform:scaleX(0);transform-origin:left;transition:transform .18s;}
a.link-underline:hover::after{transform:scaleX(1);} .small-muted{font-size:.95rem;color:var(--cs-muted);} .text-secondary{color:#4b5563!important;}
.form-control,.form-select{border-color:var(--cs-border);box-shadow:none;background:#fff;} .form-control:focus,.form-select:focus{border-color:var(--cs-primary);outline:0;box-shadow:0 0 0 .2rem rgba(10,61,98,.08);}
.alert{border:1px solid var(--cs-border-strong);} .alert-success{background:#eefaf3;color:#145a32;border-color:#ccebd8;} .alert-danger{background:#fdf2f2;color:#7f1d1d;border-color:#f2c6c6;}
.footer{background:#0b1220;color:#cfd6e6;border-top:1px solid rgba(255,255,255,.06);} .footer .small i{color:#9fb6d6;}
.navbar-brand img{height:36px;width:auto;border-radius:.3rem;transition:transform .2s,filter .2s;} .navbar-brand:hover img{transform:scale(1.05);filter:brightness(1.1);}
.footer-logo{height:28px;width:auto;display:block;filter:drop-shadow(0 1px 0 rgba(0,0,0,.2));border-radius:.25rem;}
/* Chat widgets */
.cs-chat-btn{ position:fixed; right:16px; bottom:16px; z-index:1055; }
.cs-chat{ position:fixed; right:16px; bottom:76px; z-index:1055; width:320px; max-height:60vh; display:none; background:#fff; border:1px solid var(--cs-border); border-radius:12px; box-shadow:0 10px 30px rgba(16,24,40,.12); overflow:hidden; }
.cs-chat.open{ display:block; }
.cs-chat__head{ background:#0a3d62; color:#fff; padding:.6rem .8rem; display:flex; align-items:center; justify-content:space-between; }
.cs-chat__msgs{ height:44vh; min-height:260px; overflow:auto; padding:.8rem; background:#f7f9fc; }
.cs-chat__form{ display:flex; gap:.5rem; padding:.6rem; border-top:1px solid var(--cs-border); background:#fff; }
.cs-chat__form input{ flex:1; }
.cs-bubble{ max-width:80%; padding:.5rem .7rem; border-radius:12px; margin:.2rem 0; word-wrap:break-word; }
.cs-bubble.visitor{ background:#0d6efd; color:#fff; margin-left:auto; border-top-right-radius:4px; }
.cs-bubble.operator{ background:#fff; color:#111827; border:1px solid var(--cs-border); margin-right:auto; border-top-left-radius:4px; }
.cs-chat__hint{ color:#6b7280; font-size:.875rem; text-align:center; padding:.4rem 0; }
.cs-icon-btn{ background:transparent; border:0; color:#fff; opacity:.9; } .cs-icon-btn:hover{opacity:1;}

.cs-ops-btn{ position:fixed; right:16px; bottom:16px; z-index:1060; }
.cs-ops-badge{ position:absolute; top:-6px; right:-6px; font-size:.75rem; }
.cs-ops-panel{ position:fixed; right:16px; bottom:76px; z-index:1060; width:340px; max-height:70vh; display:none; background:#fff; border:1px solid var(--cs-border); border-radius:12px; overflow:hidden; box-shadow:0 10px 30px rgba(16,24,40,.12); }
.cs-ops-panel.open{ display:block; }
.cs-ops-head{ background:#0a3d62; color:#fff; padding:.6rem .8rem; display:flex; justify-content:space-between; align-items:center; }
.cs-ops-list{ max-height:28vh; overflow:auto; padding:.5rem; border-bottom:1px solid var(--cs-border); }
.cs-ops-item{ padding:.5rem; border:1px solid var(--cs-border); border-radius:10px; margin:.4rem 0; cursor:pointer; background:#fff; }
.cs-ops-item.unread{ border-color:#cfe2ff; background:#f8fbff; }
.cs-ops-preview{ color:#4b5563; font-size:.9rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hp-wrap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* === FAB-и над футером === */
:root{
  /* высота футера (под себя, ~64–72px обычно) */
  --footer-h: 72px;
  /* отступ от футера */
  --fab-gap: 16px;
  /* сдвиг Inbox относительно Chat по оси X */
  --ops-shift: 0px;
  /* итоговый отступ снизу для кнопок */
  --fab-bottom: calc(var(--footer-h) + var(--fab-gap));
}

/* Кнопки */
.cs-chat-btn{ position:fixed; right:16px; bottom:var(--fab-bottom); z-index:1060; }
.cs-ops-btn { position:fixed; right:calc(16px + var(--ops-shift)); bottom:var(--fab-bottom); z-index:1060; }

/* Панели открываются над кнопками */
.cs-chat{ position:fixed; right:16px; bottom:calc(var(--fab-bottom) + 60px); z-index:1060; }
.cs-ops-panel{ position:fixed; right:calc(16px + var(--ops-shift)); bottom:calc(var(--fab-bottom) + 60px); z-index:1060; }

/* чтобы футер не перекрывал тенью кнопки */
.footer{ position:relative; z-index:1; }

/* Dark theme variables */
:root[data-theme="dark"]{
  --cs-primary:#7fb7ff;
  --cs-primary-600:#5f96df;
  --cs-accent:#a8c5ff;
  --cs-muted:#9aa3b2;

  --cs-border:#1f2937;
  --cs-border-strong:#374151;

  --cs-card:#0f172a;
  --cs-bg:#0b1220;
  --cs-hero:#0b1220;
  --cs-section:#0b1220;
}

/* Base text color в тёмной теме */
:root[data-theme="dark"] html,
:root[data-theme="dark"] body{
  background:var(--cs-bg);
  color:#e5e7eb;
}

/* Navbar/links на тёмном */
:root[data-theme="dark"] .navbar{
  background:#0f172a;
  border-bottom:1px solid var(--cs-border)!important;
}
:root[data-theme="dark"] .navbar .nav-link{ color:#d1d5db; }
:root[data-theme="dark"] .navbar .nav-link:hover{ color:var(--cs-primary); }

/* Карточки, секции, хиро */
:root[data-theme="dark"] .cs-card{
  background:linear-gradient(180deg,#0f172a,#0b1220 80%);
  border-color:var(--cs-border);
  box-shadow:0 2px 10px rgba(0,0,0,.35);
}
:root[data-theme="dark"] .hero{
  background:linear-gradient(180deg, rgba(127,183,255,0.05), rgba(10,61,98,0.00) 180px), var(--cs-hero);
  border-bottom:1px solid var(--cs-border);
}
:root[data-theme="dark"] .hero .badge-soft{
  background:#101826;
  color:#cbd5e1;
  border-color:var(--cs-border);
}

/* Формы */
:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .form-select{
  background:#0f172a;
  color:#e5e7eb;
  border-color:var(--cs-border);
}
:root[data-theme="dark"] .form-control::placeholder{ color:#94a3b8; }
:root[data-theme="dark"] .form-control:focus,
:root[data-theme="dark"] .form-select:focus{
  border-color:var(--cs-primary);
  box-shadow:0 0 0 .2rem rgba(127,183,255,.15);
}

/* Иконки-бейджи и вторичный текст */
:root[data-theme="dark"] .icon-pill{
  background:#0f172a;
  border-color:var(--cs-border);
  color:#bfdbfe;
}

/* === Badge fix for dark theme === */
:root[data-theme="dark"] .badge {
  background: #1e293b;
  color: #e2e8f0;
  border-color: var(--cs-border);
}

:root[data-theme="dark"] .badge.text-bg-light {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border-color: var(--cs-border) !important;
}

:root[data-theme="dark"] .text-secondary{ color:#cbd5e1!important; }
:root[data-theme="dark"] .small-muted{ color:#9aa3b2; }
:root[data-theme="dark"] #about{ background: var(--cs-bg); }
:root[data-theme="dark"] .modal-content{ background: var(--cs-bg); }