:root .text-primary,
:root a.text-primary {
  color: #7367f0 !important;
}

:root .bg-primary {
  background-color: #7367f0 !important;
}

:root .border-primary {
  border-color: #7367f0 !important;
}

:root .btn-primary,
:root a.btn-primary {
  background-color: #7367f0 !important;
  border-color: #7367f0 !important;
  color: #fff !important;
}

:root .btn-gradient-primary,
:root a.btn-gradient-primary {
  background-image: linear-gradient(45deg, #7367f0, #7367f0) !important;
  border: none !important;
  color: #fff !important;
}

:root .btn-outline-primary,
:root .btn-flat-primary,
:root a.btn-outline-primary {
  color: #7367f0 !important;
  border-color: #7367f0 !important;
  background-color: transparent !important;
}

:root .btn-outline-primary:hover,
:root .btn-outline-primary:focus,
:root .btn-outline-primary:active,
:root a.btn-outline-primary:hover,
:root a.btn-outline-primary:focus,
:root a.btn-outline-primary:active {
  background-color: #7367f0 !important;
  color: #fff !important;
  border-color: #7367f0 !important;
}

:root .btn-primary:hover,
:root .btn-primary:focus,
:root .btn-primary:active,
:root a.btn-primary:hover,
:root a.btn-primary:focus,
:root a.btn-primary:active {
  background-color: #7367f0 !important;
  border-color: #7367f0 !important;
  color: #fff !important;
}

:root .btn-gradient-primary:hover,
:root .btn-gradient-primary:focus,
:root .btn-gradient-primary:active,
:root a.btn-gradient-primary:hover,
:root a.btn-gradient-primary:focus,
:root a.btn-gradient-primary:active {
  background-image: linear-gradient(45deg, #7367f0, #7367f0) !important;
  color: #fff !important;
}

:root .alert-primary {
  background-color: #7367f0 !important;
  border-color: #7367f0 !important;
  color: #fff !important;
}

:root .badge-primary {
  background-color: #7367f0 !important;
  color: #fff !important;
}

:root .list-group-item-primary {
  background-color: #7367f0 !important;
  color: #fff !important;
}

:root .text-bg-primary {
  background-color: #7367f0 !important;
  color: #fff !important;
}

/* :root a {
  color: #7367f0 !important;
} */

:root .front-footer .footer-brev .section-2 h4 a {
  color: #7367f0 !important;
  text-decoration: underline;
}

html[dir] .btn-primary,
:root [dir] .btn-primary {
    border-color: #7367f0 !important;
    background-color: #7367f0 !important;
    color: #fff !important;
}

:root .offer-percent {
  color: #7367f0 !important;
}

:root .feature-highlight-card .item .text {
  color: #7367f0 !important;
}

html[dir] .btn-outline-primary,
:root [dir] .btn-outline-primary {
  border: 1px solid #7367f0 !important;
}

html[dir] .products-navbar .promotion-bar ,
:root [dir] .products-navbar .promotion-bar  {
  background-color: #7367f0 !important;
}

:root .products-navbar svg {
  color: #7367f0 !important;
}

:root .feature-highlight-card .item svg {
  color: #7367f0 !important;
}

:root .product-detail-section .swiper-button-prev.swiper-button-white ,
:root .swiper-button-next
{
  --swiper-navigation-color: #7367f0 !important;
}

html[dir] .vue-slider-process,
:root [dir] .vue-slider-process {
  background-color: #7367f0 !important;
}

html[dir]  .vue-slider-dot-handle ,
:root [dir]  .vue-slider-dot-handle  {
  border: 2px solid #7367f0 !important;
}

html[dir]  .custom-control-input:checked ~ .custom-control-label::before,
:root [dir]  .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #7367f0 !important;
  background-color: #7367f0 !important;
  box-shadow: 0 2px 4px 0 rgba(#7367f0, 0.4) !important;
}

html[dir=ltr] .nav-tabs .nav-link:before ,
:root [dir] .nav-tabs .nav-link:before  {
  background: linear-gradient(30deg, #7367f0, rgba(#7367f0, 0.5)) !important;
}


html[dir] .page-item.active .page-link ,
:root [dir] .page-item.active .page-link  {
  background-color: #7367f0 !important;
}


:root .filter-footer .keep-on-top .sort-filter-icon svg{
  color: #7367f0 !important;
}

:root .filter-footer .keep-on-top .sort-filter-icon span {
  color: #7367f0 !important;
}

:root .sidebar-section .sidebar-content .close-icon svg {
  color: #7367f0 !important;
}

html[dir] .page-item.next-item .page-link svg:hover,
:root [dir] .page-item.next-item .page-link svg:hover {
  background-color: #7367f0 !important;
}

:root .home-footer .keep-on-top .icon-container .icon-item .icon-item-link svg.home-footer-icons {
  color: #7367f0 !important;
}

[dir=ltr] .main-menu.menu-light .navigation > li ul .active {
  background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7)) !important;
  color: #FFFFFF !important;
}

[dir] .main-menu.menu-light .navigation > li ul .active {
  -webkit-box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7) !important;
  box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7) !important;
  border-radius: 4px !important;
  color: #FFFFFF !important;
}

a {
  color: #7367f0 !important;
}

.main-menu.menu-light .navigation li a {
  color: #625f6e !important;
}

[dir=ltr] .card-congratulations {
  background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7)) !important;
}

[dir] .main-menu.menu-light .navigation > li .active > a {
  color: #FFFFFF !important;
}

.b-avatar.badge-light-primary {
  color: #7367f0 !important;
}

.btn-primary:hover{
  box-shadow: 0 8 25px -8px rgba(115, 103, 240, 0.7) !important;
}

[dir=ltr] .main-menu.menu-light .navigation > li.active > a {
  background: linear-gradient(118deg, #7367f0, rgba(115, 103, 240, 0.7)) !important;
  box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7) !important;
  color: #FFFFFF !important;
}

.b-avatar.badge-light-primary {
  color: #7367f0 !important;
}

[dir] .b-avatar.badge-light-primary {
  background-color: rgba(115, 103, 240, 0.12) !important; /* Light purple */
}

[dir] .btn-outline-primary.dropdown-toggle::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237367f0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
}

.badge.badge-light-primary {
  color: #7367f0 !important;
}

html body .badge.badge-light-primary {
  color: #7367f0 !important;
}

[dir] .badge.badge-light-primary {
  background-color: rgba(115, 103, 240, 0.12) !important;
}

.btn-link {
  color: #7367f0 !important;
}

.page-item .page-link:hover {
  color: #7367f0 !important;
}

.nav-pills .nav-link.active, [dir] .nav-pills .show > .nav-link {
  background-color: #7367f0 !important;
  color: #FFFFFF !important;
  box-shadow: 0 0 10px 1px rgba(115, 103, 240, 0.7) !important;
  border-color: #7367f0 !important;
}

.btn-primary:hover:not(.disabled):not(:disabled) {
  background-color: #7367f0 !important;
  -webkit-box-shadow: 0 8px 25px -8px #7367f0 !important;
  box-shadow: 0 8px 25px -8px #7367f0 !important;
}
.btn-primary:active {
  background-color: #7367f0 !important;
  -webkit-box-shadow: 0 8px 25px -8px #7367f0 !important;
  box-shadow: 0 8px 25px -8px #7367f0 !important;
}
.btn-primary.active {
  background-color: #7367f0 !important;
  -webkit-box-shadow: 0 8px 25px -8px #7367f0 !important;
  box-shadow: 0 8px 25px -8px #7367f0 !important;
}

html body [dir] .btn-primary:focus,
[dir] .btn-primary:active,
[dir] .btn-primary.active {
  background-color: #7367f0 !important; /* your custom color */
  box-shadow: 0 8px 25px -8px #7367f0 !important;
  color: #fff !important;
}

[dir] .btn-primary:focus, [dir] .btn-primary:active, [dir] .btn-primary.active {
  background-color: #7367f0 !important;
}


[dir] .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
  border-color: #7367f0 !important;
}

[dir] .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
  background-color: #7367f0 !important;
  border-color: #7367f0 !important;
}


:root [dir] .btn-primary:focus {
  background-color: #7367f0 !important;
}

html body html body [dir] .btn-primary:focus,
html body html body [dir] .btn-primary:active,
html body html body [dir] .btn-primary.active {
  background-color: #7367f0 !important;
}


html body [dir='ltr'] .btn-primary:focus,
html body [dir='ltr'] .btn-primary:active,
html body [dir='ltr'] .btn-primary.active {
  background-color: #7367f0 !important;
  box-shadow: 0 8px 25px -8px #7367f0 !important;
  color: #fff !important;
}