/* =============================================
   JAPANESE THEMES - SETTINGS PREVIEW CARDS
============================================= */

/* Cherry Blossom Preview */
.theme-preview.cherry-blossom {
    background: linear-gradient(180deg, #fff8fa 0%, #ffe8ed 100%);
    position: relative;
    overflow: hidden;
}

.theme-preview.cherry-blossom::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%;
    background: linear-gradient(to bottom, transparent 0%, rgba(255, 183, 197, 0.15) 100%);
    clip-path: polygon(0% 100%, 0% 70%, 30% 60%, 60% 50%, 90% 65%, 100% 70%, 100% 100%);
}

.theme-preview.cherry-blossom::after {
    content: '';
    position: absolute;
    top: 15%;
    right: 15%;
    width: 30px;
    height: 30px;
    background: radial-gradient(circle, rgba(255, 183, 197, 0.4), rgba(255, 143, 180, 0.2));
    border-radius: 50%;
    filter: blur(4px);
}

.theme-preview.cherry-blossom .theme-preview__pill {
    background: linear-gradient(135deg, #ff6b9d, #ff8fb4);
}

.theme-preview.cherry-blossom .theme-preview__line {
    background: rgba(255, 107, 157, 0.2);
}

/* Zen Garden Preview */
.theme-preview.zen-garden {
    background: linear-gradient(135deg, #f8f7f4 0%, #efede8 100%);
    position: relative;
    overflow: hidden;
}

.theme-preview.zen-garden::before {
 content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 25%;
    background: repeating-linear-gradient(
        0deg,
      transparent,
        transparent 4px,
  rgba(139, 157, 131, 0.08) 4px,
 rgba(139, 157, 131, 0.08) 5px
    );
}

.zen-stone-preview {
    position: absolute;
    border-radius: 50% / 40%;
background: linear-gradient(135deg, rgba(139, 157, 131, 0.25), rgba(107, 123, 99, 0.2));
}

.zen-stone-preview.stone-1 {
    width: 20px;
    height: 12px;
    left: 25%;
 bottom: 18%;
}

.zen-stone-preview.stone-2 {
    width: 28px;
    height: 17px;
    right: 30%;
    bottom: 20%;
}

.theme-preview.zen-garden .theme-preview__pill {
    background: #7a8a7a;
}

.theme-preview.zen-garden .theme-preview__line {
    background: rgba(122, 138, 122, 0.2);
}

/* Sekure Landscape Preview */
.theme-preview.sekure-landscape {
  background: linear-gradient(180deg, #d4d9d0 0%, #c4c9c0 100%);
    position: relative;
    overflow: hidden;
}

.sekure-mountain-preview {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.sekure-mountain-preview.mountain-1 {
    height: 40%;
    background: rgba(76, 86, 76, 0.6);
    clip-path: polygon(0% 100%, 20% 50%, 40% 60%, 60% 40%, 80% 55%, 100% 100%);
}

.sekure-mountain-preview.mountain-2 {
    height: 30%;
    background: rgba(96, 108, 96, 0.4);
    clip-path: polygon(0% 100%, 25% 60%, 50% 30%, 75% 50%, 100% 100%);
}

.theme-preview.sekure-landscape .theme-preview__pill {
    background: linear-gradient(135deg, #5a7a5a, #4a6a4a);
}

.theme-preview.sekure-landscape .theme-preview__line {
    background: rgba(76, 86, 76, 0.3);
}

/* Ghibli Forest Preview */
.theme-preview.ghibli-forest {
    background: radial-gradient(ellipse at top, #f0faf0 0%, #e8f4e8 50%, #e0ece0 100%);
    position: relative;
    overflow: hidden;
}

.theme-preview.ghibli-forest::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 30px;
    height: 40%;
    background: radial-gradient(ellipse, rgba(107, 155, 107, 0.15), transparent);
    border-radius: 50% 50% 40% 40%;
    filter: blur(3px);
}

.theme-preview.ghibli-forest::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 15%;
    width: 25px;
    height: 35%;
    background: radial-gradient(ellipse, rgba(107, 155, 107, 0.12), transparent);
    border-radius: 50% 50% 40% 40%;
    filter: blur(3px);
}

.ghibli-spirit-preview {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(200, 255, 200, 0.8), rgba(160, 240, 160, 0.5));
    box-shadow: 0 0 15px rgba(200, 255, 200, 0.9);
 animation: ghibliSpiritMini 4s ease-in-out infinite;
    filter: blur(1px);
}

.ghibli-spirit-preview.spirit-1 {
    width: 18px;
    height: 18px;
    left: 30%;
    top: 30%;
}

.ghibli-spirit-preview.spirit-2 {
 width: 14px;
    height: 14px;
    right: 25%;
    top: 45%;
    animation-delay: 1.5s;
}

.ghibli-firefly-preview {
    position: absolute;
    width: 5px;
    height: 5px;
    background: #fffacd;
    border-radius: 50%;
    box-shadow: 0 0 10px #fffacd;
    animation: ghibliFireflyMini 2s ease-in-out infinite;
}

.ghibli-firefly-preview.firefly-1 {
    left: 45%;
    top: 25%;
}

.ghibli-firefly-preview.firefly-2 {
    right: 30%;
bottom: 35%;
    animation-delay: 0.8s;
}

@keyframes ghibliSpiritMini {
    0%, 100% { transform: translate(0, 0); opacity: 0.8; }
25% { transform: translate(8px, -8px); opacity: 0.95; }
    50% { transform: translate(0, -12px); opacity: 1; }
    75% { transform: translate(-8px, -8px); opacity: 0.95; }
}

@keyframes ghibliFireflyMini {
    0%, 100% { opacity: 0.6; transform: scale(0.9); }
    50% { opacity: 1; transform: scale(1.4); }
}

.theme-preview.ghibli-forest .theme-preview__pill {
    background: linear-gradient(135deg, #6b9b6b, #5b8b5b);
}

.theme-preview.ghibli-forest .theme-preview__line {
    background: rgba(107, 155, 107, 0.3);
}