/* Javanese Wayang Black: the original composition in charcoal, ivory, and antique gold. */

body.theme-javanese-wayang-black {
    --theme: #c5a15a;
    --jwayang-burgundy: #c5a15a;
    --jwayang-burgundy-dark: #8d6b32;
    --jwayang-green: #080a09;
    --jwayang-gold: #ecd79f;
    --jwayang-ink: #f4ead1;
    --jwayang-paper: #0d100f;
    --jwayang-paper-soft: #181b19;
    --jwayang-panel: rgba(14, 17, 15, .82);
    --jwayang-gallery-panel: rgba(14, 17, 15, .88);
    --jwayang-border: rgba(213, 180, 104, .38);
    --jwayang-control-background: rgba(197, 161, 90, .92);
    --jwayang-control-border: rgba(236, 215, 159, .55);
    --bs-body-color: #f4ead1;
    --bs-body-bg: #0d100f;
    --bs-emphasis-color: #fffaf0;
    --bs-secondary-color: rgba(244, 234, 209, .76);
    --bs-tertiary-color: rgba(244, 234, 209, .62);
    --bs-border-color: rgba(213, 180, 104, .38);
    color-scheme: dark;
    background: #070908;
}

body.theme-javanese-wayang-black #root > div:last-child,
body.theme-javanese-wayang-black main,
body.theme-javanese-wayang-black main > section,
body.theme-javanese-wayang-black #welcome {
    color: var(--jwayang-ink);
    background-color: var(--jwayang-paper);
}

body.theme-javanese-wayang-black main > section::before,
body.theme-javanese-wayang-black #welcome::before {
    opacity: 1;
    background:
        linear-gradient(180deg, rgba(4, 6, 5, .82), rgba(9, 11, 10, .9)),
        radial-gradient(circle at 50% 35%, rgba(197, 161, 90, .08), transparent 48%),
        url("../../img/javanese-wayang-black-background-v2.jpg") 58% center / cover no-repeat;
}

body.theme-javanese-wayang-black main > section::after,
body.theme-javanese-wayang-black #welcome::after {
    border-color: rgba(213, 180, 104, .12);
    background: none;
}

body.theme-javanese-wayang-black .jwayang-ornament {
    filter: grayscale(.72) sepia(.32) saturate(.72) brightness(.68) contrast(1.12);
}

body.theme-javanese-wayang-black .jwayang-salam-photo,
body.theme-javanese-wayang-black .jwayang-person img {
    border-color: rgba(236, 215, 159, .72);
    box-shadow: 0 .55rem 1.4rem rgba(0, 0, 0, .48);
}

body.theme-javanese-wayang-black .jwayang-person img {
    filter: none;
}

body.theme-javanese-wayang-black [data-countdown-target] {
    color: #0b0d0c;
}

body.theme-javanese-wayang-black .jwayang-open-button,
body.theme-javanese-wayang-black .btn-outline-auto,
body.theme-javanese-wayang-black .btn-primary,
body.theme-javanese-wayang-black #navbar-menu .nav-link.active,
body.theme-javanese-wayang-black #navbar-menu .nav-link[aria-current="page"] {
    color: #0a0c0b;
}

body.theme-javanese-wayang-black .jwayang-open-button:hover,
body.theme-javanese-wayang-black .jwayang-open-button:focus-visible,
body.theme-javanese-wayang-black .btn-outline-auto:hover,
body.theme-javanese-wayang-black .btn-primary:hover,
body.theme-javanese-wayang-black .btn-outline-auto:focus-visible,
body.theme-javanese-wayang-black .btn-primary:focus-visible {
    color: #fff8e8;
}

body.theme-javanese-wayang-black #navbar-menu {
    background: rgba(5, 7, 6, .97);
    box-shadow: 0 -.35rem 1rem rgba(0, 0, 0, .5);
}

body.theme-javanese-wayang-black .audio-float .btn {
    color: #0a0c0b;
}

body.theme-javanese-wayang-black .form-control,
body.theme-javanese-wayang-black .form-select {
    color: var(--jwayang-ink);
    border-color: var(--jwayang-border);
    background-color: rgba(5, 7, 6, .72);
}

body.theme-javanese-wayang-black .form-control::placeholder {
    color: rgba(244, 234, 209, .58);
}

body.theme-javanese-wayang-black .form-control:focus,
body.theme-javanese-wayang-black .form-select:focus {
    border-color: var(--jwayang-gold);
    box-shadow: 0 0 0 .2rem rgba(197, 161, 90, .2);
}

body.theme-javanese-wayang-black .text-muted,
body.theme-javanese-wayang-black .text-secondary {
    color: #d1c3a5;
}

body.theme-javanese-wayang-black .closing-section {
    --closing-accent: #d8b45f;
    --closing-ink: #f1e7cc;
    --closing-soft: rgba(236, 215, 159, .3);
}

body.theme-javanese-wayang-black .closing-honor,
body.theme-javanese-wayang-black .closing-happy,
body.theme-javanese-wayang-black .closing-family-item,
body.theme-javanese-wayang-black .closing-section > .container > p,
body.theme-javanese-wayang-black .closing-section > .container > .font-arabic,
body.theme-javanese-wayang-black .closing-section > .container > small {
    color: var(--closing-ink);
}

@media (prefers-contrast: more) {
    body.theme-javanese-wayang-black {
        --jwayang-ink: #fffaf0;
        --jwayang-gold: #ffe09a;
        --jwayang-border: rgba(255, 224, 154, .72);
    }
}
