/*
--bs-blue:#0d6efd;
--bs-indigo:#6610f2;
--bs-purple:#6f42c1;
--bs-pink:#d63384;
--bs-red:#dc3545;
--bs-orange:#fd7e14;
--bs-yellow:#ffc107;
--bs-green:#198754;
--bs-teal:#20c997;
--bs-cyan:#0dcaf0;
--bs-black:#000;
--bs-white:#fff;
--bs-gray:#6c757d;
--bs-gray-dark:#343a40;
--bs-gray-100:#f8f9fa;
--bs-gray-200:#e9ecef;
--bs-gray-300:#dee2e6;
--bs-gray-400:#ced4da;
--bs-gray-500:#adb5bd;
--bs-gray-600:#6c757d;
--bs-gray-700:#495057;
--bs-gray-800:#343a40;
--bs-gray-900:#212529;
--bs-primary:#0d6efd;
--bs-secondary:#6c757d;
--bs-success:#198754;
--bs-info:#0dcaf0;
--bs-warning:#ffc107;
--bs-danger:#dc3545;
--bs-light:#f8f9fa;
--bs-dark:#212529;
--bs-primary-rgb:13,110,253;
--bs-secondary-rgb:108,117,125;
--bs-success-rgb:25,135,84;
 */

:root{
    --bs-danger1:#c63909;
    --bs-danger2:#ff7777;
    --bs-gold:#b69428;
}

.text-danger1 {
    --bs-text-opacity: 1;
    color: var(--bs-danger1) !important;
}

.text-danger2 {
    --bs-text-opacity: 1;
    color: var(--bs-danger2) !important;
}

.text-pink {
    --bs-text-opacity: 1;
    color: var(--bs-pink) !important;
}

.text-purple {
    --bs-text-opacity: 1;
    color: var(--bs-purple) !important;
}

.text-cyan {
    --bs-text-opacity: 1;
    color: var(--bs-cyan) !important;
}

body{
    font-size: 14px;
}
:root {
    --primary-color: #3388dd;
    --success-color: #34c38f;
    --pending-color: #f1b44c;
    --cancel-color: #ff4444;
    --error-color: #ff4444;
    --second-color: #dfca7b;
    --warning-color: #dfca7b;
    --dark-color: #2f6796;
    --accent-color: #56a2ef;
    --sidebar-color: #eaeaea;
    --primary-primary-rgb: 0,75,151;
    --second-color-rgb: 0,75,151;
    --accent-rgb: rgba(51,136,221,.25);
}
hr{
    border-top: 1px solid #eeeeee;
}
.hidden{
    display: none !important;
}
.invisible{
    visibility: hidden !important;
}
.logo .logo-lg img{
   /* width: 90%;
    height: auto;*/
    width: 67%;
}
.navbar-brand-box{
    text-align: inherit !important;
}
.logo .logo-sm img{
    height: 43px;
}
.navbar-brand-box{
    padding: 0 16px;
}
.text-primary{
    color: var(--dark-color) !important;
}
.bg-primary.bg-soft{
    background-color: var(--accent-rgb) !important;
}
.bg-success{
    background-color: var(--success-color);
}
.text-success{
    color: var(--success-color);
}
.bg-pending{
    background-color: var(--pending-color);
}
.text-pending{
    color: var(--pending-color);
}
.bg-cancel{
    background-color: var(--cancel-color);
}
.text-cancel{
    color: var(--cancel-color);
}
.btn-primary{
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.btn-primary:hover{
    background-color: var(--accent-color);
    border-color: var(--accent-color);
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    background-color: var(--primary-color);
}
.text-red{
    color: #ff0f0f
}
.ucfirst{
    text-transform: capitalize;
}
/*Wizard CSS */
.wizard .steps .current a, .wizard .steps .current a:active, .wizard .steps .current a:hover{
    background-color: rgba(var( --second-color-rgb),.2);
    color: var(--bs-gray-700);
}
.wizard .steps>ul>li a{
    background-color: rgba(var( --second-color-rgb),.1);
}
.wizard .steps .number{
    border-color: var(--primary-color);
    color: var(--primary-color);
}
.wizard .steps .current a .number, .wizard .steps .current a:active .number, .wizard .steps .current a:hover .number{
    background-color: var(--primary-color);
}
/*End Wizard CSS */
form [data-field-error] input.error, form [data-field-error] textarea.error{
    border:1px solid #ff4444;
}
form .field-error{
    color: #ff4444;
    font-size: 12px;
    padding-top: 5px;
    display: block;
}

/*Sidebar */

body[data-sidebar=dark] #sidebar-menu ul li a:hover{
    background-color: var(--primary-color);
    color: #ffffff !important;
}
body[data-sidebar=dark] #sidebar-menu ul li.active a{
    background-color: var(--primary-color);
    color: #ffffff !important;
}

.vertical-collpsed .menu-selector{
    display: none;
}
.vertical-collpsed .menu-selector.sm{
    display: block;
    padding: 9px 10px;
}

.menu-selector{
    padding: 0 15px 15px 15px;
}
.menu-selector select{
    display: block;
    width: 100%;
    padding: 10px 18px;
    border: none;
    outline: none;
    border-radius: 5px;
}
body[data-sidebar=dark] .vertical-menu .menu-selector select{
    background-color: rgba(255,255,255,.8);
    -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
}
body[data-sidebar=dark] .vertical-menu .menu-selector select:hover{
    background-color: rgba(255,255,255,1);
}

.toast[data-toast-type=success], .toast[data-toast-type=success] .toast-body{
    background-color: var(--success-color);
    color: #ffffff;
}

.toast[data-toast-type=error], .toast[data-toast-type=error] .toast-body{
    background-color: var(--error-color);
    color: #ffffff;
}

.toast[data-toast-type=warning], .toast[data-toast-type=warning] .toast-body{
    background-color: var(--warning-color);
    color: #ffffff;
}

/*Dropzone*/
.dropzone {
    min-height: 230px;
    border: 2px dashed var(--bs-border-color);
    background: var(--bs-custom-white);
    border-radius: 6px;
}

.card-footer:last-child{
    background-color: transparent;
}

.product-img{
    height: 200px;
    opacity: 1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.product-img-80{
    height: 80px;
    width: 80px;
}

.dropzone .dz-preview .dz-image img{
    max-height: 100%;
    max-width: 100%;
}

.verti-timeline .event-list{
    padding: 0 0 16px 29px;
}

.input-group.auth-pass-inputgroup{
    margin-bottom: 30px;
}

.input-group.auth-pass-inputgroup .field-error{
    position: absolute;
    bottom: -24px;
}

a {
    color: #50a5f1;
    text-decoration: none;
}
a:hover {
    color: #3b8ed6;
    text-decoration: none;
}


body[data-sidebar=dark] #sidebar-menu ul li a .lightfunnel{
    width: 23px;
    margin-right: 5px;
    opacity: 0.35;
}

body[data-sidebar=dark] #sidebar-menu ul li a:hover .lightfunnel{
    opacity: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.btn .lightfunnel{
    width: 15px;
}

.btn.btn-gold{
    border-color: var(--bs-gold);
    background: rgb(228,210,128);
    background: linear-gradient(90deg, rgba(228,210,128,1) 0%, rgba(187,152,58,1) 100%);
}

.btn.btn-blue{
    border-color: var(--bs-primary);
    background: rgb(51,136,221);
    background: linear-gradient(90deg, rgba(51,136,221,1) 0%, rgba(52,102,149,1) 100%);
}


/**** SLIDER ****/

.bx-wrapper{
    box-shadow: initial !important;
    border: initial !important;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 30px !important;
}

.profile-user {
    height: 66px;
    width: 66px;
    background-color: var(--bs-gray-300);
    padding: 3px;
}


span[data-name=search]{
    max-width: 360px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    margin: 0 5px 0 5px;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}