@font-face {
  font-family: yekan-bakh;
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/yekan-bakh/Yekan-BakhThin.woff") format("woff");
}
@font-face {
  font-family: yekan-bakh;
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/yekan-bakh/Yekan-BakhRegular.woff") format("woff");
}
@font-face {
  font-family: yekan-bakh;
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/yekan-bakh/Yekan-BakhMedium.woff") format("woff");
}
@font-face {
  font-family: yekan-bakh;
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/yekan-bakh/Yekan-BakhBold.woff") format("woff");
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
  outline: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

html {
  direction: rtl;
  font-family: yekan-bakh, serif;
  font-display: swap;
}

body {
  direction: rtl;
  font-family: yekan-bakh;
  font-display: swap;
}

input,
textarea {
  outline: none;
  border: 0;
}
input:focus,
textarea:focus {
  outline: none;
}

textarea {
  resize: none;
}

button {
  border: 0;
  outline: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

a {
  text-decoration: none;
}

ul {
  padding: 0;
  margin: 0;
}

li {
  list-style: none;
}

p {
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

.flex {
  display: flex;
}

.items-start {
  align-items: start;
}

.justify-between {
  justify-content: space-between;
}

.flex-col {
  flex-direction: column;
}

.swal2-container {
  font-family: "yekan-bakh";
}

.main-title {
  @apply text-black text-3xl max-xl:text-2xl max-sm:text-xl font-semibold text-center relative inline mx-auto;
}
.main-title .star {
  @apply hidden absolute -top-5 -start-5 max-sm:w-[18px] max-xs:w-4;
}
.main-title.has-star .star {
  @apply inline;
}
.main-title .blue {
  color: #1c74bd !important;
}

.main-subtitle {
  @apply mt-5 text-base max-md:text-base text-dark-400 w-full mx-auto max-w-[500px] text-center;
}

@layer base {
  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
}
.no-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.noornegar-btn {
  @apply rounded-2xl flex items-center justify-center h-12 w-full text-base font-bold max-md:text-sm outline-none border-0 cursor-pointer transition-all;
}
.noornegar-btn.disabled {
  @apply pointer-events-none opacity-50 cursor-not-allowed;
}

.btn-blue {
  @apply bg-blue-800 text-white hover:text-white hover:bg-blue-800/80;
}

.btn-blue-outline {
  @apply bg-transparent text-blue-800 border border-blue-800 hover:bg-blue-150;
}

.btn-red-outline {
  @apply bg-transparent text-[#DC2655] hover:text-error hover:bg-error/10 border border-[#DC2655];
}

.btn-yellow {
  @apply bg-yellow text-white hover:bg-yellow/80;
}
.btn-yellow.shining {
  @apply shadow-[0_4px_16px_0_#FFAE0066];
}

.btn-white {
  @apply bg-white text-black hover:bg-dark-100;
}

.btn-white-outline {
  @apply border border-white text-white bg-transparent;
}

.btn-white-shining {
  @apply text-black bg-white shadow-[0_10px_24px_0_#FFFFFF3D];
}

.btn-text {
  @apply bg-transparent border-0 transition-[0.2s_all_ease-out] hover:border hover:border-black;
}

.btn-green {
  @apply bg-green-600 text-white;
}
.btn-green:hover {
  @apply bg-green-500;
}

@media screen and (max-width: 1700px) {
  .col-product {
    width: 33%;
  }
}
@media screen and (max-width: 1400px) {
  .group-input label {
    font-size: 20px;
  }
  .group-input input {
    font-size: 40px;
  }
  header .navbar .nav-link {
    font-size: 12px;
    padding: 0 8px !important;
  }
  header .navbar .nav-link img {
    margin-left: 3px;
  }
  .login .login-page-logo {
    width: 200px;
  }
  .login .login-box {
    padding: 50px;
  }
  .login .login-title {
    font-size: 40px;
    margin-bottom: 40px;
  }
  .login .login-btn {
    font-size: 26px;
    height: 70px;
  }
  .login .group-input label {
    margin-bottom: 25px;
  }
  .login .group-input input {
    height: 74px;
    font-size: 30px;
  }
  .login .call-link {
    font-size: 20px;
  }
  .login .back-link {
    font-size: 20px;
    height: 74px;
  }
  .login .successful-title {
    font-size: 40px;
  }
  .login .successful-link {
    font-size: 26px;
  }
  .login .resend {
    font-size: 22px;
  }
  .login .change-number,
  .login .forget-pass {
    font-size: 20px;
  }
  .login .fixed-password {
    font-size: 20px;
  }
  .login .err-text {
    font-size: 20px;
  }
  .content-area .code-input {
    font-size: 24px;
    width: 70px;
    height: 70px;
  }
}
@media screen and (max-width: 991px) {
  .col-product {
    width: 50%;
  }
  .product-header .product-gallery .product-links {
    width: 100%;
    position: unset;
  }
  .product-header .product-gallery .product-links a {
    border-left: 1px solid #F2F4F7;
    border-bottom: 0;
    padding: 5px;
  }
  .product-header .product-gallery .product-links a:last-child {
    border-bottom: transparent;
    border-left: transparent;
  }
  .similar-products {
    padding: 30px 0;
  }
  .products-page .title-box {
    border-radius: 0;
    overflow-x: auto;
    background: transparent !important;
    padding: 10px 0 !important;
  }
  .products-page .title-box .title-box_text {
    font-size: 14px;
    color: #344054;
    background: #F2F4F7;
    border-radius: 8px;
    padding: 5px 15px;
    margin-left: 10px;
    transition: all 0.2s linear;
  }
  .products-page .title-box .title-box_text:hover {
    background: #1C74BD;
    color: #FFFFFF;
  }
  .products-page .title-box .title-box_line {
    display: none;
  }
  .tabs-wrapper .tabs-wrapper-box {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0 20px !important;
  }
  .tabs-wrapper .tabs {
    border-bottom: none;
    overflow-x: auto;
    margin: 10px 0;
  }
  .tabs-wrapper .tabs a {
    padding: 10px 30px;
    margin-left: 10px;
    background: #F2F4F7;
    border-radius: 8px;
  }
  .tabs-wrapper .tabs a::after {
    content: none;
  }
  .tabs-wrapper .tabs li.active a {
    color: #FFFFFF;
    background: #1C74BD;
  }
  .modal-filter .filter-header {
    background: #FBFBFB;
  }
  .filters .group-checkbox {
    background: #FBFBFB;
    padding-top: 15px;
  }
  .accordion .accordion-item {
    border: 0;
    border-radius: 0;
    background: #FBFBFB;
  }
  .accordion .accordion-item__button {
    padding-right: 18px;
  }
  .accordion .group-checkbox label p {
    font-size: 14px;
  }
  .accordion .group-checkbox_score label span {
    font-size: 20px;
  }
  .accordion .filter-search input {
    background: #FFFFFF;
    border: none;
    font-size: 16px;
  }
  .products .row-bg {
    padding: 40px 0;
    background: #EAECF0;
  }
  .products .row-bg::after {
    content: none;
  }
  .products .product-card-right::before {
    content: none;
  }
  .discount-section {
    position: relative;
  }
  .discount-section .product-card-righ_content {
    z-index: 10;
  }
  .discount-section::before {
    content: "";
    position: absolute;
    background-image: url(../img/bg-left-mobile.png);
    background-repeat: no-repeat;
    background-size: 100px;
    z-index: 10;
    width: 40%;
    height: 100px;
    top: -30px;
    left: 0;
  }
  .discount-section .row-bg {
    background: #FFCC00;
    box-shadow: 0px 0.380251px 0.760502px rgba(16, 24, 40, 0.05);
  }
  .slider-section .owl-nav {
    bottom: 20px;
    left: 20px;
  }
  .slider-section .owl-dots {
    bottom: 20px;
    left: 100px;
    height: 40px;
  }
  .store-details {
    margin-top: 50px;
  }
  .store-details_icon {
    margin-left: 0;
    margin-bottom: 10px;
  }
  .store-details .newsletters {
    background: transparent;
    border-radius: 0;
  }
  .store-details .newsletters_title {
    font-size: 14px;
    text-align: center;
  }
  .store-details .newsletters_text {
    font-size: 12px;
    text-align: center;
  }
  .store-details .newsletters-col {
    width: 100%;
  }
  .store-details .newsletters_form {
    width: 100%;
  }
  .store-details .newsletters_form input {
    font-size: 12px;
  }
  .brand-section .owl-carousel {
    padding: 0 20px;
  }
  .brand-section .owl-carousel .owl-nav button.owl-next {
    left: 0;
  }
  .brand-section .owl-carousel .owl-nav button.owl-prev {
    right: 0;
  }
  .brand-section .owl-carousel .owl-nav button.owl-next,
  .brand-section .owl-carousel .owl-nav button.owl-prev {
    width: 30px;
    height: 30px;
    background: transparent;
    border-radius: 0;
  }
  .panel .wallet-information {
    border: none;
    margin-top: 50px;
  }
  .panel .wallet-information_inner {
    width: 100%;
  }
  .panel .wallet-information img {
    margin-top: -50px;
  }
  .panel .wallet-information .inventory-text {
    font-size: 14px;
  }
  .panel .wallet-information .balance-amount {
    font-size: 12px;
  }
  .panel .wallet-information .balance-amount span {
    font-size: 16px;
  }
  .panel .wallet-information .deposit-withdrawal-amount {
    font-size: 12px;
  }
  .panel .wallet-information .deposit-withdrawal-amount span {
    font-size: 14px;
  }
  .panel .wallet-information .wallet-information_text {
    font-size: 12px;
    color: #2250A9;
    margin-left: 10px;
  }
  .panel .wallet-information .amount-words {
    font-size: 12px;
  }
  .panel .group-checkbox_product {
    width: 100%;
  }
  .panel .group-checkbox_product .pro-name {
    font-size: 12px;
  }
  .panel .group-checkbox_product .pro-name_en {
    font-size: 12px;
  }
  .panel .group-input_returned {
    width: 100%;
  }
  .panel .styled-select {
    width: 100%;
  }
  .panel .address-item {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0 !important;
  }
  .panel .address-item .address-item_inner {
    padding: 15px;
    margin-top: 10px;
    background: #FBFBFB;
    border-radius: 10px;
  }
  .panel .address-item .address-text {
    font-size: 14px;
  }
  .panel .address-item .address-number_text {
    font-size: 14px;
    color: #495058;
  }
  .panel .address-item .receiver-specifications_list li {
    margin-left: 0;
    padding: 5px 0;
  }
  .panel .address-item .receiver-specifications_list p {
    margin-left: 20px;
  }
  .installment-sale-header {
    padding: 20px 0;
  }
}
@media screen and (max-width: 768px) {
  .pagination-wrapper {
    padding: 20px;
    background: transparent !important;
    border: none !important;
    border-top: 1px solid #EAECF0;
    box-shadow: unset;
    justify-content: center;
    display: flex;
  }
  .pagination-wrapper .pagination {
    border: 1px solid #D0D5DD;
    filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.05));
    border-radius: 8px;
    overflow: hidden;
    width: fit-content;
  }
  .pagination-wrapper .text-nav {
    display: none;
  }
  .pagination-wrapper .page-link {
    width: 40px;
    height: 40px;
    border-radius: unset;
    margin: 0;
    border-right: 1px solid #D0D5DD;
  }
  .pagination-wrapper .page-link:last-child {
    border-right: 0;
  }
  .pagination-wrapper .page-link:hover {
    color: #FFFFFF;
    background: #1C74BD;
  }
  .pagination-wrapper .active {
    color: #FFFFFF;
    background: #1C74BD;
  }
  .pagination-wrapper .page-prev {
    margin-left: 0;
    padding: 0;
  }
  .pagination-wrapper .page-next {
    margin-right: 0 !important;
    padding: 0;
  }
  .pagination-wrapper .page-item:last-child .page-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  .pagination-wrapper .page-item:first-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .products-page .banner-products::after {
    padding-bottom: 20%;
  }
}
@media screen and (max-width: 576px) {
  .comment-wrapper .accordion .accordion-content {
    padding: 15px;
  }
  .comment-wrapper .comment-box {
    background: transparent !important;
    border: unset;
    border-radius: 0;
    padding: 0 !important;
  }
  .comment-wrapper .comment-content {
    background: transparent;
    border-radius: 0;
    padding: 0 !important;
  }
  .comment-wrapper .comment-admin {
    margin-bottom: 10px;
  }
  .educational-section .educational-small-img {
    min-width: 140px;
    margin-left: 10px;
  }
  .educational-section .educational-small .educational-title {
    font-size: 10px;
    margin-bottom: 10px;
  }
  .educational-section .educational-small .educational-text {
    font-size: 8px;
    margin-bottom: 10px;
  }
  .educational-section .educational-small .educational-details {
    font-size: 8px;
  }
  .educational-section .educational-small .educational-btn {
    font-size: 10px;
  }
  .educational-section .educational-small .educational-price {
    font-size: 10px;
  }
  .products .product-card-right_title {
    font-size: 12px;
  }
  .products .product-card-right_text {
    font-size: 8px;
  }
  .products .product-card-right_btn {
    font-size: 10px;
  }
}
@media screen and (max-width: 480px) {
  .breadcrumb-wrapper {
    margin-bottom: 0;
  }
  .product-card {
    border-radius: 10px;
  }
  .product-card .product-name {
    font-size: 12px;
  }
  .product-card .product-name-en {
    font-size: 8px;
  }
  .product-card .original-price {
    font-size: 12px;
  }
  .product-card .current-price {
    font-size: 9px;
  }
  .product-card .add-cart-btn {
    font-size: 8px;
  }
  .product-card .add-cart-btn .icon-bag-2 {
    margin-right: 5px;
    font-size: 10px;
  }
  .product-card .inventory {
    font-size: 8px;
  }
  .product-card .discount-tag {
    font-size: 10px;
  }
  .product-card .used-tag {
    font-size: 12px;
    width: 130px;
    padding: 0;
  }
  .section-blog-title .blog-title-btn {
    display: none;
  }
  .section-blog-title .blog__title {
    font-size: 12px;
  }
  .product-card-second .original-price {
    font-size: 14px;
  }
  .product-card-second .discount-tag {
    font-size: 10px;
    margin-left: 5px;
  }
  .view__mobile {
    display: flex !important;
  }
  .view__mobile .view-mobile-btn {
    font-size: 12px;
    color: #1D2939;
  }
  .view__mobile .view-mobile-btn .icon-arrow-left {
    margin-right: 10px;
  }
  .title-blog-page .title__blog {
    font-size: 14px;
    padding: 20px 0;
    border-bottom: 1px solid #98A2B3;
    position: relative;
    width: 100%;
  }
  .title-blog-page .title__blog::after {
    left: unset;
    right: 0;
    transform: unset;
    height: 5px;
    width: 50px;
  }
  .blog-page {
    margin-top: 0;
  }
  .blog-page .view-all-post {
    font-size: 12px;
  }
  .blog-page .view-all-post .icon-arrow-left {
    font-size: 15px;
  }
  .blog-card {
    flex-direction: row;
    display: flex;
  }
  .blog-card .blog-img {
    min-width: 140px;
    width: 140px;
    margin-left: 10px;
  }
  .blog-card .blog-img::after {
    padding-bottom: 100%;
  }
  .blog-card .blog-title {
    font-size: 10px;
    margin: 10px 0;
  }
  .blog-card .blog-desc {
    font-size: 8px;
  }
  .blog-card .blog-btn {
    font-size: 10px;
    width: 100%;
    justify-content: flex-end;
    display: flex;
  }
  .blog-card .blog-date {
    font-size: 8px;
  }
  .blog-card .blog-date .icon-clock {
    font-size: 10px;
  }
  .group-input label {
    font-size: 16px;
  }
  .group-input input {
    font-size: 24px;
  }
  .product-header .product-sidebar {
    border-radius: 0;
  }
  .product-header .product-sidebar .discount-tag {
    font-size: 12px;
  }
  .product-header .product-sidebar .final-price_text {
    font-size: 16px;
  }
  .product-header .product-sidebar .current-price {
    font-size: 16px;
  }
  .product-header .product-sidebar .current-price span {
    font-size: 21px;
  }
  .product-header .product-sidebar .installment-payment-btn,
  .product-header .product-sidebar .add-cart-btn {
    font-size: 12px;
    padding: 7px 10px;
  }
  .product-header .product-sidebar .add-cart-btn .icon-bag-2 {
    font-size: 18px;
  }
  .product-header .product-name-en {
    font-size: 16px;
  }
  .banner {
    margin: 40px 0;
  }
  .login {
    background: #F2F4F7;
    position: relative;
  }
  .login .login-page-logo {
    width: 160px;
  }
  .login .group-input label {
    margin-bottom: 20px;
  }
  .login .group-input input {
    height: 48px;
  }
  .login .group-input .input-container {
    border-radius: 10px;
  }
  .login .login-box {
    background: transparent;
    border: unset;
    border-radius: unset;
    padding: 0;
    position: unset !important;
  }
  .login .login-title {
    font-size: 24px;
    margin-bottom: 35px;
  }
  .login .login-btn {
    font-size: 18px;
    height: 40px;
    border-radius: 8px;
  }
  .login .call-link {
    font-size: 14px;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
  }
  .login .call-link .icon-call-calling {
    font-size: 20px;
  }
  .login .back-link {
    font-size: 14px;
  }
  .login .successful-title {
    font-size: 14px;
    margin: 20px 0 100px;
  }
  .login .successful-link {
    font-size: 16px;
    margin-top: 32px;
  }
  .login .successful-img {
    width: 117px;
  }
  .login .resend {
    font-size: 14px;
  }
  .login .change-number,
  .login .forget-pass {
    font-size: 14px;
  }
  .login .fixed-password {
    font-size: 16px;
  }
  .login .err-text {
    font-size: 14px;
  }
  .login .err-text .icon-danger {
    font-size: 20px;
  }
  .content-area .code-input {
    font-size: 20px;
    width: 48px;
    height: 48px;
  }
  .price-list .group-input {
    width: 100%;
  }
  .price-list .price-list-title {
    font-size: 16px;
  }
  .price-list .styled-select,
  .price-list .search-list {
    width: 100%;
  }
  .price-list .list-price-resp_name {
    font-size: 12px;
  }
  .price-list .list-price-resp .title-row {
    font-size: 12px;
  }
  .price-list .list-price-resp .price-row {
    font-size: 10px;
  }
  .price-list .list-price-resp .price-row span {
    font-size: 12px;
  }
  .price-list .list-price-resp .id-product {
    font-size: 14px;
  }
  .price-list .list-price-resp .available {
    font-size: 12px;
  }
  .price-list .list-price-resp .unavailable {
    font-size: 12px;
  }
  .post-content .post-title {
    font-size: 14px;
  }
  .post-content .post-details .post__details {
    font-size: 10px;
    margin-left: 0;
  }
  .post-content article p {
    font-size: 12px;
  }
  .post-content article h2 {
    font-size: 14px;
  }
  .post-content article h3 {
    font-size: 14px;
  }
  .post-content article h4, .post-content article h5 {
    font-size: 13px;
  }
  .post-content .category-post_title {
    font-size: 14px;
  }
  .post-content .category-post_link {
    font-size: 12px;
  }
  .post-content .section-blog-title {
    font-size: 12px;
  }
  .tabs-wrapper .tabs a {
    font-size: 14px;
  }
  .tabs-wrapper .btnContainer .btn-more {
    font-size: 10px;
    color: #650065;
    background: transparent;
    border-radius: 0;
    padding: 0;
  }
  .accordion .group-checkbox label p {
    font-size: 14px;
  }
  .accordion .group-checkbox_score label span {
    font-size: 20px;
  }
  .range-wrapper .slider {
    height: 4px;
  }
  .slider-section {
    padding-bottom: 50px;
  }
  .slider-section .owl-nav {
    display: none;
  }
  .slider-section .owl-dots {
    bottom: -40px !important;
    left: 50% !important;
    transform: translateX(-50%);
    bottom: 20px;
    left: 100px;
    height: 40px;
  }
  .slider-section .owl-dots .owl-dot {
    width: 14px;
    height: 4px;
    background: #667085;
    opacity: 0.2;
  }
  .slider-section .owl-dots .active {
    width: 30px;
    background: #667085;
    opacity: 1;
  }
  .products {
    overflow: hidden;
    margin-top: 0;
    padding-top: 30px;
  }
  .products .container {
    padding: 0;
  }
  .products .row-products {
    padding: 30px 20px;
  }
  .products .view-all {
    font-size: 14px;
  }
  .second-model-products {
    overflow: hidden;
  }
  .second-model-products .container {
    padding: 0;
  }
  .second-model-products .view-all {
    font-size: 14px;
  }
  .second-model-products .used-products-wrapper,
  .second-model-products .new-products-wrapper {
    background: transparent;
    border-radius: 0;
  }
  .second-model-products.used-products {
    background: #71739E;
  }
  .second-model-products.new-products {
    background: #EAECF0;
  }
  .second-products-title .second-products__title {
    font-size: 14px;
  }
  .store-details .newsletters_form {
    margin-top: 20px;
  }
  .store-details .store-details_text {
    display: block;
    margin-top: 5px;
  }
  .store-details .store-details_title,
  .store-details .store-details_text {
    text-align: center;
  }
  .blog-section {
    margin-top: 50px;
  }
  .blog-boxes_carousel {
    overflow: hidden;
    padding-bottom: 30px;
  }
  .blog-boxes_carousel .container {
    padding: 0;
  }
  .blog-boxes_carousel .blog-box-img_big {
    border-radius: 0;
  }
  .blog-boxes_carousel .blog-box-img_big::before {
    border-radius: 0;
  }
  .blog-boxes_carousel .blog-box-content {
    width: 100%;
  }
  .blog-boxes_carousel .blog-box-content p {
    font-size: 8px;
    margin-bottom: 10px;
  }
  .blog-boxes_carousel .blog-box-content .blog-box-link {
    font-size: 12px;
  }
  .blog-boxes_carousel .blog-box-content .blog-box-link .icon-arrow-left {
    font-size: 12px;
  }
  .group-radio-time {
    margin-left: 20px;
  }
  .group-radio-time label {
    background: #FFFFFF;
    border: 1px solid #F5F8FA;
    width: 100%;
    text-align: center;
  }
  .group-radio-time input:checked ~ label {
    background: #34C759;
    color: #FFFFFF;
  }
  .group-radio-time.desable label {
    color: #E1E5EB;
  }
  .cart-page .message-successful {
    margin: 30px 0;
  }
  .cart-page .message-successful img {
    margin-left: 0;
    margin-bottom: 20px;
  }
  .cart-page .message-successful p {
    font-size: 16px;
    text-align: center;
  }
  .cart-page .message-successful span {
    font-size: 14px;
    text-align: center;
  }
  .cart-page .message-successful .close_icon {
    margin-left: 0;
    margin-bottom: 20px;
  }
  .cart-page .receiver-information_box {
    background: #FBFBFB;
  }
  .cart-page .successful-box {
    background: #FFFFFF;
    border: 0;
    padding: 0 !important;
    border-radius: 0;
  }
  .cart-page .successful-box .shipment-information {
    background: #FBFBFB;
  }
  .cart-page .successful-box .shipment-information .total-price {
    font-size: 18px;
  }
  .cart-page .successful-box .successful-box_text {
    font-size: 16px;
  }
  .cart-page .successful-box .successful-box_text span {
    font-weight: 700;
  }
  .cart-page .successful-box .order-code {
    font-size: 16px;
    color: #1C74BD;
    font-weight: 500;
  }
  .cart-page .successful-box .order-code span {
    color: unset;
  }
  .cart-page .successful-box .status {
    font-size: 14px;
  }
  .cart-page .successful-box .order-date {
    font-size: 14px;
    color: #6C757E;
    background: #FBFBFB;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
    width: 100%;
  }
  .cart-page .shopping-progress-bar {
    margin: 30px 0;
  }
  .cart-page .shopping-progress-bar .line-progress {
    height: 2px;
  }
  .cart-page .shopping-progress-bar .active {
    background: transparent;
    border: unset;
    border-radius: 0;
    padding: 0;
  }
  .cart-page .shopping-progress-bar .active .circle-progress {
    margin-left: 0;
  }
  .cart-page .shopping-progress-bar .active p {
    display: none;
  }
  .cart-page .payment-method-item {
    background: #F9FAFB !important;
    border: 0.854166px solid #F2F4F7;
    border-radius: 12px;
  }
  .cart-page .group-input input, .cart-page .group-input textarea {
    background: #F5F8FA;
    border: 1px solid #F5F8FA;
  }
  .cart-page .cart-wrapper {
    background: transparent;
    border: unset;
    border-radius: 0;
    padding: 0;
  }
  .cart-page .cart-wrapper_head {
    border-bottom: unset;
    padding: 15px 0;
    text-align: center;
    justify-content: center !important;
    background: #F9FAFB;
    border: 1px solid #F2F4F7;
    border-radius: 50px;
  }
  .cart-page .cart-wrapper .cart-wrapper_title {
    font-size: 14px;
    font-weight: 500;
  }
  .cart-page .cart-wrapper .cart-wrapper_title .cart-number {
    display: none;
  }
  .cart-page .cart-wrapper .prev-cart-btn,
  .cart-page .cart-wrapper .next-cart-btn {
    padding: 10px 20px;
  }
  .cart-page .cart-wrapper .address-item {
    background: transparent;
    border: unset;
    border-bottom: 1px solid #E1E5EB;
    border-radius: 0;
    margin-bottom: 0 !important;
    padding: 15px 0 !important;
  }
  .cart-page .cart-wrapper .address-item .receiver-specifications li {
    width: 100%;
    padding: 8px 0;
  }
  .repairs-header {
    background: #F9FAFB;
    padding: 30px 0;
  }
  .repairs-header .repairs-title {
    font-size: 18px;
  }
  .repairs-header .repairs-text {
    font-size: 12px;
  }
  .repairs-category {
    padding: 30px 0;
    background: #F9FAFB;
  }
  .repairs-category .repairs-category_title {
    font-size: 13px;
  }
  .repairs-category .repairs-category_text {
    font-size: 11px;
    margin: 5px 0 25px;
  }
  .repairs-category .repairs-category_link {
    font-size: 11px;
  }
  .about-repair {
    padding: 30px 0;
  }
  .about-repair .about-repair_title {
    font-size: 16px;
  }
  .about-repair .about-repair_text {
    font-size: 12px;
  }
  .banner-repair {
    padding: 30px 0;
  }
  .banner-repair .banner-img {
    border-radius: 0;
  }
  .banner-repair .banner-img::after {
    padding-bottom: 25%;
  }
  .faq {
    padding: 30px 0;
  }
  .faq .accordion-content p {
    font-size: 7px;
  }
  .faq .accordion-item__button p {
    font-size: 10px;
  }
  .faq .accordion .accordion-item__button {
    padding-right: 0;
  }
  .panel {
    overflow: hidden;
    background: #FFFFFF;
    padding: 30px 0;
  }
  .panel .file-text {
    font-size: 10px;
  }
  .panel .file-title {
    font-size: 12px;
  }
  .panel .back-dashboard {
    border-radius: 0;
  }
  .panel .back-dashboard span {
    margin-left: 5px;
  }
  .panel .tabs {
    border-radius: 0;
  }
  .panel .panel-box {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
  }
  .panel .panel-box-header {
    border-bottom: 0;
  }
  .panel .panel-box-header .panel__title {
    font-size: 18px;
    padding-bottom: 0;
  }
  .panel .panel-box-header .panel__title .order-code {
    font-size: 18px;
  }
  .panel .panel-box-header .panel__title::after {
    content: none;
  }
  .panel .panel-box-header .panel__title .icon-profile-circle,
  .panel .panel-box-header .panel__title .icon-note,
  .panel .panel-box-header .panel__title .icon-map,
  .panel .panel-box-header .panel__title .icon-bag-2,
  .panel .panel-box-header .panel__title .icon-forward-square,
  .panel .panel-box-header .panel__title .icon-empty-wallet {
    margin-left: 5px;
    padding-left: 5px;
    font-size: 23px;
    border-left: 1px solid #E1E5EB;
  }
  .panel .panel-box-header .edit-info-btn {
    color: #6C757E;
    background: transparent;
    border-radius: 0;
    padding: 0;
    flex-direction: row-reverse;
  }
  .panel .panel-box-header .icon__btn {
    margin-right: 5px;
    width: 40px;
    height: 40px;
    background: #FBFBFB;
    border-radius: 7.29704px;
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
  }
  .panel .panel-box-header .invoice-printing-btn {
    background: transparent;
    border-radius: 0;
    padding: 0;
    color: #6C757E;
    flex-direction: row-reverse;
  }
  .panel .groups-input .group-checkbox {
    margin-left: 0;
    width: 100%;
  }
  .panel .order-details-item p {
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    color: #AFB6BC;
  }
  .panel .order-details-item p span {
    font-size: 14px;
    color: #495058;
    margin-right: 0;
  }
  .panel .order-tracking-btn {
    font-size: 18px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .panel .order-tracking-btn .icon-d-cube-scan {
    display: none;
  }
  .modal-wrapper .modal-dialog {
    margin: 0;
  }
  .modal-wrapper .modal-content {
    border-radius: 0;
  }
  .modal-wallet .submit-panel-btn,
  .modal-wallet .cancel-btn {
    font-size: 18px;
    font-weight: 700;
    color: #FFFFFF;
    width: 248px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-radius: 8px;
    background: #2250A9;
  }
  .modal-wallet .cancel-btn {
    margin-top: 20px;
    border: 1px solid #AFB6BC;
    border-radius: 8px;
    background: transparent;
    color: #AFB6BC;
  }
  .modal-wallet .cancel-btn:hover {
    background: #AFB6BC;
    color: #FFFFFF;
  }
  .modal-wallet .successful-text {
    font-size: 16px;
  }
  .modal-wallet .modal-content {
    padding: 20px;
  }
  .modal-wallet .modal-title {
    font-size: 18px;
    border-bottom: 1px solid #E1E5EB;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 20px;
  }
  .modal-wallet .modal-title::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 110px;
    height: 4px;
    background: #2250A9;
  }
  .modal-wallet .amount-words {
    font-size: 16px;
    text-align: center;
  }
  .modal-wallet .input__amout input {
    font-size: 24px;
  }
  .modal-wallet .input__amout label {
    font-size: 18px;
  }
  .modal-wallet .radio-amount label {
    font-size: 14px;
    padding: 10px;
  }
  .modal-wallet .radio-amount label span {
    font-size: 24px;
  }
  .installment-sale-header .installment-sale-title {
    font-size: 17px;
    margin-bottom: 10px;
  }
  .installment-sale-header .installment-sale-text {
    font-size: 8px;
  }
  .installment-sale-header .installment-sale-danger {
    font-size: 9px;
    padding: 8px 40px;
    margin-bottom: 15px;
  }
  .installment-sale-header .installment-sale-subtitle {
    font-size: 12px;
    margin-bottom: 10px;
  }
  .installment-sale-header img {
    width: 50%;
  }
  .validation {
    padding: 30px 0;
  }
  .validation .validation-box {
    background: transparent !important;
    border: 0;
    border-radius: 0;
    padding: 0 !important;
  }
  .validation .validation-title {
    font-size: 18px;
    padding-bottom: 10px;
    margin-bottom: 35px;
  }
  .validation .validation-title::after {
    width: 120%;
    height: 4px;
  }
  .validation .validation-text {
    font-size: 10px;
    width: 100%;
    background: transparent;
    border: 0;
    border-radius: 0;
    margin-left: 0;
    margin-bottom: 10px;
    padding: 0 !important;
  }
  .validation .buy-btn {
    font-size: 12px;
    width: 100%;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .work-calculator .work-calculator-box {
    background: transparent;
    border-radius: 0;
  }
  .work-calculator .work-calculator_title {
    font-size: 12px;
  }
  .work-calculator .work-calculator_desc {
    font-size: 10px;
    margin-bottom: 15px;
  }
  .work-calculator .work-calculator_danger {
    font-size: 8px;
    background: #FFFFFF;
    margin-bottom: 30px;
    padding: 10px;
  }
  .work-calculator .hints-list li {
    font-size: 15px;
    margin-bottom: 15px;
  }
  .work-calculator .installment-terms-title {
    font-size: 15px;
  }
  .work-calculator .installment-terms-list li {
    font-size: 16px;
    margin-bottom: 15px;
  }
  .work-calculator .group-input input {
    font-size: 12px;
    background: #FFFFFF;
    border: 1px solid #EAECF0;
    border-radius: 6px;
    height: 30px;
  }
  .work-calculator .group-input input:focus {
    border: 1px solid #0183FF;
  }
  .work-calculator .group-input label {
    font-size: 10px;
  }
  .work-calculator .styled-select {
    background: #FFFFFF;
    border: 1px solid #EAECF0;
    border-radius: 6px;
    min-height: 30px;
  }
  .work-calculator .group-radio label {
    font-size: 10px;
  }
  .work-calculator .title-group {
    font-size: 10px;
  }
  .work-calculator .price-title {
    font-size: 9px;
    margin-left: 10px;
  }
  .work-calculator .price {
    font-size: 9px;
  }
  .work-calculator .calculate-btn {
    width: 100%;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .work-calculator .request-tracking-btn {
    width: 49%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .work-calculator .form-completion-btn {
    width: 49%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .modal-product-specification .modal-dialog {
    margin: 0;
  }
}
.app-footer {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-top: 116px;
}
.app-footer .features {
  width: 100%;
  height: 214px;
  background-color: #f6f8fc;
}
@media (max-width: 991.98px) {
  .app-footer .features {
    height: auto;
    padding: 24px 0;
  }
}
.app-footer .features_content {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
@media (max-width: 991.98px) {
  .app-footer .features_content {
    flex-direction: column;
    justify-content: center;
  }
}
@media (max-width: 1199.98px) {
  .app-footer .features_content {
    justify-content: space-between;
  }
}
.app-footer .features_content__title {
  color: #000000;
  font-size: 24px;
  font-weight: bold;
}
@media (max-width: 575.98px) {
  .app-footer .features_content__title {
    font-size: 20px;
  }
}
.app-footer .features_content__img {
  width: 320px;
}
@media (max-width: 1199.98px) {
  .app-footer .features_content__img {
    display: none;
  }
}
@media (max-width: 991.98px) {
  .app-footer .features_content__img {
    display: flex;
    margin-top: 16px;
  }
}
.app-footer .features_content__img img {
  width: 100%;
  object-fit: contain;
}
.app-footer .features_content__features {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  align-items: center;
}
@media (min-width: 768px) {
  .app-footer .features_content__features {
    margin-right: auto;
  }
}
@media (max-width: 991.98px) {
  .app-footer .features_content__features {
    margin-top: 24px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 767.98px) {
  .app-footer .features_content__features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 70%;
  }
}
@media (max-width: 575.98px) {
  .app-footer .features_content__features {
    width: 80%;
  }
}
@media (max-width: 479.98px) {
  .app-footer .features_content__features {
    width: 100%;
  }
}
.app-footer .features_content__features__item {
  grid-column: span 1/span 1;
  width: 124px;
  height: 150px;
  border: 1px solid #e2e2e2;
  transition: all 0.15s ease-in-out;
  background-color: white;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-left: 12px;
  padding-right: 12px;
}
@media (max-width: 767.98px) {
  .app-footer .features_content__features__item {
    width: 100%;
  }
}
.app-footer .features_content__features__item:hover {
  background-color: #f6f8fc;
}
.app-footer .features_content__features__item .title {
  margin-top: 14px;
  color: #344054;
  font-weight: 600;
  font-size: 13px;
}
.app-footer .features_content__features__item .divider {
  width: 100%;
  height: 1px;
  background-color: #D1D4D4;
  margin-top: 4px;
  margin-bottom: 8px;
  position: relative;
}
.app-footer .features_content__features__item .divider:before {
  content: " ";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 8px;
  height: 8px;
  background-color: #D1D4D4;
  border-radius: 9999px;
}
.app-footer .features_content__features__item .detail {
  font-size: 11px;
  color: #475467;
}
.app-footer .footer {
  background-color: #f6f8fc;
  height: 541px;
  width: 100%;
  padding: 0;
  margin-top: 24px;
  position: relative;
}
@media (max-width: 1199.98px) {
  .app-footer .footer {
    height: auto;
    padding-bottom: 24px !important;
  }
}
@media (max-width: 991.98px) {
  .app-footer .footer {
    margin-top: 66px;
  }
}
.app-footer .footer_logo {
  padding-top: 28px;
}
@media (max-width: 991.98px) {
  .app-footer .footer_logo {
    display: none;
  }
}
.app-footer .footer_subscription {
  width: 670px;
  border-radius: 16px;
  border: 1px solid #e2e2e2;
  padding: 16px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  outline: 12px solid white;
}
@media (max-width: 1199.98px) {
  .app-footer .footer_subscription {
    width: 560px;
  }
}
@media (max-width: 767.98px) {
  .app-footer .footer_subscription {
    width: 100%;
    gap: 8px;
  }
}
@media (min-width: 576px) {
  .app-footer .footer_subscription {
    height: 82px;
  }
}
@media (max-width: 575.98px) {
  .app-footer .footer_subscription {
    flex-direction: column;
    align-items: flex-start;
  }
}
.app-footer .footer_subscription .title {
  font-weight: bold;
  font-size: 16px;
  color: #101828;
}
.app-footer .footer_subscription .description {
  font-size: 12px;
  color: #475467;
}
.app-footer .footer_subscription__input {
  height: 50px;
  background-color: white;
  border: 1px solid #e2e2e2;
  position: relative;
  width: 320px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 12px;
  overflow: hidden;
}
@media (max-width: 575.98px) {
  .app-footer .footer_subscription__input {
    width: 100%;
  }
}
.app-footer .footer_subscription__input input {
  height: 100%;
  padding-right: 40px;
  padding-left: 95px;
  border-radius: 12px;
  width: 100%;
  text-align: right;
  direction: ltr;
}
.app-footer .footer_subscription__input .envelop {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline-start: 14px;
}
.app-footer .footer_subscription__input .submit-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline-end: 12px;
  width: 79px;
  height: 26px;
  border-radius: 4px;
  background-color: #1C74BD;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: white;
  font-size: 12px;
}
.app-footer .footer_btn-to-top {
  width: 189px;
  height: 40px;
  gap: 8px;
  color: #F0F1F1;
  font-weight: 500;
  font-size: 14px;
  border-radius: 16px;
  align-items: center;
  margin-top: 32px;
}
@media (max-width: 1199.98px) {
  .app-footer .footer_btn-to-top {
    width: 120px;
    border-radius: 12px;
  }
}
@media (max-width: 991.98px) {
  .app-footer .footer_btn-to-top {
    width: 189px;
    border-radius: 8px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -12px;
    margin: 0;
  }
}
.app-footer .footer_intro-txt {
  color: #292C2D;
  font-size: 16px;
  line-height: 32px;
  text-align: center;
}
@media (max-width: 767.98px) {
  .app-footer .footer_intro-txt {
    font-size: 14px;
  }
}
@media (max-width: 991.98px) {
  .app-footer .footer_intro-txt {
    line-height: 28px;
  }
}
@media (max-width: 575.98px) {
  .app-footer .footer_intro-txt {
    color: #595959;
    line-height: 24px;
    text-align: start;
  }
}
.app-footer .footer_columns {
  margin-top: 48px;
  padding-top: 32px;
  display: flex;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}
@media (max-width: 991.98px) {
  .app-footer .footer_columns {
    margin-top: 24px;
    padding-top: 24px;
    flex-direction: column;
  }
}
@media (max-width: 767.98px) {
  .app-footer .footer_columns {
    padding-top: 0;
  }
}
@media (max-width: 575.98px) {
  .app-footer .footer_columns {
    margin-top: 16px;
  }
}
@media (min-width: 576px) {
  .app-footer .footer_columns {
    border-top: 1px solid #e2e2e2;
    border-style: dashed;
  }
}
.app-footer .footer_columns__links {
  display: flex;
  gap: 16px;
  padding-top: 4px;
}
@media (max-width: 767.98px) {
  .app-footer .footer_columns__links {
    flex-direction: column;
    padding-top: 4px;
  }
}
@media (min-width: 768px) {
  .app-footer .footer_columns__links {
    gap: 16px;
  }
}
.app-footer .footer_columns__links__item {
  display: flex;
  flex-direction: column;
  width: 183px;
  margin-bottom: 8px;
}
@media (max-width: 1399.98px) {
  .app-footer .footer_columns__links__item {
    width: 150px;
  }
  .app-footer .footer_columns__links__item:last-child {
    width: 250px;
  }
}
@media (max-width: 1199.98px) {
  .app-footer .footer_columns__links__item {
    width: 130px;
  }
  .app-footer .footer_columns__links__item:last-child {
    width: 230px;
  }
}
@media (max-width: 991.98px) {
  .app-footer .footer_columns__links__item {
    width: 100%;
  }
  .app-footer .footer_columns__links__item:last-child {
    width: 100%;
  }
}
@media (max-width: 767.98px) {
  .app-footer .footer_columns__links__item {
    margin-bottom: 8px;
  }
}
.app-footer .footer_columns__links__item .common-accordion-item {
  border: 0;
  border-radius: 0;
}
@media (min-width: 768px) {
  .app-footer .footer_columns__links__item .common-accordion-item {
    cursor: default;
  }
}
.app-footer .footer_columns__links__item .common-accordion-item__button {
  padding-inline-start: 0;
  padding-inline-end: 4px;
  margin-bottom: 8px;
  height: auto;
  border-color: #BFBFBF;
}
@media (max-width: 767.98px) {
  .app-footer .footer_columns__links__item .common-accordion-item__button {
    border-bottom: 1px solid #BFBFBF;
    margin-bottom: 0;
    height: 40px;
  }
}
@media (min-width: 768px) {
  .app-footer .footer_columns__links__item .common-accordion-item__button {
    pointer-events: none;
    cursor: default;
  }
}
@media (min-width: 768px) {
  .app-footer .footer_columns__links__item .common-accordion-content {
    display: block;
  }
}
@media (min-width: 768px) {
  .app-footer .footer_columns__links__item .arrow-bottom {
    display: none;
  }
}
.app-footer .footer_columns__links__item .title {
  color: #151617;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 8px;
  font-family: yekan-bakh;
}
.app-footer .footer_columns__links__item .links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
@media (max-width: 767.98px) {
  .app-footer .footer_columns__links__item .links {
    padding-top: 16px;
  }
}
.app-footer .footer_columns__links__item .links a {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #1D2939;
  font-size: 14px;
  font-weight: 400;
  transition: all 0.15s ease-in-out;
}
.app-footer .footer_columns__links__item .links a:last-child {
  margin-bottom: 0;
}
.app-footer .footer_columns__links__item .links a .title {
  font-size: 14px;
  color: #1D2939;
  font-weight: 400;
  margin-bottom: 0;
}
.app-footer .footer_columns__links__item .links a .title:hover {
  color: #1e40af;
}
.app-footer .footer_columns__links__item .links a:hover .title {
  color: #1e40af;
}
.app-footer .footer_columns__links__item .links a svg {
  min-width: 16px;
}
.app-footer .footer_columns__left {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 48px;
  width: 330px;
  margin-inline-start: auto;
  margin-top: 16px;
}
@media (max-width: 991.98px) {
  .app-footer .footer_columns__left {
    gap: 16px;
    margin-inline-end: auto;
    margin-inline-start: 0;
  }
}
.app-footer .footer_columns__left .certificates {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 1199.98px) {
  .app-footer .footer_columns__left .certificates {
    gap: 8px;
  }
}
.app-footer .footer_columns__left .certificates_item {
  height: 102px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  cursor: pointer;
}
@media (max-width: 991.98px) {
  .app-footer .footer_columns__left .certificates_item {
    min-width: 100px;
  }
}
.app-footer .footer_columns__left .social {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.app-footer .footer_columns__left .social_title {
  color: #151617;
  font-size: 16px;
}
@media (max-width: 991.98px) {
  .app-footer .footer_columns__left .social_title {
    text-align: center;
  }
}
.app-footer .footer_columns__left .social_socials {
  display: flex;
  align-items: center;
}
.app-footer .footer_columns__left .social_socials__item {
  padding-left: 16px;
  padding-right: 16px;
  border-inline-end: 1px solid #1C74BD;
  cursor: pointer;
}
.app-footer .footer_columns__left .social_socials__item:first-child {
  padding-inline-start: 0;
}
.app-footer .footer_columns__left .social_socials__item:last-child {
  padding-inline-end: 0;
  border-inline-end: 0;
}
.app-footer .designed-by {
  width: 100%;
  height: 40px;
  background-color: #101828;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 16px;
}
@media (max-width: 575.98px) {
  .app-footer .designed-by {
    font-size: 14px;
  }
}

.footer-container {
  display: flex;
  align-items: start;
  justify-content: space-between;
}
@media (max-width: 991.98px) {
  .footer-container {
    flex-direction: column;
  }
}

.grid-content {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 48px;
}
@media (max-width: 991.98px) {
  .grid-content {
    gap: 8px;
    margin-top: 32px;
  }
}
@media (max-width: 575.98px) {
  .grid-content {
    margin-top: 16px;
  }
}
.grid-content_img {
  grid-column: span 2/span 2;
}
@media (max-width: 991.98px) {
  .grid-content_img {
    grid-column: span 6/span 6;
    order: 1;
    transform: rotate(-27deg);
  }
}
@media (min-width: 992px) {
  .grid-content_img {
    margin-inline-start: auto;
  }
}
@media (max-width: 575.98px) {
  .grid-content_img {
    width: 48px;
  }
}
.grid-content_txt {
  grid-column: span 8/span 8;
}
@media (max-width: 991.98px) {
  .grid-content_txt {
    grid-column: span 12/span 12;
    order: 3;
  }
}
.grid-content_cam {
  transform: rotate(-45deg);
  grid-column: span 2/span 2;
}
@media (max-width: 991.98px) {
  .grid-content_cam {
    transform: rotate(-27deg);
    grid-column: span 6/span 6;
    order: 2;
    margin-inline-start: auto;
  }
}
@media (max-width: 575.98px) {
  .grid-content_cam {
    width: 48px;
  }
}

.header {
  background-color: white;
  position: sticky;
  top: 0;
  z-index: 10;
}
.header-top {
  height: 96px;
  background-color: white;
  border-color: #e2e2e2;
  position: relative;
  z-index: 2;
}
@media (min-width: 992px) {
  .header-top {
    border-bottom: 1px solid #e2e2e2;
  }
}
@media (max-width: 991.98px) {
  .header-top {
    height: max-content;
    padding-top: 16px;
    padding-bottom: 16px;
  }
}
.header-top .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
@media (max-width: 991.98px) {
  .header-top .container {
    flex-wrap: wrap;
  }
}
.header-top_right {
  display: flex;
  align-items: center;
  gap: 16px;
}
@media (max-width: 575.98px) {
  .header-top_right {
    gap: 8px;
  }
}
.header-top_right .hamburger {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  display: none;
  align-items: center;
  justify-content: center;
  background-color: #E5EEFF;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}
@media (max-width: 991.98px) {
  .header-top_right .hamburger {
    display: flex;
  }
}
.header-top_right .hamburger:hover {
  background-color: #c7daff;
}
.header-top_right .img {
  width: 152px;
}
@media (max-width: 991.98px) {
  .header-top_right .img {
    width: 120px;
  }
}
@media (max-width: 575.98px) {
  .header-top_right .img {
    width: 90px;
  }
}
.header-top_right .img img {
  object-fit: cover;
}
.header-top_search {
  margin-inline-end: auto;
  width: 100%;
  max-width: 617px;
  height: 48px;
  border: 1px solid #e2e2e2;
  background-color: white;
  border-radius: 12px;
  padding-inline-end: 16px;
  padding-inline-start: 48px;
  position: relative;
  flex: 1;
}
@media (min-width: 992px) {
  .header-top_search {
    margin-inline-start: 24px;
  }
}
@media (max-width: 1199.98px) {
  .header-top_search {
    max-width: 500px;
  }
}
@media (max-width: 991.98px) {
  .header-top_search {
    max-width: unset;
    order: 3;
    flex-basis: 100%;
    margin-top: 32px;
  }
}
@media (max-width: 767.98px) {
  .header-top_search {
    font-size: 14px;
  }
}
@media (max-width: 575.98px) {
  .header-top_search {
    height: 40px;
    font-size: 12px;
    padding-inline-end: 12px;
    padding-inline-start: 40px;
  }
}
.header-top_search input {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
  outline: none;
  border-radius: 12px;
}
.header-top_search .icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline-start: 16px;
}
@media (max-width: 575.98px) {
  .header-top_search .icon {
    inset-inline-start: 8px;
  }
}
.header-top_search:before {
  content: " ";
  position: absolute;
  top: -16px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #EDEBEB;
}
@media (min-width: 992px) {
  .header-top_search:before {
    display: none;
  }
}
.header-top_left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.header-top_left .auth-btn {
  height: 40px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-left: 14px;
  padding-right: 14px;
  border: 1px solid #e2e2e2;
  border-radius: 8px;
  transition: all 0.15s ease-in-out;
  font-size: 14px;
  color: #3E4344;
  background-color: #ffffff;
}
.header-top_left .auth-btn:hover {
  background-color: #f6f8fc;
}
.header-top_left .cart-btn {
  height: 40px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  transition: all 0.15s ease-in-out;
  position: relative;
}
@media (min-width: 992px) {
  .header-top_left .cart-btn {
    background-color: #E5EEFF;
  }
  .header-top_left .cart-btn:hover {
    background-color: #c7daff;
  }
}
@media (max-width: 991.98px) {
  .header-top_left .cart-btn {
    background-color: white;
    border: 1px solid #e2e2e2;
  }
  .header-top_left .cart-btn:hover {
    background-color: #f6f8fc;
  }
}
@media (max-width: 991.98px) {
  .header-top_left .cart-btn svg path {
    stroke: #3E4344;
  }
}
.header-top_left .cart-btn .count {
  position: absolute;
  top: -8px;
  inset-inline-end: -8px;
  width: 20px;
  height: 20px;
  background-color: #1C74BD;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 12px;
}
.header-bottom {
  height: 64px;
  width: 100%;
  background-color: white;
  position: relative;
  z-index: 1;
  transition: all 0.15s ease-in-out;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
@media (max-width: 991.98px) {
  .header-bottom {
    display: none;
  }
}
.header-bottom.hide {
  transform: translateY(-100%);
  position: absolute;
}
.header-bottom .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
.header-bottom_right {
  flex: 1;
}
.header-bottom_right .menu {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 100%;
}
.header-bottom_right .menu_item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
  color: black;
  font-weight: 600;
  height: 100%;
  position: relative;
  cursor: pointer;
}
@media (max-width: 1199.98px) {
  .header-bottom_right .menu_item {
    font-size: 14px;
  }
}
.header-bottom_right .menu_item:first-child {
  gap: 8px;
}
.header-bottom_right .menu_item:after {
  content: " ";
  width: 0;
  height: 2px;
  background-color: #1C74BD;
  transition: all 0.15s ease-in-out;
  left: 0;
  bottom: 12px;
  position: absolute;
}
.header-bottom_right .menu_item:hover {
  color: #1C74BD;
}
.header-bottom_right .menu_item:hover > svg path {
  fill: #1C74BD;
}
.header-bottom_right .menu_item:hover:after {
  width: 100%;
}
.header-bottom_left {
  display: flex;
  align-items: center;
  gap: 8px;
}
.header-bottom_left .badge {
  padding-left: 13px;
  padding-right: 13px;
  height: 32px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: black;
  font-weight: 500;
  font-size: 14px;
}
@media (max-width: 1199.98px) {
  .header-bottom_left .badge {
    display: none;
  }
}
.header-bottom_left .badge.green {
  background-color: #DDFCD5;
}
.header-bottom_left .badge.red {
  background-color: #FFF0F1;
}
.header-bottom_left .phone {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #676F71;
  font-weight: 600;
  margin-inline-start: 8px;
}
.header-bottom_left .phone span {
  direction: ltr;
}

.cart-preview {
  width: 470px;
  background-color: white;
  border-radius: 16px;
  padding: 24px;
}
@media (max-width: 575.98px) {
  .cart-preview {
    width: 380px;
    padding: 16px;
  }
}
@media (max-width: 479.98px) {
  .cart-preview {
    width: 340px;
  }
}
.cart-preview_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  border-bottom: 1px solid #CDCDCD;
  margin-bottom: 24px;
}
.cart-preview_head__count {
  color: #2b2827;
  font-size: 16px;
}
.cart-preview_head__title {
  color: black;
  font-size: 16px;
  font-weight: bold;
}
.cart-preview_items {
  display: flex;
  flex-direction: column;
  padding-bottom: 24px;
  max-height: 300px;
  overflow-y: auto;
  width: calc(100% + 16px);
  padding-inline-end: 16px;
}
.cart-preview_items__item {
  display: flex;
  gap: 8px;
}
.cart-preview_items__item__img {
  width: 90px;
  min-width: 90px;
  height: 106px;
  background-color: #f6f8fc;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.cart-preview_items__item__img img {
  width: 100%;
  max-width: 75px;
  object-fit: contain;
}
.cart-preview_items__item__details {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.cart-preview_items__item__details > .title {
  font-size: 14px;
  color: black;
  margin-bottom: 8px;
}
.cart-preview_items__item__details .color {
  background-color: #f6f8fc;
  border-radius: 16px;
  padding: 4px;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 16px;
  width: 67px;
}
.cart-preview_items__item__details .color .circle {
  width: 16px;
  height: 16px;
  border: 1px solid #e2e2e2;
  border-radius: 9999px;
}
.cart-preview_items__item__details .color .name {
  color: #5b5353;
  font-size: 12px;
}
.cart-preview_items__item__details .features {
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
}
.cart-preview_items__item__details .features_item {
  border-bottom: 1px solid #e2e2e2;
  padding-top: 16px;
  padding-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.cart-preview_items__item__details .features_item > .title {
  font-size: 14px;
  color: #5b5353;
}
.cart-preview_items__item__details .price {
  font-size: 16px;
  color: black;
  font-weight: 600;
  margin-inline-start: auto;
}
.cart-preview_items::-webkit-scrollbar {
  width: 3px !important;
}
.cart-preview_items::-webkit-scrollbar-track {
  background: transparent;
}
.cart-preview_items::-webkit-scrollbar-thumb {
  width: 3px;
}
.cart-preview_items::-webkit-scrollbar-thumb {
  background: #c0c2c5 !important;
}
.cart-preview_footer {
  padding-top: 12px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #CDCDCD;
}
.cart-preview_footer__price {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cart-preview_footer__price .txt {
  color: black;
  font-size: 16px;
}
.cart-preview_footer__price .price {
  color: #10b981;
  font-weight: bold;
  font-size: 20px;
}
@media (max-width: 575.98px) {
  .cart-preview_footer__price .price {
    font-size: 16px;
  }
}
.cart-preview_footer__btn {
  width: 165px;
  height: 48px;
  border-radius: 8px;
}
@media (max-width: 575.98px) {
  .cart-preview_footer__btn {
    width: 130px;
    height: 40px;
  }
}

.profile-preview {
  display: flex;
  flex-direction: column;
  padding: 24px;
  border-radius: 16px;
  background-color: white;
  width: 258px;
}
.profile-preview_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid #CDCDCD;
  width: 100%;
}
.profile-preview_head__user {
  display: flex;
  align-items: center;
  gap: 8px;
}
.profile-preview_head__user .img {
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  border: 1px solid #1C74BD;
  display: flex;
  align-items: center;
  justify-content: center;
}
.profile-preview_head__user .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
}
.profile-preview_head__user .name {
  color: black;
  font-size: 16px;
}
.profile-preview_list {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.profile-preview_list__item {
  height: 63px;
  border-bottom: 1px solid #CDCDCD;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.15s ease-in-out;
  cursor: pointer;
}
.profile-preview_list__item:last-of-type {
  border-bottom: 0;
}
.profile-preview_list__item .icon {
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  background-color: #f6f8fc;
  display: flex;
  align-items: center;
  justify-content: center;
}
.profile-preview_list__item > .title {
  font-size: 14px;
  color: black;
}

.search-popover {
  padding-left: 16px;
  padding-right: 16px;
  padding-bottom: 16px;
}
.search-popover_input {
  height: 48px;
  width: 100%;
  background-color: white;
  border-radius: 4px;
  border-bottom: 1px solid rgba(30, 64, 175, 0.7);
  padding: 16px;
  padding-top: 4px;
  margin-bottom: 24px;
}
.search-popover_input input {
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.search-popover_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.search-popover_head__count {
  font-size: 14px;
  color: black;
}
.search-popover_head__all {
  color: #1C74BD;
  font-size: 14px;
}
.search-popover_head__all:hover {
  color: rgba(30, 64, 175, 0.7);
}
.search-popover_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  height: auto;
  max-height: 500px;
  overflow-y: auto;
}
@media (max-width: 767.98px) {
  .search-popover_list {
    max-height: 380px;
  }
}
.search-popover_list::-webkit-scrollbar {
  width: 3px !important;
}
.search-popover_list::-webkit-scrollbar-track {
  background: transparent;
}
.search-popover_list::-webkit-scrollbar-thumb {
  width: 3px;
}
.search-popover_list__empty {
  border: 0;
  grid-column: span 2/span 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
.search-popover_list__item {
  grid-column: span 1/span 1;
  border: 1px solid #e2e2e2;
  border-radius: 12px;
  height: 120px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  transition: all 0.15s ease-in-out;
  cursor: pointer;
}
@media (max-width: 575.98px) {
  .search-popover_list__item {
    grid-column: span 2/span 2;
  }
}
.search-popover_list__item:hover {
  border-color: rgba(30, 64, 175, 0.5);
}
.search-popover_list__item .img {
  height: 100%;
  width: 80px;
  margin-top: auto;
  margin-bottom: auto;
  border-radius: 12px;
}
.search-popover_list__item .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.search-popover_list__item .details {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 16px;
}
.search-popover_list__item .details .title {
  font-size: 14px;
  font-weight: 500;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.search-popover_list__item .details .price {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.search-popover_list__item .details .price_right {
  display: flex;
  flex-direction: column;
}
.search-popover_list__item .details .price_right__discounted {
  font-size: 12px;
  color: #5b5353;
  text-decoration: line-through;
}
.search-popover_list__item .details .price_right__original {
  font-size: 16px;
  color: black;
  font-weight: 500;
}
.search-popover_list__item .details .price_left__percent {
  background-color: #ef4444;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 24px;
  color: white;
  font-weight: 500;
  font-size: 14px;
  border-radius: 180px;
}
@media (max-width: 575.98px) {
  .search-popover_list__item .details .price_left__percent {
    width: 40px;
    font-size: 12px;
  }
}
.search-popover_list__item.skeleton .img {
  background-color: #e2e2e2;
}
.search-popover_list__item.skeleton .details {
  height: 100%;
  justify-content: space-between;
}
.search-popover_list__item.skeleton .details .title {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.search-popover_list__item.skeleton .details .title .l1 {
  width: 100%;
  height: 8px;
  background-color: #e2e2e2;
  border-radius: 16px;
}
.search-popover_list__item.skeleton .details .title .l2 {
  width: 100%;
  height: 8px;
  background-color: #e2e2e2;
  border-radius: 16px;
  max-width: 50%;
}
.search-popover_list__item.skeleton .details .price_right {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.search-popover_list__item.skeleton .details .price_right__discounted {
  width: 50px;
  height: 8px;
  background-color: #e2e2e2;
  border-radius: 16px;
}
.search-popover_list__item.skeleton .details .price_right__original {
  width: 80px;
  height: 8px;
  background-color: #e2e2e2;
  border-radius: 16px;
}
.search-popover_list__item.skeleton .details .price_left__percent {
  width: 40px;
  height: 24px;
  background-color: #e2e2e2;
}
@media (max-width: 575.98px) {
  .search-popover_list__item.skeleton .details .price_left__percent {
    width: 40px;
  }
}

.player-container {
  width: 100%;
  position: relative;
  margin-bottom: 20px;
}
.player-container .player {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  display: flex;
}
.player-container .player video {
  width: 100%;
  height: auto;
}
.player-container .controls {
  padding: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70px;
  padding: 0 20px 20px;
  background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
}
.player-container .time {
  margin: 0 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.player-container .time-current {
  color: #FFFFFF;
  font-size: 13px;
}
.player-container .progress-video {
  height: 5px;
  width: 100%;
  background: #DADADA;
  border-radius: 3px;
  transition: height 0.1s ease-in-out;
  overflow: visible;
  cursor: pointer;
  direction: ltr;
}
.player-container .progress-filled {
  background: #FEC84B;
  width: 0;
  height: 7px;
  border-radius: 6px;
  transition: all 0.1s;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.player-container .controls-main {
  height: calc(100% - 10px);
  margin: auto;
  height: 100%;
  display: flex;
  justify-content: space-between;
}
.player-container .controls-left,
.player-container .controls-right {
  flex: 1;
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}
.player-container .controls-left {
  padding-left: 10px;
}
.player-container .player:fullscreen {
  padding-bottom: 90vh;
}
.player-container .player:-webkit-full-screen {
  padding-bottom: 90vh;
}
.player-container .player:-moz-full-screen {
  padding-bottom: 90vh;
}
.player-container .player:-ms-fullscreen {
  padding-bottom: 90vh;
}
.player-container .fullscreen {
  display: flex;
  justify-content: center;
  cursor: pointer;
  font-size: 20px;
  margin-left: 15px;
  color: #FFFFFF;
}
.player-container .fullscreen .icon-maximize-circle .path1:before {
  color: #FFFFFF;
}
.player-container .fullscreen .icon-maximize-circle .path2:before {
  color: #FFFFFF;
}
.player-container .fullscreen .icon-maximize-circle .path3:before {
  color: #FFFFFF;
  opacity: 0.6;
}
.player-container .fullscreen .icon-maximize-circle .path4:before {
  color: #FFFFFF;
  opacity: 0.6;
}
.player-container .volume {
  display: flex;
  align-items: center;
}
.player-container .volume-btn {
  margin-right: 30px;
  cursor: pointer;
}
.player-container .volume-btn .icon-volume-high .path1:before {
  color: #FFFFFF;
}
.player-container .volume-btn .icon-volume-high .path2:before {
  color: #FFFFFF;
  opacity: 0.8;
}
.player-container .volume-btn .icon-volume-high .path3:before {
  color: #FFFFFF;
  opacity: 0.8;
}
.player-container .volume_icon {
  font-size: 23px;
  color: #FFFFFF;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.player-container .volume-btn #volume-off, .player-container .volume-btn #volume-high {
  opacity: 0;
}
.player-container .volume-btn.loud #volume-high {
  opacity: 1;
}
.player-container .volume-btn.loud #volume-low {
  opacity: 0;
}
.player-container .volume-btn.muted #volume-off {
  opacity: 1;
}
.player-container .volume-btn.muted #volume-high, .player-container .volume-btn.muted #volume-low {
  opacity: 0;
}
.player-container .play-btn {
  cursor: pointer;
  position: relative;
  margin-right: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.player-container .play-btn .icon-video-square .path1:before,
.player-container .play-btn .icon-pause .path1:before {
  color: #FFFFFF;
  opacity: 1;
}
.player-container .play-btn .icon-video-square .path2:before,
.player-container .play-btn .icon-pause .path2:before {
  color: #FFFFFF;
  opacity: 0.8;
}
.player-container .play-btn .play-video {
  display: block;
  font-size: 25px;
}
.player-container .play-btn .pause-video {
  display: none;
  font-size: 25px;
}
.player-container .play-btn.paused .play-video {
  display: none;
}
.player-container .play-btn.paused .pause-video {
  display: block;
}

.img-container {
  position: relative;
  overflow: hidden;
  display: block;
}
.img-container::after {
  content: "";
  display: block;
}
.img-container .img-container-inner {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

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

.repair-btn {
  font-size: 14px;
  font-family: yekan-bakh;
  border-radius: 8px;
  margin-top: 15px;
  display: inline-block;
  transition: all 0.2s linear;
  padding: 10px 30px;
  background: #12b76a;
  border: 1px solid #12b76a;
  color: #ffffff;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
}
.repair-btn:hover {
  background: #0b9253;
  color: #ffffff;
}

#accordian {
  width: 100%;
  min-height: 100vh;
  height: 100%;
}
#accordian ul {
  padding: 0;
  margin: 0;
  width: 100%;
}
#accordian ul li a {
  color: #344054;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 12px 15px;
  transition: all 0.3s;
  position: relative;
  font-family: yekan-bakh;
  font-weight: 400;
}
#accordian ul li a span {
  font-size: 20px;
}
#accordian ul li a:hover {
  color: #12b76a;
}
#accordian ul .menu-link {
  border-bottom: 1px solid #eaecf0;
}
#accordian ul .open {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
}

#accordian > ul.show-dropdown > li.active > .menu-link,
#accordian > ul > li > ul.show-dropdown > li.active > .menu-link,
#accordian > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link,
#accordian > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link,
#accordian > ul > li > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link {
  background: #12b76a;
  border-radius: 3px;
}
#accordian > ul.show-dropdown > li.active > .menu-link .open,
#accordian > ul > li > ul.show-dropdown > li.active > .menu-link .open,
#accordian > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open,
#accordian > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open,
#accordian > ul > li > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open {
  color: #ffffff;
}
#accordian > ul.show-dropdown > li.active > .menu-link a,
#accordian > ul > li > ul.show-dropdown > li.active > .menu-link a,
#accordian > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link a,
#accordian > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link a,
#accordian > ul > li > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link a {
  color: #ffffff;
}
#accordian > ul.show-dropdown > li.active > .menu-link .open:not(:only-child):after,
#accordian > ul > li > ul.show-dropdown > li.active > .menu-link .open:not(:only-child):after,
#accordian > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open:not(:only-child):after,
#accordian > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open:not(:only-child):after,
#accordian > ul > li > ul > li > ul > li > ul > li > ul.show-dropdown > li.active > .menu-link .open:not(:only-child):after {
  content: "\e9c1";
}

#accordian > ul > li > ul,
#accordian > ul > li > ul > li > ul,
#accordian > ul > li > ul > li > ul > li > ul,
#accordian > ul > li > ul > li > ul > li > ul > li > ul {
  display: none;
  position: relative;
  padding-right: 20px;
}

#accordian > ul > li.active > ul.show-dropdown,
#accordian > ul > li > ul > li.active > ul.show-dropdown,
#accordian > ul > li > ul > li > ul > li.active > ul.show-dropdown,
#accordian > ul > li > ul > li > ul > li > ul > li.active > ul.show-dropdown {
  display: block;
}

#accordian > ul > li > ul,
#accordian > ul > li > ul > li > ul,
#accordian > ul > li > ul > li > ul > li > ul,
#accordian > ul > li > ul > li > ul > li > ul > li > ul {
  padding-left: 0;
}

#accordian .open:not(:only-child):after {
  content: "\e99a";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 15px;
  font-family: "icomoon";
  display: inline-block;
}

.menuOpened .sidebarMenu {
  transform: translate(0, 0);
  transition: all 0.3s cubic-bezier(0.29, 0.39, 0.68, 0.53);
}

.menuOpened {
  overflow: hidden;
}

.table {
  width: 100%;
}
.table thead th {
  font-size: 18px;
  font-family: yekan-bakh;
  color: #344054;
}
.table td,
.table th {
  border: none;
  text-align: center;
  vertical-align: middle;
}
.table tbody tr:nth-child(even) {
  background: #f2f4f7;
}
.table tbody tr:nth-child(odd) {
  background: #ffffff;
}
.table tbody td {
  font-size: 16px;
  font-family: yekan-bakh;
  color: #344054;
  padding: 20px 0;
}
.table .available {
  color: #12b76a;
}
.table .unavailable {
  color: #d92d20;
}

.styled-select {
  width: 100%;
  min-height: 54px;
  background: #ffffff;
  border: 1px solid #eaecf0;
  border-radius: 8px;
  display: inline-block;
  position: relative;
  overflow: hidden;
  z-index: 10;
}
.styled-select::before {
  content: "\e99a";
  font-family: "icomoon";
  position: absolute;
  left: 10px;
  top: 50%;
  width: 35px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  z-index: 1;
}
.styled-select select {
  font-size: 11px;
  padding: 0 10px;
  border: 0;
  position: absolute;
  left: 0;
  top: 0;
  background: transparent;
  font-family: yekan-bakh;
  height: 100%;
  width: 100%;
  font-size: 14px;
  color: #354752;
  z-index: 100;
  appearance: none;
  cursor: pointer;
}

.group-checkbox input {
  display: none;
}
.group-checkbox label {
  font-size: 16px;
  font-family: yekan-bakh;
  color: #495058;
  padding: 0 35px 0 0;
  position: relative;
  margin: 10px 0;
  cursor: pointer;
  user-select: none;
}
.group-checkbox label::after {
  content: "";
  font-family: "icomoon";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 31px;
  height: 31px;
  background: #ffffff;
  border: 1px solid #e1e5eb;
  border-radius: 7px;
  transition: all 0.2s linear;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 10px;
}
.group-checkbox input:checked ~ label::after {
  content: "\f084";
  background: #34c759;
}

.group-radio input {
  display: none;
}
.group-radio label {
  font-size: 16px;
  font-family: yekan-bakh;
  color: #495058;
  padding: 0 30px 0 0;
  position: relative;
  margin: 10px 0;
  cursor: pointer;
  user-select: none;
}
.group-radio label::after {
  content: "";
  font-family: "icomoon";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  background: #ffffff;
  border: 1px solid #e1e5eb;
  border-radius: 50%;
  transition: all 0.2s linear;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
}
.group-radio input:checked ~ label::after {
  background: #34c759;
}

.pagination-wrapper {
  border-top: 1px solid #eaecf0;
  padding: 20px 0;
}
.pagination-wrapper .page-link {
  font-size: 14px;
  font-family: yekan-bakh;
  font-weight: 500;
  color: #344054;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: transparent;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
  margin: 0 5px;
  white-space: nowrap;
}
.pagination-wrapper .page-link:hover {
  color: #ffffff;
  background: #1c74bd;
}
.pagination-wrapper .active {
  color: #ffffff;
  background: #1c74bd;
}
.pagination-wrapper .page-prev {
  margin-left: 30px;
  padding: 10px 40px;
}
.pagination-wrapper .page-prev .icon-arrow-right {
  font-size: 20px;
  margin-left: 5px;
}
.pagination-wrapper .page-next {
  margin-right: 30px !important;
  padding: 10px 40px;
}
.pagination-wrapper .page-next .icon-arrow-left {
  font-size: 20px;
  margin-right: 5px;
}
.pagination-wrapper .page-item:last-child .page-link {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.pagination-wrapper .page-item:first-child .page-link {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.breadcrumb-wrapper {
  background: #fff;
  padding: 10px 0;
  margin-bottom: 40px;
}
.breadcrumb-wrapper .breadcrumb-link {
  font-size: 12px;
  font-family: yekan-bakh;
  color: #98a2b3;
}
.breadcrumb-wrapper .active {
  font-family: yekan-bakh;
  font-weight: 500;
  color: #1c74bd;
}
.breadcrumb-wrapper span {
  margin: 0 10px;
  color: #d0d5dd;
  font-size: 15px;
}

.group-input label {
  font-size: 24px;
  font-family: yekan-bakh;
  color: #344054;
  margin-bottom: 10px;
}
.group-input .input-container {
  border-radius: 13px;
  background: #ffffff;
  border: 1px solid #ffffff;
  width: 100%;
  overflow: hidden;
}
.group-input .input-container:focus-within {
  border: 1px solid #2084d7;
}
.group-input .input-container input {
  width: 100%;
}
.group-input input,
.group-input textarea {
  font-size: 48px;
  font-family: yekan-bakh;
  font-weight: 500;
  color: #b6bec1;
  flex-grow: 2;
  background: transparent;
  border: none;
  padding: 10px 15px;
  flex-grow: 2;
  border: 1px solid #ffffff;
}
.group-input .err-text {
  font-size: 18px;
  font-family: yekan-bakh;
  font-weight: 700;
  color: #f04438;
  display: none;
}
.group-input .err-text .icon-danger {
  margin-left: 5px;
  font-size: 30px;
}
.group-input.input-err .input-container {
  border: 1px solid #f04438;
}
.group-input.input-err .input-container input {
  color: #f04438;
  border: 1px solid #ffffff;
}
.group-input.input-err input {
  color: #f04438;
  border: 1px solid #f04438;
}
.group-input.input-err .err-text {
  display: block;
}

.quantity-field {
  min-width: 63px;
  height: 26px;
  margin: 0 auto;
  overflow: hidden;
}
.quantity-field .value-button {
  height: 100%;
  width: 33%;
  padding: 0;
  font-size: 14px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
}
.quantity-field .value-button span {
  font-size: 15px;
}
.quantity-field .number {
  border: none;
  margin: 0px;
  height: 100%;
  width: 33%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: yekan-bakh;
  font-weight: 700;
  font-size: 18px;
  color: #6c757e;
  background: transparent;
  text-align: center;
}
.quantity-field .number::selection {
  background: none;
}

.product-card-second {
  border-bottom: 1px solid #e1e5eb;
}
.product-card-second .img-product {
  min-width: 100px;
}
.product-card-second .img-product::after {
  padding-bottom: 100%;
}
.product-card-second .img-product img {
  max-height: 90%;
  max-width: 90%;
}
.product-card-second .img-product .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-card-second .product-name {
  font-size: 14px;
  color: #1d2939;
  font-family: yekan-bakh;
  font-weight: 700;
  margin-bottom: 10px;
}
.product-card-second .product-name-en {
  font-size: 12px;
  color: #1d2939;
  font-family: yekan-bakh;
}
.product-card-second .short-description {
  font-size: 12px;
  font-family: yekan-bakh;
  color: #475467;
  margin: 10px 0;
}
.product-card-second .original-price {
  font-size: 16px;
  color: #afb6bc;
  font-family: yekan-bakh;
  font-weight: 700;
  text-decoration: line-through;
}
.product-card-second .current-price {
  font-size: 18px;
  color: #475467;
  font-weight: 700;
  margin-bottom: 10px;
}
.product-card-second .add-cart-btn {
  font-size: 14px;
  color: #ffffff;
  flex-grow: 2;
  font-weight: 500;
  background: #12b76a;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.product-card-second .add-cart-btn .icon-bag-2 {
  margin-right: 10px;
  font-size: 20px;
}
.product-card-second .add-cart-btn .icon-bag-2 .path1:before {
  color: #ffffff;
}
.product-card-second .add-cart-btn .icon-bag-2 .path2:before {
  color: #ffffff;
}
.product-card-second .add-cart-btn .icon-bag-2 .path3:before {
  color: #ffffff;
  opacity: 0.4;
}
.product-card-second .add-cart-btn .icon-bag-2 .path4:before {
  color: #ffffff;
}
.product-card-second .discount-tag {
  background: #ff453a;
  border-radius: 4px;
  font-size: 12px;
  color: #ffffff;
  padding: 3px 10px 0;
  font-weight: 500;
  margin-left: 10px;
}
.product-card-second .inventory {
  font-size: 12px;
  color: #667085;
  margin: 10px 0;
}
.product-card-second .inventory span {
  font-weight: 700;
  color: #039855;
}

.product-card {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 12px;
  overflow: hidden;
}
.product-card .img-product {
  width: 100%;
}
.product-card .img-product::after {
  padding-bottom: 70%;
}
.product-card .img-product img {
  max-height: 90%;
  max-width: 90%;
  width: auto;
}
.product-card .img-product .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-card .product-name {
  font-size: 18px;
  color: #1d2939;
  font-weight: 700;
  margin-bottom: 10px;
}
.product-card .product-name-en {
  font-size: 12px;
  color: #1d2939;
}
.product-card .original-price {
  font-size: 14px;
  color: #98a2b3;
  text-decoration: line-through;
}
.product-card .current-price {
  font-size: 20px;
  color: #475467;
  font-weight: 700;
  margin-bottom: 10px;
}
.product-card .add-cart-btn {
  font-size: 14px;
  color: #ffffff;
  flex-grow: 2;
  font-weight: 500;
  background: #12b76a;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  transition: all 0.2s linear;
}
.product-card .add-cart-btn .icon-bag-2 {
  margin-right: 10px;
  font-size: 20px;
}
.product-card .add-cart-btn .icon-bag-2 .path1:before {
  color: #ffffff;
}
.product-card .add-cart-btn .icon-bag-2 .path2:before {
  color: #ffffff;
}
.product-card .add-cart-btn .icon-bag-2 .path3:before {
  color: #ffffff;
  opacity: 0.4;
}
.product-card .add-cart-btn .icon-bag-2 .path4:before {
  color: #ffffff;
}
.product-card .add-cart-btn:hover {
  background: #0e9255;
}
.product-card .inventory {
  font-size: 12px;
  color: #667085;
  margin-left: 10px;
}
.product-card .inventory span {
  font-weight: 700;
  color: #039855;
}
.product-card .discount-tag {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #ff453a;
  border-radius: 4px;
  font-size: 16px;
  color: #ffffff;
  padding: 3px 10px 0;
  font-weight: 500;
}
.product-card .used-tag {
  position: absolute;
  top: -10px;
  left: -10px;
  background: #ff453a;
  font-size: 14px;
  color: #ffffff;
  width: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  transform: rotate(-45deg) translateX(-30%);
}

.slider-section {
  overflow: hidden;
}
.slider-section .container-fluid {
  padding: 0;
  max-width: 1920px;
}
.slider-section .slider-img {
  width: 100%;
}
.slider-section .slider-img::after {
  padding-bottom: 40%;
}
.slider-section .owl-nav {
  position: absolute;
  bottom: 60px;
  left: 80px;
}
.slider-section .owl-dots {
  position: absolute;
  bottom: 60px;
  left: 170px;
  height: 40px;
  display: flex;
  align-items: center;
}
.slider-section .owl-dots .owl-dot {
  width: 18px;
  height: 7px;
  border-radius: 7px;
  margin: 0 3px;
  background: #e1e5eb;
}
.slider-section .owl-dots .active {
  width: 39px;
  background: #ffffff;
}
.slider-section .owl-carousel .owl-nav button.owl-next,
.slider-section .owl-carousel .owl-nav button.owl-prev {
  position: relative;
  width: 40px;
  height: 40px;
}
.slider-section .owl-carousel .owl-nav button.owl-next span,
.slider-section .owl-carousel .owl-nav button.owl-prev span {
  display: none;
}
.slider-section .owl-carousel .owl-nav button.owl-next::after,
.slider-section .owl-carousel .owl-nav button.owl-prev::after {
  content: "\e9a9";
  font-family: "icomoon";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  font-size: 20px;
}
.slider-section .owl-carousel .owl-nav button.owl-next::after {
  content: "\e9a2";
}

.brand-section {
  margin-top: 70px;
}
.brand-section .brand-img {
  width: 100%;
}
.brand-section .brand-img::after {
  padding-bottom: 50%;
}
.brand-section .brand-img img {
  max-width: 80%;
  max-height: 100%;
}
.brand-section .brand-img .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.brand-section .owl-nav {
  height: 0;
  position: absolute;
  top: 50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  transform: translateY(-50%);
}
.brand-section .owl-carousel .owl-nav button.owl-next {
  left: -40px;
}
.brand-section .owl-carousel .owl-nav button.owl-prev {
  right: -40px;
}
.brand-section .owl-carousel .owl-nav button.owl-next,
.brand-section .owl-carousel .owl-nav button.owl-prev {
  position: relative;
  width: 38px;
  height: 38px;
  background: #ffffff;
  border-radius: 5px;
}
.brand-section .owl-carousel .owl-nav button.owl-next span,
.brand-section .owl-carousel .owl-nav button.owl-prev span {
  display: none;
}
.brand-section .owl-carousel .owl-nav button.owl-next::after,
.brand-section .owl-carousel .owl-nav button.owl-prev::after {
  content: "\e9a9";
  font-family: "icomoon";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 20px;
}
.brand-section .owl-carousel .owl-nav button.owl-next::after {
  content: "\e9a2";
}

.category {
  margin-top: 70px;
}
.category .category-img {
  width: 100%;
}
.category .category-img::after {
  padding-bottom: 100%;
}
.category .category-img .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.category .category-img img {
  height: 80%;
}
.category .category-name {
  font-size: 16px;
  color: #475467;
  font-weight: 500;
  text-align: center;
}

.second-model-products {
  margin-top: 70px;
}
.second-model-products .used-products-wrapper,
.second-model-products .new-products-wrapper {
  border-radius: 15px;
}
.second-model-products .view-all {
  font-size: 24px;
}
.second-model-products .view-all .icon-arrow-left {
  margin-right: 10px;
  font-size: 20px;
}

.second-products-title {
  border-bottom: 3px solid #98a2b3;
}
.second-products-title .second-products__title {
  font-size: 24px;
  font-weight: 700;
  padding: 15px 30px;
  position: relative;
}
.second-products-title .second-products__title::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -3px;
  height: 7px;
  border-radius: 5px;
  width: 40%;
}

.bestselling-products .view-all {
  font-size: 24px;
  color: #1d2939;
}
.bestselling-products .view-all .icon-arrow-left {
  margin-right: 10px;
  font-size: 20px;
}

.used-products {
  margin-top: 70px;
}
.used-products-wrapper {
  background: #71739e;
}
.used-products .view-all {
  color: #ffffff;
}
.used-products .icon-arrow-left .path1:before {
  color: #ffffff;
}
.used-products .icon-arrow-left .path2:before {
  color: #ffffff;
}
.used-products .second-products-title .second-products__title {
  color: #ffffff;
}
.used-products .second-products-title .second-products__title::after {
  background: #fdb022;
}

.new-products-wrapper {
  background: #f2f4f7;
}
.new-products .view-all {
  color: #1d2939;
}
.new-products .second-products-title .second-products__title {
  color: #1d2939;
}
.new-products .second-products-title .second-products__title::after {
  background: #1c74bd;
}

.banner {
  margin-top: 50px;
}
.banner .banner-img {
  width: 100%;
  border-radius: 15px;
}
.banner .banner-img::after {
  padding-bottom: 45%;
}

.section-blog-title {
  border-bottom: 3px solid #eaecf0;
  margin-bottom: 30px;
}
.section-blog-title .blog__title {
  font-size: 30px;
  font-weight: 700;
  color: #1d2939;
  position: relative;
  padding: 20px 0;
}
.section-blog-title .blog__title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -3px;
  width: 40%;
  height: 7px;
  background: #2084d7;
  border-radius: 5px;
}
.section-blog-title .blog-title-btn {
  font-size: 18px;
  color: #667085;
  transition: all 0.2s linear;
}
.section-blog-title .blog-title-btn:hover {
  color: #000000;
}
.section-blog-title .blog-title-btn .icon-arrow-left {
  margin-right: 10px;
}

.educational-section {
  margin-top: 70px;
}
.educational-section .educational-big-img {
  border-radius: 12px;
  width: 100%;
  height: 100%;
}
.educational-section .educational-big-img .educational-title {
  font-size: 16px;
  color: #ffffff;
  font-weight: 500;
}
.educational-section .educational-big-img .educational-text {
  font-size: 14px;
  color: #f9fafb;
}
.educational-section .educational-big-img .educational-btn {
  font-size: 18px;
  color: #f2f4f7;
}
.educational-section .educational-big-img .educational-btn .icon-arrow-left {
  margin-right: 10px;
}
.educational-section .educational-big-img .educational-btn .icon-arrow-left .path1:before {
  content: "\e9a0";
  color: #ffffff;
}
.educational-section .educational-big-img .educational-btn .icon-arrow-left .path2:before {
  content: "\e9a1";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-price {
  font-size: 18px;
  color: #ffffff;
  font-weight: 700;
}
.educational-section .educational-big-img .educational-details {
  font-size: 12px;
  color: #eaecf0;
}
.educational-section .educational-big-img .educational-details .icon-timer-1,
.educational-section .educational-big-img .educational-details .icon-monitor {
  margin-left: 5px;
}
.educational-section .educational-big-img .educational-details .icon-timer-1 .path1:before {
  content: "\f6d4";
  color: #ffffff;
}
.educational-section .educational-big-img .educational-details .icon-timer-1 .path2:before {
  content: "\f6d5";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-details .icon-timer-1 .path3:before {
  content: "\f6d6";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-details .icon-monitor .path1:before {
  content: "\f24d";
  color: #ffffff;
}
.educational-section .educational-big-img .educational-details .icon-monitor .path2:before {
  content: "\f24e";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-details .icon-monitor .path3:before {
  content: "\f24f";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-details .icon-monitor .path4:before {
  content: "\f250";
  color: #ffffff;
  margin-left: -1em;
}
.educational-section .educational-big-img .educational-big-content {
  position: absolute;
  z-index: 11;
  background: linear-gradient(360deg, #000000 6.63%, rgba(0, 0, 0, 0) 62.54%);
  filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.05));
  border-radius: 12px;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  padding: 30px;
}
.educational-section .educational-small {
  background: #ffffff;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 12px;
}
.educational-section .educational-small-img {
  min-width: 240px;
  border-radius: 12px;
  margin-left: 20px;
}
.educational-section .educational-small-img::after {
  padding-bottom: 100%;
}
.educational-section .educational-small .educational-details {
  font-size: 16px;
  color: #1d2939;
}
.educational-section .educational-small .educational-details .icon-timer-1,
.educational-section .educational-small .educational-details .icon-monitor {
  margin-left: 5px;
}
.educational-section .educational-small .educational-title {
  font-size: 20px;
  color: #1d2939;
  font-weight: 500;
  margin-bottom: 15px;
}
.educational-section .educational-small .educational-text {
  font-size: 16px;
  color: #667085;
  margin-bottom: 15px;
}
.educational-section .educational-small .educational-btn {
  font-size: 18px;
  color: #1c74bd;
}
.educational-section .educational-small .educational-btn .icon-arrow-left {
  margin-right: 5px;
}
.educational-section .educational-small .educational-btn .icon-arrow-left .path1:before {
  color: #1c74bd;
}
.educational-section .educational-small .educational-btn .icon-arrow-left .path2:before {
  color: #1c74bd;
}
.educational-section .educational-small .educational-price {
  font-size: 18px;
  color: #1d2939;
  font-weight: 700;
}

.blog-card {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 12px;
  height: 100%;
}
.blog-card .blog-img {
  width: 100%;
  border-radius: 10px;
}
.blog-card .blog-img::after {
  padding-bottom: 60%;
}
.blog-card .blog-title {
  font-size: 16px;
  font-weight: 500;
  color: #1d2939;
  margin: 10px 0 15px;
}
.blog-card .blog-desc {
  font-size: 12px;
  color: #475467;
  margin-bottom: 20px;
}
.blog-card .blog-btn {
  font-size: 14px;
  font-weight: 500;
  color: #1c74bd;
}
.blog-card .blog-date {
  font-size: 10px;
  color: #98a2b3;
}
.blog-card .blog-date .icon-clock {
  margin-left: 5px;
  font-size: 15px;
  margin-bottom: 3px;
}

.blog-section {
  margin-top: 70px;
}

.products {
  margin-top: 70px;
}
.products.discount-section .row-bg::after {
  background: #98a2b3;
}
.products .row-bg {
  position: relative;
  padding-bottom: 80px;
}
.products .row-bg::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 70%;
  width: 100%;
  background: #f2f4f7;
  border-radius: 15px;
  z-index: -1;
}
.products .product-card-right {
  height: 85%;
  position: relative;
  z-index: 10;
}
.products .product-card-right_title {
  font-size: 32px;
  font-weight: 700;
  color: #0c192b;
}
.products .product-card-right_text {
  font-size: 18px;
  font-weight: 700;
  color: #353a40;
  margin: 10px 0;
}
.products .product-card-right_btn {
  font-size: 14px;
  font-weight: 500;
  color: #101828;
}
.products .product-card-right::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 95%;
  width: 100%;
  padding: 20px;
  background-color: #ffcc00;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 11.9403px;
  z-index: -1;
}
.products .product-card-right::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  background-image: url("../img/bg-product.png");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
}

.store-details {
  margin-top: 130px;
}
.store-details .store-details-icon {
  background: #ffffff;
  border-radius: 12px;
}
.store-details_title {
  font-size: 12px;
  font-weight: 700;
  color: #344054;
}
.store-details_text {
  font-size: 10px;
  color: #475467;
}
.store-details_icon {
  width: 45px;
  margin-left: 10px;
}
.store-details .newsletters {
  background: #f2f4f7;
  border-radius: 12px;
}
.store-details .newsletters_title {
  font-size: 20px;
  font-weight: 700;
  color: #101828;
  margin-bottom: 10px;
}
.store-details .newsletters_text {
  font-size: 12px;
  color: #475467;
}
.store-details .newsletters-col {
  width: 50%;
}
.store-details .newsletters_form {
  width: 50%;
  background: #ffffff;
  border: 1px solid #f2f4f7;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  padding: 10px;
}
.store-details .newsletters_form .newsletters-btn {
  color: #fff;
  font-size: 12px;
  padding: 5px 20px;
  background: #1c74bd;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 4px;
  transition: all 0.2s linear;
  border: none;
}
.store-details .newsletters_form .newsletters-btn:hover {
  background: #145e9b;
}
.store-details .newsletters_form .newsletters-btn .icon-arrow-left {
  margin-right: 10px;
}
.store-details .newsletters_form .newsletters-btn .icon-arrow-left .path1:before {
  color: #ffffff;
}
.store-details .newsletters_form .newsletters-btn .icon-arrow-left .path2:before {
  color: #ffffff;
}
.store-details .newsletters_form input {
  font-size: 14px;
  flex-grow: 2;
  background: transparent;
  border: none;
  padding: 0 10px;
}

.footer {
  background: #ffffff;
  padding: 50px 0;
}
.footer .footer-about {
  font-size: 16px;
  color: #0d2a40;
}
.footer .contact-footer-list li {
  margin-left: 20px;
}
.footer .contact-footer-list p {
  font-size: 16px;
  color: #344054;
}
.footer .contact-footer-list .contact-footer_icon {
  margin-left: 15px;
  position: relative;
  font-size: 20px;
  z-index: 10;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer .contact-footer-list .contact-footer_icon::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 100%;
  background: #f2f4f7;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: -1;
}
.footer .social a {
  font-size: 25px;
  padding: 0 10px;
  border-left: 1px dashed #1c74bd;
}
.footer .social a:last-child {
  border-left: unset;
}
.footer .social .icon-illustrator .path1:before {
  color: #1c74bd;
}
.footer .social .icon-illustrator .path2:before {
  color: #1c74bd;
}
.footer .social .icon-illustrator .path3:before {
  color: #1c74bd;
}
.footer .social .icon-facebook .path1:before {
  color: #1c74bd;
}
.footer .social .icon-facebook .path2:before {
  color: #1c74bd;
}
.footer .social .icon-send-2 .path1:before {
  color: #1c74bd;
}
.footer .social .icon-send-2 .path2:before {
  color: #1c74bd;
}
.footer .social .icon-instagram .path1:before {
  color: #1c74bd;
}
.footer .social .icon-instagram .path2:before {
  color: #1c74bd;
}
.footer .social .icon-instagram .path3:before {
  color: #1c74bd;
}
.footer .footer-top {
  border-bottom: 2px solid #d0d5dd;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
.footer .footer-link {
  font-size: 14px;
  color: #1d2939;
  transition: all 0.2s linear;
  padding: 5px 0;
  display: block;
}
.footer .footer-link span {
  margin-left: 8px;
  transition: all 0.2s linear;
  font-size: 20px;
}
.footer .footer-link:hover span {
  margin-left: 5px;
}

.copyright {
  background: #101828;
}
.copyright .copyright-text {
  font-size: 14px;
  color: #f2f4f7;
  text-align: center;
}

.login {
  background: #ffffff;
  width: 100%;
  min-height: 100vh;
  padding: 50px 0;
}
.login .login-page-logo {
  width: 270px;
  margin-bottom: 30px;
}
.login .login-box {
  background: #f2f4f7;
  border: 1px solid #eaecf0;
  border-radius: 30px;
  padding: 104px 140px 80px;
}
.login .login-title {
  font-size: 48px;
  font-weight: 700;
  color: #353a40;
  margin-bottom: 88px;
}
.login .login-btn {
  font-size: 32px;
  color: #ffffff;
  background: #1c74bd;
  border-radius: 15px;
  padding: 10px;
  width: 100%;
  border: none;
  margin-top: 30px;
  height: 80px;
  transition: all 0.2s linear;
}
.login .login-btn:hover {
  background: #0c5694;
}
.login .call-link {
  font-size: 24px;
  color: #353a40;
  margin-top: 30px;
}
.login .call-link .icon-call-calling {
  margin-left: 10px;
  font-size: 30px;
}
.login .back-link {
  font-size: 24px;
  font-weight: 500;
  color: #ffffff;
  padding: 10px 20px;
  position: absolute;
  top: 30px;
  right: 100%;
  background: #1c74bd;
  border-radius: 13px 0px 0px 13px;
  white-space: nowrap;
  height: 84px;
  transition: all 0.2s linear;
}
.login .back-link:hover {
  background: #0c5694;
}
.login .close-page {
  font-size: 30px;
  text-align: left;
  color: #495058;
  margin-bottom: 15px;
}
.login .successful-title {
  font-size: 48px;
  font-weight: 700;
  color: #353a40;
  text-align: center;
  margin: 20px 0;
}
.login .successful-link {
  font-size: 32px;
  color: #353a40;
  margin-top: 48px;
}
.login .resend {
  font-size: 24px;
  font-weight: 700;
  color: #1c74bd;
  transition: all 0.2s linear;
}
.login .resend:hover {
  text-decoration: underline;
}
.login .change-number,
.login .forget-pass {
  font-size: 24px;
  font-weight: 700;
  color: #495058;
  transition: all 0.2s linear;
}
.login .change-number:hover,
.login .forget-pass:hover {
  text-decoration: underline;
}
.login .fixed-password {
  font-size: 24px;
  font-weight: 700;
  color: #1c74bd;
  transition: all 0.2s linear;
}
.login .fixed-password:hover {
  text-decoration: underline;
}
.login .group-input label {
  margin-bottom: 33px;
}
.login .group-input input {
  height: 84px;
}
.login .toggle-password {
  padding: 0 20px;
  font-size: 30px;
}

.content-area {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
}
.content-area .code-input {
  font-size: 38px;
  font-weight: 500;
  color: #1d2939;
  text-align: center;
  background-color: #ffffff;
  width: 84px;
  height: 84px;
  direction: ltr;
  border-radius: 13px;
  margin: 0 3px;
  flex-grow: unset;
}
.content-area .number-code {
  direction: ltr;
}

.title-blog-page .title__blog {
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
  padding: 20px 30px;
  border-bottom: 3px solid #98a2b3;
  position: relative;
}
.title-blog-page .title__blog::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -3px;
  height: 7px;
  border-radius: 5px;
  background: #1c74bd;
  width: 40%;
}

.blog-page {
  margin-top: 70px;
}
.blog-page .blog-card {
  height: unset;
  margin-bottom: 20px;
}
.blog-page .view-all-post {
  font-size: 24px;
  color: #1d2939;
}
.blog-page .view-all-post .icon-arrow-left {
  margin-right: 5px;
  font-size: 20px;
}
.blog-page .row-blogs .col-lg-4:nth-child(odd) .blog-card:nth-child(odd) .blog-img::after {
  padding-bottom: 100%;
}
.blog-page .row-blogs .col-lg-4:nth-child(even) .blog-card:nth-child(even) .blog-img::after {
  padding-bottom: 100%;
}

.products-page .filter-responsive .products-number {
  height: 37px;
  padding: 0 20px;
  font-size: 12px;
  color: #495058;
  background: #f2f4f7;
  border-radius: 6px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}
.products-page .filter-responsive .filter-btn {
  height: 37px;
  padding: 0 20px;
  font-size: 14px;
  color: #495058;
  background: #f2f4f7;
  border-radius: 6px;
  white-space: nowrap;
}
.products-page .filter-responsive .filter-btn .icon-filter-search {
  margin-left: 10px;
  font-size: 20px;
}
.products-page .filter-responsive .styled-select {
  margin: 0 10px;
  min-height: 37px !important;
  padding: 0 20px;
  border-radius: 6px;
  background: #f2f4f7;
  border: none;
}
.products-page .banner-products {
  width: 100%;
  background: #000;
  border-radius: 10px;
}
.products-page .banner-products::after {
  padding-bottom: 15%;
}
.products-page .title-box {
  border-radius: 8px;
  overflow-x: auto;
}
.products-page .title-box .title-box_text {
  font-size: 14px;
  color: #1d2939;
  white-space: nowrap;
}
.products-page .title-box .title-box_line {
  height: 40px;
  width: 1px;
  border-left: 1px dashed #98a2b3;
}
.products-page .ordering-box {
  border-radius: 8px;
}
.products-page .ordering-box .products-num {
  font-size: 14px;
  color: #6c757e;
}
.products-page .ordering-box .ordering-text {
  font-size: 14px;
  color: #98a2b3;
}
.products-page .ordering-box .ordering-text .icon-sort {
  margin-left: 10px;
  font-size: 20px;
}
.products-page .ordering-box .ordering-link {
  font-size: 16px;
  color: #98a2b3;
  margin: 0 10px;
  display: block;
}
.products-page .ordering-box .ordering-link.active {
  color: #1c74bd;
  font-weight: 500;
}

.filters .remove-filter {
  font-size: 18px;
  color: #f04438;
  margin-bottom: 15px;
  display: block;
  text-align: left;
}

.accordion .accordion-item {
  width: 100%;
  background: transparent;
  border: none;
  overflow: hidden;
  border: 1px solid #f2f4f7;
  border-radius: 10px;
  background: #ffffff;
}
.accordion .accordion-item.open .close-accordion {
  display: block;
}
.accordion .accordion-item.open .open-accordion {
  display: none;
}
.accordion .last-item-filter,
.accordion .group_toggle:last-child {
  border-bottom: unset;
}
.accordion .accordion-content {
  padding-top: 30px;
}
.accordion .accordion-item__button {
  border: none;
  width: 100%;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 18px;
  color: #354752;
  user-select: none;
  -webkit-touch-callout: none;
  background: transparent;
}
.accordion .accordion-item__button .close-accordion {
  display: none;
  margin-left: 10px;
}
.accordion .accordion-item__button .open-accordion {
  display: block;
  margin-left: 10px;
}
.accordion .group-checkbox {
  margin: 15px 0;
}
.accordion .group-checkbox label p {
  font-size: 16px;
  color: #354752;
}
.accordion .group-checkbox_score {
  margin-bottom: 10px;
}
.accordion .group-checkbox_score input {
  display: none;
}
.accordion .group-checkbox_score label {
  cursor: pointer;
}
.accordion .group-checkbox_score label span {
  font-size: 25px;
  margin: 0 2px;
  color: #607079;
}
.accordion .group-checkbox_score input:checked ~ label span {
  color: #e85805;
}
.accordion .filter-title {
  font-size: 12px;
  font-weight: 500;
  color: #8798a1;
  margin: 20px 0 10px 0;
}
.accordion .filter-search {
  border: 1px solid #c8d3d9;
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: hidden;
}
.accordion .filter-search input {
  padding: 5px;
  background: transparent;
  border: none;
  font-size: 18px;
  color: #8798a1;
  flex-grow: 2;
}
.accordion .filter-search button {
  padding: 0 5px;
  border: none;
  background: transparent;
}
.accordion .all-options {
  height: 217px;
  overflow-y: auto;
  padding-left: 5px;
}
.accordion .all-options::-webkit-scrollbar-track {
  background-color: #e1e5eb;
}
.accordion .all-options::-webkit-scrollbar {
  width: 4px;
  background-color: #e1e5eb;
}
.accordion .all-options::-webkit-scrollbar-thumb {
  width: 8px;
  border-radius: 40px;
  background-color: #495058;
}

.group-checkbox_clr {
  margin-right: 10px;
  margin-bottom: 10px;
}
.group-checkbox_clr input {
  display: none;
}
.group-checkbox_clr label {
  cursor: pointer;
  position: relative;
  width: 19px;
  height: 19px;
  border-radius: 4px;
  border: 0.5px solid #cacaca;
}
.group-checkbox_clr label::after {
  content: "\f084";
  font-family: "icomoon";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 10px;
  display: none;
}
.group-checkbox_clr label p {
  display: none;
}
.group-checkbox_clr label.red {
  background: red;
}
.group-checkbox_clr label.green {
  background: green;
}
.group-checkbox_clr label.yellow {
  background: yellow;
}
.group-checkbox_clr label.orange {
  background: orange;
}
.group-checkbox_clr label.black {
  background: black;
}
.group-checkbox_clr label.white {
  background: white;
}
.group-checkbox_clr input:checked ~ label::after {
  display: block;
}

.range-wrapper {
  direction: ltr;
  margin-top: 5px;
}
.range-wrapper .price-input {
  width: 100%;
  display: flex;
  margin: 10px 0;
}
.range-wrapper .price-input .field {
  display: flex;
  width: 100%;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  color: #495058;
}
.range-wrapper .field input {
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: 700;
  color: #495058;
  text-align: center;
  border: none;
  background: transparent;
  -moz-appearance: textfield;
}
.range-wrapper input[type=number]::-webkit-outer-spin-button,
.range-wrapper input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.range-wrapper .price-input .separator {
  width: 130px;
  display: flex;
  font-size: 19px;
  align-items: center;
  justify-content: center;
}
.range-wrapper .slider {
  height: 5px;
  position: relative;
  background: #e1e5eb;
  border-radius: 5px;
}
.range-wrapper .slider .progress {
  height: 100%;
  left: 25%;
  right: 25%;
  position: absolute;
  border-radius: 5px;
  background: #1c74bd;
}
.range-wrapper .range-input {
  position: relative;
}
.range-wrapper .range-input input {
  position: absolute;
  width: 100%;
  height: 5px;
  top: -5px;
  background: transparent;
  background: none;
  pointer-events: none;
  appearance: none;
}
.range-wrapper input[type=range]::-webkit-slider-thumb {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #1c74bd;
  pointer-events: auto;
  -webkit-appearance: none;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}
.range-wrapper input[type=range]::-moz-range-thumb {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  border: none;
  background: #1c74bd;
  pointer-events: auto;
  -moz-appearance: none;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

.tabs-wrapper {
  margin: 50px 0 100px;
}
.tabs-wrapper .tabs-wrapper-box {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 10px;
}
.tabs-wrapper .tabs {
  width: 100%;
  border-bottom: 1px solid #d0d5dd;
}
.tabs-wrapper .tabs a {
  font-size: 18px;
  font-weight: 500;
  color: #98a2b3;
  padding: 10px 30px;
  position: relative;
  display: block;
}
.tabs-wrapper .tabs a::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3px;
  left: 0;
  transition: all 0.2s linear;
  border-radius: 12px;
}
.tabs-wrapper .tabs li.active a {
  color: #475467;
}
.tabs-wrapper .tabs li.active a::after {
  background: #1c74bd;
}
.tabs-wrapper .btnContainer {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.tabs-wrapper .btnContainer .btn-more {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  margin: -40px auto 0;
  background: #1c74bd;
  border-radius: 8px;
  z-index: 100;
  padding: 8px 60px;
  cursor: pointer;
}
.tabs-wrapper .btnContainer .textbox {
  width: 100%;
  overflow: hidden;
  transition: all 0.2s linear;
  position: relative;
}
.tabs-wrapper .btnContainer .textbox p {
  font-size: 14px;
  color: #6c757e;
  margin-bottom: 10px;
}
.tabs-wrapper .btnContainer .textbox.removeShadow::after {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 40%;
  left: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #f2f4f7 61.86%);
}
.tabs-wrapper .list-side-products {
  border-bottom: 1px solid #d0d5dd;
  width: 100%;
  overflow-x: auto;
  padding: 10px 0;
}
.tabs-wrapper .list-side-products_link {
  font-size: 14px;
  color: #475467;
  padding: 10px 20px;
  position: relative;
  white-space: nowrap;
}
.tabs-wrapper .list-side-products_link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 5px;
  border-radius: 15px;
}
.tabs-wrapper .list-side-products_link:hover::after {
  background: #002645;
}
.tabs-wrapper .list-side-products_link.active::after {
  background: #002645;
}

.add-commemt-box {
  background: #ffffff;
  border: 0.75px solid #f2f4f7;
  border-radius: 11.25px;
}
.add-commemt-box h4 {
  font-size: 18px;
  font-weight: 500;
  color: #667085;
  margin-bottom: 10px;
}
.add-commemt-box p {
  font-size: 12px;
  color: #6c757e;
}
.add-commemt-box .submit-comment {
  font-size: 14px;
  color: #ffffff;
  font-weight: 500;
  background: #1c74bd;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 40px;
  transition: all 0.2s linear;
}

.technical-specifications_title {
  font-size: 18px;
  font-weight: 700;
  color: #6c757e;
  margin-bottom: 10px;
}

.technical-specifications_link li {
  margin-bottom: 10px;
}
.technical-specifications_link p,
.technical-specifications_link span {
  font-size: 14px;
  color: #6c757e;
  width: 40%;
  padding: 10px;
  background: #ffffff;
  border-radius: 6px;
  margin: 0 !important;
}
.technical-specifications_link span {
  width: 58%;
}

.including-box li {
  position: relative;
}
.including-box li::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background: #1c74bd;
  border-radius: 50%;
}
.including-box_link {
  font-size: 14px;
  color: #1d2939;
  padding: 10px 15px 10px;
  display: inline-block;
}
.including-box_link:hover {
  text-decoration: underline;
}

.tabs-product .tabs-wrapper-box {
  background: transparent;
  border: none;
}
.tabs-product .tabContent {
  background-color: #f2f4f7;
  padding: 20px;
  border-radius: 10px;
  margin-top: 20px;
}
.tabs-product .comment-wrapper .comment-box {
  background: transparent;
}
.tabs-product .comment-wrapper .comment-content {
  background: #ffffff;
}

.product-header .product-gallery {
  position: relative;
}
.product-header .product-gallery .product-links {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  background: #fcfcfd;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  padding: 5px;
}
.product-header .product-gallery .product-links a {
  border-bottom: 1px solid #f2f4f7;
  padding: 5px;
}
.product-header .product-gallery .product-links a:last-child {
  border-bottom: transparent;
}
.product-header .product-gallery .sync1 {
  position: relative;
  margin-bottom: 10px;
}
.product-header .product-gallery .sync1 .item {
  width: 100%;
}
.product-header .product-gallery .sync1 .item::after {
  padding-bottom: 100%;
}
.product-header .product-gallery .sync1 .item .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-header .product-gallery .sync1 .item img {
  max-width: 90%;
  max-height: 100%;
  cursor: pointer;
}
.product-header .product-gallery .sync1 .owl-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 0;
}
.product-header .product-gallery .sync1 .owl-prev,
.product-header .product-gallery .sync1 .owl-next {
  position: relative;
  width: 35px;
  height: 35px;
}
.product-header .product-gallery .sync1 .owl-prev span,
.product-header .product-gallery .sync1 .owl-next span {
  display: none;
}
.product-header .product-gallery .sync1 .owl-prev::after,
.product-header .product-gallery .sync1 .owl-next::after {
  content: "\e9a9";
  font-family: "icomoon";
  position: absolute;
  right: 10px;
  top: 0;
  width: 100%;
  height: 100%;
  font-size: 35px;
  color: #dde4ed;
}
.product-header .product-gallery .sync1 .owl-next::after {
  content: "\e9a2";
  left: 10px;
  right: unset;
}
.product-header .product-gallery .sync2 .item {
  cursor: pointer;
  width: 100%;
  position: relative;
}
.product-header .product-gallery .sync2 .item::after {
  padding-bottom: 100%;
}
.product-header .product-gallery .sync2 .item .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-header .product-gallery .sync2 .item img {
  width: 95%;
}
.product-header .product-sidebar {
  background: #f2f4f7;
  border: 1px solid #eaecf0;
  border-radius: 10px;
}
.product-header .product-sidebar .sidebar-title {
  font-size: 16px;
  font-weight: 500;
  color: #475467;
  margin-bottom: 10px;
}
.product-header .product-sidebar .discount-tag {
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  background: #ff453a;
  padding: 3px 10px 0;
  border-radius: 5px;
  margin-left: 10px;
}
.product-header .product-sidebar .original-price {
  font-size: 13px;
  color: #6c757e;
  text-decoration: line-through;
}
.product-header .product-sidebar .final-price {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.product-header .product-sidebar .final-price_text {
  font-size: 18px;
  font-weight: 500;
  color: #6c757e;
}
.product-header .product-sidebar .current-price {
  font-size: 18px;
  color: #6c757e;
}
.product-header .product-sidebar .current-price span {
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
}
.product-header .product-sidebar .installment-payment-btn,
.product-header .product-sidebar .add-cart-btn {
  font-size: 14px;
  font-weight: 500;
  color: #475467;
  border: 1px solid #98a2b3;
  filter: drop-shadow(0px 1px 2px rgba(16, 24, 40, 0.05));
  border-radius: 8px;
  width: 100%;
  margin-top: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
  padding: 10px;
}
.product-header .product-sidebar .installment-payment-btn:hover,
.product-header .product-sidebar .add-cart-btn:hover {
  background: #98a2b3;
  color: #ffffff;
}
.product-header .product-sidebar .add-cart-btn {
  background: #12b76a;
  border: 1px solid #12b76a;
  color: #ffffff;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
}
.product-header .product-sidebar .add-cart-btn:hover {
  background: #0b9253;
}
.product-header .product-sidebar .add-cart-btn .icon-bag-2 {
  font-size: 20px;
  margin-left: 10px;
}
.product-header .product-sidebar .add-cart-btn .icon-bag-2 .path1:before {
  content: "\e9f4";
  color: #ffffff;
  opacity: 0.4;
}
.product-header .product-sidebar .add-cart-btn .icon-bag-2 .path2:before {
  content: "\e9f5";
  color: #ffffff;
  margin-left: -1em;
}
.product-header .product-sidebar .add-cart-btn .icon-bag-2 .path3:before {
  content: "\e9f6";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.product-header .product-sidebar .add-cart-btn .icon-bag-2 .path4:before {
  content: "\e9f7";
  color: #ffffff;
  opacity: 0.4;
  margin-left: -1em;
}
.product-header .product-name {
  font-size: 18px;
  font-weight: 500;
  color: #353a40;
  margin-bottom: 10px;
}
.product-header .product-name-en {
  font-size: 12px;
  color: #353a40;
}
.product-header .short-product-desc {
  font-size: 13px;
  color: #344054;
  margin: 20px 0;
}
.product-header .product-content_title {
  font-size: 13px;
  color: #344054;
}
.product-header .hashtag-link {
  font-size: 12px;
  color: #475467;
  padding: 0 10px;
}
.product-header .hashtag-link:hover {
  text-decoration: underline;
}
.product-header .product-content_text {
  font-weight: 500;
  font-size: 16px;
  display: inline-block;
  margin-right: 15px;
}

.similar-products {
  background: #f9fafb;
  padding: 50px 0;
}
.similar-products .owl-nav {
  display: none;
}

.product-specification-box {
  background: #f9fafb;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
}
.product-specification-box p {
  font-size: 14px;
  font-weight: 500;
  color: #344054;
}
.product-specification-box span {
  font-size: 20px;
  color: #344054;
}

.price-list-title {
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
}
.price-list .category-title {
  margin-left: 10px;
}
.price-list .styled-select {
  width: 360px;
}
.price-list .search-list {
  width: 360px;
  background: #ffffff;
  border: 1px solid #eaecf0;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  height: 54px;
}
.price-list .search-list input {
  font-size: 14px;
  color: #667085;
  flex-grow: 2;
  background: transparent;
  border: none;
  padding: 10px;
}
.price-list .search-list button {
  font-size: 25px;
  background: transparent;
  border: none;
  padding: 0 10px;
  position: relative;
}
.price-list .search-list button::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 24px;
  width: 1px;
  background: #d0d5dd;
}
.price-list .search-list button .icon-search-normal-1 {
  font-size: 20px;
}
.price-list .pagination-wrapper {
  background: #eaecf0;
  border: 0.794537px solid #f2f4f7;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.1);
  border-radius: 11.9181px;
}
.price-list .pagination-wrapper .page-link:hover {
  background: #ffffff;
  color: #1d2939;
}
.price-list .pagination-wrapper .page-link.active {
  background: #ffffff;
  color: #1d2939;
}
.price-list .list-price-resp {
  background: #ffffff;
  border: 1px solid #eaecf0;
  border-radius: 10px;
}
.price-list .list-price-resp_name {
  font-size: 18px;
  font-weight: 500;
  color: #344054;
  margin-bottom: 15px;
}
.price-list .list-price-resp li {
  padding: 10px 0;
}
.price-list .list-price-resp .title-row {
  font-size: 16px;
  font-weight: 500;
  color: #667085;
}
.price-list .list-price-resp .price-row {
  font-size: 14px;
  color: #667085;
}
.price-list .list-price-resp .price-row span {
  font-weight: 500;
  font-size: 16px;
}
.price-list .list-price-resp .id-product {
  font-size: 16px;
  color: #afb6bc;
}
.price-list .list-price-resp .available {
  font-size: 16px;
  font-weight: 500;
  color: #12b76a;
}
.price-list .list-price-resp .unavailable {
  font-size: 16px;
  font-weight: 500;
  color: #d92d20;
}

.post-content .post-title {
  font-size: 24px;
  font-weight: 500;
  color: #1d2939;
  margin-bottom: 15px;
}
.post-content .view-all-post {
  font-size: 12px;
  color: #1d2939;
  display: inline-block;
  margin-top: 20px;
}
.post-content .view-all-post span {
  margin-right: 10px;
  font-size: 15px;
}
.post-content .post-details .post__details {
  font-size: 13px;
  font-family: "dana-Regular";
  color: #98a2b3;
  margin-left: 20px;
}
.post-content .post-details .post__details .icon-clock,
.post-content .post-details .post__details .icon-eye {
  margin-left: 5px;
}
.post-content article p {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #475467;
  margin-bottom: 10px;
}
.post-content article h2 {
  font-size: 24px;
}
.post-content article h3 {
  font-size: 22px;
}
.post-content article h4,
.post-content article h5 {
  font-size: 20px;
}
.post-content article h2,
.post-content article h3,
.post-content article h4,
.post-content article h5 {
  font-weight: 700;
  color: #1d2939;
  margin-bottom: 15px;
}
.post-content article .img-post {
  width: 100%;
  border-radius: 15px;
  margin: 20px 0;
}
.post-content article .img-post::after {
  padding-bottom: 50%;
}
.post-content .category-post_title {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #475467;
  margin: 0 0 0 10px;
}
.post-content .category-post_link {
  font-size: 16px;
  font-weight: 500;
  color: #475467;
  transition: all 0.2s linear;
}
.post-content .category-post_link:hover {
  text-decoration: underline;
}
.post-content .banner-post-img {
  width: 100%;
  border-radius: 15px;
  margin: 20px 0;
}
.post-content .banner-post-img::after {
  padding-bottom: 30%;
}
.post-content .latest-post-img {
  width: 100%;
  border-radius: 12px;
  margin-bottom: 15px;
}
.post-content .latest-post-img::after {
  padding-bottom: 50%;
}
.post-content .latest-post-img::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  opacity: 0.5;
  z-index: 1;
}
.post-content .social p {
  margin: 0;
}
.post-content .social a {
  padding: 0 8px;
  border-left: 1px dashed #98a2b3;
  font-size: 20px;
}
.post-content .social a:last-child {
  border-left: none;
}
.post-content .latest-post-title {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 11;
}
.post-content .section-blog-title {
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
}

.related-posts-box {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 12px;
}
.related-posts-box .related-posts-img {
  min-width: 110px;
  border-radius: 10px;
  margin-left: 15px;
}
.related-posts-box .related-posts-img::after {
  padding-bottom: 100%;
}
.related-posts-box .play-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.35);
}
.related-posts-box .play-icon .icon-video-square {
  font-size: 20px;
}
.related-posts-box .play-icon .icon-video-square .path1:before {
  color: #ffffff;
  opacity: 1;
}
.related-posts-box .play-icon .icon-video-square .path2:before {
  color: rgba(255, 255, 255, 0.4);
}
.related-posts-box .related-posts-title {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #1d2939;
  margin-bottom: 10px;
}
.related-posts-box .related-posts-date,
.related-posts-box .related-posts-time {
  font-size: 10px;
  font-family: "dana-Regular";
  color: #98a2b3;
}
.related-posts-box .related-posts-date .icon-clock,
.related-posts-box .related-posts-time .icon-clock {
  margin-left: 5px;
}

.comment-wrapper .accordion .accordion-item {
  background: transparent;
  border: none;
  border-radius: 0;
}
.comment-wrapper .accordion .accordion-item.open .accordion-item__button:after {
  content: none;
}
.comment-wrapper .accordion .accordion-item.open .arrow-top {
  display: block;
}
.comment-wrapper .accordion .accordion-item.open .arrow-bottom {
  display: none;
}
.comment-wrapper .accordion .accordion-content {
  padding: 30px;
  margin-top: 20px;
  background: #fff;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.comment-wrapper .accordion .accordion-item__button {
  padding-right: 0;
  background: #fff;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  font-size: 20px;
  font-weight: 500;
  color: #1c74bd;
}
.comment-wrapper .accordion .accordion-item__button .arrow-top {
  display: none;
}
.comment-wrapper .accordion .accordion-item__button .arrow-bottom {
  display: block;
}
.comment-wrapper .accordion .accordion-item__button::after {
  content: none;
}
.comment-wrapper .blog__title {
  font-size: 18px;
  font-weight: 700;
  color: #495058;
}
.comment-wrapper .comment-num {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #495058;
}
.comment-wrapper .group-input label {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #344054;
}
.comment-wrapper .group-input label span {
  font-size: 12px;
  color: #667085;
}
.comment-wrapper .group-input input,
.comment-wrapper .group-input textarea {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #98a2b3;
  padding: 10px;
  background: #f9fafb;
  border-radius: 8px;
  border: 1px solid #f9fafb;
}
.comment-wrapper .group-input input:focus,
.comment-wrapper .group-input textarea:focus {
  border: 1px solid #1c74bd;
}
.comment-wrapper .submit-comment-btn,
.comment-wrapper .cancel-comment-btn {
  font-size: 14px;
  color: #ffffff;
  font-weight: 700;
  padding: 10px 30px;
  background: #1c74bd;
  border-radius: 8px;
  margin-right: 20px;
  transition: all 0.2s linear;
  border: 1px solid #1c74bd;
  border: none;
}
.comment-wrapper .submit-comment-btn:hover,
.comment-wrapper .cancel-comment-btn:hover {
  background: #115994;
}
.comment-wrapper .cancel-comment-btn {
  color: #667085;
  background: transparent;
  margin-left: 0;
  border: 1px solid #98a2b3;
}
.comment-wrapper .cancel-comment-btn:hover {
  background: #98a2b3;
  color: #fff;
}
.comment-wrapper .comment-box {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 2px;
  padding: 20px;
}
.comment-wrapper .comment-content {
  background: #f9fafb;
  border-radius: 7.5px;
}
.comment-wrapper .commet-subject {
  font-size: 13px;
  font-weight: 700;
  color: #495058;
}
.comment-wrapper .comment-name {
  font-size: 13px;
  font-family: "dana-Regular";
  color: #022fa2;
  margin-bottom: 10px;
  display: block;
}
.comment-wrapper .comment-text {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #667085;
}
.comment-wrapper .comment-admin {
  font-size: 13px;
  font-weight: 700;
  color: #022fa2;
  nav-left: 10px;
  white-space: nowrap;
}

.modal-wrapper .modal-content {
  background: #ffffff;
  border: 1.58879px solid #f5f8fa;
  border-radius: 24px;
}

.modal-filter {
  background: #fbfbfb;
}
.modal-filter .filter-header {
  border-bottom: 2px solid #e1e5eb;
}
.modal-filter .filter-header h4 {
  font-size: 18px;
  font-weight: 700;
  color: #495058;
  position: relative;
  padding: 20px 0;
}
.modal-filter .filter-header h4::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -3px;
  height: 5px;
  border-radius: 7px;
  background: #1c74bd;
  width: 150%;
}
.modal-filter .filter-header .remove-filter-btn {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #ff453a;
}
.modal-filter .modal-header {
  background: #fbfbfb;
}
.modal-filter .view-products {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #495058;
}
.modal-filter .view-products p {
  margin-top: 10px;
}
.modal-filter .view-products .icon-arrow-square-up {
  font-size: 20px;
}

.blog-boxes .blog-box-img {
  width: 100%;
  border-radius: 12px;
}
.blog-boxes .blog-box-img::after {
  padding-bottom: 50%;
}
.blog-boxes .blog-box-img::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 50%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 24%, #000000 133.52%);
  border-radius: 12px;
  width: 100%;
  z-index: 1;
}
.blog-boxes .blog-box-img_big {
  width: 100%;
  height: 100%;
  border-radius: 12px;
}
.blog-boxes .blog-box-text {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 10;
}
.blog-boxes .blog-box-content {
  position: absolute;
  left: 10px;
  bottom: 10px;
  width: 40%;
  z-index: 10;
}
.blog-boxes .blog-box-content p {
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 15px;
}
.blog-boxes .blog-box-content .blog-box-link {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
}
.blog-boxes .blog-box-content .blog-box-link .icon-arrow-left {
  margin-right: 5px;
  font-size: 15px;
}
.blog-boxes .blog-box-content .icon-arrow-left .path1:before {
  color: #ffffff;
}
.blog-boxes .blog-box-content .icon-arrow-left .path2:before {
  color: #ffffff;
}

.blog-boxes_carousel .blog-box-img_big {
  width: 100%;
  border-radius: 12px;
}
.blog-boxes_carousel .blog-box-img_big::after {
  padding-bottom: 50%;
}
.blog-boxes_carousel .blog-box-img_big::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 50%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 24%, #000000 133.52%);
  border-radius: 12px;
  width: 100%;
  z-index: 1;
}
.blog-boxes_carousel .blog-box-content {
  position: absolute;
  left: 10px;
  bottom: 10px;
  width: 40%;
  z-index: 10;
}
.blog-boxes_carousel .blog-box-content p {
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
  margin-bottom: 15px;
}
.blog-boxes_carousel .blog-box-content .blog-box-link {
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
}
.blog-boxes_carousel .blog-box-content .blog-box-link .icon-arrow-left {
  margin-right: 5px;
  font-size: 15px;
}
.blog-boxes_carousel .blog-box-content .icon-arrow-left .path1:before {
  color: #ffffff;
}
.blog-boxes_carousel .blog-box-content .icon-arrow-left .path2:before {
  color: #ffffff;
}
.blog-boxes_carousel .owl-dots {
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  height: 40px;
  display: flex;
  align-items: center;
}
.blog-boxes_carousel .owl-dots .owl-dot {
  width: 14px;
  height: 4px;
  border-radius: 7px;
  margin: 0 3px;
  background: #667085;
  opacity: 0.2;
}
.blog-boxes_carousel .owl-dots .active {
  width: 39px;
  opacity: 1;
}

.cart-page .post-type label h4 {
  font-size: 12px;
  font-family: "dana-Bold";
  color: #6c757e;
  margin-left: 20px;
}
.cart-page .post-type label p {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.cart-page .post-type input:checked ~ label p {
  color: #34c759;
}
.cart-page .group-input input,
.cart-page .group-input textarea {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #ffffff;
  border-radius: 8px;
  width: 100%;
  border: 1px solid #ffffff;
}
.cart-page .group-input input:focus,
.cart-page .group-input textarea:focus {
  border: 1px solid #0183ff;
}
.cart-page .date-text {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.cart-page .time-text {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.cart-page .time-btn {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #ffffff;
  background: #1c74bd;
  border-radius: 8px;
  padding: 7px 15px;
}
.cart-page .message-successful {
  margin: 50px 0;
}
.cart-page .message-successful img {
  margin-left: 20px;
}
.cart-page .message-successful p {
  font-size: 19px;
  font-weight: 700;
  color: #353a40;
}
.cart-page .message-successful span {
  font-size: 16px;
  font-weight: 500;
  color: #667085;
}
.cart-page .message-successful .close_icon {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: #ff453a;
  margin-left: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
}
.cart-page .message-successful .close_icon span {
  color: #ffffff;
  font-size: 25px;
}
.cart-page .successful-box {
  background: #fbfbfb;
  border: 1px solid #f5f8fa;
  border-radius: 12px;
}
.cart-page .successful-box .pay-again-btn {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  background: #12b76a;
  border-radius: 8px;
  padding: 10px 40px;
  border: 0;
  transition: all 0.2s linear;
}
.cart-page .successful-box .pay-again-btn:hover {
  background: #000;
}
.cart-page .successful-box .title-successful-page {
  font-size: 14px;
  font-weight: 700;
  color: #495058;
  margin-bottom: 15px;
}
.cart-page .successful-box .receiver-information {
  font-size: 14px;
  font-weight: 700;
  color: #6c757e;
}
.cart-page .successful-box .receiver-information span {
  font-family: "dana-Regular";
}
.cart-page .successful-box .shipment-information {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #6c757e;
  width: 100%;
  background: #ffffff;
  padding: 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cart-page .successful-box .shipment-information .total-price {
  color: #12b76a;
  font-size: 25px;
}
.cart-page .successful-box .order-tracking-btn {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  background: #1c74bd;
  border-radius: 8px;
  padding: 10px 60px;
  border: 0;
  transition: all 0.2s linear;
}
.cart-page .successful-box .order-tracking-btn:hover {
  background: #000;
}
.cart-page .successful-box .successful-box_text {
  font-size: 19px;
  font-weight: 700;
  color: #475467;
  margin-bottom: 20px;
}
.cart-page .successful-box .successful-box_text span {
  color: #f04438;
}
.cart-page .successful-box .order-code {
  font-size: 19px;
  color: #475467;
  font-weight: 700;
}
.cart-page .successful-box .order-code span {
  color: #6c757e;
  font-family: "dana-Regular";
}
.cart-page .successful-box .status {
  font-size: 19px;
  color: #d92d20;
  font-weight: 700;
}
.cart-page .successful-box .order-date {
  font-size: 19px;
  color: #6c757e;
  font-weight: 700;
}
.cart-page .successful-box .order-date span {
  font-family: "dana-Regular";
  color: #6c757e;
}
.cart-page .receiver-information_box {
  background: #ffffff;
  border-radius: 8px;
}
.cart-page .shopping-progress-bar {
  margin: 35px 0 50px;
}
.cart-page .shopping-progress-bar .line-progress {
  height: 4px;
  flex-grow: 2;
  background: #eaecf0;
}
.cart-page .shopping-progress-bar .circle-progress {
  font-size: 18px;
  font-weight: 700;
  color: #98a2b3;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #eaecf0;
}
.cart-page .shopping-progress-bar .active {
  background: #ffffff;
  border: 1px solid #eaecf0;
  border-radius: 50px;
  padding: 8px;
}
.cart-page .shopping-progress-bar .active .circle-progress {
  background: #12b76a;
  color: #ffffff;
  margin-left: 10px;
}
.cart-page .shopping-progress-bar .active p {
  font-size: 18px;
  color: #344054;
  font-family: "dana-Medium";
}
.cart-page .sidebar-cart {
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 12px;
  padding: 13px;
}
.cart-page .sidebar-cart .sidebar-cart_list li {
  background: #ffffff;
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 10px;
}
.cart-page .sidebar-cart .sidebar-cart_list .price-sidebar {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #667085;
}
.cart-page .sidebar-cart .sidebar-cart_list .price-sidebar span {
  font-size: 20px;
  font-family: "dana-Medium";
  color: #344054;
}
.cart-page .sidebar-cart .sidebar-cart_list .deducted span {
  color: #d92d20;
}
.cart-page .sidebar-cart .sidebar-cart_list .total span {
  color: #12b76a;
}
.cart-page .sidebar-cart .cart-btn {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  background: #12b76a;
  border-radius: 8px;
  width: 100%;
  padding: 7px;
  border: none;
  position: relative;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  padding-left: 20px;
  border-left: 1px solid rgba(255, 255, 255, 0.5019607843);
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path1:before {
  color: #ffffff;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path2:before {
  opacity: 0.4;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path3:before {
  color: #ffffff;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path4:before {
  color: #ffffff;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path5:before {
  color: #ffffff;
}
.cart-page .sidebar-cart .cart-btn .icon-empty-wallet-tick .path6:before {
  color: #ffffff;
}
.cart-page .sidebar-cart .inactive-btn {
  background: #d0d5dd;
  color: #ffffff;
}
.cart-page .sidebar-cart .cart_list_title {
  font-size: 14px;
  font-weight: 500;
  color: #344054;
}
.cart-page .sidebar-cart .purchase-process-text {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #667085;
}
.cart-page .sidebar-cart .prices {
  font-size: 20px;
  font-weight: 500;
  color: #344054;
}
.cart-page .cart-wrapper {
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 12px;
  padding: 15px 20px;
  margin-bottom: 15px;
  display: flex;
  flex-direction: column;
}
.cart-page .cart-wrapper_head {
  border-bottom: 1px solid #eaecf0;
  padding-bottom: 15px;
  margin-bottom: 20px;
}
.cart-page .cart-wrapper .cart-wrapper_title {
  font-size: 20px;
  font-weight: 700;
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .cart-number {
  font-size: 14px;
  font-family: "dana-Medium";
  color: #ffffff;
  width: 23px;
  height: 23px;
  background: #2e90fa;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 6px;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-bag-2,
.cart-page .cart-wrapper .cart-wrapper_title .icon-location,
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan,
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan {
  font-size: 25px;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-bag-2 .path1:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-bag-2 .path2:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-bag-2 .path3:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-bag-2 .path4:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-location .path1:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-location .path2:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan .path1:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan .path2:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan .path3:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan .path4:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-d-cube-scan .path5:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-wallet-check .path1:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-wallet-check .path2:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-wallet-check .path3:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-wallet-check .path4:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title .icon-wallet-check .path5:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .cart-wrapper_title p {
  margin: 0 10px;
}
.cart-page .cart-wrapper .add-cart-header {
  font-size: 14px;
  font-weight: 500;
  color: #1c74bd;
}
.cart-page .cart-wrapper .add-cart-header .icon-add-square {
  margin-left: 10px;
  font-size: 20px;
}
.cart-page .cart-wrapper .add-cart-header .icon-add-square .path1:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .add-cart-header .icon-add-square .path2:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .add-cart-header .icon-add-square .path3:before {
  color: #1c74bd;
}
.cart-page .cart-wrapper .add-address-link {
  font-size: 18px;
  font-weight: 500;
  color: #475467;
  margin: 150px 0;
}
.cart-page .cart-wrapper .add-address-link .icon-add-square {
  font-size: 20px;
  margin-left: 10px;
  color: #6c757e;
}
.cart-page .cart-wrapper .add-address-link .icon-add-square .path1:before {
  color: #6c757e;
}
.cart-page .cart-wrapper .add-address-link .icon-add-square .path2:before {
  color: #6c757e;
}
.cart-page .cart-wrapper .add-address-link .icon-add-square .path3:before {
  color: #6c757e;
}
.cart-page .cart-wrapper .prev-cart-btn,
.cart-page .cart-wrapper .next-cart-btn {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  background: #d0d5dd;
  border-radius: 8px;
  padding: 10px 50px;
  transition: all 0.2s linear;
}
.cart-page .cart-wrapper .next-cart-btn {
  border: 1px solid #d0d5dd;
}
.cart-page .cart-wrapper .next-cart-btn:hover {
  background: #c7c9cc;
}
.cart-page .cart-wrapper .prev-cart-btn {
  color: #1c74bd;
  background: transparent;
  border: 1px solid #1c74bd;
  border-radius: 8px;
}
.cart-page .cart-wrapper .prev-cart-btn:hover {
  color: #ffffff;
  background: #1c74bd;
}
.cart-page .cart-wrapper .address-item {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 7.95833px;
}
.cart-page .cart-wrapper .address-item .address-item-btn {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-right: 10px;
  background: #f2f4f7;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
}
.cart-page .cart-wrapper .address-item .edit-btn:hover {
  background: #cfe9cf;
}
.cart-page .cart-wrapper .address-item .trash-btn:hover {
  background: #f4d8d8;
}
.cart-page .cart-wrapper .address-item .receiver-specifications {
  padding-right: 35px;
}
.cart-page .cart-wrapper .address-item .receiver-specifications p {
  font-size: 14px;
  font-family: "dana-Bold";
  color: #6c757e;
  margin-left: 10px;
}
.cart-page .cart-wrapper .address-item .receiver-specifications span {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.cart-page .cart-wrapper .cart-mobile-head {
  border-bottom: 1px solid #f5f8fa;
}
.cart-page .cart-wrapper .cart-mobile-head h2 {
  font-size: 18px;
  font-family: "dana-Bold";
  color: #495058;
  position: relative;
  padding: 10px 0;
}
.cart-page .cart-wrapper .cart-mobile-head h2 span {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #6c757e;
  display: inline-block;
  margin-right: 5px;
}
.cart-page .cart-wrapper .cart-mobile-head h2::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 110px;
  height: 4px;
  background: #022fa2;
  border-radius: 4px;
}
.cart-page .cart-wrapper .cart-mobile-head .remove-products {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #ff453a;
}

.group-radio-time {
  margin-left: 20px;
}
.group-radio-time label {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #ffffff;
  border-radius: 40px;
  padding: 5px 10px;
  cursor: pointer;
  user-select: none;
}
.group-radio-time label::after {
  content: none;
}
.group-radio-time label:hover {
  background: #34c759;
  color: #ffffff;
}
.group-radio-time input:checked ~ label {
  background: #34c759;
  color: #ffffff;
}
.group-radio-time.desable label {
  color: #e1e5eb;
}

.time-text {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #6c757e;
  margin-left: 20px;
}
.time-text span {
  font-weight: 700;
  color: #6c757e;
}

.table-cart tbody {
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.table-cart tbody tr {
  background: #ffffff;
  border-bottom: 1.5px solid #eaecf0;
}
.table-cart thead th {
  font-size: 12px;
  font-weight: 500;
  color: #667085;
}
.table-cart .item-img {
  width: 65px;
  margin-left: 10px;
}
.table-cart .item-img::after {
  padding-bottom: 100%;
}
.table-cart .item-img img {
  width: 90%;
}
.table-cart .item-img .img-container-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.table-cart .product-name {
  font-size: 14px;
  font-weight: 700;
  color: #1d2939;
}
.table-cart .product-name_en {
  font-size: 12px;
  margin: 3px 0 10px;
}
.table-cart .product-specifications {
  font-size: 12px;
  font-weight: 500;
  color: #667085;
  display: flex;
  align-items: center;
  justify-content: center;
}
.table-cart .product-specifications .clr-circle {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #000000;
  margin-left: 10px;
  display: inline-block;
}
.table-cart .product-specifications-one {
  margin-left: 20px;
}
.table-cart .discount-percent {
  font-size: 8px;
  font-weight: 500;
  color: #ffffff;
  background: #f04438;
  border-radius: 3px;
  padding: 2px 5px 0;
  margin-left: 10px;
}
.table-cart .original-price,
.table-cart .current-price {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #667085;
}
.table-cart .original-price span,
.table-cart .current-price span {
  font-weight: 500;
}
.table-cart .original-price .prices {
  text-decoration: line-through;
}
.table-cart .quantity-field .value-button span {
  font-size: 25px;
}
.table-cart .trash-btn {
  min-width: 35px;
  min-height: 35px;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #f9fafb;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
  margin: 0 15px;
}
.table-cart .trash-btn .icon-trash {
  font-size: 17px;
}
.table-cart .trash-btn:hover {
  background: #f04438;
}
.table-cart .trash-btn:hover .icon-trash {
  color: #ffffff;
}
.table-cart .trash-btn:hover .icon-trash .path1:before {
  color: #ffffff;
}
.table-cart .trash-btn:hover .icon-trash .path2:before {
  color: #ffffff;
}
.table-cart .trash-btn:hover .icon-trash .path3:before {
  color: #ffffff;
}
.table-cart .trash-btn:hover .icon-trash .path4:before {
  color: #ffffff;
}
.table-cart .trash-btn:hover .icon-trash .path5:before {
  color: #ffffff;
}

.title-group {
  font-size: 14px;
  font-family: "dana-Bold";
  color: #495058;
  margin-bottom: 15px;
}

.payment-method-item {
  border-radius: 8px;
}
.payment-method-item label {
  padding: 0 45px 0 0;
}
.payment-method-item .img-logo {
  width: 35px;
  margin-left: 15px;
}
.payment-method-item h4 {
  font-size: 12px;
  font-weight: 700;
  color: #6c757e;
  margin-bottom: 5px;
}
.payment-method-item p {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #afb6bc;
}

.installment-sale-header {
  background: #edf5ff;
}
.installment-sale-header .installment-sale-title {
  font-size: 36px;
  font-weight: 700;
  color: #1d2939;
  margin-bottom: 30px;
}
.installment-sale-header .installment-sale-text {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #1d2939;
  margin-bottom: 10px;
}
.installment-sale-header .installment-sale-danger {
  font-size: 18px;
  font-weight: 500;
  color: #ffffff;
  background: #d92d20;
  border-radius: 8px;
  padding: 8px 40px;
  margin-bottom: 15px;
}
.installment-sale-header .installment-sale-danger .icon-danger {
  margin-left: 10px;
}
.installment-sale-header .installment-sale-danger .icon-danger .path1:before {
  color: #ffffff;
}
.installment-sale-header .installment-sale-danger .icon-danger .path2:before {
  color: #ffffff;
}
.installment-sale-header .installment-sale-danger .icon-danger .path3:before {
  color: #ffffff;
}
.installment-sale-header .installment-sale-subtitle {
  font-size: 24px;
  font-weight: 500;
  color: #1d2939;
  margin-bottom: 50px;
}

.validation {
  padding: 50px 0;
  background: #f9fafb;
}
.validation .validation-box {
  background: #ffffff;
  border: 1px solid #f2f4f7;
  backdrop-filter: blur(4px);
  border-radius: 15px;
}
.validation .validation-title {
  font-size: 30px;
  font-weight: 700;
  color: #1d2939;
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
  margin-bottom: 50px;
}
.validation .validation-title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 150%;
  height: 8px;
  background: #12b76a;
  border-radius: 15px;
}
.validation .validation-text {
  font-size: 16px;
  font-weight: 500;
  color: #344054;
  background: #f9fafb;
  border: 1px solid #f9fafb;
  border-radius: 8px;
  margin-left: 10px;
  height: 48px;
  padding: 10px 40px;
}
.validation .validation-text .icon-tick-square {
  margin-left: 10px;
}
.validation .validation-text .icon-tick-square .path1:before {
  content: "\f6d1";
  color: #12b76a;
}
.validation .validation-text .icon-tick-square .path2:before {
  content: "\f6d2";
  color: #12b76a;
  opacity: 0.34;
  margin-left: -1em;
}
.validation .buy-btn {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #ffffff;
  background: #12b76a;
  border: 1px solid #98a2b3;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
  border: none;
  height: 48px;
  padding: 10px 40px;
}
.validation .buy-btn .icon-card-tick-1 {
  margin-left: 10px;
}
.validation .buy-btn .icon-card-tick-1 .path1:before {
  color: #ffffff;
}
.validation .buy-btn .icon-card-tick-1 .path2:before {
  color: #ffffff;
}
.validation .buy-btn .icon-card-tick-1 .path3:before {
  color: #ffffff;
}
.validation .buy-btn .icon-card-tick-1 .path4:before {
  color: #ffffff;
}
.validation .buy-btn .icon-card-tick-1 .path5:before {
  color: #ffffff;
}

.work-calculator {
  background: #f9fafb;
}
.work-calculator .work-calculator-box {
  background: #ffffff;
  backdrop-filter: blur(4px);
  border-radius: 15px;
}
.work-calculator .work-calculator_title {
  font-size: 24px;
  font-weight: 500;
  color: #1d2939;
}
.work-calculator .work-calculator_desc {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #1d2939;
  margin-bottom: 30px;
}
.work-calculator .work-calculator_danger {
  font-size: 18px;
  font-weight: 700;
  background: #f2f4f7;
  border-radius: 8px;
  width: 100%;
  color: #d92d20;
  padding: 5px;
  margin-bottom: 50px;
}
.work-calculator .work-calculator_danger .icon-danger {
  margin-left: 10px;
}
.work-calculator .work-calculator_danger .icon-danger .path1:before {
  color: #d92d20;
}
.work-calculator .work-calculator_danger .icon-danger .path2:before {
  color: #d92d20;
}
.work-calculator .work-calculator_danger .icon-danger .path3:before {
  color: #d92d20;
}
.work-calculator .hints-list li {
  font-size: 18px;
  font-weight: 500;
  color: #d92d20;
  margin-bottom: 20px;
}
.work-calculator .installment-terms-title {
  font-size: 18px;
  font-weight: 500;
  color: #1d2939;
  margin-bottom: 10px;
}
.work-calculator .installment-terms-list li {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #1d2939;
  margin-bottom: 20px;
}
.work-calculator .group-input input {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  height: 44px;
}
.work-calculator .group-input input:focus {
  border: 1px solid #0183ff;
}
.work-calculator .group-input label {
  font-size: 16px;
  font-weight: 500;
  color: #667085;
}
.work-calculator .group-input label span {
  font-size: 10px;
  color: red;
}
.work-calculator .styled-select {
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  min-height: 44px;
}
.work-calculator .title-group {
  font-size: 16px;
  font-weight: 500;
  color: #667085;
  margin-bottom: 10px;
}
.work-calculator .title-group span {
  font-size: 10px;
  color: red;
}
.work-calculator .price-title {
  font-size: 14px;
  color: #1c74bd;
  font-weight: 500;
  margin-left: 20px;
}
.work-calculator .price {
  font-size: 14px;
  color: #667085;
  font-weight: 500;
}
.work-calculator .calculate-btn,
.work-calculator .request-tracking-btn,
.work-calculator .form-completion-btn {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  background: #12b76a;
  border-radius: 8px;
  padding: 8px 25px;
  border: 1px solid #12b76a;
  transition: all 0.2s linear;
}
.work-calculator .calculate-btn:hover,
.work-calculator .request-tracking-btn:hover,
.work-calculator .form-completion-btn:hover {
  background: #0b9253;
}
.work-calculator .request-tracking-btn {
  background: transparent;
  color: #1c74bd;
  border: 1px solid #1c74bd;
}
.work-calculator .request-tracking-btn:hover {
  color: #ffffff;
  background: #1c74bd;
}
.work-calculator .form-completion-btn {
  margin-right: 20px;
  background: #1c74bd;
  border: 1px solid #1c74bd;
}
.work-calculator .form-completion-btn:hover {
  background: #135d9a;
}

.faq {
  background: #f9fafb;
  padding: 80px 0;
}
.faq .accordion-content p {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #344054;
  line-height: 1.8;
}
.faq .accordion-item__button p {
  font-size: 14px;
  font-weight: 500;
  color: #344054;
  text-align: right;
}
.faq .accordion-item {
  background: #fcfcfd;
  border: 1px solid #f2f4f7;
  box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
  border-radius: 8px;
}
.faq .accordion-item.open .accordion-item__button p {
  color: #1c74bd;
}
.faq .accordion-item.open .accordion-item__button .icon-minus-square .path1:before {
  color: #1c74bd;
}
.faq .accordion-item.open .accordion-item__button .icon-minus-square .path2:before {
  color: #1c74bd;
}

.repairs-header {
  background: #e9e7ff;
  padding: 65px 0;
}
.repairs-header .repairs-title {
  font-size: 36px;
  font-weight: 700;
  color: #1d2939;
  margin-bottom: 15px;
}
.repairs-header .repairs-text {
  font-size: 20px;
  font-weight: 500;
  color: #1d2939;
}

.repairs-category {
  padding: 100px 0;
}
.repairs-category .repairs-category_title {
  font-size: 18px;
  font-weight: 500;
  color: #1d2939;
}
.repairs-category .repairs-category_text {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #475467;
  margin: 7px 0 30px;
}
.repairs-category .repairs-category_img {
  margin-bottom: 20px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.repairs-category .repairs-category_img img {
  width: 138px;
}
.repairs-category .repairs-category_link {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #1c74bd;
}
.repairs-category .repairs-category_link .icon-arrow-left {
  margin-right: 10px;
}
.repairs-category .repairs-category_link .icon-arrow-left .path1:before {
  color: #1c74bd;
}
.repairs-category .repairs-category_link .icon-arrow-left .path2:before {
  color: #1c74bd;
}

.about-repair {
  background: #f9fafb;
  padding: 70px 0;
}
.about-repair .about-repair_title {
  font-size: 24px;
  font-weight: 700;
  color: #1d2939;
  margin-bottom: 25px;
}
.about-repair .about-repair_text {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #475467;
  margin-bottom: 10px;
}

.banner-repair {
  background: #f9fafb;
  padding: 70px 0;
}
.banner-repair .banner-img {
  width: 100%;
  border-radius: 15px;
}
.banner-repair .banner-img::after {
  padding-bottom: 15%;
}

.panel {
  padding: 50px 0;
  background: #f9fafb;
  min-height: 100vh;
}
.panel .back-dashboard {
  font-size: 18px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #fbfbfb;
  border-radius: 10px;
}
.panel .back-dashboard span {
  margin-left: 10px;
}
.panel .user-profile p {
  font-size: 18px;
  font-weight: 500;
  color: #475467;
  margin-bottom: 10px;
}
.panel .user-profile span {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #667085;
}
.panel .user-profile .change-pass {
  font-size: 13px;
  font-weight: 500;
  color: #d92d20;
}
.panel .user-profile .change-pass:hover {
  text-decoration: underline;
}
.panel .set-password {
  font-size: 18px;
  font-weight: 500;
  color: #1c74bd;
}
.panel .set-password:hover {
  text-decoration: underline;
}
.panel .panel-info {
  border: 1px solid #f9fafb;
  border-radius: 12px;
}
.panel .panel-info .img-profile {
  min-width: 27px;
  border-radius: 50%;
  border: 1px solid #87c4ff;
  margin-left: 10px;
}
.panel .panel-info .img-profile::after {
  padding-bottom: 100%;
}
.panel .panel-info .username {
  font-size: 14px;
  font-weight: 700;
  color: #495058;
}
.panel .panel-info .wellcome {
  font-size: 10px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .panel-info .wallet-balance {
  background: #f2f4f7;
  border-radius: 8px;
}
.panel .panel-info .wallet-balance_text {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #344054;
}
.panel .panel-info .wallet-balance_text .icon-empty-wallet {
  margin-left: 5px;
}
.panel .panel-info .wallet-balance_price {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #344054;
}
.panel .panel-info .wallet-balance_price span {
  font-family: "dana-Bold";
}
.panel .panel-menu {
  border: 1px solid #f9fafb;
  border-radius: 12px;
}
.panel .panel-menu .panel-link {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #98a2b3;
  padding: 15px 0;
}
.panel .panel-menu .panel-link:hover .icon-profile-circle .path1:before,
.panel .panel-menu .panel-link:hover .icon-profile-circle .path2:before,
.panel .panel-menu .panel-link:hover .icon-profile-circle .path3:before,
.panel .panel-menu .panel-link:hover .icon-bag-2 .path1:before,
.panel .panel-menu .panel-link:hover .icon-bag-2 .path2:before,
.panel .panel-menu .panel-link:hover .icon-bag-2 .path3:before,
.panel .panel-menu .panel-link:hover .icon-bag-2 .path4:before,
.panel .panel-menu .panel-link:hover .icon-empty-wallet .path1:before,
.panel .panel-menu .panel-link:hover .icon-empty-wallet .path2:before,
.panel .panel-menu .panel-link:hover .icon-empty-wallet .path3:before,
.panel .panel-menu .panel-link:hover .icon-empty-wallet .path4:before,
.panel .panel-menu .panel-link:hover .icon-picture-frame .path1:before,
.panel .panel-menu .panel-link:hover .icon-picture-frame .path2:before,
.panel .panel-menu .panel-link:hover .icon-picture-frame .path3:before,
.panel .panel-menu .panel-link:hover .icon-note .path1:before,
.panel .panel-menu .panel-link:hover .icon-note .path2:before,
.panel .panel-menu .panel-link:hover .icon-note .path3:before,
.panel .panel-menu .panel-link:hover .icon-note .path4:before,
.panel .panel-menu .panel-link:hover .icon-forward-square .path1:before,
.panel .panel-menu .panel-link:hover .icon-forward-square .path2:before,
.panel .panel-menu .panel-link:hover .icon-forward-square .path3:before {
  color: #2250a9;
}
.panel .panel-menu .panel-link.active .icon-profile-circle .path1:before,
.panel .panel-menu .panel-link.active .icon-profile-circle .path2:before,
.panel .panel-menu .panel-link.active .icon-profile-circle .path3:before,
.panel .panel-menu .panel-link.active .icon-bag-2 .path1:before,
.panel .panel-menu .panel-link.active .icon-bag-2 .path2:before,
.panel .panel-menu .panel-link.active .icon-bag-2 .path3:before,
.panel .panel-menu .panel-link.active .icon-bag-2 .path4:before,
.panel .panel-menu .panel-link.active .icon-empty-wallet .path1:before,
.panel .panel-menu .panel-link.active .icon-empty-wallet .path2:before,
.panel .panel-menu .panel-link.active .icon-empty-wallet .path3:before,
.panel .panel-menu .panel-link.active .icon-empty-wallet .path4:before,
.panel .panel-menu .panel-link.active .icon-picture-frame .path1:before,
.panel .panel-menu .panel-link.active .icon-picture-frame .path2:before,
.panel .panel-menu .panel-link.active .icon-picture-frame .path3:before,
.panel .panel-menu .panel-link.active .icon-note .path1:before,
.panel .panel-menu .panel-link.active .icon-note .path2:before,
.panel .panel-menu .panel-link.active .icon-note .path3:before,
.panel .panel-menu .panel-link.active .icon-note .path4:before,
.panel .panel-menu .panel-link.active .icon-forward-square .path1:before,
.panel .panel-menu .panel-link.active .icon-forward-square .path2:before,
.panel .panel-menu .panel-link.active .icon-forward-square .path3:before {
  color: #2250a9;
}
.panel .panel-menu .logout-link {
  color: #ff453a;
}
.panel .panel-menu .logout-link .icon-logout .path1:before {
  color: #ff453a;
}
.panel .panel-menu .logout-link .icon-logout .path2:before {
  color: #ff453a;
}
.panel .panel-menu .logout-link .icon-logout .path3:before {
  color: #ff453a;
}
.panel .panel-menu .icon__menu {
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid #eaecf0;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.panel .panel-menu .icon__menu .icon-profile-circle .path1:before,
.panel .panel-menu .icon__menu .icon-profile-circle .path2:before,
.panel .panel-menu .icon__menu .icon-profile-circle .path3:before,
.panel .panel-menu .icon__menu .icon-bag-2 .path1:before,
.panel .panel-menu .icon__menu .icon-bag-2 .path2:before,
.panel .panel-menu .icon__menu .icon-bag-2 .path3:before,
.panel .panel-menu .icon__menu .icon-bag-2 .path4:before,
.panel .panel-menu .icon__menu .icon-empty-wallet .path1:before,
.panel .panel-menu .icon__menu .icon-empty-wallet .path2:before,
.panel .panel-menu .icon__menu .icon-empty-wallet .path3:before,
.panel .panel-menu .icon__menu .icon-empty-wallet .path4:before,
.panel .panel-menu .icon__menu .icon-picture-frame .path1:before,
.panel .panel-menu .icon__menu .icon-picture-frame .path2:before,
.panel .panel-menu .icon__menu .icon-picture-frame .path3:before,
.panel .panel-menu .icon__menu .icon-note .path1:before,
.panel .panel-menu .icon__menu .icon-note .path2:before,
.panel .panel-menu .icon__menu .icon-note .path3:before,
.panel .panel-menu .icon__menu .icon-note .path4:before,
.panel .panel-menu .icon__menu .icon-forward-square .path1:before,
.panel .panel-menu .icon__menu .icon-forward-square .path2:before,
.panel .panel-menu .icon__menu .icon-forward-square .path3:before {
  color: #98a2b3;
}
.panel .panel-box {
  background: #ffffff;
  border: 1px solid #f9fafb;
  border-radius: 12px;
  padding: 20px;
}
.panel .panel-box-header {
  border-bottom: 1px solid #f2f4f7;
  margin-bottom: 30px;
}
.panel .panel-box-header .panel__title {
  font-size: 19px;
  font-weight: 700;
  color: #1c74bd;
  position: relative;
  padding-bottom: 25px;
}
.panel .panel-box-header .panel__title .order-code {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.panel .panel-box-header .panel__title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 280px;
  background: #1c74bd;
  border-radius: 10px;
  height: 3px;
}
.panel .panel-box-header .panel__title .icon-profile-circle,
.panel .panel-box-header .panel__title .icon-note,
.panel .panel-box-header .panel__title .icon-map,
.panel .panel-box-header .panel__title .icon-bag-2,
.panel .panel-box-header .panel__title .icon-forward-square,
.panel .panel-box-header .panel__title .icon-empty-wallet {
  margin-left: 10px;
  font-size: 25px;
}
.panel .panel-box-header .panel__title .icon-empty-wallet .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-empty-wallet .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-empty-wallet .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-empty-wallet .path4:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-bag-2 .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-bag-2 .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-bag-2 .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-bag-2 .path4:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-map .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-map .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-map .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-map .path4:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-map .path5:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-profile-circle .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-profile-circle .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-profile-circle .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-note .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-note .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-note .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-note .path4:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-forward-square .path1:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-forward-square .path2:before {
  color: #1c74bd;
}
.panel .panel-box-header .panel__title .icon-forward-square .path3:before {
  color: #1c74bd;
}
.panel .panel-box-header .edit-info-btn {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #667085;
  background: #f2f4f7;
  border-radius: 6px;
  padding: 6px 30px;
  transition: all 0.2s linear;
}
.panel .panel-box-header .edit-info-btn:hover {
  background: #c7c9cc;
}
.panel .panel-box-header .icon__btn {
  margin-left: 8px;
  padding-left: 8px;
  border-left: 1px solid #d0d5dd;
  display: flex;
  align-items: center;
  justify-content: center;
}
.panel .panel-box-header .icon-empty-wallet-tick {
  font-size: 20px;
}
.panel .panel-box-header .icon-empty-wallet-tick .path1:before {
  color: #667085;
}
.panel .panel-box-header .icon-empty-wallet-tick .path2:before {
  color: #667085;
}
.panel .panel-box-header .icon-empty-wallet-tick .path3:before {
  color: #667085;
}
.panel .panel-box-header .icon-empty-wallet-tick .path4:before {
  color: #667085;
}
.panel .panel-box-header .icon-empty-wallet-tick .path5:before {
  color: #667085;
}
.panel .panel-box-header .icon-empty-wallet-tick .path6:before {
  color: #667085;
}
.panel .panel-box-header .invoice-printing-btn {
  background: #039855;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 14px;
  font-family: "dana-Regular";
  color: #ffffff;
}
.panel .panel-box-header .invoice-printing-btn .icon-printer .path1:before {
  color: #ffffff;
}
.panel .panel-box-header .invoice-printing-btn .icon-printer .path2:before {
  color: #ffffff;
}
.panel .panel-box-header .invoice-printing-btn .icon-printer .path3:before {
  color: #ffffff;
}
.panel .panel-box-header .invoice-printing-btn .icon-printer .path4:before {
  color: #ffffff;
}
.panel .panel-box-header .invoice-printing-btn .icon-printer .path5:before {
  color: #ffffff;
}
.panel .tabs {
  background: #fcfcfd;
  border-radius: 440px;
  width: 100%;
  margin-bottom: 35px;
  overflow-x: auto;
  white-space: nowrap;
}
.panel .tabs .tab-link {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #475467;
  transition: all 0.2s linear;
  padding: 10px 20px;
  position: relative;
  display: block;
}
.panel .tabs .tab-link::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 11px;
  height: 11px;
  border-radius: 10px 10px 0 0;
  transition: all 0.2s linear;
}
.panel .tabs .tab-link:hover {
  font-family: "dana-Bold";
  color: #2250a9;
}
.panel .tabs .tab-link:hover::after {
  background: #2250a9;
}
.panel .tabs li.active .tab-link {
  font-family: "dana-Bold";
  color: #2250a9;
}
.panel .tabs li.active .tab-link::after {
  background: #2250a9;
}
.panel .table-order thead th {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.panel .accordion-order .accordion-item {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}
.panel .accordion-order .accordion-item .accordion-item__button {
  border-radius: 8px;
  background: #e1e5eb;
  padding: 16px;
}
.panel .accordion-order .financial-information-box {
  background: #fbfbfb;
  border-radius: 10px;
}
.panel .accordion-order .financial-information-box .financial-information-date {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .accordion-order .financial-information-box .prices {
  font-size: 16px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .accordion-order .financial-information-box .payment-method_text {
  font-size: 14px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .accordion-order .financial-information-box .payment-method_text span {
  font-size: 12px;
  color: #afb6bc;
}
.panel .accordion-order .financial-information-box ul li {
  margin-bottom: 10px;
}
.panel .accordion-order .financial-information-box ul p {
  font-size: 12px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .accordion-order .financial-information-box ul span {
  font-size: 12px;
  font-family: "dana-Bold";
  color: #afb6bc;
}
.panel .table tbody tr {
  background: #fcfcfd;
  border: 1px solid #f2f4f7;
  border-radius: 9px;
}
.panel .table tbody td,
.panel .view-details-btn {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #475467;
}
.panel .awaiting-payment {
  color: #ff453a !important;
}
.panel .canceled,
.panel .withdrawing-money {
  color: #ff453a !important;
}
.panel .paid,
.panel .deposit {
  color: #34c759 !important;
}
.panel .request-alert {
  background: #fcfcfd;
  border: 1px solid #d92d20;
  border-radius: 8px;
}
.panel .request-alert p {
  font-size: 14px;
  font-weight: 500;
  color: #d92d20;
}
.panel .request-alert .request-alert_desc {
  font-size: 14px;
  font-weight: 500;
  color: #101828;
}
.panel .request-alert .icon-danger {
  margin-left: 10px;
}
.panel .request-alert .icon-danger .path1:before {
  color: #d92d20;
}
.panel .request-alert .icon-danger .path2:before {
  color: #d92d20;
}
.panel .request-alert .icon-danger .path3:before {
  color: #d92d20;
}
.panel .address-item {
  background: #fcfcfd;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.panel .address-item .address-number {
  width: 25px;
  height: 25px;
  border-radius: 5px;
  background: #2084d7;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  margin-left: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.panel .address-item .address-text {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #344054;
}
.panel .address-item .address-btn {
  margin-right: 10px;
  font-size: 20px;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s linear;
}
.panel .address-item .address-btn:hover {
  background: #dde4ed;
}
.panel .address-item .receiver-specifications_text {
  font-size: 14px;
  font-weight: 700;
  color: #495058;
  margin-left: 10px;
}
.panel .address-item .receiver-specifications_list li {
  margin-left: 10px;
}
.panel .address-item .receiver-specifications_list p {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #495058;
  margin-left: 5px;
}
.panel .address-item .receiver-specifications_list span {
  font-size: 14px;
  font-family: "dana-Medium";
  color: #2084d7;
}
.panel .order-item {
  background: #fbfbfb;
  border-radius: 10px;
}
.panel .order-item .prices {
  font-size: 16px;
  font-weight: 700;
  color: #6c757e;
  margin-left: 5px;
}
.panel .order-item .paid,
.panel .order-item .awaiting-payment {
  font-size: 14px;
  font-weight: 700;
}
.panel .order-item .order-item-date {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .order-item .order-item-code {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.panel .order-item .order-item-code span {
  color: #afb6bc;
}
.panel .order-details-item {
  background: #fcfcfd;
  border: 0.795815px solid #f2f4f7;
  border-radius: 9.29135px;
}
.panel .order-details-item p {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #495058;
}
.panel .order-details-item p span {
  font-size: 16px;
  color: #475467;
  margin-right: 5px;
}
.panel .order-details-item .order-status span {
  color: #12b76a;
}
.panel .order-tracking-btn {
  background: #f04438;
  border-radius: 6px;
  padding: 8px 20px;
  font-size: 24px;
  font-weight: 700;
  color: #ffffff;
  transition: all 0.2s linear;
}
.panel .order-tracking-btn:hover {
  background: #b7261c;
}
.panel .order-tracking-btn .icon-d-cube-scan {
  margin-left: 8px;
  padding-left: 8px;
  border-left: 1px solid #d0d5dd;
}
.panel .order-tracking-btn .icon-d-cube-scan .path1:before {
  color: #ffffff;
}
.panel .order-tracking-btn .icon-d-cube-scan .path2:before {
  color: #ffffff;
}
.panel .order-tracking-btn .icon-d-cube-scan .path3:before {
  color: #ffffff;
}
.panel .order-tracking-btn .icon-d-cube-scan .path4:before {
  color: #ffffff;
}
.panel .order-tracking-btn .icon-d-cube-scan .path5:before {
  color: #ffffff;
}
.panel .order-details-title {
  font-size: 19px;
  font-weight: 700;
  color: #2250a9;
  margin-bottom: 20px;
}
.panel .line {
  width: 100%;
  height: 1px;
  background: #e5e5e5;
  margin: 20px 0;
}
.panel .wallet-information {
  background: #fcfcfd;
  border: 1px solid #f2f4f7;
  border-radius: 10px;
}
.panel .wallet-information .line {
  width: 100%;
  height: 1px;
  background: #e1e5eb;
  margin: 15px 0;
}
.panel .wallet-information .inventory-text {
  font-size: 19px;
  font-weight: 700;
  color: #0183ff;
  margin-left: 10px;
}
.panel .wallet-information .balance-amount {
  font-size: 22px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .wallet-information .balance-amount span {
  font-size: 26px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .wallet-information .deposit-withdrawal-amount {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .wallet-information .deposit-withdrawal-amount span {
  font-size: 19px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .wallet-information .wallet-information_text {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #495058;
  margin-left: 10px;
}
.panel .wallet-information .amount-words {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.panel .wallet-item {
  background: #fbfbfb;
  border-radius: 10px;
}
.panel .wallet-item .wallet-item-price {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.panel .wallet-item .wallet-item-price span {
  font-size: 16px;
  font-family: "dana-Bold";
}
.panel .wallet-item .deposit,
.panel .wallet-item .withdrawing-money {
  font-size: 14px;
  font-weight: 700;
}
.panel .wallet-item .wallet-item-date {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #475467;
}
.panel .wallet-item .line {
  width: 100%;
  height: 1px;
  background: #e1e5eb;
  margin: 10px 0;
}
.panel .wallet-item ul p {
  font-size: 12px;
  font-family: "dana-Bold";
  color: #6c757e;
}
.panel .wallet-item ul span {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #475467;
}
.panel .group-input input,
.panel .group-input textarea {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.panel .group-input input:focus,
.panel .group-input textarea:focus {
  border: 1px solid #0183ff;
}
.panel .group-input label {
  font-size: 16px;
  margin-bottom: 10px;
  color: #344054;
  font-family: "dana-Regular";
}
.panel .factor-title {
  font-size: 14px;
  font-weight: 500;
  color: #1d2939;
  margin-bottom: 20px;
}
.panel .submit-panel-btn {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  background: #1c74bd;
  border-radius: 8px;
  padding: 10px 40px;
  border: none;
  transition: all 0.2s linear;
}
.panel .submit-panel-btn:hover {
  background: #1864a3;
}
.panel .styled-select {
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  width: 30%;
}
.panel .group-input_returned {
  width: 50%;
}
.panel .groups-input .group-checkbox {
  margin-left: 20px;
}
.panel .group-checkbox_product {
  padding: 10px;
  background: #f9fafb;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
  width: 50%;
}
.panel .group-checkbox_product label {
  padding: 0 50px 0 0;
}
.panel .group-checkbox_product img {
  width: 45px;
  margin-left: 20px;
}
.panel .group-checkbox_product .pro-name {
  font-size: 16px;
  font-weight: 700;
  color: #1d2939;
  margin-bottom: 5px;
}
.panel .group-checkbox_product .pro-name_en {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #1d2939;
}
.panel .table-cart thead tr {
  background: #f2f4f7;
  border: 1px solid #f2f4f7;
  border-radius: 7.95815px;
}
.panel .table-cart thead th {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #475467;
}
.panel .table-cart tbody tr {
  background: transparent;
  border: none;
  border-bottom: 1px solid #f2f4f7;
}
.panel .table-cart tbody {
  border: 0;
}
.panel .table-cart .product-name_en {
  text-align: right;
}
.panel .file-title {
  font-size: 13px;
  font-weight: 500;
  color: #344054;
}
.panel .file-text {
  font-size: 12px;
  font-family: "dana-Regular";
  color: #475467;
}

.pagination-panel {
  border-top: unset;
}
.pagination-panel .page-link {
  background: #fbfbfb;
}
.pagination-panel .active {
  color: #ffffff;
  background: #1c74bd;
}
.pagination-panel .page-prev {
  margin-left: 5px;
  padding: unset;
}
.pagination-panel .page-next {
  margin-right: unset !important;
  padding: unset;
}

.modal-wallet .payment-method-item {
  background: #fbfbfb;
  border-radius: 8.24298px;
}
.modal-wallet .successful-text {
  font-size: 20px;
  font-weight: 700;
  color: #353a40;
  margin-top: 20px;
}
.modal-wallet .modal-content {
  padding: 30px 40px;
}
.modal-wallet .modal-title {
  font-size: 26px;
  font-weight: 700;
  color: #353a40;
}
.modal-wallet .modal-text {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #495058;
}
.modal-wallet .amount-words {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.modal-wallet .amount-range {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #6c757e;
}
.modal-wallet .input__amout {
  background: #f5f8fa;
  border-radius: 9px;
  padding: 0 10px;
}
.modal-wallet .input__amout input {
  font-size: 39px;
  font-weight: 700;
  color: #6c757e;
  background: transparent;
  text-align: center;
  padding: 5px 0;
  width: inherit;
  border: 0;
}
.modal-wallet .input__amout label {
  font-size: 19px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.modal-wallet .radio-amount label {
  font-family: "dana-Regular";
  font-size: 15px;
  color: #afb6bc;
  background: #fbfbfb;
  border-radius: 7px;
  padding: 10px;
  width: 100%;
}
.modal-wallet .radio-amount label span {
  font-size: 26px;
  color: #6c757e;
}
.modal-wallet .radio-amount label p {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.modal-wallet .radio-amount label::after {
  content: none;
}
.modal-wallet .increase-inventory-btn {
  font-size: 19px;
  font-weight: 700;
  color: #ffffff;
  background: #2250a9;
  border-radius: 12.3645px;
  padding: 10px 40px;
}
.modal-wallet .increase-inventory-btn .icon-bag-2 {
  padding-left: 10px;
  margin-left: 10px;
  border-left: 1px solid rgba(255, 255, 255, 0.5019607843);
  font-size: 20px;
}
.modal-wallet .increase-inventory-btn .icon-bag-2 .path1:before {
  color: #ffffff;
}
.modal-wallet .increase-inventory-btn .icon-bag-2 .path2:before {
  color: #ffffff;
}
.modal-wallet .increase-inventory-btn .icon-bag-2 .path3:before {
  color: #ffffff;
}
.modal-wallet .increase-inventory-btn .icon-bag-2 .path4:before {
  color: #ffffff;
}

.dashboard-mobile .panel-menu,
.dashboard-mobile .panel-info {
  border: none;
  border-radius: 0;
}
.dashboard-mobile .panel-menu .panel-link {
  font-size: 19px;
  color: #475467;
  border-bottom: 1px solid #e1e5eb;
}
.dashboard-mobile .panel-menu .panel-link.logout-link {
  border-bottom: unset;
  color: #f04438;
}
.dashboard-mobile .panel-menu .panel-link .icon-arrow-left-1 {
  color: #afb6bc;
}

.upload-file input {
  display: none;
}
.upload-file .upload-btn {
  margin-bottom: 20px;
  font-size: 14px;
  padding: 10px 20px;
}
.upload-file .file-information {
  font-size: 14px;
  font-weight: 500;
  color: #0c192b;
}

.modal-address .modal-address_title {
  font-size: 28px;
  font-weight: 700;
  color: #353a40;
  margin-bottom: 20px;
}
.modal-address .line {
  width: 100%;
  height: 1px;
  background: #e1e5eb;
  margin: 20px 0;
}
.modal-address .group-input input {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
  background: #ffffff;
  border: 1px solid #f2f4f7;
  border-radius: 8px;
}
.modal-address .group-input input:focus {
  border: 1px solid #0183ff;
}
.modal-address .group-input .required {
  font-size: 12px;
  color: red;
}
.modal-address label {
  font-size: 15px;
  font-family: "dana-Regular";
  color: #495058;
  margin-bottom: 10px;
}
.modal-address .group-radio {
  margin-left: 20px;
}
.modal-address .text-modal-address {
  font-size: 21px;
  font-weight: 700;
  color: #6c757e;
}
.modal-address .submit-address-btn,
.modal-address .cancel-btn {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  width: 248px;
  background: #1c74bd;
  border-radius: 8px;
  padding: 10px 40px;
  border: none;
  transition: all 0.2s linear;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-address .submit-address-btn:hover,
.modal-address .cancel-btn:hover {
  background: #1864a3;
}
.modal-address .cancel-btn {
  color: #afb6bc;
  border: 1px solid #afb6bc;
  background: transparent;
  margin-top: 10px;
}
.modal-address .cancel-btn:hover {
  background: #afb6bc;
  color: #ffffff;
}
.modal-address .accordion .accordion-item {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}
.modal-address .accordion .accordion-item .accordion-item__button {
  border-radius: 8px;
  background: #e1e5eb;
  padding: 16px;
}

.modal-time .modal-title {
  font-size: 18px;
  font-weight: 700;
  border-bottom: 1px solid #e1e5eb;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.modal-time .modal-title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 110px;
  height: 4px;
  background: #2250a9;
}
.modal-time .modal-time-desc {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #afb6bc;
}
.modal-time .group-radio-date {
  margin-left: 20px;
}
.modal-time .group-radio-date label {
  font-size: 14px;
  font-weight: 700;
  color: #6c757e;
  background: #ffffff;
  border: 1px solid #f5f8fa;
  border-radius: 13px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
}
.modal-time .group-radio-date label span {
  font-family: "dana-Regular";
  display: block;
  margin-top: 5px;
}
.modal-time .group-radio-date label::after {
  content: none;
}
.modal-time .group-radio-date label:hover {
  background: #1c74bd;
  color: #ffffff;
}
.modal-time .group-radio-date input:checked ~ label {
  background: #1c74bd;
  color: #ffffff;
}
.modal-time .dates {
  overflow-x: auto;
  margin-bottom: 30px;
}
.modal-time .submit-address-btn,
.modal-time .cancel-btn {
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  width: 248px;
  background: #1c74bd;
  border-radius: 8px;
  padding: 10px 40px;
  border: none;
  transition: all 0.2s linear;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-time .submit-address-btn:hover,
.modal-time .cancel-btn:hover {
  background: #1864a3;
}
.modal-time .cancel-btn {
  color: #afb6bc;
  border: 1px solid #afb6bc;
  background: transparent;
  margin-top: 10px;
}
.modal-time .cancel-btn:hover {
  background: #afb6bc;
  color: #ffffff;
}

.modal-product-specification .modal-content {
  border-radius: 0;
}
.modal-product-specification .number-comment {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #495058;
}
.modal-product-specification .comment-box {
  background: red;
}
.modal-product-specification .modal-title {
  font-size: 18px;
  font-weight: 700;
  border-bottom: 1px solid #e1e5eb;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.modal-product-specification .modal-title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 110px;
  height: 4px;
  background: #2250a9;
}
.modal-product-specification .back-modal {
  background: #eaecf0;
  font-size: 18px;
  font-family: "dana-Regular";
  color: #344054;
  border: 0;
}
.modal-product-specification .modal-body {
  padding: 20px;
}
.modal-product-specification .review-txet {
  margin-bottom: 10px;
  font-size: 14px;
  font-family: "dana-Regular";
  color: #1d2939;
}
.modal-product-specification .technical-specifications_title {
  font-size: 15px;
  font-weight: 700;
  color: #1c74bd;
}
.modal-product-specification .technical-specifications_link p,
.modal-product-specification .technical-specifications_link span {
  font-weight: 700;
  width: 40%;
  background: transparent;
  border-radius: 0;
}
.modal-product-specification .technical-specifications_link span {
  width: 58%;
}

.modal-comment .group-input input,
.modal-comment .group-input textarea {
  font-size: 16px;
  font-family: "dana-Regular";
  color: #98a2b3;
  border: 1px solid #f9fafb;
  background: #f9fafb;
  border-radius: 8px;
}
.modal-comment .group-input input:focus,
.modal-comment .group-input textarea:focus {
  border: 1px solid #0183ff;
}
.modal-comment .group-input label {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #344054;
}
.modal-comment .group-input label span {
  font-size: 12px;
  color: #667085;
}
.modal-comment .submit-comment-btn,
.modal-comment .cancel-comment-btn {
  font-size: 14px;
  font-family: "dana-Regular";
  color: #ffffff;
  padding: 7px 40px;
  background: #1c74bd;
  border: 1px solid #1c74bd;
  border-radius: 8px;
  transition: all 0.2s linear;
}
.modal-comment .submit-comment-btn:hover,
.modal-comment .cancel-comment-btn:hover {
  background: #1c74bd;
}
.modal-comment .cancel-comment-btn {
  margin-left: 10px;
  background: transparent;
  border: 1px solid #98a2b3;
  color: #98a2b3;
}
.modal-comment .cancel-comment-btn:hover {
  color: #ffffff;
  background: #98a2b3;
}

.counter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #2b2827;
  border-radius: 8px;
  padding: 4px 12px 0 12px;
  background: #fff;
}
@media (max-width: 575.98px) {
  .counter {
    padding: 5px 0 0 0;
  }
}
.counter .btn {
  width: 12px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  font-size: 22px;
  cursor: pointer;
  user-select: none;
}
.counter .btn.minus {
  color: #898989;
  font-weight: 600;
}
.counter .btn.plus {
  color: #264aff;
  font-weight: 600;
}
.counter .btn:focus {
  box-shadow: none;
}
.counter input[type=number] {
  width: 16px;
  height: 100%;
  text-align: center;
  border: none;
  font-size: 18px;
  -moz-appearance: textfield;
}
.counter input[type=number]:focus {
  outline: none;
}
.counter input[type=number]::-webkit-outer-spin-button, .counter input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.course-card {
  width: 100%;
  border-radius: 32px;
  background-color: #ffffff;
  padding: 16px;
}
.course-card_img {
  width: 100%;
  height: 288px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.course-card_img img {
  width: 100%;
  height: 100%;
  border-radius: 16px;
  object-fit: cover;
}
.course-card_title {
  margin-bottom: 12px;
  font-weight: 600;
  font-size: 16px;
  color: #000000;
  line-height: 22px;
}
.course-card_details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.course-card_details__item {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
@media (max-width: 767.98px) {
  .course-card_details__item {
    gap: 4px;
  }
}
.course-card_details__item .title {
  font-size: 12px;
  font-weight: 300;
  color: #000000;
}
.course-card_name {
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 300;
  color: #000000;
  display: block;
}
.course-card_price {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 12px;
  gap: 8px;
}
.course-card_price .discount {
  font-size: 12px;
  text-decoration: line-through;
  color: #5b5353;
}
.course-card_price .original {
  color: #2eb03d;
  font-weight: 600;
}
.course-card_btn {
  height: 48px;
  border-radius: 16px;
  gap: 6px;
  font-weight: 600 !important;
}
.course-card.type-2 {
  display: flex;
  gap: 12px;
  background-color: #dde8ff;
}
@media (max-width: 575.98px) {
  .course-card.type-2 {
    flex-direction: column;
  }
}
.course-card.type-2 .course-card_img {
  width: 271px;
  min-width: 271px;
  height: 196px;
}
@media (max-width: 1199.98px) {
  .course-card.type-2 .course-card_img {
    width: 240px;
    min-width: 240px;
  }
}
@media (max-width: 767.98px) {
  .course-card.type-2 .course-card_img {
    width: 210px;
    min-width: 210px;
  }
}
@media (max-width: 575.98px) {
  .course-card.type-2 .course-card_img {
    width: 100%;
    min-width: unset;
  }
}
.course-card.type-2 .course-card_title {
  display: block;
}
.course-card.type-2 .course-card_description {
  font-size: 0.875rem;
  line-height: 22px;
  margin-bottom: 12px;
}
.course-card.type-2 .course-card_details {
  max-width: 70%;
  gap: 4px;
}
.course-card.type-2 .course-card_details__item .title {
  white-space: nowrap;
}
.course-card.type-2 .course-card_start-date {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.course-card.type-2 .course-card_start-date .title {
  font-size: 14px;
  color: #000000;
}
.course-card.type-2 .course-card_meet {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  margin-bottom: 12px;
}
.course-card.type-2 .course-card_meet .title {
  font-size: 14px;
  color: #000000;
}
.course-card.type-2 .course-card_teacher {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  font-size: 14px;
  color: #000000;
}
.course-card.type-2 .course-card_teacher .avatar {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 4px;
}
.course-card.type-2 .course-card_teacher .avatar .img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.course-card.type-2 .course-card_teacher .avatar .img img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.blue-circle-radio label {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  cursor: pointer;
}
.blue-circle-radio label .circle {
  background-color: transparent;
  border: 2px solid #cdcdcd;
  width: 24px;
  height: 24px;
  min-width: 24px;
  position: relative;
  border-radius: 50%;
  transition: all 0.1s ease-out;
}
@media (max-width: 767.98px) {
  .blue-circle-radio label .circle {
    width: 18px;
    min-width: 18px;
    height: 18px;
  }
}
.blue-circle-radio label .title {
  font-size: 18px;
  color: #333333;
}
@media (max-width: 1199.98px) {
  .blue-circle-radio label .title {
    font-size: 16px;
  }
}
@media (max-width: 767.98px) {
  .blue-circle-radio label .title {
    font-size: 14px;
  }
}
.blue-circle-radio input[type=radio] {
  display: none;
}
.blue-circle-radio input[type=radio]:checked + label .circle {
  border-color: #1C74BD;
}
.blue-circle-radio input[type=radio]:checked + label .circle:before {
  content: " ";
  width: 12px;
  height: 12px;
  min-width: 12px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #1C74BD;
}
@media (max-width: 767.98px) {
  .blue-circle-radio input[type=radio]:checked + label .circle:before {
    width: 10px;
    height: 10px;
    min-width: 10px;
  }
}

.dialog {
  visibility: hidden;
  position: fixed;
  z-index: 60;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.dialog-overlay {
  visibility: hidden;
  position: fixed;
  z-index: 5;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
}
.dialog .dialog-content {
  visibility: hidden;
  background-color: #ffffff;
  border-radius: 0.5rem;
  margin-left: auto;
  margin-right: auto;
  padding: 3rem;
  width: 80%;
  z-index: 10;
  position: relative;
  top: 50%;
  transform: scale(0.7) translateY(-50%) !important;
  transition: all 0.07s ease-out;
}
.dialog.open {
  visibility: visible;
}
.dialog.open .dialog-overlay {
  visibility: visible;
  opacity: 1;
}
.dialog.open .dialog-content {
  visibility: visible;
  transform: scale(1) translateY(-50%) !important;
}
.dialog .close-btn {
  cursor: pointer;
}
.dialog.bottom-to-top .dialog-content {
  transition: all 200ms ease-in-out;
  transform: translateY(100%) !important;
  top: unset !important;
  bottom: 0 !important;
  width: 100% !important;
}
.dialog.bottom-to-top.open .dialog-content {
  transform: translateY(0) !important;
}
.dialog.bottom-to-top-mobile .dialog-content {
  @apply max-md:fixed max-md:!transition-all max-md:!translate-y-full max-md:!bottom-0 max-md:!top-[unset] !w-full max-md:!rounded-br-none max-md:!rounded-bl-none;
}
.dialog.bottom-to-top-mobile.open .dialog-content {
  @apply max-md:!fixed max-md:!translate-y-0;
}

input[type=checkbox].switch {
  height: 0;
  width: 0;
  visibility: hidden;
}

label.switch-label {
  cursor: pointer;
  text-indent: -9999px;
  width: 48px;
  height: 25px;
  background-color: #e6e6e6;
  display: block;
  border-radius: 100px;
  position: relative;
  transition: all 0.3s;
}

label.switch-label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 3px;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  border-radius: 9999px;
  transition: all 0.3s;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1490196078);
}

input.switch:checked + label.switch-label {
  background-color: #1C74BD;
}

input.switch:checked + label.switch-label::after {
  left: calc(100% - 3px);
  transform: translateX(-100%);
}

label.switch-label:active::after {
  width: 28px;
}

.special-checkbox * {
  box-sizing: border-box;
}

.special-checkbox .cbx {
  width: 100%;
  user-select: none;
  cursor: pointer;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  transition: all 0.2s ease;
}
.special-checkbox .cbx:hover span.shape {
  border-color: #1C74BD;
}
.special-checkbox .cbx span {
  float: left;
  vertical-align: middle;
  transform: translate3d(0, 0, 0);
}
.special-checkbox .cbx span.shape {
  min-width: 20px;
  min-height: 20px;
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  transform: scale(1);
  border: 1px solid #cccfdb;
  transition: all 0.2s ease;
  box-shadow: 0 1px 1px rgba(0, 16, 75, 0.05);
}
.special-checkbox .cbx span.shape svg {
  position: absolute;
  top: 4px;
  left: 3px;
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 16px;
  stroke-dashoffset: 16px;
  transition: all 0.3s ease;
  transition-delay: 0.1s;
  transform: translate3d(0, 0, 0);
}
.special-checkbox .cbx span.title {
  color: #000000;
  font-size: 1rem;
  font-weight: 500;
  padding-inline-start: 8px;
  white-space: nowrap;
}

.special-checkbox .inp-cbx {
  position: absolute;
  visibility: hidden;
}

.special-checkbox .inp-cbx:checked + .cbx .shape {
  animation: wave-4 0.4s ease;
  background: #1C74BD;
  border-color: #1C74BD;
}

.special-checkbox .inp-cbx:checked + .cbx .shape svg {
  stroke-dashoffset: 0;
}

.special-checkbox .inline-svg {
  position: absolute;
  width: 0;
  height: 0;
  pointer-events: none;
  user-select: none;
}

@-moz-keyframes wave-4 {
  50% {
    transform: scale(0.9);
  }
}
@-webkit-keyframes wave-4 {
  50% {
    transform: scale(0.9);
  }
}
@-o-keyframes wave-4 {
  50% {
    transform: scale(0.9);
  }
}
@keyframes wave-4 {
  50% {
    transform: scale(0.9);
  }
}
@media (min-width: 1200px) {
  .new-accordion {
    font-size: 2rem;
  }
}
@media (min-width: 992px) {
  .new-accordion {
    font-size: 1.25rem;
  }
}
@media (min-width: 768px) {
  .new-accordion {
    font-size: 1.125rem;
  }
}
@media (min-width: 576px) {
  .new-accordion {
    font-size: 1rem;
  }
}
.new-accordion {
  font-size: 0.875rem;
  color: white;
  font-weight: bold;
  position: relative;
  margin: 0;
  cursor: pointer;
}
@media (min-width: 1200px) {
  .new-accordion {
    padding: 1.5rem;
  }
}
@media (min-width: 992px) {
  .new-accordion {
    padding: 1.25rem;
  }
}
.new-accordion {
  padding: 1rem;
  transition: all 0.1s;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.new-accordion .arrow-bottom {
  transition: all 0.1s;
}
.new-accordion.active .arrow-bottom {
  transform: rotate(180deg);
}

.new-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.1s ease-in-out;
}

body {
  font-family: "yekan-bakh";
}

.page-title {
  font-size: 36px;
  font-weight: 700;
  color: #000000;
}
@media (max-width: 1399.98px) {
  .page-title {
    font-size: 32px;
  }
}
@media (max-width: 1199.98px) {
  .page-title {
    font-size: 28px;
  }
}
@media (max-width: 991.98px) {
  .page-title {
    font-size: 24px;
  }
}
@media (max-width: 767.98px) {
  .page-title {
    font-size: 20px;
  }
}
@media (max-width: 575.98px) {
  .page-title {
    font-size: 16px;
  }
}

.hexagon {
  height: 32px;
  aspect-ratio: 0.8660254038;
  clip-path: polygon(-50% 50%, 50% 100%, 150% 50%, 50% 0);
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 7px;
  padding-right: 1px;
  background-color: #f6f8fc;
  font-size: 20px;
  font-weight: 700;
  color: #000000;
}
@media (max-width: 991.98px) {
  .hexagon {
    font-size: 18px;
  }
}
@media (max-width: 767.98px) {
  .hexagon {
    font-size: 16px;
  }
}
@media (max-width: 575.98px) {
  .hexagon {
    font-size: 14px;
  }
}

.noornegar-btn {
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  width: 100%;
  font-size: 16px;
  font-weight: 700;
}
@media (max-width: 767.98px) {
  .noornegar-btn {
    font-size: 14px;
  }
}
.noornegar-btn {
  outline: none;
  border: none;
  cursor: pointer;
  transition: all 0.05s ease;
}

.btn-blue {
  background-color: #1C74BD;
  color: #ffffff;
}
.btn-blue:hover {
  color: #ffffff;
  background-color: #0028f3;
}

.btn-blue-outline {
  background-color: transparent;
  color: #1C74BD;
  border: 1px solid #1C74BD;
}
.btn-blue-outline:hover {
  background-color: #dde8ff;
}

.btn-yellow {
  background-color: #ffae00;
  color: #ffffff;
}

.btn-white-outline {
  border: 1px solid #ffffff;
  color: #ffffff;
  background-color: transparent;
}

.btn-white-shining {
  color: #000000;
  background-color: white;
  box-shadow: 0 10px 24px 0 rgba(255, 255, 255, 0.2392156863);
}

.btn-text {
  background-color: transparent;
  border: 0;
  transition: 0.2s all ease-out;
}
.btn-text:hover {
  border: 1px solid #000000;
}

.course-details {
  font-family: "yekan-bakh";
}

.course {
  margin-top: 32px;
}
.course_title {
  color: #000000;
  font-size: 24px;
  font-weight: 700;
}
@media (max-width: 991.98px) {
  .course_title {
    font-size: 22px;
  }
}
@media (max-width: 767.98px) {
  .course_title {
    font-size: 20px;
    order: 2;
  }
}
@media (max-width: 575.98px) {
  .course_title {
    margin-top: 8px;
  }
}
.course .video-player {
  display: flex;
  margin-top: 48px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIyNCIgaGVpZ2h0PSI1MDMiIHZpZXdCb3g9IjAgMCAxMjI0IDUwMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAgMjRDMCAxMC43NDUyIDEwLjc0NTIgMCAyNCAwSDEyMDBDMTIxMy4yNSAwIDEyMjQgMTAuNzQ1MiAxMjI0IDI0VjQ3OUMxMjI0IDQ5Mi4yNTUgMTIxMy4yNSA1MDMgMTIwMCA1MDNIODQ5LjI5NEg0NDFDNDI3Ljc0NSA1MDMgNDE3IDQ5Mi4yNTUgNDE3IDQ3OVYzMzNWMTkxQzQxNyAxNzcuNzQ1IDQwNi4yNTUgMTY3IDM5MyAxNjdIMjRDMTAuNzQ1MiAxNjcgMCAxNTYuMjU1IDAgMTQzVjc4LjVMMCAyNFoiIGZpbGw9IiNEREU4RkYiLz4KPC9zdmc+Cg==);
  width: 100%;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 532px;
}
@media (max-width: 1399.98px) {
  .course .video-player {
    height: 458px;
  }
}
@media (max-width: 1199.98px) {
  .course .video-player {
    height: 388px;
    margin-top: 36px;
  }
}
@media (max-width: 991.98px) {
  .course .video-player {
    height: 290px;
    margin-top: 32px;
  }
}
@media (max-width: 767.98px) {
  .course .video-player {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzI4IiBoZWlnaHQ9IjI1NiIgdmlld0JveD0iMCAwIDMyOCAyNTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0zMDQgNC44MDE5ZS0wN0MzMTcuMjU1IDIuMTQ5ODhlLTA3IDMyOCAxMC43NDUyIDMyOCAyNEwzMjggMjMyQzMyOCAyNDUuMjU1IDMxNy4yNTUgMjU2IDMwNCAyNTZMMjQgMjU2QzEwLjc0NTIgMjU2IC0xLjA3MjA0ZS0wNSAyNDUuMjU1IC0xLjAxNDFlLTA1IDIzMkwtNy40MDY3MmUtMDYgMTY5LjQ0NkwtMy4xMjUzOGUtMDYgNzEuNTAwMkMtMi41NDU5OWUtMDYgNTguMjQ1NCAxMC43NDUyIDQ3LjUwMDIgMjQgNDcuNTAwMkw5MS4yMDQxIDQ3LjUwMDJDMTAyLjkyMSA0Ny41MDAyIDExMi45MjUgMzkuMDQwMSAxMTQuODcxIDI3LjQ4NjJMMTE2LjEyOSAyMC4wMTQxQzExOC4wNzUgOC40NjAxMiAxMjguMDc5IDIuNTc2ODllLTA2IDEzOS43OTYgMi40NTI1OGUtMDZMMjc5LjUgOS43MDM4NGUtMDdMMzA0IDQuODAxOWUtMDdaIiBmaWxsPSIjRERFOEZGIi8+Cjwvc3ZnPgo=);
    height: 401px;
    margin-top: 24px;
    flex-direction: column;
  }
}
@media (max-width: 575.98px) {
  .course .video-player {
    height: auto;
    background-image: none;
  }
}
.course .video-player .video-container {
  width: 100%;
  height: 100%;
  display: flex;
  padding: 24px;
  max-width: 65%;
}
@media (max-width: 767.98px) {
  .course .video-player .video-container {
    margin-top: 36px;
    max-width: unset;
  }
}
@media (max-width: 575.98px) {
  .course .video-player .video-container {
    margin-top: 20px;
    padding: 0;
  }
}
.course .video-player_video {
  border-radius: 24px;
  width: 100%;
  height: 100%;
}
.course .video-player_details {
  padding-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media (max-width: 575.98px) {
  .course .video-player_details {
    padding-top: 8px;
  }
}
.course .video-player_details__title {
  font-size: 24px;
  color: #000000;
  font-weight: 700;
}
@media (max-width: 991.98px) {
  .course .video-player_details__title {
    display: none;
  }
}
.course .video-player_details__info {
  display: flex;
  align-items: center;
  justify-content: start;
}
.course .video-player_details__info .status {
  color: #264AFF;
  font-size: 20px;
  border-inline-end: 1px solid #000000;
  padding-inline-end: 16px;
}
@media (max-width: 1399.98px) {
  .course .video-player_details__info .status {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .course .video-player_details__info .status {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .course .video-player_details__info .status {
    font-size: 14px;
    padding-inline-end: 12px;
  }
}
@media (max-width: 575.98px) {
  .course .video-player_details__info .status {
    color: #2EB03D;
    font-weight: 600;
  }
}
.course .video-player_details__info .date {
  color: #000000;
  font-size: 20px;
  margin-inline-start: 16px;
}
@media (max-width: 1399.98px) {
  .course .video-player_details__info .date {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .course .video-player_details__info .date {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .course .video-player_details__info .date {
    font-size: 14px;
    margin-inline-start: 12px;
  }
}

.video-player_options-container {
  position: absolute;
  height: -webkit-fill-available;
  left: 12px;
  top: 350px;
  width: 100%;
  pointer-events: none;
}
@media (max-width: 1399.98px) {
  .video-player_options-container {
    top: 320px;
  }
}
@media (max-width: 1199.98px) {
  .video-player_options-container {
    top: 285px;
  }
}
@media (max-width: 991.98px) {
  .video-player_options-container {
    top: 235px;
  }
}
@media (max-width: 767.98px) {
  .video-player_options-container {
    left: unset;
    top: 555px;
    width: calc(100% - 24px);
  }
}
@media (max-width: 575.98px) {
  .video-player_options-container {
    width: 100%;
    position: static;
  }
}
.video-player_options {
  position: sticky;
  top: 16px;
  width: 100%;
  border-radius: 24px;
  background: #264AFF;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 400px;
  margin-right: auto;
  pointer-events: auto;
}
@media (max-width: 1399.98px) {
  .video-player_options {
    max-width: 360px;
  }
}
@media (max-width: 1199.98px) {
  .video-player_options {
    max-width: 300px;
  }
}
@media (max-width: 991.98px) {
  .video-player_options {
    max-width: 230px;
    padding: 16px;
    border-radius: 16px;
  }
}
@media (max-width: 767.98px) {
  .video-player_options {
    max-width: unset;
    border-radius: 24px;
    padding: 24px;
    position: static;
    top: 0;
  }
}
.video-player_options__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.video-player_options__row .key {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 4px;
}
.video-player_options__row .key .avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-player_options__row .key .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
@media (max-width: 991.98px) {
  .video-player_options__row .key .avatar {
    width: 32px;
    height: 32px;
  }
}
.video-player_options__row .key .title {
  color: #ffffff;
  font-size: 20px;
  font-weight: 400;
}
@media (max-width: 1399.98px) {
  .video-player_options__row .key .title {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .video-player_options__row .key .title {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .video-player_options__row .key .title {
    font-size: 14px;
  }
}
.video-player_options__row .value {
  font-size: 20px;
  font-weight: 500;
  color: #ffffff;
}
@media (max-width: 1399.98px) {
  .video-player_options__row .value {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .video-player_options__row .value {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .video-player_options__row .value {
    font-size: 14px;
  }
}
@media (max-width: 767.98px) {
  .video-player_options__row .value {
    font-weight: 700;
  }
}
.video-player_options__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
@media (max-width: 1199.98px) {
  .video-player_options__actions {
    flex-direction: column;
  }
}
@media (max-width: 767.98px) {
  .video-player_options__actions {
    flex-direction: row;
  }
}

.navigation2 {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-top: 24px;
}
@media (max-width: 767.98px) {
  .navigation2 {
    order: 1;
    margin-top: 0;
    margin-bottom: 16px;
  }
}
.navigation2 .icon-home {
  margin-inline-end: 14px;
}
.navigation2_content {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 24px;
  flex-wrap: wrap;
}
@media (max-width: 767.98px) {
  .navigation2_content {
    gap: 16px;
  }
}
@media (max-width: 575.98px) {
  .navigation2_content {
    gap: 8px;
  }
}
.navigation2_content__item {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
@media (max-width: 767.98px) {
  .navigation2_content__item {
    gap: 8px;
  }
}
.navigation2_content__item .icon-arrow-left {
  display: flex;
}
.navigation2_content__item .title {
  color: #292D32;
  transition: all 0.2s ease;
  cursor: pointer;
}
.navigation2_content__item .title:hover {
  color: #000000;
}
.navigation2_content__item .title.active {
  color: #000000;
  font-weight: 600;
}
@media (max-width: 767.98px) {
  .navigation2_content__item .title {
    font-size: 14px;
  }
}
@media (max-width: 575.98px) {
  .navigation2_content__item .title {
    font-size: 12px;
  }
}

@media (max-width: 767.98px) {
  .course-content-section {
    margin-top: 386px;
  }
}
@media (max-width: 575.98px) {
  .course-content-section {
    margin-top: 0;
  }
}

.course-content {
  display: flex;
  align-items: start;
  justify-content: start;
  margin-top: 86px;
  gap: 24px;
}
@media (max-width: 767.98px) {
  .course-content {
    flex-direction: column;
  }
}
@media (max-width: 575.98px) {
  .course-content {
    margin-top: 36px;
  }
}
.course-content_content {
  overflow: auto;
  width: 100%;
  padding-top: 3px;
}
.course-content_content__description {
  font-size: 16px;
  color: #5b5353;
  line-height: 32px;
  margin-top: 16px;
}
@media (max-width: 575.98px) {
  .course-content_content__description {
    margin-top: 12px;
  }
}
.course-content_content .course-episodes {
  margin-top: 32px;
  width: 100%;
}
.course-content_content .course-episodes_count {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 2px;
  font-size: 20px;
  font-weight: 700;
}
.course-content_content .course-episodes_count__count {
  color: #1C74BD;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_count__count {
    font-size: 16px;
  }
}
.course-content_content .course-episodes_count__title {
  color: #000000;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_count__title {
    font-size: 16px;
  }
}
.course-content_content .course-episodes_accordions {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 24px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_accordions {
    gap: 16px;
  }
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper {
  border: 1px solid #e2e2e2;
  border-radius: 24px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion {
  height: 104px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion {
    height: 72px;
  }
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content {
  padding: 0 16px 0 16px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row:last-child {
  margin-bottom: 24px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__title .text {
  color: #000000;
  font-size: 16px;
  font-weight: 500;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left {
  display: flex;
  gap: 16px;
  align-items: center;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left .preview {
  color: #3657ff;
  font-size: 0.875rem;
  padding-top: 2px;
  font-weight: 600;
  cursor: pointer;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left .preview:hover {
  color: #1C74BD;
  text-decoration: underline;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left .time {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left .time .text {
  font-size: 16px;
  font-weight: 500;
  padding-top: 4px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row__left .time .clock {
  color: #1C74BD;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row .accordion.sub-accordion {
  width: 100%;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row .accordion.sub-accordion .accordion-item {
  border: 0;
  border-radius: 0;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row .accordion.sub-accordion .accordion-item__button {
  padding: 0;
  height: auto;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content_row .accordion.sub-accordion .accordion-item.open .arrow-bottom {
  transform: rotate(0);
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion.active + .accordion-content {
  padding-bottom: 32px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion.active .new-accordion_title .session {
  transform: rotate(-4deg);
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion .arrow-bottom {
  display: block;
  transition: all 0.2s ease-out;
  color: #000000;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 5px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
  height: 56px;
  width: 148px;
  border-radius: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  background-color: #ffae00;
  font-size: 24px;
  font-weight: 500;
}
@media (max-width: 1399.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
    width: 132px;
    height: 40px;
    font-size: 20px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
    font-size: 18px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
    width: 124px;
    height: 36px;
    font-size: 18px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
    width: 116px;
    height: 32px;
    font-size: 16px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .session {
    width: 100px;
    height: 32px;
    font-size: 16px;
  }
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
  font-size: 24px;
  font-weight: 500;
  color: #000000;
}
@media (max-width: 1399.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
    font-size: 22px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
    font-size: 20px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
    font-size: 16px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
    font-size: 14px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_title .text {
    font-size: 12px;
  }
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__title .text {
  color: #000000;
  font-size: 16px;
  font-weight: 500;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left {
  display: flex;
  gap: 16px;
  align-items: center;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left .preview {
  color: #3657ff;
  font-size: 0.875rem;
  padding-top: 2px;
  font-weight: 600;
  cursor: pointer;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left .preview:hover {
  color: #1C74BD;
  text-decoration: underline;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left .time {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left .time .text {
  font-size: 16px;
  font-weight: 500;
  padding-top: 4px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion_row__left .time .clock {
  color: #1C74BD;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content {
  gap: 32px !important;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper {
  margin-bottom: 16px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper:last-child {
  margin-bottom: 24px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion {
  height: 40px !important;
  padding: 0 !important;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion.active + .new-accordion-content {
  margin-top: 8px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion .arrow-bottom {
  display: block;
  transition: all 0.2s ease-out;
  color: #000000;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion .text {
  color: #000000;
  font-size: 16px;
  font-weight: 500;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_title .hexagon {
  margin-inline-end: 8px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_title .text {
  margin-inline-end: 12px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left {
  display: flex;
  gap: 16px;
  align-items: center;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left .preview {
  color: #3657ff;
  font-size: 0.875rem;
  padding-top: 2px;
  font-weight: 600;
  cursor: pointer;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left .preview:hover {
  color: #1C74BD;
  text-decoration: underline;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left .time {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left .time .text {
  font-size: 16px;
  font-weight: 500;
  padding-top: 4px;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion_left .time .clock {
  color: #1C74BD;
}
.course-content_content .course-episodes_accordions .course-accordion-wrapper .new-accordion-content .sub-accordion-wrapper .new-accordion-content {
  padding-bottom: 0 !important;
}
.course-content_content .course-episodes_learn {
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_learn {
    margin-top: 24px;
  }
}
.course-content_content .course-episodes_learn__content {
  width: 100%;
  border: 1px solid #e2e2e2;
  border-radius: 24px;
  padding: 36px 24px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-top: 24px;
}
@media (max-width: 1399.98px) {
  .course-content_content .course-episodes_learn__content {
    padding: 32px 24px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_learn__content {
    padding: 28px 20px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_learn__content {
    padding: 24px 18px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_learn__content {
    padding: 20px 16px;
    margin-top: 12px;
    gap: 24px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_learn__content {
    padding: 12px 12px;
  }
}
.course-content_content .course-episodes_learn__content .item {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.course-content_content .course-episodes_learn__content .item .title {
  font-weight: 500;
  color: #000000;
  font-size: 16px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_learn__content .item .title {
    font-size: 14px;
  }
}
.course-content_content .course-episodes_not-suitable {
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_not-suitable {
    margin-top: 24px;
  }
}
.course-content_content .course-episodes_not-suitable__content {
  width: 100%;
  border: 1px solid #e2e2e2;
  border-radius: 24px;
  padding: 36px 24px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-top: 24px;
}
@media (max-width: 1399.98px) {
  .course-content_content .course-episodes_not-suitable__content {
    padding: 32px 24px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_not-suitable__content {
    padding: 28px 20px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_not-suitable__content {
    padding: 24px 18px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_not-suitable__content {
    padding: 20px 16px;
    margin-top: 12px;
    gap: 24px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_not-suitable__content {
    padding: 12px 12px;
  }
}
.course-content_content .course-episodes_not-suitable__content .item {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 10px;
}
.course-content_content .course-episodes_not-suitable__content .item .title {
  font-weight: 500;
  color: #000000;
  font-size: 16px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_not-suitable__content .item .title {
    font-size: 14px;
  }
}
.course-content_content .course-episodes_images {
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_images {
    margin-top: 24px;
  }
}
.course-content_content .course-episodes_images__image {
  width: 100%;
  height: 357px;
  border-radius: 32px;
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_images__image {
    margin-top: 12px;
  }
}
.course-content_content .course-episodes_images__image img {
  width: 100%;
  height: 100%;
  border-radius: 32px;
  object-fit: cover;
}
.course-content_content .course-episodes_faq {
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_faq {
    margin-top: 24px;
  }
}
.course-content_content .course-episodes_faq__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 2px;
}
.course-content_content .course-episodes_faq__title .blue {
  color: #1C74BD;
}
.course-content_content .course-episodes_faq__content {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_faq__content {
    margin-top: 12px;
  }
}
.course-content_content .course-episodes_faq__content .accordion-item {
  border: 1px solid #e2e2e2;
  border-radius: 24px;
}
.course-content_content .course-episodes_faq__content .accordion-item .arrow-bottom {
  display: block;
  transition: all 0.2s ease-out;
  color: #000000;
}
.course-content_content .course-episodes_faq__content .accordion-item.open .arrow-bottom {
  transform: rotate(-180deg);
}
.course-content_content .course-episodes_faq__content .accordion-item__button {
  padding: 0 24px;
  height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "yekan-bakh" !important;
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_faq__content .accordion-item__button {
    height: 84px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_faq__content .accordion-item__button {
    height: 76px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_faq__content .accordion-item__button {
    height: 64px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_faq__content .accordion-item__button {
    height: 56px;
  }
}
.course-content_content .course-episodes_faq__content .accordion-title {
  font-size: 20px;
  color: #000000;
  font-weight: 600;
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_faq__content .accordion-title {
    font-size: 18px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_faq__content .accordion-title {
    font-size: 16px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_faq__content .accordion-title {
    font-size: 14px;
  }
}
.course-content_content .course-episodes_faq__content .accordion-content {
  padding-top: 0 !important;
}
.course-content_content .course-episodes_faq__content .accordion-content_desc {
  font-size: 16px;
  line-height: 24px;
  color: #5b5353;
  text-align: justify;
  padding: 0 24px 24px 24px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_faq__content .accordion-content_desc {
    font-size: 14px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_faq__content .accordion-content_desc {
    font-size: 12px;
  }
}
.course-content_content .course-episodes_comments {
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments {
    margin-top: 24px;
  }
}
.course-content_content .course-episodes_comments__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 2px;
}
.course-content_content .course-episodes_comments__title .blue {
  color: #1C74BD;
}
.course-content_content .course-episodes_comments__carousel {
  display: flex;
  gap: 40px;
  padding: 28px 24px;
  border-radius: 32px;
  border: 1px solid #E2E2E2;
  margin-top: 24px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments__carousel {
    margin-top: 12px;
  }
}
.course-content_content .course-episodes_comments__carousel .carousel-container {
  max-width: 90%;
}
.course-content_content .course-episodes_comments__carousel .item {
  display: flex;
  flex-direction: column;
  gap: 48px;
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments__carousel .item {
    gap: 36px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_comments__carousel .item {
    gap: 24px;
  }
}
.course-content_content .course-episodes_comments__carousel .item .comment {
  font-size: 16px;
  color: #5b5353;
  line-height: 24px;
  text-align: justify;
  max-height: 144px;
  overflow-y: auto;
}
.course-content_content .course-episodes_comments__carousel .item .user {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.course-content_content .course-episodes_comments__carousel .item .user .img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .img {
    width: 40px;
    height: 40px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .img {
    width: 36px;
    height: 36px;
  }
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .img {
    width: 32px;
    height: 32px;
  }
}
.course-content_content .course-episodes_comments__carousel .item .user .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.course-content_content .course-episodes_comments__carousel .item .user .info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.course-content_content .course-episodes_comments__carousel .item .user .info .name {
  color: #000000;
  font-weight: 600;
  font-size: 20px;
}
@media (max-width: 1199.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .info .name {
    font-size: 18px;
  }
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .info .name {
    font-size: 16px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .info .name {
    font-size: 14px;
  }
}
.course-content_content .course-episodes_comments__carousel .item .user .info .role {
  color: #5b5353;
  font-size: 16px;
}
@media (max-width: 991.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .info .role {
    font-size: 14px;
  }
}
@media (max-width: 767.98px) {
  .course-content_content .course-episodes_comments__carousel .item .user .info .role {
    font-size: 12px;
  }
}
.course-content_content .course-episodes_comments__carousel .owl-carousel .owl-dots {
  position: absolute;
  top: 4px;
  left: -44px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.course-content_content .course-episodes_comments__carousel .owl-carousel .owl-dots .owl-dot {
  position: relative;
  width: 8px;
  height: 8px;
  background-color: #E2E2E2;
  border-radius: 50%;
  cursor: pointer;
  z-index: 2;
}
.course-content_content .course-episodes_comments__carousel .owl-carousel .owl-dots .owl-dot:before {
  content: "";
  position: absolute;
  left: 50%;
  top: -17px;
  transform: translateX(-50%);
  width: 1px;
  height: 20px;
  background-color: #E2E2E2;
  z-index: 1;
}
.course-content_content .course-episodes_comments__carousel .owl-carousel .owl-dots .owl-dot:first-child:before {
  display: none;
}
.course-content_content .course-episodes_comments__carousel .owl-carousel .owl-dots .owl-dot.active {
  background-color: #ffae00;
}
.course-content_content .course-episodes_comments__carousel .free-space {
  width: 200px;
}
.course-content_content .course-episodes_opinions {
  margin-top: 80px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 16px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item {
  border-radius: 16px;
  width: 100%;
  padding: 24px;
  background-color: #f5f8ff;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item {
    padding-inline-start: 16px;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: start;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__avatar {
  width: 48px;
  min-width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 16px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__avatar {
    width: 32px;
    min-width: 32px;
    height: 32px;
    margin-inline-end: 6px;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__name {
  color: #2b2827;
  font-size: 0.875rem;
  font-weight: 600;
  margin-inline-end: 12px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__name {
    margin-inline-end: 6px;
    font-size: 0.75rem;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__date {
  color: #5b5353;
  font-size: 0.75rem;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_head__date {
    display: none;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_text {
  font-weight: 500;
  color: #5b5353;
  line-height: 28px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer {
  margin-top: 24px;
  border-inline-start: 4px solid #cdcdcd;
  padding-inline-start: 24px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: start;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__avatar {
  width: 48px;
  min-width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 16px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__avatar {
    width: 32px;
    min-width: 32px;
    height: 32px;
    margin-inline-end: 6px;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__name {
  color: #2b2827;
  font-size: 0.875rem;
  font-weight: 600;
  margin-inline-end: 12px;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__name {
    margin-inline-end: 6px;
    font-size: 0.75rem;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__date {
  color: #5b5353;
  font-size: 0.75rem;
}
@media (max-width: 575.98px) {
  .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_head__date {
    display: none;
  }
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item_answer_text {
  font-weight: 500;
  color: #5b5353;
  line-height: 28px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item .buyer-label, .course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item .support-label {
  width: 40px;
  height: 20px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  margin-inline-start: 8px;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item .buyer-label {
  background-color: #c0daff;
  color: #3657FF;
}
.course-content_content .course-episodes_opinions .opinions-wrapper .opinion-item .support-label {
  background-color: #ddffeb;
  color: #109500;
}
.course-content_content .course-episodes_comment-form {
  margin-top: 48px;
}
.course-content_content .course-episodes_comment-form__form {
  width: 100%;
  border-radius: 16px;
  border: 1px solid #e2e2e2;
  padding: 24px;
  display: flex;
}
.course-content_content .course-episodes_comment-form__form .main-form-control.rating {
  flex-direction: row !important;
}
.course-content_content .course-episodes_comment-form__form .main-form-control.rating .title {
  white-space: nowrap;
}
.course-content_content .course-episodes_comment-form__form .main-form-control input {
  height: 40px !important;
  font-size: 16px !important;
}
.course-content_content .course-episodes_comment-form__form .main-form-control textarea {
  font-size: 16px !important;
  resize: none;
}
.course-content_content .course-episodes_comment-form__form .comment-btn {
  width: 120px;
  height: 48px;
}
.course-content_teacher {
  width: 400px;
  min-width: 400px;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  margin-right: auto;
  margin-top: 16px;
  position: sticky;
  top: 16px;
}
@media (max-width: 1399.98px) {
  .course-content_teacher {
    width: 360px;
    margin-top: 50px;
    min-width: 360px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_teacher {
    width: 300px;
    margin-top: 160px;
    min-width: 300px;
  }
}
@media (max-width: 991.98px) {
  .course-content_teacher {
    width: 230px;
    min-width: 230px;
    min-width: 230px;
    margin-top: 176px;
  }
}
@media (max-width: 767.98px) {
  .course-content_teacher {
    width: unset;
    margin-top: 0;
    margin-top: 0;
  }
}
.course-content_teacher__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
}
.course-content_teacher__row:first-child {
  margin-top: 0;
}
.course-content_teacher__row .key {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 4px;
}
.course-content_teacher__row .key .avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.course-content_teacher__row .key .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
@media (max-width: 991.98px) {
  .course-content_teacher__row .key .avatar {
    width: 32px;
    height: 32px;
  }
}
.course-content_teacher__row .key .title {
  color: #000000;
  font-size: 20px;
  font-weight: 400;
}
@media (max-width: 1399.98px) {
  .course-content_teacher__row .key .title {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_teacher__row .key .title {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .course-content_teacher__row .key .title {
    font-size: 14px;
  }
}
.course-content_teacher__row .value {
  font-size: 20px;
  font-weight: 500;
  color: #000000;
}
@media (max-width: 1399.98px) {
  .course-content_teacher__row .value {
    font-size: 18px;
  }
}
@media (max-width: 1199.98px) {
  .course-content_teacher__row .value {
    font-size: 16px;
  }
}
@media (max-width: 991.98px) {
  .course-content_teacher__row .value {
    font-size: 14px;
  }
}
.course-content_teacher__description {
  font-size: 14px;
  color: #5b5353;
  line-height: 32px;
  margin-top: 16px;
}

.consultation-section {
  background-image: url("./../../img/courses/consultation-bg.png");
  background-repeat: no-repeat;
  width: 100%;
  padding-top: 77px;
  background-color: #f6f8fc;
  margin-top: 104px;
  padding-bottom: 64px;
  background-position: center;
}
@media (max-width: 991.98px) {
  .consultation-section {
    padding-top: 52px;
  }
}
@media (max-width: 767.98px) {
  .consultation-section {
    display: none;
  }
}
.consultation-section .consultation_banner {
  background-color: #3657ff;
  border-radius: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 48px;
  height: 274px;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner {
    padding: 0 32px;
  }
}
.consultation-section .consultation_banner__details {
  display: flex;
  flex-direction: column;
}
.consultation-section .consultation_banner__details .title {
  color: #ffffff;
  font-weight: 700;
  font-size: 36px;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner__details .title {
    font-size: 28px;
  }
}
.consultation-section .consultation_banner__details .subtitle {
  color: #ffffff;
  font-weight: 400;
  font-size: 20px;
  margin-top: 16px;
  opacity: 0.6;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner__details .subtitle {
    font-size: 18px;
  }
}
.consultation-section .consultation_banner__details .action-btn {
  width: 157px;
  height: 52px;
  margin-top: 28px;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner__details .action-btn {
    width: 136px;
    height: 48px;
    margin-top: 20px;
  }
}
.consultation-section .consultation_banner__img {
  display: flex;
  align-items: start;
  justify-content: center;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner__img {
    max-width: 270px;
  }
}
.consultation-section .consultation_banner__img img {
  position: relative;
  bottom: 22px;
  width: 100%;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_banner__img img {
    width: 100%;
    bottom: -22px;
  }
}
.consultation-section .consultation_details__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 48px;
  color: #000000;
  margin-top: 115px;
  font-weight: 700;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_details__title {
    font-size: 36px;
    margin-top: 85px;
  }
}
.consultation-section .consultation_details__title span.red {
  color: #FF6131;
}
.consultation-section .consultation_details__subtitle {
  color: #5b5353;
  font-size: 32px;
  margin-top: 12px;
  display: block;
  text-align: center;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_details__subtitle {
    font-size: 28px;
  }
}
.consultation-section .consultation_details__action {
  margin-top: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
@media (max-width: 991.98px) {
  .consultation-section .consultation_details__action {
    margin-top: 28px;
  }
}
.consultation-section .consultation_details__action .view-btn {
  box-shadow: 0 10px 24px 0 rgba(38, 74, 255, 0.3215686275);
  height: 52px;
  width: 180px;
  font-weight: 600 !important;
}
.consultation-section .consultation_details__action .video-btn {
  height: 52px;
  width: 180px;
  gap: 12px;
  font-weight: 600 !important;
}

#videoPreview .dialog-content {
  background-color: #141414;
  width: 600px;
  padding: 16px !important;
}
@media (max-width: 767.98px) {
  #videoPreview .dialog-content {
    width: 480px;
  }
}
@media (max-width: 575.98px) {
  #videoPreview .dialog-content {
    width: 400px;
  }
}
@media (max-width: 479.98px) {
  #videoPreview .dialog-content {
    width: auto;
    margin: 0 12px;
  }
}
#videoPreview .video-modal-content {
  background: #141414;
  color: white;
  margin: auto;
}
#videoPreview #mainVideo {
  border-radius: 4px;
}
#videoPreview .video-list {
  margin-top: 1rem;
}
#videoPreview .video-list_title {
  font-weight: bold;
  margin-bottom: 1rem;
}
#videoPreview .video-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#videoPreview .video-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 10px;
  cursor: pointer;
  border-radius: 6px;
  transition: background 0.3s;
}
#videoPreview .video-item:hover,
#videoPreview .video-item.active {
  background-color: #2a2a2a;
}
#videoPreview .video-item img {
  width: 64px;
  height: 36px;
  object-fit: cover;
  border-radius: 4px;
}
#videoPreview .video-item .info {
  display: flex;
  justify-content: space-between;
  flex: 1;
  font-size: 14px;
}
#videoPreview .title {
  font-weight: bold;
}
#videoPreview .duration {
  color: #aaa;
}

.dialog-video-preview {
  width: 600px;
}

.courses-cart {
  font-family: yekan-bakh;
}
.courses-cart_body {
  background-color: #F5F5F5;
}
@media (max-width: 991.98px) {
  .courses-cart_body {
    padding-bottom: 80px;
  }
}

.courses-steps {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 256px;
  margin: 64px auto 101px auto;
  position: relative;
}
@media (max-width: 1199.98px) {
  .courses-steps {
    margin-top: 56px;
    margin-bottom: 80px;
  }
}
@media (max-width: 991.98px) {
  .courses-steps {
    margin-top: 48px;
    margin-bottom: 64px;
  }
}
@media (max-width: 767.98px) {
  .courses-steps {
    margin-top: 40px;
    margin-bottom: 56px;
  }
}
@media (max-width: 575.98px) {
  .courses-steps {
    margin-top: 32px;
    margin-bottom: 40px;
    width: 400px;
  }
}
@media (max-width: 479.98px) {
  .courses-steps {
    width: 310px;
  }
}
.courses-steps_item {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  position: relative;
  background-color: #ffffff;
}
@media (max-width: 479.98px) {
  .courses-steps_item {
    width: 48px;
    height: 48px;
  }
}
@media (max-width: 479.98px) {
  .courses-steps_item__icon {
    width: 28px;
  }
}
.courses-steps_item__title {
  position: absolute;
  font-size: 14px;
  color: #767676;
  bottom: -30px;
  white-space: nowrap;
}
@media (max-width: 479.98px) {
  .courses-steps_item__title {
    font-size: 12px;
    bottom: -26px;
  }
}
.courses-steps_item__dashed-line {
  position: absolute;
  width: 128px;
  height: 1px;
  border-top: 1px dashed #000000;
  top: 50%;
  transform: translateY(-50%);
  right: 100%;
}
.courses-steps_item.active {
  box-shadow: 0 4px 16px 0 rgba(170, 170, 170, 0.2392156863);
}
.courses-steps_item.active .courses-steps_item__title {
  color: #000000;
}

.cart-content {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 24px;
  margin-bottom: 200px;
}
@media (max-width: 575.98px) {
  .cart-content {
    gap: 16px;
  }
}
.cart-content_right {
  display: flex;
  flex-direction: column;
  gap: 24px;
  grid-column: 1/8;
}
@media (max-width: 991.98px) {
  .cart-content_right {
    grid-column: 1/13;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right {
    gap: 16px;
  }
}
.cart-content_right .back-arrow-container {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: start;
  width: 100%;
}
@media (max-width: 575.98px) {
  .cart-content_right .back-arrow-container {
    padding: 16px;
  }
}
.cart-content_right .back-arrow-container .back-arrow {
  margin-inline-end: 14px;
}
.cart-content_right .back-arrow-container .back-arrow_title {
  font-size: 20px;
  color: #333333;
  font-weight: 600;
}
@media (max-width: 1199.98px) {
  .cart-content_right .back-arrow-container .back-arrow_title {
    font-size: 18px;
  }
}
@media (max-width: 767.98px) {
  .cart-content_right .back-arrow-container .back-arrow_title {
    font-size: 16px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .back-arrow-container .back-arrow_title {
    font-size: 14px;
  }
}
.cart-content_right .cart-list {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
}
@media (max-width: 991.98px) {
  .cart-content_right .cart-list {
    background-color: transparent;
    padding: 0;
  }
}
.cart-content_right .cart-list_item {
  display: flex;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid #CDCDCD;
  margin-top: 24px;
}
.cart-content_right .cart-list_item:first-child {
  margin-top: 0;
}
@media (max-width: 991.98px) {
  .cart-content_right .cart-list_item {
    margin-top: 16px;
    background-color: #ffffff;
    border-radius: 16px;
    padding: 24px;
    border-bottom: 0;
  }
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item {
    padding: 16px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item {
    gap: 12px;
  }
}
.cart-content_right .cart-list_item .right-section {
  display: flex;
}
.cart-content_right .cart-list_item .right-section .img {
  width: 170px;
  height: 160px;
  border-radius: 8px;
  background-color: #F4F4F4;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-end: 16px;
}
@media (max-width: 991.98px) {
  .cart-content_right .cart-list_item .right-section .img {
    width: 150px;
    height: 150px;
  }
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item .right-section .img {
    width: 130px;
    height: 148px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .right-section .img {
    width: 110px;
    height: 120px;
    background-color: transparent;
  }
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .right-section .img {
    width: 86px;
    height: 107px;
  }
}
.cart-content_right .cart-list_item .right-section .img img {
  width: 100%;
  max-width: 120px;
  object-fit: cover;
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item .right-section .img img {
    width: 100px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .right-section .img img {
    max-width: 80px;
  }
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .right-section .img img {
    width: 65px;
  }
}
.cart-content_right .cart-list_item .right-section .details {
  display: flex;
  flex-direction: column;
}
.cart-content_right .cart-list_item .right-section .details .title-1 {
  display: flex;
  align-items: center;
  margin-bottom: 24px;
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item .right-section .details .title-1 {
    margin-bottom: 16px;
  }
}
.cart-content_right .cart-list_item .right-section .details .title-1 .icon {
  margin-inline-end: 4px;
}
.cart-content_right .cart-list_item .right-section .details .title-1 .t {
  font-size: 16px;
  font-weight: 700;
  color: #333333;
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .right-section .details .title-1 .t {
    font-size: 14px;
  }
}
.cart-content_right .cart-list_item .right-section .details .title-2 {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 24px;
}
.cart-content_right .cart-list_item .right-section .details .title-2 .icon {
  margin-inline-end: 4px;
}
.cart-content_right .cart-list_item .right-section .details .title-2 .t {
  font-size: 14px;
  font-weight: 700;
  color: #898989;
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .right-section .details .title-2 .t {
    font-size: 12px;
  }
}
.cart-content_right .cart-list_item .right-section .details .title-3 {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 8px;
}
.cart-content_right .cart-list_item .right-section .details .title-3 .icon {
  margin-inline-end: 4px;
}
.cart-content_right .cart-list_item .right-section .details .title-3 .t {
  font-size: 14px;
  font-weight: 700;
  color: #898989;
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .right-section .details .title-3 .t {
    font-size: 12px;
  }
}
.cart-content_right .cart-list_item .left-section {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section {
    width: 36%;
  }
}
.cart-content_right .cart-list_item .left-section .top-section {
  display: flex;
  align-items: center;
  margin-bottom: 54px;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .top-section {
    margin-bottom: 24px;
  }
}
.cart-content_right .cart-list_item .left-section .top-section .delete-icon {
  margin-inline-end: 1.5rem;
  cursor: pointer;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .top-section .delete-icon {
    margin-inline-end: 0.5rem;
    margin-inline-start: auto;
  }
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item .left-section .top-section .delete-icon svg {
    width: 26px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .top-section .delete-icon svg {
    width: 24px;
  }
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .left-section .top-section .delete-icon svg {
    width: 22px;
  }
}
.cart-content_right .cart-list_item .left-section .top-section .counter {
  width: 106px;
  height: 38px;
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .left-section .top-section .counter {
    width: 75px;
    height: 30px;
  }
}
.cart-content_right .cart-list_item .left-section .price {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .price {
    gap: 8px;
  }
}
.cart-content_right .cart-list_item .left-section .price_discount {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
@media (max-width: 1199.98px) {
  .cart-content_right .cart-list_item .left-section .price_discount {
    gap: 4px;
  }
}
.cart-content_right .cart-list_item .left-section .price_discount__price {
  font-size: 16px;
  color: #898989;
  text-decoration: line-through;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .price_discount__price {
    font-size: 14px;
  }
}
.cart-content_right .cart-list_item .left-section .price_discount__percent {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 24px;
  border-radius: 6px;
  background-color: #cadcff;
  color: #1C74BD;
  font-size: 16px;
  font-weight: 600;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .price_discount__percent {
    font-size: 14px;
  }
}
.cart-content_right .cart-list_item .left-section .price_original {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #333333;
  font-size: 20px;
  font-weight: 600;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .price_original {
    font-size: 16px;
  }
}
.cart-content_right .cart-list_item .left-section .price {
  font-size: 20px;
  font-weight: 700;
  color: #374151;
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_item .left-section .price {
    font-size: 18px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_item .left-section .price {
    font-size: 16px;
  }
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_item .left-section .price {
    font-size: 14px;
  }
}
.cart-content_right .cart-list_course-item {
  margin-top: 24px;
  background-color: #dde8ff;
  border-radius: 32px;
  padding: 32px 16px;
  display: flex;
  gap: 20px;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_course-item {
    gap: 12px;
  }
}
.cart-content_right .cart-list_course-item_img {
  width: 184px;
  height: 168px;
  min-width: 144px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 767.98px) {
  .cart-content_right .cart-list_course-item_img {
    height: 144px;
  }
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_course-item_img {
    width: 124px;
    height: 124px;
    min-width: 124px;
  }
}
@media (max-width: 479.98px) {
  .cart-content_right .cart-list_course-item_img {
    width: 100px;
    height: 100px;
    min-width: 100px;
  }
}
.cart-content_right .cart-list_course-item_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.cart-content_right .cart-list_course-item_details {
  display: flex;
  flex-direction: column;
}
.cart-content_right .cart-list_course-item_details__title {
  color: #000000;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 12px;
  display: block;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_course-item_details__title {
    font-size: 0.875rem;
    font-weight: 700;
  }
}
.cart-content_right .cart-list_course-item_details__more {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
  margin-bottom: 12px;
}
@media (max-width: 575.98px) {
  .cart-content_right .cart-list_course-item_details__more {
    flex-wrap: wrap;
  }
}
.cart-content_right .cart-list_course-item_details__more .item {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.cart-content_right .cart-list_course-item_details__more .item .title {
  font-weight: 300;
  font-size: 0.875rem;
  color: #000000;
}
.cart-content_right .cart-list_course-item_details__start-date {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}
.cart-content_right .cart-list_course-item_details__start-date .title {
  font-size: 14px;
  color: #000000;
}
.cart-content_right .cart-list_course-item_details__meet {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  margin-bottom: 8px;
}
.cart-content_right .cart-list_course-item_details__meet .title {
  font-size: 14px;
  color: #000000;
}
.cart-content_right .cart-list_course-item_details__teacher {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  font-size: 14px;
  color: #000000;
}
.cart-content_right .cart-list_course-item_details__teacher .avatar {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 4px;
}
.cart-content_right .cart-list_course-item_details__teacher .avatar .img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cart-content_right .cart-list_course-item_details__teacher .avatar .img img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}
.cart-content_left {
  grid-column: 8/13;
}
@media (max-width: 991.98px) {
  .cart-content_left {
    grid-column: 1/13;
  }
}
.cart-content_left .price-details {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 16px;
}
@media (min-width: 992px) {
  .cart-content_left .price-details {
    position: sticky;
    top: 24px;
  }
}
.cart-content_left .price-details_title {
  display: block;
  text-align: center;
  color: #333333;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 3rem;
}
@media (max-width: 1199.98px) {
  .cart-content_left .price-details_title {
    font-size: 1.25rem;
  }
}
@media (max-width: 991.98px) {
  .cart-content_left .price-details_title {
    font-size: 1.125rem;
    margin-bottom: 2.5rem;
  }
}
@media (max-width: 767.98px) {
  .cart-content_left .price-details_title {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_title {
    margin-bottom: 32px;
  }
}
@media (max-width: 479.98px) {
  .cart-content_left .price-details_title {
    font-size: 0.875rem;
    margin-bottom: 24px;
  }
}
.cart-content_left .price-details_row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  width: 100%;
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_row {
    margin-bottom: 16px;
  }
}
.cart-content_left .price-details_row .key {
  color: #333333;
  font-size: 1rem;
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_row .key {
    font-size: 0.875rem;
  }
}
.cart-content_left .price-details_row .key.success {
  color: #3db058;
}
.cart-content_left .price-details_row .key.bold {
  font-size: 1.25rem;
  font-weight: 600;
}
@media (max-width: 767.98px) {
  .cart-content_left .price-details_row .key.bold {
    font-size: 1.125rem;
  }
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_row .key.bold {
    font-size: 1rem;
  }
}
.cart-content_left .price-details_row .value {
  color: #000000;
  font-size: 1rem;
  font-weight: 600;
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_row .value {
    font-size: 0.875rem;
  }
}
.cart-content_left .price-details_row .value.success {
  color: #3db058;
}
.cart-content_left .price-details_row .value.bold {
  font-size: 1.25rem;
  font-weight: 600;
}
@media (max-width: 767.98px) {
  .cart-content_left .price-details_row .value.bold {
    font-size: 1.125rem;
  }
}
@media (max-width: 575.98px) {
  .cart-content_left .price-details_row .value.bold {
    font-size: 1rem;
  }
}
.cart-content_left .price-details_row.border-b {
  padding-bottom: 24px;
  border-bottom: 1px solid #cdcdcd;
}
.cart-content_left .price-details_btn {
  width: 100%;
  height: 56px;
  margin-top: 48px;
}
@media (max-width: 991.98px) {
  .cart-content_left .price-details_btn {
    display: none;
  }
}

.empty-cart-banner {
  width: 808px;
  max-width: 100%;
  height: 224px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto;
  background-image: url("./../../img/cart/empty-cart-banner.png");
  background-color: #dde8ff;
}
@media (max-width: 991.98px) {
  .empty-cart-banner {
    width: 751px;
  }
}
@media (max-width: 767.98px) {
  .empty-cart-banner {
    width: 600px;
    height: 184px;
  }
}
@media (max-width: 575.98px) {
  .empty-cart-banner {
    width: 470px;
    height: 140px;
  }
}
@media (max-width: 479.98px) {
  .empty-cart-banner {
    width: 100%;
    height: 100px;
  }
}
.empty-cart-banner_title {
  font-size: 22px;
  font-weight: 700;
  color: #333333;
}
@media (max-width: 575.98px) {
  .empty-cart-banner_title {
    font-size: 18px;
  }
}
@media (max-width: 479.98px) {
  .empty-cart-banner_title {
    font-size: 14px;
  }
}
.empty-cart-banner_subtitle {
  font-size: 16px;
  color: #898989;
  margin-top: 32px;
  text-align: center;
}
@media (max-width: 575.98px) {
  .empty-cart-banner_subtitle {
    font-size: 14px;
    margin-top: 16px;
  }
}
@media (max-width: 479.98px) {
  .empty-cart-banner_subtitle {
    font-size: 12px;
    margin-top: 4px;
    max-width: 80%;
  }
}

.recent-views {
  margin: 64px 0 150px 0;
}
@media (max-width: 991.98px) {
  .recent-views {
    margin: 48px 0 150px 0;
  }
}
@media (max-width: 767.98px) {
  .recent-views {
    margin: 40px 0 150px 0;
  }
}
@media (max-width: 575.98px) {
  .recent-views {
    margin: 32px 0 150px 0;
  }
}
.recent-views .divider {
  width: 48px;
  height: 4px;
  border-radius: 12px;
  background-color: #ffae00;
  margin-bottom: 24px;
  position: relative;
}
@media (max-width: 991.98px) {
  .recent-views .divider {
    width: 40px;
    margin-bottom: 16px;
  }
}
@media (max-width: 767.98px) {
  .recent-views .divider {
    width: 32px;
  }
}
@media (max-width: 575.98px) {
  .recent-views .divider {
    width: 24px;
    height: 4px;
  }
}
.recent-views .divider .star {
  position: absolute;
  left: -40px;
  top: 50%;
  transform: translateY(-50%);
}
.recent-views_products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 24px;
}
@media (max-width: 1199.98px) {
  .recent-views_products {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 991.98px) {
  .recent-views_products {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767.98px) {
  .recent-views_products {
    gap: 16px;
  }
}
@media (max-width: 575.98px) {
  .recent-views_products {
    grid-template-columns: repeat(1, 1fr);
    gap: 12px;
  }
}
.recent-views_products .course-card {
  grid-column: span 1/span 1;
}

.mobile-next-step-panel {
  background-color: #ffffff;
  width: 100%;
  position: fixed;
  height: 80px;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 32px;
  border-top: 1px solid #cdcdcd;
  z-index: 5;
}
@media (max-width: 575.98px) {
  .mobile-next-step-panel {
    padding: 0 16px;
  }
}
@media (min-width: 992px) {
  .mobile-next-step-panel {
    display: none;
  }
}
.mobile-next-step-panel .next-btn {
  width: 136px;
  height: 48px;
  border-radius: 12px !important;
}
.mobile-next-step-panel .price {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
@media (min-width: 768px) {
  .mobile-next-step-panel .price {
    gap: 8px;
  }
}
.mobile-next-step-panel .price .title {
  color: #000000;
  font-size: 12px;
  font-weight: 500;
}
@media (min-width: 768px) {
  .mobile-next-step-panel .price .title {
    font-size: 14px;
  }
}
.mobile-next-step-panel .price .num {
  color: #000000;
  font-size: 14px;
  font-weight: 700;
}
@media (min-width: 768px) {
  .mobile-next-step-panel .price .num {
    font-size: 16px;
  }
}

.delivery-card {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 16px;
}
@media (max-width: 479.98px) {
  .delivery-card {
    padding: 16px;
    margin-bottom: 12px;
  }
}
.delivery-card_header {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #cdcdcd;
  padding-bottom: 24px;
}
@media (max-width: 575.98px) {
  .delivery-card_header {
    padding-bottom: 16px;
  }
}
.delivery-card_header__title {
  font-size: 20px;
  font-weight: 700;
  color: #333333;
}
@media (max-width: 767.98px) {
  .delivery-card_header__title {
    font-size: 1rem;
  }
}
@media (max-width: 479.98px) {
  .delivery-card_header__title {
    font-size: 0.875rem;
  }
}
.delivery-card_content {
  margin-top: 24px;
}
.delivery-addresses_user__send-to {
  font-size: 18px;
  color: #333333;
  margin-inline-end: 8px;
}
@media (max-width: 991.98px) {
  .delivery-addresses_user__send-to {
    font-size: 1rem;
  }
}
@media (max-width: 767.98px) {
  .delivery-addresses_user__send-to {
    font-size: 0.875rem;
  }
}
.delivery-addresses_user__name {
  font-size: 20px;
  font-weight: 700;
  color: #333333;
}
@media (max-width: 767.98px) {
  .delivery-addresses_user__name {
    font-size: 1rem;
  }
}
@media (max-width: 479.98px) {
  .delivery-addresses_user__name {
    font-size: 0.875rem;
  }
}
.delivery-addresses_address {
  margin-top: 24px;
  display: flex;
  align-items: center;
}
@media (max-width: 575.98px) {
  .delivery-addresses_address {
    margin-top: 16px;
  }
}
.delivery-addresses_address__text {
  color: #2b2827;
  font-weight: 500;
  font-size: 1rem;
  line-height: 25px;
}
@media (max-width: 767.98px) {
  .delivery-addresses_address__text {
    font-size: 0.875rem;
  }
}
@media (max-width: 479.98px) {
  .delivery-addresses_address__text {
    font-size: 0.75rem;
  }
}
.delivery-addresses_btn {
  width: 166px;
  height: 40px;
  border-radius: 8px !important;
  margin-inline-start: auto;
  margin-top: 32px;
  font-weight: 400 !important;
}
@media (max-width: 767.98px) {
  .delivery-addresses_btn {
    margin-top: 24px;
  }
}
@media (max-width: 479.98px) {
  .delivery-addresses_btn {
    margin-top: 16px;
  }
}
.delivery-method-radios {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  row-gap: 24px;
  column-gap: 48px;
  padding-bottom: 70px;
}
@media (max-width: 767.98px) {
  .delivery-method-radios {
    padding-bottom: 40px;
    column-gap: 32px;
    row-gap: 20px;
  }
}
.delivery-method-radios_item {
  grid-column: span 1/span 1;
}
.delivery-days-radios {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 24px;
  flex-wrap: wrap;
  width: 100%;
}
.delivery-hours-radios {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 24px;
  flex-wrap: wrap;
  width: 100%;
}
.delivery-discount-code, .delivery-gift-code {
  height: 102px;
  width: 100%;
  border-radius: 16px;
  background-color: #ffffff;
  padding: 0 24px;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 767.98px) {
  .delivery-discount-code, .delivery-gift-code {
    height: 90px;
  }
}
@media (max-width: 575.98px) {
  .delivery-discount-code, .delivery-gift-code {
    height: 80px;
  }
}
@media (max-width: 479.98px) {
  .delivery-discount-code, .delivery-gift-code {
    padding: 12px;
    height: auto;
    flex-direction: column;
    justify-content: start;
    align-items: start;
    gap: 16px;
  }
}
.delivery-discount-code_title, .delivery-gift-code_title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
.delivery-discount-code_title .text, .delivery-gift-code_title .text {
  color: #898989;
  font-size: 18px;
}
@media (max-width: 991.98px) {
  .delivery-discount-code_title .text, .delivery-gift-code_title .text {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .delivery-discount-code_title .text, .delivery-gift-code_title .text {
    font-size: 0.875rem;
  }
}
.delivery-discount-code_action, .delivery-gift-code_action {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
@media (max-width: 479.98px) {
  .delivery-discount-code_action, .delivery-gift-code_action {
    width: 100%;
  }
}
.delivery-discount-code_action input, .delivery-gift-code_action input {
  height: 54px;
  border-radius: 8px;
  padding-inline-start: 16px;
  border: 1px solid #cdcdcd;
  color: #333333;
  font-size: 0.875rem;
  width: 221px;
}
@media (max-width: 767.98px) {
  .delivery-discount-code_action input, .delivery-gift-code_action input {
    height: 48px;
  }
}
@media (max-width: 575.98px) {
  .delivery-discount-code_action input, .delivery-gift-code_action input {
    height: 40px;
    width: 180px;
  }
}
@media (max-width: 479.98px) {
  .delivery-discount-code_action input, .delivery-gift-code_action input {
    width: 100%;
  }
}
.delivery-discount-code_action .action-btn, .delivery-gift-code_action .action-btn {
  width: 91px;
  height: 54px;
  border-radius: 8px !important;
}
@media (max-width: 767.98px) {
  .delivery-discount-code_action .action-btn, .delivery-gift-code_action .action-btn {
    height: 48px;
  }
}
@media (max-width: 575.98px) {
  .delivery-discount-code_action .action-btn, .delivery-gift-code_action .action-btn {
    height: 40px;
    width: 80px;
  }
}
.delivery-payment-type {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
}
.delivery-payment-type_item {
  background-color: #ffffff;
  width: 100%;
  border-radius: 16px;
  padding: 16px;
}
.delivery-bank-options {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 16px;
  margin-bottom: 24px;
}
@media (max-width: 479.98px) {
  .delivery-bank-options {
    padding: 1rem;
  }
}
.delivery-bank-options__list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
@media (max-width: 991.98px) {
  .delivery-bank-options__list {
    gap: 18px;
  }
}
@media (max-width: 767.98px) {
  .delivery-bank-options__list {
    gap: 16px;
  }
}
@media (max-width: 575.98px) {
  .delivery-bank-options__list {
    gap: 12px;
  }
}
.delivery-bank-options .bank-radio__input {
  display: none;
}
.delivery-bank-options .bank-radio__input:checked + label {
  border: 1px solid #333333;
}
.delivery-bank-options .bank-radio__label {
  cursor: pointer;
  width: 100%;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.375rem;
  border: 1px solid #cdcdcd;
  padding-left: 24px;
  padding-right: 24px;
}
@media (max-width: 575.98px) {
  .delivery-bank-options .bank-radio__label {
    height: 55px;
    padding-left: 16px;
    padding-right: 16px;
  }
}
@media (max-width: 479.98px) {
  .delivery-bank-options .bank-radio__label {
    height: 3rem;
    padding-left: 8px;
    padding-right: 8px;
  }
}
.delivery-bank-options .bank-radio__info {
  display: flex;
  align-items: center;
}
.delivery-bank-options .bank-radio__logo {
  max-width: 1.5rem;
  margin-inline-end: 0.75rem;
}
@media (max-width: 575.98px) {
  .delivery-bank-options .bank-radio__logo {
    margin-inline-end: 0.5rem;
  }
}
.delivery-bank-options .bank-radio__name {
  font-size: 1.125rem;
  color: #333333;
  font-weight: 500;
}
@media (max-width: 991.98px) {
  .delivery-bank-options .bank-radio__name {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .delivery-bank-options .bank-radio__name {
    font-size: 0.875rem;
  }
}
.delivery-bank-options .bank-radio__desc {
  font-size: 1rem;
  color: #cdcdcd;
}
@media (max-width: 575.98px) {
  .delivery-bank-options .bank-radio__desc {
    font-size: 0.875rem;
  }
}
@media (max-width: 479.98px) {
  .delivery-bank-options .bank-radio__desc {
    font-size: 0.75rem;
  }
}
.delivery-from-credit {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 24px;
}
@media (max-width: 479.98px) {
  .delivery-from-credit {
    padding: 16px;
    margin-bottom: 16px;
  }
}
.delivery-from-credit_content {
  display: flex;
}
@media (min-width: 576px) {
  .delivery-from-credit_content {
    justify-content: space-between;
  }
}
@media (max-width: 575.98px) {
  .delivery-from-credit_content {
    flex-direction: column;
    gap: 16px;
  }
}
.delivery-from-credit_content__icon {
  margin-inline-end: 12px;
}
.delivery-from-credit_content__text {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
  font-size: 1rem;
}
@media (max-width: 479.98px) {
  .delivery-from-credit_content__text {
    font-size: 0.875rem;
  }
}
.delivery-from-credit_content__text .gray {
  color: #898989;
}
.delivery-from-credit_content__text .dark {
  color: #333333;
  font-weight: 500;
}
.delivery-from-credit_content__left {
  display: flex;
  align-items: center;
  justify-content: start;
}
@media (max-width: 575.98px) {
  .delivery-from-credit_content__left {
    width: 100%;
    justify-content: space-between;
  }
}
.delivery-from-credit_content__left .title {
  font-size: 1pxrem;
  color: #5b5353;
  margin-inline-end: 24px;
}
@media (max-width: 575.98px) {
  .delivery-from-credit_content__left .title {
    font-size: 0.875rem;
  }
}

.no-addresses {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 48px;
}
@media (max-width: 767.98px) {
  .no-addresses {
    padding: 32px;
  }
}
@media (max-width: 575.98px) {
  .no-addresses {
    padding: 24px;
  }
}
.no-addresses_shape {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: #f4f4f4;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin-bottom: 24px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 767.98px) {
  .no-addresses_shape {
    width: 48px;
    height: 48px;
    margin-bottom: 16px;
  }
}
@media (max-width: 767.98px) {
  .no-addresses_shape__mid-icon {
    width: 28px;
  }
}
.no-addresses_shape__right-icon {
  position: absolute;
  top: 0;
  inset-inline-start: -50px;
}
.no-addresses_shape__left-icon {
  position: absolute;
  top: 0;
  inset-inline-end: -50px;
}
.no-addresses_title {
  color: #333333;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  justify-content: center;
  margin-bottom: 24px;
}
@media (max-width: 991.98px) {
  .no-addresses_title {
    margin-bottom: 16px;
  }
}
@media (max-width: 767.98px) {
  .no-addresses_title {
    font-size: 0.875rem;
    margin-bottom: 12px;
  }
}
@media (max-width: 479.98px) {
  .no-addresses_title {
    font-size: 0.75rem;
  }
}
.no-addresses_text {
  font-size: 1rem;
  color: #898989;
  margin-bottom: 24px;
  text-align: center;
}
@media (max-width: 767.98px) {
  .no-addresses_text {
    font-size: 0.75rem;
    margin-bottom: 16px;
  }
}
.no-addresses_btn {
  width: 166px;
  height: 40px;
  border-radius: 8px !important;
  font-weight: 400 !important;
}
@media (max-width: 767.98px) {
  .no-addresses_btn {
    width: 136px;
  }
}

.choose-address-modal {
  width: 80%;
  height: fit-content;
  padding: 1.5rem;
  max-width: 981px;
}
@media (max-width: 575.98px) {
  .choose-address-modal {
    width: 90% !important;
    height: fit-content;
    padding: 1.5rem;
  }
}
@media (max-width: 479.98px) {
  .choose-address-modal {
    width: 95% !important;
  }
}
.choose-address-modal_title {
  color: #333333;
  font-size: 1.5rem;
  font-weight: bold;
  display: block;
  width: 100%;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #cdcdcd;
  margin-bottom: 1.5rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_title {
    font-size: 1.25rem;
  }
}
@media (max-width: 767.98px) {
  .choose-address-modal_title {
    font-size: 1.125rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_title {
    font-size: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
  }
}
.choose-address-modal_list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-height: 500px;
  overflow-y: auto;
}
@media (max-width: 575.98px) {
  .choose-address-modal_list {
    padding-inline-end: 1rem;
    gap: 8px;
  }
}
.choose-address-modal_list__item {
  width: 100%;
  padding: 1.5rem;
  border-radius: 0.375rem;
  border: 1px solid #898989;
}
@media (max-width: 479.98px) {
  .choose-address-modal_list__item {
    border-radius: 0;
    padding: 0.5rem 1rem;
    border-width: 0 0 1px;
  }
}
.choose-address-modal_list__item .head {
  display: flex;
  align-items: center;
}
.choose-address-modal_list__item .head-icon {
  border-radius: 9999px;
  width: 2rem;
  height: 2rem;
  background-color: #f3f4f6;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-inline-end: 1rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .head-icon {
    margin-inline-end: 0.75rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .head-icon {
    width: 24px;
    height: 24px;
    margin-inline-end: 8px;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .head-icon svg {
    width: 16px;
    height: 16px;
  }
}
.choose-address-modal_list__item .head-title {
  font-size: 1rem;
  font-weight: bold;
  color: #333333;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .head-title {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .head-title {
    font-size: 0.75rem;
  }
}
.choose-address-modal_list__item__address {
  font-size: 1rem;
  color: #898989;
  margin-top: 24px;
  margin-bottom: 42px;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item__address {
    font-size: 0.875rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item__address {
    font-size: 0.75rem;
    margin-top: 0.75rem;
    margin-bottom: 1.5rem;
  }
}
.choose-address-modal_list__item .address-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details {
    flex-direction: column;
    gap: 1rem;
  }
}
.choose-address-modal_list__item .address-details_right {
  display: flex;
  align-items: center;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_right {
    margin-inline-end: auto;
  }
}
@media (max-width: 479.98px) {
  .choose-address-modal_list__item .address-details_right {
    flex-direction: column;
    gap: 0.75rem;
  }
}
.choose-address-modal_list__item .address-details_right__postal-code {
  display: flex;
  align-items: center;
  margin-inline-end: 1.5rem;
}
@media (max-width: 479.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code {
    margin-inline-end: auto;
  }
}
.choose-address-modal_list__item .address-details_right__postal-code .icon {
  border-radius: 9999px;
  width: 2rem;
  height: 2rem;
  background-color: #f3f4f6;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-inline-end: 1rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code .icon {
    margin-inline-end: 0.75rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code .icon {
    width: 24px;
    height: 24px;
    margin-inline-end: 8px;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code .icon svg {
    width: 14px;
    height: 14px;
  }
}
.choose-address-modal_list__item .address-details_right__postal-code .text {
  font-size: 1rem;
  font-weight: bold;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code .text {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__postal-code .text {
    font-size: 0.75rem;
  }
}
.choose-address-modal_list__item .address-details_right__postal-code .text.gray {
  color: #898989;
}
.choose-address-modal_list__item .address-details_right__postal-code .text.dark {
  color: #333333;
}
.choose-address-modal_list__item .address-details_right__phone {
  display: flex;
  align-items: center;
}
.choose-address-modal_list__item .address-details_right__phone .icon {
  border-radius: 9999px;
  width: 2rem;
  height: 2rem;
  background-color: #f3f4f6;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-inline-end: 1rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_right__phone .icon {
    margin-inline-end: 0.75rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__phone .icon {
    width: 24px;
    height: 24px;
    margin-inline-end: 8px;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__phone .icon svg {
    width: 14px;
    height: 14px;
  }
}
.choose-address-modal_list__item .address-details_right__phone .text {
  font-size: 1rem;
  font-weight: bold;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_right__phone .text {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_right__phone .text {
    font-size: 0.75rem;
  }
}
.choose-address-modal_list__item .address-details_right__phone .text.gray {
  color: #898989;
}
.choose-address-modal_list__item .address-details_right__phone .text.dark {
  color: #333333;
}
.choose-address-modal_list__item .address-details_left {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_left {
    margin-inline-start: auto;
  }
}
.choose-address-modal_list__item .address-details_left__edit {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.choose-address-modal_list__item .address-details_left__edit .text {
  color: #6b7280;
  font-size: 1rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_left__edit .text {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_left__edit .text {
    font-size: 0.75rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_left__edit svg {
    width: 18px;
    height: 18px;
  }
}
.choose-address-modal_list__item .address-details_left__delete {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.choose-address-modal_list__item .address-details_left__delete .text {
  color: #dc3545;
  font-size: 1rem;
}
@media (max-width: 991.98px) {
  .choose-address-modal_list__item .address-details_left__delete .text {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_left__delete .text {
    font-size: 0.75rem;
  }
}
@media (max-width: 575.98px) {
  .choose-address-modal_list__item .address-details_left__delete svg {
    width: 18px;
    height: 18px;
  }
}
.choose-address-modal_list input[type=radio] {
  display: none;
}
.choose-address-modal_list input[type=radio]:checked + label .choose-address-modal_list__item {
  border: 1px solid #1C74BD;
  border-radius: 0.375rem;
}
.choose-address-modal_list label {
  width: 100%;
}
.choose-address-modal_actions {
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1.5rem;
}
@media (max-width: 575.98px) {
  .choose-address-modal_actions {
    gap: 8px;
  }
}
.choose-address-modal_actions__add {
  width: 160px !important;
  height: 3rem;
  border-radius: 0.375rem !important;
  font-weight: 600 !important;
}
@media (max-width: 575.98px) {
  .choose-address-modal_actions__add {
    height: 2.5rem !important;
  }
}
.choose-address-modal_actions__cancel {
  width: 91px !important;
  height: 3rem;
  border-radius: 0.375rem !important;
}
@media (max-width: 575.98px) {
  .choose-address-modal_actions__cancel {
    height: 2.5rem !important;
  }
}

.new-address-dialog {
  max-width: 888px;
  overflow-y: auto;
}
@media (max-width: 991.98px) {
  .new-address-dialog {
    width: 90% !important;
  }
}
@media (max-width: 767.98px) {
  .new-address-dialog {
    padding: 2rem !important;
  }
}
@media (max-width: 575.98px) {
  .new-address-dialog {
    max-height: 90vh;
  }
}
@media (max-width: 479.98px) {
  .new-address-dialog {
    width: 100% !important;
    border-radius: 0 !important;
  }
}
.new-address-dialog_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #E4E3E1;
  margin-bottom: 3rem;
}
@media (max-width: 991.98px) {
  .new-address-dialog_head {
    margin-bottom: 2.25rem;
  }
}
@media (max-width: 575.98px) {
  .new-address-dialog_head {
    padding-bottom: 1rem;
  }
}
.new-address-dialog_head__title {
  font-size: 1.5rem;
  font-weight: 500;
  color: #2b2827;
  margin-inline-start: 0.75rem;
}
@media (max-width: 991.98px) {
  .new-address-dialog_head__title {
    font-size: 1.25rem;
  }
}
@media (max-width: 767.98px) {
  .new-address-dialog_head__title {
    font-size: 1.125rem;
  }
}
.new-address-dialog_form {
  padding-bottom: 3rem;
  margin-bottom: 3rem;
  border-bottom: 1px solid #e4e3e1;
  row-gap: 16px;
  max-height: 500px;
  overflow-y: auto;
}
@media (max-width: 767.98px) {
  .new-address-dialog_form {
    padding-bottom: 2rem;
    margin-bottom: 2rem;
  }
}
@media (max-width: 575.98px) {
  .new-address-dialog_form {
    margin-bottom: 1rem;
  }
}
@media (max-width: 479.98px) {
  .new-address-dialog_form {
    margin-bottom: 0;
  }
}
.new-address-dialog_btn {
  width: 100%;
  height: 48px;
  border-radius: 8px !important;
}
@media (max-width: 575.98px) {
  .new-address-dialog_btn {
    margin-top: 16px;
  }
}

.main-form-control {
  display: flex;
  flex-direction: column;
}
.main-form-control .title {
  color: #2b2827;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
  position: relative;
  width: max-content;
}
@media (max-width: 767.98px) {
  .main-form-control .title {
    font-size: 0.875rem;
  }
}
.main-form-control .input {
  height: 3rem;
  border-radius: 0.375rem;
  width: 100%;
  background-color: #ffffff;
  position: relative;
}
.main-form-control .input input,
.main-form-control .input textarea {
  width: 100%;
  height: 100%;
  border-radius: 0.375rem;
  padding-inline-start: 0.75rem;
  background-color: #ffffff;
  font-size: 0.75rem;
  border: 1px solid #E4E3E1;
}
.main-form-control .input .main-form-control__edit-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inset-inline-end: 14px;
}
.main-form-control--required .main-form-control__title::after {
  content: "*";
  position: absolute;
  font-weight: 700;
  font-size: 0.75rem;
  color: #dc3545;
  inset-inline-end: -8px;
  top: 50%;
  transform: translateY(-50%);
  height: 9px;
}

.payment-success, .payment-error {
  width: 90%;
  max-width: 808px;
  padding: 24px;
  background-color: #ffffff;
  border-radius: 16px;
  margin: 108px auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.payment-success_shape, .payment-error_shape {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
  margin-bottom: 24px;
}
@media (max-width: 991.98px) {
  .payment-success_shape, .payment-error_shape {
    gap: 36px;
  }
}
@media (max-width: 575.98px) {
  .payment-success_shape, .payment-error_shape {
    gap: 24px;
  }
}
.payment-success_shape .circle, .payment-error_shape .circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 300px;
  height: 300px;
  background-color: #EFFFED;
  border-radius: 50%;
}
@media (max-width: 1399.98px) {
  .payment-success_shape .circle, .payment-error_shape .circle {
    width: 280px;
    height: 280px;
  }
}
@media (max-width: 991.98px) {
  .payment-success_shape .circle, .payment-error_shape .circle {
    width: 200px;
    height: 200px;
  }
}
@media (max-width: 575.98px) {
  .payment-success_shape .circle, .payment-error_shape .circle {
    width: 120px;
    height: 120px;
  }
}
@media (max-width: 991.98px) {
  .payment-success_shape .circle svg, .payment-error_shape .circle svg {
    width: 120px;
    height: 120px;
  }
}
@media (max-width: 575.98px) {
  .payment-success_shape .circle svg, .payment-error_shape .circle svg {
    width: 80px;
    height: 80px;
  }
}
@media (max-width: 991.98px) {
  .payment-success_shape svg, .payment-error_shape svg {
    width: 80px;
  }
}
@media (max-width: 575.98px) {
  .payment-success_shape svg, .payment-error_shape svg {
    width: 50px;
  }
}
.payment-success_title, .payment-error_title {
  color: #4fce40;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 24px;
}
@media (max-width: 1399.98px) {
  .payment-success_title, .payment-error_title {
    font-size: 2.25rem;
  }
}
@media (max-width: 1199.98px) {
  .payment-success_title, .payment-error_title {
    font-size: 2rem;
  }
}
@media (max-width: 991.98px) {
  .payment-success_title, .payment-error_title {
    font-size: 1.75rem;
  }
}
@media (max-width: 575.98px) {
  .payment-success_title, .payment-error_title {
    font-size: 1.25rem;
  }
}
.payment-success_subtitle, .payment-error_subtitle {
  font-size: 20px;
  color: #000000;
  font-weight: 500;
  display: block;
  margin-bottom: 64px;
}
@media (max-width: 991.98px) {
  .payment-success_subtitle, .payment-error_subtitle {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .payment-success_subtitle, .payment-error_subtitle {
    font-size: 1rem;
  }
}
.payment-success_actions, .payment-error_actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
@media (max-width: 575.98px) {
  .payment-success_actions, .payment-error_actions {
    gap: 16px;
  }
}
.payment-success_actions__btn, .payment-error_actions__btn {
  width: 183px;
  height: 48px;
  border-radius: 8px !important;
}
@media (max-width: 575.98px) {
  .payment-success_actions__btn, .payment-error_actions__btn {
    width: 140px;
    height: 40px;
  }
}

.payment-error_shape .circle {
  background-color: #F8D7DA;
}
.payment-error_title {
  color: #DC3545;
}

.owl-prev, .owl-next {
  border: 0;
  background: transparent;
  outline: none;
}
.owl-prev.disabled, .owl-next.disabled {
  opacity: 0.2;
  cursor: default;
}

.main-page-title {
  font-size: 2.25rem;
  color: #000000;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
@media (max-width: 1199.98px) {
  .main-page-title {
    font-size: 2rem;
  }
}
@media (max-width: 991.98px) {
  .main-page-title {
    font-size: 1.75rem;
  }
}
@media (max-width: 767.98px) {
  .main-page-title {
    font-size: 1.5rem;
  }
}
@media (max-width: 575.98px) {
  .main-page-title {
    font-size: 1.25rem;
  }
}
.main-page-title .blue {
  color: #1C74BD;
}

.courses-main .banner-section {
  height: 349px;
  width: 100%;
  margin-top: 48px;
  margin-bottom: 68px;
}
@media (max-width: 991.98px) {
  .courses-main .banner-section {
    margin-top: 24px;
    margin-bottom: 48px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .banner-section {
    margin-top: 20px;
  }
}
.courses-main .banner-section img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.courses-main .most-popular-section {
  margin-top: 108px;
  padding-top: 48px;
  background-color: #f6f8fc;
  background-image: url("./../../img/courses/consultation-bg.png");
  background-repeat: no-repeat;
  width: 100%;
  background-position: center;
  padding-bottom: 28px;
}
@media (max-width: 1199.98px) {
  .courses-main .most-popular-section {
    margin-top: 90px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .most-popular-section {
    margin-top: 76px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .most-popular-section {
    margin-top: 48px;
  }
}
.courses-main .most-popular-section_star {
  position: absolute;
  right: -30px;
  top: -8px;
}
.courses-main .most-popular-section .main-page-title span {
  position: relative;
}
.courses-main .most-popular-section .tabs-container {
  margin-top: 80px;
}
@media (max-width: 1199.98px) {
  .courses-main .most-popular-section .tabs-container {
    margin-top: 64px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .most-popular-section .tabs-container {
    margin-top: 48px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .most-popular-section .tabs-container {
    margin-top: 32px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .most-popular-section .tabs-container {
    margin-top: 24px;
  }
}
.courses-main .most-popular-section .tabs-wrapper {
  height: 52px;
  background-color: transparent;
  margin-bottom: 32px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.courses-main .most-popular-section .tabs-wrapper ::-webkit-scrollbar {
  height: 3px;
}
.courses-main .most-popular-section .tabs-wrapper ::-webkit-scrollbar-thumb {
  height: 3px;
  background-color: #898989;
}
.courses-main .most-popular-section .tabs-wrapper .tabs {
  border-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
@media (max-width: 575.98px) {
  .courses-main .most-popular-section .tabs-wrapper .tabs {
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 8px;
    justify-content: start;
  }
}
@media (max-width: 479.98px) {
  .courses-main .most-popular-section .tabs-wrapper .tabs {
    gap: 8px;
  }
}
.courses-main .most-popular-section .tabs-wrapper .tabs-item {
  width: 184px;
  height: 52px;
  border-radius: 16px;
  transition: all 0.1s ease-out;
  font-weight: 600;
  background-color: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000000;
  font-size: 1rem;
}
@media (max-width: 991.98px) {
  .courses-main .most-popular-section .tabs-wrapper .tabs-item {
    width: 160px;
    height: 48px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .most-popular-section .tabs-wrapper .tabs-item {
    width: 140px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .most-popular-section .tabs-wrapper .tabs-item {
    width: 113px;
    height: 44px;
    font-size: 0.875rem;
    min-width: 100px;
    white-space: nowrap;
  }
}
.courses-main .most-popular-section .tabs-wrapper .tabs-item.active {
  border: 1px solid #000000;
}
.courses-main .most-popular-section .tabs-content {
  margin-top: 36px;
  width: 100%;
}
.courses-main .most-popular-section .tabs-content .most-popular-navigation {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.courses-main .most-popular-section .tabs-content .most-popular-navigation .owl-prev, .courses-main .most-popular-section .tabs-content .most-popular-navigation .owl-next {
  width: 44px !important;
  height: 44px !important;
  display: flex;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 16px !important;
  background-color: #ffffff !important;
}
.courses-main .most-popular-section .tabs-content .tab-carousel {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_top__view-more {
  font-weight: 600;
  font-size: 1rem;
  color: #5b5353;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 24px;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right {
  width: 280px;
  min-width: 280px;
  height: 413px;
  background-image: url("../img/courses-index/best-seller-bg.svg");
  background-repeat: no-repeat;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  .courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right {
    display: none;
  }
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right:before {
  content: " ";
  background-image: url("../img/courses-index/best-seller-shape.png");
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  position: absolute;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .img {
  width: 204px;
  margin-top: 16px;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .img img {
  width: 100%;
  object-fit: cover;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .info {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 48px;
  gap: 4px;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .info .num {
  font-size: 3rem;
  font-weight: 700;
  color: #ffffff;
  max-height: 48px;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .info .title {
  font-size: 1.5rem;
  color: #ffffff;
  font-weight: 500;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__right .arrow-left {
  position: absolute;
  top: 220px;
  left: 0;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__left {
  flex: 1 0 0;
  overflow: hidden;
}
.courses-main .most-popular-section .tabs-content .tab-carousel_bottom__left .course-card {
  background-color: #dde8ff;
  width: 288px;
}
@media (max-width: 767.98px) {
  .courses-main .most-popular-section .tabs-content .tab-carousel_bottom__left .course-card {
    width: auto;
  }
}
.courses-main .best-seller-section {
  margin-top: 108px;
  width: 100%;
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section {
    margin-top: 90px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section {
    margin-top: 76px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section {
    margin-top: 48px;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .container {
    max-width: unset !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}
.courses-main .best-seller-section .best-seller {
  width: 100%;
  background-image: url("../img/courses-index/best-seller-yellow-bg.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 745px;
  padding: 48px 30px 40px 48px;
  position: relative;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller {
    height: 641px;
    padding: 18px 30px 40px 48px;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller {
    background-image: unset;
    background-color: #ffae00;
    width: 100%;
    height: auto;
  }
}
.courses-main .best-seller-section .best-seller-navigation {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 8px;
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller-navigation {
    margin-inline-start: auto;
  }
}
.courses-main .best-seller-section .best-seller-navigation .owl-prev, .courses-main .best-seller-section .best-seller-navigation .owl-next {
  width: 44px !important;
  height: 44px !important;
  display: flex;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 16px !important;
  background-color: #ffffff !important;
}
.courses-main .best-seller-section .best-seller_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 80px;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller_head {
    margin-bottom: 40px;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller_head {
    margin-bottom: 70px;
    padding-top: 18px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_head {
    flex-direction: column;
    gap: 120px;
    margin-bottom: 24px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .best-seller-section .best-seller_head {
    margin-bottom: 16px;
  }
}
.courses-main .best-seller-section .best-seller_head__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 9px;
  position: relative;
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_head__title {
    margin-inline-end: auto;
  }
}
.courses-main .best-seller-section .best-seller_head__title .text {
  font-size: 2.25rem;
  font-weight: 700;
  color: #ffffff;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller_head__title .text {
    font-size: 2rem;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller_head__title .text {
    font-size: 1.75rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section .best-seller_head__title .text {
    font-size: 1.5rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_head__title .text {
    font-size: 1.375rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section .best-seller_head__title .text {
    font-size: 1.25rem;
  }
}
.courses-main .best-seller-section .best-seller_head__title .line-shape {
  position: absolute;
  top: 50px;
  inset-inline-start: 40px;
}
@media (max-width: 575.98px) {
  .courses-main .best-seller-section .best-seller_head__title .line-shape {
    display: none;
  }
}
.courses-main .best-seller-section .best-seller_content {
  width: 100%;
}
@media (min-width: 1200px) {
  .courses-main .best-seller-section .best-seller_content {
    max-width: 83%;
  }
}
.courses-main .best-seller-section .best-seller_timer {
  position: absolute;
  width: 196px;
  height: 462px;
  border-radius: 48px;
  background-color: #EDEDED;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 24px;
  left: 0;
  top: 283px;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller_timer {
    width: 166px;
    top: 253px;
    height: 388px;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller_timer {
    flex-direction: row;
    width: 400px;
    height: 120px;
    background-color: transparent;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section .best-seller_timer {
    left: 45%;
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_timer {
    height: 80px;
    top: 106px;
    left: 50%;
  }
}
@media (max-width: 575.98px) {
  .courses-main .best-seller-section .best-seller_timer {
    top: 92px;
  }
}
.courses-main .best-seller-section .best-seller_timer__item {
  width: 77px;
  height: 79px;
  background-color: #ffffff;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller_timer__item {
    background-color: rgba(255, 255, 255, 0.6);
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_timer__item {
    width: 64px;
  }
}
.courses-main .best-seller-section .best-seller_timer__item .number {
  font-weight: 700;
  font-size: 1.875rem;
  color: #000000;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .number {
    font-size: 1.75rem;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .number {
    font-size: 1.625rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .number {
    font-size: 1.5rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .number {
    font-size: 1.25rem;
  }
}
.courses-main .best-seller-section .best-seller_timer__item .text {
  font-weight: 700;
  font-size: 1.25rem;
  color: #000000;
}
@media (max-width: 1399.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .text {
    font-size: 1.125rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .best-seller-section .best-seller_timer__item .text {
    font-size: 1rem;
  }
}
.courses-main .benefits-section {
  margin-top: 64px;
  position: relative;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section {
    margin-top: 48px;
  }
}
.courses-main .benefits-section .main-page-title span {
  position: relative;
}
.courses-main .benefits-section_star {
  position: absolute;
  left: -18px;
  top: -16px;
}
.courses-main .benefits-section_subtitle {
  display: block;
  text-align: center;
  margin: 16px auto 0 auto;
  color: #5b5353;
  font-size: 1rem;
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_subtitle {
    margin: 4px auto 0 auto;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_subtitle {
    font-size: 0.875rem;
    margin: 0 auto 0 auto;
  }
}
.courses-main .benefits-section_content {
  margin-top: 32px;
  gap: 24px;
  display: flex;
}
@media (min-width: 768px) {
  .courses-main .benefits-section_content {
    display: flex;
    align-items: center;
    justify-content: start;
    height: 496px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content {
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content {
    margin-top: 16px;
  }
}
.courses-main .benefits-section_content__right {
  width: 392px;
  border: 1px solid #e2e2e2;
  border-radius: 32px;
  overflow: hidden;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  background-image: url("../img/courses-index/gradiemt-lines.png");
  background-position: 0 272px;
  background-repeat: no-repeat;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__right {
    width: 320px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__right {
    width: 100%;
    height: auto;
    padding: 24px 0;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right {
    padding: 16px 0;
  }
}
.courses-main .benefits-section_content__right:before {
  content: " ";
  width: 350px;
  height: 350px;
  border-radius: 50%;
  background-color: #ffae00;
  top: -260px;
  right: -230px;
  position: absolute;
  filter: blur(150px);
}
.courses-main .benefits-section_content__right .year-btn {
  border-radius: 48px !important;
  width: 122px;
  height: 56px;
  transform: rotate(-4deg);
  margin-bottom: 32px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.25rem !important;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__right .year-btn {
    width: 110px;
    height: 50px;
    font-size: 1.125rem !important;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__right .year-btn {
    margin-bottom: 24px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right .year-btn {
    width: 98px;
    height: 40px;
    font-size: 1rem !important;
    margin-bottom: 16px;
  }
}
.courses-main .benefits-section_content__right .title {
  font-size: 1.5rem;
  color: #000000;
  font-weight: 700;
  margin-bottom: 8px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 1199.98px) {
  .courses-main .benefits-section_content__right .title {
    font-size: 1.25rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__right .title {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__right .title {
    font-size: 1rem;
    margin-bottom: 0;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right .title {
    font-size: 0.875rem;
    margin-bottom: 12px;
  }
}
.courses-main .benefits-section_content__right .subtitle {
  font-size: 1rem;
  color: #5b5353;
  margin-bottom: 48px;
  text-align: center;
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__right .subtitle {
    margin-bottom: 24px;
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right .subtitle {
    order: 2;
    margin-bottom: 0;
  }
}
.courses-main .benefits-section_content__right .badge {
  width: 90%;
  max-width: 235px;
  height: 72px;
  border-radius: 16px;
  border: 1px solid #e2e2e2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right .badge {
    order: 1;
    margin-bottom: 16px;
  }
}
.courses-main .benefits-section_content__right .badge_content {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-color: #ffffff;
  padding: 16px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 3.02px 30.17px 0 rgba(0, 0, 0, 0.0509803922);
}
.courses-main .benefits-section_content__right .badge_content__title {
  font-size: 1rem;
  font-weight: 700;
  color: #000000;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__right .badge_content__title {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__right .badge_content__title {
    font-size: 0.75rem;
  }
}
.courses-main .benefits-section_content__left {
  border: 1px solid #e2e2e2;
  border-radius: 32px;
  height: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: start;
  flex-direction: column;
  padding-top: 48px;
}
@media (min-width: 768px) {
  .courses-main .benefits-section_content__left {
    flex: 1 0 0;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left {
    height: auto;
    padding-top: 32px;
  }
}
.courses-main .benefits-section_content__left:before {
  content: " ";
  width: 50%;
  height: 476px;
  border-radius: 50%;
  background-color: #1C74BD;
  bottom: -530px;
  left: 50%;
  position: absolute;
  filter: blur(150px);
  transform: translateX(-50%);
}
.courses-main .benefits-section_content__left .title {
  font-size: 1.5rem;
  color: #000000;
  font-weight: 700;
  margin-bottom: 8px;
}
@media (max-width: 1199.98px) {
  .courses-main .benefits-section_content__left .title {
    font-size: 1.25rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__left .title {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left .title {
    font-size: 1rem;
    margin-bottom: 0;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .title {
    font-size: 0.875rem;
  }
}
.courses-main .benefits-section_content__left .subtitle {
  font-size: 1rem;
  color: #5b5353;
  text-align: center;
  max-width: 80%;
}
@media (max-width: 1199.98px) {
  .courses-main .benefits-section_content__left .subtitle {
    margin-bottom: 8px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left .subtitle {
    font-size: 0.875rem;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate {
  background-color: #ffffff;
  border-radius: 24px 24px 0 0;
  padding: 28px 16px 24px 16px;
  width: 100%;
  max-width: 443px;
  margin-right: auto;
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: start;
  flex-direction: column;
  box-shadow: 0 4px 96px 0 rgba(0, 0, 0, 0.0392156863);
  position: relative;
  margin-top: auto;
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate {
    padding: 24px 12px 20px 12px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate {
    padding: 20px 10px 16px 10px;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_logo {
  width: 142px;
  height: 142px;
  margin-bottom: 18px;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_logo {
    width: 130px;
    height: 130px;
    margin-bottom: 12px;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.courses-main .benefits-section_content__left .benefit-certificate_title {
  font-size: 1rem;
  color: #5b5353;
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_title {
    font-size: 0.75rem;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_reason {
  font-size: 1.25rem;
  font-weight: 700;
  color: #000000;
  margin-bottom: 16px;
}
@media (max-width: 991.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_reason {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_reason {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_reason {
    font-size: 0.875rem;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_divider {
  width: 32px;
  height: 4px;
  border-radius: 8px;
  background-color: #264AFF;
  margin-bottom: 12px;
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_divider {
    margin-bottom: 8px;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_name {
  font-size: 1rem;
  color: #000000;
  margin-bottom: 24px;
}
@media (max-width: 767.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_name {
    font-size: 0.875rem;
    margin-bottom: 16px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .benefits-section_content__left .benefit-certificate_name {
    font-size: 0.75rem;
    margin-bottom: 12px;
  }
}
.courses-main .benefits-section_content__left .benefit-certificate_sign {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.courses-main .teachers-section {
  margin-top: 108px;
}
@media (max-width: 1199.98px) {
  .courses-main .teachers-section {
    margin-top: 90px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section {
    margin-top: 76px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .teachers-section {
    margin-top: 56px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section {
    margin-top: 48px;
  }
}
.courses-main .teachers-section_btn {
  border-radius: 48px !important;
  width: 229px;
  height: 64px;
  transform: rotate(-4deg);
  margin-bottom: 16px;
  margin-left: auto;
  margin-right: auto;
  font-size: 2rem !important;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_btn {
    width: 180px;
    height: 44px;
    font-size: 1.5rem !important;
  }
}
@media (max-width: 767.98px) {
  .courses-main .teachers-section_btn {
    width: 170px;
    height: 40px;
    font-size: 1.25rem !important;
  }
}
@media (max-width: 575.98px) {
  .courses-main .teachers-section_btn {
    width: 148px;
    height: 32px;
    font-size: 1.125rem !important;
    margin-bottom: 12px;
  }
}
.courses-main .teachers-section .main-page-title {
  margin-bottom: 32px;
}
@media (max-width: 575.98px) {
  .courses-main .teachers-section .main-page-title {
    margin-bottom: 16px;
  }
}
.courses-main .teachers-section_content {
  display: flex;
  gap: 32px;
}
.courses-main .teachers-section_content__right {
  width: 392px;
  min-width: 392px;
  border: 1px solid #e2e2e2;
  border-radius: 32px;
  overflow: hidden;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: start;
  align-items: center;
  padding-top: 100px;
  flex-direction: column;
  background-image: url("../img/courses-index/gradiemt-lines.png");
  background-position: 0 272px;
  background-repeat: no-repeat;
}
@media (max-width: 1199.98px) {
  .courses-main .teachers-section_content__right {
    width: 350px;
    min-width: 350px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right {
    width: 310px;
    min-width: 310px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .teachers-section_content__right {
    display: none;
  }
}
.courses-main .teachers-section_content__right:before {
  content: " ";
  width: 350px;
  height: 350px;
  border-radius: 50%;
  background-color: #1C74BD;
  top: -260px;
  right: -230px;
  position: absolute;
  filter: blur(150px);
}
.courses-main .teachers-section_content__right .icon {
  margin-bottom: 16px;
}
.courses-main .teachers-section_content__right .title {
  font-size: 1.25rem;
  max-width: 90%;
  margin-bottom: 44px;
  font-weight: 700;
}
.courses-main .teachers-section_content__right .register {
  z-index: 3;
  width: 235px;
  height: 72px;
  border-radius: 16px;
  border: 1px solid #e2e2e2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-bottom: 48px;
  cursor: pointer;
}
@media (max-width: 575.98px) {
  .courses-main .teachers-section_content__right .register {
    order: 1;
    margin-bottom: 16px;
  }
}
.courses-main .teachers-section_content__right .register:before {
  content: " ";
  z-index: 2;
  position: absolute;
  width: 172px;
  height: 20px;
  background-color: #ffffff;
  bottom: -21px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 0 0 16px 16px;
  box-shadow: 0 2.22px 22.21px 0 rgba(0, 0, 0, 0.0509803922);
}
.courses-main .teachers-section_content__right .register:after {
  content: " ";
  z-index: 1;
  position: absolute;
  width: 137px;
  height: 18px;
  background-color: #ffffff;
  bottom: -37px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 0 0 16px 16px;
  box-shadow: 0 1.76px 17.6px 0 rgba(0, 0, 0, 0.0509803922);
}
.courses-main .teachers-section_content__right .register_content {
  z-index: 3;
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-color: #1C74BD;
  padding: 16px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 3.02px 30.17px 0 rgba(0, 0, 0, 0.0509803922);
}
.courses-main .teachers-section_content__right .register_content__title {
  font-size: 1rem;
  font-weight: 600;
  color: #ffffff;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .register_content__title {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .courses-main .teachers-section_content__right .register_content__title {
    font-size: 0.75rem;
  }
}
.courses-main .teachers-section_content__right .images {
  position: relative;
  width: 100%;
  height: 60px;
}
.courses-main .teachers-section_content__right .images_item {
  position: absolute;
  border-radius: 50%;
}
.courses-main .teachers-section_content__right .images_item img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}
.courses-main .teachers-section_content__right .images_item:nth-child(1) {
  width: 30px;
  height: 30px;
  top: 0px;
  inset-inline-start: 102px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(1) {
    inset-inline-start: 62px;
  }
}
.courses-main .teachers-section_content__right .images_item:nth-child(2) {
  width: 22px;
  height: 22px;
  top: 30px;
  inset-inline-start: 126px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(2) {
    inset-inline-start: 86px;
  }
}
.courses-main .teachers-section_content__right .images_item:nth-child(3) {
  width: 26px;
  height: 26px;
  top: 7px;
  inset-inline-start: 150px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(3) {
    inset-inline-start: 110px;
  }
}
.courses-main .teachers-section_content__right .images_item:nth-child(4) {
  width: 32px;
  height: 32px;
  top: -3px;
  inset-inline-start: 190px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(4) {
    inset-inline-start: 150px;
  }
}
.courses-main .teachers-section_content__right .images_item:nth-child(5) {
  width: 22px;
  height: 22px;
  top: 32px;
  inset-inline-start: 213px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(5) {
    inset-inline-start: 173px;
  }
}
.courses-main .teachers-section_content__right .images_item:nth-child(6) {
  width: 26px;
  height: 26px;
  top: 6px;
  inset-inline-start: 243px;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__right .images_item:nth-child(6) {
    inset-inline-start: 203px;
  }
}
.courses-main .teachers-section_content__left {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
  overflow: hidden;
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__left {
    gap: 24px;
  }
}
.courses-main .teachers-section_content__left__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.courses-main .teachers-section_content__left__top .teachers-navigation {
  display: flex;
  gap: 48px;
}
.courses-main .teachers-section_content__left__top .view-all {
  color: #5b5353;
  font-size: 1rem;
}
.courses-main .teachers-section_content__left__bottom .teacher-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 288px;
}
@media (max-width: 767.98px) {
  .courses-main .teachers-section_content__left__bottom .teacher-item {
    width: auto;
  }
}
.courses-main .teachers-section_content__left__bottom .teacher-item_img-container {
  background-color: #f6f8fc;
  height: 360px;
  border-radius: 24px;
  display: flex;
  align-items: end;
  justify-content: center;
  overflow: hidden;
}
.courses-main .teachers-section_content__left__bottom .teacher-item_img-container img {
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
.courses-main .teachers-section_content__left__bottom .teacher-item_info {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 12px;
}
.courses-main .teachers-section_content__left__bottom .teacher-item_info__name {
  font-size: 1.375rem;
  font-weight: 500;
}
@media (max-width: 1199.98px) {
  .courses-main .teachers-section_content__left__bottom .teacher-item_info__name {
    font-size: 1.25rem;
  }
}
@media (max-width: 991.98px) {
  .courses-main .teachers-section_content__left__bottom .teacher-item_info__name {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .courses-main .teachers-section_content__left__bottom .teacher-item_info__name {
    font-size: 1rem;
  }
}
.courses-main .comment-section {
  margin-top: 108px;
}
@media (max-width: 1199.98px) {
  .courses-main .comment-section {
    margin-top: 90px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .comment-section {
    margin-top: 76px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section {
    margin-top: 48px;
  }
}
.courses-main .comment-section .comment-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
  margin-top: 18px;
}
@media (min-width: 992px) {
  .courses-main .comment-section .comment-navigation {
    display: none;
  }
}
.courses-main .comment-section .main-page-title span {
  position: relative;
}
.courses-main .comment-section_star {
  position: absolute;
  left: -18px;
  top: -16px;
}
.courses-main .comment-section_subtitle {
  display: block;
  text-align: center;
  margin: 16px auto 0 auto;
  color: #5b5353;
  font-size: 1rem;
}
@media (max-width: 991.98px) {
  .courses-main .comment-section_subtitle {
    margin: 8px auto 0 auto;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_subtitle {
    margin: 4px auto 0 auto;
  }
}
@media (max-width: 575.98px) {
  .courses-main .comment-section_subtitle {
    font-size: 0.875rem;
    margin: 0 auto 0 auto;
  }
}
.courses-main .comment-section_content {
  display: flex;
  gap: 24px;
  margin-top: 32px;
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content {
    margin-top: 16px;
  }
}
.courses-main .comment-section_content .hex-card {
  width: 184px;
  min-width: 184px;
  height: 377px;
  background-image: url("../img/courses-index/comments-bg.svg");
  background-repeat: no-repeat;
  position: relative;
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content .hex-card {
    display: none;
  }
}
.courses-main .comment-section_content .hex-card .man-image {
  position: absolute;
  bottom: 20px;
  right: 0;
  width: 100%;
  height: 235px;
  border-radius: 16px;
}
.courses-main .comment-section_content .hex-card .man-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.courses-main .comment-section_content .hex-card .line-shape {
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
}
.courses-main .comment-section_content .comments-carousel-container {
  flex: 1 0 0;
  width: 100%;
  overflow: hidden;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel {
  display: flex;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .owl-stage-outer {
  padding: 13px 5px;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  padding: 28px 24px;
  border-radius: 32px;
  border: 1px solid #E2E2E2;
  height: 322px;
  transform: rotate(2deg);
}
@media (max-width: 1199.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item {
    width: 480px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item {
    gap: 36px;
    width: auto;
    transform: rotate(0);
  }
}
@media (max-width: 575.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item {
    gap: 24px;
    height: 450px;
  }
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .comment {
  font-size: 16px;
  color: #5b5353;
  line-height: 24px;
  text-align: justify;
  max-height: 170px;
  overflow-y: auto;
}
@media (max-width: 575.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .comment {
    max-height: 250px;
  }
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 991.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .img {
    width: 40px;
    height: 40px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .img {
    width: 36px;
    height: 36px;
  }
}
@media (max-width: 575.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .img {
    width: 32px;
    height: 32px;
  }
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .name {
  color: #000000;
  font-weight: 600;
  font-size: 20px;
}
@media (max-width: 1199.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .name {
    font-size: 18px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .name {
    font-size: 16px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .name {
    font-size: 14px;
  }
}
.courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .role {
  color: #5b5353;
  font-size: 16px;
}
@media (max-width: 991.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .role {
    font-size: 14px;
  }
}
@media (max-width: 767.98px) {
  .courses-main .comment-section_content .comments-carousel-container .comments-carousel .item .user .info .role {
    font-size: 12px;
  }
}
.courses-main .blogs-section-container {
  margin-top: 108px;
}
@media (max-width: 767.98px) {
  .courses-main .blogs-section-container {
    margin-top: 48px;
  }
}
.courses-main .blogs-section {
  display: flex;
  gap: 24px;
}
@media (max-width: 991.98px) {
  .courses-main .blogs-section {
    flex-direction: column-reverse;
  }
}
@media (max-width: 575.98px) {
  .courses-main .blogs-section {
    gap: 16px;
  }
}
.courses-main .blogs-section_right {
  width: 288px;
  background-color: #3657ff;
  border-radius: 48px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 394px;
  position: relative;
  overflow: hidden;
}
@media (max-width: 991.98px) {
  .courses-main .blogs-section_right {
    width: 100%;
  }
}
.courses-main .blogs-section_right__titles {
  display: flex;
  flex-direction: column;
}
.courses-main .blogs-section_right__titles .title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #ffffff;
}
@media (max-width: 767.98px) {
  .courses-main .blogs-section_right__titles .title {
    font-size: 1.125rem;
  }
}
.courses-main .blogs-section_right__titles .subtitle {
  font-size: 1.25rem;
  font-weight: 300;
  color: #ffffff;
}
@media (max-width: 767.98px) {
  .courses-main .blogs-section_right__titles .subtitle {
    font-size: 1.125rem;
  }
}
.courses-main .blogs-section_right__go-to {
  width: 108px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline-start: auto;
  background-color: #ffffff;
  border-radius: 360px;
}
.courses-main .blogs-section_right__img {
  position: absolute;
  bottom: 0;
  inset-inline-start: 0;
  bottom: 0;
}
.courses-main .blogs-section_left {
  flex: 1 0 0;
  display: flex;
  gap: 24px;
  flex-direction: column;
}
@media (max-width: 1199.98px) {
  .courses-main .blogs-section_left {
    gap: 8px;
  }
}
@media (max-width: 991.98px) {
  .courses-main .blogs-section_left {
    gap: 24px;
  }
}
.courses-main .blogs-section_left__title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 10px;
}
@media (max-width: 991.98px) {
  .courses-main .blogs-section_left__title {
    justify-content: center;
  }
}
.courses-main .blogs-section_left__title .text {
  font-size: 2.375rem;
  font-weight: 700;
  color: #000000;
}
@media (max-width: 1199.98px) {
  .courses-main .blogs-section_left__title .text {
    font-size: 1.75rem;
  }
}
@media (max-width: 1199.98px) {
  .courses-main .blogs-section_left__title svg {
    width: 28px;
  }
}
.courses-main .blogs-section_left__content {
  display: grid;
  row-gap: 16px;
  column-gap: 24px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
@media (max-width: 767.98px) {
  .courses-main .blogs-section_left__content {
    display: block;
  }
}
.courses-main .blogs-section_left__content .blog-item {
  border: 1px solid #e2e2e2;
  border-radius: 48px;
  background-color: #ffffff;
  padding: 16px;
}
.courses-main .blogs-section_left__content .blog-item:first-child {
  grid-column: 1/2;
  grid-row: 1/3;
}
.courses-main .blogs-section_left__content .blog-item:nth-child(2) {
  grid-column: 2/3;
  grid-row: 1/2;
}
.courses-main .blogs-section_left__content .blog-item:nth-child(3) {
  grid-column: 2/3;
  grid-row: 2/3;
}
.courses-main .blogs-section_left__content .blog-item_img {
  width: 100%;
  height: 169px;
  border-radius: 32px;
  margin-bottom: 8px;
}
.courses-main .blogs-section_left__content .blog-item_img img {
  width: 100%;
  height: 100%;
  border-radius: 32px;
  object-fit: cover;
}
.courses-main .blogs-section_left__content .blog-item_description {
  font-size: 0.875rem;
  color: #000000;
  line-height: 22px;
  margin-bottom: 30px;
}
.courses-main .blogs-section_left__content .blog-item_time {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 8px;
  padding-inline-end: 8px;
  padding-bottom: 8px;
}
.courses-main .blogs-section_left__content .blog-item_time .text {
  font-size: 0.8125rem;
  color: #000000;
}
.courses-main .blogs-section_left__content .blog-item.mini {
  display: flex;
  gap: 8px;
  flex-direction: column;
  border-radius: 32px;
}
@media (max-width: 1199.98px) {
  .courses-main .blogs-section_left__content .blog-item.mini {
    padding: 12px;
    gap: 16px;
  }
}
.courses-main .blogs-section_left__content .blog-item.mini .blog-item_top {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.courses-main .blogs-section_left__content .blog-item.mini .blog-item_img {
  width: 92px;
  height: 90px;
  min-width: 92px;
  border-radius: 24px;
  margin-bottom: unset;
}
@media (max-width: 1199.98px) {
  .courses-main .blogs-section_left__content .blog-item.mini .blog-item_img {
    width: 85px;
    height: 85px;
    min-width: 85px;
  }
}
.courses-main .blogs-section_left__content .blog-item.mini .blog-item_img img {
  width: 100%;
  height: 100%;
  border-radius: 24px;
  object-fit: cover;
}
.courses-main .blogs-section_left__content .blog-item.mini .blog-item_description {
  margin-bottom: unset;
}
.courses-main .blogs-section_left__content .blog-item.mini .blog-item_time {
  padding: 0;
}
.courses-main .blogs-section_left__content .blogs-navigation {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 56px;
}

.navigation2 {
  margin-top: 48px;
}

.courses-list-container .banner-section {
  margin-top: 32px;
  height: 349px;
  width: 100%;
}
@media (max-width: 991.98px) {
  .courses-list-container .banner-section {
    margin-top: 24px;
  }
}
.courses-list-container .banner-section img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.courses-list-accordion .accordion-item {
  border: 1px solid #e2e2e2;
  border-radius: 24px;
}
.courses-list-accordion .accordion-item .arrow-bottom {
  display: block;
  transition: all 0.2s ease-out;
}
.courses-list-accordion .accordion-item.open .arrow-bottom {
  transform: rotate(-180deg);
}
.courses-list-accordion .accordion-item__button {
  font-family: "yekan-bakh" !important;
  padding: 0 16px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.courses-list-accordion .accordion-item__button__title {
  display: flex;
  align-items: center;
  justify-content: start;
  font-size: 1.25rem;
  font-weight: 600;
  color: #000000;
}
.courses-list-accordion-content {
  padding-top: 0 !important;
  padding-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.courses-list-accordion-content_row {
  display: flex;
  align-items: center;
  justify-content: start;
  padding-inline-start: 16px;
}

.courses-list {
  display: flex;
  gap: 24px;
  align-items: start;
  margin-top: 106px;
}
@media (max-width: 991.98px) {
  .courses-list {
    flex-direction: column;
    gap: 8px;
    margin-top: 24px;
  }
}
.courses-list_filters {
  position: sticky;
  top: 16px;
  width: 392px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 1199.98px) {
  .courses-list_filters {
    width: 300px;
  }
}
@media (max-width: 991.98px) {
  .courses-list_filters {
    display: none;
  }
}
.courses-list_filters__btn {
  width: 100%;
  height: 48px;
  border-radius: 16px;
}
.courses-list_filters_mobile {
  display: flex;
  align-items: center;
  gap: 24px;
  padding-bottom: 16px;
  padding-top: 24px;
  position: sticky;
  top: 0;
  background-color: #ffffff;
  width: 100%;
}
@media (min-width: 992px) {
  .courses-list_filters_mobile {
    display: none;
  }
}
@media (max-width: 767.98px) {
  .courses-list_filters_mobile {
    gap: 16px;
    padding-top: 24px;
  }
}
.courses-list_filters_mobile__filter-btn, .courses-list_filters_mobile__sort-btn {
  cursor: pointer;
  width: 136px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background-color: #ffffff;
  border: 1px solid #E4E3E1;
  border-radius: 8px;
}
@media (max-width: 767.98px) {
  .courses-list_filters_mobile__filter-btn, .courses-list_filters_mobile__sort-btn {
    width: 100%;
    gap: 8px;
  }
}
@media (max-width: 767.98px) {
  .courses-list_filters_mobile__filter-btn svg, .courses-list_filters_mobile__sort-btn svg {
    width: 20px;
  }
}
@media (max-width: 575.98px) {
  .courses-list_filters_mobile__filter-btn svg, .courses-list_filters_mobile__sort-btn svg {
    width: 18px;
  }
}
.courses-list_filters_mobile__filter-btn .text, .courses-list_filters_mobile__sort-btn .text {
  color: #2b2827;
  font-size: 0.875rem;
}
.courses-list_items {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.courses-list_items__head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 991.98px) {
  .courses-list_items__head {
    display: none;
  }
}
.courses-list_items__head__start {
  display: flex;
  align-items: center;
  gap: 16px;
}
.courses-list_items__head__start .title {
  display: flex;
  align-items: center;
  gap: 16px;
}
.courses-list_items__head__start .title .text {
  font-size: 1rem;
  font-weight: 300;
  color: #000000;
}
.courses-list_items__head__start .sorts-list {
  display: flex;
  align-items: center;
  gap: 16px;
}
.courses-list_items__head__start .sorts-list_item input[type=radio] {
  display: none;
}
.courses-list_items__head__start .sorts-list_item input[type=radio] + label {
  font-size: 1rem;
  font-weight: 300;
  color: #000000;
  cursor: pointer;
}
.courses-list_items__head__start .sorts-list_item input[type=radio]:checked + label {
  color: #1C74BD;
  font-weight: 700;
}
.courses-list_items__head__end {
  font-size: 1rem;
  font-weight: 600;
  color: #000000;
}
.courses-list_items__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.courses-list_items__content .course-card {
  width: 100%;
}

.courses-description {
  margin-top: 48px;
  position: relative;
}
.courses-description_title {
  font-size: 1.5rem;
  color: #000000;
  font-weight: 700;
  margin-bottom: 16px;
  display: block;
}
@media (max-width: 1199.98px) {
  .courses-description_title {
    font-size: 1.375rem;
  }
}
@media (max-width: 991.98px) {
  .courses-description_title {
    font-size: 1.25rem;
  }
}
@media (max-width: 767.98px) {
  .courses-description_title {
    font-size: 1.125rem;
  }
}
.courses-description_text {
  position: relative;
  font-size: 1rem;
  color: #2b2827;
  line-height: 25px;
  height: 200px;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  .courses-description_text {
    font-size: 0.875rem;
  }
}
.courses-description_text.open {
  height: auto;
}
.courses-description_text.open + .courses-description_more-btn {
  background: transparent;
  bottom: -70px;
}
.courses-description_more-btn {
  position: absolute;
  bottom: 0;
  background: linear-gradient(0deg, rgb(255, 255, 255) 60%, rgba(0, 0, 0, 0) 100%);
  height: 120px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #264AFF;
  font-weight: 700;
  padding-top: 40px;
  transition: all 0.1s ease-out;
  cursor: pointer;
}
.courses-description_more-btn:hover {
  color: #3657ff;
}

.dialog-sort_content {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  border-radius: 24px 24px 0 0 !important;
  position: fixed !important;
  height: max-content !important;
  padding: 24px 16px !important;
}
.dialog-sort_content__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  padding-top: 16px;
  border-top: 1px solid #F2F1EF;
  margin-top: 40px;
  position: relative;
}
.dialog-sort_content__head:before {
  content: " ";
  width: 64px;
  height: 4px;
  background-color: #D9D9D9;
  border-radius: 360px;
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
}
.dialog-sort_content__head .title {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}
.dialog-sort_content__head .title .text {
  font-size: 1rem;
  font-weight: 700;
  color: #333333;
}
.dialog-sort_content__content {
  border: 1px solid #D9D9D9;
  border-radius: 24px;
  padding: 16px;
  gap: 24px;
}

.dialog-filter_content {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  border-radius: 24px 24px 0 0 !important;
  position: fixed !important;
  height: max-content !important;
  padding: 24px 16px !important;
}
.dialog-filter_content__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  padding-top: 16px;
  border-top: 1px solid #F2F1EF;
  margin-top: 40px;
  position: relative;
}
.dialog-filter_content__head:before {
  content: " ";
  width: 64px;
  height: 4px;
  background-color: #D9D9D9;
  border-radius: 360px;
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
}
.dialog-filter_content__accordions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.teacher-name-container {
  gap: 24px;
  margin-bottom: 16px;
}
@media (max-width: 991.98px) {
  .teacher-name-container {
    gap: 16px;
  }
}
@media (max-width: 767.98px) {
  .teacher-name-container {
    gap: 8px;
  }
}
.teacher-name-container.mobile {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 0 !important;
}
@media (min-width: 992px) {
  .teacher-name-container.mobile {
    display: none;
  }
}
.teacher-name-container.desktop {
  display: none;
}
@media (min-width: 992px) {
  .teacher-name-container.desktop {
    display: flex;
    align-items: center;
    justify-content: start;
  }
}
@media (max-width: 1199.98px) {
  .teacher-name-container svg {
    width: 40px;
  }
}
@media (max-width: 991.98px) {
  .teacher-name-container svg {
    width: 36px;
  }
}
@media (max-width: 767.98px) {
  .teacher-name-container svg {
    width: 32px;
  }
}
@media (max-width: 575.98px) {
  .teacher-name-container svg {
    width: 24px;
  }
}
.teacher-name-container .text {
  font-weight: 600;
  font-size: 36px;
  color: #000000;
}
@media (max-width: 1199.98px) {
  .teacher-name-container .text {
    font-size: 2rem;
  }
}
@media (max-width: 991.98px) {
  .teacher-name-container .text {
    font-size: 1.75rem;
  }
}
@media (max-width: 767.98px) {
  .teacher-name-container .text {
    font-size: 1.5rem;
  }
}
@media (max-width: 575.98px) {
  .teacher-name-container .text {
    font-size: 1.25rem;
  }
}

.about-teacher-container {
  margin-top: 32px;
}
.about-teacher-container .about-teacher {
  display: flex;
  gap: 24px;
}
@media (max-width: 991.98px) {
  .about-teacher-container .about-teacher {
    flex-direction: column;
    gap: 16px;
  }
}
.about-teacher-container .about-teacher_img {
  width: 392px;
  background-color: #f6f8fc;
  border-radius: 32px;
  height: 400px;
  display: flex;
  align-items: end;
  justify-content: center;
}
@media (max-width: 991.98px) {
  .about-teacher-container .about-teacher_img {
    width: 100%;
  }
}
.about-teacher-container .about-teacher_img img {
  width: 230px;
}
.about-teacher-container .about-teacher_info {
  flex: 1 0 0;
  border-radius: 32px;
  background-color: #ffffff;
  border: 1px solid #E2E2E2;
  padding: 24px;
  display: flex;
  flex-direction: column;
}
@media (max-width: 991.98px) {
  .about-teacher-container .about-teacher_info {
    width: 100%;
    border: 0;
    padding: 0;
  }
}
.about-teacher-container .about-teacher_info__description {
  font-size: 1.25rem;
  line-height: 32px;
  color: #5b5353;
  margin-bottom: 16px;
  text-align: justify;
}
@media (max-width: 991.98px) {
  .about-teacher-container .about-teacher_info__description {
    font-size: 1.125rem;
  }
}
@media (max-width: 767.98px) {
  .about-teacher-container .about-teacher_info__description {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .about-teacher_info__description {
    font-size: 0.875rem;
  }
}
.about-teacher-container .about-teacher_info__btn {
  width: 164px;
  height: 48px;
  border-radius: 16px !important;
}
@media (max-width: 991.98px) {
  .about-teacher-container .about-teacher_info__btn {
    width: 100%;
  }
}
.about-teacher-container .teacher-courses {
  margin-top: 48px;
  display: flex;
  gap: 24px;
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses {
    flex-direction: column;
  }
}
.about-teacher-container .teacher-courses_right {
  width: 392px;
  border: 1px solid #e2e2e2;
  border-radius: 32px;
  overflow: hidden;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  background-image: url("../img/courses-index/gradiemt-lines.png");
  background-position: 0 272px;
  background-repeat: no-repeat;
  min-height: 496px;
  padding: 16px;
}
@media (max-width: 991.98px) {
  .about-teacher-container .teacher-courses_right {
    width: 320px;
  }
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_right {
    width: 100%;
    padding: 24px 0;
    min-height: unset;
    height: max-content;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right {
    padding: 16px 0;
  }
}
.about-teacher-container .teacher-courses_right:before {
  content: " ";
  width: 350px;
  height: 350px;
  border-radius: 50%;
  background-color: #ffae00;
  top: -260px;
  right: -230px;
  position: absolute;
  filter: blur(150px);
}
.about-teacher-container .teacher-courses_right .year-btn {
  border-radius: 48px !important;
  width: 122px;
  height: 56px;
  transform: rotate(-4deg);
  margin-bottom: 32px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.25rem !important;
}
@media (max-width: 991.98px) {
  .about-teacher-container .teacher-courses_right .year-btn {
    width: 110px;
    height: 50px;
    font-size: 1.125rem !important;
  }
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_right .year-btn {
    margin-bottom: 24px;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right .year-btn {
    width: 98px;
    height: 40px;
    font-size: 1rem !important;
    margin-bottom: 16px;
  }
}
.about-teacher-container .teacher-courses_right .title {
  font-size: 1.5rem;
  color: #000000;
  font-weight: 700;
  margin-bottom: 8px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
@media (max-width: 1199.98px) {
  .about-teacher-container .teacher-courses_right .title {
    font-size: 1.25rem;
  }
}
@media (max-width: 991.98px) {
  .about-teacher-container .teacher-courses_right .title {
    font-size: 1.125rem;
    margin-bottom: 12px;
  }
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_right .title {
    font-size: 1rem;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right .title {
    font-size: 0.875rem;
    margin-bottom: 12px;
  }
}
.about-teacher-container .teacher-courses_right .title .blue {
  color: #1C74BD;
}
.about-teacher-container .teacher-courses_right .subtitle {
  font-size: 1rem;
  color: #5b5353;
  margin-bottom: 48px;
  text-align: center;
  max-width: 80%;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_right .subtitle {
    margin-bottom: 24px;
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right .subtitle {
    order: 2;
    margin-bottom: 0;
  }
}
.about-teacher-container .teacher-courses_right .badge {
  width: 90%;
  max-width: 235px;
  height: 72px;
  border-radius: 16px;
  border: 1px solid #e2e2e2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right .badge {
    order: 1;
    margin-bottom: 16px;
  }
}
.about-teacher-container .teacher-courses_right .badge_content {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-color: #ffffff;
  padding: 16px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 3.02px 30.17px 0 rgba(0, 0, 0, 0.0509803922);
}
.about-teacher-container .teacher-courses_right .badge_content__title {
  font-size: 1rem;
  font-weight: 700;
  color: #000000;
}
@media (max-width: 991.98px) {
  .about-teacher-container .teacher-courses_right .badge_content__title {
    font-size: 0.875rem;
  }
}
@media (max-width: 575.98px) {
  .about-teacher-container .teacher-courses_right .badge_content__title {
    font-size: 0.75rem;
  }
}
.about-teacher-container .teacher-courses_left {
  flex: 1 0 0;
  overflow: hidden;
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_left {
    width: 100%;
    flex: unset;
    display: flex;
    flex-direction: column-reverse;
    gap: 24px;
  }
}
.about-teacher-container .teacher-courses_left .course-card {
  border: 1px solid #e2e2e2;
}
@media (min-width: 768px) {
  .about-teacher-container .teacher-courses_left .course-card {
    width: 288px;
  }
}
.about-teacher-container .teacher-courses_left .course-card_details {
  justify-content: start;
  gap: 12px;
}
.about-teacher-container .teacher-courses_left .course-card.expired .course-card_btn {
  background-color: #A2A2A2 !important;
  cursor: default !important;
}
.about-teacher-container .teacher-courses_left .course-card.expired .course-card_btn:hover {
  background-color: #A2A2A2 !important;
}
.about-teacher-container .teacher-courses_left .course-card.expired .course-card_img {
  filter: grayscale(1);
}
.about-teacher-container .teacher-courses_left .teacher-courses-navigation-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .about-teacher-container .teacher-courses_left .teacher-courses-navigation-container {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: end;
  }
}
.about-teacher-container .teacher-courses_left .teacher-courses-navigation-container .view-more {
  font-size: 1rem;
  font-weight: 600;
  color: #5b5353;
}
@media (min-width: 768px) {
  .about-teacher-container .teacher-courses_left .teacher-courses-navigation-container .view-more {
    display: none;
  }
}
.about-teacher-container .teacher-courses_left .teacher-courses-navigation {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 44px;
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_left .teacher-courses-navigation {
    gap: 24px;
  }
}
@media (max-width: 767.98px) {
  .about-teacher-container .teacher-courses_left .teacher-courses-navigation .owl-prev, .about-teacher-container .teacher-courses_left .teacher-courses-navigation .owl-next {
    width: 44px !important;
    height: 44px !important;
    display: flex;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 16px !important;
    background-color: rgba(255, 255, 255, 0.7490196078) !important;
  }
}

/*# sourceMappingURL=style.css.map */