@font-face {
    font-family: 'Famtree';
    src: url('../fonts/Famtree-Light.woff2') format('woff2'),
    url('../fonts/Famtree-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Famtree';
    src: url('../fonts/Famtree-Medium.woff2') format('woff2'),
    url('../fonts/Famtree-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Famtree';
    src: url('../fonts/Famtree-Regular.woff2') format('woff2'),
    url('../fonts/Famtree-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --primary: #3167b7;
    --primary_hover: #784ca7;
    /*--primary_op: rgba(0, 79 ,3 , 0.01);*/
    --primary_op: rgba(49, 103, 183, 0.11);
    --danger: #dc3545;
    --success: #68B360;
    --gray-text: #a1a5b7;
    --gray-border: #D0D5DD;
    --bs-link-hover-color: #784ca7;
    --bs-link-color: #3167b7;
    --dark: #101010;
    --bs-border-color: #3167b7;
    --background-v1: #784ca7; /* Old browsers */
    --background-v2: -moz-linear-gradient(top, #784ca7 0%, #3167b7 100%); /* FF3.6-15 */
    --background-v3: -webkit-linear-gradient(top, #784ca7 0%, #3167b7 100%); /* Chrome10-25,Safari5.1-6 */
    --background-v4: linear-gradient(to bottom, #784ca7 0%, #3167b7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    --filter-v5: progid: DXImageTransform . Microsoft . gradient(startColorstr = '#784ca7', endColorstr = '#3167b7', GradientType = 0); /* IE6-9 */

    --background-h1: #784ca7; /* Old browsers */
    --background-h2: -moz-linear-gradient(left, #784ca7 0%, #3167b7 100%); /* FF3.6-15 */
    --background-h3: -webkit-linear-gradient(left, #784ca7 0%, #3167b7 100%); /* Chrome10-25,Safari5.1-6 */
    --background-h4: linear-gradient(to right, #784ca7 0%, #3167b7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    --filter-h5: progid: DXImageTransform . Microsoft . gradient(startColorstr = '#784ca7', endColorstr = '#3167b7', GradientType = 1); /* IE6-9 */

}

a {
    text-decoration: none;
}

/*//////////////////////*/
::after, ::before {
    height: auto;
}

::-webkit-scrollbar {
    width: 6px;
    background: #f6f6f6;
}

/* Track */

::-webkit-scrollbar-track {
    border-radius: 0;
}

/* Handle */

::-webkit-scrollbar-thumb {
    background: #2D2D2D;
}

::-webkit-scrollbar-thumb:window-inactive {
    background: #2D2D2D;
}

*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

* {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

html[lang=ar] {
    overflow-x: hidden;
    direction: rtl;
}

html[lang=en] {
    overflow-x: hidden;
    direction: ltr;
}

body {
    font-family: 'Famtree', sans-serif;
    font-size: 14px;
    font-weight: 400;
    /*overflow-x: hidden;*/
    background-color: rgba(0, 79, 3, 0.01);
}

ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Famtree', sans-serif;
    font-weight: 500;
    font-style: normal;
    margin: 0;
}


p {
    margin: 0;
}

html,
button,
input,
select,
textarea {
    color: #222;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

img {
    vertical-align: middle;
    max-width: 100%;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

a, li, .admin-menu-toggle, .admin-app, .side-bar {
    transition: all 0.3s ease;
}

.container {
    height: 100%;
}

section {
    position: relative;
}

.admin-app {
    padding-right: 240px;
    position: relative;
}

.admin-app.client-app {
    padding-right: 0 !important;
    padding-left: 0 !important;

}

.side-bar {
    position: fixed;
    top: 0;
    right: 0;
    width: 240px;
    min-height: 100vh;
    background: var(--background-v1);
    background: var(--background-v2);
    background: var(--background-v3);
    background: var(--background-v4);
    filter: var(--filter-v5);

    /*border-left: 1px solid #EFEFEF;*/
    z-index: 3;
}

.bg-primary {
    background: var(--background-v1) !important;
    background: var(--background-v2) !important;
    background: var(--background-v3) !important;
    background: var(--background-v4) !important;
    filter: var(--filter-v5) !important;
}

.header {
    background: var(--primary_op) url("../images/btrn-h-b.svg");
    padding: 15px;
    width: 100%;
    border-bottom: 1px solid #EFEFEF;
    height: 130px;
}

.footer {
    background: var(--background-h1);
    background: var(--background-h2);
    background: var(--background-h3);
    background: var(--background-h4);
    filter: var(--filter-h5);
    padding: 15px;
    width: 100%;
    /*border-top: 2px solid var(--primary);*/
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}


.header h1 {
    font-size: 32px;
    font-weight: 400;
}

.user-data {
    color: var(--dark);
    justify-content: flex-start;
    display: flex;
    align-items: center;
    background: #F2F4F7;
    border-radius: 30px;
    height: 50px;
    padding: 5px;
}

.dropdown-toggle:after {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f107";
    border: none;
    font-size: 11px;
    margin-right: 10px;
    margin-left: 5px;
    color: #B9B9B9;
}

.select2-container {
    width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: none !important;
    left: 0;
    margin: 0 !important;
    position: absolute;
    top: 0;
    width: 20px;
    display: flex;
    height: 48px;
    align-items: center;
    justify-content: center;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b:after {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f107";
    border: none;
    font-size: 11px;
    color: #B9B9B9;
    position: relative;
    z-index: 111;
}

.dropdown-menu .dropdown-item {
    font-size: 12px;
    font-weight: 400;
    position: relative;
}


.dropdown-menu .dropdown-item i {
    font-size: 18px;
    width: 25px;
}

.dropdown-menu li:first-child .dropdown-item:after {
    height: 50%;
}

.user-data .img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
}

.user-data .img img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}


.user-data span {
    display: block;
}

.user-data .username {
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    color: var(--dark);
}

.user-data .job-title {
    display: none;
}


.side-bar ul {
    margin-top: 50px;
}

.side-bar ul li a {
    color: #ffffff;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 400;
    display: flex;
    align-items: center;
    position: relative;
    line-height: 28px;
}

.side-bar .navbar-nav .nav-link.active, .side-bar .navbar-nav .show > .nav-link {
    color: #fff;
}

.side-bar .dropdown-menu.show {
    position: relative !important;
    transform: none !important;
    background: none;
    /*padding: 0 33px 0 0;*/
    border: none;
}

.side-bar .dropdown-item:focus, .side-bar .dropdown-item:hover {
    background: none !important;
}

.side-bar .dropdown-item:focus a, .side-bar .dropdown-item:hover a {
    color: #fff;
    opacity: 1;
}

.side-bar .dropdown-item:focus, .side-bar .dropdown-item:hover,
.side-bar .nav-link:focus, .nav-link:hover {
    color: #fff !important;
    opacity: 1;
}

.closeMenu .side-bar .dropdown-menu.show {
    position: absolute !important;
    inset: 0px 0px auto auto !important;
    margin: 0px !important;
    transform: translate(-1px, 26px) !important;
    float: none;
    right: 57px !important;
    width: 200px;
    background: var(--primary) !important;
    padding: 5px 0;
    border-radius: 0 !important;
}

.closeMenu .side-bar .dropdown-menu:after {
    display: none;
}

.closeMenu .side-bar .dropdown-menu:before {
    display: none;
}

.side-bar .dropdown-toggle::after {
    left: 10px;
    position: absolute;
}

.side-bar ul li svg {
    opacity: 0.5;
    margin-left: 10px;
}

.side-bar ul li {
    opacity: 0.6;
}

.side-bar ul li:hover, .side-bar ul li.active {
    opacity: 1;
    color: #fff;
}

.side-bar ul li:hover a, .side-bar ul li.active a {
    background-color: rgba(225, 255, 255, 0.2);
}


.side-bar ul li a:hover svg, .side-bar ul li.active a svg {
    opacity: 1;
}

.closeMenu .side-bar li:hover span {
    position: absolute;
    background: var(--primary);
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    right: 95%;
    top: 0;
    width: 140px;
    padding-right: 15px;
    display: flex !important;
}


.ic-color1, .ic-color2 {
    transition: all 0.3s ease;
}

.modal-icon h5 {
    color: var(--primary);
}

.side-bar ul li:hover svg .ic-color1, .side-bar ul li.active svg .ic-color1, .shopping-item:hover svg .ic-color1,
.modal-icon svg .ic-color1, .grid-links .ic-color2 {
    fill: var(--warning);
    opacity: 1;
}


.side-bar ul li:hover svg .ic-color2, .side-bar ul li.active svg .ic-color2, .shopping-item:hover svg .ic-color2,
.modal-icon svg .ic-color2, .grid-links .ic-color1 {
    fill: var(--primary);
    opacity: 1;
}

.notifications {
    position: relative;
}

.notifications span.active {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
    position: absolute;
    top: 0;
    right: 0;
}

.logo {
    padding-left: 10px;
    padding-right: 10px;
    height: 90px;
    /*border-left: 1px solid #EFEFEF;*/
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: 0;
}

.logo img {
    max-height: 60px;
}

.topline {
    width: 100%;
    height: 5px;

    background: var(--background-h1);
    background: var(--background-h2);
    background: var(--background-h3);
    background: var(--background-h4);
    filter: var(--filter-h5);

}


.admin-menu-toggle {
    position: absolute;
    top: 50px;
    left: -13px;
    z-index: 111;
    border: none;
    width: 26px;
    height: 26px;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--background-v1);
    background: var(--background-v2);
    background: var(--background-v3);
    background: var(--background-v4);
    filter: var(--filter-v5);

}

.ic-email {
    width: 22px;
    height: 20px;
    display: inline-block;
    margin-left: 10px;
    background: url(../images/email.svg) center no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
}

.ic-password {
    width: 22px;
    height: 22px;
    display: inline-block;
    margin-left: 10px;
    background: url(../images/pass.svg) center no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
}


.side-bar ul li i {
    width: 24px;
    height: 24px;
    display: inline-block;
    margin-left: 10px;
    -webkit-background-size: contain;
    background-size: contain;
}

.side-bar ul {
    position: relative;
}

.side-bar > ul:after {
    position: absolute;
    top: -50px;
    left: 0;
    width: 100%;
    height: 40px;
    background: url(../images/btrn.svg) center top no-repeat;
    background-size: 100% 75px;
    content: '';
}


.side-bar ul li.active {
    opacity: 1;
}

.ic-menu-1 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath d='M23.7203 30.3336H8.28033C4.62699 30.3336 1.66699 27.3603 1.66699 23.707V13.827C1.66699 12.0136 2.78699 9.73362 4.22699 8.61362L11.4137 3.01362C13.5737 1.33362 17.027 1.25362 19.267 2.82696L27.507 8.60029C29.0937 9.70696 30.3337 12.0803 30.3337 14.0136V23.7203C30.3337 27.3603 27.3737 30.3336 23.7203 30.3336ZM12.6403 4.58696L5.45366 10.187C4.50699 10.9336 3.66699 12.627 3.66699 13.827V23.707C3.66699 26.2536 5.73366 28.3336 8.28033 28.3336H23.7203C26.267 28.3336 28.3337 26.267 28.3337 23.7203V14.0136C28.3337 12.7336 27.4137 10.9603 26.3603 10.2403L18.1203 4.46696C16.6003 3.40029 14.0937 3.45362 12.6403 4.58696Z' fill='white'/%3E%3Cpath d='M16 25C15.4533 25 15 24.5467 15 24V20C15 19.4533 15.4533 19 16 19C16.5467 19 17 19.4533 17 20V24C17 24.5467 16.5467 25 16 25Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-2 {
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.5059 10.8398C15.5059 10.2876 15.0581 9.83984 14.5059 9.83984H7.50586C6.95357 9.83984 6.50586 10.2876 6.50586 10.8398C6.50586 11.3921 6.95357 11.8398 7.50586 11.8398H14.5059C15.0581 11.8398 15.5059 11.3921 15.5059 10.8398Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M23.2003 8.13274C23.5908 8.52326 23.5908 9.15643 23.2003 9.54695L20.2003 12.547C19.8097 12.9375 19.1766 12.9375 18.7861 12.547L17.7861 11.547C17.3955 11.1564 17.3955 10.5233 17.7861 10.1327C18.1766 9.74221 18.8097 9.74221 19.2003 10.1327L19.4932 10.4256L21.7861 8.13274C22.1766 7.74221 22.8097 7.74221 23.2003 8.13274Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.5059 20.1738C15.5059 19.6215 15.0581 19.1738 14.5059 19.1738H7.50586C6.95357 19.1738 6.50586 19.6215 6.50586 20.1738C6.50586 20.7261 6.95357 21.1738 7.50586 21.1738H14.5059C15.0581 21.1738 15.5059 20.7261 15.5059 20.1738Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M23.2003 17.4667C23.5908 17.8572 23.5908 18.4904 23.2003 18.8809L20.2003 21.8809C19.8097 22.2715 19.1766 22.2715 18.7861 21.8809L17.7861 20.8809C17.3955 20.4904 17.3955 19.8572 17.7861 19.4667C18.1766 19.0762 18.8097 19.0762 19.2003 19.4667L19.4932 19.7596L21.7861 17.4667C22.1766 17.0762 22.8097 17.0762 23.2003 17.4667Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M26.8734 3.12655C25.0942 1.34726 22.4316 0.666992 18.9997 0.666992H10.9997C7.56771 0.666992 4.90519 1.34726 3.1259 3.12655C1.34661 4.90584 0.666343 7.56836 0.666343 11.0003V19.0003C0.666343 22.4323 1.34661 25.0948 3.1259 26.8741C4.90519 28.6534 7.56771 29.3337 10.9997 29.3337H18.9997C22.4316 29.3337 25.0942 28.6534 26.8734 26.8741C28.6527 25.0948 29.333 22.4323 29.333 19.0003V11.0003C29.333 7.56836 28.6527 4.90584 26.8734 3.12655ZM25.4592 4.54077C26.6799 5.76147 27.333 7.76562 27.333 11.0003V19.0003C27.333 22.235 26.6799 24.2392 25.4592 25.4599C24.2385 26.6806 22.2344 27.3337 18.9997 27.3337H10.9997C7.76497 27.3337 5.76082 26.6806 4.54012 25.4599C3.31941 24.2392 2.66634 22.235 2.66634 19.0003V11.0003C2.66634 7.76562 3.31941 5.76147 4.54012 4.54077C5.76082 3.32006 7.76497 2.66699 10.9997 2.66699H18.9997C22.2344 2.66699 24.2385 3.32006 25.4592 4.54077Z' fill='white'/%3E%3C/svg%3E");
}

.ic-menu-3 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21.587 2.66699H10.4137C5.56033 2.66699 2.66699 5.56033 2.66699 10.4137V21.5737C2.66699 26.4403 5.56033 29.3337 10.4137 29.3337H21.5737C26.427 29.3337 29.3203 26.4403 29.3203 21.587V10.4137C29.3337 5.56033 26.4403 2.66699 21.587 2.66699ZM10.227 7.33366C10.227 6.78699 10.6803 6.33366 11.227 6.33366C11.7737 6.33366 12.227 6.78699 12.227 7.33366V12.5337C12.227 13.0803 11.7737 13.5337 11.227 13.5337C10.6803 13.5337 10.227 13.0803 10.227 12.5337V7.33366ZM12.5821 21.9576C12.3757 22.0409 12.227 22.2335 12.227 22.4561V24.667C12.227 25.2137 11.7737 25.667 11.227 25.667C10.6803 25.667 10.227 25.2137 10.227 24.667V22.4561C10.227 22.2335 10.0783 22.041 9.87192 21.9575C8.53768 21.4177 7.60033 20.1219 7.60033 18.6003C7.60033 16.6003 9.22699 14.9603 11.227 14.9603C13.227 14.9603 14.867 16.587 14.867 18.6003C14.867 20.122 13.9182 21.4178 12.5821 21.9576ZM21.7737 24.667C21.7737 25.2137 21.3203 25.667 20.7737 25.667C20.227 25.667 19.7737 25.2137 19.7737 24.667V19.467C19.7737 18.9203 20.227 18.467 20.7737 18.467C21.3203 18.467 21.7737 18.9203 21.7737 19.467V24.667ZM20.7737 17.027C18.7737 17.027 17.1337 15.4003 17.1337 13.387C17.1337 11.8653 18.0824 10.5695 19.4186 10.0298C19.625 9.94638 19.7737 9.7538 19.7737 9.5312V7.33366C19.7737 6.78699 20.227 6.33366 20.7737 6.33366C21.3203 6.33366 21.7737 6.78699 21.7737 7.33366V9.54454C21.7737 9.76713 21.9224 9.95969 22.1287 10.0432C23.463 10.583 24.4003 11.8787 24.4003 13.4003C24.4003 15.4003 22.7737 17.027 20.7737 17.027Z' fill='white'/%3E%3C/svg%3E");
}

.ic-menu-4 {
    width: 32px;
    height: 32px;
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.0007 3.66699C12.871 3.66699 10.334 6.20404 10.334 9.33366C10.334 12.4633 12.871 15.0003 16.0007 15.0003C19.1303 15.0003 21.6673 12.4633 21.6673 9.33366C21.6673 6.20404 19.1303 3.66699 16.0007 3.66699ZM8.33398 9.33366C8.33398 5.09948 11.7665 1.66699 16.0007 1.66699C20.2348 1.66699 23.6673 5.09948 23.6673 9.33366C23.6673 13.5678 20.2348 17.0003 16.0007 17.0003C11.7665 17.0003 8.33398 13.5678 8.33398 9.33366Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M26.8449 19.2355C27.7292 19.1446 28.5429 19.5418 29.2675 20.2665C29.9963 20.9952 30.3983 21.8107 30.3106 22.6971C30.2281 23.5306 29.7311 24.1772 29.2675 24.6407L24.5577 29.3505C24.3623 29.5554 24.1218 29.7043 23.9243 29.803C23.7165 29.9069 23.4639 30.0012 23.2097 30.0413L23.1932 30.0439L21.3952 30.2968C21.3949 30.2969 21.3956 30.2968 21.3952 30.2968C20.8065 30.3806 20.1986 30.2259 19.76 29.7873C19.3214 29.3488 19.1665 28.7419 19.2503 28.1532C19.2504 28.1529 19.2503 28.1536 19.2503 28.1532L19.5059 26.3376C19.5467 26.0793 19.643 25.8283 19.7465 25.6239C19.8499 25.4194 19.9969 25.1896 20.1867 24.9999L24.9067 20.2798C25.3702 19.8163 26.0154 19.3207 26.8449 19.2355ZM27.0493 21.225C26.9055 21.2398 26.6707 21.3442 26.3209 21.694L21.6027 26.4123C21.602 26.4131 21.5945 26.4216 21.5821 26.4397C21.5663 26.4626 21.5484 26.4925 21.5311 26.5267C21.5138 26.5609 21.5003 26.5931 21.4911 26.6195C21.4853 26.6361 21.4826 26.6464 21.4816 26.6504L21.2497 28.2976L22.8978 28.0657C22.9021 28.0646 22.9142 28.0616 22.934 28.0548C22.9625 28.045 22.996 28.0311 23.0299 28.0141C23.0642 27.997 23.0914 27.9805 23.1096 27.9679C23.1138 27.9649 23.117 27.9626 23.1192 27.9609C23.1239 27.9561 23.1286 27.9512 23.1334 27.9465L27.8533 23.2265C28.2032 22.8767 28.3061 22.6433 28.3203 22.5001C28.3292 22.4098 28.3245 22.1519 27.8533 21.6807C27.3913 21.2187 27.1384 21.2159 27.0493 21.225Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M24.6662 20.7037C25.1983 20.5559 25.7495 20.8675 25.8974 21.3996C26.2035 22.5017 27.0594 23.3576 28.1615 23.6637C28.6936 23.8115 29.0051 24.3627 28.8573 24.8949C28.7095 25.427 28.1583 25.7385 27.6262 25.5907C25.8482 25.0969 24.4642 23.7128 23.9703 21.9349C23.8225 21.4028 24.1341 20.8515 24.6662 20.7037Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.0002 21C10.0307 21 5.54688 24.9078 5.54688 29.3333C5.54688 29.8856 5.09916 30.3333 4.54688 30.3333C3.99459 30.3333 3.54688 29.8856 3.54688 29.3333C3.54688 23.4389 9.32975 19 16.0002 19C17.483 19 18.9135 19.2138 20.2485 19.6158C20.7773 19.775 21.077 20.3328 20.9177 20.8616C20.7585 21.3905 20.2007 21.6901 19.6719 21.5309C18.5269 21.1861 17.2908 21 16.0002 21Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-5 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 3.66699C11.5458 3.66699 8 7.13471 8 11.3337C8 15.5326 11.5458 19.0003 16 19.0003C20.4542 19.0003 24 15.5326 24 11.3337C24 7.13471 20.4542 3.66699 16 3.66699ZM6 11.3337C6 5.95967 10.5131 1.66699 16 1.66699C21.4869 1.66699 26 5.95967 26 11.3337C26 16.7076 21.4869 21.0003 16 21.0003C10.5131 21.0003 6 16.7076 6 11.3337Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M22.0137 16.7871C22.566 16.7871 23.0137 17.2348 23.0137 17.7871V27.8671C23.0137 28.6924 22.7138 29.4976 22.0226 29.9696C21.3186 30.4504 20.458 30.416 19.7101 30.0663L19.7067 30.0647L16.1201 28.3714L16.114 28.3684C16.1111 28.3677 16.1066 28.3666 16.1005 28.3654C16.0776 28.3608 16.045 28.3571 16.007 28.3571C15.969 28.3571 15.9364 28.3608 15.9135 28.3654C15.9074 28.3666 15.903 28.3677 15.9001 28.3684L15.8952 28.3708L12.3223 30.0639C11.5693 30.4211 10.7028 30.4606 9.99509 29.9714C9.30545 29.4947 9.01367 28.6854 9.01367 27.8671L9.02698 18.0257C9.02773 17.4735 9.47605 17.0264 10.0283 17.0271C10.5806 17.0278 11.0277 17.4762 11.027 18.0285L11.0137 27.8671C11.0137 27.8673 11.0137 27.8669 11.0137 27.8671C11.0137 28.0524 11.0464 28.1736 11.0766 28.2423C11.1053 28.3077 11.1306 28.325 11.1322 28.3261C11.1341 28.3274 11.1365 28.3288 11.1412 28.3303C11.1461 28.3319 11.1584 28.335 11.1806 28.3354C11.2254 28.3363 11.32 28.3258 11.4651 28.2569L15.0313 26.567C15.3538 26.4087 15.7106 26.3571 16.007 26.3571C16.3032 26.3571 16.6596 26.4086 16.982 26.5666L20.5572 28.2546C20.5577 28.2548 20.5581 28.255 20.5586 28.2552C20.6985 28.3204 20.7918 28.3309 20.8383 28.3299C20.8806 28.3289 20.8931 28.3191 20.8947 28.318C20.8976 28.316 20.9228 28.2987 20.9513 28.2351C20.9809 28.1687 21.0137 28.0506 21.0137 27.8671V17.7871C21.0137 17.2348 21.4614 16.7871 22.0137 16.7871ZM15.9142 28.3615C15.9124 28.3624 15.9108 28.3633 15.9092 28.364L15.9142 28.3615ZM16.0998 28.3615L16.1051 28.3641C16.1035 28.3634 16.1017 28.3625 16.0998 28.3615Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-6 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M23.8765 3.66699C22.5221 3.66699 21.4365 4.75261 21.4365 6.10699C21.4365 7.41089 22.4394 8.46175 23.7088 8.54409C23.8153 8.53463 23.9244 8.53463 24.0309 8.54409C25.2982 8.46183 26.3054 7.41232 26.3165 6.10343C26.3146 4.76148 25.2272 3.66699 23.8765 3.66699ZM19.4365 6.10699C19.4365 3.64805 21.4176 1.66699 23.8765 1.66699C26.338 1.66699 28.3165 3.6639 28.3165 6.10699V6.11414H28.3165C28.2994 8.5127 26.4113 10.4602 24.0327 10.5463C23.9783 10.5483 23.9238 10.5458 23.8699 10.5389C23.8159 10.5458 23.7614 10.5483 23.707 10.5463C21.3297 10.4602 19.4365 8.51237 19.4365 6.10699Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M22.4096 11.802C24.4367 11.4469 26.7481 11.7854 28.4284 12.9004L28.4302 12.9016C29.5788 13.6673 30.2855 14.7768 30.2855 16.0137C30.2855 17.2505 29.5788 18.36 28.4302 19.1257C26.7624 20.242 24.4786 20.5793 22.4566 20.2399C21.912 20.1484 21.5446 19.6328 21.636 19.0881C21.7274 18.5434 22.2431 18.176 22.7878 18.2675C24.4184 18.5412 26.1604 18.2389 27.319 17.4628L27.3208 17.4616C28.0523 16.9739 28.2855 16.4301 28.2855 16.0137C28.2855 15.5974 28.0525 15.0538 27.3218 14.5663C26.1488 13.7884 24.3806 13.4872 22.7548 13.772C22.2108 13.8673 21.6925 13.5035 21.5972 12.9595C21.5019 12.4155 21.8656 11.8973 22.4096 11.802Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.63574 6.10699C3.63574 3.6639 5.61427 1.66699 8.07574 1.66699C10.5347 1.66699 12.5157 3.64805 12.5157 6.10699C12.5157 8.51237 10.6226 10.4602 8.24528 10.5463C8.19086 10.5483 8.13639 10.5458 8.08241 10.5389C8.02843 10.5458 7.97396 10.5483 7.91954 10.5463C5.54096 10.4602 3.6529 8.51271 3.63577 6.11414L3.63574 6.10699ZM5.63574 6.10343C5.64691 7.41233 6.65412 8.46183 7.92141 8.54409C8.02789 8.53463 8.13694 8.53463 8.24343 8.54409C9.5129 8.46175 10.5157 7.41089 10.5157 6.10699C10.5157 4.75261 9.43012 3.66699 8.07574 3.66699C6.72508 3.66699 5.63767 4.76148 5.63574 6.10343Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.62981 14.5663C5.80282 13.7884 7.57096 13.4872 9.19679 13.772C9.74079 13.8673 10.259 13.5035 10.3543 12.9595C10.4496 12.4155 10.0859 11.8973 9.5419 11.802C7.51481 11.4469 5.20344 11.7854 3.52311 12.9004L3.52311 12.9004L3.52132 12.9016C2.3728 13.6673 1.66602 14.7768 1.66602 16.0137C1.66602 17.2502 2.37243 18.3594 3.52041 19.1251C5.18836 20.2419 7.47256 20.5794 9.49491 20.2399C10.0396 20.1484 10.407 19.6327 10.3155 19.0881C10.2241 18.5434 9.70844 18.176 9.16378 18.2675C7.53316 18.5412 5.79116 18.2389 4.63252 17.4628L4.63072 17.4616C3.89923 16.9739 3.66602 16.4301 3.66602 16.0137C3.66602 15.5974 3.89904 15.0538 4.62981 14.5663Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15.8795 13.627C14.5251 13.627 13.4395 14.7126 13.4395 16.067C13.4395 17.3709 14.4423 18.4217 15.7118 18.504C15.8198 18.4945 15.9304 18.4946 16.0383 18.5045C17.2953 18.4324 18.3082 17.3793 18.3195 16.0634C18.3175 14.7214 17.2301 13.627 15.8795 13.627ZM11.4395 16.067C11.4395 13.608 13.4205 11.627 15.8795 11.627C18.3409 11.627 20.3195 13.6239 20.3195 16.067V16.0741H20.3194C20.3023 18.4662 18.4191 20.4372 16.0284 20.5065C15.9764 20.508 15.9244 20.5055 15.8728 20.4989C15.8188 20.5058 15.7643 20.5083 15.7099 20.5063C13.3326 20.4202 11.4395 18.4723 11.4395 16.067Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.004 21.6465C17.562 21.6465 19.1737 22.0345 20.4337 22.8744C21.5822 23.6401 22.289 24.7496 22.289 25.9865C22.289 27.2232 21.5824 28.3326 20.4341 29.0982C19.1689 29.9441 17.5577 30.3365 15.999 30.3365C14.4403 30.3365 12.8291 29.9441 11.5638 29.0982C10.4156 28.3326 9.70898 27.2232 9.70898 25.9865C9.70898 24.7496 10.4158 23.6401 11.5643 22.8744L11.5667 22.8728L11.5667 22.8728C12.832 22.0346 14.4457 21.6465 16.004 21.6465ZM12.6725 24.5393C11.9419 25.0268 11.709 25.5703 11.709 25.9865C11.709 26.4029 11.9422 26.9468 12.6737 27.4344L12.6749 27.4352C13.5428 28.0157 14.7446 28.3365 15.999 28.3365C17.2533 28.3365 18.4551 28.0157 19.3231 27.4352L19.3243 27.4344C20.0558 26.9468 20.289 26.4029 20.289 25.9865C20.289 25.57 20.0558 25.0262 19.3243 24.5385C18.4642 23.9652 17.2626 23.6465 16.004 23.6465C14.7462 23.6465 13.5404 23.9648 12.6725 24.5393Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-7 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath d='M10.666 29.7595C10.2927 29.7595 9.90599 29.6662 9.55933 29.4796C8.79933 29.0796 8.33268 28.2795 8.33268 27.4262V25.533C4.30602 25.1196 1.66602 22.1595 1.66602 17.9195V9.9196C1.66602 5.33293 4.74602 2.25293 9.33268 2.25293H22.666C27.2527 2.25293 30.3327 5.33293 30.3327 9.9196V17.9195C30.3327 22.5062 27.2527 25.5862 22.666 25.5862H17.6393L11.9593 29.373C11.5726 29.6263 11.1193 29.7595 10.666 29.7595ZM9.33268 4.23958C5.89268 4.23958 3.66602 6.46625 3.66602 9.90625V17.9063C3.66602 21.3463 5.89268 23.573 9.33268 23.573C9.87935 23.573 10.3327 24.0263 10.3327 24.573V27.413C10.3327 27.5863 10.4394 27.6663 10.506 27.7063C10.5727 27.7463 10.706 27.7863 10.8527 27.693L16.7861 23.7463C16.9461 23.6397 17.146 23.573 17.346 23.573H22.6794C26.1194 23.573 28.346 21.3463 28.346 17.9063V9.90625C28.346 6.46625 26.1194 4.23958 22.6794 4.23958H9.33268Z' fill='white'/%3E%3Cpath d='M15.9994 16.1465C15.4528 16.1465 14.9994 15.6932 14.9994 15.1465V14.8665C14.9994 13.3199 16.1327 12.5599 16.5594 12.2665C17.0527 11.9332 17.2127 11.7065 17.2127 11.3599C17.2127 10.6932 16.6661 10.1465 15.9994 10.1465C15.3328 10.1465 14.7861 10.6932 14.7861 11.3599C14.7861 11.9065 14.3328 12.3599 13.7861 12.3599C13.2395 12.3599 12.7861 11.9065 12.7861 11.3599C12.7861 9.58653 14.2261 8.14648 15.9994 8.14648C17.7728 8.14648 19.2127 9.58653 19.2127 11.3599C19.2127 12.8799 18.0928 13.6398 17.6794 13.9198C17.1594 14.2665 16.9994 14.4932 16.9994 14.8665V15.1465C16.9994 15.7065 16.5461 16.1465 15.9994 16.1465Z' fill='white'/%3E%3Cpath d='M16 19.4668C15.44 19.4668 15 19.0135 15 18.4668C15 17.9201 15.4533 17.4668 16 17.4668C16.5467 17.4668 17 17.9201 17 18.4668C17 19.0135 16.56 19.4668 16 19.4668Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-8 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 11C16.5523 11 17 11.4477 17 12V18.6667C17 19.219 16.5523 19.6667 16 19.6667C15.4477 19.6667 15 19.219 15 18.6667V12C15 11.4477 15.4477 11 16 11Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.0001 4.45703C14.9337 4.45703 13.6432 5.18889 12.5547 7.15198L4.47469 21.6853C3.4607 23.5141 3.50405 24.9566 4.04753 25.8825C4.59045 26.8074 5.82648 27.547 7.92013 27.547H16.0001C16.0559 27.547 16.1106 27.5516 16.1638 27.5604H24.0801C26.1661 27.5604 27.4033 26.8213 27.9482 25.895C28.4932 24.9684 28.5388 23.5261 27.5256 21.6986L19.446 7.15281C18.3575 5.18972 17.0666 4.45703 16.0001 4.45703ZM15.8364 29.547H7.92013C5.38711 29.547 3.34314 28.6333 2.32272 26.8949C1.30286 25.1575 1.49955 22.9267 2.72556 20.7155L10.8056 6.18208C10.8057 6.18179 10.8054 6.18238 10.8056 6.18208C12.0903 3.8657 13.9335 2.45703 16.0001 2.45703C18.0668 2.45703 19.9095 3.86484 21.1942 6.18125L25.1142 13.2346L29.2744 20.7283C30.5012 22.9409 30.6937 25.1723 29.6721 26.909C28.6503 28.6461 26.6075 29.5604 24.0801 29.5604H16.0001C15.9444 29.5604 15.8897 29.5558 15.8364 29.547Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.6602 22.6673C14.6602 21.9309 15.2571 21.334 15.9935 21.334H16.0055C16.7418 21.334 17.3388 21.9309 17.3388 22.6673C17.3388 23.4037 16.7418 24.0007 16.0055 24.0007H15.9935C15.2571 24.0007 14.6602 23.4037 14.6602 22.6673Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-9 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.66602 29.334C1.66602 28.7817 2.11373 28.334 2.66602 28.334H29.3327C29.885 28.334 30.3327 28.7817 30.3327 29.334C30.3327 29.8863 29.885 30.334 29.3327 30.334H2.66602C2.11373 30.334 1.66602 29.8863 1.66602 29.334Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.7339 2.83733C13.3357 2.06176 14.2565 1.66699 15.399 1.66699H16.599C17.7416 1.66699 18.6624 2.06176 19.2641 2.83733C19.8302 3.56697 19.999 4.48897 19.999 5.33366V29.3337C19.999 29.8859 19.5513 30.3337 18.999 30.3337H12.999C12.4467 30.3337 11.999 29.8859 11.999 29.3337V5.33366C11.999 4.48897 12.1678 3.56697 12.7339 2.83733ZM14.3141 4.06332C14.1302 4.30035 13.999 4.71168 13.999 5.33366V28.3337H17.999V5.33366C17.999 4.71168 17.8678 4.30035 17.6839 4.06332C17.5357 3.87222 17.2565 3.66699 16.599 3.66699H15.399C14.7416 3.66699 14.4624 3.87222 14.3141 4.06332Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.64248 10.8826C4.18411 10.0972 5.04363 9.66699 6.13236 9.66699H7.19902C8.28775 9.66699 9.14727 10.0972 9.6889 10.8826C10.1871 11.6049 10.3324 12.5075 10.3324 13.3337V29.3337C10.3324 29.8859 9.88464 30.3337 9.33236 30.3337H3.99902C3.44674 30.3337 2.99902 29.8859 2.99902 29.3337V13.3337C2.99902 12.5075 3.14432 11.6049 3.64248 10.8826ZM5.2889 12.0181C5.1204 12.2624 4.99902 12.6931 4.99902 13.3337V28.3337H8.33236V13.3337C8.33236 12.6931 8.21098 12.2624 8.04248 12.0181C7.91744 11.8368 7.71029 11.667 7.19902 11.667H6.13236C5.62109 11.667 5.41394 11.8368 5.2889 12.0181Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M22.3095 17.5496C22.8511 16.7642 23.7106 16.334 24.7993 16.334H25.866C26.9547 16.334 27.8143 16.7642 28.3559 17.5496C28.8541 18.2719 28.9993 19.1745 28.9993 20.0007V29.334C28.9993 29.8863 28.5516 30.334 27.9993 30.334H22.666C22.1137 30.334 21.666 29.8863 21.666 29.334V20.0007C21.666 19.1745 21.8113 18.2719 22.3095 17.5496ZM23.9559 18.6851C23.7874 18.9294 23.666 19.3601 23.666 20.0007V28.334H26.9993V20.0007C26.9993 19.3601 26.878 18.9294 26.7095 18.6851C26.5844 18.5038 26.3773 18.334 25.866 18.334H24.7993C24.2881 18.334 24.0809 18.5038 23.9559 18.6851Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}

.ic-menu-10 {
    background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='1'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 13C14.3431 13 13 14.3431 13 16C13 17.6569 14.3431 19 16 19C17.6569 19 19 17.6569 19 16C19 14.3431 17.6569 13 16 13ZM11 16C11 13.2386 13.2386 11 16 11C18.7614 11 21 13.2386 21 16C21 18.7614 18.7614 21 16 21C13.2386 21 11 18.7614 11 16Z' fill='white'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.805 5.02707C12.4481 4.43247 11.6965 4.24751 11.1383 4.57958L11.1237 4.58824L8.817 5.90811C8.08717 6.32516 7.83539 7.27069 8.25286 7.99323L7.38699 8.49351L8.25217 7.99204C8.96559 9.22288 9.15738 10.5719 8.52009 11.6778C7.88289 12.7835 6.62005 13.2935 5.20033 13.2935C4.35603 13.2935 3.66699 13.989 3.66699 14.8268V17.1735C3.66699 18.0113 4.35603 18.7068 5.20033 18.7068C6.62004 18.7068 7.88289 19.2168 8.52009 20.3225C9.15729 21.4283 8.96564 22.7771 8.25245 24.0078C7.83555 24.7303 8.08687 25.675 8.81646 26.0919L11.1384 27.4206C11.6965 27.7527 12.448 27.5679 12.8049 26.9733L12.9482 26.7258C13.6614 25.4954 14.7364 24.6568 16.012 24.6568C17.2886 24.6568 18.3603 25.496 19.0669 26.7278C19.0672 26.7284 19.0676 26.729 19.0679 26.7295L19.209 26.9733C19.5659 27.5679 20.3175 27.7528 20.8757 27.4208L20.8902 27.4121L23.197 26.0922C23.9249 25.6763 24.1805 24.7439 23.76 24.0052C23.0481 22.7752 22.8571 21.4275 23.4939 20.3225C24.1311 19.2168 25.3939 18.7068 26.8137 18.7068C27.658 18.7068 28.347 18.0113 28.347 17.1735V14.8268C28.347 13.9825 27.6515 13.2935 26.8137 13.2935C25.3939 13.2935 24.1311 12.7835 23.4939 11.6778C22.8567 10.5721 23.0483 9.22341 23.7614 7.99276C24.1785 7.27027 23.9272 6.32537 23.1975 5.90842L20.8756 4.57971C20.3175 4.24763 19.5659 4.43248 19.209 5.02708L19.0658 5.27455C18.3526 6.50496 17.2776 7.34351 16.002 7.34351C14.7255 7.34351 13.6539 6.5045 12.9473 5.27289C12.9469 5.27221 12.9465 5.27152 12.9461 5.27084L12.805 5.02707ZM10.1236 2.85606C11.6695 1.94225 13.6304 2.50288 14.5264 4.00889L14.5325 4.01911L14.6791 4.27248L14.6812 4.27618C15.1746 5.13679 15.6892 5.34351 16.002 5.34351C16.3163 5.34351 16.8348 5.13503 17.3349 4.27247C17.335 4.27233 17.3348 4.27262 17.3349 4.27247L17.4875 4.00885C18.3835 2.50284 20.3445 1.94224 21.8904 2.85608L24.1898 4.17193C25.8866 5.14156 26.4621 7.31633 25.4929 8.99379L25.4922 8.99498C24.9923 9.85747 25.0707 10.4084 25.2268 10.6792C25.3829 10.9502 25.82 11.2935 26.8137 11.2935C28.7492 11.2935 30.347 12.8711 30.347 14.8268V17.1735C30.347 19.109 28.7694 20.7068 26.8137 20.7068C25.82 20.7068 25.3829 21.0502 25.2268 21.3211C25.0707 21.5919 24.9923 22.1429 25.4922 23.0054L25.4953 23.0107C26.4595 24.6982 25.8879 26.8577 24.1903 27.8281C24.1902 27.8282 24.1905 27.828 24.1903 27.8281L21.8903 29.1443C20.3444 30.0581 18.3835 29.4974 17.4876 27.9915L17.4815 27.9813L17.3349 27.7279L17.3328 27.7242C16.8394 26.8636 16.3248 26.6568 16.012 26.6568C15.6977 26.6568 15.1792 26.8653 14.6791 27.7279C14.679 27.728 14.6792 27.7277 14.6791 27.7279L14.5265 27.9915C13.6305 29.4975 11.6696 30.0581 10.1238 29.1444L7.82419 27.8284C7.82401 27.8283 7.82437 27.8285 7.82419 27.8284C6.12777 26.8586 5.55203 24.6838 6.52113 23.0066L6.52182 23.0054C7.02173 22.1429 6.94327 21.5919 6.78723 21.3211C6.63109 21.0502 6.19394 20.7068 5.20033 20.7068C3.24462 20.7068 1.66699 19.109 1.66699 17.1735V14.8268C1.66699 12.8913 3.24462 11.2935 5.20033 11.2935C6.19394 11.2935 6.63109 10.9502 6.78723 10.6792C6.94327 10.4084 7.02173 9.85747 6.52182 8.99498L6.52113 8.99379C5.55203 7.31651 6.12723 5.14202 7.82365 4.17224L10.1236 2.85606Z' fill='white'/%3E%3C/g%3E%3C/svg%3E");
}


.page-content {
    padding: 15px;

}

.ic-notify {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.4' d='M12 6.44043V9.77043' stroke='%231A1A1A' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath d='M12.0199 2C8.3399 2 5.3599 4.98 5.3599 8.66V10.76C5.3599 11.44 5.0799 12.46 4.7299 13.04L3.4599 15.16C2.6799 16.47 3.2199 17.93 4.6599 18.41C9.4399 20 14.6099 20 19.3899 18.41C20.7399 17.96 21.3199 16.38 20.5899 15.16L19.3199 13.04C18.9699 12.46 18.6899 11.43 18.6899 10.76V8.66C18.6799 5 15.6799 2 12.0199 2Z' stroke='%231A1A1A' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath opacity='0.4' d='M15.3299 18.8203C15.3299 20.6503 13.8299 22.1503 11.9999 22.1503C11.0899 22.1503 10.2499 21.7703 9.64992 21.1703C9.04992 20.5703 8.66992 19.7303 8.66992 18.8203' stroke='%231A1A1A' stroke-width='1.5' stroke-miterlimit='10'/%3E%3C/svg%3E");
}


.ic-notify.active {
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg' data-v-14b8af64=''%3E%3Cpath d='M25.4995 20.4125C25.1495 21.35 24.412 22.0625 23.4495 22.3875C22.0995 22.8375 20.712 23.175 19.312 23.4125C19.1745 23.4375 19.037 23.4625 18.8995 23.475C18.6745 23.5125 18.4495 23.5375 18.2245 23.5625C17.9495 23.6 17.662 23.625 17.3745 23.65C16.587 23.7125 15.812 23.75 15.0245 23.75C14.2245 23.75 13.4245 23.7125 12.637 23.6375C12.2995 23.6125 11.9745 23.575 11.6495 23.525C11.462 23.5 11.2745 23.475 11.0995 23.45C10.962 23.425 10.8245 23.4125 10.687 23.3875C9.29952 23.1625 7.92452 22.825 6.58702 22.375C5.58702 22.0375 4.82452 21.325 4.48702 20.4125C4.14952 19.5125 4.27452 18.4625 4.81202 17.5625L6.22452 15.2125C6.52452 14.7 6.79952 13.7125 6.79952 13.1125V10.7875C6.79952 6.25 10.487 2.5625 15.0245 2.5625C19.5495 2.5625 23.237 6.25 23.237 10.7875V13.1125C23.237 13.7125 23.512 14.7 23.8245 15.2125L25.237 17.5625C25.7495 18.4375 25.8495 19.4625 25.4995 20.4125Z' fill='%23D3D3D3' data-v-14b8af64=''%3E%3C/path%3E%3Cpath d='M14.9998 13.4508C14.4748 13.4508 14.0498 13.0258 14.0498 12.5008V8.62578C14.0498 8.10078 14.4748 7.67578 14.9998 7.67578C15.5248 7.67578 15.9498 8.10078 15.9498 8.62578V12.5008C15.9373 13.0258 15.5123 13.4508 14.9998 13.4508Z' fill='%23212121' data-v-14b8af64=''%3E%3C/path%3E%3Cpath d='M18.5371 25.0125C18.0121 26.4625 16.6246 27.5 14.9996 27.5C14.0121 27.5 13.0371 27.1 12.3496 26.3875C11.9496 26.0125 11.6496 25.5125 11.4746 25C11.6371 25.025 11.7996 25.0375 11.9746 25.0625C12.2621 25.1 12.5621 25.1375 12.8621 25.1625C13.5746 25.225 14.2996 25.2625 15.0246 25.2625C15.7371 25.2625 16.4496 25.225 17.1496 25.1625C17.4121 25.1375 17.6746 25.125 17.9246 25.0875C18.1246 25.0625 18.3246 25.0375 18.5371 25.0125Z' fill='%23212121' data-v-14b8af64=''%3E%3C/path%3E%3C/svg%3E");
}

.user-notifications {
    display: flex;
    align-items: center;
}

.notification-btn {
    width: 50px;
    height: 50px;
    background: #F2F4F7;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.dropdown .notification-btn:after {
    position: absolute;
    margin: 0;
    top: 0;
    width: 15px;
    height: 15px;
    background: transparent;
    content: '';
    border: none;
    border-radius: 50%;
    left: auto;
    right: 0;
}

.dropdown .notification-btn.active-notify:after {

    background: var(--danger);
}


.breadcrumb-item + .breadcrumb-item::before {
    font-family: 'Font Awesome 6 Pro';
    font-weight: 900;
    content: "\f104";
}

.box {
    background: rgba(255, 255, 255, 0.9);
    padding: 15px;
    border-radius: 12px;
    border: 1px solid #F2F4F7;
    min-height: calc(100vh - 150px);
    /*box-shadow: 0px 0px 3px rgba(197 ,186, 186 ,0.53)*/
}

.box-home {
    background: rgba(255, 255, 255, 0.9);
    padding: 15px;
    border-radius: 12px;
    border: 1px solid #F2F4F7;
    height: 100%;
}

.box-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.box-title h1 {
    font-size: 18px;
}

.box-title p {
    font-size: 12px;
    color: var(--gray-text)
}


input[type=checkbox] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    background: url(../images/ckbox.svg) center no-repeat;
}

input[type=checkbox]:checked {
    background: url(../images/ckbox2.svg) center no-repeat;
}

input[type=radio] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    background: url(../images/radio.svg) center no-repeat;
}

input[type=radio]:checked {
    background: url(../images/radio2.svg) center no-repeat;
}

.app-filters h3 {
    font-size: 16px;
}


.ch-div {
    display: flex;
    align-items: center;
    line-height: 24px;
}

.titles-div {
    display: flex;
    align-items: center;
    min-width: 200px;
}

.titles-div .img > div {
    width: 45px;
    height: 45px;
    border: 1px solid var(--gray-border);
    border-radius: 5px;
    overflow: hidden;
    margin-left: 10px;
}

.titles-div .img > div img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.titles-div h3 {
    font-size: 13px;
    font-weight: 400;
}

.titles-div p {
    font-size: 12px;
    font-weight: 300;
    color: var(--gray-text);
}

.titles-div {
    text-align: right;
}

.ch-div input {
    margin-left: 10px;
}

.box-body {

}


.table {
}

.table-responsive {
    border: 1px solid #E4E7EC;
    border-radius: 15px;

}

.table tr, .table tr td, .table tr th {
    vertical-align: middle;
}

.table thead tr {
    background: #F9FAFB;
    border-bottom: 1px solid #E4E7EC;
}

.table tbody tr {
    border-bottom: 1px dashed #E4E7EC;
}

.table tbody tr:last-child {
    border-bottom: none;
}

.table thead tr th {
    font-size: 12px;
    color: #fff;
    font-weight: 400;
    padding: 15px 8px;
}

.table thead tr th i {
    font-size: 18px;
}

.table tr td {
    font-size: 14px;
    color: #1A1A1A;
}

.table > :not(caption) > * > * {
    box-shadow: none !important;
    border-bottom-width: 0;
}

.table tr th, .table tr td {
    padding: 8px;
    text-align: center;
}

.page-link {
    background-color: #F2F4F7;
    color: #101828;
    border-radius: 10px !important;
    border: 1px solid #F2F4F7;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
}

.pagination-text {
    font-weight: 400;
    font-size: 14px;
    line-height: 26px;
    color: #848588;
}

.page-link {
    border-color: transparent;
    color: #848588;
    padding: 0.375rem 1rem;
}

.page-item.active .page-link {
    background-color: var(--primary);
    border-color: var(--primary);
}

.form-group label {
    font-size: 14px;
    font-weight: 400;
    color: #1A1A1A;
    margin-bottom: 5px;
}

.form-group label.error {
    color: var(--danger);
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 0;
}

.form-control {
    font-size: 14px;
    font-weight: 400;
    color: #1A1A1A;
    border-color: #E4E7EC;
    border-radius: 5px;
    box-shadow: none;
    outline: none;
    height: 40px;
}

textarea.form-control {
    height: 150px;
}

.form-control.valid {
    border-color: var(--success);
}

.form-control.error {
    border-color: var(--danger);
}

.form-switch .form-check-input:checked {
    background-color: var(--primary);
}

.form-switch .form-check-input {
    width: 40px;
    margin-left: 10px;
    margin-top: 0;
}

.form-switch label {
    margin-bottom: 0;
}

.form-control:focus {
    outline: 0;
    box-shadow: none;
}


.upload-file {
    width: 100%;
    height: 150px;
    position: relative;
    border: 1px dashed var(--gray-border);
    color: var(--gray-text);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    overflow: hidden;
}

.upload-file img {
    position: relative;
    z-index: 2;
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.upload-file .ic {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 11px;

}

.upload-file .ic i {
    font-size: 16px;
    margin-bottom: 5px;
}

.upload-file input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 22;
    opacity: 0;
}

.td-action {
    display: flex;
    align-items: center;
    justify-content: center;
}

.td-action .btn {

    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.td-action .btn:hover {
    background: #ebebeb;
}

.btn-outline-secondary {
    border-color: var(--gray-text);
    color: var(--gray-text)
}

.btn-outline-primary {
    border-color: var(--primary);
    color: var(--primary);
    border-radius: 5px;
}

.btn-primary {
    background-color: var(--primary);
    border-color: var(--primary);
    border-radius: 5px;
}

.btn-primary:hover, .btn-outline-primary:hover {
    color: #fff;
    background-color: var(--primary_hover);
    border-color: var(--primary_hover);
}

.text-primary {
    color: var(--primary) !important;
}

.btn-info {
    color: #fff !important;
}

.btn-group-sm > .btn, .btn-sm {
    font-size: 12px;
}

.left-action .btn {
    height: 40px;
}

.left-action {
    display: flex;
}

.btn-40 {
    width: 40px;
    height: 40px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}

.modal .btn-close {
    position: absolute;
    top: 10px;
    left: 10px;
}

.list-ic li {
    padding-right: 30px;
    background: url(../images/ckbox2.svg) center right no-repeat;
    line-height: 25px;
    margin-bottom: 10px;
    font-weight: 300;
    font-size: 13px;
}

.list-ic li h3 {
    font-size: 16px;
    font-weight: 500;
    text-decoration: underline;
    display: inline-block;
}


/*******.closeMenu*******/

.closeMenu .side-bar li span {
    display: none;
}

.closeMenu .header {
    padding: 15px 0 15px 15px;
}

.closeMenu .side-bar ul li a {
    padding: 10px;
}


.closeMenu .admin-app {
    padding-right: 0;
}

.page-content {
    min-height: calc(100vh - 158px);
}

.closeMenu .page-content {
    padding-right: 105px;
}

.closeMenu .header {
    padding-right: 105px;
}

.closeMenu .admin-menu-toggle {
    transform: rotate(180deg);
}

.closeMenu .side-bar {
    border: none;
    right: -181px;
}

.closeMenu .side-bar ul {
    margin-top: 40px;
    /*background: var(--primary);*/
    position: relative;
    width: 60px;
    float: left;
}

.closeMenu .side-bar ul li a {
    justify-content: center;
}

.closeMenu .side-bar ul li span {
    display: none;
}

.closeMenu .side-bar ul li i {
    margin-left: 0 !important;
}

.closeMenu .side-bar .logo {
    display: flex;
    position: relative;
    top: 0;
    width: 100%;
    justify-content: flex-end;
    padding-left: 5px;
}


.bred ol {
    margin-bottom: 0 !important;
}

/******.closeMenu*******/


.select2-container--default .select2-selection--single {
    height: 40px;
    border-radius: 5px;
    border-color: #E4E7EC;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px;
}

.error + .select2-container--default .select2-selection--single {
    border-color: var(--danger);
}

.swal2-title {
    font-size: 18px !important;
    font-weight: 500 !important;
}

.swal2-html-container {
    font-size: 14px !important;
}

.swal2-styled.swal2-cancel {
    font-weight: 500 !important;
    font-size: 14px !important;
    background: var(--danger) !important;
}

.swal2-styled.swal2-confirm {
    font-weight: 500 !important;
    font-size: 14px !important;
    background: var(--primary) !important;
}

.swal2-actions:not(.swal2-loading) .swal2-styled:hover {
    background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)) !important;;
}

.badge {
    font-weight: 400;
}

.login-box {
    padding: 20px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 16px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    position: relative;
    /*border: 1px solid var(--gray-border);*/
}

.login-box label {
    display: flex;
    align-items: center;
}

.login-box h1 {
    font-size: 18px;
    font-weight: 500;
    text-align: center;
}

.login-box h1 + p {
    font-size: 14px;
    color: var(--gray-text);
    margin-bottom: 40px;
    text-align: center;
}

.login-logo {

    display: flex;
    justify-content: center;
}

.login-page-body {
    min-height: 100vh;
    position: relative;
}

.login-page-body .container {
    min-height: 100vh;
}

.lang--btn {
    position: absolute;
    right: 15px;
    top: 15px;
}

html[lang=ar] .lang--btn {
    left: 15px;
    right: auto;
}

.input-withleft-ic {
    position: relative;
}

.show-password {
    position: absolute;
    left: 5px;
    top: 10px;
    padding: 0;
    margin: 0;
    background: none;
    border: none;
    width: 30px;
    height: 30px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ic-eye {
    background: url(../images/eye.svg) center no-repeat;
    width: 24px;
    height: 24px;
    -webkit-background-size: contain;
    background-size: contain;
    display: inline-block;
}

.show-password.active .ic-eye {
    background: url(../images/eye2.svg) center no-repeat;
}

[type=email], [type=number], [type=tel], [type=url] {
    text-align: right;
}


.table tbody.row tr {
    border: none;
}

.grid-item {
    border: 1px solid #E4E7EC;
    border-radius: 12px;
    padding: 15px;
    background: #fff;
    margin-top: 80px;
    position: relative;
    transition: all 0.4s ease-in-out;
}

.grid-item .img {
    margin-left: auto;
    margin-right: auto;
    margin-top: -55px;
    width: 80px;
    height: 80px;
}

.grid-item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.grid-item h3 {
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.grid-item p {
    font-size: 12px;
    font-weight: 300;
    height: 40px;
    line-height: 20px;
    overflow: hidden;
    margin-bottom: 10px;
}

.child-numbers {
    display: flex;
    width: 100%;
    color: #04A6F4;
    align-items: center;
    font-size: 12px;
    font-weight: 400;
    justify-content: space-between;
}


.item-menu {
    position: absolute;
    left: 5px;
    top: 5px;
}

.item-menu .dropdown-toggle:after {
    display: none;
}

.item-menu .dropdown-toggle {
    border: none !important;
}

.item-clients {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
}

.item-clients img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    z-index: 1;
    margin-right: -5px;
    border: 1px solid #fff;
}

.item-clients span {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: #fff;
    background: #00008E;
    z-index: 6;
    margin-right: -5px;
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #fff;
}

.item-clients img + img {
    z-index: 2;
}

.item-clients img + img + img {
    z-index: 3;
}

.item-clients img + img + img + img {
    z-index: 4;
}

.item-clients img + img + img + img + img {
    z-index: 5;
}

.item-action {
    position: absolute;
    bottom: -50px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.4s ease-in-out;
    z-index: 10;
    width: calc(100% - 30px);
    left: 15px;
}

.grid-item:hover {
    border-color: var(--primary);
}

.grid-item:hover .item-action {
    bottom: 15px;
    opacity: 1;
    visibility: visible;
}

.grid-item .badge {
    position: absolute;
    top: 15px;
    right: 15px;
}


.grid-item2 {
    border: 1px solid #E4E7EC;
    border-radius: 12px;
    padding: 0;
    background: #fff;
    position: relative;
    transition: all 0.4s ease-in-out;
}


.grid-item2 h3 {
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    margin-bottom: 10px;
    width: 100%;
    background: #f7f7f7;
    padding: 20px 10px;
    border-radius: 12px 12px 0 0;
}


.grid-item2 h4 {
    font-size: 13px;
    font-weight: 400;
    text-align: center;
}

.grid-item2:hover {
    border-color: var(--primary);
}

.grid-item2:hover .item-action {
    bottom: 15px;
    opacity: 1;
    visibility: visible;
}

.grid-item2 .badge {
    position: absolute;
    top: 15px;
    right: 15px;
}


.question-item .btn.btn-delete {
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background: #f7f7f7;

}

.question-item .btn.btn-delete:hover {
    background: #EBEBEB;
}

.select2-container--default .select2-selection--multiple {
    border-color: #E4E7EC;

}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--gray-border);
}

.list-ic2 ul {
    padding-right: 20px;
    margin: 10px 0;
}

.list-ic2 > li {
    font-weight: 700;
}

.list-ic2 li label {
    display: flex;
    align-items: center;
}

.list-ic2 li label input {
    margin-left: 5px;
}

.list-ic2 > li li {
    font-weight: 300;
}

.soon {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: var(--primary);
    height: calc(100vh - 120px);
}

@media (min-width: 200px) {
    .animate {
        animation-duration: 0.3s;
        -webkit-animation-duration: 0.3s;
        animation-fill-mode: both;
        -webkit-animation-fill-mode: both;
    }
}

@keyframes slideIn {
    0% {
        transform: translateY(1rem);
        opacity: 0;
    }
    100% {
        transform: translateY(0rem);
        opacity: 1;
    }
    0% {
        transform: translateY(1rem);
        opacity: 0;
    }
}

@-webkit-keyframes slideIn {
    0% {
        -webkit-transform: transform;
        -webkit-opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        -webkit-opacity: 1;
    }
    0% {
        -webkit-transform: translateY(1rem);
        -webkit-opacity: 0;
    }
}

.slideIn {
    -webkit-animation-name: slideIn;
    animation-name: slideIn;
}

.draggable-container {
    width: 100%;
    overflow: auto !important;
    overflow-x: hidden !important;
    height: calc(100vh - 150px);
}

.draggable-container > div {
    display: flex;
    justify-content: flex-start;
}

.sortables-clm {
    width: 220px;
    padding-bottom: 10px;
    position: relative;
    margin-left: 5px;
}

.draggable-container .dropdown-toggle::after {
    display: none;
}

.column {
    width: 220px;
    /* float: left; */
    padding-bottom: 10px;
    position: relative;
}

.column1 {
    margin-left: 5px;
    min-height: calc(100vh - 400px);
    transition: all 0.3s ease-in-out;
}

.column1:hover {
    background: rgba(0, 0, 0, 0.04);
}

.column-hed {
    color: #5e6c84;
    margin-bottom: 15px;
    font-size: 12px;
    line-height: 15px;
    padding: 5px 15px;
    width: 100%;
    background: #f4f5f7;
    height: 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.column-hed label {
    margin-right: 1em;
    font-family: inherit;
}

.column-hed .column-count {
    font-weight: 700;
    color: #000;
    float: right;
    margin-right: 1em;
}

.portlet {
    border-radius: 5px;
    padding: 15px;
    background: #f8f9fa;
    position: relative;
    margin: 5px;
    width: 210px;
}


.column:before {
    position: relative;
    width: 220px;
    height: 1px;
    content: '';
    display: block;
}

.task-id {
    font-size: 11px;
}

.portlet-toggle {
    padding: 0 5px;
}

.users-filter {
    margin-left: 15px;
    display: flex;
}

.users-filter a {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px !important;
}

.users-filter a.active {
    border: none;
    padding: 2px !important;
    background: #fff;
    box-shadow: 0 0 2px #000;
}

.users-filter a img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.select2-container--open {
    z-index: 9999999
}

.t-filters .form-control {
    height: 38px;
    background: rgba(0, 0, 0, 0.04);
    border-radius: 3px;
}

.t-select2 .select2-container--default .select2-selection--single {
    height: 38px;
    background: rgba(0, 0, 0, 0.04);
    border-radius: 3px;
}

.t-select2 .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px;
}

.t-select2 .select2-container--default .select2-selection--single .select2-selection__arrow b {
    height: 36px;
}

.tasks-page {
    position: relative;
}

.loader {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, 0.16);
    color: #fff;
    font-size: 100px;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 111;
}

.loader.active {
    display: flex;
}

.column-hed {
    position: relative;
}

.column-hed .form-control {
    border-radius: 4px;
    height: 35px;
}

.column-hed .btns {
    position: absolute;
    left: 0;
    bottom: -33px;
    z-index: 100;
}

.column-hed form {
    display: none;
}

.sortables-clm-active .column-hed form {
    display: block;
}

.sortables-clm-active .column-hed label {
    display: none;
}

.portlet-toggle {
    font-size: 12px !important;
    font-weight: 400;
}

.portlet-toggle form {
    display: none;
}

.portlet-toggle textarea {
    width: 100%;
    height: 80px;
    font-size: 12px !important;
    font-weight: 400;
    border-radius: 5px;
    padding: 5px !important;
    margin-bottom: 5px;
}

.portlet-toggle > .btn {
    font-size: 12px !important;
    font-weight: 400;
}


.portlet p {
    font-size: 11px;
    margin-bottom: 10px;
}

.task-details-right h1 {
    font-size: 20px;
    margin-bottom: 15px;
    padding: 5px;
}

.task-description {
    margin-top: 30px;
    font-size: 12px;
    margin-bottom: 30px;
}

.task-description h3 {
    font-size: 14px;
    font-weight: 700;
}

.task-attachments {
    margin-bottom: 30px;
}

.task-attachments table {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.editor-action-1 {
    margin-top: 10px;
}

.task-attachments h3 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 10px;
}

.table-action {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.table-action a {
    display: flex;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

.task-comments {
    margin-top: 30px;
}

.task-comments h3 {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
}


.comment-item {
    margin-bottom: 30px;
    display: flex;
}


.comment-item .img > div {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

.comment-item .img > div img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.comment-data h4 {
    font-size: 12px;
}

.comment-data h5 {
    font-size: 10px;
    font-weight: 400;
}

.comment-data p {
    font-size: 12px;
    font-weight: 400;
    white-space: pre-line;
}

.comment-action {
    margin-top: 20px;
}

.comment-action a.btn {
    font-size: 12px;
}

.task-details-left {
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 10px;
}

.user-item {
    display: flex;
    align-items: center;
}

.user-item .img > div {
    width: 30px;
    height: 30px;
}

.user-item .img > div img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.user-item h4 {
    font-size: 12px;
    font-weight: 500;
}

.assign-item {
    margin-bottom: 15px;
    font-size: 12px;
}

.comment-data > div {
    display: flex;
    align-items: center;
}

.comment-data > div h4 {
    margin-left: 20px;
}


.task-history {
    margin-top: 30px;
}

.task-history h3 {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
}

.history-item {
    margin-bottom: 30px;
    display: flex;
}


.history-item .img > div {
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

.history-item .img > div img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.assign-title {
    font-weight: 500;
}

html[lang=en] .ic-email, html[lang=en] .ic-password {
    margin-right: 10px;
    margin-left: 0;
}

html[lang=en] .show-password {
    right: 5px;
    left: auto;
}

html[lang=en] .side-bar {
    right: auto;
    left: 0;
}

html[lang="en"] .closeMenu .side-bar {
    left: -181px;
}

html[lang=en] .admin-menu-toggle {
    right: -13px;
    left: auto;
}

html[lang=en] .closeMenu .page-content {
    padding-left: 105px;
    padding-right: 0;
}

html[lang=en] .side-bar ul li i {
    margin-right: 10px;
    margin-left: 0;
}

html[lang=en] .closeMenu .side-bar ul {

    float: right;
}

html[lang=en] .side-bar .dropdown-toggle:after {
    right: 10px;
    left: auto;
}

html[lang=en] .closeMenu .logo img {
    transform: rotate(-180deg);
}

html[lang=en] .admin-app {
    padding-right: 0;
    padding-left: 240px;
}

html[lang=en] .closeMenu .admin-app {
    padding-left: 0;
}

html[lang=en] .closeMenu .side-bar ul:before, html[lang=en] .closeMenu .side-bar ul:after {
    transform: rotateY(180deg)
}

html[lang=en] .form-switch {
    padding-right: 2.5em;
    padding-left: 0;
}

html[lang=en] .form-switch .form-check-input {
    margin-right: 5px;
    margin-left: 0;
}


html[lang=en] .side-bar .dropdown-menu.show {
    padding: 0 0 0 33px;

}


html[lang=en] [type="email"], html[lang=en] [type="number"], html[lang=en] [type="tel"], html[lang=en] [type="url"] {
    text-align: left;
}

html[lang=en] .fa-phone-flip:before {
    content: "\f095";
}

html[lang=en] .ch-div input {
    margin-left: 0;
    margin-right: 10px;
}

html[lang=en] .column-hed .btns {
    right: 0;
    left: auto;
}

.sortable {
    position: relative;
    /*height: 100%;*/
}

.group-items {
    min-height: 150px;
    height: 100%;
    cursor: pointer;
}

.group-item-data {
    position: relative;
}

.show-modal {
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 5px !important;
}

.show-modal i {
    margin: 0 !important;
}

.group-items .ui-sortable-placeholder {
    background: rgba(0, 51, 255, 0.29) !important;
    min-height: 100px;
    padding: 20px;
    margin: 0 0 15px 0;
    border-style: dashed !important;
    border-width: 2px !important;
    border-color: rgba(0, 51, 255, 1) !important;
    visibility: visible !important;
    display: block;
}

.group-items .ui-sortable-helper {
    background: #ffffff !important;
}

.group-caption {
    background: rgba(225, 225, 225, 0.13);
    width: 100%;
    /*display: block;*/
    padding: 20px;
    margin: 0 5px 15px 0;
    border: 1px solid var(--primary_op);
}

.sortable-tr {
    display: flex;
    flex-wrap: wrap;
}

.sortable-tr td {
    vertical-align: top;
    display: block;
    width: 49%;
}

.group-caption:after {
    width: 300px;
    position: relative;
    height: 1px;
    content: '';
    display: block;
}

.group-caption:not(#col-1) .group-items {
    margin-top: 57px;
}

.notyf__icon {
    margin-left: 15px !important;

}

.group-item {
    background: rgba(225, 225, 225, 0.13);
    border: 1px solid rgba(225, 225, 225, 0.5);
    width: 100%;
    display: block;
    padding: 10px;
    margin: 0 0 10px 0;
    color: #000;
}

.move {
    cursor: move;
}

.movable-placeholder {
    background: #ccc;
    width: 300px;
    min-height: 100px;
    display: block;
    padding: 20px;
    margin: 0 0 15px 0;
    border-style: dashed;
    border-width: 2px;
    border-color: #000;
    position: relative;
}

.movable-placeholder:after {
    position: relative;
    width: 300px;
    height: 1px;
    content: '';
    display: block;
}

.group-item-data h3 {
    font-size: 13px;
    height: 30px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.group-item-data {
    font-size: 11px;
}

.group-item-data b {
    font-weight: 500;
    margin-left: 5px;
}

.group-item-data span {
    font-size: 11px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #666;
}

.group-item-data > div {
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.group-item-data i {
    width: 20px;
    height: 20px;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
}

.item-status, .item-priority {
    padding: 5px;
    border-radius: 5px;
}

/*.task-client, .item-to, .item-admin {*/
/*    text-decoration: underline;*/
/*}*/


.item-to {
    color: #0bd398;
}

.item-admin {
    color: #0a8cf0;
}

.item-to img, .item-admin img {
    width: 20px;
    height: 20px;
    border-radius: 5px;
}

.addNew-group {
    font-size: 12px !important;
    font-weight: 400;
    margin-bottom: 10px;
}

.addNew-group form {
    display: none;
}

.addNew-group textarea {
    width: 100%;
    height: 80px;
    font-size: 12px !important;
    font-weight: 400;
    border-radius: 5px;
    padding: 5px !important;
    margin-bottom: 5px;
}

.addNew-group > .btn {
    font-size: 12px !important;
    font-weight: 400;
}

.task-date {
    margin-top: 10px;
    font-size: 12px;
}

.task-date i {
    font-size: 15px;
}

.task-date span {
    color: #6c757d;
}

.input-with-icon {
    position: relative;
}

.input-with-icon input {
    padding-left: 40px;

}

.input-with-icon i {
    position: absolute;
    left: 10px;
    top: 12px;
    font-size: 25px;
    color: #b0b0b0;
}

.addComment {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.addComment textarea.form-control {
    height: 100px;
    border-radius: 10px;
}


.task-details-left .nav-pills .nav-link {
    background: #f7f7f7;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: var(--primary);
}

.task-details-modal .form-control, .right .form-control {
    height: 38px;
    background: rgba(0, 0, 0, 0.04);
    border-radius: 3px;
}

.task-details-modal .input-with-icon i {
    top: 9px;
    font-size: 20px;
}

.task-details-modal .btn {
    border-radius: 10px !important;
}

.task-title-content:hover h1 {
    background: rgba(0, 0, 0, 0.04);
    cursor: pointer;
}

.edit-task-description-content {
    padding: 5px;
}

.edit-task-description-content:hover {
    background: rgba(0, 0, 0, 0.04);
    cursor: pointer;
}

.upload-files-container {
    border: 1px dashed #ced4da;
    padding: 15px;
    border-radius: 5px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upload-files-container input {
    position: absolute;
    z-index: 5;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    opacity: 0;
}

.upload-files-container span {

}

.empty-box {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 350px;
}

.empty-box2 {
    height: auto;
    padding: 15px;
    width: 100%;
}

.empty-box i {
    font-size: 80px;
    margin-bottom: 20px;
}

.edit-comment-container textarea {
    border: 1px solid #ddd;
    width: 100%;
    height: 100px;
    border-radius: 10px;
    padding: 10px;
}

.edit-comment-container {
    display: block !important;
}

.group-caption .dropdown-menu .dropdown-item:before, .group-caption .dropdown-menu .dropdown-item:after {
    display: none;
}

.group-caption .dropdown-menu .dropdown-item {
    font-size: 12px;
    font-weight: 400;
    position: relative;
    padding-top: 7px;
    padding-bottom: 7px;
}

.permission-card {
    background: #fbfbfb;
}

.permission-card h3 {
    font-size: 20px;
}

.permission-card ul {
    padding-right: 15px;
}

html[lang=en] .permission-card ul {
    padding-left: 15px;
    padding-right: 0;
}

.permission-card li {
    position: relative;
    padding-right: 10px;
    width: 100%;
}

html[lang=en] .permission-card li {
    padding-right: 0;
    padding-left: 10px;
}

.permission-card li:after {
    position: absolute;
    right: -5px;
    top: 0;
    height: 100%;
    width: 1px;
    border-right: 1px solid #333;
    content: '';
}

html[lang=en] .permission-card li:after {
    left: -5px;
    right: auto;
}


.permission-card li:before {
    position: absolute;
    right: -5px;
    top: 20px;
    height: 1px;
    width: 17px;
    border-top: 1px solid #333;
    content: '';
}

html[lang=en] .permission-card li:before {
    left: -5px;
    right: auto;
}

.note-editor .note-toolbar .note-color .dropdown-toggle, .note-popover .popover-content .note-color .dropdown-toggle {
    width: auto !important;
}

.btn-group > .btn-group:not(:first-child) > .btn, .btn-group > .btn:nth-child(n+3), .btn-group > :not(.btn-check) + .btn {
    border-radius: 5px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group > .btn-group:not(:last-child) > .btn, .btn-group > .btn.dropdown-toggle-split:first-child, .btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
    border-radius: 5px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.history-list, .comments-list {
    overflow-y: auto;
    max-height: 500px;
}

.swal2-input, .swal2-file, .swal2-textarea {
    font-size: 14px !important;
}

.modal-footer-action .btn {
    border-radius: 5px !important
}

.alert-report i {
    font-size: 30px;
}

.alert-report h3 {
    font-size: 16px;
    margin-bottom: 5px;
}

.alert-report p {
    font-size: 13px;
    margin-bottom: 0;
}

.alert-report .date {
    font-size: 12px;
    margin-top: 10px;
    color: #000;
}


.notyfy-empty h3 {
    font-size: 16px;
}


.notification-menu li {
    border-bottom: 1px solid #ddd;
}

.notification-menu li a {
    display: block;
    position: relative;
    font-size: 11px;
    padding: 10px;
}

.notification-menu p {
    white-space: normal;
    line-height: 20px;
}

/*.notification-menu li.new-notify a:after {*/
/*    position: absolute;*/
/*    left: 8px;*/
/*    top: calc(50% - 5px);*/
/*    width: 10px;*/
/*    height: 10px !important;*/
/*    background: var(--danger);*/
/*    border-radius: 50%;*/
/*    content: '';*/
/*    right: auto;*/
/*}*/
.notification-menu li {
    position: relative;
}

.notification-menu li .btn {
    background: transparent;
    padding: 0 !important;
    border: none;
    position: absolute;
    left: 17px;
    top: calc(50% - 10px);
}

.notification-menu-header {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notification-menu-header .btn {
    font-size: 12px;
    font-weight: 400;
}

.notification-menu li.new-notify {
    background: rgba(255, 0, 0, 0.1);
    padding-left: 40px;
}

.notification-menu li.new-notify a:before {
    display: none !important;
}

.notification-menu li .date {
    font-size: 10px;
    opacity: 0.8;
    margin-top: 5px;
}

.dropdown .notification-menu {
    max-height: 395px;
    width: 350px;
    padding: 0;
}

.dropdown .notification-menu ul {
    max-height: 352px;
    overflow-y: auto;
    width: 350px;
    padding: 0;
}

.dropdown .notification-menu p {
    max-height: 40px;
    overflow: hidden;
    display: block;
    text-overflow: ellipsis;
    line-height: 20px;
}

.questions-list h2 {
    font-size: 24px;
    margin-bottom: 10px;
}

.questions-list p {
    font-size: 14px;
    margin-bottom: 15px;
}

.questions-list .question h3 {
    font-size: 18px;
    color: #333333;
    margin-bottom: 15px;
}

.questions-list .question label.error {
    color: var(--danger);
}

.questions-list .question label {
    font-size: 14px;
    color: #000;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    width: 100%;
}

/*.questions-list .question label input[type=radio]{*/
/*    -webkit-appearance: none;*/
/*    -moz-appearance: none;*/
/*    appearance: none;*/
/*    width: 24px;*/
/*    height: 24px;*/
/*    margin-left: 5px;*/
/*    background: url('../images/ckbox.svg') no-repeat;*/
/*}*/
/*.questions-list .question label input[type=radio]:checked{*/
/*    background: url('../images/ckbox2.svg') no-repeat;*/
/*}*/
.questions-list .question {
    border: 1px dashed #ddd;
    padding: 15px;
    border-radius: 15px;
    margin-bottom: 30px;
}

.questions-list .form-action .btn {
    border-radius: 5px !important;;
}


.question.active {
    border: 1px solid var(--success);
    background: rgba(6, 155, 92, 0.04);
}

/*******************************
* MODAL AS LEFT/RIGHT SIDEBAR
* Add "left" or "right" in modal parent div, after class="modal".
* Get free snippets on bootpen.com
*******************************/
.modal.left .modal-dialog,
.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 320px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
    padding: 15px 15px 80px;
}

/*Left*/
.modal.left.fade .modal-dialog {
    left: -320px;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.show .modal-dialog {
    left: 0;
}

/*Right*/
.modal.right.fade .modal-dialog {
    right: -320px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.show .modal-dialog {
    right: 0;
}

/* ----- MODAL STYLE ----- */
.modal.right.modal-content {
    border-radius: 0;
    border: none;
}

.modal.right.modal-header {
    border-bottom-color: #EEEEEE;
    background-color: #FAFAFA;
}


.filters-modal h3 {
    font-size: 16px;
    margin-bottom: 10px;
}

.h-full {
    height: calc(100vh - 110px);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.error-box {
    background: var(--danger);
    border-radius: 15px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 350px;
    color: #fff;
    width: 100%;
}


.error-box .ic {
    font-size: 80px;
}

.more-clients {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px !important;
    background: rgba(0, 0, 0, 0.8);
    color: #fff !important;
    font-size: 16px;
}

.client-item {
    text-align: center;
    margin-bottom: 30px;
    width: 90px;
}

.client-item img {
    width: 45px;
    height: 45px;
}

.client-item span {
    font-size: 12px;
    /*font-weight: 700;*/
    text-align: center;
    display: block;
    color: #888888;
    margin-top: 10px;
}

.widgets {
    background: #fff;
    border-radius: 5px;
    border: 1px solid #ddd;
    padding: 10px;
    position: relative;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.widgets:after {
    position: absolute;
    width: 100%;
    z-index: 1;
    top: 0;
    left: 17px;
    content: '';
    background: url("../images/btrn-v.svg") left center no-repeat;
    opacity: 0.5;
    height: 100%;
    background-size: 80px;
}

.ic-bg {
    position: absolute;
    left: 10px;
    top: 15px;
    opacity: 0.3;
    font-size: 95px;
}

.widgets h3 {
    font-size: 25px;
    margin: 30px 0;
}

.widgets p {
    font-size: 20px;
}

.widgets .badge {
    display: inline-block;
}


.closeMenu .logo img {
    max-height: 40px;
}

.table thead tr {
    background: var(--background-h1);
    background: var(--background-h2);
    background: var(--background-h3);
    background: var(--background-h4);
    filter: var(--filter-h5);
}

.table-responsive {
    border-color: var(--bs-border-color);
}

.ch-item {
    margin-bottom: 30px;
}

.cl-list {
    border-left: 1px dashed var(--primary_hover);
    border-radius: 5px;
    padding: 15px 0 15px 40px;
    margin-bottom: 30px;
}

html[lang=ar] .cl-list {
    border-right: 1px dashed var(--primary_hover);
    border-left: 0;
    padding: 15px 40px 15px 0;
}

.parent-ch-list {
    padding-right: 0 !important;
    border: 0 !important;
}

.parent-ch-list > li {
    background: rgba(0, 0, 0, 0.04);
    border-right: 5px solid var(--primary_hover);
    padding: 40px 40px 15px 15px;
    border-radius: 10px;

}

.parent-ch-list > li > .ch-item {
    margin-bottom: 0;

}

.cl-list {
    margin-top: 20px;
}

.ch-item .btn {
    opacity: 0;
    transition: all 0.3s ease;
}

.ch-item:hover .btn {
    opacity: 1;
}

.ch-item label {
    display: block;
    line-height: 40px;
    width: 100%;
    padding: 0 15px;
    cursor: text;
    border-bottom: 1px solid #ddd;
    transition: all 0.3s ease;
    font-size: 12px;
    height: 40px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


.ch-item label:hover {
    border-bottom: 1px solid #000;
}

.edit-item {
    display: none !important;
}


.ch-item input[type=text] {
    display: none;
}

.ch-item.editActive label {
    display: none;

}

.ch-item span {
    display: none;
    transition: all 0.1s ease-in-out;

}


.ch-item.editActive span {
    position: absolute;
    top: -15px;
    left: 0;
    font-size: 10px;
    border: none;
    line-height: 10px;
    padding: 0;
    width: auto;
    display: flex;
    opacity: 1;
    visibility: visible;
    height: auto;
}


.hasChild.ch-item.editActive .first-input-lbl span {
    left: 48px;
}

html[lang=ar] .ch-item.editActive span {
    left: auto;
    right: 0;
}

html[lang=ar] .hasChild.ch-item.editActive .first-input-lbl span {
    left: auto;
    right: 48px;
}

.ch-item.editActive .d-flex {
    position: relative;
}

.ch-item.editActive input[type=text] {
    display: block;
}

.ch-item {
    position: relative;
}

.ch-item.form-control {
    font-size: 13px;
}

.ch-item.editActive .edit-item {
    display: flex !important;
    align-items: center;
}

.action-div {
    display: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
    max-width: 120px;
    justify-content: flex-end;
}

html[lang=ar] .action-div {
    left: 0;
    right: auto;
}

.ch-item:hover .action-div {
    display: flex;
}

.ch-item.editActive .delete-item {
    display: block !important;
}

.ch-item.editActive .add-new-branch {
    display: none !important;
}

.cl-list li:last-child .ch-item {
    margin-bottom: 0px;
}

.cl-list li {
    margin-bottom: 15px;
    padding-top: 20px;
}

.cl-list > li:last-child {
    margin-bottom: 0;
}

.btn.collaps-btn-menu {
    opacity: 1;
    display: none;
}

.btn.collaps-btn-menu.closed {
    transform: rotate(90deg);
}

.hasChild .btn.collaps-btn-menu {
    display: block;
}

.side-bar ul .dropdown-menu .dropdown-item {
    background: transparent !important;
}

.side-bar ul .dropdown-menu .dropdown-item:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    padding-right: 40px;
}

@media (min-width: 200px) {
    .animate {
        animation-duration: 0.3s;
        -webkit-animation-duration: 0.3s;
        animation-fill-mode: both;
        -webkit-animation-fill-mode: both;
    }
}

@keyframes slideIn {
    0% {
        transform: translateY(6rem);
        opacity: 0;
    }
    100% {
        transform: translateY(3.5rem);
        opacity: 1;
    }
    0% {
        transform: translateY(6rem);
        opacity: 0;
    }
}


@-webkit-keyframes slideIn {
    0% {
        -webkit-transform: transform;
        -webkit-opacity: 0;
    }

    100% {
        -webkit-transform: translateY(3.5rem);
        -webkit-opacity: 1;
    }

    0% {
        -webkit-transform: translateY(6rem);
        -webkit-opacity: 0;
    }
}

.slideIn {
    -webkit-animation-name: slideIn;
    animation-name: slideIn;
}

.dropdown.user .dropdown-menu {
    border-color: #fff;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16)
}

.dropdown.user .dropdown-menu:after {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fff;
    content: '';
    top: -10px;
    position: absolute;
    left: 5px;
}

.inputs-box {
    width: 100%;
    overflow: auto !important;
    height: calc(100vh - 150px);
    border: 1px solid #ddd;
    background: var(--primary_op);
    padding: 20px;
}

.inputs-box h3 {
    font-size: 20px;
    margin-bottom: 20px;
}

.ui-sortable-handle {
    width: 336px !important;
}

.pagination {
    margin-top: 20px;
}

.inputs-box .group-item {
    background: #fff;
}

.edit-status-title-form {
    max-width: 320px;
    width: 100%;
}

.btns-action {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}

html[lang=en] .btns-action {
    left: auto;
    right: 0;
}

.group-caption:hover .btns-action {
    opacity: 1;
}

.page-content {
    position: relative;
}

.template-tabs {
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    border-radius: 12px 12px 0 0;
}

.template-tab-content {
    padding-top: 60px;
}

.template-tabs .nav-link {
    color: var(--primary) !important;
    padding-left: 30px;
    padding-right: 30px;
}

.template-tabs .nav-link.disabled {
    color: #7d90ae !important;
}

.template-tabs .nav-link:hover {
    border-color: transparent !important;
    background: rgba(255, 255, 255, 0.1);
}

.template-tabs .nav-link.active {
    color: var(--primary_hover) !important;
    background: #fff;
}

.template-tabs {
    margin-bottom: 40px;
    background: var(--primary_op);
    padding-top: 15px;

}

.tab3-table tr td {
    padding: 15px 0;
}

.tab3-table tr th {
    padding: 15px 0;
}

.tab-3-modal .close {
    width: 30px;
    height: 30px;
    padding: 0;
}

.tab-3-modal .modal-header {
    border-color: #ddd;
}

.tab-3-modal .modal-footer {
    border: none;
}

.td-title-tbl {
    display: inline-block;
    min-width: 250px;
}

@media (min-width: 576px) {
    .modal-900 .modal-dialog {
        max-width: 1100px;
    }

    .modal-700 .modal-dialog {
        max-width: 800px;
    }
}

@media (max-width: 640px) {
    .login-page-body .container .row {
        margin: auto;
    }


    .logo {
        display: flex;
        max-height: 40px;
    }

    .logo img {
        max-height: 40px;

    }

    .admin-app {
        padding-right: 0;
    }

    html[lang="en"] .admin-app {
        padding-left: 0;
    }

    .page-content, .closeMenu .page-content {
        padding-right: 30px;
    }

    html[lang="en"] .page-content, html[lang="en"] .closeMenu .page-content {
        padding-right: 0;
        padding-left: 30px;
    }

    /*.admin-menu-toggle{*/
    /*    left: -86px;*/
    /*}*/
    .closeMenu .admin-menu-toggle {
        left: -13px;
    }

    .box-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .box-title {
        margin: 15px;
    }

    .bred {
        display: none;
    }

    .user-data .username {
        display: none;
    }

    .logo {
        top: 0;
    }

    .side-bar {
        border: none;
        right: -220px;
    }

    html[lang=en] .side-bar {
        left: -220px;
    }

    .login-box {
        background: rgba(255, 255, 255, 0.8);
    }


    .side-bar ul {
        margin-top: 100px;
        position: relative;
        width: 94px;
        float: left;
    }

    .side-bar ul li a {
        justify-content: center;
    }

    .side-bar ul li span {
        display: none;
    }


}


/*lang En*/
html[lang=en] .parent-ch-list > li {
    border-left: 5px solid var(--primary_hover);
    border-right: 0;
    padding: 40px 15px 15px 40px;
}

html[lang=en] .btn.closed .fa-angle-down:before {
    content: "\f106";
}

html[lang=en] .dropdown.user .dropdown-menu:after {
    left: auto;
    right: 5px;
}

html[lang=en] .dropdown-menu .dropdown-item {
    display: flex;
    align-items: center;
    text-align: justify;
}

.fixed-table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
}


.fixed-table thead tr {
    background: var(--primary);
}

.fixed-table label {
    display: block;
    width: 100px;
}


.table-res table {
    min-width: 100%;
    width: auto;
}

.table-res {
    overflow-x: auto;
    max-width: 100%;
    max-height: calc(100vh - 250px); /* Set max height for responsiveness */
    /*padding-top: 97px;*/
}

.table-res td {
    width: 100%;
}

.table-res td div {
    width: 100px;
}

.fixed-table tbody tr td:first-child {
    position: sticky;
    left: 0;
    background-color: #fff;
}

.fixed-table thead {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 3;

}

.fixed-table thead tr th:first-child {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 3;
    background: var(--primary)

}


.login-page {
    display: flex;
    min-height: calc(100vh - 180px);
    align-items: center;
    justify-content: center;
    padding: 40px 0;

}

.login-header {

    background: var(--primary_op) url("../images/btrn-h-b.svg");
    padding: 15px;
    width: 100%;
    border-bottom: 1px solid #EFEFEF;
    height: 130px;

}

.login-container {
    border: 1px solid #D9D9D9;
    border-radius: 24px;
    padding: 73px;
    width: 100%;
    text-align: center;
}

.login-container label {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 8px;
}

.login-container h2 {
    font-size: 32px;
    line-height: 54px;
    text-align: center;
    color: #101010;
}

.login-container p {
    font-size: 16px;
    line-height: 27px;
    text-align: center;
    margin-bottom: 50px;
}

.login-logo {
    display: flex;
    justify-content: center;
}

.login-logo img {
    max-height: 80px;
}

.login-link {
    margin-top: 15px;
    font-size: 16px;
    color: #101010;
    display: block;
}

.login-link span {
    color: #CC58A1;
}

.portal-panel .form-control, .portal-app .form-control {
    border-radius: 10px;
    border-color: #D9D9D9;
    height: 50px;
}

.portal-panel textarea.form-control, .portal-app textarea.form-control {
    height: 170px;
}

.portal-panel .btn, .portal-app .btn {
    border-radius: 10px;
}

.portal-panel .form-control:focus, .portal-app .form-control:focus {
    border: 1px solid var(--primary);
}

.input-with-ic {
    position: relative;
}

.input-with-ic span {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.input-with-ic input {
    padding-left: 40px;
}

.show_password {
    cursor: pointer;
}

.topline {
    width: 100%;
    height: 5px;
    background: var(--background-h1);
    background: var(--background-h2);
    background: var(--background-h3);
    background: var(--background-h4);
    filter: var(--filter-h5);
}

.login-container .btn {

    background: var(--primary_hover);
    border-color: var(--primary_hover);

    padding: 15px;
    width: 100%;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.footer-login {
    background: var(--background-h1);
    background: var(--background-h2);
    background: var(--background-h3);
    background: var(--background-h4);
    filter: var(--filter-h5);

    padding: 15px;
    width: 100%;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;

}

@media (max-width: 640px) {
    .td-title-tbl {
        min-width: 150px;
    }

    .login-container {
        padding: 40px;
    }

    .login-container h2 {
        font-size: 25px;
    }
}

.file-upload {
    border: 1px dashed #ddd;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    border-radius: 5px;
}

.file-upload input {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    opacity: 0;
}

.file-upload span {
    font-size: 12px;
    color: #7e7e7e
}

/*****************Client*********/
.side-bar-client {
    position: relative;
    border-radius: 20px;
    min-height: auto;
    width: 100%;
    background: var(--primary);
    padding-bottom: 20px;
}

.client-app .topline {
    background: var(--primary);
}

.client-app .bg-primary {
    background: var(--primary) !important;
}

.client-details {
    padding: 20px 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.client-details h3 {
    font-size: 20px;
    color: #fff;
}

.client-details h4 {
    font-size: 14px;
    color: #ffc181;
    margin-top: 10px;
}

.d-line {
    font-size: 10px;
    color: rgba(255, 255, 255, 0.5);
    margin: 15px auto;
}

.client-details .user-img {
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 50%;
    border: 5px solid rgba(255, 255, 255, 0.2);
}

.client-details .user-img img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.client-page-content {
    /*background: rgba(49, 103, 183, 0.04);*/
    /*border: 1px solid #ddd;*/
    border-radius: 20px;
    padding: 0;
}

.st-box{
     border: 1px solid #ddd;
    border-radius: 12px;
    padding: 15px;
    display: flex;
    background : var(--primary_op) url("../images/btrn-h-b.svg") center top;
    background-size: 100% 75px;
    align-items: center;
}
.ic-st-1{
    width: 60px;
    height: 100%;
    font-size: 40px;
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
}
.st-box h3{
    font-size: 16px;
    color: #333;
}
.st-box h4{
    font-size: 20px;
    color: var(--primary_hover);
    margin-top: 15px;
    font-weight: 700;
}
.st-details{
    width: 100%;
}
.st-box h4 .currency{
    font-size: 16px;
    font-weight: 400;
    color: var(--primary);

}

@media (min-width: 1400px){
    .client-app .container,
    .client-app .container-lg,
    .client-app .container-md,
    .client-app .container-sm,
    .client-app .container-xl,
    .client-app .container-xxl {
        max-width: 1600px;
    }
    }
@media (max-width: 640px) {

    .client-app .side-bar {
        border: none;
        right: 0;
    }

    .client-app .side-bar ul {
        margin-top: 0;
        position: relative;
        width: auto;
        float: none;
    }

    .client-app .side-bar ul li span {
        display: block;
    }

    .client-app .side-bar ul li a {
        justify-content: flex-start;
    }
}