/* 
 * Watermark Stamp Styles for TradeAnalyzer.Pro
 * This file contains comprehensive styles for the watermark stamp
 * that appears at the bottom left of all pages
 */

:root {
    /* Watermark settings - can be customized globally */
    --watermark-size-desktop: 120px;
    --watermark-size-tablet: 100px;
    --watermark-size-mobile: 80px;
    --watermark-position-bottom: 30px;
    --watermark-position-left: 30px;
    --watermark-opacity: 0.85;
    --watermark-z-index: 9999;
}

/* Main watermark container */
.watermark-stamp {
    position: fixed;
    bottom: var(--watermark-position-bottom);
    left: var(--watermark-position-left);
    z-index: var(--watermark-z-index);
    width: var(--watermark-size-desktop);
    height: var(--watermark-size-desktop);
    pointer-events: none; /* Allows clicking through the watermark */
    user-select: none; /* Prevents selection */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    opacity: var(--watermark-opacity);
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.15));
    will-change: transform; /* Optimizes animation performance */
    backface-visibility: hidden; /* Prevents flickering in some browsers */
    -webkit-backface-visibility: hidden;
    transform-style: preserve-3d; /* Better 3D rendering */
    -webkit-transform-style: preserve-3d;
    transition: opacity 0.3s ease; /* Smooth opacity changes */
}

/* Stamp image styling */
.watermark-stamp img, 
.watermark-stamp .stamp-image {
    width: 100%;
    height: auto;
    transform-origin: center center;
    transition: transform 0.1s linear; /* Smooth base transition */
    display: block;
    -webkit-transform-style: preserve-3d; /* Safari compatibility */
    transform-style: preserve-3d;
}

/* Print styles - ensure watermark shows in prints */
@media print {
    .watermark-stamp {
        position: absolute !important;
        opacity: 0.9 !important;
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
        transform: none !important;
    }
    
    .watermark-stamp img {
        transform: none !important; /* No animation when printing */
    }
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .watermark-stamp {
        width: var(--watermark-size-tablet);
        height: var(--watermark-size-tablet);
    }
}

@media (max-width: 768px) {
    .watermark-stamp {
        width: var(--watermark-size-mobile);
        height: var(--watermark-size-mobile);
        bottom: 25px;
        left: 25px;
    }
}

@media (max-width: 480px) {
    .watermark-stamp {
        width: 60px;
        height: 60px;
        bottom: 15px;
        left: 15px;
        opacity: 0.75; /* Slightly more transparent on very small screens */
    }
}

/* Fix for specific viewport issues */
@supports (-webkit-touch-callout: none) {
    /* iOS specific fix */
    .watermark-stamp {
        transform: translateZ(0);
    }
}

/* Prevent watermark from overlapping with fixed elements at bottom */
body.has-bottom-bar .watermark-stamp {
    bottom: 80px; /* Adjust based on your bottom bar height */
}

/* Page-specific adjustments */
/* Admin pages */
body.admin-page .watermark-stamp {
    opacity: 0.6; /* More subtle in admin area */
}

/* Login/signup pages - slightly more prominent */
body.login-page .watermark-stamp,
body.signup-page .watermark-stamp {
    opacity: 0.95;
}

/* Crypto trading pages */
body.crypto-page .watermark-stamp {
    bottom: 70px; /* Avoid overlapping with trading controls */
}

/* User profile pages */
body.profile-page .watermark-stamp {
    opacity: 0.75;
}

/* Dark-themed pages */
body.dark-theme .watermark-stamp {
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.3)) brightness(0.9);
}

/* Light-themed pages */
body.light-theme .watermark-stamp {
    filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.1));
}

/* Optimization for pages with heavy animations */
@media (prefers-reduced-motion: reduce) {
    .watermark-stamp img {
        transition: none !important;
    }
} 