/**
 * V7 Print Styles - K-5 专用印刷优化版
 * 目标：小学生友好的大字体、宽间距、清晰布局
 */

@media print {
  /* ============================================================
     清除所有非打印元素（包括图标和重复标题）
     ============================================================ */
  .site-header,
  .header-container,
  .header-inner,
  .site-footer,
  .footer-container,
  .footer-inner,
  .breadcrumb-bar,
  .nav-breadcrumbs,
  .action-buttons,
  .btn-group,
  .set-switcher,
  .language-switcher,
  .theme-switcher,
  .header-actions,
  .screen-only,
  .intro-brief,
  .learning-guide,
  .v7-seo-body,
  .site-info-box,
  .random-mode-indicator,
  .section-header,
  nav,
  header,
  footer,
  button {
    display: none !important;
  }

  /* 彻底移除所有图标 */
  svg,
  .icon,
  .worksheet-icon,
  .category-icon,
  .section-icon {
    display: none !important;
  }

  /* ============================================================
     打印净化：防止主题色污染（墨粉灾难防护）
     强制白底黑字，移除所有装饰效果
     ============================================================ */
  * {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  body,
  main,
  .main-content,
  .printable-area,
  .v7-container,
  .content-page,
  .generated-content,
  .worksheet-content,
  .v7-problem-grid,
  .problem-grid,
  .problems-grid,
  .v7-problem-card,
  .problem-card {
    background: white !important;
    background-color: white !important;
    color: black !important;
    overflow: visible !important;
  }

  /* 移除霓虹/主题发光效果 */
  [data-theme] *,
  [data-site] * {
    background-image: none !important;
    -webkit-text-fill-color: black !important;
  }

  /* 确保文字可见（覆盖渐变文字） */
  h1, h2, h3, h4, h5, h6,
  .print-title,
  .section-title {
    background: none !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: black !important;
    color: black !important;
  }

  /* ============================================================
     标题去重：只保留 .print-title，隐藏所有其他标题
     ============================================================ */
  /* 隐藏所有 H1（网页版带图标） */
  h1 {
    display: none !important;
  }

  /* 隐藏所有 H2（如 "Practice Problems" 副标题） */
  h2,
  .section-title,
  .page-title {
    display: none !important;
  }

  /* 唯一显示的标题：.print-title */
  .print-title {
    display: block !important;
  }

  /* ============================================================
     页面设置
     ============================================================ */
  @page {
    size: Letter;
    margin: 1cm;
  }

  html, body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    background: white !important;
    color: black !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 16pt !important;
    line-height: 1.3 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* ============================================================
     容器
     ============================================================ */
  .v7-container,
  main,
  .content-page,
  .generated-content,
  .worksheet-content {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  /* ============================================================
     打印页眉：正式试卷风格（精简垂直空间）
     ============================================================ */
  .print-header {
    display: block !important;
    width: 94% !important;
    max-width: 94% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border-bottom: 1.5pt solid black !important;
  }

  .print-title {
    display: block !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 26pt !important;
    font-weight: bold !important;
    color: black !important;
    text-align: center !important;
    margin: 0 0 0.5cm 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
  }

  .print-meta {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 1.5cm !important;
    margin: 0 0 0.3cm 0 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12pt !important;
    color: black !important;
  }

  .print-field {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 0.2cm !important;
  }

  .print-line {
    display: inline-block !important;
    width: 4cm !important;
    border-bottom: 1pt solid black !important;
  }

  /* ============================================================
     网格：K-5 优化 - 页眉下方均匀分布
     20 题占满 A4 高度
     ============================================================ */
  .v7-problem-grid,
  .problem-grid,
  .problems-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 2cm !important;
    row-gap: 0.6cm !important;
    width: auto !important;
    max-width: 94% !important;
    margin: 0.8cm auto 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-sizing: border-box !important;
    justify-content: center !important;
  }

  /* ============================================================
     卡片：K-5 友好间距
     ============================================================ */
  .v7-problem-card,
  .problem-card {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0.2cm 0.3cm !important;
    background: none !important;
    border: none !important;
    box-sizing: border-box !important;
    page-break-inside: avoid !important;
  }

  /* ============================================================
     题号：灰色低调，右对齐形成垂直基准线
     ============================================================ */
  .v7-problem-number,
  .problem-number {
    position: static !important;
    display: inline-block !important;
    min-width: 1.2cm !important;
    margin: 0 0.3cm 0 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 18pt !important;
    font-weight: 600 !important;
    color: #666 !important;
    text-align: right !important;
  }

  .v7-problem-number::after,
  .problem-number::after {
    content: "." !important;
  }

  /* ============================================================
     题目内容：K-5 大字号 22pt，视觉突出
     ============================================================ */
  .v7-problem-content,
  .problem-content {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 22pt !important;
    font-weight: 600 !important;
    color: black !important;
  }

  .v7-problem,
  .v7-problem-horizontal,
  .problem,
  .problem-horizontal {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.2cm !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 22pt !important;
    font-weight: 600 !important;
    color: black !important;
  }

  .v7-operand,
  .operand {
    display: inline-block !important;
    min-width: 0.8cm !important;
    text-align: center !important;
    font-size: 22pt !important;
    font-weight: 600 !important;
    color: black !important;
  }

  .v7-operator,
  .operator,
  .equals {
    display: inline-block !important;
    padding: 0 0.15cm !important;
    font-size: 22pt !important;
    font-weight: 600 !important;
    color: black !important;
  }

  /* ============================================================
     答案线：加宽适配大字体
     ============================================================ */
  .v7-answer-line,
  .answer-blank,
  .answer-space,
  .answer-line {
    display: inline-block !important;
    min-width: 2.8cm !important;
    width: 2.8cm !important;
    height: 0.6cm !important;
    margin: 0 0 0 0.3cm !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    border-bottom: 1.5pt solid black !important;
    color: transparent !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
  }

  /* ============================================================
     竖式布局：K-5 大字号
     ============================================================ */
  .v7-problem-vertical,
  .problem-vertical {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    font-family: "Courier New", monospace !important;
    font-size: 22pt !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    color: black !important;
  }

  .v7-problem-vertical .v7-operand,
  .v7-problem-vertical .operand {
    text-align: right !important;
    min-width: 2cm !important;
    font-size: 22pt !important;
  }

  .v7-problem-vertical .v7-operator-row,
  .v7-problem-vertical .operator-row {
    display: flex !important;
    border-bottom: 1.5pt solid black !important;
    padding-bottom: 0.15cm !important;
    margin-bottom: 0.15cm !important;
  }

  /* ============================================================
     答案区
     ============================================================ */
  /* Force <details> element to be open during print */
  details.answer-key {
    display: block !important;
    page-break-before: always !important;
    margin: 1.5cm auto 0 !important;
    padding: 0 !important;
    max-width: 94% !important;
  }

  details.answer-key[open],
  details.answer-key:not([open]) {
    display: block !important;
  }

  /* Force answer content to show even when details is closed */
  details.answer-key > .answer-grid {
    display: grid !important;
  }

  .answer-key summary {
    display: block !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 16pt !important;
    font-weight: bold !important;
    margin: 0 0 0.4cm 0 !important;
    padding: 0 0 0.3cm 0 !important;
    border-bottom: 1.5pt solid black !important;
    color: black !important;
    list-style: none !important;
  }

  .answer-key summary svg,
  .answer-key summary::-webkit-details-marker {
    display: none !important;
  }

  .answer-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 0.4cm !important;
  }

  .answer-item {
    font-family: "Courier New", monospace !important;
    font-size: 12pt !important;
    font-weight: 600 !important;
    padding: 0.15cm !important;
    color: black !important;
  }

  /* Sudoku answer items with grids need special handling */
  .answer-item:has(.sudoku-grid) {
    display: block !important;
    width: 100% !important;
    page-break-inside: avoid !important;
  }

  /* ============================================================
     Sudoku 数独专用打印样式
     ============================================================ */

  /* Sudoku 题目卡片：垂直排列 */
  .v7-problem-card.sudoku {
    display: block !important;
    width: 100% !important;
    margin-bottom: 15mm !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  /* 隐藏 Sudoku 题号（数独不需要题号） */
  .v7-problem-card.sudoku .v7-problem-number {
    display: none !important;
  }

  /* Sudoku 网格居中 */
  .v7-problem-card.sudoku .v7-problem-content {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    overflow: visible !important;
  }

  /* Sudoku 网格通用样式 - 确保边框完整 */
  .sudoku-grid {
    border: 2pt solid black !important;
    border-radius: 0 !important;
    background: black !important;
    margin: 0 auto !important;
    overflow: visible !important;
    box-sizing: content-box !important;
  }

  .sudoku-grid > div,
  .sudoku-cell {
    background: white !important;
    color: black !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    overflow: visible !important;
  }

  /* 强制 Sudoku 问题区域单列排列 */
  .v7-problem-grid:has(.sudoku) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    overflow: visible !important;
  }

  /* 4x4 和 6x6：允许多题一页，自然分页 */
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="4"]),
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="6"]) {
    margin-bottom: 12mm !important;
    page-break-inside: avoid !important;
  }

  /* 9x9：每题适度间距 */
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="9"]) {
    margin-bottom: 15mm !important;
    page-break-inside: avoid !important;
  }

  /* 16x16 及以上：每题独占一页 */
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="16"]),
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="25"]),
  .v7-problem-card.sudoku:has(.sudoku-grid[data-grid-size="36"]) {
    width: 100% !important;
    page-break-after: always !important;
    page-break-inside: avoid !important;
  }

  /* 25x25：缩放以适应页面 */
  .sudoku-grid[data-grid-size="25"] {
    transform: scale(0.8) !important;
    transform-origin: center top !important;
  }

  /* ============================================================
     36×36 Giant Mode - 极限挑战专用横向布局
     Per Tool-003 Design Spec: A4 landscape, 5mm margins
     ============================================================ */
  .sudoku-grid[data-grid-size="36"] {
    /* 36×36 uses full page width in landscape */
    width: 100% !important;
    max-width: 260mm !important;
    transform: none !important;
    font-size: 6pt !important;
  }

  .sudoku-grid[data-grid-size="36"] .sudoku-cell {
    /* Compact cell for 36×36 */
    width: calc(260mm / 36) !important;
    height: calc(260mm / 36) !important;
    font-size: 6pt !important;
    line-height: calc(260mm / 36) !important;
    border-width: 0.3pt !important;
  }

  /* 36×36 thick box borders (6×6 boxes) */
  .sudoku-grid[data-grid-size="36"] .sudoku-cell[data-box-top="true"] {
    border-top-width: 1.5pt !important;
  }
  .sudoku-grid[data-grid-size="36"] .sudoku-cell[data-box-left="true"] {
    border-left-width: 1.5pt !important;
  }

  /* ============================================================
     Sudoku 答案区打印优化
     ============================================================ */
  .answer-key .sudoku-grid {
    transform: none !important;
    margin: 5mm auto !important;
  }

  /* 小网格答案：紧凑显示 */
  .answer-value .sudoku-grid[data-grid-size="4"],
  .answer-value .sudoku-grid[data-grid-size="6"] {
    transform: scale(0.5) !important;
    transform-origin: top center !important;
  }

  /* 9x9 答案：中等大小 */
  .answer-value .sudoku-grid[data-grid-size="9"] {
    transform: scale(0.6) !important;
    transform-origin: top center !important;
  }

  /* 大网格答案：放大以便阅读 */
  .answer-value .sudoku-grid[data-grid-size="16"] {
    transform: scale(0.7) !important;
    transform-origin: top center !important;
  }

  .answer-value .sudoku-grid[data-grid-size="25"],
  .answer-value .sudoku-grid[data-grid-size="36"] {
    transform: scale(0.9) !important;
    transform-origin: top center !important;
  }

  /* 大网格答案每个独占一页 */
  .answer-item:has(.sudoku-grid[data-grid-size="16"]),
  .answer-item:has(.sudoku-grid[data-grid-size="25"]),
  .answer-item:has(.sudoku-grid[data-grid-size="36"]) {
    page-break-after: always !important;
    width: 100% !important;
    display: block !important;
  }

  /* ============================================================
     QR Code Print Slot
     位于页面右下角，方便扫码获取在线版本
     ============================================================ */
  .print-qr-slot {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    bottom: 10mm !important;
    right: 10mm !important;
    width: 22mm !important;
    height: 22mm !important;
    padding: 1mm !important;
    background: white !important;
    border: 0.5pt solid #999 !important;
    border-radius: 1mm !important;
    overflow: hidden !important;
  }

  .print-qr-slot img {
    width: 20mm !important;
    height: 20mm !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Hide any text inside QR slot */
  .print-qr-slot span,
  .print-qr-slot div,
  .print-qr-slot a::after {
    display: none !important;
    content: none !important;
  }

  /* Hide QR code only for 36×36 grid (grid needs full page width in landscape) */
  body:has(.sudoku-grid[data-grid-size="36"]) .print-qr-slot {
    display: none !important;
  }

  /* ============================================================
     强制黑白（题号除外）
     ============================================================ */
  *:not(.v7-problem-number):not(.problem-number) {
    color: black !important;
  }

  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

}

/* A4 纸张 */
@media print and (min-width: 210mm) {
  @page {
    size: A4;
    margin: 1cm;
  }
}

/* ============================================================
   Small paper - hide QR code
   ============================================================ */
@media print and (max-width: 180mm) {
  .print-qr-slot {
    display: none !important;
  }
}

/* ============================================================
   36×36 Giant Mode: A4 Landscape
   Triggered by body class or data attribute
   ============================================================ */
@media print {
  /* When page contains 36×36 grid, use landscape */
  body:has(.sudoku-grid[data-grid-size="36"]) {
    @page {
      size: A4 landscape;
      margin: 5mm;
    }
  }

  /* Alternative: explicit giant mode class */
  body.print-giant-mode {
    @page {
      size: A4 landscape;
      margin: 5mm;
    }
  }
}
