/* ============================================================
   ROIbooster — brand theme override (светлая тема лендинга)
   Подключается ПОСЛЕ Bootstrap и встроенных стилей. Логику не трогает,
   только перекрашивает Bootstrap-компоненты и кастомные классы.
   Manrope + JetBrains Mono · акцент #f24e22
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  --bg:#faf6ef; --bg-2:#f2ede3; --surface:#ffffff; --surface-2:#f7f4ee;
  --line:rgba(20,16,12,0.10); --line-2:rgba(20,16,12,0.16);
  --fg:#1a1714; --muted:rgba(26,23,20,0.62); --faint:rgba(26,23,20,0.40);
  --accent:#f24e22; --accent-2:#e8480f; --accent-ink:#ffffff;
  --good:#1f9d62; --bad:#d6492c; --warn:#c98a16;
  --font:'Manrope',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;

  /* Bootstrap-переменные для широкого охвата */
  --bs-body-font-family:var(--font);
  --bs-body-bg:var(--bg);
  --bs-body-color:var(--fg);
  --bs-border-color:var(--line);
  --bs-primary:#f24e22; --bs-primary-rgb:242,78,34;
  --bs-success:#1f9d62; --bs-success-rgb:31,157,98;
  --bs-link-color:#f24e22; --bs-link-hover-color:#e8480f;
  --bs-border-radius:12px; --bs-border-radius-sm:9px; --bs-border-radius-lg:16px;
}

body{
  font-family:var(--font) !important;
  color:var(--fg);
  background:
    radial-gradient(1000px 560px at 100% -8%, rgba(242,78,34,0.07), transparent 56%),
    radial-gradient(760px 480px at -6% 2%, rgba(242,78,34,0.04), transparent 55%),
    var(--bg) !important;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent);color:#fff;}

h1,h2,h3,h4,h5,.fw-bold,.fw-semibold{letter-spacing:-0.02em;}
.text-muted{color:var(--muted) !important;}
.mono,code,kbd{font-family:var(--mono);}

/* ---------- карточки ---------- */
.card{
  background:var(--surface) !important;
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  box-shadow:0 16px 40px -30px rgba(40,30,20,0.30) !important;
}
.card-header{
  background:var(--surface-2) !important;
  border-bottom:1px solid var(--line) !important;
  border-radius:16px 16px 0 0 !important;
  font-weight:700 !important; letter-spacing:-0.01em;
  color:var(--fg) !important;
}
.card-header.bg-primary{ background:var(--accent) !important; color:#fff !important; }
.card-header.bg-white{ background:var(--surface) !important; }
.bg-white{ background:var(--surface) !important; }

/* ---------- кнопки ---------- */
.btn{ font-weight:700 !important; border-radius:11px !important; letter-spacing:-0.01em; }
.btn-primary{
  background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important;
  box-shadow:0 12px 30px -14px rgba(242,78,34,0.85) !important;
}
.btn-primary:hover{ background:var(--accent-2) !important; border-color:var(--accent-2) !important; transform:translateY(-1px); }
.btn-success{ background:var(--good) !important; border-color:var(--good) !important; color:#fff !important; }
.btn-dark{ background:var(--fg) !important; border-color:var(--fg) !important; }
.btn-outline-primary{ color:var(--accent) !important; border-color:color-mix(in srgb,var(--accent) 50%,transparent) !important; background:transparent !important; }
.btn-outline-primary:hover{ background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; }
.btn-outline-success{ color:var(--good) !important; border-color:color-mix(in srgb,var(--good) 50%,transparent) !important; }
.btn-outline-success:hover{ background:var(--good) !important; color:#fff !important; }
.btn-outline-info{ color:#127a86 !important; border-color:rgba(18,122,134,0.45) !important; }
.btn-outline-info:hover{ background:#127a86 !important; color:#fff !important; }
.btn-outline-secondary{ color:var(--muted) !important; border-color:var(--line-2) !important; }
.btn-outline-secondary:hover{ background:var(--fg) !important; border-color:var(--fg) !important; color:#fff !important; }
.btn-transition,.btn{ transition:transform .15s, background .18s, border-color .18s, box-shadow .2s; }

/* ---------- формы ---------- */
.form-control,.form-select{
  background:var(--surface-2) !important; border:1px solid var(--line) !important;
  border-radius:10px !important; color:var(--fg) !important; font-family:var(--font);
}
.form-control:focus,.form-select:focus{
  border-color:var(--accent) !important; background:var(--surface) !important;
  box-shadow:0 0 0 3px rgba(242,78,34,0.14) !important;
}
.form-control::placeholder{ color:var(--faint) !important; }
.form-label{ font-weight:600 !important; font-size:0.9rem; }
.form-text{ color:var(--faint) !important; }
.form-check-input:checked{ background-color:var(--accent) !important; border-color:var(--accent) !important; }
.form-check-input:focus{ border-color:var(--accent) !important; box-shadow:0 0 0 3px rgba(242,78,34,0.14) !important; }

/* ---------- вкладки ---------- */
.nav-tabs{ border-bottom:1px solid var(--line) !important; }
.nav-tabs .nav-link{ color:var(--muted) !important; font-weight:600 !important; border:none !important; border-bottom:2px solid transparent !important; }
.nav-tabs .nav-link:hover{ color:var(--fg) !important; }
.nav-tabs .nav-link.active{ color:var(--fg) !important; font-weight:700 !important; background:transparent !important; border-bottom:2px solid var(--accent) !important; }

/* ---------- бейджи ---------- */
.badge.bg-success{ background:color-mix(in srgb,var(--good) 14%,transparent) !important; color:var(--good) !important; border:1px solid color-mix(in srgb,var(--good) 35%,transparent); font-weight:600; border-radius:8px; }
.badge.bg-primary{ background:color-mix(in srgb,var(--accent) 14%,transparent) !important; color:var(--accent) !important; border:1px solid color-mix(in srgb,var(--accent) 35%,transparent); font-weight:600; border-radius:8px; }
.badge.bg-secondary,.badge.bg-warning{ background:color-mix(in srgb,var(--warn) 16%,transparent) !important; color:var(--warn) !important; border:1px solid color-mix(in srgb,var(--warn) 35%,transparent); font-weight:600; border-radius:8px; }
.text-success{ color:var(--good) !important; }
.text-danger{ color:var(--bad) !important; }

/* ---------- таблицы ---------- */
.table{ --bs-table-bg:transparent; color:var(--fg); }
.table thead th{
  background:var(--surface-2) !important; color:var(--muted) !important;
  font-family:var(--mono); font-size:0.72rem !important; font-weight:500 !important;
  letter-spacing:0.05em; text-transform:uppercase; border-bottom:1px solid var(--line) !important;
}
.table tbody td{ border-bottom:1px solid var(--line) !important; font-size:0.86rem; vertical-align:middle; }
.table-hover tbody tr:hover{ background:color-mix(in srgb,var(--fg) 3%,transparent) !important; }

/* ============================================================
   Кастомные классы (из встроенного <style>)
   ============================================================ */
.stat-card{ background:var(--surface) !important; border:1px solid var(--line); border-radius:14px !important; box-shadow:0 12px 30px -26px rgba(40,30,20,0.3) !important; }
.stat-card .value{ color:var(--accent) !important; font-family:var(--mono); font-weight:700; letter-spacing:-0.03em; }
.stat-card .label{ color:var(--muted) !important; }

.chart-wrap{ background:var(--surface) !important; border:1px solid var(--line); border-radius:16px !important; box-shadow:0 12px 30px -26px rgba(40,30,20,0.3) !important; }
.chart-title{ color:var(--fg) !important; letter-spacing:-0.01em; }

/* фильтры */
.filter-bar{ background:var(--surface) !important; border:1px solid var(--line); border-radius:16px !important; box-shadow:0 14px 36px -28px rgba(40,30,20,0.3) !important; }
.filter-label{ color:var(--faint) !important; font-family:var(--mono); }
.filter-select{ background:var(--surface-2) !important; border:1px solid var(--line) !important; border-radius:10px !important; color:var(--fg) !important; }
.filter-select:focus{ border-color:var(--accent) !important; background:var(--surface) !important; }
.filter-select.is-active{ border-color:var(--accent) !important; background:color-mix(in srgb,var(--accent) 10%,transparent) !important; color:var(--accent) !important; }
.date-input-wrap input{ background:var(--accent) !important; border:1px solid var(--accent) !important; border-radius:10px !important; color:#fff !important; font-weight:600; }
.filter-reset-btn:hover{ color:var(--bad) !important; }
.filter-footer{ border-top:1px solid var(--line) !important; }

/* flatpickr */
.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange{ background:var(--accent) !important; border-color:var(--accent) !important; }
.flatpickr-day.inRange{ background:color-mix(in srgb,var(--accent) 16%,transparent) !important; border-color:transparent !important; color:var(--fg) !important; }

/* FB-метрики */
.fb-metric-card{ background:var(--surface) !important; border:1px solid var(--line); border-radius:13px !important; box-shadow:0 12px 30px -26px rgba(40,30,20,0.3) !important; }
.fb-metric-label{ color:var(--faint) !important; font-family:var(--mono); }
.fb-metric-val{ color:var(--fg) !important; font-family:var(--mono); font-weight:700; letter-spacing:-0.03em; }

/* лог-консоль */
.log-box{ background:#14130f !important; color:#46e3a0 !important; border:1px solid var(--line); border-radius:10px !important; font-family:var(--mono) !important; }

/* карточки клиентов (index) */
.client-card{ transition:box-shadow .2s, transform .15s; }
.client-card:hover{ box-shadow:0 18px 44px -26px rgba(40,30,20,0.4) !important; transform:translateY(-1px); }
.badge-status{ font-family:var(--mono); }

/* лоадер — перекрасим в брендовую палитру */
.loader-bars span:nth-child(1){ background:var(--accent) !important; }
.loader-bars span:nth-child(2){ background:var(--good) !important; }
.loader-bars span:nth-child(3){ background:var(--warn) !important; }
.loader-bars span:nth-child(4){ background:var(--accent-2) !important; }
.loader-bars span:nth-child(5){ background:var(--accent) !important; }
.loader-progress-bar{ background:linear-gradient(90deg,var(--accent),var(--good)) !important; }
.loader-label{ color:var(--muted) !important; font-family:var(--mono); }

/* ---------- фирменный знак в шапке ---------- */
.rb-mark{
  width:34px;height:34px;border-radius:10px;flex:0 0 auto;
  background:linear-gradient(150deg,var(--accent),#ff8a3d);
  display:grid;place-items:center;box-shadow:0 6px 20px -6px rgba(242,78,34,0.7);
}
.rb-mark::before{
  content:"";width:12px;height:12px;border:3px solid #fff;
  border-bottom-color:transparent;border-right-color:transparent;border-radius:2px;
  transform:rotate(45deg) translate(1px,1px);
}
