/* ==========================================================================
   Core Themes: Brutalism, Minimalist, Glassmorphism, Neubrutalism, Retro
   ========================================================================== */

/* Brutalism specific */
.brutalism .demo-card,
.brutalism .demo-btn-primary,
.brutalism .demo-btn-secondary,
.brutalism .demo-btn-outline,
.brutalism .demo-input,
.brutalism .demo-badge,
.brutalism .demo-nav {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.brutalism .demo-btn-primary:hover,
.brutalism .demo-btn-secondary:hover {
    transform: none;
}

.brutalism .demo-card {
    border-width: 4px;
}

/* Minimalist specific */
.minimalist .demo-card {
    border-width: 1px;
    box-shadow: none;
}

.minimalist .demo-btn-primary,
.minimalist .demo-btn-secondary {
    border-width: 1px;
    box-shadow: none;
}

.minimalist .demo-btn-primary:hover,
.minimalist .demo-btn-secondary:hover {
    transform: none;
    opacity: 0.9;
}

.minimalist .demo-input {
    border-width: 1px;
}

.minimalist .demo-input:focus {
    box-shadow: none;
    border-color: var(--primary);
}

.minimalist .demo-badge {
    border-width: 1px;
}

.minimalist .demo-nav {
    border-width: 1px;
}

/* Glassmorphism specific */
.glassmorphism .demo-card {
    background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.glassmorphism .demo-btn-primary,
.glassmorphism .demo-btn-secondary {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.glassmorphism .demo-btn-primary:hover,
.glassmorphism .demo-btn-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

.glassmorphism .demo-input {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.glassmorphism .demo-input:focus {
    box-shadow: 0 0 20px rgba(139, 92, 246, 0.3);
}

.glassmorphism .demo-badge {
    backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.glassmorphism .demo-nav {
    background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Neubrutalism specific */
.neubrutalism .demo-card {
    border: 3px solid var(--text);
    box-shadow: 5px 5px 0 var(--primary);
    border-radius: 0 !important;
}

.neubrutalism .demo-btn-primary {
    border: 3px solid var(--text);
    box-shadow: 4px 4px 0 var(--text);
    border-radius: 0 !important;
}

.neubrutalism .demo-btn-primary:hover {
    transform: translate(2px, 2px);
    box-shadow: 2px 2px 0 var(--text);
}

.neubrutalism .demo-btn-secondary {
    border: 3px solid var(--text);
    box-shadow: 4px 4px 0 var(--accent);
    border-radius: 0 !important;
}

.neubrutalism .demo-btn-outline {
    border: 3px solid var(--text);
    border-radius: 0 !important;
}

.neubrutalism .demo-input {
    border: 3px solid var(--text);
    border-radius: 0 !important;
}

.neubrutalism .demo-input:focus {
    box-shadow: 4px 4px 0 var(--primary);
}

.neubrutalism .demo-badge {
    border: 2px solid var(--text);
    border-radius: 0 !important;
}

.neubrutalism .demo-nav {
    border: 3px solid var(--text);
    border-radius: 0 !important;
}

/* Retro/Vintage specific */
.retro .demo-card {
    border: 2px solid var(--text);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 16px !important;
}

.retro .demo-btn-primary,
.retro .demo-btn-secondary {
    border: 2px solid var(--text);
    border-radius: 24px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.retro .demo-btn-primary:hover,
.retro .demo-btn-secondary:hover {
    transform: scale(1.02);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.retro .demo-btn-outline {
    border-radius: 24px !important;
}

.retro .demo-input {
    border: 2px solid var(--text);
    border-radius: 8px !important;
}

.retro .demo-badge {
    border: 2px solid var(--text);
    border-radius: 24px !important;
}

.retro .demo-nav {
    border: 2px solid var(--text);
    border-radius: 16px !important;
}
