:root {
    --shop-blue: #063b82;
    --shop-blue-dark: #032957;
    --shop-blue-soft: #eaf3ff;
    --shop-yellow: #ffc400;
    --shop-yellow-dark: #e0a900;
    --shop-ink: #14243a;
    --shop-muted: #718096;
    --shop-line: #dce5ef;
    --shop-surface: #f5f8fc;
    --shop-white: #ffffff;
    --shop-shadow: 0 10px 28px rgba(13, 46, 87, .08);
}

body:has(.shop-archive),
body:has(.tp-product-details-area),
body:has(.tp-checkout-area),
body:has(.tp-cart-area) {
    background: var(--shop-surface);
    color: var(--shop-ink);
}

.tp-header-shop-area {
    background: var(--shop-white);
    border-bottom: 1px solid var(--shop-line);
    padding-top: 0 !important;
}

.tp-header-shop-wrap {
    background: var(--shop-blue) !important;
    border-radius: 0;
    box-shadow: 0 4px 16px rgba(3, 41, 87, .16);
    color: var(--shop-white);
}

.tp-header-shop-menu > nav > ul > li > a,
.tp-header-shop-action button,
.tp-header-shop-action a,
.tp-header-shop-cart button {
    color: var(--shop-white);
    font-weight: 700;
}

.tp-header-shop-menu > nav > ul > li > a:hover,
.tp-header-shop-action a:hover,
.tp-header-shop-action button:hover {
    color: var(--shop-yellow);
}

.tp-header-shop-logo img {
    max-height: 42px;
    width: auto;
    object-fit: contain;
}

.tp-header-shop-cart button {
    background: var(--shop-yellow);
    color: var(--shop-ink);
    border-radius: 4px;
    padding: 9px 14px;
    font-weight: 800;
}

.tp-header-shop-cart button:hover {
    background: #ffd84d;
    color: var(--shop-ink);
}

.shop-archive {
    padding-top: 145px !important;
    padding-bottom: 80px !important;
}

.shop-archive .tp-shop-section-subtitle,
.shop-archive .tp-shop-section-title,
.shop-archive h1,
.shop-archive h2,
.shop-archive h3,
.shop-archive h4 {
    color: var(--shop-ink);
}

.shop-archive .tp-shop-section-title {
    font-size: clamp(1.8rem, 3vw, 2.7rem);
    font-weight: 800;
}

.shop-archive .tp-product-item {
    background: var(--shop-white);
    border: 1px solid var(--shop-line);
    border-radius: 6px;
    box-shadow: var(--shop-shadow);
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.shop-archive .tp-product-item:hover {
    border-color: var(--shop-yellow);
    box-shadow: 0 16px 32px rgba(13, 46, 87, .14);
    transform: translateY(-3px);
}

.shop-archive .tp-product-item-thumb {
    background: var(--shop-white);
    border-bottom: 1px solid var(--shop-line);
    min-height: 245px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.shop-archive .tp-product-item-thumb img {
    height: 220px;
    object-fit: contain;
    padding: 22px;
}

.shop-archive .tp-product-item-content {
    padding: 16px 18px 20px;
}

.shop-archive .tp-product-item-title a {
    color: var(--shop-ink);
    font-weight: 800;
    line-height: 1.35;
}

.shop-archive .tp-product-item-title a:hover {
    color: var(--shop-blue);
}

.shop-archive .tp-product-item-price-new {
    color: var(--shop-blue);
    font-size: 1.05rem;
    font-weight: 900;
}

.shop-archive .tp-product-item-btn .tp-action-btn,
.shop-archive .tp-product-item-btn button {
    background: var(--shop-yellow);
    color: var(--shop-ink);
    border-radius: 4px;
    font-weight: 800;
}

.shop-archive .tp-product-item-btn .tp-action-btn:hover,
.shop-archive .tp-product-item-btn button:hover {
    background: var(--shop-blue);
    color: var(--shop-white);
}

.shop-archive .tp-product-item-badge.on-sale,
.shop-archive .tp-product-item-badge.new {
    background: var(--shop-yellow);
    color: var(--shop-ink);
    font-weight: 800;
}

.shop-archive .shop-sidebar,
.shop-archive .tp-shop-widget,
.shop-archive .tp-product-filter-wrap {
    background: var(--shop-white);
    border: 1px solid var(--shop-line);
    border-radius: 6px;
}

.shop-archive .shop-sidebar,
.shop-archive .tp-shop-widget {
    padding: 20px;
}

.shop-archive .form-control,
.shop-archive input,
.shop-archive select {
    border: 1px solid var(--shop-line);
    border-radius: 4px;
    min-height: 42px;
}

.shop-archive input:focus,
.shop-archive select:focus {
    border-color: var(--shop-blue);
    box-shadow: 0 0 0 3px rgba(6, 59, 130, .12);
}

.shop-archive .tp-product-filter-select select {
    color: var(--shop-ink);
    font-weight: 700;
    background-color: var(--shop-white);
}

.shop-archive .pagination .page-link {
    color: var(--shop-blue);
    border-color: var(--shop-line);
    font-weight: 700;
}

.shop-archive .pagination .active .page-link {
    background: var(--shop-blue);
    border-color: var(--shop-blue);
    color: var(--shop-white);
}

.tp-cart-mini-wrapper,
.tp-cartmini-wrapper,
.tp-search-area {
    border-color: var(--shop-line);
}

@media (max-width: 1199px) {
    .shop-archive {
        padding-top: 105px !important;
    }
}

@media (max-width: 575px) {
    .shop-archive {
        padding-top: 88px !important;
    }

    .shop-archive .tp-product-item-thumb {
        min-height: 190px;
    }

    .shop-archive .tp-product-item-thumb img {
        height: 170px;
    }
}

/* Full ecommerce skin: shared by products, details, cart, checkout and account pages. */
.shop-experience {
    --shop-blue: #0755a0;
    --shop-blue-dark: #06366f;
    --shop-yellow: #ffc400;
    --shop-ink: #172b4d;
    --shop-muted: #6d7d91;
    --shop-line: #d9e3ee;
    --shop-surface: #f3f7fb;
    background: var(--shop-surface);
    color: var(--shop-ink);
}

.shop-utility-bar {
    background: var(--shop-blue-dark);
    color: #d8e8fb;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .02em;
}

.shop-utility-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    min-height: 32px;
    padding: 0 2.5rem;
}

.shop-utility-links {
    display: flex;
    gap: 1.2rem;
}

.shop-utility-links a {
    color: #fff;
    text-decoration: none;
}

.shop-utility-links a:hover {
    color: var(--shop-yellow);
}

.shop-experience .tp-header-shop-area {
    padding: 0 !important;
    background: #fff;
}

.shop-experience .tp-header-shop-wrap {
    max-width: none;
    margin: 0;
    padding: 14px 2.5rem;
    background: #fff !important;
    border-bottom: 1px solid var(--shop-line);
    border-radius: 0;
    box-shadow: none;
    color: var(--shop-ink);
}

.shop-experience .tp-header-shop-menu > nav > ul > li > a,
.shop-experience .tp-header-shop-action button,
.shop-experience .tp-header-shop-action a {
    color: var(--shop-ink);
}

.shop-experience .tp-header-shop-menu > nav > ul > li > a:hover,
.shop-experience .tp-header-shop-action button:hover,
.shop-experience .tp-header-shop-action a:hover {
    color: var(--shop-blue);
}

.shop-experience .tp-header-shop-logo img {
    max-height: 48px;
}

.shop-experience .tp-header-shop-cart button {
    background: var(--shop-yellow);
    color: var(--shop-ink);
    border-radius: 3px;
    box-shadow: 0 4px 12px rgba(255, 196, 0, .22);
}

.shop-experience .tp-header-shop-cart button:hover {
    background: var(--shop-blue);
    color: #fff;
}

.shop-experience main {
    background: var(--shop-surface);
}

.shop-experience .tp-breadcrumb-area,
.shop-experience .tp-shop-breadcrumb-area {
    background: linear-gradient(105deg, var(--shop-blue-dark), var(--shop-blue)) !important;
    color: #fff;
}

.shop-experience .tp-breadcrumb-area h1,
.shop-experience .tp-breadcrumb-area a,
.shop-experience .tp-shop-breadcrumb-area h1,
.shop-experience .tp-shop-breadcrumb-area a {
    color: #fff;
}

.shop-experience .tp-product-details-area,
.shop-experience .tp-cart-area,
.shop-experience .tp-checkout-area,
.shop-experience .tp-wishlist-area,
.shop-experience .tp-login-area,
.shop-experience .tp-dashboard-area {
    background: var(--shop-surface);
}

.shop-experience .tp-product-details-wrapper,
.shop-experience .tp-cart-wrapper,
.shop-experience .tp-checkout-wrapper,
.shop-experience .tp-checkout-place,
.shop-experience .tp-dashboard-wrapper,
.shop-experience .tp-wishlist-wrapper {
    background: #fff;
    border: 1px solid var(--shop-line);
    border-radius: 6px;
    box-shadow: var(--shop-shadow);
}

.shop-experience .tp-product-details-title,
.shop-experience .tp-cart-title,
.shop-experience .tp-checkout-title,
.shop-experience .tp-dashboard-title,
.shop-experience .tp-wishlist-title {
    color: var(--shop-ink);
    font-weight: 850;
}

.shop-experience .tp-product-details-price,
.shop-experience .tp-cart-total,
.shop-experience .tp-checkout-total,
.shop-experience .tp-product-item-price-new {
    color: var(--shop-blue);
    font-weight: 900;
}

.shop-experience .tp-product-details-action button,
.shop-experience .tp-checkout-btn,
.shop-experience .tp-cart-btn,
.shop-experience .tp-dashboard-btn,
.shop-experience .tp-action-btn,
.shop-experience .tp-product-item-btn button {
    background: var(--shop-yellow);
    border: 1px solid var(--shop-yellow);
    color: var(--shop-ink);
    border-radius: 3px;
    font-weight: 850;
}

.shop-experience .tp-product-details-action button:hover,
.shop-experience .tp-checkout-btn:hover,
.shop-experience .tp-cart-btn:hover,
.shop-experience .tp-dashboard-btn:hover,
.shop-experience .tp-action-btn:hover,
.shop-experience .tp-product-item-btn button:hover {
    background: var(--shop-blue);
    border-color: var(--shop-blue);
    color: #fff;
}

.shop-experience input:not([type="checkbox"]):not([type="radio"]),
.shop-experience select,
.shop-experience textarea,
.shop-experience .form-control,
.shop-experience .form-select {
    min-height: 44px;
    border: 1px solid var(--shop-line);
    border-radius: 3px;
    background: #fff;
    color: var(--shop-ink);
}

.shop-experience input:focus,
.shop-experience select:focus,
.shop-experience textarea:focus,
.shop-experience .form-control:focus,
.shop-experience .form-select:focus {
    border-color: var(--shop-blue);
    box-shadow: 0 0 0 3px rgba(7, 85, 160, .13);
    outline: 0;
}

.shop-experience table thead th {
    background: var(--shop-blue-dark);
    color: #fff;
    border-color: var(--shop-blue-dark);
    font-size: .72rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.shop-experience .tp-cart-mini-wrapper,
.shop-experience .tp-cartmini-wrapper,
.shop-experience .tp-search-area {
    border-color: var(--shop-line);
    background: #fff;
}

@media (max-width: 767px) {
    .shop-utility-inner,
    .shop-experience .tp-header-shop-wrap {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .shop-utility-inner {
        min-height: 38px;
        font-size: .68rem;
    }

    .shop-utility-inner > span {
        max-width: 48%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .shop-utility-links {
        gap: .65rem;
    }
}