/* ─── IZEX AI Shares — Partner Cabinet ─────────────────────────── */

:root,
[data-bs-theme="dark"] {
  --sidebar-bg:   #0d1117;
  --sidebar-link: #8b949e;
  --sidebar-active-bg: rgba(56,139,253,.15);
  --sidebar-active: #58a6ff;
  --card-bg:      #161b22;
  --border:       rgba(240,246,252,.1);
  --text-muted:   #8b949e;
  --body-bg:      #010409;
  --body-color:   #c9d1d9;
  --table-color:  #c9d1d9;
  --input-bg:     #0d1117;
  --input-color:  #c9d1d9;
  --stat-value-color: #e6edf3;
  --form-label-color: #8b949e;
  --name-color:   #fff;
}

[data-bs-theme="light"] {
  --sidebar-bg:   #f6f8fa;
  --sidebar-link: #57606a;
  --sidebar-active-bg: rgba(9,105,218,.08);
  --sidebar-active: #0969da;
  --card-bg:      #fff;
  --border:       rgba(27,31,36,.12);
  --text-muted:   #57606a;
  --body-bg:      #f0f2f5;
  --body-color:   #1f2328;
  --table-color:  #1f2328;
  --input-bg:     #fff;
  --input-color:  #1f2328;
  --stat-value-color: #1f2328;
  --form-label-color: #57606a;
  --name-color:   #1f2328;
}

/* ── Mobile top bar ──────────────────────────────────────────────── */
.mobile-topbar {
  height: 52px;
  background: var(--sidebar-bg);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 1030;
}

/* ── Sidebar name / brand text ───────────────────────────────────── */
.sidebar-name { color: var(--name-color) !important; }

/* ── Brand logo (переключается по теме) ──────────────────────────── */
.brand-logo { height: 30px; width: auto; display: block; }
.mobile-topbar .brand-logo { height: 26px; }
.brand-logo--light { display: none; }
[data-bs-theme="light"] .brand-logo--light { display: block; }
[data-bs-theme="light"] .brand-logo--dark  { display: none; }

/* ── Sidebar ─────────────────────────────────────────────────────── */
.sidebar {
  background: var(--sidebar-bg);
  border-right: 1px solid var(--border);
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}

.sidebar-section-label {
  font-size: 10px;
  letter-spacing: .08em;
  color: var(--text-muted);
  font-weight: 600;
  padding: 4px 12px 2px;
}

.sidebar .nav-link,
.offcanvas .nav-link {
  color: var(--sidebar-link);
  border-radius: 6px;
  padding: 7px 12px;
  font-size: .875rem;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: background .15s, color .15s;
}

.sidebar .nav-link:hover,
.offcanvas .nav-link:hover {
  background: rgba(128,128,128,.1);
  color: var(--body-color);
}

.sidebar .nav-link.active,
.offcanvas .nav-link.active {
  background: var(--sidebar-active-bg);
  color: var(--sidebar-active);
}

/* ── Cards ───────────────────────────────────────────────────────── */
.card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.stat-card {
  padding: 1rem 1.25rem;
}

.stat-card .stat-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--stat-value-color);
  font-variant-numeric: tabular-nums;
}

@media (min-width: 768px) {
  .stat-card { padding: 1.25rem 1.5rem; }
  .stat-card .stat-value { font-size: 1.75rem; }
}

.stat-card .stat-label {
  font-size: .8125rem;
  color: var(--text-muted);
}

.stat-card .stat-icon {
  font-size: 2rem;
  opacity: .25;
}

/* ── Status badges ───────────────────────────────────────────────── */
.badge-online  { background: rgba(63,185,80,.15); color: #3fb950; }
.badge-offline { background: rgba(248,81,73,.12);  color: #f85149; }
.badge-rented  { background: rgba(56,139,253,.15); color: #58a6ff; }
.badge-idle    { background: rgba(139,148,158,.1); color: #8b949e; }

/* ── Avatar ──────────────────────────────────────────────────────── */
.avatar-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1f6feb, #388bfd);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: .8125rem;
  color: #fff;
  flex-shrink: 0;
}

/* ── Table ───────────────────────────────────────────────────────── */
.table { color: var(--table-color); }
.table thead th {
  color: var(--text-muted);
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  border-color: var(--border);
  white-space: nowrap;
}
.table td, .table th { border-color: var(--border); }
.table tbody tr:hover { background: rgba(0,0,0,.025); }

/* ── Forms ───────────────────────────────────────────────────────── */
.form-control, .form-select {
  background-color: var(--input-bg);
  border-color: var(--border);
  color: var(--input-color);
}
.form-control:focus, .form-select:focus {
  background-color: var(--input-bg);
  border-color: #388bfd;
  color: var(--stat-value-color);
  box-shadow: 0 0 0 3px rgba(56,139,253,.15);
}
.form-label { font-size: .875rem; color: var(--form-label-color); }

/* ── Base ────────────────────────────────────────────────────────── */
body { background: var(--body-bg); color: var(--body-color); }
main { background: var(--body-bg); }

/* On mobile, account for sticky topbar height */
@media (max-width: 991.98px) {
  body { padding-top: 0; }
  .min-vh-100 { min-height: calc(100vh - 52px) !important; }
}

.xsmall { font-size: .75rem; }

/* ── Theme-aware table link ──────────────────────────────────────── */
.table-link { color: var(--body-color); }
.table-link:hover { color: var(--sidebar-active); }

/* ── Machine card ────────────────────────────────────────────────── */
.machine-card {
  transition: border-color .2s;
}
.machine-card:hover {
  border-color: #388bfd !important;
}

/* ── Chart container ─────────────────────────────────────────────── */
.chart-container {
  position: relative;
  height: 200px;
}

@media (min-width: 768px) {
  .chart-container { height: 240px; }
}

/* ── Sync log ────────────────────────────────────────────────────── */
.sync-status-success { color: #3fb950; }
.sync-status-error   { color: #f85149; }
.sync-status-skipped { color: #8b949e; }

/* ── Filter form — stack on narrow screens ───────────────────────── */
@media (max-width: 575.98px) {
  .filter-row { flex-direction: column; }
  .filter-row .col-auto { width: 100%; }
  .filter-row .form-control,
  .filter-row .form-select { width: 100%; }
}