:root {
    --white: #323C57;
    --black: #fff;
    --bg-input: #424E71;
    --grayBoday: #222539;
    --grayBodayZero: rgba(252, 252, 252, 0);
    --black-shadow: rgba(0, 0, 0, 0.05);
    --grauinput: #424E71;
    --graydarck: #fff;
    --graylight: #707070;
    --borderInput: #E0E7FF;
    --pagination: #E0E7FF;
    --bordercart: #707070;
    --borderbox: #707070;
    --graylighttwo: #424E71;
    --pink: #CF67EE;
    --pinktwo: #C964EF;
    --Purple: #713CF6;
    --Purpletwo: #A956F1;
    --green: #57D681;
    --black-bg: rgba(0, 0, 0, 0.5);
    --red: #FF2323;
    --blue: #007AFF;
    --f1: #707070;
    --header-bg-light: #fff;
    --footer-bg-light: #f0f0f0
}

/* حالت لایت مود */
body {
    background-color: #fff;
    color: #000;
}
header {
    background-color: var(--header-bg-light);
}

footer {
    background-color: var(--footer-bg-light);
}
body.dark-mode  {
    background-color: #222539;
    color: var(--white);
}

body.dark-mode .text-light {
    color: white !important;
}
body.dark-mode header {
    background-color: #323C57; /* رنگ پیش زمینه هدر دارک مود */
}

body.dark-mode footer {
    background-color: #3C3E4F; /* رنگ پیش زمینه فوتر دارک مود */
}

body.dark-mode p,
body.dark-mode button,
body.dark-mode dd,
body.dark-mode label,
body.dark-mode li,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode th,
body.dark-mode td,
body.dark-mode div,
body.dark-mode span,
body.dark-mode textarea {
    color: #fff !important;
}

body.dark-mode input {
    color: #6a63cd;

}

body.dark-mode .form-gr-submit button span,
body.dark-mode .button-purple span {
    background: #FFF !important;
}

body.dark-mode .pagination-SixSide ul li a {
    color: #000 !important;
}

body.dark-mode .sharing-link span,
body.dark-mode .gift-cart span:nth-child(2),
body.dark-mode .calender-user,
body.dark-mode .blog-box-info-person-info span,
body.dark-mode .header-orders button,
body.dark-mode .sidebar button.active,
body.dark-mode .sidebar button:hover,
body.dark-mode .sidebar button:hover svg,
body.dark-mode .sidebar button.active svg,
body.dark-mode .footer-content-a,
body.dark-mode .header-search form button svg,
body.dark-mode .header-menuLogo span svg,
body.dark-mode .header-menuMB-content-close svg,
body.dark-mode .closelogin span svg,
body.dark-mode .sibar-list-blog span,
body.dark-mode .sroll-login::-webkit-scrollbar,
body.dark-mode .sroll::-webkit-scrollbar,
body.dark-mode .sroll-panel::-webkit-scrollbar,
body.dark-mode .module-account .trigger ul.locations,
body.dark-mode .module-account .trigger ul.locations li a,
body.dark-mode .cart-boxLerning,
body.dark-mode .cart-boxLerning a,
body.dark-mode .form-gr-textarea textarea,
body.dark-mode .listof-desk,
body.dark-mode .background-ticket,
body.dark-mode .thead-dark,
body.dark-mode .back-data-ticket {
    color: #FFF !important;
    background-color: #424A61;
}

body.dark-mode .gift-cart-price-txt dd,
body.dark-mode .learn-more {
    color: var(--green) !important;
}

body.dark-mode input[type="radio"] {
    accent-color: var(--white); /* رنگ رادیو باتن */
    background-color: var(--graylighttwo); /* پس زمینه رادیو باتن */
}

body.dark-mode input[type="radio"]:checked {
    accent-color: var(--blue); /* رنگ رادیو باتن وقتی انتخاب شده */
    background-color: #6b6b79; /* پس زمینه رادیو باتن وقتی انتخاب شده */
}
body.dark-mode .footer-content-a:hover {
    border: 1px solid var(--pink) !important;
}

body.dark-mode .d-n-dark {
    display: none;
}

body.dark-mode .d-b-dark {
    display: block;
}

body.dark-mode .button-purple {
    color: white !important;
}
.dark-mode .hide-on-dark-mode {
    display: none !important;
}



body.dark-mode .backimgcount {
    background-image: url("/userAssets/image/img/Mask Group 41-min.png");
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 2px 2px 8px 1px #6363633d;
    border-radius: 14px;
    color: #fff !important;
}

body.dark-mode .table-responsive {
    box-shadow: none;
}

body.dark-mode .header {
    background-color: var(--grayBoday);
}
/* Existing CSS rules */

body.dark-mode .dark-mode-div {
    background-color: #333550; /* Replace with hex value */
    color: #333550; /* Replace with hex value */
}
body.dark-mode .dark-mob {
    background-color: #323c57;
}
body.dark-mode .dark-mode-splide {
    background-color: #323C57;
    color: white !important;
}
body.dark-mode .dark-nav {
    background-color: #3D4868!important;
    color: #bbb!important;

}
.dark-mode .hide-on-dark-mode {
    display: none !important;
}


body.dark-mode .toggle-tab-dark {
    background-color: #424A61;
    color: #bbb!important;
}
body.dark-mode .warning-box {
    background-color: #474853;
    color: #bbb;
}
body.dark-mode .icon-svg {
    color: #bbb;

}
.light-icon {
    fill: #AEA9B1; /* Default light mode color */
}

.dark-icon {
    fill: white; /* Dark mode color */
}