/* 
 * Print & Download Styles for Yoga Tarot
 * Shared CSS for both print and downloadable versions of readings
 */

@media print {
    /* Print-specific styles */
    body {
        padding: 0;
        font-size: 12pt;
    }
    
    .no-print {
        display: none !important;
    }
    
    .subscription-offer {
        break-inside: avoid;
    }
    
    /* Ensure proper page breaks */
    .card, .reading-content h2, .reading-content h3 {
        break-inside: avoid;
    }
    
    /* Adjust margins for print */
    @page {
        margin: 0.5in;
    }
    
    /* Ensure images are high enough quality for print but not too high */
    img {
        max-resolution: 150dpi;
    }
}

/* Styles for lower-quality images in downloadable version */
.download-version img {
    /* Slightly reduce quality and add subtle effects */
    filter: blur(0.5px) brightness(0.97);
}

/* Watermark styles */
.watermark {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    font-size: 80px;
    color: rgba(200, 200, 200, 0.15);
    pointer-events: none;
    z-index: 1000;
}

/* Subscription offer box styling */
.subscription-offer {
    margin-top: 30px;
    padding: 15px;
    background-color: #f2f8ff;
    border: 1px solid #cce0ff;
    border-radius: 5px;
    text-align: center;
    break-inside: avoid;
}

.subscription-offer h3 {
    color: #0056b3;
    margin-top: 0;
}

/* Card layout adjustments */
.cards {
    display: flex;
    justify-content: space-between;
    margin: 30px 0;
    flex-wrap: wrap;
}

.card {
    width: 30%;
    text-align: center;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .card {
        width: 100%;
        margin-bottom: 30px;
    }
    
    .cards {
        flex-direction: column;
    }
}