/* ============================================================
   丽人梦想秀® · 全系统响应式统一布局（最后加载，优先级最高）
   电脑版面 / 平板版面 / 手机版面 · 全尺寸最佳适配
   含 Bootstrap 网格系统补充（.row flex + .col 宽度）
   ============================================================ */

/* ────────────────────────────────────────────
   Bootstrap 网格系统补充（原 bootstrap.min.css 未加载）
   ──────────────────────────────────────────── */
.row {
  display: flex !important;
  flex-wrap: wrap !important;
}
.row > [class*="col-"] {
  box-sizing: border-box !important;
}

/* col-* 基础网格（所有屏幕） */
.col-1  { flex: 0 0 8.333% !important;  max-width: 8.333% !important; }
.col-2  { flex: 0 0 16.666% !important; max-width: 16.666% !important; }
.col-3  { flex: 0 0 25% !important;     max-width: 25% !important; }
.col-4  { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
.col-5  { flex: 0 0 41.666% !important; max-width: 41.666% !important; }
.col-6  { flex: 0 0 50% !important;     max-width: 50% !important; }
.col-7  { flex: 0 0 58.333% !important; max-width: 58.333% !important; }
.col-8  { flex: 0 0 66.666% !important; max-width: 66.666% !important; }
.col-9  { flex: 0 0 75% !important;     max-width: 75% !important; }
.col-10 { flex: 0 0 83.333% !important; max-width: 83.333% !important; }
.col-11 { flex: 0 0 91.666% !important; max-width: 91.666% !important; }
.col-12 { flex: 0 0 100% !important;    max-width: 100% !important; }

/* col-md-* 网格（≥768px 桌面/平板） */
@media (min-width: 768px) {
  .col-md-1  { flex: 0 0 8.333% !important;  max-width: 8.333% !important; }
  .col-md-2  { flex: 0 0 16.666% !important; max-width: 16.666% !important; }
  .col-md-3  { flex: 0 0 25% !important;     max-width: 25% !important; }
  .col-md-4  { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
  .col-md-5  { flex: 0 0 41.666% !important; max-width: 41.666% !important; }
  .col-md-6  { flex: 0 0 50% !important;     max-width: 50% !important; }
  .col-md-7  { flex: 0 0 58.333% !important; max-width: 58.333% !important; }
  .col-md-8  { flex: 0 0 66.666% !important; max-width: 66.666% !important; }
  .col-md-9  { flex: 0 0 75% !important;     max-width: 75% !important; }
  .col-md-10 { flex: 0 0 83.333% !important; max-width: 83.333% !important; }
  .col-md-11 { flex: 0 0 91.666% !important; max-width: 91.666% !important; }
  .col-md-12 { flex: 0 0 100% !important;    max-width: 100% !important; }
}

/* ────────────────────────────────────────────
   各断点侧边栏 + 主内容区布局
   ──────────────────────────────────────────── */

/* ── 超宽屏（≥1920px）── */
@media (min-width: 1920px) {
  .sidebar { width: 300px !important; }
  .main-content {
    margin-left: 300px !important;
    padding: 48px 72px 80px !important;
    max-width: none !important;
  }
}

/* ── 大屏（1600-1919px）── */
@media (min-width: 1600px) and (max-width: 1919px) {
  .sidebar { width: 280px !important; }
  .main-content {
    margin-left: 280px !important;
    padding: 40px 56px 80px !important;
    max-width: none !important;
  }
}

/* ── 桌面（1200-1599px）── */
@media (min-width: 1200px) and (max-width: 1599px) {
  .sidebar { width: 260px !important; }
  .main-content {
    margin-left: 260px !important;
    padding: 32px 40px 80px !important;
    max-width: none !important;
  }
}

/* ── 平板（768-1199px）── */
@media (min-width: 768px) and (max-width: 1199px) {
  .sidebar { width: 220px !important; }
  .main-content {
    margin-left: 220px !important;
    padding: 24px 24px 80px !important;
    max-width: none !important;
  }
}

/* ── 手机（≤767px）── */
@media (max-width: 767px) {
  .sidebar {
    width: 280px !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    z-index: 1000 !important;
  }
  .sidebar.open { transform: translateX(0) !important; }
  .main-content {
    margin-left: 0 !important;
    padding: 16px 12px 90px !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  #page-content { max-width: 100% !important; }
  #mobile-overlay { z-index: 999 !important; }
  /* 移动端 col-md 全宽（覆盖桌面端） */
  .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6,
  .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
  /* col-6 保留半宽（2列统计） */
  .col-6 { flex: 0 0 50% !important; max-width: 50% !important; }
}

/* ── 内容区内部居中（桌面/平板）── */
@media (min-width: 768px) {
  .main-content #page-content {
    max-width: 1200px;
    margin: 0 auto;
  }
}