/* batik-nusantara visual identity. */


/* 10. Batik Nusantara */
.theme-batik-nusantara {
    --bs-light: #f0e8dc;
    --bs-white: #faf6ef;
    --bs-dark: #362204;
    --bs-gray-100: #e3d5c1;
    color: var(--bs-dark);
}


/* 10. Batik Nusantara: Scrolling Pattern */
.batik-pattern {
    position: absolute;
    inset: -50%;
    background: url('data:image/svg+xml;utf8,<svg width="60" height="60" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="15" fill="none" stroke="rgba(54, 34, 4, 0.08)" stroke-width="3"/><path d="M30 0 L60 30 L30 60 L0 30 Z" fill="none" stroke="rgba(54, 34, 4, 0.08)" stroke-width="2"/></svg>') repeat;
    animation: panBatik 30s linear infinite;
}


.theme-batik-nusantara .bg-light-dark,
.theme-batik-nusantara .bg-white-black {
    background-image:
        radial-gradient(circle at 24px 24px, rgba(112, 58, 8, .16) 0 8px, transparent 9px),
        radial-gradient(circle at 48px 48px, rgba(153, 82, 17, .12) 0 10px, transparent 11px),
        repeating-linear-gradient(45deg, rgba(54, 34, 4, .06) 0 2px, transparent 2px 20px);
    background-size: 96px 96px, 96px 96px, 42px 42px;
}


.theme-batik-nusantara .bg-theme-auto,
.theme-batik-nusantara .border.rounded-5.shadow,
.theme-batik-nusantara .border.rounded-pill.shadow {
    background: rgba(250, 246, 239, .9) !important;
    border: 1px solid rgba(113, 65, 12, .28) !important;
    box-shadow: 0 18px 38px rgba(54, 34, 4, .15), inset 0 0 0 1px rgba(255, 235, 198, .55) !important;
}


.theme-batik-nusantara .font-esthetic,
.theme-batik-nusantara .text-theme-auto {
    color: #8f4f10 !important;
}


.batik-corner {
    position: absolute;
    top: 50%;
    width: 130px;
    height: 70vh;
    opacity: .12;
    background:
        radial-gradient(circle at 50% 16px, transparent 0 12px, rgba(54, 34, 4, .75) 13px 15px, transparent 16px),
        linear-gradient(90deg, rgba(54, 34, 4, .6), transparent 2px);
    background-size: 52px 52px;
}


.batik-corner.left { left: 0; transform: translateY(-50%); }

.batik-corner.right { right: 0; transform: translateY(-50%) scaleX(-1); }


/* 10. Batik Nusantara */
.theme-batik-nusantara { font-family: "Asap", sans-serif; }

.theme-batik-nusantara h1, .theme-batik-nusantara h2, .theme-batik-nusantara h3, .theme-batik-nusantara h4, .theme-batik-nusantara h5, .theme-batik-nusantara h6 { font-family: "Vast Shadow", serif; }

.theme-batik-nusantara .font-esthetic { font-family: "Berkshire Swash", cursive; }


.signature-batik-nusantara {
    --signature-opacity: .34;
    color: #8f4f10;
}


.signature-batik-nusantara::before {
    inset: 14%;
    background:
        radial-gradient(ellipse at 50% 24%, transparent 0 21%, currentColor 22% 24%, transparent 25%),
        radial-gradient(ellipse at 50% 76%, transparent 0 21%, currentColor 22% 24%, transparent 25%),
        radial-gradient(ellipse at 24% 50%, transparent 0 21%, currentColor 22% 24%, transparent 25%),
        radial-gradient(ellipse at 76% 50%, transparent 0 21%, currentColor 22% 24%, transparent 25%);
    opacity: .45;
}


.signature-batik-nusantara::after {
    inset: 22%;
    border: 1px solid currentColor;
    opacity: .36;
    transform: rotate(45deg);
}


.signature-batik-nusantara span {
    inset: 33%;
    border-radius: 50%;
    background: currentColor;
    opacity: .28;
}


body.theme-batik-nusantara #theme-ornaments::before {
    opacity: .24;
    background:
        repeating-radial-gradient(circle at 50% 50%, rgba(54, 34, 4, .12) 0 2px, transparent 3px 18px),
        repeating-linear-gradient(135deg, rgba(54, 34, 4, .08) 0 3px, transparent 3px 28px);
    background-size: 120px 120px, 160px 160px;
    animation: nusantaraBatikFlow 28s linear infinite;
}


body.theme-batik-nusantara #theme-ornaments::after {
    opacity: .16;
    background:
        linear-gradient(45deg, transparent 0 44%, rgba(127, 84, 45, .14) 46%, transparent 48% 100%),
        linear-gradient(-45deg, transparent 0 44%, rgba(127, 84, 45, .1) 46%, transparent 48% 100%);
    background-size: 140px 140px;
    animation: wovenPatternShift 35s linear infinite;
}