/* ============================================================
   Lesson print / PDF stylesheet  —  loaded only on lesson pages
   ============================================================ */

/* Screen: hide print-only elements */
.lrn-print-header,
.lrn-print-footer,
.lrn-print-table { display: none !important; }

/* ── Phrase card layout (screen) ─────────────────────────── */

/* label on top, text + listen button on same row below */
.lrn-phrase-lang { display: flex; flex-direction: column; gap: .35rem; }

.lrn-phrase-text-row {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.lrn-phrase-content { flex: 1; min-width: 0; }

/* Listen button — pill style with icon + text */
.lrn-listen-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .35rem .75rem;
  border-radius: 999px;
  border: 2px solid var(--pb, var(--lrn-primary));
  background: transparent;
  color: var(--pb, var(--lrn-primary));
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, color .15s;
  line-height: 1;
}
.lrn-listen-btn i { font-size: .85rem; }
.lrn-listen-btn:hover {
  background: var(--pb, var(--lrn-primary));
  color: #fff;
}

/* ── Word-by-word highlight ──────────────────────────────── */
.lrn-word { border-radius: 4px; transition: background .1s, color .1s; }
.lrn-word-active {
  background: #fde68a;        /* warm yellow */
  color: #92400e !important;  /* dark amber text */
  padding: 0 .1em;
}

/* ── Sidebar widget spacing ──────────────────────────────── */
.lrn-sidebar-widget            { margin-bottom: 1.1rem; }
.lrn-sidebar-widget:last-child { margin-bottom: 0; }

/* ── Sidebar media widget: flush embed, no padding on sides ─ */
.lrn-sidebar-media {
  padding: 0;
  overflow: hidden;
}
.lrn-sidebar-media .lrn-sidebar-widget-title {
  padding: .9rem 1.1rem .5rem;
  margin-bottom: 0;
}
.lrn-sidebar-media .lrn-yt-wrap,
.lrn-sidebar-media .lrn-audio-player {
  border-radius: 0 0 calc(var(--lrn-radius) - 2px) calc(var(--lrn-radius) - 2px);
}

/* ── Print widget ────────────────────────────────────────── */
.lrn-sidebar-print-widget .lrn-sidebar-print-hint {
  font-size: .82rem;
  color: var(--lrn-text-light);
  margin: 0 0 .85rem;
  line-height: 1.45;
}
.lrn-sidebar-print-widget .lrn-print-btn {
  font-size: .9rem;
  padding: .6rem 1rem;
  border-radius: var(--lrn-radius);
  gap: .4rem;
}

/* ============================================================
   @media print
   ============================================================ */
@media print {
  @page {
    size: A4 portrait;
    margin: 0.4cm 0.2cm 0.4cm;
  }

  /* Base font size — drives all rem values in print */
  html, body { font-size: 14pt !important; }

  /* ── Strip all backgrounds, shadows, colour ─────────────── */
  * {
    background:       transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow:       none !important;
    text-shadow:      none !important;
    color:            #111 !important;
  }

  /* ── Hide entire site chrome ─────────────────────────────── */
  .lrn-header,
  .bws-navbar,
  .lrn-footer,
  .lrn-breadcrumb,
  .lrn-lesson-badges,
  .lrn-lesson-meta-row,
  .lrn-lesson-featured-img,
  .lrn-lesson-article,
  .lrn-lesson-media,
  .lrn-lesson-sidebar,
  .lrn-lesson-nav,
  .lrn-phrases-section,       /* hide the interactive card view */
  .lrn-phrase-badge,
  .lrn-listen-btn,
  .lrn-print-btn,
  .lrn-footer-chat { display: none !important; }

  /* word highlight spans — plain text on paper */
  .lrn-word, .lrn-word-active {
    background: none !important;
    color: inherit !important;
    padding: 0 !important;
  }

  /* flag/chip styling not needed on paper */
  .lrn-phrase-flag { display: none !important; }
  .lrn-phrase-lang-label {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }

  /* ── Show print-only elements ────────────────────────────── */
  .lrn-print-header,
  .lrn-print-footer,
  .lrn-print-table { display: block !important; }

  /* ── Logo + title header ─────────────────────────────────── */
  .lrn-print-header {
    padding-bottom: .6rem;
    border-bottom: 2px solid #ccc;
    margin-bottom: 1.2rem;
  }
  .lrn-print-header-brand {
    display: flex;
    align-items: center;
    gap: .8rem;
  }
  .lrn-print-logo {
    max-height: 52px;
    width: auto;
    flex-shrink: 0;
  }
  .lrn-print-header-text {
    display: flex;
    flex-direction: column;
    gap: .15rem;
  }
  .lrn-print-header-title {
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
  }
  .lrn-print-header-slogan {
    font-size: .7rem;
    color: #666 !important;
    font-style: italic;
  }

  /* Lesson h1 hidden — title already in the print header */
  .lrn-lesson-h1 { display: none !important; }

  /* ── Phrase table ────────────────────────────────────────── */
  .lrn-print-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 1rem;      /* ~16pt — comfortable for kids */
    table-layout: fixed;
  }

  .lrn-print-table thead tr {
    border-bottom: 2.5px solid #888;
  }

  .lrn-print-table th {
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: .4rem .5rem .5rem;
    text-align: left;
    color: #444 !important;
  }

  .lrn-print-table td {
    padding: .7rem .5rem;   /* more vertical breathing room between rows */
    vertical-align: top;
    border-bottom: 1px solid #ddd;
    line-height: 1.6;       /* open leading — easier for young readers */
    font-size: 1rem;
  }

  .lrn-print-table tr:last-child td { border-bottom: none; }

  /* Prevent a row being split across two pages */
  .lrn-print-table tbody tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .lrn-print-table td em {
    display: block;
    font-style: italic;
    font-size: .85rem;
    color: #555 !important;
    margin-top: .15rem;
  }

  /* ── Footer ──────────────────────────────────────────────── */
  .lrn-print-footer {
    margin-top: 1.2rem;
    padding-top: .4rem;
    border-top: 1px solid #ccc;
    text-align: center;
    font-size: .7rem;
    color: #555 !important;
  }
  .lrn-print-footer strong { font-weight: 700; }
}