/* =========================================
   MASTER PHOTO TOOL STYLES (100% PRINT FIX)
========================================= */

.canvas-wrapper {
    display: inline-block;
    background-color: #fff;
    background-image: linear-gradient(45deg, #ccc 25%, transparent 25%), 
                      linear-gradient(135deg, #ccc 25%, transparent 25%), 
                      linear-gradient(45deg, transparent 75%, #ccc 75%), 
                      linear-gradient(135deg, transparent 75%, #ccc 75%);
    background-size: 20px 20px; 
    background-position: 0 0, 10px 0, 10px -10px, 0px 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

#photoCanvas {
    max-width: 100%;
    height: auto;
    display: block;
    background: white; 
}

/* स्क्रीन पर प्रिंट एरिया छुपा कर रखें */
@media screen {
    .print-area-master { 
        display: none !important; 
    }
}

/* =========================================
   PRINT SETTINGS (CTRL + P)
========================================= */
@media print {
    @page { 
        size: A4 portrait; 
        margin: 0; /* ब्राउज़र का डिफ़ॉल्ट मार्जिन हटाएं */
    }
    
    body, html { 
        margin: 0; 
        padding: 0; 
        background: white !important; 
    }
    
    /* प्रिंट करते समय पूरा फॉर्म गायब हो जाएगा */
    .d-print-none, .container-fluid { 
        display: none !important; 
    }
    
    /* प्रिंट एरिया लेआउट */
    .print-area-master {
        display: block !important; 
        padding: 12mm 10mm; /* A4 पेज के चारो तरफ की खाली जगह */
        width: 210mm;
        height: 297mm;
        box-sizing: border-box;
        text-align: left; /* फोटो लाइन से छपेंगी */
    }
    
    /* सिंगल फोटो बॉक्स (चिपकने से रोकने का पक्का इलाज) */
    .mp-photo-box {
        display: inline-block !important; 
        margin: 3mm; /* ✂️ कैंची चलाने के लिए हर फोटो के बीच 3mm का गैप */
        border: 1px solid #aaa; /* कटिंग लाइन */
        box-sizing: border-box;
        background: white;
        vertical-align: top;
        overflow: hidden;
    }
    
    /* फोटो कभी नहीं पिचकेगी */
    .mp-photo-box img { 
        width: 100%; 
        height: 100%; 
        object-fit: cover; 
        display: block;
    }
}