/**
 * Print Stylesheet
 * Optimized for printing Japanese learning materials
 *
 * @package Tokutei
 * @since 1.1.0
 */

@media print {
    /* ==========================================================================
       Reset and Optimization
       ========================================================================== */

    * {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    /* ==========================================================================
       Page Setup
       ========================================================================== */

    @page {
        margin: 2cm;
        size: A4 portrait;
    }

    @page :first {
        margin-top: 1.5cm;
    }

    body {
        font-size: 12pt;
        line-height: 1.6;
        font-family: 'Noto Sans JP', 'Hiragino Sans', 'Meiryo', sans-serif;
        margin: 0;
        padding: 0;
    }

    /* ==========================================================================
       Hide Unnecessary Elements
       ========================================================================== */

    /* Navigation and UI elements */
    .site-header,
    .site-navigation,
    .main-navigation,
    .primary-menu,
    .header-actions,
    .menu-toggle,
    .user-menu,
    .breadcrumbs,
    .sidebar,
    .widget,
    .site-footer,
    .footer-widgets,
    .footer-bottom,
    .back-to-top,
    #back-to-top,
    .skip-link,
    .no-print {
        display: none !important;
    }

    /* Ads and banners */
    .ad-banner-section,
    .ad-banner,
    .advertisement,
    [class*="banner"],
    [class*="ad-"] {
        display: none !important;
    }

    /* Interactive elements */
    .share-buttons,
    .social-links,
    button,
    input[type="submit"],
    input[type="button"],
    .btn:not(.no-print-hide) {
        display: none !important;
    }

    /* Comments and forms */
    .comments,
    .comment-list,
    .comment-form,
    .reply,
    form:not(.print-friendly) {
        display: none !important;
    }

    /* Loading states */
    .skeleton,
    .skeleton-content,
    .loading,
    [aria-busy="true"] {
        display: none !important;
    }

    /* Modals and overlays */
    .modal,
    .modal-overlay,
    .overlay,
    .popup {
        display: none !important;
    }

    /* ==========================================================================
       Content Layout
       ========================================================================== */

    .site-content {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .site-container,
    .container,
    .content-wrapper {
        width: 100%;
        max-width: none;
        padding: 0;
        margin: 0;
    }

    main,
    article {
        width: 100%;
    }

    article {
        page-break-after: always;
        margin-bottom: 30pt;
    }

    article:last-child {
        page-break-after: auto;
    }

    /* ==========================================================================
       Typography
       ========================================================================== */

    /* Headings */
    h1, h2, h3, h4, h5, h6 {
        page-break-after: avoid;
        page-break-inside: avoid;
        font-weight: bold;
        margin-top: 12pt;
        margin-bottom: 6pt;
    }

    h1 {
        font-size: 24pt;
        margin-bottom: 12pt;
        border-bottom: 2pt solid #000;
        padding-bottom: 6pt;
    }

    h2 {
        font-size: 18pt;
        margin-top: 16pt;
        margin-bottom: 8pt;
        border-bottom: 1pt solid #000;
        padding-bottom: 4pt;
    }

    h3 {
        font-size: 14pt;
        margin-top: 12pt;
    }

    h4 {
        font-size: 12pt;
        margin-top: 10pt;
    }

    h5, h6 {
        font-size: 11pt;
        margin-top: 8pt;
    }

    /* Paragraphs */
    p {
        margin: 0 0 8pt;
        orphans: 3;
        widows: 3;
    }

    /* ==========================================================================
       Japanese Learning Content
       ========================================================================== */

    /* Grammar title */
    .grammar-title,
    .entry-title {
        border-bottom: 2pt solid #000;
        padding-bottom: 8pt;
        margin-bottom: 16pt;
        font-size: 20pt;
    }

    /* Grammar metadata */
    .grammar-meta,
    .entry-meta {
        font-size: 10pt;
        margin-bottom: 12pt;
        padding-bottom: 8pt;
        border-bottom: 1pt dotted #666;
    }

    /* JLPT Level badge */
    .jlpt-level,
    .level-badge {
        border: 2pt solid #000;
        padding: 4pt 8pt;
        font-weight: bold;
        display: inline-block;
        margin-right: 8pt;
    }

    /* Grammar sections */
    .grammar-section {
        page-break-inside: avoid;
        margin: 12pt 0;
    }

    /* Grammar examples */
    .grammar-examples {
        page-break-inside: avoid;
        margin: 12pt 0;
    }

    .grammar-example {
        margin-bottom: 8pt;
        padding: 8pt;
        border-left: 3pt solid #000;
        page-break-inside: avoid;
    }

    /* Japanese text */
    .japanese {
        font-size: 14pt;
        font-weight: bold;
        line-height: 1.8;
    }

    /* Furigana (ruby) support */
    ruby {
        ruby-position: over;
    }

    rt {
        font-size: 8pt;
        font-weight: normal;
    }

    /* Romanji */
    .romanji,
    .romaji {
        font-size: 10pt;
        font-style: italic;
        color: #333 !important;
    }

    /* Translation */
    .translation,
    .meaning {
        font-size: 11pt;
        margin-top: 4pt;
    }

    /* Vocabulary lists */
    .vocabulary-list,
    .vocab-list {
        page-break-inside: avoid;
    }

    .vocabulary-item,
    .vocab-item {
        padding: 6pt;
        margin-bottom: 4pt;
        border-bottom: 1pt solid #ccc;
        page-break-inside: avoid;
    }

    /* Kanji display */
    .kanji {
        font-size: 18pt;
        font-weight: bold;
    }

    /* Stroke order - hide in print */
    .stroke-order,
    .kanji-animation {
        display: none !important;
    }

    /* ==========================================================================
       Tables
       ========================================================================== */

    table {
        border-collapse: collapse;
        width: 100%;
        margin: 12pt 0;
        page-break-inside: avoid;
        font-size: 10pt;
    }

    thead {
        display: table-header-group;
    }

    tfoot {
        display: table-footer-group;
    }

    th, td {
        border: 1pt solid #000;
        padding: 6pt;
        text-align: left;
    }

    th {
        background: #f0f0f0 !important;
        font-weight: bold;
    }

    tr {
        page-break-inside: avoid;
    }

    /* Grammar conjugation tables */
    .conjugation-table th {
        background: #e0e0e0 !important;
    }

    /* ==========================================================================
       Lists
       ========================================================================== */

    ul, ol {
        margin: 8pt 0;
        padding-left: 20pt;
        page-break-inside: avoid;
    }

    li {
        margin-bottom: 4pt;
        page-break-inside: avoid;
    }

    /* Nested lists */
    ul ul, ol ol, ul ol, ol ul {
        margin-top: 4pt;
        margin-bottom: 4pt;
    }

    /* Definition lists */
    dl {
        page-break-inside: avoid;
    }

    dt {
        font-weight: bold;
        margin-top: 6pt;
    }

    dd {
        margin-left: 20pt;
        margin-bottom: 6pt;
    }

    /* ==========================================================================
       Links
       ========================================================================== */

    a {
        text-decoration: underline;
        color: #000 !important;
    }

    /* Print URLs after links */
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        font-style: italic;
    }

    /* Don't print URLs for internal links */
    a[href^="#"]::after,
    a[href^="javascript:"]::after,
    a[href^="mailto:"]::after,
    a[href^="tel:"]::after {
        content: "";
    }

    /* Simplify link appearance */
    a[href^="#"] {
        text-decoration: none;
    }

    /* ==========================================================================
       Images
       ========================================================================== */

    img {
        max-width: 100% !important;
        height: auto !important;
        page-break-inside: avoid;
        page-break-after: avoid;
    }

    /* Avatar images - smaller in print */
    .avatar,
    .user-avatar {
        max-width: 40pt !important;
        max-height: 40pt !important;
    }

    /* Hide decorative images */
    img[alt=""],
    img:not([alt]),
    .decorative-image,
    .background-image {
        display: none !important;
    }

    /* Figure captions */
    figure {
        page-break-inside: avoid;
        margin: 12pt 0;
    }

    figcaption {
        font-size: 10pt;
        font-style: italic;
        margin-top: 4pt;
    }

    /* ==========================================================================
       Blockquotes
       ========================================================================== */

    blockquote {
        border-left: 3pt solid #000;
        padding-left: 12pt;
        margin: 12pt 0;
        font-style: italic;
        page-break-inside: avoid;
    }

    blockquote p {
        margin-bottom: 6pt;
    }

    blockquote cite {
        font-size: 10pt;
        font-style: normal;
        display: block;
        margin-top: 6pt;
    }

    /* ==========================================================================
       Code Blocks
       ========================================================================== */

    pre, code {
        border: 1pt solid #000;
        padding: 6pt;
        font-family: 'Courier New', monospace;
        font-size: 9pt;
        page-break-inside: avoid;
        white-space: pre-wrap;
        word-wrap: break-word;
    }

    code {
        padding: 2pt 4pt;
        background: #f0f0f0 !important;
    }

    pre {
        margin: 12pt 0;
        padding: 8pt;
    }

    pre code {
        border: none;
        padding: 0;
        background: none !important;
    }

    /* ==========================================================================
       Cards and Components
       ========================================================================== */

    .card,
    .grammar-card,
    .post-card,
    .exam-card {
        border: 1pt solid #000;
        padding: 12pt;
        margin-bottom: 12pt;
        page-break-inside: avoid;
    }

    /* Remove shadows and gradients */
    .card::before,
    .card::after {
        display: none !important;
    }

    /* ==========================================================================
       Print-specific Headers and Footers
       ========================================================================== */

    /* Print header - Site branding */
    body::before {
        content: "Tokutei 5830 - Học tiếng Nhật trực tuyến";
        display: block;
        text-align: center;
        font-size: 14pt;
        font-weight: bold;
        margin-bottom: 16pt;
        padding-bottom: 8pt;
        border-bottom: 2pt solid #000;
    }

    /* Print footer - Contact info */
    body::after {
        content: "© Tokutei 5830 • https://tokutei5830.com • 0947.224.408 | 0886.631.350";
        display: block;
        text-align: center;
        font-size: 9pt;
        margin-top: 24pt;
        padding-top: 12pt;
        border-top: 1pt solid #000;
        page-break-after: avoid;
    }

    /* Entry header - show print date */
    .entry-header::after {
        content: "In ngày: " attr(data-print-date);
        display: block;
        font-size: 9pt;
        font-weight: normal;
        margin-top: 8pt;
        color: #666 !important;
    }

    /* ==========================================================================
       Page Breaks
       ========================================================================== */

    /* Always break before these elements */
    h1,
    .page-break-before {
        page-break-before: always;
    }

    /* Avoid breaking after these elements */
    h1, h2, h3, h4, h5, h6,
    .keep-with-next {
        page-break-after: avoid;
    }

    /* Avoid breaking inside these elements */
    blockquote,
    pre,
    table,
    figure,
    .grammar-example,
    .vocabulary-item,
    .keep-together {
        page-break-inside: avoid;
    }

    /* Force break before */
    .page-break {
        page-break-before: always;
    }

    /* ==========================================================================
       Orphans and Widows
       ========================================================================== */

    p, h2, h3, h4, h5, h6,
    li, dd {
        orphans: 3;
        widows: 3;
    }

    /* ==========================================================================
       Counters and Numbering
       ========================================================================== */

    /* Page numbers (if supported by browser) */
    @page {
        @bottom-right {
            content: "Trang " counter(page) " / " counter(pages);
        }
    }

    /* Section numbering for headings */
    body {
        counter-reset: section;
    }

    h2 {
        counter-increment: section;
    }

    h2::before {
        content: counter(section) ". ";
    }

    /* ==========================================================================
       Exam/Quiz Content
       ========================================================================== */

    .exam-question,
    .quiz-question {
        page-break-inside: avoid;
        margin: 12pt 0;
        padding: 8pt;
        border: 1pt solid #000;
    }

    .question-number {
        font-weight: bold;
        font-size: 12pt;
    }

    .answer-options {
        margin-left: 12pt;
    }

    .answer-option {
        margin: 4pt 0;
    }

    /* Hide answers in print (optional - can be removed if answers needed) */
    .correct-answer,
    .answer-explanation {
        display: none !important;
    }

    /* Show answers (comment above and uncomment below to show answers) */
    /*
    .correct-answer {
        background: #e0e0e0 !important;
        font-weight: bold;
    }

    .answer-explanation {
        font-size: 10pt;
        font-style: italic;
        margin-top: 4pt;
        padding: 4pt;
        border-left: 2pt solid #000;
    }
    */

    /* ==========================================================================
       Progress Tracking
       ========================================================================== */

    .progress-bar,
    .progress-indicator,
    .score-display {
        border: 1pt solid #000;
        padding: 6pt;
        margin: 8pt 0;
    }

    /* ==========================================================================
       Responsive Print Layout
       ========================================================================== */

    /* Single column for mobile content */
    .grid,
    .posts-grid,
    .features-grid {
        display: block !important;
    }

    .grid > *,
    .posts-grid > *,
    .features-grid > * {
        display: block !important;
        width: 100% !important;
        margin-bottom: 12pt;
    }

    /* ==========================================================================
       Special Print Classes
       ========================================================================== */

    /* Show only in print */
    .print-only {
        display: block !important;
    }

    /* Force visibility in print */
    .print-show {
        display: block !important;
        visibility: visible !important;
    }

    /* Additional spacing for clarity */
    .print-spacer {
        height: 12pt;
    }

    /* Print-friendly table of contents */
    .print-toc {
        page-break-after: always;
        border: 2pt solid #000;
        padding: 12pt;
    }

    .print-toc h2 {
        margin-top: 0;
    }

    /* ==========================================================================
       Utilities
       ========================================================================== */

    /* Clear floats */
    .clearfix::after {
        content: "";
        display: table;
        clear: both;
    }

    /* Remove unnecessary spacing */
    .spacer,
    .padding,
    .margin {
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }
}