:root {
    -webkit-tap-highlight-color: transparent;
    --main-color: #345c8b; /* #fc7d8f */
    --vh: 1vh;

    --bg-color: #f3f3f3;
    --lg-bg: linear-gradient(15deg, #e0bef9 0%, #f5d8d8 50%, #b7dcff 100%) center;
    --font-color: black;

    --sw-on-bg: var(--main-color);
    --sw-off-bg: #becfe4;
    --sw-color: white;

    --client-hover-filter: brightness(0.90);

    --ctn-bg: #e5e5e5;
    --ctn-shadow: 0 2px 3px 1px #222222;

    --card-bg: white;

    --sidebar-bg: white;
    --sidebt-color: #313133;

    --inp-bg: white;
    --inp-bd: #cdcdcd;
    --inp-focus-bd: #afafaf;
    --inp-hover-bg: #f7f7f7;
    --inp-focus-bg: #f7f7f7;

    --btm-color: #c2d6eb;
    --icon-bg: #2b2b43;
    --left-btns-color: #363655;
    --ctn-bd: #2b2b43;
    
    --subctn-color: #c1daf5;

    --ss_bg:var(--main-color);
    --ss_bd:#3a3a3a;
    --ss_items_bg:#f3f3f3;
    --ss_items_bd:#cecece;
    --ss_active_item_bg: #bfd7f1;
    --ss_active_item_bd: #4777b0;
    --ss_option_hover_bg:#d0deee;
    --ss_scrollbar:#404040 #21242a00;

    --media_bg:#f3f3f3;
    --media_shadow:0px 0 15px 0 #00000024;
}

[data-theme="dark"] {
    --bg-color: #12121e;
    --lg-bg: linear-gradient(15deg, #1dc9a3 0%, #1d516e 50%, #06071c 100%) center;
    --font-color: white;

    --client-hover-filter: brightness(1.15);

    --sw-on-bg: var(--main-color);
    --sw-off-bg: #373e4b;
    --sw-color: white;

    --card-bg: #1e1e2c;

    --sidebar-bg: #1d1d29;
    --sidebt-color: #c2c3cc;

    --inp-bg: #21242a;
    --inp-hover-bg: #22262c;
    --inp-focus-bg: #25282e;
    --inp-focus-bd: #595959;
    --inp-bd: #404040;

    --ctn-shadow: 0 2px 3px 1px #070b20;
    --ctn-bg: #16171b;
    --ctn-bd: #213752;

    --btm-color: #213752; /* #1a1a23 */
    --icon-bg: #415e81;
    --left-btns-color: #687e99;
    --subctn-color: #151a23;

    --ss_bg:#21242a;
    --ss_bd:#404040;
    --ss_items_bg:#21242a;
    --ss_items_bd:#404040;
    --ss_active_item_bg:#272b33;
    --ss_active_item_bd:#404040;
    --ss_option_hover_bg:#2f2f2f;
    --ss_scrollbar:#404040 #21242a00;

    --media_bg:#1d1d29;
    --media_shadow:none;
}