:root {
  --bg-primary: #0f0f0f;
  --bg-secondary: #1a1a1a;
  --bg-card: #2d2d2d;
  --accent-hover: #3b82f6;
  /* Синий вместо фиолетового */
  --accent: #2563eb;
  --text-primary: #f8fafc;
  --text-secondary: #94a3b8;
  --text-hover: #c1cfe2;
}


body {
  background: var(--bg-primary);
  color: var(--text-primary);
  font-family: 'Inter', system-ui, sans-serif;
}
.navbar {
  background: rgba(15, 15, 15, 0.95) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #333;
  z-index: 1060 !important;
}


/* Подключение шрифта Hobo STD */
@import url('https://fonts.cdnfonts.com/css/hobo-std');

.logo {
font-family: 'Hobo Std', sans-serif;
font-weight: 600;
font-size: 1.8rem;
background: linear-gradient(135deg, #3b82f6, #06b6d4);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}

.logo-solo {
font-family: 'Hobo Std', sans-serif;
color: #3b82f6;
font-weight: 600;
}

.logo-surf {
font-family: 'Hobo Std', sans-serif;
color: #06b6d4;
font-weight: 600;
}

.nav-user-card {
  background: var(--bg-card);
  border: 1px solid #333;
  border-radius: 12px;
  padding: 0.75rem 1rem;
}

.card-body {
  padding: 10px !important;
}
.modal-lg, .modal-xl {
--bs-modal-width: 90%;
}
.display-1 {
font-size: 24px;
font-weight: 300;
line-height: 1.2;
}
.stat-card {
  background: var(--bg-card);
  border: 1px solid #333;
  border-radius: 12px;
  padding: 1.5rem;
  transition: all 0.3s ease;
}

.stat-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
}

.main-card {
  background: var(--bg-card);
  border: 1px solid #333;
  border-radius: 16px;
  overflow: hidden;
}

.card-header-custom {
  background: linear-gradient(135deg, #1e1e1e, #2d2d2d);
  border-bottom: 1px solid #333;
  padding: 1.5rem;
}

.btn-primary-custom {
  background: var(--accent);
  color: var(--text-primary);
  border: none;
  border-radius: 10px;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  transition: all 0.3s ease;
}

.btn-primary-custom:hover {
  background: var(--accent-hover);
  color: var(--text-hover);
  transform: translateY(-1px);
}

.dropdown-menu {
  background: var(--bg-card);
  border: 1px solid #333;
  border-radius: 12px;
}

.dropdown-item {
  color: var(--text-primary);
  border-radius: 8px;
  margin: 2px;
}

.dropdown-item:hover {
  background: var(--accent);
  color: white;
}

.banner-placeholder-468 {
width: 468px;
height: 60px;
max-width: 100%;
background: var(--bg-card);
border: 2px dashed #dee2e6;
border-radius: 0.375rem;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
}

.banner-placeholder-content {
display: flex;
align-items: center;
gap: 8px;
font-size: 0.875rem;
line-height: 1;
}

.banner-placeholder-content i {
font-size: 1rem;
}

.banner-placeholder-content .text-muted {
font-size: 0.8rem;
}

.banner-placeholder-content a {
font-size: 0.8rem;
text-decoration: none;
}

.banner-placeholder-content a:hover {
text-decoration: underline;
}

.banner-placeholder-200x300 {
width: 200px;
height: 300px;
max-width: 100%;
border: 2px dashed #dee2e6;
border-radius: 0.375rem;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
background: var(--bg-card);
}
.banner-placeholder-200x200 {
width: 200px;
height: 200px;
max-width: 100%;
border: 2px dashed #dee2e6;
border-radius: 0.375rem;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
background: var(--bg-card);
}
.banner-placeholder-content-vertical {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
font-size: 0.875rem;
line-height: 1;
}

.banner-placeholder-content-vertical i {
font-size: 1.5rem;
}

.banner-placeholder-content-vertical .text-muted {
font-size: 0.8rem;
}

.banner-placeholder-content-vertical a {
font-size: 0.8rem;
text-decoration: none;
}

.banner-placeholder-content-vertical a:hover {
text-decoration: underline;
}

.accordion-body,
.accordion-button {
  background: var(--bg-card) !important;

}

.table-custom {
  background: var(--bg-card);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #333;
}

.table-custom thead th {
  background: linear-gradient(135deg, #1e1e1e, #2d2d2d);
  color: var(--text-primary);
  border-bottom: 1px solid #333;
  font-weight: 600;
}

.table-custom tbody tr {
  border-bottom: 1px solid #333;
}

.table-custom tbody tr:last-child {
  border-bottom: none;
}

.nav-divider {
  border-left: 1px solid #333;
  height: 30px;
  margin: 0 1rem;
}

.banner-ad-button {
  position: absolute;
  top: 5px;
  right: 5px;
  padding: 1px 5px;
  font-size: 10px;
  line-height: 1.2;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #ffc107;
  color: #856404;
  text-decoration: none;
  border-radius: 3px;
  transition: all 0.2s ease;
}

.banner-ad-button:hover {
  background: #ffc107;
  color: #000;
  transform: scale(1.05);
}

.sidebar-banner .banner-ad-button {
  top: 8px;
  right: 8px;
  padding: 2px 6px;
  font-size: 11px;
}
.top_100{
  margin-top: 100px;
}