/* =========================================================
   Mohoub — A4 print system
   This stylesheet is loaded only while printing.
   ========================================================= */

@page {
    size: A4 portrait;
    margin: 12mm 11mm 14mm;
}

:root {
    --print-ink: #21192e;
    --print-muted: #6f6679;
    --print-purple: #6333cf;
    --print-green: #278765;
    --print-gold: #9a7108;
    --print-blue: #277eaf;
    --print-line: #dcd5e6;
    --print-soft: #f7f4fb;
}

*, *::before, *::after {
    box-sizing: border-box !important;
    animation: none !important;
    transition: none !important;
    text-shadow: none !important;
}

html,
body {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    color: var(--print-ink) !important;
    direction: rtl !important;
    font-family: "Tajawal", "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
    font-size: 10.4pt !important;
    line-height: 1.55 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
}

body {
    overflow: visible !important;
}

/* Chrome sometimes keeps transforms from the interactive UI and clips content. */
main,
.page,
.container,
.card,
.card-flat,
.motion-card,
.learn-scene,
.activity-flip,
.activity-flip-inner,
.learn-guide-flip,
.learn-guide-inner {
    transform: none !important;
    perspective: none !important;
    filter: none !important;
}

.topbar,
.footer,
.mobile-drawer,
.mobile-nav-overlay,
.mobile-menu,
.offline-toast,
.offline-badge,
.no-print,
.stage-actions,
.plan-head-actions,
.scene-footer,
.quiz-actions,
.quiz-sticky-actions,
.game-modal,
[data-game-modal],
[data-mobile-drawer],
[data-mobile-menu-overlay],
[data-plan-builder],
.plan-builder,
.plan-save-bar,
.select-all-day,
.drawer-close,
.btn,
button,
form:not(.print-keep-form) {
    display: none !important;
}

main {
    display: block !important;
    padding: 0 !important;
}

.page,
.lesson-stage-page,
.plan-page,
.admin-page,
.quiz-result-themed {
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #fff !important;
}

.container,
.admin-shell-pro,
.quiz-shell {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Typography tuned for A4. */
h1,
h2,
h3,
h4,
p {
    orphans: 3;
    widows: 3;
}

h1 {
    margin: 0 0 3mm !important;
    font-size: 20pt !important;
    line-height: 1.25 !important;
    color: #2a1b3d !important;
}

h2 {
    margin: 0 0 2.2mm !important;
    font-size: 14pt !important;
    line-height: 1.3 !important;
}

h3 {
    margin: 0 0 1.7mm !important;
    font-size: 11.3pt !important;
    line-height: 1.35 !important;
}

p {
    margin: 0 0 2.4mm !important;
}

.small {
    font-size: 8.7pt !important;
}

.muted {
    color: var(--print-muted) !important;
}

.eyebrow,
.badge,
.done-chip,
.plan-status-pill,
.today-chip,
.skill-chip,
.admin-count-pill {
    display: inline-flex !important;
    border: 1px solid #d8cbea !important;
    background: #f7f2ff !important;
    color: #5630a9 !important;
    border-radius: 999px !important;
    padding: 1.2mm 2.4mm !important;
    font-size: 8pt !important;
    font-weight: 800 !important;
}

/* Common printable cards. */
.card,
.card-flat,
.stat,
.report-item,
.answer-row,
.plan-summary-card,
.plan-day-card,
.plan-subject-item,
.admin-panel,
.admin-kpi,
.survey,
.ai-box {
    box-shadow: none !important;
    border: .35mm solid var(--print-line) !important;
    border-radius: 3.2mm !important;
    background: #fff !important;
    color: var(--print-ink) !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
}

.card,
.card-flat,
.admin-panel,
.ai-box {
    padding: 4mm !important;
}

/* Header of reports/pages acts as the document title. */
.dashboard-head,
.admin-page-head,
.stage-header,
.plan-head {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 6mm !important;
    margin: 0 0 5mm !important;
    padding: 0 0 4mm !important;
    border-bottom: .55mm solid #6e43d6 !important;
    break-after: avoid !important;
}

.dashboard-head > div,
.stage-header > div,
.plan-head > div,
.admin-page-head > div {
    min-width: 0 !important;
}

/* Grids are compact on paper, but never force more than two columns. */
.grid,
.grid-2,
.grid-3,
.grid-4,
.report-grid,
.stats,
.admin-grid-2,
.admin-kpi-grid,
.admin-kpi-grid.compact {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3.5mm !important;
}

.report-grid,
.stats {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    margin-bottom: 4mm !important;
}

.report-item,
.stat {
    padding: 3.2mm !important;
    min-height: 20mm !important;
}

.report-item strong,
.stat strong {
    display: block !important;
    margin-top: 1mm !important;
    font-size: 14pt !important;
    color: #5d35bf !important;
}

.skill-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1.5mm !important;
}

.skill-chip.need {
    color: #9f3342 !important;
    background: #fff3f5 !important;
    border-color: #efcbd1 !important;
}

/* Lesson stage: printing from Ctrl+P still produces a usable document. */
.stage-progress-card,
.learn-guidance-intro,
.step-dots,
.journey-progress,
.remaining-pill,
.flip-hint,
.guide-flip-hint,
.guide-return-hint,
.card-close,
.card-done-stamp,
.internal-game-safe-chip,
.game-launch-btn,
.training-empty-state .btn {
    display: none !important;
}

.learn-scenes,
.learn-flow,
.training-zone {
    display: block !important;
}

.learn-scene[hidden],
.learn-scene {
    display: grid !important;
    grid-template-columns: 13mm 1fr !important;
    gap: 4mm !important;
    margin: 0 0 5mm !important;
    padding: 4mm !important;
    border: .35mm solid var(--print-line) !important;
    border-radius: 3mm !important;
    background: #fff !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
}

.scene-side {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2mm !important;
    padding: 0 !important;
    background: transparent !important;
}

.scene-number {
    width: 10mm !important;
    height: 10mm !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: #6840cd !important;
    color: #fff !important;
    font-size: 12pt !important;
    font-weight: 900 !important;
}

.scene-step-name {
    font-size: 7.8pt !important;
    text-align: center !important;
}

.scene-content {
    min-width: 0 !important;
}

.scene-title-row {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 3mm !important;
    margin-bottom: 2mm !important;
}

.scene-body {
    font-size: 10pt !important;
    color: #3f354c !important;
}

.learn-scene-media {
    max-height: 64mm !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    margin: 2mm auto 3mm !important;
    border-radius: 2.5mm !important;
}

.learn-audio {
    display: none !important;
}

.learn-guide-grid,
.parent-trio {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 2.5mm !important;
    margin-top: 3mm !important;
}

.learn-guide-flip {
    min-height: 0 !important;
    height: auto !important;
    border: .35mm solid #dcd5e6 !important;
    border-radius: 3mm !important;
    overflow: visible !important;
    background: #fff !important;
    break-inside: avoid !important;
}

.learn-guide-inner {
    display: block !important;
    height: auto !important;
}

.learn-guide-front {
    display: none !important;
}

.learn-guide-back {
    display: block !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 3mm !important;
    backface-visibility: visible !important;
    background: #fff !important;
    color: var(--print-ink) !important;
}

.learn-guide-back strong {
    display: block !important;
    margin-bottom: 1.5mm !important;
    color: #4a2a94 !important;
    font-size: 9.5pt !important;
}

.learn-guide-back p {
    margin: 0 !important;
    font-size: 8.9pt !important;
    line-height: 1.5 !important;
}

/* Training flip cards: print the useful back side, not the animation. */
.activity-grid,
.flip-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4mm !important;
}

.activity-flip {
    min-height: 0 !important;
    height: auto !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
    border: .4mm solid #d9d0e5 !important;
    border-radius: 3mm !important;
    background: #fff !important;
    overflow: visible !important;
}

.activity-flip-inner {
    display: block !important;
    height: auto !important;
}

.activity-face.activity-front {
    display: none !important;
}

.activity-face.activity-back {
    display: block !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 4mm !important;
    overflow: visible !important;
    backface-visibility: visible !important;
    background: #fff !important;
}

.activity-back-scroll {
    overflow: visible !important;
    max-height: none !important;
}

.activity-back-head {
    display: flex !important;
    align-items: center !important;
    gap: 2.5mm !important;
    margin-bottom: 3mm !important;
}

.activity-back-head > span {
    font-size: 18pt !important;
}

.activity-back-head strong {
    display: block !important;
    font-size: 12pt !important;
}

/* Study plan prints as seven compact day blocks. */
.plan-summary-card {
    display: grid !important;
    grid-template-columns: 1.1fr .9fr !important;
    gap: 4mm !important;
    padding: 4mm !important;
    margin-bottom: 4mm !important;
}

.plan-week-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 4mm !important;
}

.plan-day-card {
    padding: 0 !important;
    overflow: hidden !important;
}

.plan-day-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 2mm !important;
    padding: 3mm 3.5mm !important;
    border-bottom: .35mm solid var(--print-line) !important;
    background: #f8f5fc !important;
}

.plan-day-body {
    display: grid !important;
    gap: 2mm !important;
    padding: 3mm !important;
}

.plan-subject-item {
    padding: 2.7mm !important;
}

.plan-subject-top,
.plan-subject-footer {
    display: flex !important;
    align-items: center !important;
    gap: 2mm !important;
}

.plan-subject-copy {
    min-width: 0 !important;
    flex: 1 !important;
}

.plan-subject-copy strong,
.plan-subject-copy span {
    display: block !important;
}

.plan-subject-icon {
    font-size: 14pt !important;
}

.plan-time {
    white-space: nowrap !important;
    font-size: 8pt !important;
}

.subject-stage-track,
.mini-action,
.plan-rest-day small {
    display: none !important;
}

.plan-rest-day {
    padding: 4mm !important;
    text-align: center !important;
    border: .35mm dashed #d8d1df !important;
    border-radius: 3mm !important;
}

/* Quiz/result printing. */
.result-confetti,
.result-character {
    display: none !important;
}

.themed-result-card {
    padding: 5mm !important;
    margin-bottom: 5mm !important;
}

.score-ring {
    width: 28mm !important;
    height: 28mm !important;
    margin: 3mm auto !important;
    border: 2.2mm solid #7650d9 !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    background: #fff !important;
}

.score-ring::before,
.score-ring::after {
    display: none !important;
}

.score-ring strong {
    font-size: 16pt !important;
    color: #5b34b8 !important;
}

.answer-row {
    margin-bottom: 2.5mm !important;
    padding: 3mm !important;
}

.answer-row.ok {
    border-inline-start: 1.2mm solid #3d9f79 !important;
}

.answer-row.no {
    border-inline-start: 1.2mm solid #c84f60 !important;
}

/* Admin report: remove the sidebar and keep report content on A4. */
.admin-shell-pro {
    display: block !important;
}

.admin-sidebar,
.admin-mobile-tabs {
    display: none !important;
}

.admin-main {
    width: 100% !important;
    max-width: none !important;
}

.revenue-chart {
    min-height: 45mm !important;
}

.revenue-bar i {
    max-height: 38mm !important;
}

/* Tables are allowed to split by rows, never clipped horizontally. */
.table-wrap,
.admin-table-wrap,
.table-scroll {
    overflow: visible !important;
    width: 100% !important;
}

table {
    width: 100% !important;
    border-collapse: collapse !important;
    table-layout: auto !important;
    font-size: 8.2pt !important;
}

thead {
    display: table-header-group !important;
}

tfoot {
    display: table-footer-group !important;
}

tr,
img,
svg {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
}

th,
td {
    padding: 1.8mm 2mm !important;
    border: .25mm solid #ded8e5 !important;
    vertical-align: top !important;
    overflow-wrap: anywhere !important;
}

th {
    background: #f4f0fa !important;
    color: #3b2d4c !important;
    font-weight: 800 !important;
}

/* Links print as text, never append browser URLs. */
a,
a:visited {
    color: inherit !important;
    text-decoration: none !important;
}

a[href]::after {
    content: none !important;
}

/* Browser-safe page breaking helpers. */
.print-break,
.page-break {
    break-after: page !important;
    page-break-after: always !important;
}

.print-keep,
.keep-together {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
}

@media print and (max-width: 180mm) {
    /* Kept for engines that evaluate physical width. */
    .learn-guide-grid,
    .parent-trio {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* Standard document masthead for pages printed from the application shell. */
.print-only{display:block!important}
.print-brand-header{
    display:grid!important;
    grid-template-columns:auto 1fr auto!important;
    align-items:center!important;
    gap:4mm!important;
    margin:0 0 5mm!important;
    padding:0 0 4mm!important;
    border-bottom:.6mm solid #6e43d6!important;
    break-after:avoid!important;
}
.print-brand-logo{
    width:11mm!important;
    height:11mm!important;
    display:grid!important;
    place-items:center!important;
    border-radius:2mm!important;
    background:#fff!important;
    border:.3mm solid #e6ddf0!important;
    padding:.7mm!important;
}
.print-brand-logo img{width:100%!important;height:100%!important;object-fit:contain!important}
.account-brand-logo{display:block!important;width:11mm!important;height:11mm!important;object-fit:contain!important}
.print-brand-copy strong{
    display:block!important;
    margin:0!important;
    color:#2b1f38!important;
    font-size:14pt!important;
    line-height:1.3!important;
}
.print-brand-copy span{
    display:block!important;
    margin-top:.8mm!important;
    color:#73687c!important;
    font-size:8.5pt!important;
}
.print-brand-meta{
    text-align:left!important;
    color:#73687c!important;
    font-size:8pt!important;
    white-space:nowrap!important;
}

/* When a dedicated print masthead exists, avoid repeating the interactive page heading. */
.print-brand-header + .dashboard-head{display:none!important}
.report-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}

/* Admin accounting print documents */
.account-print-page{padding:0!important;background:#fff!important}.account-print-wrap{width:100%!important;max-width:none!important}.account-print-document{display:block!important;width:100%!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important}.account-doc-head{display:flex!important;justify-content:space-between!important;align-items:center!important;border-bottom:.6mm solid #7544e8!important;padding:0 0 4mm!important;margin-bottom:5mm!important}.account-doc-brand{display:flex!important;align-items:center!important;gap:3mm!important}.account-doc-brand .brand-mark{display:grid!important}.account-doc-brand>div{display:block!important}.account-doc-brand strong,.account-doc-brand small{display:block!important}.account-doc-number{text-align:left!important}.account-doc-number span,.account-doc-number strong{display:block!important}.account-doc-title{text-align:center!important;padding:4mm 0 5mm!important}.account-doc-title h1{margin:1.5mm 0!important}.account-doc-meta-grid,.statement-summary-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:2.5mm!important;margin-bottom:4mm!important}.statement-summary-grid{grid-template-columns:repeat(4,1fr)!important}.account-doc-meta-grid>div,.statement-summary-grid>div{border:.3mm solid #e3dce9!important;border-radius:2mm!important;padding:3mm!important;background:#faf8fc!important}.account-doc-meta-grid small,.statement-summary-grid small{display:block!important;font-size:7.5pt!important;color:#766b7f!important}.account-doc-meta-grid strong,.statement-summary-grid strong{display:block!important;font-size:9.5pt!important}.account-doc-table{display:table!important;width:100%!important;min-width:0!important;border-collapse:collapse!important;margin:4mm 0!important}.account-doc-table thead{display:table-header-group!important}.account-doc-table tbody{display:table-row-group!important}.account-doc-table tfoot{display:table-footer-group!important}.account-doc-table tr{display:table-row!important;break-inside:avoid!important}.account-doc-table th,.account-doc-table td{display:table-cell!important;border:.3mm solid #ddd5e4!important;padding:2.5mm!important;font-size:8.6pt!important}.account-doc-table thead th{background:#f3edff!important;color:#51349a!important}.account-doc-table.compact th,.account-doc-table.compact td{font-size:7.6pt!important;padding:2mm!important}.account-doc-section{display:block!important;margin-top:5mm!important;break-inside:auto!important}.account-doc-section h2{display:block!important;border-right:1mm solid #7544e8!important;padding-right:2.5mm!important;font-size:11pt!important}.account-doc-payment-row{display:flex!important;justify-content:space-between!important;padding:2.2mm 0!important;border-bottom:.3mm dashed #ddd5e4!important}.account-doc-note{display:block!important;border:.3mm solid #e3dce9!important;padding:3mm!important;margin:3mm 0!important;background:#faf8fc!important;border-radius:2mm!important}.account-doc-note strong,.account-doc-note p{display:block!important}.account-doc-footer{display:flex!important;justify-content:space-between!important;margin-top:6mm!important;padding-top:3mm!important;border-top:.3mm solid #ddd5e4!important;font-size:7.5pt!important;color:#766b7f!important}.receipt-amount{display:block!important;text-align:center!important;padding:10mm 0!important}.receipt-amount small,.receipt-amount strong{display:block!important}.receipt-amount strong{font-size:24pt!important;color:#278765!important}.account-doc-voided{display:block!important;border:.6mm solid #b8483f!important;padding:3mm!important;text-align:center!important;color:#9b3d35!important;font-weight:900!important}
