/* ============================================================
   Bingo Board Generator — print.css
   Print-only styles for the bingo card generator
   ============================================================ */

@media print {

  /* ── Hide everything except cards ─────────────────────── */
  body * { visibility: hidden; }

  .bingo-cards-output,
  .bingo-cards-output * {
    visibility: visible;
  }

  /* ── Position the cards at top-left ───────────────────── */
  .bingo-cards-output {
    position: static;
    display: block !important;
    width: 100%;
  }

  /* ── One card per page ────────────────────────────────── */
  .bingo-card {
    page-break-after: always;
    break-after: page;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    border: 1px solid #ccc;
    border-radius: 0;
    margin: 0;
  }

  /* Last card: don't add a blank final page */
  .bingo-card:last-child {
    page-break-after: avoid;
    break-after: avoid;
  }

  /* ── Grid cells: clean black borders ──────────────────── */
  .card-grid {
    gap: 2px;
    padding: 4px;
    background: #999;
  }

  .grid-cell {
    border: 1px solid #333;
    background: #fff !important;
    color: #000 !important;
    font-size: 0.7rem;
    cursor: default;
    border-radius: 0;
  }

  .grid-cell.is-marked {
    background: #fff !important;
  }

  /* ── Free space: keep visible ─────────────────────────── */
  .free-space {
    background: #000 !important;
    color: #fff !important;
    font-weight: 800;
  }

  /* ── Card title & header: keep visible ────────────────── */
  .card-title {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
    color: #fff;
  }

  .card-header {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
    color: #fff;
  }

  .header-cell {
    color: #fff;
  }

  /* Force color themes to print */
  .theme-blue .card-title,
  .theme-blue .card-header { background-color: #1976D2 !important; }
  .theme-blue .free-space { background-color: #1976D2 !important; }

  .theme-green .card-title,
  .theme-green .card-header { background-color: #388E3C !important; }
  .theme-green .free-space { background-color: #388E3C !important; }

  .theme-purple .card-title,
  .theme-purple .card-header { background-color: #7B1FA2 !important; }
  .theme-purple .free-space { background-color: #7B1FA2 !important; }

  .theme-red .card-title,
  .theme-red .card-header { background-color: #D32F2F !important; }
  .theme-red .free-space { background-color: #D32F2F !important; }

  .theme-orange .card-title,
  .theme-orange .card-header { background-color: #F57C00 !important; }
  .theme-orange .free-space { background-color: #F57C00 !important; }

  .theme-black .card-title,
  .theme-black .card-header { background-color: #424242 !important; }
  .theme-black .free-space { background-color: #424242 !important; }

  /* ── Ink-Friendly / B&W Mode ──────────────────────────── */
  body.printer-friendly .card-title,
  body.printer-friendly .card-header,
  body.printer-friendly .free-space,
  body.printer-friendly .header-cell {
    background-color: #fff !important;
    color: #000 !important;
    text-shadow: none !important;
  }
  
  body.printer-friendly .bingo-card {
    border: 2px solid #000;
  }

  body.printer-friendly .card-grid {
    background: #000;
  }

  body.printer-friendly .grid-cell {
    border: none;
  }
  
  body.printer-friendly .card-title {
    -webkit-text-stroke: 1px #000;
  }
  
  body.printer-friendly .card-header {
    border-bottom: 2px solid #000;
  }

  /* ── Page margins ─────────────────────────────────────── */
  @page {
    margin: 0.4in;
    size: letter portrait;
  }

  /* ── Always hide caller section from card print ───────── */
  .caller-section { display: none !important; }

}

/* ── Caller-only print mode ──────────────────────────────── */
@media print {
  /* Drop visibility:hidden, use display:none on all non-caller layout blocks to prevent blank pages */
  body.print-caller-only .site-nav,
  body.print-caller-only .site-footer,
  body.print-caller-only .hero,
  body.print-caller-only .page-hero,
  body.print-caller-only .section--usecases,
  body.print-caller-only .section--templates-preview,
  body.print-caller-only .section--how,
  body.print-caller-only .section--faq,
  body.print-caller-only .generator-sidebar,
  body.print-caller-only .section--internal-links,
  body.print-caller-only .generator-form,
  body.print-caller-only .output-header,
  body.print-caller-only .bingo-cards-output,
  body.print-caller-only .caller-actions,
  body.print-caller-only .breadcrumb,
  body.print-caller-only .noscript-msg,
  body.print-caller-only .skip-link,
  body.print-caller-only .page-hero-title,
  body.print-caller-only .page-hero-desc {
    display: none !important;
  }

  /* Reset layout constraints for the remaining elements */
  body.print-caller-only .generator-layout {
    display: block !important;
  }

  body.print-caller-only .generator-widget {
    box-shadow: none !important;
    border: none !important;
  }

  body.print-caller-only .section,
  body.print-caller-only .cards-output-wrapper,
  body.print-caller-only .caller-section {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    width: 100% !important;
  }

  /* Style the caller text for paper */
  body.print-caller-only .caller-title {
    font-size: 1.6rem;
    margin-bottom: 0.5rem;
    color: #000;
  }

  body.print-caller-only .caller-desc { 
    font-size: 1rem; 
    color: #444; 
  }

  body.print-caller-only .caller-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  body.print-caller-only .caller-chip {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    background: #fff;
    color: #000;
  }
}