/* BOXED layout */
html, body {
  font-family: "Fira Sans", -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body {
  background: #10182b;
}


.boxed-wrap {
  max-width: 1600px;  /* ширина всей панели (sidebar+контент) */
  margin: 0px auto;  /* центрируем + отступ сверху/снизу */
  overflow: hidden;
  background: #111827;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}

.btn.btn-sm { padding: .25rem .5rem; }


/* Внутренний фон main части, чтобы было как в AdminKit */
.boxed-wrap .main {
  background: #f5f7fb; /* стандартный светлый фон контента AdminKit */
}

@media (max-width: 1200px) {
  .boxed-wrap {
    margin: 0;
    border-radius: 0;
    max-width: none;
  }
}

/* Ограничение ширины ТОЛЬКО контента внутри main (опционально) */
.content-inner {
  max-width: 1400px;
  margin: 0 auto;
}

/* ===== DASHBOARD METRICS (COMPACT) ===== */
.metrics-grid{
  display:grid;
  gap: .75rem; /* было 1rem */
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
@media (max-width: 1400px){ .metrics-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 992px){  .metrics-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 576px){  .metrics-grid{ grid-template-columns: 1fr; } }

.metric-card .card-body{
  padding: .75rem .85rem;   /* ↓ было 1rem */
  display:flex;
  flex-direction:column;
  min-height: 72px;         /* ↓ было ~92px */
}

.metric-title{
  font-size: .8rem;         /* чуть меньше */
  line-height: 1.1;
}

.metric-value{
  font-size: 1.5rem;        /* ↓ h2 */
  line-height: 1.1;
  margin-bottom: .15rem;
}

.metric-sub{
  margin-top: auto;
  min-height: 14px;         /* ↓ было 18px */
}

/* ===== TABLES ===== */
.table-dashboard th,
.table-dashboard td{
  padding: .4rem .5rem;
  vertical-align: middle;
}

th:last-child,
td:last-child {
  padding-right: .5rem; /* вместо .85rem */
}
th.col-date, td.col-date { text-align: right; white-space: nowrap; }

th.col-num,
td.col-num,
th.points,
td.points {
  text-align: center;
}

.table-dashboard thead th{
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: rgba(33,37,41,.60);
  white-space: nowrap;
}

.col-num{ width: 90px; text-align:right; }
.col-date{ width: 170px; white-space: nowrap; }
.col-status{ width: 120px; white-space: nowrap; }

.truncate{
  max-width: 380px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: bottom;
}
.truncate.sm{ max-width: 180px; }

/* Выделение заголовков таблиц */
.card-header.table-header {
  background: rgba(0,0,0,.03);
  position: relative;
}
.card-header.table-header::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #3b82f6; /* основной цвет */
  border-radius: 2px 0 0 2px;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
}

.metric-value {
  font-weight: 700;
}

.sidebar-link,
.table-dashboard td,
.table-dashboard th {
  font-weight: 400;
}

/* ===== Pagination (AdminKit style) ===== */
.pagination{
  display: flex;
  gap: .35rem;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}

.pagination .page-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 .6rem;
  border-radius: .5rem;
  border: 1px solid #e1e6ef;
  background: #fff;
  color: #495057;
  font-size: .85rem;
  line-height: 1;
}

.pagination .page-link:hover{
  background: #f1f4f9;
  color: #212529;
}

.pagination .page-item.active .page-link{
  background: #3b82f6;
  border-color: #3b82f6;
  color: #fff;
  font-weight: 600;
}

.pagination .page-item.disabled .page-link{
  background: #f8f9fa;
  border-color: #e9ecef;
  color: #adb5bd;
}

/* FIX: remove any custom bullets/dots added via pseudo-elements */
.pagination .page-item::before,
.pagination .page-item::after,
.pagination .page-link::before,
.pagination .page-link::after {
  content: none !important;
  display: none !important;
}

/* и на всякий случай */
.pagination, .pagination li {
  list-style: none !important;
}

/* ===== Bootstrap/Adminkit modal (correct behavior) ===== */

/* 1) Overlay container */
.modal{
  position: fixed;
  inset: 0;
  z-index: 1055;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}

/* Bootstrap expects block, not flex */
.modal.show{
  display: block;
}

/* 2) Backdrop */
.modal-backdrop{
  position: fixed;
  inset: 0;
  z-index: 1050;
  background: #000;
}
.modal-backdrop.fade{ opacity: 0; transition: opacity .15s linear; }
.modal-backdrop.show{ opacity: .5; }

/* 3) Dialog sizing + centering (Bootstrap way) */
.modal-dialog{
  position: relative;
  width: auto;
  margin: 1.75rem auto;     /* <-- центрирование */
  pointer-events: none;
  max-width: 500px;
}
.modal-dialog.modal-sm{ max-width: 300px; }
.modal-dialog.modal-lg{ max-width: 800px; }
.modal-dialog.modal-xl{ max-width: 1140px; }

/* centered variant */
.modal-dialog-centered{
  min-height: calc(100% - 3.5rem);
  display: flex;
  align-items: center;
}

/* 4) Content card look */
.modal-content{
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  border-radius: .5rem;
  box-shadow: 0 20px 45px rgba(0,0,0,.35);
  outline: 0;
  overflow: hidden;
}

/* Header / Body / Footer */
.modal-header{
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #e9ecef;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}
.modal-title{
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}
.modal-body{
  padding: 1.25rem;
}
.modal-footer{
  padding: .75rem 1.25rem;
  border-top: 1px solid #e9ecef;
  background: #f8fafc;
  display: flex;
  gap: .5rem;
  justify-content: flex-end;
}

/* close button look */
.modal-header .btn-close{ filter: opacity(.6); }
.modal-header .btn-close:hover{ filter: opacity(1); }

/* 5) Smooth fade animation like Bootstrap */
.modal.fade .modal-dialog{
  transform: translate(0,-50px);
  transition: transform .15s ease-out;
}
.modal.show .modal-dialog{
  transform: none;
}

/* 6) IMPORTANT: prevent “page jump” left/right on open/close (boxed layout) */
body.modal-open{
  padding-right: 0 !important;  /* <-- убираем компенсацию скроллбара */
}

/* компактные KPI-карточки */
.kpi-card .card-body {
  padding: .75rem 1rem; /* было ~1.5rem */
}

.kpi-card h1,
.kpi-card h2 {
  margin-bottom: .25rem;
  line-height: 1.2;
}

.kpi-card .text-muted {
  font-size: .75rem;
}

.metric-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.06);
  color: inherit; /* важно */
}

.metric-icon svg {
  width: 20px;
  height: 20px;
  stroke: currentColor !important; /* важно для feather */
}

/* Sidebar should follow page height (no internal scroll) */
.sidebar,
.sidebar .sidebar-content,
.sidebar .sidebar-nav-wrap {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Если AdminKit делает sidebar fixed/sticky — отключаем */
.sidebar {
  position: relative !important;
}

/* На всякий случай выключаем simplebar-ограничения, если где-то остались */
.sidebar .simplebar-content-wrapper,
.sidebar .simplebar-mask,
.sidebar .simplebar-offset,
.sidebar .simplebar-wrapper {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
.sidebar { min-height: 100vh; }

.sidebar-brand {
  position: relative;
}

.sidebar-settings-btn{
  position: absolute;
  right: 10px;
  top: 10px;

  width: 28px;
  height: 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 8px;
  color: rgba(245,247,251,.9);
  opacity: .85;
  text-decoration: none;
}

.sidebar-settings-btn:hover{
  background: rgba(255,255,255,.10);
  opacity: 1;
}

.sidebar-settings-btn svg{
  width: 16px;
  height: 16px;
}

table th span[role="button"] {
  display: inline-block;
}

table th svg {
  vertical-align: -0.15em;
}