/* Leaderboard pages
   extracted from views/pages/leaderboard/*.php
*/

/* leaderboard/index */
/*
  NOTE (UX): xq-box-body đang padding-top:0 để slideshow ở trang chủ không bị tụt.
  Với trang Xếp hạng, tabs bị dính sát phần tiêu đề "Bảng Xếp Hạng".
  -> thêm margin-top để tabs xuống 1 chút như demo.
*/
.lb-tabs{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0 10px}
  .lb-tab{display:inline-block;padding:6px 10px;border:1px solid #d4c7a0;background:#fff;border-radius:4px;text-decoration:none;color:#6b3b14}
  .lb-tab.is-active{background:#6b3b14;color:#fff;border-color:#6b3b14}
  .lb-range-note{margin:0 0 12px;color:#6b3b14}

.lb-table{width:100%;border-collapse:collapse}
  .lb-table th,.lb-table td{border:1px solid #d4c7a0;padding:8px 10px;vertical-align:middle}
  .lb-table thead th{background:#f3efd8;color:#6b3b14}
  .lb-pagination{display:flex;gap:8px;justify-content:center;align-items:center;margin:12px 0;flex-wrap:wrap}
  .lb-pagination a,.lb-pagination span{display:inline-block;padding:6px 10px;border:1px solid #d4c7a0;background:#fff;border-radius:4px;text-decoration:none;color:#6b3b14}
  .lb-pagination .is-active{background:#6b3b14;color:#fff;border-color:#6b3b14}

  /* Mobile: ẩn bớt cột để không vỡ */
  @media (max-width: 720px){
    .col-title,.col-tries,.col-solved{display:none}
    .lb-table th,.lb-table td{padding:8px 6px}
  }

/* leaderboard/member */
.mb-head{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin:6px 0 12px}
  .mb-head .stats{display:flex;gap:18px;flex-wrap:wrap;color:#6b3b14}
  .mb-head .stats b{color:#000}
  .mb-table{width:100%;border-collapse:collapse}
  .mb-table th,.mb-table td{border:1px solid #d4c7a0;padding:8px 10px;vertical-align:middle}
  .mb-table thead th{background:#f3efd8;color:#6b3b14}
  .mb-actions{display:flex;gap:10px;align-items:center;justify-content:center}
  .mb-title a{font-weight:400;}
  .mb-date{white-space:nowrap;font-size:12px;color:#333;}
  /* Icon eye: bỏ viền tròn (demo không có) */
  .mb-replay{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border:0;border-radius:0;text-decoration:none;background:transparent}
  .mb-replay:hover{background:transparent;opacity:.85}
  .xq-r-icon{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;border-radius:50%;font-weight:800;line-height:1;font-size:12px;border:0;color:#fff}
  .xq-r-win{ background:#2fb24a; }
  .xq-r-lose{ background:#e74c3c; }
  /* Hòa: tick trắng nền vàng */
  .xq-r-draw{ background:#f1c40f;color:#fff; }
  .lb-pagination{display:flex;gap:8px;justify-content:center;align-items:center;margin:12px 0;flex-wrap:wrap}
  .lb-pagination a,.lb-pagination span{display:inline-block;padding:6px 10px;border:1px solid #d4c7a0;background:#fff;border-radius:4px;text-decoration:none;color:#6b3b14}
  .lb-pagination .is-active{background:#6b3b14;color:#fff;border-color:#6b3b14}
  @media (max-width:720px){
    .col-date{display:none}
    .mb-table th,.mb-table td{padding:8px 6px}
  }

/* Column sizing & alignment (remove inline styles) */
.lb-table th.col-rank,
.lb-table td.col-rank{
  width:60px;
  text-align:center;
}

.lb-table th.col-title,
.lb-table td.col-title{
  width:130px;
  text-align:left;
}

.lb-table th.col-points,
.lb-table td.col-points{
  width:110px;
  text-align:right;
}

.lb-table th.col-tries,
.lb-table td.col-tries,
.lb-table th.col-solved,
.lb-table td.col-solved{
  width:110px;
  text-align:right;
}

/* Member attempts table columns */
.lb-table th.col-date,
.lb-table td.col-date{
  width:170px;
}

.lb-table th.col-result,
.lb-table td.col-result{
  width:110px;
  text-align:center;
}

/* Member table columns */
.mb-table th.col-date,
.mb-table td.col-date{
  width:170px;
  text-align:center;
}

.mb-table th.col-result,
.mb-table td.col-result{
  width:110px;
  text-align:center;
}
