:root {
    --background: #fff;
    --primary-color: #D9d9d9;
    --text-color: #272727;
    --footer-color: #fff;
    --footer-border: #D9d9d9;
    --nav: #eeeeee;
    --search-bg: #fff;
    --next-bg: #e1e1e1;
    --card-header: #f8f8f8;
    --card-body: #fff;
    --wrapperx: #f5f5f5;
    --head-form: #fff;
    --input-bg: #fff;
    --input-text: #272727;
    --divider: transparent;
    --top-tabulasi: #d9d9d9;
    --content: #fbfbfb;
    --label-pengkinian: #F8F9FA;
    --body-internal: #f2f2f2;
    --btn-side-hover: #9090906f;
    --sidebar-bg: transparent;
    --merah-btn-side: #a11818;
    --putih-btn-side: #fff;
    --background-view-form: #f1f1f1;
    --nav-color: #eeeeee;
    --box-shadow: #00000021;
    --post-title: #1d2327;
    --post-user: #949494;
    --hover-close-button: #D82E2E;
    --btn-unduh: #dfdfdf;
    --font-grey: #666666;
    --black-white: #000;
    --background-focus: #bab9b9;
    --red: #ff0000;
    --masonry-img: #66666600;
    --box-shadow-media: #0000001a;
    --card-border: #e9ecef;
    --bg-ads: #fbfbfb;

    --border: #1c44361f;
    --cream-tua: #e5ded4;
    --cream-muda: #ffffff;
    --cream-putih: #eeeeee;
    --hijau-tua: #1c4436;
    --btn-hijau-tua: #1c4436;
    --btn-font-hijau-tua: #1c4436;
    --btn-hover-hijau-tua: #fff;
    --btn-nav: #919191;
    --orange: #e0562e;
    --image-dark: none;
    --image-light: block;
    --image-dark-flex: none;
    --image-light-flex: inline;
    --border-nav: #1c44361f;
    --side-label: #D5BFA2;
    --side-option: #e5ded4;
    --salam: #eeeeee;
}

[data-theme="dark"] {
    --orange: #e0562e;
    --btn-nav: #fff;
    --hijau-tua: #fff;
    --btn-hijau-tua: #fff;
    --btn-font-hijau-tua: #fff;
    --btn-hover-hijau-tua: #282828;
    --cream-putih: #282828;
    --cream-muda: #282828;
    --cream-tua: #282828;
    --border: #474747;
    --border-nav: #474747;
    /* --border-nav: transparent; */
    --side-label: #515151;
    --side-option: #363636;

    --background: #282828;
    --primary-color: #282828;
    --text-color: #fff;
    --footer-color: #404040;
    --footer-border: #515151;
    --nav: #363636;
    --search-bg: #383838;
    --next-bg: #404040;
    --card-header: #404040;
    --card-body: #404040;
    --wrapperx: #404040;
    --head-form: #404040;
    --input-bg: #404040;
    --input-text: #cfcfcf;
    --divider: #282828;
    --top-tabulasi: #606060;
    --label-pengkinian: #C3C3C3;
    --isi-pengkinian: #eaeaea;
    --content: #282828;
    --body-internal: #404040;
    --buuton-disable: #a5a4a4;
    --btn-side-hover: #a5a4a4;
    --sidebar-bg: #d9d9d9;
    --merah-btn-side: #fff;
    --putih-btn-side: #a11818;
    --nav-color: #eeeeee;
    --box-shadow: #00000021;
    --post-title: #eaf4fa;
    --post-user: #949494;
    --hover-close-button: #D82E2E;
    --btn-unduh: #dfdfdf;
    --font-grey: #ffffff;
    --black-white: #fff;
    --background-focus: #606060;
    --red: #ff0000;
    --masonry-img: #272727b7;
    --box-shadow-media: #8888881a;
    --card-border: #404040;
    --bg-ads: #404040;
    --image-light: none;
    --image-dark: block;
    --image-light-flex: none;
    --image-dark-flex: inline;
    --salam: transparent;
}

[data-theme="clean"] {
    --orange: #e0562e;
    --btn-nav: #fff;
    --hijau-tua: #1c4436;
    --btn-hijau-tua: #1c4436;
    --btn-font-hijau-tua: #1c4436;
    --btn-hover-hijau-tua: #fff;
    --cream-putih: #f4f4f4;
    --cream-muda: #fff;
    --cream-tua: #fff;
    --border: #e5ded4;
    --border-nav: #e5ded4;
    /* --border-nav: transparent; */
    --side-label: #e5ded4;
    --side-option: #faf8f6;

    --background: #fff;
    --primary-color: #282828;
    --text-color: #1c4436;
    --footer-color: #404040;
    --footer-border: #515151;
    --nav: #fff;
    --search-bg: #383838;
    --next-bg: #404040;
    --card-header: #f8f8f8;
    --card-body: #fff;
    --wrapperx: #404040;
    --head-form: #404040;
    --input-bg: #fff;
    --input-text: #cfcfcf;
    --divider: #282828;
    --top-tabulasi: #606060;
    --label-pengkinian: #C3C3C3;
    --isi-pengkinian: #eaeaea;
    --content: #282828;
    --body-internal: #404040;
    --buuton-disable: #a5a4a4;
    --btn-side-hover: #a5a4a4;
    --sidebar-bg: #d9d9d9;
    --merah-btn-side: #fff;
    --putih-btn-side: #a11818;
    --nav-color: #eeeeee;
    --box-shadow: #00000021;
    --post-title: #eaf4fa;
    --post-user: #949494;
    --hover-close-button: #D82E2E;
    --btn-unduh: #dfdfdf;
    --font-grey: #1c4436;
    --black-white: #fff;
    --background-focus: #606060;
    --red: #ff0000;
    --masonry-img: #272727b7;
    --box-shadow-media: #8888881a;
    --card-border: #404040;
    --bg-ads: #404040;
    --image-dark: none;
    --image-light: block;
    --image-dark-flex: none;
    --image-light-flex: inline;
    --salam: transparent;
}