* { margin: 0 0; padding: 0; outline: none; -ms-word-break: break-word; word-break: break-word; word-wrap: break-word;  }

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

html {scroll-behavior: smooth; }
body { font-family: "Inter", sans-serif; font-weight: normal !important; font-style: normal !important; overflow-x: hidden; padding: 0px !important; }

/* scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px;}
::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); -webkit-border-radius: 10px; border-radius: 10px;}
::-webkit-scrollbar-thumb {-webkit-border-radius: 10px; border-radius: 10px; background: rgba(46, 86, 192, 0.6); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);}
::-webkit-scrollbar-thumb:window-inactive { background: rgba(255, 255, 255, 0.3);}

input:-webkit-autofill, input:-webkit-autofill:hover,  input:-webkit-autofill:focus,
textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus,
select:-webkit-autofill, select:-webkit-autofill:hover,
select:-webkit-autofill:focus { border: 1px solid #D9D9D9; -webkit-text-fill-color: #000; -webkit-box-shadow: 0 0 0px 1000px rgba(243, 243, 243, 1) inset; transition: background-color 5000s ease-in-out 0s;}

.help-block { color: red; display: block; width: 100%; font-size: 11px; padding-left: 45px; order: 2; }

.input-fldcls::-ms-reveal {
  display: none;
}


/*  */

.auth_form_section { display: flex; align-items: center; justify-content: space-between; min-height: 100vh; background: #fff url(../images/authbg.jpg) repeat; background-position: center; background-size: 100%; padding: 15px; } 
.auth-full-page-content { box-shadow: 0px 4px 19px 0px #E0E0E0; background: #FFFFFF; max-width: 1028px; width: 100%; min-height: unset; border-radius: 20px; display: flex; }

.auth-form-content { width: 100%; padding: 55px; }
.auth-form-content .page_title { font-size: 32px; line-height: 38px; color: #000; margin-bottom: 25px; text-transform: unset; }
.auth-form-content .form-label { font-size: 14px; line-height: 16.94px; color: #000; margin-bottom: 10px; }
.auth-form-content .form-group { margin-bottom: 35px; }
.auth-form-content .form-control { border: 1px solid #D9D9D9; width: 100%; box-shadow: none !important; padding: 17px 12px; border-radius: 10px; color: #000; font-size: 14px; }
.auth-form-content .form-control:hover, .auth-form-content .form-control:focus { border-color: #00838F; }
.auth-form-content .password_label { width: 100%; display: flex; align-items: center; justify-content: space-between; }
.auth-form-content .eye_btn { font-size: 12px; text-align: right; margin-bottom: 10px; padding: 0; display: flex; align-items: center; color: #000; box-shadow: none !important; }
.auth-form-content .eye_btn:hover { color: #00838F; }
.auth-form-content .eye_btn .mdi { font-size: 20px; margin-right: 5px; line-height: 20px; }
.auth-form-content .go_other_page { font-size: 14px; text-align: right; color: #000; margin-bottom: 35px; }
.auth-form-content .go_other_page a {  color: #000; text-decoration: underline !important; }
.auth-form-content .go_other_page a:hover, .auth-form-content .go_other_page a:focus { color: #00838F !important; }

.common_btn { background: #00838F; width: 100%; padding: 14px; border-radius: 6px; font-size: 18px; font-weight: 700; text-align: center; text-transform: uppercase; box-shadow: none !important; border: 1px solid transparent; color: #fff !important; }
.common_btn:hover, .common_btn:focus { color: #00838F !important; border-color: #00838F !important; background: transparent; }

.common-btn { min-width: 74px; box-shadow: none !important; border: 1px solid transparent !important; border-radius: 2px; background: #00838F; font-size: 12px; font-weight: 700; color: #FFFFFF !important; padding: 5px 10px;}

.auth_right_content { max-width: 338px; width: 100%; border-radius: 0px 20px 20px 0px; background: linear-gradient(180deg, #00838F 0%, #01C0D1 48.52%, #00838F 100%); padding-top: 40px; padding-bottom: 10px; }
.auth_right_content .auth-logo { text-align: center; margin: 0px auto; color: #fff; font-size: 56px; font-weight: bold; text-align: center; line-height: 1; height: 70px; padding: 0px 15px; } 
.auth_right_content .auth-logo img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.auth_right_content .auth-logo .logo-txt { color: #fff !important; font-size: 56px; font-weight: 700; margin-left: 0px; }
.auth_right_content .hand_img { width: 100%; height: auto; }
.auth_right_content .hand_img img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.auth_right_content .arc_block { padding: 18px; }
.auth_right_content .arc_block h1 { font-size: 36px; font-weight: 700; text-align: center; color: #FFFFFF; margin-bottom: 22px; }
.auth_right_content .arc_block p { font-size: 16px; line-height: 24px; text-align: center; margin-bottom: 0px; color: #FFFFFF;  }

.forgot-page .go_other_page { text-align: center; margin-top: 35px; }

.auth_form_section .help-block { padding-left: 0px  !important; }

/*  */

#page-topbar { box-shadow: 0px 4px 4px 0px #0000000D; background: #282828; border: none !important; }
.navbar-header { height: 51px; padding-right: 15px; }  
.navbar-header .header-profile-user { height: 30px; width: 30px; padding: 0 !important; margin-left: 8px; }
.navbar-header .navbar-brand-box { background: none !important; border-right: none !important; box-shadow: none !important; padding: 10px !important; min-width: 39px !important; width: 50px !important; }
.navbar-header .title-sm { font-size: 14px; font-weight: 700; color: #FFFFFF; text-transform: uppercase; margin-left: 10px; max-width: 320px; width: 100%; }
.navbar-header .form-group { margin: 0px auto; max-width: 250px; width: 100%; }
.navbar-header .input-group { background: #323232; border: 1px solid #49494A; width: 100%; border-radius: 4px; }
.navbar-header .form-control { background: transparent !important; border-radius: 4px; box-shadow: none; border: none !important; font-size: 10px;  font-family: "Inter", sans-serif; color: #fff; padding: 2px 10px; }
.navbar-header .form-control::placeholder {color: #000; }
.navbar-header .input-group-text { background: transparent; border-radius: 4px; box-shadow: none; border: none !important; padding: 8px; }
.navbar-header .input-group-text a { color: #000;   }  
.navbar-header .input-group-text a svg { width: 18px !important; height: 18px !important; }
.navbar-header .header-item, .navbar-header .header-item:hover { color: #fff !important;}
.navbar-header .header-item { height: auto !important; background: transparent !important; border: none !important; padding: 0px; display: flex; align-items: center; font-size: 12px; }  
.navbar-header .plus_icon_dropdown { border: 1px solid #797979; width: 30px; height: 30px; border-radius: 2px; background: #FF993A; display: block; position: relative; }
.navbar-header .plus_icon_dropdown img { width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 2px; }
.navbar-header .delivery_btn { background: #FFFF61; font-size: 12px; font-weight: 500; color: #000 !important; border: 1px solid #797979; box-shadow: none !important; min-width: 90px; margin-left: 10px; height: 30px; border-radius: 2px; display: flex; align-items: center; justify-content: center; padding: 3px 10px; }

.navbar-header .delivery_btn img { width: 20px; height: 20px; object-fit: contain; object-position: center; margin-right: 5px; }
.navbar-header .logo { width: 100%; height: 100%; line-height: unset !important; display: block; } 
.navbar-header .logo img { width: 100%; /* height: 100%; */ object-fit: contain; object-position: center; }
.navbar-header .dropdown .mdi { color: #000 !important; font-size: 20px;}

.navbar-header .dropdown-menu { top: 41px !important; border: none !important; border-radius: 0px 0px 10px 10px; }
.navbar-header .dropdown-item { font-size: 12px; line-height: 24px; color: #000; }


/* side navbar */

#sidebar-menu { padding-top: 0px !important; }

.main-content { margin-left: 40px; min-height: 100vh; display: flex;}
.main-content .container-fluid { height: 100%; }


.vertical-menu { top: 51px !important; width: 40px !important;  border-right: 1px solid #DEDEDE; transition: 0.3s ease-out; }

#sidebar-menu ul li a span { display: none; }
#sidebar-menu ul li a img { margin-right: 0px !important; width: 15px; height: 15px; object-fit: contain; object-position: center; margin-left: 2px; }
#sidebar-menu ul li a img + img { display: none; }
#sidebar-menu .has-arrow::after { display: none; }
.vertical-menu:hover { transition: 0.3s ease-out; width: 260px !important; z-index: 11111; }
.vertical-menu:hover #sidebar-menu > ul > li > a span { display: inline; margin-left: 10px; }
.vertical-menu:hover #sidebar-menu .has-arrow::after { display: inline-block; line-height: 1; }
.metismenu li:last-child { border: none !important; }
.metismenu .mm-collapse.mm-show { display: none !important; }
.vertical-menu:hover .metismenu .mm-collapse.mm-show { display: block !important; }

#sidebar-menu ul li a { font-size: 12px; padding: 10px; /* text-transform: uppercase; font-weight: 700;  */  color: #000; }
.vertical-menu:hover #sidebar-menu ul li a:hover { color: #fff !important;  background: #00838F; }
.vertical-menu:hover #sidebar-menu ul li a:hover img { display: none; }  
.vertical-menu:hover #sidebar-menu ul li a:hover img + img { display: inline-block; }  

#sidebar-menu ul li ul { padding-left: 0; }
#sidebar-menu ul li ul li a, #sidebar-menu ul li ul.sub-menu li a { color: #000; font-size: 12px; padding: 6px 10px 6px 40px; font-weight: normal; text-transform: unset; display: flex; align-items: center; justify-content: space-between; }
#sidebar-menu ul li ul.collapse { transition: 0.3s ease-in-out; }

.mm-active > a { color: #fff !important;  background: #00838F; }
.mm-active > a img { display: none; }
.mm-active > a img + img { display: inline-block !important; }
#sidebar-menu .has-arrow::after { margin-top: 0px !important; }
#sidebar-menu ul li a span.count { display: inline-block; background: #00838F; color: #fff; font-size: 8px; line-height: 14px; border-radius: 3px; min-width: 30px; text-align: center; }
.vertical-menu:hover #sidebar-menu ul li a:hover span.count { color: #00838F; background: #fff;   }

.mm-active .active, .mm-active .active i, .mm-active .active svg {color: #fff !important; background: #00838F;}
.mm-active .active img { display: none; } 
.mm-active .active img + img { display: inline-block !important; } 

div.dt-scroll, div.dtfh-floatingparent { position: relative !important;}

/*  */

.page-content { padding: 60px 0px 10px 10px; width: 100%;}
.footer { display: none !important; }

/*  */

.card { margin-bottom: 0; border: none !important; } 
.card-body { padding: 0;} 

.navbar-header .navbar-brand-box { display: inline-block !important; }


/* page top row */

#page-headings { width: 100%; padding-right: 10px; }
.page-title-box { padding-bottom: 0px !important; }

.page_title { font-size: 14px; font-weight: 700; color: #000; text-transform: uppercase; width: 100%; } 
.page_heading_left_block { display: flex; align-items: center; flex-wrap: wrap; width: 100%; flex: 1; }
.page_heading_left_block p { border-radius: 6px; margin-bottom: 5px; color: #000; font-size: 12px; background: linear-gradient(90deg, #B1E9ED 0%, #DFFDFF 82.03%); padding:7px 10px;  margin-right: 10px; }
.page_heading_left_block p span { font-weight: 700; font-family: "Inter", sans-serif;  color: #000; margin-right: 10px; }

.common_top_right { display: flex; align-items: center; /* width: 100%; */ }
.common_top_right .ctr_blocks { display: flex; align-items: center; flex-wrap: wrap; }
.common_top_right .ctr_blocks button { background: none; border: none !important; box-shadow: none !important; padding: 0px; color: #000; font-size: 12px; margin-left: 12px;   display: flex; align-items: center; justify-content: center; }
.common_top_right .ctr_blocks button img { width: 14px; height: 14px; object-fit: contain; object-position: center; margin-right: 5px;   vertical-align: text-bottom; }
.common_top_right .icon-btn { width: 30px; height: 30px; padding: 5px; font-size: 16px; border-radius: 2px; background: #B1E9ED !important; color: #00838F !important; margin-left: 10px !important; display: block; }

.common_top_right .ctr_blocks button:hover { color: #00838F !important;  }
.common_top_right .ctr_blocks button img + img { display: none; }
.common_top_right .ctr_blocks button:hover img { display: none; }
.common_top_right .ctr_blocks button:hover img + img { display: inline-block; }

.common_top_right .input-group { border-bottom: 1px solid #D7D7D7; width: 175px; margin-left: 12px; }
.common_top_right .input-group span { padding: 0px; padding-right: 10px; background: none !important; box-shadow: none !important; border: none !important; }
.common_top_right .input-group span img { width: 14px; height: 14px; object-fit: contain; object-position: center;  }
.common_top_right .input-group input { border: none; background: none; font-size: 12px; color: #000; box-shadow: none; padding: 5px 0px; }
.common_top_right .input-group select { border: none; background-color: transparent; font-size: 12px; color: #000; box-shadow: none; padding: 5px 0px; }


/* data table */

table.dataTable th { background: #B1E9ED !important; font-size: 12px; color: #000; font-weight: normal; border-color: #99CFD2 !important; padding: 4px; border-top: 0px !important; border-bottom: 0px !important; }
table.dataTable th img { width: 12px; height: 12px; object-fit: contain; object-position: center; }
table.dataTable td { border: none !important; font-size: 12px; color: #000; padding: 4px 10px; }
table.dataTable td a { color: #000; text-decoration: underline !important; }  
table.dataTable tr:nth-child(2n) { background: #F4F4F4 !important; }

table.dataTable > thead .sorting::before, table.dataTable > thead .sorting::after{ bottom: 3px; }
table.dataTable { border: none !important; }
table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable th:last-child, table.table-bordered.dataTable td:last-child, table.table-bordered.dataTable td:last-child { border-right-width: 0 !important;}
.page-item .page-link { border-color: #CED4DA; font-size: 11px; text-align: center; color: #000;  }
.page-item.active .page-link { background: #00838F; color: #fff; border-color: #00838F !important;}
.page-link:focus { box-shadow: none  !important;}
div.dt-processing > div:last-child > div {background: #00838F !important;}


.table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before, table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before { background-color: #00838F !important;}

div.dt-scroll-body { border: none !important; }
#datatable_wrapper .bottom { display: flex; align-items: center; justify-content: space-between; }
div.dt-container div.dt-length label { display: none !important; }
div.dt-container div.dt-length select { color: #000; font-size: 11px; background-position: right 3px center !important; background-size: 11px 11px !important; box-shadow: none !important;  border: 1px solid #CED4DA !important;}
table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::before { background: url(../images/downArrow.svg) no-repeat; opacity: .6; background-size: 10px; background-position: right center; content: ""; width: 10px; height: 10px; top: 50%; transform: translateY(-50%); }
table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::after { background: url(../images/downArrow.svg) no-repeat; opacity: .6; background-size: 10px; background-position: right center; content: ""; width: 10px; height: 10px; display: none !important; top: 50%; transform: translateY(-50%); }

table.dataTable thead > tr > th.dt-orderable-asc.dt-ordering-asc span.dt-column-order::before { transform: translateY(-50%) rotate(180deg); opacity: 1 !important; } /* up */
table.dataTable thead > tr > th.dt-orderable-asc.dt-ordering-desc span.dt-column-order::after { display: block !important; opacity: 1 !important; }  /* down */

.t_status { min-width: 75px; border-radius: 3px; font-size: 12px; text-align: center; display: block; padding: 1px 6px; display: inline-block; }
.in_stock { background: #99FF99;}
.less_stock { background: #FFBF84;}
.not_stock { background: #FF9999;}

.icons_td {  display: flex; align-items: center;}
.icons_td a { width: 20px; height: 20px; border-radius: 50%; background: #00838F; display: flex; align-items: center; justify-content: center; text-decoration: none !important; } 
.icons_td a img { width: 14px; height: 14px; object-fit: contain; object-position: center;}
.icons_td a.edit_a { background: #2AC5D0;}
.icons_td a.access_account { background: #02535A; margin-left: 5px; }

.filter-icon .dropdown-toggle { color: #000; font-size: 12px;}
.filter-icon.active .dropdown-toggle { color: #00838F;}


/*  */

.option-list .option-list { padding: 10px 15px 0px; }
.option-list .option-list:last-child { padding-bottom: 10px; }
.option-list .checkbox { padding-left: 20px; font-size: 12px; line-height: 15px; font-weight: 600;}
.option-list .checkmark::after { left: 3px;  top: 0px;  width: 5px;  height: 8px;}


/* modal */

.modal-dialog { max-width: 520px; width: 100%; }
.modal-content { border-radius: 10px; border: none !important; }
.modal-header { border-bottom: 0px; justify-content: center; padding: 20px; }
.modal-title { font-size: 14px; font-weight: 700; text-align: center; color: #000; text-align: center; text-transform: uppercase; }
.btn-close { position: absolute; opacity: 1 !important; }
.modal-header .btn-close { margin: 0 !important; padding: 0 !important; right: 5px !important; top: 5px !important;}

.modal-content .common-form-block .form-control { max-width: 100%; }
.modal-content .common-form-block .form-group label.form-label { max-width: 130px;}
.modal-content .common-form-block .info_table { max-height: 400px; }
.modal-content .common-form-block .info_table table thead { position: sticky; top: 0; z-index: 1; }

/* popover_modal */

.popover_modal .modal-dialog { max-width: 402px !important;}
.popover_modal .popover_img { width: 73px; height: 56px; margin: 0px auto 15px;}
.popover_modal .popover_img img {  width: 100%; height: 100%; object-fit: contain; object-position: center;}
.popover_modal .popover_title { font-size: 16px; line-height: 22px; text-align: center; color: #000; margin-bottom: 5px; font-weight: 600; }
.popover_modal .popover_text { color: #000; font-size: 12px; text-align: center; margin-bottom: 20px;}
.popover_modal .popover_btns {  text-align: center;}
.popover_modal .modal-body { padding: 30px 2rem;}

/* switch button */

input[switch] + label { border: 1px solid #E4E4E4; background: #EDFEFF; margin-bottom: 0px !important; }
input[switch]:checked + label { background: #00838F;  }
input[switch] + label::after { background: #00838F; width: 18px; height: 18px; }
input[switch]:checked + label::after { background-color: #fff;}
input[switch] + label::before { color: #000; }

/* dashboard */

.dashboard_page { padding: 30px; width: 100%; }
.dash_card { width: 100%; height: 100%; padding-bottom: 60px; }
.dash_card_inner { border-radius: 10px; max-width: 340px; min-height: 180px; width: 100%; box-shadow: 0px 4px 12px 0px #E7E7E7; padding: 30px; display: flex; flex-direction: column; margin: 0px auto; }   
.dash_card_inner .dci_title { font-size: 14px; font-weight: 700; line-height: 25px; color: #000; margin-bottom: 15px; }
.dash_card_inner .dci_content { margin: auto 0; }
.dash_card_inner .dci_content p { margin-bottom: 10px; display: flex; align-items: center; }
.dash_card_inner .dci_content p:last-child { margin-bottom: 0px; }
.dash_card_inner .dci_content p span { font-size: 12px; line-height: 25px; color: #000; width: 60%; display: inline-block; }
.dash_card_inner .dci_content p span + span { font-size: 20px; font-weight: 700; line-height: 25px; color: #000; width: 40%; }
.dash_card_inner .dci_content .page_link { background: #FFFFFF; width: 90px; padding: 3px; border-radius: 2px; font-size: 12px; font-weight: 700; color: #000; box-shadow: none !important; border: 1px solid transparent !important; }

.col-xl-3:nth-child(1) .dash_card_inner  { background: #FFF2D5 url(../images/lightorange.png) no-repeat; background-size: cover; background-position: center; }
.col-xl-3:nth-child(2) .dash_card_inner  { background: #BFBFFF url(../images/purper.png) no-repeat; background-size: cover; background-position: center;  }
.col-xl-3:nth-child(3) .dash_card_inner  { background: #C5FFCA url(../images/lightgreen.png) no-repeat; background-size: cover; background-position: center;  }
.col-xl-3:nth-child(4) .dash_card_inner  { background: #FFC289 url(../images/orange.png) no-repeat; background-size: cover; background-position: center;  }
.col-xl-3:nth-child(5) .dash_card_inner  { background: #a2c9ea url(../images/lightblue.png) no-repeat; background-size: cover; background-position: center;  }

/* from content css */

.alp_row_block { height: calc(100% - 50px); }

.common_info_block { max-width: 100%; width: 100%; border-radius: 4px 0px 0px 4px; border: 1px solid #EFEFEF; border-right: 0px !important; padding: 20px; height: 100%; background: #fff; }
.common_info_block .c_title { font-size: 14px; font-weight: 700; color: #000; margin-bottom: 15px; position: relative; padding-bottom: 10px; }
.common_info_block .c_title img { width: 16px; height: 16px; object-fit: contain; object-position: center; margin-right: 5px; }
.common_info_block .c_title::before { width: 135px; height: 3px; border-radius: 10px; background: #00838F; position: absolute; content: ""; left: 0; bottom: 0; }

.upload_image_block { display: flex; align-items: center; justify-content: center; width: 100%; padding: 0px 0px 20px; }
.upload_image_block .ci_box {width: 30px; height: 30px; border-radius: 50%; margin: 0px auto 5px; display: block; background: #B1E9ED; padding: 6px; }
.upload_image_block .ci_box img { width: 100%; height: 100%; object-fit: contain; object-position: center; vertical-align: top; }
.upload_image_block .change_image .ci_title,
.upload_image_block .delete_image .ci_title { font-size: 10px; text-align: center; color: #000; }
.upload_image_block .change_image { position: relative; }
.upload_image_block .change_image input { position: absolute; width: 100%; height: 100%; opacity: 0; }

.upload_image_block .user_image { width: 100px; height: 100px; margin: 0px 30px; background: #DDFDFF; display: flex; align-items: center; justify-content: center; border-radius: 4px; cursor: pointer; }
.upload_image_block .user_image img { width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 4px; }
.upload_image_block .user_image .dummy_img { width: 74px; height: 74px; object-fit: contain; object-position: center; }

.common-form-block { max-width: 992px; width: 100%; margin: 0px auto; padding: 10px 0px; display: flex; flex-direction: column; height: 100%; }
.common-form-block .cfb_block { margin-bottom: 20px; }
.common-form-block .cfb_title { border-bottom: 2px solid #5E6A7A; margin-bottom: 10px; padding-bottom: 10px; display: flex; align-items: flex-end; justify-content: space-between; }
.common-form-block .cfb_title h4 { font-size: 11px; font-weight: 700; color: #000; margin-bottom: 0px; text-transform: uppercase; }
.common-form-block .add_btn { background: #B1E9ED; width: 52px; height: 26px; border-radius: 2px; font-size: 10px; font-weight: 700; text-align: center; color: #00838F; padding: 1px; box-shadow: none !important; }

.common-form-block .form-group { display: flex; align-items: flex-start; width: 100%; margin-bottom: 5px;  }
.common-form-block .form-group label.form-label {color: #000;  font-size: 12px; display: block; margin-bottom: 0px; max-width: 190px; width: 100%; padding: 5px 0px; }
.common-form-block .input_field { width: 100%; display: flex; justify-content: flex-end; align-items: center; flex: 1; flex-wrap: wrap; }
.common-form-block .form-control { border: 1px solid #D7D7D7; max-width: 250px; width: 100%; border-radius: 2px; font-size: 12px; color: #000; box-shadow: none !important; padding: 5px 10px; }
.common-form-block .form-control::placeholder { color: #000; }
.common-form-block .add_icon { width: 16px; height: 16px; margin-right: 10px; }
.common-form-block .add_icon a { display: block; }
.common-form-block .add_icon a img { width: 100%; height: 100%; object-fit: contain; object-position: center; vertical-align: top; }
.common-form-block textarea.form-control{ max-width: 756px; width: 100%; }
.common-form-block .form-select { background-image: url(../images/downArrow.svg); background-size: 10px; background-position: right 5px center; }  

.common-form-block .form-control.col_control { max-width: 35px !important; margin-left: 15px; background: #B1E9ED; padding: 5px; }
.common-form-block .quantity-group .form-control { max-width: 200px; }
.common-form-block .input-group { max-width: 250px; width: 100%; margin-left: auto; }
.common-form-block .input-group .form-control { width: 1% !important; }
.common-form-block .input-group-text { background: #D7D7D7; border: 1px solid #D7D7D7; font-size: 10px; color: #000; border-radius: 2px; padding: 5px 10px; } 
.common-form-block .input-group .btn {font-size: 12px; font-weight: 500; color: #FFFFFF; background: #00838F; border-color: #00838F; border-radius: 2px; box-shadow: none !important; padding: 5px 10px; position: absolute; right: 0; /* z-index: 11; */ }
.common-form-block .input_field .colorpick-eyedropper-input-trigger { display: none !important; }

.eye_icon { background: transparent !important; border: 1px solid transparent !important; color: #000 !important; border-left: 0 !important; padding: 2px 10px !important; font-size: 16px !important; }

.common-form-block .input-group .help-block { padding-left: 0px !important; }

.common-form-block .ktitle { font-size: 12px; color: #000; margin-bottom: 0px; padding: 5px 0px;}

.common-form-block .common-btn { font-size: 14px; text-transform: uppercase; border-radius: 4px; }

/* File input selector button - show for better UX */
input[type="file"]::file-selector-button { 
    display: inline-block;
    background: #00838F;
    color: white;
    border: none;
    padding: 5px 10px;
    border-radius: 2px;
    font-size: 12px;
    cursor: pointer;
}

input[type="file"]::file-selector-button:hover {
    background: #006064;
}

.common-form-block .input_field .iti { max-width: 250px; width: 100%;}

.common_info_block .common-form-block { padding: 0; }
.common_info_block .common-form-block .form-control { max-width: 100%; }
.common_info_block .common-form-block .form-group label.form-label { max-width: 125px;}
.common_info_block .common-form-block .cfb_title { margin-bottom: 20px; }
.common_info_block .common-form-block .help-block  { padding-left: 0px !important; }
.common_info_block .common-form-block .ts-wrapper { max-width: 100% !important; }

/* tom select */

.ts-wrapper { max-width: 250px !important; width: 100%; }
.ts-control { border: 1px solid #D7D7D7 !important; border-radius: 2px !important; box-shadow: none !important; padding: 5px 10px !important;  background-image: url(../images/downArrow.svg) !important; background-position: right 5px center !important; background-size: 10px !important; background-repeat: no-repeat !important; }
.ts-control input { font-size: 12px !important; color: #000 !important; }
.ts-control > input { background-image: url(../images/downArrow.svg); background-position: center 3px right; background-size: 10px; } 

/*  */

.back_btn { right: 10px; position: absolute; top: 5px; z-index: 1; }
.back_btn a { width: 26px; height: 26px; border-radius: 50%; display: block;  background: #B1E9ED; padding: 5px; }
.back_btn a img { width: 100%; height: 100%; object-fit: contain; object-position: center; vertical-align: top; }

/*  */

.items_images_block ul.images_ul { list-style: none !important; margin: 0px; padding: 0px; display: flex; flex-wrap: wrap;  }
.items_images_block ul.images_ul li { border: 1px solid #D7D7D7; width: 100%; height: 92px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; margin-right:5px; border-radius: 4px; background: #eee; }
.items_images_block ul.images_ul li img { width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 4px; }
.items_images_block ul.images_ul li img.default_img { width: 42px; height: 42px; object-fit: contain; object-position: center; border-radius: 0px; }

/* email templete */

.temptele_body { width: 100%; }
.cke_chrome { border: 1px solid #D7D7D7 !important; box-shadow: none !important; border-radius: 2px; }
.cke_bottom { display: none !important; }
.ts-dropdown, .ts-control, .ts-control input { font-size: 12px;}

/*  */
.filter-dropdown { background: #00838F;  border: 1px solid #00838F; padding: 10px; min-width: 230px !important; max-width: 230px !important; border-radius: 0px !important;}
.filter-dropdown .form-control { border: none !important; border-radius: 0 !important; border-bottom: 1px solid #fff !important; padding: 10px 0px !important; background: transparent !important; font-size: 12px; color: #fff; }
.multiselect_block {  max-height: 230px; overflow-y: auto; padding-right: 0px; max-width: 230px !important;}

.option-list .option-list { padding: 12px 10px 0px; }
.option-list .option-list:last-child { padding-bottom: 10px; }
.option-list .checkbox { padding-left: 20px; font-size: 12px; line-height: 18px; font-weight: 600; color: #fff !important; }
.option-list .checkmark::after { left: 3px;  top: 0px;  width: 5px;  height: 8px; border: solid #fff; border-width: 0 2px 2px 0; }
.option-list .checkmark { border: 1px solid #fff; height: 14px; width: 14px !important; }

.form-check-input:checked { background-color: #00838F; border-color: #00838F;  }

/* date picker */

.flatpickr-months, .flatpickr-weekdays { background-color: #00838F !important;}

/* page loader */

/* Load Settings */
.no-scroll-y {overflow: hidden;}
#preloader-section{	box-sizing: border-box;	margin: 0;	padding: 0;}

/* Preloader */
.ctn-preloader { -webkit-box-align: center;
	        align-items: center;
            background: #edf3ff;
  /* Show or Hide cursor when hover of Preloader*/
  cursor: none;

	display: -webkit-box;
	display: flex;
  height: 100%;
  -webkit-box-pack: center;
          justify-content: center;
	position: fixed;
	left: 0;
  top: 0;
	width: 100%;
  z-index: 9999;
}

.ctn-preloader .animation-preloader {
	position: absolute;
  z-index: 100;
}

/* Spinner loading */
.ctn-preloader .animation-preloader .spinner {
  -webkit-animation: spinner 1s infinite linear;
          animation: spinner 1s infinite linear;
	border-radius: 50%;
  border: 3px solid rgba(0, 0, 0, 0.2);
  border-top-color: #00838F; /* It is not identified in alphabetical order so that it does not overwrite it */
  height: 9em;
  margin: 0 auto 30px auto;
  width: 9em;
  display: flex; align-items: center; justify-content: center;
}

.ctn-preloader .animation-preloader .spinner img { -webkit-animation: imgspinner 1s infinite linear;
  animation: imgspinner 1s infinite linear; }

/* Loader section Settings */
.ctn-preloader .loader-section {
  background-color: #ffffff;
  height: 100%;
	position: fixed;
  top: 0;
  width: calc(50% + 1px);
}

.ctn-preloader .loader-section.section-left {
  left: 0;
}

.ctn-preloader .loader-section.section-right {
  right: 0;
}

/* Fade effect in loading animation */
.loaded .animation-preloader {
  opacity: 0;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}

/* Curtain effect */
.loaded .loader-section.section-left {
  -webkit-transform: translateX(-101%);
          transform: translateX(-101%);
  -webkit-transition: 3.5s 0.1s all cubic-bezier(0.1, 0.1, 0.1, 2.000);
  transition: 3.5s 0.1s all cubic-bezier(0.1, 0.1, 0.1, 2.000);
}

.loaded .loader-section.section-right {
  -webkit-transform: translateX(101%);
          transform: translateX(101%);
  -webkit-transition: 3.5s 0.1s all cubic-bezier(0.1, 0.1, 0.1, 2.000);
  transition: 3.5s 0.1s all cubic-bezier(0.1, 0.1, 0.1, 2.000);
}

/* Preloader Animation */
@-webkit-keyframes spinner {
	to {
		-webkit-transform: rotateZ(360deg);
		        transform: rotateZ(360deg);
	}
}
@keyframes spinner {
	to {
		-webkit-transform: rotateZ(360deg);
		        transform: rotateZ(360deg);
	}
}

@-webkit-keyframes imgspinner {
	to {
		-webkit-transform: rotateZ(-360deg);
		        transform: rotateZ(-360deg);
	}
}
@keyframes imgspinner {
	to {
		-webkit-transform: rotateZ(-360deg);
		        transform: rotateZ(-360deg);
	}
}



/* Backward laptop size (laptop, tablet, cell phone) */
@media screen and (max-width: 767px) {
	/* Preloader */
	/* Spinner Loading */
	.ctn-preloader .animation-preloader .spinner {
		height: 8em;
		width: 8em;
	}

	/* Text Loading */
	.ctn-preloader .animation-preloader .txt-loading {
	  font: bold 3.5em 'Montserrat', sans-serif;
	}
}

@media screen and (max-width: 500px) {
	/* Prelaoder */
	/* Spinner Loading */
	.ctn-preloader .animation-preloader .spinner {
		height: 7em;
		width: 7em;
	}

	/* Text Loading */
	.ctn-preloader .animation-preloader .txt-loading {
	  font: bold 2em 'Montserrat', sans-serif;
	}

}

.input-group .btn { z-index: unset !important;}
.input-group > .form-control:focus, .input-group > .form-select:focus {z-index: unset !important;}

/* 404 page */

.error_page {display: flex;align-items: center; justify-content: space-between; min-height: 100vh; background: #fff url(../images/authbg.jpg) repeat; background-position: center; background-size: 100%; padding: 15px;}
.error_page .error-page-content {box-shadow: 0px 4px 19px 0px #E0E0E0; background: #FFFFFF; max-width: 1028px; width: 100%; min-height: unset; border-radius: 20px; display: flex;}
.error_left_content { width: 100%; padding: 55px; }
.error_left_content .error_title { text-align: center; font-size: 120px; color: #000; margin-bottom: 25px; text-transform: unset; }
.error_left_content .error_title span { color: #00838F; }
.error_left_content .error_text { text-align: center; color: #000; font-size: 30px; text-transform: uppercase; }

.error_right_content { max-width: 338px; width: 100%; border-radius: 0px 20px 20px 0px; background: linear-gradient(180deg, #00838F 0%, #01C0D1 48.52%, #00838F 100%); padding: 40px; display: flex; align-items: center; justify-content: center; }
.error_right_content img { width: 80%; height: 80%; object-fit: contain; object-position: center; }






.form-control::-ms-reveal {
  display: none !important;
}


/*  */

@media (min-width: 1700px){


}

@media (max-width: 1199px) {

    .auth-form-content .page_title {font-size: 26px; line-height: 30px; margin-bottom: 15px;}
    .auth-form-content .form-control { padding: 12px 12px;}
    .auth-form-content .form-group { margin-bottom: 25px;}
    .auth-form-content .form-label { margin-bottom: 5px;}
    .auth-form-content .go_other_page { font-size: 12px; margin-bottom: 25px;}
    .common_btn { padding: 10px; font-size: 16px;}
    .auth_right_content .auth-logo .logo-txt { font-size: 42px;}
    .auth_right_content .arc_block h1 { font-size: 28px; margin-bottom: 15px;}
    .auth_right_content { padding-top: 20px;}
    .auth_right_content .arc_block p { font-size: 14px;  line-height: 21px;}
    .forgot-page .go_other_page { margin-top: 25px;}


    .error_left_content .error_title { font-size: 94px; margin-bottom: 20px; }
    .error_left_content .error_text {font-size: 26px; }

     /* side nav bar */

     .vertical-menu { width: 280px !important; display: none; }
     .vertical-menu #sidebar-menu > ul > li > a span {  display: inline !important; padding-left: 15px !important;}
     body.sidebar-enable .vertical-menu {  display: block;}
     body[data-sidebar-size="sm"] .vertical-menu { width: 280px !important; }
     body:not([data-sidebar-size="sm"]) #vertical-menu-btn { margin-left: 0; margin-right: 0px;}
     .KPI_block { margin-left: 0px;}
     body[data-sidebar-size="sm"] .navbar-brand-box { width: auto !important;}
     .main-content { margin-left: 0 !important;}

     /*  */
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li > a { padding: 10px; display: flex; align-items: center; }
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li:hover > a { width: 100% !important; color: #fff !important; background: #00838F; }
     body[data-sidebar-size="sm"] .vertical-menu:hover #sidebar-menu ul li:hover a img { display: none; }
     body[data-sidebar-size="sm"] .vertical-menu:hover #sidebar-menu ul li:hover a img + img { display: inline-block; }
     .vertical-menu:hover #sidebar-menu > ul > li > a span {  margin-left: 0px; }
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li:hover > ul { height: auto !important; left: 0px !important; position: relative !important; width: 100% !important; box-shadow: none !important; padding: 0 !important;}
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li:hover > ul a { color: #333; padding: 6px 10px 6px 40px !important;  width: 100% !important;}
     .metismenu .mm-collapse.mm-show { display: block !important;  }
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul ul { padding: 0px !important; }
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li > a::after { display: block !important; margin-left: auto; transition: transform .2s; transition: transform .2s,-webkit-transform .2s; }
     body[data-sidebar-size="sm"] #sidebar-menu .mm-active > .has-arrow::after { -webkit-transform: rotate(90deg); transform: rotate(90deg);}
     body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu > ul > li > a:active { color: #00838F !important;  }



}


@media (max-width: 991px) {

    .auth-form-content { padding: 25px;}
    .container, .container-sm { max-width: 100% !important; }

    .logo span.logo-lg { display: inline-block !important;}
    #vertical-menu-btn { margin-right: 0px; padding: 0px !important; }
    .navbar-header { height: 51px;  padding-right: 10px;}


    .error_left_content {padding: 35px;}
    .error_right_content { max-width: 280px;}



}

@media (max-width: 767px) {

    .auth_right_content .auth-logo .logo-txt { font-size: 36px;}
    .auth_right_content .arc_block h1 {font-size: 24px; margin-bottom: 12px;}
    .auth-form-content .page_title { font-size: 22px; line-height: 27px; margin-bottom: 15px;}
    .common_top_right .ctr_blocks button { margin-top: 10px; }
    .common_top_right .ctr_blocks button.icon-btn { margin-top: 0px; margin-bottom: 10px; }
    .common_top_right .ctr_blocks .common-btn { margin-bottom: 10px; }



}

@media (max-width: 700px) {

}

@media (max-width: 600px) {



}

@media (max-width: 500px) {

    .auth-full-page-content {display: block; }
    .auth_right_content { max-width: 100%; border-radius: 0px 0px 20px 20px; }

    .error_page .error-page-content { flex-wrap: wrap; }
    .error_right_content { max-width: 100%; order: 1; border-radius: 20px 20px 0px 0px;}
    .error_left_content { order: 2;}
    .error_left_content .error_title {font-size: 82px; margin-bottom: 15px;}
    .error_left_content .error_text { font-size: 20px;}






}