:root {
    /* --- 🎨 پالت ربات قرمز-مشکی مشابه تصویر --- */

    /* Light Theme Colors */
    --loader-bg-light: rgba(255, 255, 255, 0.85);
    --robot-body-light: #FF5A5A;   /* قرمز مرجانی بدن */
    --robot-accent-light: #FF6666; /* قرمز روشن چشم و آنتن */
    --robot-head-light: #1C1C1C;   /* مشکی سر و پاها */
    --loader-text-light: #2E2E2E;

    /* Dark Theme Colors */
    --loader-bg-dark: rgba(15, 15, 20, 0.92);
    --robot-body-dark: #FF5A5A;
    --robot-accent-dark: #FF6666;
    --robot-head-dark: #2B2B2B;
    --loader-text-dark: #E8E8E8;

    /* Assignments */
    --loader-bg: var(--loader-bg-light);
    --robot-body-color: var(--robot-body-light);
    --robot-accent-color: var(--robot-accent-light);
    --robot-head-color: var(--robot-head-light);
    --loader-text-color: var(--loader-text-light);
}

[data-theme="dark"] {
    --loader-bg: var(--loader-bg-dark);
    --robot-body-color: var(--robot-body-dark);
    --robot-accent-color: var(--robot-accent-dark);
    --robot-head-color: var(--robot-head-dark);
    --loader-text-color: var(--loader-text-dark);
}

/* Loader Base */
#app-loader {
    position: fixed; inset: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    background-color: var(--loader-bg);
    backdrop-filter: blur(10px);
    opacity: 1; visibility: visible;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}
#app-loader.is-hidden { opacity: 0; visibility: hidden; }

.bot-loader-content { text-align: center; }
.loader-text { color: var(--loader-text-color); font-size: 1rem; margin-top: 10px; }

/* Robot Parts */
.bot-head {
    stroke: var(--robot-head-color);
    fill: var(--robot-head-color);
}
.bot-body, .bot-arm line, .bot-arm circle {
    stroke: var(--robot-body-color);
    fill: var(--robot-body-color);
}
.bot-eye, .bot-mouth, .bot-antenna-tip {
    fill: var(--robot-accent-color);
    stroke: var(--robot-accent-color);
}

/* Animations */
.bot-eye { animation: bot-blink 4s infinite; }
.bot-arm { transform-origin: 70px 55px; animation: wave 2.5s infinite ease-in-out; }
@keyframes bot-blink {
    0%, 90%, 100% { transform: scaleY(1); }
    95% { transform: scaleY(0.1); }
}
@keyframes wave {
    0%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(-30deg); }
    50% { transform: rotate(15deg); }
    80% { transform: rotate(-20deg); }
}