:root {
    --primary:      #19548d;
    --primary-dark: #1967b1;
    --btn-primary:  #186ebe;
    --btn-pr-hover: #115ea7;
    --primary-1:    #19548d1a;
    --primary-2:    #19548d33;
    --primary-3:    #19548d80;
    --primary-4:    #19548d0e;
    --primary-5:    #5345a424;
    --lighter:      #e8eef4;
    --bg-app:       #f5f7fb;
    --black:        #111827;
    --white:        #fff;
    --text1:        #5b6581;
    --text2:        #5c5c5c;
    --gray:         #d9d9d9;
    --lightgray:    #f3f4f6;
    --lightblue:    #f0f8ff;
    --lightblue2:   #f1f4f9;
    --lightblue3:   rgb(241 248 255 / 41%);
    --dark-gray:    #7d7d7d;
    --red:          #f44336;
    --yellow:       #ffff00;
    --border-soft:  #e4e4e4;
    --border:       #d4d4d8;
    --lbl1:         #16a34a;
    --lbl7:         #f0fdf4;
    --lbl11:        #dcfce7;
    --lbl2:         #2196F3;
    --lbl3:         #d76fe1;
    --lbl4:         #f7bd6a;
    --lbl5:         #3F51B5;
    --lbl6:         #eef2ff;
    --lbl8:         #ef4444;
    --lbl9:         #fef2f2;
    --lbl12:         #fee2e2;
    --lbl10:        #e0e7ff;
    --lbl13:        #ecfdf5;
    --lbl14:        #059669;
    --lbl5-mobile:  #bcc6ff;
    --delete:       #ed5e68;
    --delete-hover: #da3f4a;
    --indicator:    #00dfff;
    --placeholder:  #9ca3af;
    --bg-mobile:    #F3F4F6;
    --bar-text:     #334155;
}

body.theme-purple {
    --primary:      #4f46a5;
    --primary-dark: #3c2ec9;
    --btn-primary:  #845adf;
    --btn-pr-hover: #5b2fd6;
    --primary-1:    #4f46a51a;
    --primary-2:    #4f46a533;
    --primary-3:    #4f46a580;
    --primary-4:    #4f46a50e;
    --primary-5:    #5345a424;
    --lighter:      #efedf8;
    --bg-app:       #f6f5fb;
    --black:        #111827;
    --white:        #fff;
    --text1:        #5b6581;
    --text2:        #5c5c5c;
    --gray:         #d9d9d9;
    --lightgray:    #f2f1f6;
    --lightblue:    #f3f2fb;
    --lightblue2:   #f1f0f8;
    --dark-gray:    #7d7d7d;
    --red:          #f44336;
    --yellow:       #ffff00;
    --border-soft:  #e4e4e4;
    --border:       #d4d4d8;
    --lbl1:         #62d774;
    --lbl2:         #2196F3;
    --lbl3:         #d76fe1;
    --lbl4:         #f7bd6a;
    --lbl5:         #3F51B5;
    --delete:       #ed5e68;
    --delete-hover: #da3f4a;
    --indicator:    #00dfff;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
    max-width: 100%;
}

html,
body {
    height: 100%;
    margin: 0;
}

body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    max-width: 100%;
    padding: 0;
    /* background: var(--bg-app); */
    background-color: rgb(240 244 248 / 35%);
    background-image: radial-gradient(#1E4E84 0.5px, transparent 0.5px), radial-gradient(#1E4E84 0.5px, #f0f4f8 0.5px);
    background-size: 100% 100%;
    background-position: 0 0, 10px 10px;
    background-blend-mode: multiply;
    color: var(--black);
    font-family: "Noto Sans Hebrew", "Heebo", Arial, sans-serif;
    font-size: clamp(16px, 2vw, 18px);
    line-height: 1.5;
    direction: rtl;
}

.table {
    display: flex !important;
    flex-direction: column;
}

.app-header {
    visibility: hidden;
}

@media (min-width: 1281px) {
    .desktop-hidden {
        display: none !important;
    }
}

@media (max-width: 1280px) {
    .mobile-hidden {
        display: none !important;
    }
}