/* Print Styles - Centralized print styling for the entire website */

@media print {
    /* General class for hiding elements from print */
    .no-print,
    *[class*="no-print"] {
        display: none !important;
        visibility: hidden !important;
    }
    
    /* Navigation and UI elements */
    nav, 
    .navbar,
    .nav-container,
    .nav-menu,
    .nav-lang,
    footer,
    
    /* Game controls and buttons */
    .button-container,
    .color-container,
    .trash-button,
    .color-button,
    
    /* FAQ sections */
    .faq-section,
    .faq-item,
    .faq-question,
    .faq-answer,
    
    /* Timer displays */
    h2.no-print,
    #timer-display,
    
    /* Game canvases (drawing overlays) */
    #maze-canvas, 
    #dot2dot-canvas, 
    #sudoku-canvas, 
    #wordsearch-canvas, 
    #sudoku-junior-canvas,
    
    /* Print button itself */
    #print-btn {
        display: none !important;
        visibility: hidden !important;
    }
    
    /* Page layout for print */
    body {
        margin: 0 !important;
        padding: 0 !important;
        background: white !important;
        color: black !important;
    }
    
    /* Ensure game images are properly sized for print */
    .random-maze-container img,
    .random-sudoku-container img,
    .random-sudoku-junior-container img,
    .random-wordsearch-container img,
    .random-dot2dot-container img {
        max-width: 100% !important;
        height: auto !important;
        page-break-inside: avoid;
    }
    
    /* Game containers for print */
    .maze-game-container,
    .sudoku-game-container,
    .sudoku-junior-game-container,
    .wordsearch-game-container,
    .dot2dot-game-container {
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
    }
    
    /* Hero sections for print */
    .hero {
        margin-bottom: 1rem !important;
        padding: 1rem !important;
    }
    
    .hero-title {
        color: black !important;
        font-size: 1.5rem !important;
    }
    
    .hero-subtitle {
        color: #333 !important;
        font-size: 1rem !important;
    }
}