/*
 * "Clean" storefront skin for the Shopwise theme.
 *
 * A light, airy look: near-black text on white, one accent colour, soft grey
 * surfaces, rounded controls, buttons in normal case. Layered on top of the
 * theme's own stylesheet (loaded after it), so the theme's files stay as
 * shipped. Colours come from the theme's variables, so a store's own
 * primary colour and fonts (Store design) carry through.
 */

:root {
    --skin-accent: var(--primary-color, #111111);
    --skin-ink: #040404;
    --skin-muted: #686666;
    --skin-line: #e7e7e7;
    --skin-surface: #f6f6f6;
    --skin-strip: #f5f5f5;
    --skin-radius: 6px;
    --skin-radius-lg: 10px;
}

/* ------------------------------------------------------------------ base */

body {
    color: var(--skin-ink);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

p,
.leads {
    color: var(--skin-muted);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--skin-ink);
    font-weight: 500;
    letter-spacing: -0.01em;
}

a {
    color: var(--skin-ink);
    transition: color .2s ease;
}

a:hover {
    color: var(--skin-accent);
}

::selection {
    background: var(--skin-accent);
    color: #fff;
}

:focus-visible {
    outline: 2px solid var(--skin-accent);
    outline-offset: 2px;
}

.section {
    padding-top: 70px;
    padding-bottom: 70px;
}

.section.small_pt { padding-top: 40px; }
.section.small_pb { padding-bottom: 40px; }

.bg_gray,
.bg_light {
    background-color: var(--skin-surface) !important;
}

/* --------------------------------------------------------------- buttons */

.btn {
    border-radius: var(--skin-radius);
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
    padding: 11px 26px;
    font-size: 15px;
    box-shadow: none !important;
}

.btn.btn-sm { padding: 7px 16px; font-size: 14px; }
.btn.btn-lg { padding: 14px 34px; font-size: 16px; }

.btn-fill-out,
.btn-primary,
.btn-default {
    background-color: var(--skin-accent) !important;
    border: 1px solid var(--skin-accent) !important;
    color: #fff !important;
}

/* The theme animates two halves behind the label; a plain colour change reads calmer. */
.btn-fill-out::before,
.btn-fill-out::after {
    display: none !important;
}

.btn-fill-out:hover,
.btn-primary:hover,
.btn-default:hover {
    background-color: var(--skin-ink) !important;
    border-color: var(--skin-ink) !important;
    color: #fff !important;
}

.btn-dark,
.btn-secondary {
    background-color: var(--skin-ink) !important;
    border: 1px solid var(--skin-ink) !important;
    color: #fff !important;
}

.btn-dark:hover,
.btn-secondary:hover {
    background-color: var(--skin-accent) !important;
    border-color: var(--skin-accent) !important;
}

.btn-fill-line,
.btn-border-fill,
.btn-outline-secondary {
    background: #fff !important;
    border: 1px solid var(--skin-line) !important;
    color: var(--skin-ink) !important;
}

.btn-fill-line::before,
.btn-fill-line::after,
.btn-border-fill::before,
.btn-border-fill::after {
    display: none !important;
}

.btn-fill-line:hover,
.btn-border-fill:hover,
.btn-outline-secondary:hover {
    background: var(--skin-ink) !important;
    border-color: var(--skin-ink) !important;
    color: #fff !important;
}

.btn-radius { border-radius: var(--skin-radius); }

/* ----------------------------------------------------------------- forms */

.form-control,
.form-select,
.custom_select select,
textarea.form-control {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius);
    color: var(--skin-ink);
    box-shadow: none !important;
    min-height: 46px;
}

.form-control-sm,
.form-select.form-control-sm { min-height: 38px; }

.form-control:focus,
.form-select:focus {
    border-color: var(--skin-ink);
}

.form-control::placeholder {
    color: #9a9a9a;
}

label,
.form-label {
    color: var(--skin-ink);
    font-weight: 500;
}

.form-check-input:checked,
.custome-checkbox .form-check-input:checked + .form-check-label::before {
    background-color: var(--skin-accent);
    border-color: var(--skin-accent);
}

/* ---------------------------------------------------------------- header */

.top-header {
    background: var(--skin-strip);
    border-bottom: 0;
    padding: 9px 0;
    font-size: 14px;
    color: var(--skin-ink);
}

.top-header a,
.top-header span,
.top-header .contact_detail li,
.top-header .header_list li a,
.top-header .btn-select-language,
.top-header .choose-currency {
    color: var(--skin-ink) !important;
    font-size: 14px;
}

.top-header a:hover {
    color: var(--skin-accent) !important;
}

.middle-header {
    background: #fff;
    padding: 22px 0;
    border-bottom: 0;
}

.middle-header .contact_phone,
.middle-header .contact_phone span {
    color: var(--skin-ink);
    font-weight: 500;
}

.middle-header .contact_phone i {
    color: var(--skin-accent);
}

/* Search: one soft grey pill instead of a bordered box. */
.product_search_form .input-group {
    background: var(--skin-surface);
    border-radius: var(--skin-radius);
    overflow: hidden;
    border: 1px solid transparent;
    transition: border-color .2s ease, background-color .2s ease;
}

.product_search_form .input-group:focus-within {
    background: #fff;
    border-color: var(--skin-ink);
}

.product_search_form .form-control,
.product_search_form .custom_select select,
.product_search_form select {
    background-color: transparent !important;
    border: 0 !important;
    min-height: 50px;
    color: var(--skin-ink);
}

.product_search_form .input-group-prepend {
    border-right: 1px solid var(--skin-line);
}

.product_search_form .search_btn,
.product_search_form .search_btn:hover {
    background: transparent !important;
    color: var(--skin-ink) !important;
    border: 0 !important;
    padding: 0 18px;
}

.product_search_form .search_btn:hover {
    color: var(--skin-accent) !important;
}

/* Menu bar: white, with a hairline under it. The colours follow the theme's own options. */
.bottom_header {
    background: var(--header-menu-background-color, #fff) !important;
    border-top: 1px solid var(--skin-line);
    border-bottom: 1px solid var(--skin-line);
}

.bottom_header .navbar-nav > li > .nav-link,
.bottom_header .navbar .attr-nav li .nav-link,
.bottom_header .navbar .attr-nav li a {
    color: var(--header-menu-text-color, var(--skin-ink)) !important;
    text-transform: none !important;
    font-weight: 500;
    font-size: 15px;
    letter-spacing: 0;
}

.bottom_header .navbar-nav > li > .nav-link:hover,
.bottom_header .navbar-nav > li.active > .nav-link,
.bottom_header .navbar .attr-nav li a:hover {
    color: var(--skin-accent) !important;
}

.main_menu_uppercase .navbar-nav > li > .nav-link {
    text-transform: none !important;
}

.navbar .dropdown-menu,
.cart_box,
.categories_wrap #navCatContent,
#navCatContent {
    border: 1px solid var(--skin-line);
    border-radius: 0 0 var(--skin-radius-lg) var(--skin-radius-lg);
    box-shadow: 0 14px 34px rgba(4, 4, 4, .07);
    background: #fff;
}

.navbar .dropdown-menu .dropdown-item,
.navbar .dropdown-menu .nav-link,
#navCatContent .dropdown-item,
#navCatContent .nav-link {
    color: var(--skin-ink) !important;
    font-size: 15px;
    text-transform: none;
}

.navbar .dropdown-menu .dropdown-item:hover,
#navCatContent .dropdown-item:hover,
#navCatContent .nav-link:hover {
    color: var(--skin-accent) !important;
    background: transparent;
}

.categories_btn {
    background: var(--skin-accent) !important;
    color: #fff !important;
    border-radius: var(--skin-radius) var(--skin-radius) 0 0;
    font-weight: 500;
    text-transform: none;
}

.more_categories {
    color: var(--skin-accent);
    border-top: 1px solid var(--skin-line);
}

.cart_count,
.wishlist_count {
    background: var(--skin-accent);
    color: #fff;
}

/* ------------------------------------------------------ banners, sliders */

.banner_section .carousel-item,
.banner_section .background_bg,
.sale-banner img,
.shop_banner_slider img,
.single_banner img {
    border-radius: var(--skin-radius-lg);
}

.banner_content h2,
.banner_content .h2 {
    font-weight: 500;
    letter-spacing: -0.02em;
}

.banner_content h2 span,
.banner_content_subtitle {
    color: var(--skin-accent);
}

.carousel-indicators.indicators_style1 [data-bs-target],
.carousel-indicators [data-bs-target],
.owl-theme .owl-dots .owl-dot span,
.slick-dots li button {
    width: 22px !important;
    height: 3px !important;
    border-radius: 2px !important;
    border: 0 !important;
    background: #cfcfcf !important;
    opacity: 1;
}

.carousel-indicators [data-bs-target].active,
.owl-theme .owl-dots .owl-dot.active span,
.slick-dots li.slick-active button {
    background: var(--skin-accent) !important;
}

.slick-dots li button::before { display: none; }

.carousel-control-next,
.carousel-control-prev,
.owl-theme .owl-nav [class*="owl-"],
.slick-arrow {
    background: #fff !important;
    color: var(--skin-ink) !important;
    border: 1px solid var(--skin-line) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
}

.owl-theme .owl-nav [class*="owl-"]:hover,
.slick-arrow:hover {
    background: var(--skin-ink) !important;
    border-color: var(--skin-ink) !important;
    color: #fff !important;
}

/* -------------------------------------------------- section headings, tabs */

.heading_s1 h2,
.heading_s1 h3,
.heading_s1 h4,
.heading_s2 h2,
.heading_s4 h2,
.heading_tab_header .heading_s2 h4 {
    font-size: 26px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: -0.01em;
    color: var(--skin-ink);
}

.heading_s1::before,
.heading_s1::after {
    display: none;
}

.heading_tab_header {
    border-bottom: 1px solid var(--skin-line);
    padding-bottom: 14px;
    margin-bottom: 26px;
}

.nav-tabs,
.tab-style1 .nav-tabs,
.tab-style2 .nav-tabs,
.tab-style3 .nav-tabs {
    border-bottom: 0;
    gap: 6px;
}

.nav-tabs .nav-link,
.tab-style1 .nav-tabs li.nav-item a,
.tab-style2 .nav-tabs li.nav-item a,
.tab-style3 .nav-tabs li.nav-item a {
    border: 0 !important;
    background: transparent !important;
    color: var(--skin-ink);
    font-weight: 500;
    font-size: 15px;
    text-transform: none;
    padding: 6px 14px;
    position: relative;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover,
.tab-style1 .nav-tabs li.nav-item a.active,
.tab-style2 .nav-tabs li.nav-item a.active,
.tab-style3 .nav-tabs li.nav-item a.active {
    color: var(--skin-accent) !important;
}

.nav-tabs .nav-link.active::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 2px;
    background: var(--skin-accent);
    border-radius: 2px;
}

/* --------------------------------------------------------- category tiles */

.categories_box,
.cat_style1 .categories_box {
    text-align: center;
}

.categories_box a {
    display: block;
    padding: 22px 12px;
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    background: #fff;
    transition: border-color .2s ease, transform .2s ease;
}

.categories_box a:hover {
    border-color: var(--skin-ink);
    transform: translateY(-2px);
}

.categories_box span {
    color: var(--skin-ink);
    font-weight: 500;
    font-size: 15px;
}

.categories_box i {
    color: var(--skin-accent);
}

/* ------------------------------------------------------------ product card */

.product,
.product_wrap {
    background: #fff;
    border: 1px solid transparent;
    border-radius: var(--skin-radius-lg);
    box-shadow: none !important;
    overflow: hidden;
    transition: border-color .2s ease;
    margin-bottom: 26px;
}

.product:hover,
.product_wrap:hover {
    border-color: var(--skin-line);
    box-shadow: none !important;
}

.product_img {
    background: var(--skin-surface);
    border-radius: var(--skin-radius-lg);
    overflow: hidden;
}

.product_img img {
    transition: transform .45s ease;
}

.product:hover .product_img img {
    transform: scale(1.04);
}

.product_info {
    padding: 16px 12px 18px;
    text-align: left;
}

.product_title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 6px;
}

.product_title a {
    color: var(--skin-ink);
}

.product_title a:hover {
    color: var(--skin-accent);
}

.product_price .price,
.product_price .product-sale-price-text,
.price {
    color: var(--skin-accent);
    font-weight: 600;
    font-size: 17px;
}

.product_price del,
.product_price .product-price-original,
.product_price .product-price-original del {
    color: #9a9a9a;
    font-weight: 400;
    font-size: 14px;
}

.on_sale,
.on_sale span,
.on_sale_percentage_text {
    color: #1a8f52;
    font-size: 13px;
    font-weight: 500;
}

.pr_flash,
.pr_flash.bg-success,
.pr_flash.bg-danger {
    background: var(--skin-accent) !important;
    color: #fff;
    border-radius: var(--skin-radius);
    font-size: 12px;
    font-weight: 500;
    text-transform: none;
    padding: 3px 10px;
    top: 12px;
    left: 12px;
}

.rating_wrap .rating_num {
    color: var(--skin-muted);
    font-size: 13px;
}

.pr_desc p {
    color: var(--skin-muted);
}

/* Hover actions: white round buttons on the image. */
.product_action_box li a,
.pr_action_btn li a {
    background: #fff;
    color: var(--skin-ink);
    border-radius: 50%;
    box-shadow: 0 4px 14px rgba(4, 4, 4, .10);
    border: 0;
}

.product_action_box li a:hover,
.pr_action_btn li a:hover {
    background: var(--skin-accent);
    color: #fff;
}

.product_action_box li.add-to-cart a,
.pr_action_btn li.add-to-cart a {
    border-radius: var(--skin-radius);
}

.product_img::before {
    background: rgba(4, 4, 4, .04);
}

/* Deal of the day and small list products */
.deal_wrap {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    box-shadow: none;
}

.countdown_time .countdown_box .countdown-wrap,
.countdown_style4 .countdown_box .countdown-wrap {
    background: var(--skin-surface);
    border-radius: var(--skin-radius);
    color: var(--skin-ink);
}

.deal_progress .progress { background: var(--skin-surface); height: 6px; border-radius: 3px; }
.deal_progress .progress-bar { background: var(--skin-accent); }

/* ------------------------------------------------- feature strip, banners */

.icon_box,
.icon_box_style1 {
    border: 0;
    padding: 18px 10px;
}

.icon_box .icon i,
.icon_box_style1 .icon i {
    color: var(--skin-accent);
}

.icon_box_content h5,
.icon_box_title {
    font-size: 16px;
    font-weight: 600;
}

/* ------------------------------------------------- page title, breadcrumb */

.breadcrumb_section {
    background: var(--skin-surface) !important;
    padding: 34px 0;
}

.breadcrumb_section .page-title h1,
.page-title h1 {
    font-size: 26px;
    font-weight: 600;
    text-transform: none;
}

.breadcrumb-item,
.breadcrumb-item a {
    color: var(--skin-muted);
    font-size: 14px;
}

.breadcrumb-item.active,
.breadcrumb-item a:hover {
    color: var(--skin-ink);
}

/* --------------------------------------------------- shop listing, sidebar */

.product_header {
    border-bottom: 1px solid var(--skin-line);
    padding-bottom: 16px;
    margin-bottom: 26px;
}

.shorting_icon {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius);
    color: var(--skin-muted);
}

.shorting_icon.active,
.shorting_icon:hover {
    background: var(--skin-ink);
    border-color: var(--skin-ink);
    color: #fff;
}

.sidebar .widget,
.bb-shop-sidebar .bb-product-filter {
    border: 0;
    border-bottom: 1px solid var(--skin-line);
    padding-bottom: 22px;
    margin-bottom: 22px;
}

.sidebar .widget_title,
.bb-product-filter-title {
    font-size: 17px;
    font-weight: 600;
    text-transform: none;
    color: var(--skin-ink);
    margin-bottom: 14px;
}

.bb-product-filter-link,
.widget_categories li a,
.widget_links li a {
    color: var(--skin-muted);
    font-size: 15px;
}

.bb-product-filter-link:hover,
.bb-product-filter-link.active,
.widget_categories li a:hover,
.widget_links li a:hover {
    color: var(--skin-accent);
}

.ui-slider.ui-widget-content {
    background: var(--skin-line);
    height: 4px;
    border: 0;
}

.ui-slider .ui-slider-range {
    background: var(--skin-accent);
}

.ui-slider .ui-slider-handle {
    background: #fff;
    border: 2px solid var(--skin-accent);
    border-radius: 50%;
}

.pagination .page-link,
.pagination_style1 .page-link {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius) !important;
    color: var(--skin-ink);
    margin: 0 3px;
    min-width: 40px;
    text-align: center;
}

.pagination .page-item.active .page-link,
.pagination .page-link:hover {
    background: var(--skin-ink);
    border-color: var(--skin-ink);
    color: #fff;
}

/* ----------------------------------------------------------- product page */

.product_img_box,
.product-image {
    border: 0;
    background: var(--skin-surface);
    border-radius: var(--skin-radius-lg);
    overflow: hidden;
}

.product_gallery_item a,
.product_gallery_item .item {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius);
    overflow: hidden;
}

.product_gallery_item a.active,
.product_gallery_item .slick-current a {
    border-color: var(--skin-accent);
}

.pr_detail .product_title,
.pr_detail h1.product_title,
.pr_detail .product_description .product_title {
    font-size: 28px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.pr_detail .product_price .price,
.pr_detail .product-sale-price-text {
    font-size: 26px;
}

.pr_detail .pr_desc p,
.pr_detail .product_description p {
    color: var(--skin-muted);
}

.pr_detail hr,
.product-meta,
.product_share {
    border-color: var(--skin-line);
}

.product-meta li,
.product-meta li a {
    color: var(--skin-muted);
}

.product-meta li a:hover {
    color: var(--skin-accent);
}

.number-items-available {
    color: #1a8f52;
    font-weight: 500;
}

.cart-product-quantity .quantity,
.quantity {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius);
    display: inline-flex;
    align-items: center;
    overflow: hidden;
}

.quantity .minus,
.quantity .plus {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--skin-ink);
    width: 40px;
    height: 44px;
    line-height: 44px;
}

.quantity .minus:hover,
.quantity .plus:hover {
    background: var(--skin-surface);
    color: var(--skin-accent);
}

.quantity .qty {
    border: 0;
    background: transparent;
    height: 44px;
    min-height: 44px;
    width: 46px;
    text-align: center;
    color: var(--skin-ink);
}

.attribute-swatch-item,
.product_color_switch span,
.visual-swatch label span {
    border-radius: var(--skin-radius);
}

.bb-social-sharing__item a,
.product_share .social_icons li a {
    border: 1px solid var(--skin-line);
    border-radius: 50%;
    color: var(--skin-ink);
    background: #fff;
}

.bb-social-sharing__item a:hover,
.product_share .social_icons li a:hover {
    background: var(--skin-accent);
    border-color: var(--skin-accent);
    color: #fff;
}

.tab-style3 .tab-content,
.shop_info_tab {
    border-top: 1px solid var(--skin-line);
    padding-top: 26px;
}

.product-specification-table td,
.product-specification-table th,
.table td,
.table th {
    border-color: var(--skin-line);
}

.review-item,
.product-review-summary {
    border-color: var(--skin-line);
}

.product-review-progress-bar-value {
    background: var(--skin-accent);
}

/* ------------------------------------------------------- cart and checkout */

.shop_cart_table table,
.table-responsive.shop_cart_table,
.shop_cart_table {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    overflow: hidden;
}

.shop_cart_table thead th,
.table thead th {
    background: var(--skin-surface);
    color: var(--skin-ink);
    font-weight: 600;
    text-transform: none;
    border-bottom: 1px solid var(--skin-line);
}

.cart_totals,
.order_review,
.toggle_info,
.payment_method,
.bb-customer-card {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    background: #fff;
    box-shadow: none;
}

.cart_total_amount,
.product-subtotal,
.cart_total_amount strong {
    color: var(--skin-ink);
    font-weight: 600;
}

.cart_box .cart_list li,
.cart_box .cart_footer {
    border-color: var(--skin-line);
}

.cart_box .cart_total strong,
.cart_box .cart_price {
    color: var(--skin-accent);
}

.alert {
    border-radius: var(--skin-radius);
    border: 1px solid var(--skin-line);
}

/* -------------------------------------------------------- blog, testimonials */

.blog_post,
.blog_style1 {
    border: 0;
    box-shadow: none;
}

.blog_img {
    border-radius: var(--skin-radius-lg);
    overflow: hidden;
}

.blog_title a,
.blog_content h5 a,
.blog_content h6 a {
    color: var(--skin-ink);
    font-weight: 600;
}

.blog_title a:hover,
.blog_content h5 a:hover,
.blog_content h6 a:hover {
    color: var(--skin-accent);
}

.blog_meta li,
.blog_meta li a {
    color: var(--skin-muted);
    font-size: 14px;
}

.testimonial_box,
.testimonial_style1 .testimonial_box {
    background: var(--skin-surface);
    border: 0;
    border-radius: var(--skin-radius-lg);
    box-shadow: none;
    padding: 30px;
}

.cl_logo,
.client_logo .cl_logo {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    background: #fff;
}

/* ------------------------------------------------------- newsletter block */

.bg_default {
    background-color: var(--skin-strip) !important;
}

.bg_default .heading_s1 h3,
.bg_default h3,
.bg_default p {
    color: var(--skin-ink) !important;
}

.newsletter_form2 input,
.newsletter_form input {
    background: #fff;
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius);
    color: var(--skin-ink);
}

.newsletter_form2 .btn,
.newsletter_form .btn {
    border-radius: var(--skin-radius);
    background: var(--skin-ink) !important;
    border-color: var(--skin-ink) !important;
    color: #fff !important;
}

.newsletter_form2 .btn:hover,
.newsletter_form .btn:hover {
    background: var(--skin-accent) !important;
    border-color: var(--skin-accent) !important;
}

.subscribe_popup .modal-content,
.modal-content {
    border: 0;
    border-radius: var(--skin-radius-lg);
    overflow: hidden;
}

/* ------------------------------------------------------------------ footer */

footer.footer_dark,
.footer_dark {
    background-color: var(--footer-background-color, #fff) !important;
    background-image: none !important;
    color: var(--footer-text-color, var(--skin-ink));
    border-top: 1px solid var(--skin-line);
}

.footer_dark .footer_top {
    padding: 64px 0 34px;
}

.footer_dark .widget_title,
.footer_dark h6,
.footer_dark h5 {
    color: var(--footer-text-color, var(--skin-ink)) !important;
    font-size: 16px;
    font-weight: 600;
    text-transform: none;
    margin-bottom: 18px;
}

.footer_dark p,
.footer_dark li,
.footer_dark .widget_links li a,
.footer_dark .contact_info li span,
.footer_dark .contact_info li a,
.footer_dark .contact_info li p {
    color: var(--skin-muted) !important;
    font-size: 15px;
}

.footer_dark .widget_links li a:hover,
.footer_dark .contact_info li a:hover {
    color: var(--skin-accent) !important;
}

.footer_dark .contact_info li i,
.footer_dark .contact_info_light li i {
    color: var(--skin-accent);
}

.footer_dark .social_icons li a,
.social_white li a {
    background: var(--skin-surface) !important;
    color: var(--skin-ink) !important;
    border: 0;
    border-radius: 50%;
}

.footer_dark .social_icons li a:hover,
.social_white li a:hover {
    background: var(--skin-accent) !important;
    color: #fff !important;
}

.footer_dark .bottom_footer,
.bottom_footer.border-top-tran {
    border-top: 1px solid var(--skin-line) !important;
    padding: 20px 0;
}

.footer_dark .bottom_footer p {
    color: var(--skin-muted) !important;
    font-size: 14px;
}

.scrollup {
    background: var(--skin-ink);
    color: #fff;
    border-radius: 50%;
}

.scrollup:hover {
    background: var(--skin-accent);
}

/* --------------------------------------------------- account, auth pages */

.login_wrap,
.login_register_wrap .login_wrap,
.dashboard_content .card,
.dashboard_menu {
    border: 1px solid var(--skin-line);
    border-radius: var(--skin-radius-lg);
    box-shadow: none;
}

.dashboard_menu .nav-link {
    color: var(--skin-ink);
    border-color: var(--skin-line);
}

.dashboard_menu .nav-link.active,
.dashboard_menu .nav-link:hover {
    background: var(--skin-accent);
    color: #fff;
}

.card {
    border-color: var(--skin-line);
    border-radius: var(--skin-radius-lg);
}

.card-header {
    background: var(--skin-surface);
    border-bottom-color: var(--skin-line);
    font-weight: 600;
}

/* ------------------------------------------------------------------ small */

@media (max-width: 991.98px) {
    .section { padding-top: 46px; padding-bottom: 46px; }

    .middle-header { padding: 14px 0; }

    .heading_s1 h2,
    .heading_s1 h3,
    .heading_s2 h2,
    .heading_s4 h2 { font-size: 22px; }

    .pr_detail .product_title { font-size: 24px; }

    .bottom_header .navbar-collapse {
        background: #fff;
        border-top: 1px solid var(--skin-line);
    }
}

@media (max-width: 575.98px) {
    .product_info { padding: 12px 8px 14px; }
    .product_title { font-size: 15px; }
    .btn { padding: 10px 20px; }
    .footer_dark .footer_top { padding: 44px 0 20px; }
}

@media (prefers-reduced-motion: reduce) {
    .product_img img,
    .categories_box a,
    a,
    .btn {
        transition: none !important;
    }

    .product:hover .product_img img,
    .categories_box a:hover {
        transform: none;
    }
}

/* ------------------------------------------------------------ corrections */

/* The category button's label and icon stay white on the accent colour. */
.categories_btn,
.categories_btn span,
.categories_btn i {
    color: #fff !important;
}

/* Slider dots: plain bars (Bootstrap gives them transparent borders and a clipped background). */
.carousel-indicators [data-bs-target],
.carousel-indicators.indicators_style1 [data-bs-target] {
    background-clip: border-box !important;
    box-shadow: none !important;
    outline: 0 !important;
    margin: 0 3px !important;
    text-indent: -999px;
}

.carousel-indicators [data-bs-target]::before,
.carousel-indicators [data-bs-target]::after {
    display: none !important;
}

/* The demo content puts Bootstrap's utility classes on buttons; the skin's shape and case win. */
.btn.text-uppercase {
    text-transform: none !important;
}

.btn.rounded-0:not(.input-group .btn) {
    border-radius: var(--skin-radius) !important;
}

/* Language and currency pickers in the top strip: plain text, not buttons. */
.btn.btn-select-language,
.top-header .dropdown-toggle {
    background: transparent !important;
    border: 0 !important;
    color: var(--skin-ink) !important;
    padding: 0 !important;
    text-transform: none !important;
    font-weight: 400;
    font-size: 14px;
}

/* Product names are headings (h3/h6) in the theme: one size everywhere. */
.product .product_title,
.product_wrap .product_title,
h3.product_title,
h6.product_title {
    font-size: 16px !important;
    font-weight: 500 !important;
}

.pr_detail .product_title,
.pr_detail h1.product_title,
.pr_detail h4.product_title {
    font-size: 28px !important;
    font-weight: 600 !important;
}

.heading_s4 h4,
.heading_s4 h2 {
    font-weight: 600;
}

/* Cart: one tidy quantity control and a coupon field that lines up with its button */
.shop_cart_table .quantity,
.product-quantity .quantity {
    display: inline-flex;
    align-items: center;
    padding: 0;
}

.shop_cart_table .quantity .minus,
.shop_cart_table .quantity .plus,
.shop_cart_table .quantity .qty,
.product-quantity .quantity .minus,
.product-quantity .quantity .plus,
.product-quantity .quantity .qty {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 44px !important;
    line-height: 44px;
    float: none;
}

.shop_cart_table .quantity .minus:hover,
.shop_cart_table .quantity .plus:hover {
    background: var(--skin-surface) !important;
}

.form-coupon-wrapper {
    align-items: stretch;
    padding: 12px;
}

.form-coupon-wrapper .coupon-code {
    border: 1px solid var(--skin-line) !important;
    border-right: 0 !important;
    height: 44px;
}

.form-coupon-wrapper .btn-apply-coupon-code {
    height: 44px;
    padding: 0 18px;
}

/* Bootstrap's "primary" helpers follow the store colour (account dashboard cards, links, outlines) */
.bg-primary {
    background-color: var(--skin-accent) !important;
}

.bg-primary.bg-opacity-10 {
    background-color: color-mix(in srgb, var(--skin-accent) 10%, transparent) !important;
}

.bg-primary.bg-opacity-25 {
    background-color: color-mix(in srgb, var(--skin-accent) 25%, transparent) !important;
}

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

.border-primary {
    border-color: var(--skin-accent) !important;
}

.btn-outline-primary {
    color: var(--skin-accent);
    border-color: var(--skin-accent);
}

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

/* A footer "Contact Info" column with no address, email or phone filled in is a heading over nothing. */
/* (:has() cannot be nested, hence the two-part test.) */
footer [class*="col-"]:has(> .widget > ul.contact_info):not(:has(ul.contact_info li)) {
    display: none;
}

/* ------------------------------------------------ an empty store's welcome */

/* Written into a new empty store's home page (TenantSetupCommand::welcome). */
.store-welcome {
    max-width: 760px;
    margin: 0 auto;
    padding: 96px 20px 88px;
    text-align: center;
}

.store-welcome-kicker {
    margin: 0 0 14px;
    color: var(--skin-muted);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.store-welcome h1 {
    margin: 0;
    font-size: clamp(34px, 5.4vw, 60px);
    line-height: 1.08;
    letter-spacing: -.03em;
}

.store-welcome p:last-child {
    max-width: 520px;
    margin: 18px auto 0;
    color: var(--skin-muted);
    font-size: 18px;
    line-height: 1.55;
}

/* Once the page shows a product, the shop is open: the welcome steps aside, and so does a product heading over nothing before that. */
body:has(.product_wrap, .product, .sx-card) .store-welcome,
body:has(.store-welcome):not(:has(.product_wrap, .product, .sx-card)) .heading_tab_header,
body:has(.store-welcome):not(:has(.product_wrap, .product, .sx-card)) .sx-hero {
    display: none;
}