/* ==========================================================================
   Kian Paper Backgrounds - High Detail & Animated
   ========================================================================== */

/* ۱. کارتن موج‌دار (با انیمیشن بازتاب نور ملایم) */
body.kian-bg-corrugated {
    background-color: #cd9a5b !important;
    background-image: 
        repeating-linear-gradient(0deg, transparent, transparent 4px, rgba(0,0,0,0.1) 4px, rgba(0,0,0,0.1) 8px),
        repeating-linear-gradient(90deg, transparent, transparent 20px, rgba(255,255,255,0.08) 20px, rgba(255,255,255,0.08) 40px) !important;
    animation: kian-light-shimmer 8s infinite alternate ease-in-out;
}

/* ۲. کاغذ کرافت (بافت نویزدار متحرک بسیار ریز) */
body.kian-bg-kraft {
    background-color: #d1b08a !important;
    background-image: 
        radial-gradient(rgba(0, 0, 0, 0.08) 1px, transparent 1px),
        radial-gradient(rgba(0, 0, 0, 0.08) 1px, transparent 1px) !important;
    background-size: 20px 20px !important;
    animation: kian-noise-move 4s infinite linear;
}

/* ۳. کاغذ بازیافتی */
body.kian-bg-recycled {
    background-color: #e6e1d8 !important;
    background-image: 
        radial-gradient(rgba(0, 0, 0, 0.05) 1.5px, transparent 1.5px),
        radial-gradient(rgba(0, 0, 0, 0.04) 1px, transparent 1px) !important;
    background-size: 14px 14px, 25px 25px !important;
    animation: kian-noise-move 6s infinite linear reverse;
}

/* ۴. شیشه‌ای متحرک (Glassmorphism با هاله‌های روان) */
body.kian-bg-glassmorphism {
    background-color: #0f172a !important;
    background-image: 
        radial-gradient(circle at 15% 35%, rgba(67, 217, 172, 0.25), transparent 45%),
        radial-gradient(circle at 85% 65%, rgba(192, 38, 211, 0.25), transparent 45%) !important;
    background-attachment: fixed !important;
    animation: kian-glass-pulse 10s infinite alternate ease-in-out;
}

/* ۵. مایع گرادیان (Liquid Flow) */
body.kian-bg-liquid {
    background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #f7d794) !important;
    background-size: 400% 400% !important;
    background-attachment: fixed !important;
    animation: kian-gradient-flow 15s ease infinite;
}

/* ۶. سایبرپانک (شبکه نئونی متحرک) */
body.kian-bg-synthwave {
    background-color: #050505 !important;
    background-image: 
        linear-gradient(transparent 95%, rgba(255, 0, 255, 0.6) 100%),
        linear-gradient(90deg, transparent 95%, rgba(0, 255, 255, 0.6) 100%) !important;
    background-size: 40px 40px !important;
    background-attachment: fixed !important;
    animation: kian-grid-scroll 3s linear infinite;
    perspective: 1000px;
}

/* ۷. ماتریکس (باران دیجیتال با CSS) */
body.kian-bg-matrix {
    background-color: #000 !important;
    background-image: repeating-linear-gradient(180deg, rgba(0, 255, 0, 0.1) 0, rgba(0, 255, 0, 0.3) 20px, transparent 20px, transparent 40px) !important;
    background-size: 100% 200% !important;
    animation: kian-matrix-rain 2s linear infinite;
}

/* ==========================================================================
   Animations (Keyframes)
   ========================================================================== */

@keyframes kian-light-shimmer {
    0% { filter: brightness(1); }
    100% { filter: brightness(1.08); }
}

@keyframes kian-noise-move {
    0% { background-position: 0 0, 10px 10px; }
    100% { background-position: 20px 20px, 30px 30px; }
}

@keyframes kian-glass-pulse {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 100%; filter: hue-rotate(15deg); }
}

@keyframes kian-gradient-flow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

@keyframes kian-grid-scroll {
    0% { background-position: 0 0; }
    100% { background-position: 40px 40px; }
}

@keyframes kian-matrix-rain {
    0% { background-position: 0 0; }
    100% { background-position: 0 100%; }
}
