/* Theme System Styles */
.upw-theme-selector {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.upw-theme-label {
    font-size: 13px !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
}

.upw-theme-dropdown {
    padding: 8px 12px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    background: white !important;
    color: #374151 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    outline: none !important;
}

.upw-theme-dropdown:hover {
    border-color: #3b82f6 !important;
    background: #f9fafb !important;
}

.upw-theme-dropdown:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

.upw-textarea-wrapper,
.upw-header {
    position: relative !important;
}

/* ========== FIREFLIES THEME ========== */
.upw-textarea-wrapper.theme-fireflies,
.upw-header.theme-fireflies {
    background: linear-gradient(135deg, #0f2027 0%, #203a43 50%, #2c5364 100%) !important;
}

.upw-textarea-wrapper.theme-fireflies .firefly,
.upw-header.theme-fireflies .firefly {
    position: absolute !important;
    width: 8px !important;
    height: 8px !important;
    background: #ffeb3b !important;
    border-radius: 50% !important;
    box-shadow: 0 0 20px #ffeb3b !important;
    animation: firefly-move 8s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-fireflies .upw-logo-text,
.upw-header.theme-fireflies .upw-title-section h1,
.upw-header.theme-fireflies .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-fireflies .upw-logo {
    background: rgba(255, 235, 59, 0.2) !important;
}

@keyframes firefly-move {
    0%, 100% { transform: translate(0, 0); opacity: 0.3; }
    25% { transform: translate(80px, -50px); opacity: 1; }
    50% { transform: translate(-60px, -80px); opacity: 0.5; }
    75% { transform: translate(100px, -30px); opacity: 0.8; }
}

/* ========== BUBBLES THEME ========== */
.upw-textarea-wrapper.theme-bubbles,
.upw-header.theme-bubbles {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    overflow: hidden !important;
}

.upw-textarea-wrapper.theme-bubbles .bubble,
.upw-header.theme-bubbles .bubble {
    position: absolute !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    animation: bubble-rise 10s infinite ease-in !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-bubbles .upw-logo-text,
.upw-header.theme-bubbles .upw-title-section h1,
.upw-header.theme-bubbles .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-bubbles .upw-logo {
    background: rgba(255, 255, 255, 0.2) !important;
}

@keyframes bubble-rise {
    0% { transform: translateY(400px) scale(0); opacity: 0; }
    50% { opacity: 0.5; }
    100% { transform: translateY(-100px) scale(1); opacity: 0; }
}

/* ========== STARS THEME ========== */
.upw-textarea-wrapper.theme-stars,
.upw-header.theme-stars {
    background: linear-gradient(135deg, #2c3e50 0%, #000428 100%) !important;
}

.upw-textarea-wrapper.theme-stars .star,
.upw-header.theme-stars .star {
    position: absolute !important;
    background: white !important;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%) !important;
    animation: star-twinkle 3s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-stars .upw-logo-text,
.upw-header.theme-stars .upw-title-section h1,
.upw-header.theme-stars .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-stars .upw-logo {
    background: rgba(255, 255, 255, 0.1) !important;
}

@keyframes star-twinkle {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.2); }
}

/* ========== LEAVES THEME ========== */
.upw-textarea-wrapper.theme-leaves,
.upw-header.theme-leaves {
    background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%) !important;
    overflow: hidden !important;
}

.upw-textarea-wrapper.theme-leaves .leaf,
.upw-header.theme-leaves .leaf {
    position: absolute !important;
    width: 30px !important;
    height: 20px !important;
    background: linear-gradient(135deg, #56ab2f 0%, #a8e063 100%) !important;
    border-radius: 0 100% 0 100% !important;
    animation: leaf-fall 12s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-leaves .upw-logo-text,
.upw-header.theme-leaves .upw-title-section h1,
.upw-header.theme-leaves .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-leaves .upw-logo {
    background: rgba(86, 171, 47, 0.2) !important;
}

@keyframes leaf-fall {
    0% { transform: translateY(-50px) rotate(0deg); opacity: 0; }
    20% { opacity: 1; }
    100% { transform: translateY(450px) rotate(360deg); opacity: 0; }
}

/* ========== HEARTS THEME ========== */
.upw-textarea-wrapper.theme-hearts,
.upw-header.theme-hearts {
    background: linear-gradient(135deg, #C33764 0%, #1D2671 100%) !important;
}

.upw-textarea-wrapper.theme-hearts .heart,
.upw-header.theme-hearts .heart {
    position: absolute !important;
    width: 20px !important;
    height: 20px !important;
    background: #ff6b9d !important;
    animation: heart-float 8s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-textarea-wrapper.theme-hearts .heart::before,
.upw-textarea-wrapper.theme-hearts .heart::after,
.upw-header.theme-hearts .heart::before,
.upw-header.theme-hearts .heart::after {
    content: "" !important;
    position: absolute !important;
    width: 20px !important;
    height: 20px !important;
    background: #ff6b9d !important;
    border-radius: 50% !important;
}

.upw-textarea-wrapper.theme-hearts .heart::before,
.upw-header.theme-hearts .heart::before {
    top: -10px !important;
    left: 0 !important;
}

.upw-textarea-wrapper.theme-hearts .heart::after,
.upw-header.theme-hearts .heart::after {
    left: 10px !important;
    top: 0 !important;
}

.upw-header.theme-hearts .upw-logo-text,
.upw-header.theme-hearts .upw-title-section h1,
.upw-header.theme-hearts .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-hearts .upw-logo {
    background: rgba(255, 107, 157, 0.2) !important;
}

@keyframes heart-float {
    0%, 100% { transform: translateY(0) rotate(-45deg); opacity: 0.5; }
    50% { transform: translateY(-60px) rotate(-45deg); opacity: 1; }
}

/* ========== BUTTERFLY GARDEN THEME ========== */
.upw-textarea-wrapper.theme-butterfly,
.upw-header.theme-butterfly {
    background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 50%, #ffecd2 100%) !important;
}

.upw-textarea-wrapper.theme-butterfly .butterfly,
.upw-header.theme-butterfly .butterfly {
    position: absolute !important;
    font-size: 24px !important;
    animation: butterfly-flutter 12s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-butterfly .upw-logo-text,
.upw-header.theme-butterfly .upw-title-section h1,
.upw-header.theme-butterfly .upw-title-section p {
    color: #c33764 !important;
}

.upw-header.theme-butterfly .upw-logo {
    background: rgba(195, 55, 100, 0.2) !important;
}

@keyframes butterfly-flutter {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(100px, -50px) rotate(15deg); }
    50% { transform: translate(-80px, -80px) rotate(-15deg); }
    75% { transform: translate(120px, -40px) rotate(10deg); }
}

/* ========== COSMIC DREAMS THEME ========== */
.upw-textarea-wrapper.theme-cosmic,
.upw-header.theme-cosmic {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%) !important;
}

.upw-textarea-wrapper.theme-cosmic .cosmic-sparkle,
.upw-header.theme-cosmic .cosmic-sparkle {
    position: absolute !important;
    color: white !important;
    font-size: 20px !important;
    animation: cosmic-float 6s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-cosmic .upw-logo-text,
.upw-header.theme-cosmic .upw-title-section h1,
.upw-header.theme-cosmic .upw-title-section p {
    color: #fff !important;
}

.upw-header.theme-cosmic .upw-logo {
    background: rgba(255, 255, 255, 0.2) !important;
}

@keyframes cosmic-float {
    0%, 100% { transform: translateY(0) rotate(0deg) scale(1); opacity: 0.6; }
    50% { transform: translateY(-40px) rotate(180deg) scale(1.3); opacity: 1; }
}

/* ========== NEON PULSE THEME ========== */
.upw-textarea-wrapper.theme-neonpulse,
.upw-header.theme-neonpulse {
    background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%) !important;
}

.upw-textarea-wrapper.theme-neonpulse .neon-ring,
.upw-header.theme-neonpulse .neon-ring {
    position: absolute !important;
    border: 3px solid !important;
    border-radius: 50% !important;
    animation: neon-pulse-ring 4s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-neonpulse .upw-logo-text,
.upw-header.theme-neonpulse .upw-title-section h1,
.upw-header.theme-neonpulse .upw-title-section p {
    color: #00ffff !important;
}

.upw-header.theme-neonpulse .upw-logo {
    background: rgba(0, 255, 255, 0.2) !important;
}

@keyframes neon-pulse-ring {
    0% { transform: scale(0.8); opacity: 1; }
    50% { transform: scale(1.2); opacity: 0.5; }
    100% { transform: scale(0.8); opacity: 1; }
}

/* ========== ELECTRIC NEON THEME ========== */
.upw-textarea-wrapper.theme-electric,
.upw-header.theme-electric {
    background: #000 !important;
}

.upw-textarea-wrapper.theme-electric .neon-particle,
.upw-header.theme-electric .neon-particle {
    position: absolute !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    animation: neon-drift 10s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-electric .upw-logo-text,
.upw-header.theme-electric .upw-title-section h1,
.upw-header.theme-electric .upw-title-section p {
    color: #00ffff !important;
}

.upw-header.theme-electric .upw-logo {
    background: rgba(0, 255, 255, 0.2) !important;
}

@keyframes neon-drift {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(100px, -80px); }
    50% { transform: translate(-80px, -40px); }
    75% { transform: translate(120px, -100px); }
}

/* ========== CYBER GLOW THEME ========== */
.upw-textarea-wrapper.theme-cyber,
.upw-header.theme-cyber {
    background: linear-gradient(135deg, #141e30 0%, #243b55 100%) !important;
}

.upw-textarea-wrapper.theme-cyber .cyber-particle,
.upw-header.theme-cyber .cyber-particle {
    position: absolute !important;
    border-radius: 50% !important;
    animation: cyber-pulse 6s infinite ease-in-out !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-cyber .upw-logo-text,
.upw-header.theme-cyber .upw-title-section h1,
.upw-header.theme-cyber .upw-title-section p {
    color: #00ffff !important;
}

.upw-header.theme-cyber .upw-logo {
    background: rgba(0, 255, 255, 0.2) !important;
}

@keyframes cyber-pulse {
    0%, 100% { 
        transform: translate(0, 0) scale(1); 
        opacity: 0.6;
    }
    33% { 
        transform: translate(60px, -40px) scale(1.5); 
        opacity: 1;
    }
    66% { 
        transform: translate(-40px, -60px) scale(0.8); 
        opacity: 0.4;
    }
}

/* ========== MATRIX THEME ========== */
.upw-textarea-wrapper.theme-matrix,
.upw-header.theme-matrix {
    background: #000000 !important;
    font-family: 'Courier New', monospace !important;
}

.upw-textarea-wrapper.theme-matrix .matrix-char,
.upw-header.theme-matrix .matrix-char {
    position: absolute !important;
    color: #0F0 !important;
    font-size: 20px !important;
    font-weight: bold !important;
    text-shadow: 0 0 5px #0F0 !important;
    animation: matrix-fall 4s infinite linear !important;
    pointer-events: none !important;
    z-index: 1 !important;
    opacity: 0;
}

.upw-header.theme-matrix .upw-logo-text,
.upw-header.theme-matrix .upw-title-section h1,
.upw-header.theme-matrix .upw-title-section p {
    color: #0F0 !important;
    text-shadow: 0 0 5px #0F0 !important;
    font-family: 'Courier New', monospace !important;
}

.upw-header.theme-matrix .upw-logo {
    background: rgba(0, 255, 0, 0.2) !important;
    border: 1px solid #0F0 !important;
}

.upw-textarea-wrapper.theme-matrix .upw-textarea {
    color: #0F0 !important;
    font-family: 'Courier New', monospace !important;
}

.upw-textarea-wrapper.theme-matrix .upw-textarea::placeholder {
    color: rgba(0, 255, 0, 0.4) !important;
}

@keyframes matrix-fall {
    0% { transform: translateY(0); opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(400px); opacity: 0; }
}

/* ========== WINTER THEME (Revamped - Frozen Night) ========== */
.upw-textarea-wrapper.theme-winter,
.upw-header.theme-winter {
    /* Changed from pale white/blue to a deep icy night gradient */
    background: linear-gradient(135deg, #141E30 0%, #243B55 100%) !important;
}

.upw-textarea-wrapper.theme-winter .snowflake,
.upw-header.theme-winter .snowflake {
    position: absolute !important;
    background: white !important;
    border-radius: 50% !important;
    /* Added a slight icy glow to snowflakes */
    box-shadow: 0 0 5px rgba(255,255,255,0.4) !important;
    filter: blur(1px) !important;
    animation: snow-fall 8s infinite linear !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

/* Updated header text colors for dark background */
.upw-header.theme-winter .upw-logo-text,
.upw-header.theme-winter .upw-title-section h1,
.upw-header.theme-winter .upw-title-section p {
    color: #f0f8ff !important; /* AliceBlue color for an icy feel */
    text-shadow: 0 0 10px rgba(255,255,255,0.3) !important;
}

.upw-header.theme-winter .upw-logo {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* Updated textarea text colors for dark background */
.upw-textarea-wrapper.theme-winter .upw-textarea {
    color: #f0f8ff !important;
}

.upw-textarea-wrapper.theme-winter .upw-textarea::placeholder {
    color: rgba(240, 248, 255, 0.5) !important;
}

@keyframes snow-fall {
    0% { transform: translateY(0) translateX(0) rotate(0deg); opacity: 0.9; }
    50% { transform: translateY(200px) translateX(20px) rotate(180deg); opacity: 0.7; }
    100% { transform: translateY(400px) translateX(-20px) rotate(360deg); opacity: 0; }
}

/* ========== DEEP OCEAN THEME (Revamped - Bioluminescence) ========== */
.upw-textarea-wrapper.theme-ocean,
.upw-header.theme-ocean {
    /* A richer, deeper 3-stage gradient going down into the abyss */
    background: linear-gradient(180deg, #1a2a6c 0%, #0f4c75 50%, #021B2B 100%) !important;
}

.upw-textarea-wrapper.theme-ocean .ocean-bubble,
.upw-header.theme-ocean .ocean-bubble {
    position: absolute !important;
    /* Made bubbles slightly more transparent inner, stronger border */
    background: rgba(137, 207, 240, 0.1) !important;
    border: 2px solid rgba(137, 207, 240, 0.4) !important;
    border-radius: 50% !important;
    /* Added a subtle deep-sea glow */
    box-shadow: 0 0 15px rgba(137, 207, 240, 0.3), inset 0 0 10px rgba(137, 207, 240, 0.2) !important;
    animation: ocean-rise 10s infinite ease-in-out !important; /* Slower animation */
    pointer-events: none !important;
    z-index: 1 !important;
}

.upw-header.theme-ocean .upw-logo-text,
.upw-header.theme-ocean .upw-title-section h1,
.upw-header.theme-ocean .upw-title-section p {
    color: #d4f1f9 !important; /* A lighter, watery blue text */
    text-shadow: 0 0 10px rgba(212, 241, 249, 0.3) !important;
}

.upw-header.theme-ocean .upw-logo {
    background: rgba(212, 241, 249, 0.1) !important;
    border: 1px solid rgba(212, 241, 249, 0.3) !important;
}

.upw-textarea-wrapper.theme-ocean .upw-textarea {
    color: #d4f1f9 !important;
}

.upw-textarea-wrapper.theme-ocean .upw-textarea::placeholder {
    color: rgba(212, 241, 249, 0.4) !important;
}

@keyframes ocean-rise {
    0% { transform: translateY(0) scale(0.8); opacity: 0; }
    20% { opacity: 0.7; }
    50% { transform: translateY(-150px) scale(1) translateX(10px); }
    100% { transform: translateY(-350px) scale(1.2) translateX(-10px); opacity: 0; }
}

/* ========== DEFAULT THEME ========== */
.upw-textarea-wrapper.theme-default,
.upw-header.theme-default {
    background: rgba(255, 255, 255, 0.95) !important;
}

/* Ensure elements are visible on all themes */
.upw-header.theme-fireflies .upw-btn,
.upw-header.theme-bubbles .upw-btn,
.upw-header.theme-stars .upw-btn,
.upw-header.theme-leaves .upw-btn,
.upw-header.theme-hearts .upw-btn,
.upw-header.theme-butterfly .upw-btn,
.upw-header.theme-cosmic .upw-btn,
.upw-header.theme-neonpulse .upw-btn,
.upw-header.theme-electric .upw-btn,
.upw-header.theme-cyber .upw-btn,
.upw-header.theme-matrix .upw-btn,
.upw-header.theme-winter .upw-btn,
.upw-header.theme-ocean .upw-btn {
    z-index: 10 !important;
    position: relative !important;
}

.upw-textarea {
    position: relative !important;
    z-index: 2 !important;
}

/* General Text Color Overrides for Dark Themes */
.upw-textarea-wrapper.theme-fireflies .upw-textarea,
.upw-textarea-wrapper.theme-bubbles .upw-textarea,
.upw-textarea-wrapper.theme-stars .upw-textarea,
.upw-textarea-wrapper.theme-leaves .upw-textarea,
.upw-textarea-wrapper.theme-hearts .upw-textarea,
.upw-textarea-wrapper.theme-cosmic .upw-textarea,
.upw-textarea-wrapper.theme-neonpulse .upw-textarea,
.upw-textarea-wrapper.theme-electric .upw-textarea,
.upw-textarea-wrapper.theme-cyber .upw-textarea,
.upw-textarea-wrapper.theme-winter .upw-textarea,
.upw-textarea-wrapper.theme-ocean .upw-textarea {
    color: #fff !important;
}

.upw-textarea-wrapper.theme-butterfly .upw-textarea {
    color: #c33764 !important;
}

.upw-textarea-wrapper.theme-fireflies .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-bubbles .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-stars .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-leaves .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-hearts .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-cosmic .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-neonpulse .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-electric .upw-textarea::placeholder,
.upw-textarea-wrapper.theme-cyber .upw-textarea::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

.upw-textarea-wrapper.theme-butterfly .upw-textarea::placeholder {
    color: rgba(195, 55, 100, 0.5) !important;
}

.upw-char-counter {
    z-index: 3 !important;
}