/**
 * 现代化响应式适配 - xzfgm.com
 * 使用 CSS Grid, Container Queries, 现代断点系统
 */

/* ========================================
   响应式断点系统
   基于现代设备尺寸：
   - xs: 0-575px (手机竖屏)
   - sm: 576-767px (手机横屏)
   - md: 768-991px (平板)
   - lg: 992-1199px (小桌面)
   - xl: 1200px+ (大桌面)
   ======================================== */

/* 平板及以下 (<=991px) */
@media (max-width: 991px) {
  :root {
    --container-padding: 12px;
    --header-height: 60px;
  }
  
  .fuyufuW_1200 {
    padding-inline: var(--container-padding);
  }
  
  /* 导航调整 */
  .fuyufuheader-nav ul li a {
    padding: 0 var(--space-3, 12px);
    font-size: var(--font-size-base, 14px);
  }
  
  /* Grid 调整 */
  .fuyufugrid-cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }
  
  .fuyufugrid-cols-3 {
    grid-template-columns: repeat(2, 1fr);
  }
  
  /* 赛事列表调整 */
  .fuyufumatch-list .fuyufumatch-row {
    grid-template-columns: 80px 60px 1fr auto 80px;
    padding: var(--space-2, 8px) var(--space-4, 15px);
  }
  
  .fuyufumatch-list .fuyufumatch-teams-row img {
    width: 24px;
    height: 24px;
  }
  
  .fuyufumatch-list .fuyufumatch-teams-row span {
    font-size: var(--font-size-sm, 13px);
  }
}

/* 手机横屏及以下 (<=767px) */
@media (max-width: 767px) {
  :root {
    --container-padding: 10px;
    --header-height: 56px;
    --font-size-base: 14px;
  }
  
  /* 隐藏 PC 端导航，显示移动端 */
  .pc-hide {
    display: none !important;
  }
  
  .m-show {
    display: block !important;
  }
  
  /* 容器调整 */
  .fuyufuW_1200 {
    padding-inline: var(--container-padding);
  }
  
  /* 头部调整 */
  .fuyufusite-header {
    display: none;
  }
  
  /* Grid 单列 */
  .fuyufugrid-cols-4,
  .fuyufugrid-cols-3,
  .fuyufugrid-cols-2 {
    grid-template-columns: 1fr;
  }
  
  /* 赛事列表移动端优化 */
  .fuyufumatch-list .fuyufumatch-row {
    grid-template-columns: 1fr;
    gap: var(--space-2, 8px);
    padding: var(--space-3, 12px);
  }
  
  .fuyufumatch-list .fuyufumatch-league,
  .fuyufumatch-list .fuyufumatch-time {
    width: auto;
  }
  
  .fuyufumatch-list .fuyufumatch-teams-row {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  
  .fuyufumatch-list .fuyufumatch-action {
    width: auto;
    text-align: left;
  }
  
  /* 热门直播移动端 */
  .fuyufuhot-live-list .fuyufumatch-row {
    grid-template-columns: 1fr;
    gap: var(--space-2, 8px);
    text-align: left;
  }
  
  .fuyufuhot-live-list .fuyufumatch-status {
    text-align: left;
  }
  
  /* 今日直播移动端 */
  .fuyufutoday-live .fuyufumatch-row {
    grid-template-columns: 1fr;
    gap: var(--space-2, 8px);
    text-align: left;
  }
  
  .fuyufutoday-live .fuyufumatch-status {
    text-align: left;
  }
  
  /* 录像区移动端 */
  .fuyufuvideo-list {
    grid-template-columns: 1fr;
    gap: var(--space-2, 8px);
  }
  
  /* 新闻区移动端 */
  .fuyufunews-list li {
    grid-template-columns: 1fr;
  }
  
  .fuyufunews-list li .fuyufunews-img {
    width: 100%;
    height: 180px;
  }
  
  /* SEO 导航移动端 */
  .fuyufuseo-nav-two-col {
    grid-template-columns: 1fr;
  }
  
  .fuyufuseo-match-list {
    grid-template-columns: 1fr;
  }
  
  /* 详情页移动端 */
  .fuyufudetail-layout {
    grid-template-columns: 1fr;
  }
  
  .fuyufudetail-sidebar {
    order: 2;
  }
  
  .fuyufudetail-teams {
    grid-template-columns: 1fr;
    gap: var(--space-4, 15px);
    padding: var(--space-5, 20px);
  }
  
  .fuyufudetail-vs {
    order: -1;
  }
  
  .fuyufuteam-logo-lg {
    width: 60px;
    height: 60px;
  }
  
  .fuyufuteam-name-lg {
    font-size: var(--font-size-base, 14px);
  }
  
  .fuyufuvs-score .fuyufuscore {
    font-size: var(--font-size-3xl, 24px);
  }
  
  /* 分页移动端 */
  .fuyufupagination li a,
  .fuyufupagination li span {
    min-width: 32px;
    height: 32px;
    font-size: var(--font-size-sm, 13px);
  }
  
  /* 底部移动端 */
  footer {
    padding: var(--space-6, 20px) 0;
  }
  
  .fuyufufooter-nav a {
    margin: 0 var(--space-2, 8px);
    font-size: var(--font-size-sm, 13px);
  }
  
  .fuyufufooter-desc {
    font-size: var(--font-size-xs, 12px);
  }
}

/* 手机竖屏 (<=575px) */
@media (max-width: 575px) {
  :root {
    --container-padding: 8px;
  }
  
  /* 更紧凑的间距 */
  .fuyufusite-intro-section {
    padding: var(--space-4, 16px) var(--space-3, 12px);
  }
  
  .fuyufusite-intro-title {
    font-size: var(--font-size-xl, 18px);
  }
  
  .fuyufusite-intro-desc {
    font-size: var(--font-size-sm, 13px);
  }
  
  /* 分类标签移动端 */
  .fuyufunav-zb ul {
    gap: var(--space-2, 8px);
  }
  
  .fuyufunav-zb ul a {
    padding: var(--space-1, 4px) var(--space-3, 12px);
    font-size: var(--font-size-sm, 13px);
  }
  
  /* 赛事项移动端 */
  .fuyufumatch-item {
    grid-template-columns: 1fr;
    gap: var(--space-2, 8px);
    padding: var(--space-3, 12px);
  }
  
  .fuyufumatch-item .fuyufum-status {
    text-align: left;
  }
  
  .fuyufumatch-item .fuyufum-teams {
    justify-content: flex-start;
  }
  
  /* 文章详情页移动端 */
  .fuyufudetail-article {
    padding: var(--space-4, 16px);
  }
  
  .fuyufuarticle-title {
    font-size: var(--font-size-xl, 18px);
  }
  
  .fuyufuarticle-meta {
    flex-wrap: wrap;
    gap: var(--space-3, 12px);
  }
  
  .fuyufuarticle-content {
    font-size: var(--font-size-base, 14px);
  }
  
  /* 侧边栏移动端 */
  .fuyufusidebar-box {
    margin-top: var(--space-4, 16px);
  }
}

/* 大桌面 (>=1400px) */
@media (min-width: 1400px) {
  :root {
    --container-max-width: 1320px;
  }
  
  .fuyufuvideo-list {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* 超大桌面 (>=1600px) */
@media (min-width: 1600px) {
  :root {
    --container-max-width: 1440px;
  }
  
  .fuyufuvideo-list {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* ========================================
   高分辨率屏幕优化
   ======================================== */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .fuyufuteam-logo-lg,
  .fuyufuteam-logo,
  .fuyufunews-img img {
    image-rendering: -webkit-optimize-contrast;
  }
}

/* ========================================
   横屏模式优化
   ======================================== */
@media (orientation: landscape) and (max-height: 500px) {
  .fuyufum-header {
    position: relative;
  }
  
  .fuyufum-bottom-tab {
    height: 48px;
  }
  
  .fuyufudetail-teams {
    padding: var(--space-4, 16px);
  }
}

/* ========================================
   安全区域适配 (iPhone 刘海屏)
   ======================================== */
@supports (padding: max(0px)) {
  .fuyufum-bottom-tab {
    padding-bottom: max(env(safe-area-inset-bottom), 0px);
  }
  
  .fuyufum-header {
    padding-top: max(env(safe-area-inset-top), 0px);
  }
}

/* ========================================
   打印样式优化
   ======================================== */
@media print {
  .fuyufusite-header,
  .fuyufum-header,
  .fuyufum-bottom-tab,
  #totop,
  .fuyufunav-zb,
  .fuyufuhot-live,
  .fuyufutoday-live,
  .fuyufuvideo-section,
  .fuyufuinter-section,
  footer {
    display: none !important;
  }
  
  body {
    background: white;
    color: black;
    font-size: 12pt;
  }
  
  .fuyufuW_1200 {
    max-width: 100%;
    padding: 0;
  }
  
  a {
    color: black;
    text-decoration: underline;
  }
  
  .fuyufudetail-layout {
    display: block;
  }
  
  .fuyufudetail-sidebar {
    display: none;
  }
}
