/* Shared print styling for generated activity sheets. */
:root {
  --cm-indigo: #4f46e5;
  --cm-border: #111827;
  --cm-muted: #4b5563;
}

.pdf-download-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #059669;
  color: #fff;
  font-weight: 700;
  border: 0;
  border-radius: 0.5rem;
  padding: 0.75rem 1.5rem;
  cursor: pointer;
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.12), 0 2px 4px -2px rgb(0 0 0 / 0.12);
  transition: transform 0.2s, background-color 0.2s, opacity 0.2s;
}

.pdf-download-btn:hover {
  background: #047857;
  transform: scale(1.03);
}

.pdf-download-btn:disabled,
.pdf-download-btn.cm-hidden {
  display: none !important;
}

.cm-print-hint {
  color: #4b5563;
  font-size: 0.85rem;
  margin-top: 0.75rem;
  text-align: center;
}

@media screen {
  .page,
  .a4-page,
  .printable-page,
  .activity-page {
    width: min(100%, 210mm) !important;
    height: 297mm !important;
    min-height: 297mm;
    margin: 0 auto 1.5rem !important;
    padding: 10mm !important;
    background: #fff !important;
    box-sizing: border-box !important;
    color: #111827;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16) !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  .page-header,
  .sheet-header,
  .print-header {
    border-bottom: 1.5px solid var(--cm-border) !important;
    padding-bottom: 3mm !important;
    margin-bottom: 4mm !important;
  }

  .page-header-info,
  .student-row,
  .print-header > div {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 8mm !important;
    width: 100% !important;
    font-size: 9pt !important;
  }

  .student-row span,
  .page-header-info > span,
  .page-header-info .header-right span,
  .print-header span {
    border-bottom: 1px solid #9ca3af;
    flex: 1 1 auto;
    padding-bottom: 1mm;
    white-space: nowrap;
  }

  .header-right {
    display: flex !important;
    gap: 8mm !important;
    align-items: flex-end !important;
    flex-wrap: wrap !important;
  }

  .page-title,
  .sheet-title {
    color: #312e81 !important;
    font-size: 17pt !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    line-height: 1.12 !important;
    margin: 0 0 1.5mm !important;
    text-align: center !important;
  }

  .page-instructions,
  .sheet-instruction {
    color: #374151 !important;
    font-size: 9pt !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    text-align: center !important;
  }

  .page-footer,
  .print-footer {
    border-top: 1px solid #d1d5db;
    padding-top: 0.5rem;
    color: var(--cm-muted);
  }

  .logo-text {
    color: var(--cm-indigo);
    font-weight: 700;
  }
}

@media print {
  .no-print,
  .pdf-download-btn,
  .cm-print-hint {
    display: none !important;
  }

  .page,
  .a4-page,
  .printable-page,
  .activity-page {
    background: #fff !important;
    box-sizing: border-box !important;
    color: #111827 !important;
    display: flex !important;
    flex-direction: column !important;
    height: 297mm !important;
    margin: 0 !important;
    min-height: 297mm !important;
    overflow: hidden !important;
    padding: 10mm !important;
    width: 210mm !important;
    break-after: page;
    page-break-after: always;
  }

  .page:last-child,
  .a4-page:last-child,
  .printable-page:last-child,
  .activity-page:last-child {
    break-after: auto;
    page-break-after: auto;
  }

  .page-header,
  .sheet-header,
  .print-header {
    border-bottom: 1.5px solid var(--cm-border) !important;
    padding-bottom: 3mm !important;
    margin-bottom: 4mm !important;
  }

  .page-header-info,
  .student-row,
  .print-header > div {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 8mm !important;
    width: 100% !important;
    font-size: 9pt !important;
  }

  .student-row span,
  .page-header-info > span,
  .page-header-info .header-right span,
  .print-header span {
    border-bottom: 1px solid #9ca3af !important;
    flex: 1 1 auto !important;
    padding-bottom: 1mm !important;
    white-space: nowrap !important;
  }

  .header-right {
    display: flex !important;
    gap: 8mm !important;
    align-items: flex-end !important;
    flex-wrap: wrap !important;
  }

  .page-title,
  .sheet-title {
    color: #312e81 !important;
    font-size: 17pt !important;
    text-align: center !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    line-height: 1.12 !important;
    margin: 0 0 1.5mm !important;
  }

  .page-instructions,
  .sheet-instruction {
    color: #374151 !important;
    font-size: 9pt !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    text-align: center !important;
  }

  .page-footer,
  .print-footer {
    margin-top: auto !important;
    border-top: 1px solid #999 !important;
    padding-top: 2mm !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 4mm !important;
    font-size: 9pt !important;
    color: #444 !important;
  }

  .logo-text {
    color: var(--cm-indigo) !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }
}