:root {

/* Background */
--bg: radial-gradient(circle at 25% 13%, rgba(77, 105, 143, 0.85),
rgba(0, 120, 255, 0) 27%),
radial-gradient(circle at 76% 4%, rgba(77, 105, 143, 0.85),
        rgba(0, 150, 255, 0) 30%),
radial-gradient(circle at 50% 100%,
        rgba(77, 105, 143, 0.85),
        rgba(0, 110, 255, 0) 29%),
radial-gradient(circle at 100% 97%, rgba(77, 105, 143, 0.85),
        rgba(0, 110, 255, 0) 19%),
radial-gradient(circle at 0% 97%, rgba(77, 105, 143, 0.85),
        rgba(0, 110, 255, 0) 19%);


    /* Background Colors */

    --topbar: linear-gradient(180deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.6));
    --topbarbuttons: #ffffff;
    --header-hero: rgba(71, 100, 144, 0.68);
    --topbar-dashboard: #fff;
    --container-ly: rgba(255, 255, 255, 0.49);
    --header-gradient: linear-gradient(rgba(255, 255, 255, 0.47), rgba(255, 255, 255, 0));
    --menu-button: rgba(255, 255, 255, 1.62);
    --side-buttons: #fff;
    --sub-active: #3f6595;
    --side-buttons-icons: #396b9e;
    --article-box:
            radial-gradient(circle at 0% 21%, rgb(255, 255, 255), rgba(172, 196, 227, 0.14) 41%),
            radial-gradient(circle at 30% 21%, rgb(255, 255, 255), rgba(172, 196, 227, 0.14) 50%),
            radial-gradient(circle at 60% 26%, rgb(255, 255, 255), rgba(172, 196, 227, 0.11) 80%),
            radial-gradient(circle at 100% 18%, rgb(255, 255, 255), rgba(172, 196, 227, 0.09) 100%);
    --article-box-hover: #fff;
    --line-primary: #fff;
    --carousel-layer: rgba(255, 255, 255, 0.81);
    --caro-gradient: linear-gradient(180deg, rgba(255,255,255,0) 80%, rgba(31,81,139,0.68));
    --article-tags: #ffffff;
    --animes-overly: rgba(255, 255, 255, 0.11);
    --megamenu-layer: linear-gradient(178deg, rgba(255, 255, 255, 0.81) 0%, rgba(255, 255, 255, 0.77) 100%);
    --megamenu-line: rgba(88, 126, 182, 0.41);
    --base-input: #fff;
    --top-buttens: none;
    --top-input-buttons: #b3c8da;
    --update-header:
            radial-gradient(circle at 0% 7%, rgb(255, 255, 255), rgba(57, 106, 156, 0.25) 40%),
            radial-gradient(circle at 79% 1%, rgb(255, 255, 255), rgba(57, 106, 156, 0.25) 66%),
            radial-gradient(circle at 40% 38%, rgb(255, 255, 255), rgba(57, 106, 156, 0.25) 39%);
    --update-body: rgb(255, 255, 255);
    --top-layers: rgba(255, 255, 255, 0.9);
    --status-box: rgba(255, 255, 255, 0.6);
    --textarea-primary: #fff;
    --feed-item: rgba(255, 255, 255, 0.76);
    --comment-box: rgba(180, 199, 227, 0.12);
    --nested-comment: rgba(251, 251, 251, 0.72);
    --primary-button: #5075a2;
    --primary-button-hover: #406fa6;
    --anime-page-gradient: linear-gradient(180deg, #ffffff00 61%, #ffffff57 88%, #ffffff 98%);
    --main-bg: #fff;
    --main-title: rgba(255, 255, 255, 0.87);
    --cta-text-layer: rgba(88, 126, 182, 0.07);
    --bday-ly: linear-gradient(135deg, #8bb9ff, #446eaa);
    --bday-ly-over: radial-gradient(circle at top, rgba(88, 126, 182, 0.6), rgba(0,0,0,0.7));
    --anime-manga-buttons: rgb(224, 231, 241);
    --anime-manga-inner-info: #E6EBF1D3;
    --anime-manga-inner-info-title: rgba(255, 255, 255, 0.42);
    --anime-manga-inner-info-value: rgb(255, 255, 255);
    --anime-shelf-input: #fff;
    --anime-manga-gradient-score: linear-gradient(180deg, rgba(210, 221, 237, 0.76) 30%, rgba(255, 255, 255, 0) 99%);
    --rating-bar: #b3b3b3;
    --profile-nav: rgba(255, 255, 255, 0.8);
    --profile-area: rgba(255, 255, 255, 0.66);
    --profile-nav-hover: rgba(255, 255, 255, 0.4);
    --line-about: rgba(86, 119, 140, 0.42);
    --animes-filters-bg: rgba(255, 255, 255, 0.74);
    --animusic-row: #ffffff;
    --animusic-player: rgba(255, 255, 255, 0.81);
    --anime-cover-bg: none;
    --animusic-header-footer: rgba(159, 177, 200, 0.38);
    --animusic-button: rgba(231, 235, 241, 0.85);
    --animusic-player-button: #fff;
    --xp-box: rgba(63, 105, 151, 0.73);
    --community-title: rgba(232, 238, 244, 0.72);
    --community-box: rgba(255, 255, 255, 0.64);
    --community-box-even: rgba(255, 255, 255, 0.86);
    --chat-bubble-name: #c4ceda;
    --cale-day: radial-gradient(circle at top right,
    rgba(255, 255, 255, 0.28),
    rgba(255, 255, 255, 0.82));
    --top-cale: linear-gradient(to bottom, rgba(88, 121, 170, 0.9), rgba(56, 92, 149, 0.9));
    border: 1px solid rgba(105, 163, 230, 0.55);
    --cale-event-window: radial-gradient(circle at top,
    rgba(255, 255, 255, 0.22),
    rgba(255, 255, 255, 0.98));
    --cal-other: radial-gradient(circle at top right,
    rgba(94, 134, 186, 0.15),
    rgba(144, 169, 207, 0.76));
    --today-label: rgb(72, 108, 170);
    --event-user: rgba(139, 176, 218, 0.44);
    --calendar-button: radial-gradient(circle at top, rgba(165, 215, 255, 0.25), rgba(139, 175, 211, 0.95));
    --calendar-lay: rgba(133, 163, 197, 0.47);
    --bg-main-title: rgb(163, 190, 209);
    --home-anime-tab: rgba(255,255,255,.65);
    --home-anime-tab-hover: rgba(255,255,255,.95);
    --fresh-area: rgba(255,255,255,.35);
    --fresh-card: rgba(255,255,255,.72);
    --fresh-viewall: rgba(255,255,255,.65);

    /* Text Colors */

    --normal: #000;
    --primary: #396b9e;
    --secondery: #194470;
    --light: #cadcf3;
    --muted: rgb(104, 104, 104);
    --placeholder: rgb(159, 159, 159);

    /* Border Colors */

    --beg-border: rgba(0,0,0,.08);
    --topbar-dashboard-border: rgba(181, 199, 220, 0.34);
    --common-white-border: #fff;
    --article-box-border: rgba(255,255,255,0.4);
    --anime-box-border: 1px solid rgba(255,255,255,0.6);
    --anime-shelf-input-border: #e0e7f1;
    --profile-picture-border: #fff;
    --animusic-line-border: rgba(0,0,0,0.05);
    --cale-today-border: #145cc3;
    --cale-button-border: rgba(165, 207, 255, 0.8);


    /* BoxShadow Colors */

    --topbar-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
    --topbarbuttons-shadow: 0 1px 6px rgba(0,0,0,.06);
    --shadow_caru: 0 10px 26px rgba(0, 0, 0, 0.12);
    --article-box-shadow: 0 8px 32px rgba(0,0,0,0.06), 0 0 20px rgba(255,255,255,0.25) inset;
    --article-box-shadow-before: linear-gradient(
            to right,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,0.45) 40%,
            rgba(255,255,255,0.45) 60%,
            rgba(255,255,255,0) 100%
    );
    --menu-layer-hover: 0 4px 12px rgba(80, 120, 200, 0.45);
    --anime-box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    --box-text-shadow: 1px 1px white;
    --feed-item-shadow: 0 8px 32px rgba(0,0,0,0.06), 0 0 20px rgba(255,255,255,0.25) inset;
    --comment-box-shadow: 0 0 5px rgba(255, 255, 255, 0.1);
    --animusic-panel-shadow: 0 12px 35px rgba(179, 179, 179, 0.6);
    --calendar: 0 18px 45px rgba(79, 125, 184, 0.55);
    --cale-today:  0 0 18px rgba(25, 65, 126, 0.76);
    --cale-button: rgba(31, 81, 139, 0.27);

}


/* =========================================================
SAKURA THEME
  ========================================================== */

.theme-classic {

    /* Background */
    --bg: radial-gradient(circle at 25% 13%, rgba(229, 40, 40, 0.37),
    rgba(0, 120, 255, 0) 27%),
    radial-gradient(circle at 76% 4%, rgba(229, 40, 40, 0.37),
            rgba(0, 150, 255, 0) 30%),
    radial-gradient(circle at 50% 100%,
            rgba(229, 40, 40, 0.37),
            rgba(0, 110, 255, 0) 29%),
    radial-gradient(circle at 100% 97%, rgba(229, 40, 40, 0.37),
            rgba(0, 110, 255, 0) 19%),
    radial-gradient(circle at 0% 97%, rgba(229, 40, 40, 0.37),
            rgba(0, 110, 255, 0) 19%), url("/images/ambgf-s.jpg");

    /* Background Colors */

    --header-hero: linear-gradient(180deg, rgb(220 67 74 / 45%) 0%, rgb(255 0 0 / 44%) 40%, rgb(255 36 36 / 42%) 100%);
    --caro-gradient: linear-gradient(180deg, rgba(255,255,255,0) 80%, rgba(139, 31, 35, 0.68));
    --sub-active: #ca3636;
    --top-input-buttons: #dab3b3;
    --bday-ly: linear-gradient(135deg, #ff8bb5, #ffb2d4);
    --bday-ly-over: radial-gradient(circle at top, rgba(255, 188, 210, 0.4), rgba(0,0,0,0.7));
    --cale-day: radial-gradient(circle at top right,
    rgba(255, 255, 255, 0.28),
    rgba(255, 255, 255, 0.82));
    --top-cale: linear-gradient(to bottom, rgba(170, 88, 88, 0.9), rgba(149, 56, 56, 0.9));
    border: 1px solid rgba(230, 105, 105, 0.55);
    --cale-event-window: radial-gradient(circle at top,
    rgba(255, 255, 255, 0.22),
    rgba(255, 255, 255, 0.98));
    --cal-other: radial-gradient(circle at top right,
    rgba(186, 94, 94, 0.15),
    rgba(207, 144, 144, 0.76));
    --today-label: rgb(170, 72, 72);
    --event-user: rgba(218, 139, 139, 0.44);


    --primary: #bc3b3b;

    --cale-today-border: #c31414;


    /* BoxShadow Colors */

    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
    --calendar: 0 18px 45px rgba(184, 79, 79, 0.55);
    --cale-today:  0 0 18px rgba(126, 25, 25, 0.76);

}

/* =========================================================
DARK THEME
  ========================================================== */
.theme-dark {

    /* Background */
    --bg: radial-gradient(circle at 25% 13%, rgba(0, 0, 0, 0.72),
    rgba(0, 120, 255, 0) 27%),
    radial-gradient(circle at 76% 4%, rgba(0, 0, 0, 0.72),
            rgba(0, 150, 255, 0) 30%),
    radial-gradient(circle at 50% 100%,
            rgba(0, 0, 0, 0.72),
            rgba(0, 110, 255, 0) 29%),
    radial-gradient(circle at 100% 97%, rgba(0, 0, 0, 0.72),
            rgba(0, 110, 255, 0) 19%),
    radial-gradient(circle at 0% 97%, rgba(0, 0, 0, 0.72),
            rgba(0, 110, 255, 0) 19%), url("/images/ambgf-d.jpg");

    /* Background Colors */
    --topbar: linear-gradient(180deg, rgba(0, 0, 0, 0.66), rgba(0, 0, 0, 0.6));
    --topbarbuttons: #2e2e2e;
    --header-hero: linear-gradient(
            180deg,
            rgba(20, 45, 95, 0.45) 0%,
            rgba(20, 45, 95, 0.25) 40%,
            rgba(20, 45, 95, 0.10) 100%
    );
    --container-ly: rgba(0, 0, 0, 0.28);
    --topbar-dashboard: #071525;
    --side-buttons: #000;
    --side-buttons-icons: #fff;
    --header-gradient: linear-gradient(rgba(0, 0, 0, 0), rgba(255, 255, 255, 0));
    --menu-button: rgb(0, 0, 0);
    --article-box: rgba(0, 0, 0, 0.47);
    --article-box-hover: #000000;
    --line-primary: #0e1623;
    --carousel-layer: rgba(0, 0, 0.81);
    --article-tags: #000;
    --animes-overly: rgba(0, 0, 0, 0.16);
    --megamenu-layer: linear-gradient(178deg, rgba(0, 0, 0, 0.81) 0%, rgba(0, 0, 0, 0.77) 100%);
    --megamenu-line: rgba(255, 255, 255, 0.21);
    --base-input: rgba(125, 144, 175, 0.73);
    --top-buttens: brightness(0) saturate(100%) invert(97%) sepia(88%) saturate(1504%) hue-rotate(175deg) brightness(102%) contrast(101%);
    --top-input-buttons: #628bc1;
    --update-header: rgba(22, 60, 115, 0.2);
    --update-body: rgba(0, 0, 0, 0.46);
    --top-layers: rgba(0, 0, 0, 0.9);
    --status-box: rgba(0, 0, 0, 0.6);
    --textarea-primary: rgb(7, 19, 37);
    --feed-item: rgba(0, 0, 0, 0.76);
    --comment-box: rgba(0, 0, 0, 0.84);
    --nested-comment: rgba(0, 0, 0, 0.72);
    --primary-button: #1d3851;
    --anime-page-gradient: linear-gradient(180deg, rgba(0, 0, 0, 0) 61%, rgba(0, 0, 0, 0.34) 88%, #000000 98%);
    --main-bg: #000000;
    --main-title: rgba(0, 0, 0, 0.87);
    --cta-text-layer: rgb(26, 43, 69);
    --bday-ly: linear-gradient(135deg, #000000, #000000);
    --bday-ly-over: radial-gradient(circle at top, rgba(188, 217, 255, 0.4), rgba(0,0,0,0.7));
    --anime-manga-buttons: rgba(12, 46, 83, 0.75);
    --anime-manga-inner-info: rgba(9, 22, 48, 0.76);
    --anime-manga-inner-info-title: rgba(0, 0, 0, 0.42);
    --anime-manga-inner-info-value: rgb(0, 0, 0);
    --anime-shelf-input: #2a3c57;
    --anime-manga-gradient-score: linear-gradient(180deg, rgba(11, 36, 57, 0.76) 30%, rgba(255, 255, 255, 0) 99%);
    --rating-bar: #777777;
    --profile-nav: rgba(0, 0, 0, 0.8);
    --profile-area: rgba(0, 0, 0, 0.66);
    --profile-nav-hover: rgba(0, 0, 0, 0.78);
    --line-about: rgba(43, 65, 85, 0.71);
    --animes-filters-bg: rgba(0, 0, 0, 0.47);
    --animusic-row: #000000;
    --animusic-player: rgba(0, 0, 0, 0.81);
    --anime-cover-bg: #b4cbef;
    --animusic-header-footer: rgba(0, 0, 0, 0.38);
    --animusic-button: rgba(0, 0, 0, 0.85);
    --animusic-player-button: #000000;
    --xp-box: rgba(0, 0, 0, 0.73);
    --community-title: rgba(0, 0, 0, 0.54);
    --community-box: rgba(0, 0, 0, 0.64);
    --community-box-even: rgba(0, 0, 0, 0.64);
    --chat-bubble-name: #274365;
    --cale-day: radial-gradient(circle at top right,
    rgba(0, 0, 0, 0.28),
    rgba(0, 0, 0, 0.82));
    --top-cale: linear-gradient(to bottom, rgb(88, 126, 182), rgba(26, 59, 108, 0.9));
    --cale-event-window: radial-gradient(circle at top,
    rgb(47, 70, 115),
    rgba(0, 0, 0, 0.98));
    --calendar-button: radial-gradient(circle at top, rgba(165, 204, 255, 0.25), rgba(18, 28, 40, 0.95));
    --calendar-lay: rgba(10, 8, 30, 0.9);
    --home-anime-tab: rgba(0, 0, 0, 0.65);
    --home-anime-tab-hover: rgba(0, 0, 0, 0.95);
    --fresh-area: rgba(10, 46, 74, 0.16);
    --fresh-card: rgba(0, 0, 0, 0.72);
    --fresh-viewall: rgba(0, 0, 0, 0.65);
    
    /* Text Colors */

    --normal: #fff;
    --primary: #b4cbef;
    --secondery: #476aa1;
    --light: #b8d3f1;
    --muted: rgba(162, 183, 218, 0.74);
    --placeholder: rgb(113, 138, 181);

    /* Border Colors */
    --beg-border: rgb(0, 0, 0);
    --topbar-dashboard-border: rgba(53, 53, 53, 0.34);
    --common-white-border: #000000;
    --article-box-border: rgba(0, 0, 0, 0.73);
    --anime-box-border: 1px solid rgba(0, 0, 0, 0.6);
    --anime-shelf-input-border: #1f314a;
    --profile-picture-border: #000000;
    --animusic-line-border: rgb(37, 37, 37);
    --cale-today-border: #fff;
    --cale-button-border: rgba(165, 207, 255, 0.8);

    /* BoxShadow Colors */
    --topbar-shadow: 0 10px 26px rgba(255, 255, 255, 0.12);
    --topbarbuttons-shadow: 0 1px 6px rgba(39, 39, 39, 0.54);
    --shadow_caru: 0 10px 26px rgba(0, 0, 0, 0.8);
    --article-box-shadow: 0 8px 32px rgba(0, 0, 0, 0.74), 0 0 20px rgba(0, 0, 0, 0.85) inset;
    --article-box-shadow-before: linear-gradient(
            to right,
            rgba(0, 0, 0, 0) 0%,
            rgba(0, 0, 0, 0.45) 40%,
            rgba(0, 0, 0, 0.45) 60%,
            rgba(0, 0, 0, 0) 100%
    );
    --menu-layer-hover: 0 4px 12px rgba(255, 255, 255, 0.17);
    --anime-box-shadow: 0 8px 20px rgb(0, 0, 0);
    --box-text-shadow: 1px 1px black;
    --feed-item-shadow: 0 8px 32px rgba(0, 0, 0, 0.48), 0 0 20px rgba(0, 0, 0, 0.25) inset;
    --comment-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
    --animusic-panel-shadow: 0 12px 35px rgba(0, 0, 0, 0.6);
    --calendar: 0 18px 45px rgba(0, 0, 0, 0.55);
    --cale-today:  0 0 18px rgba(255, 255, 255, 0.76);
    --cale-button: rgba(97, 97, 97, 0.9);

}