/* ============================================
   Market Theme - tp-* Design Tokens
   Targets BEM class names matching demosc.auwhj.com
   Works WITH Bootstrap 4, does NOT replace it
   ============================================ */

/* === CSS Design Tokens (from demosc.auwhj.com) === */
:root {
    --tp-ff-body: 'Jost', sans-serif;
    --tp-ff-heading: 'Jost', sans-serif;
    --tp-common-white: #ffffff;
    --tp-common-black: #000;
    --tp-common-yellow: #ffcd00;
    --tp-heading-primary: #000;
    --tp-text-body: #040404;
    --tp-text-primary: #d51243;
    --tp-text-secondary: #a60532;
    --tp-text-tertiary: #adadad;
    --tp-text-4: #a0a0a0;
    --tp-text-5: #999999;
    --tp-border-1: #e7e7e7;
    --tp-border-2: #f6f6f6;
    --tp-border-4: #e0e0e0;
    --tp-grey-1: #a5a5a6;
    --tp-grey-2: #f3f4f7;
    --tp-grey-8: #f6f6f6;
    --tp-theme-1: #3D6CE7;
    --tp-theme-2: #f3eee7;
    --tp-theme-3: #f7f7f7;
    --tp-theme-6: #f8f8f8;
}

/* === Global === */
body {
    font-family: var(--tp-ff-body);
    font-weight: 400;
    font-size: 15px;
    color: var(--tp-text-body);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--tp-ff-heading);
    font-weight: 600;
    color: var(--tp-heading-primary);
}

a { color: var(--tp-text-body); transition: color .2s; }
a:hover { color: var(--tp-text-primary); text-decoration: none; }

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

/* === Buttons === */
.btn {
    font-family: var(--tp-ff-body);
    font-weight: 600;
    font-size: 14px;
    padding: 10px 24px;
    border-radius: 6px;
    transition: all .3s;
}

.btn-primary {
    background: var(--tp-text-primary) !important;
    border-color: var(--tp-text-primary) !important;
    color: #fff !important;
}
.btn-primary:hover { background: var(--tp-text-secondary) !important; border-color: var(--tp-text-secondary) !important; }
.btn-soft-primary { background: rgba(213,18,67,.1) !important; color: var(--tp-text-primary) !important; border: none !important; }
.btn-soft-primary:hover { background: var(--tp-text-primary) !important; color: #fff !important; }
.btn-outline-primary { color: var(--tp-text-primary) !important; border-color: var(--tp-text-primary) !important; }
.btn-outline-primary:hover { background: var(--tp-text-primary) !important; color: #fff !important; }

/* === Header: Top Bar === */
.header-meta {
    background: #fff;
    border-bottom: 1px solid var(--tp-border-1);
    font-size: 13px;
    padding: 6px 0;
}
.header-meta__lang > ul > li > a { padding: 4px 8px; display: flex; align-items: center; }
.header-meta__lang-submenu { min-width: 140px; }
.header-meta__lang-submenu li a { padding: 6px 16px; font-size: 13px; }
.header-meta__lang-submenu li a:hover { background: rgba(213,18,67,.06); color: var(--tp-text-primary); }
.header-meta__social a { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; color: var(--tp-text-5); transition: all .2s; }
.header-meta__social a:hover { color: var(--tp-text-primary); }
.header-meta__value .nice-select { border: none; padding-left: 0; font-size: 13px; }

/* === Header: Search Bar === */
.header-search-bar {
    padding: 12px 0;
    background: #fff;
}
.header-search-bar input {
    border: 2px solid var(--tp-border-1);
    border-radius: 8px;
    height: 46px;
    font-size: 14px;
    padding: 0 16px;
    background: var(--tp-theme-3);
    transition: all .3s;
}
.header-search-bar input:focus {
    border-color: var(--tp-text-primary);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(213,18,67,.08);
}

/* === Header: Sticky Nav === */
.header-sticky {
    background: #fff;
    border-top: 1px solid var(--tp-border-1);
    border-bottom: 1px solid var(--tp-border-1);
    box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.header-sticky .main-menu nav > ul { display: flex; list-style: none; margin: 0; padding: 0; }
.header-sticky .main-menu nav > ul > li > a {
    display: block;
    padding: 14px 18px;
    font-weight: 500;
    font-size: 14px;
    color: var(--tp-text-body);
    text-transform: capitalize;
    transition: color .2s;
}
.header-sticky .main-menu nav > ul > li > a:hover { color: var(--tp-text-primary); }
.header-action { display: flex; align-items: center; gap: 8px; }
.header-action .nav-box-link { font-size: 20px; color: var(--tp-text-body); position: relative; padding: 8px; }
.header-action .nav-box-link:hover { color: var(--tp-text-primary); }
.header-cart span { position: absolute; top: 0; right: 0; background: var(--tp-text-primary); color: #fff; font-size: 10px; min-width: 18px; height: 18px; line-height: 18px; text-align: center; border-radius: 50%; }

/* === Footer CTA === */
.footer-cta {
    background: #fff;
    border-top: 1px solid var(--tp-border-1);
    padding: 0;
}
.footer-cta__icon { color: var(--tp-text-primary); }
.footer-cta__text { font-size: 14px; font-weight: 600; }

/* === Footer Main === */
.footer-bg {
    background: #111 !important;
    padding: 60px 0 !important;
    color: rgba(255,255,255,.5);
}
.footer-bg a { color: rgba(255,255,255,.6); }
.footer-bg a:hover { color: #fff; }
.footer-col-2, .footer-col-4, .footer-col-5 { padding: 0 15px; }
.footer-widget__title {
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.1);
    padding-bottom: 12px;
    margin-bottom: 20px;
}
.footer-widget__links { list-style: none; padding: 0; margin: 0; }
.footer-widget__links ul { list-style: none; padding: 0; }
.footer-widget__links ul li { margin-bottom: 8px; }
.footer-widget__links ul li a { color: rgba(255,255,255,.5); font-size: 14px; transition: color .2s; }
.footer-widget__links ul li a:hover { color: #fff; }

/* === Footer Copyright === */
.footer-copyright {
    background: #0a0a0a !important;
    padding: 16px 0 !important;
    border-top: 1px solid rgba(255,255,255,.05);
    color: rgba(255,255,255,.4);
    font-size: 13px;
}
.footer-copyright__content span a { color: rgba(255,255,255,.5); }
.footer-copyright__content span a:hover { color: #fff; }
.footer-copyright__brand img { max-height: 30px; }

/* === Product Card (tpproduct) === */
.tpproduct {
    border: 1px solid var(--tp-border-2);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: all .3s;
    position: relative;
    margin: 4px 0 10px;
}
.tpproduct:hover {
    box-shadow: 0 8px 30px rgba(0,0,0,.08);
    transform: translateY(-3px);
    border-color: var(--tp-border-4);
}
.tpproduct__thumb {
    position: relative;
    overflow: hidden;
}
.tpproduct__thumb-bg a { display: block; overflow: hidden; }
.tpproduct__thumb-bg img { transition: transform .4s; }
.tpproduct:hover .tpproduct__thumb-bg img { transform: scale(1.05); }
.product-thumb-secondary {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .4s;
}
.tpproduct:hover .product-thumb-secondary { opacity: 1; }
.tpproduct__thumb-discount {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--tp-text-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    z-index: 2;
}
.tpproduct__thumb-action {
    position: absolute;
    top: 12px;
    right: -50px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: all .3s;
    z-index: 2;
}
.tpproduct:hover .tpproduct__thumb-action { right: 12px; }
.tpproduct__thumb-action a {
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    background: #fff;
    border-radius: 50%;
    color: var(--tp-text-body);
    font-size: 14px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
    transition: all .2s;
    display: block;
}
.tpproduct__thumb-action a:hover { background: var(--tp-text-primary); color: #fff; }
.tpproduct__content-area { padding: 14px 16px; }
.tpproduct__priceinfo-list { font-size: 16px; margin-bottom: 4px; }
.tpproduct__priceinfo-list span { font-weight: 700; color: var(--tp-text-primary); }
.tpproduct__priceinfo-list-oldprice { font-weight: 600; opacity: .5; font-size: 14px; }
.tpproduct__ratingarea { margin-bottom: 6px; }
.tpproduct__rating { color: var(--tp-common-yellow); font-size: 12px; }
.tpproduct__title { font-weight: 600; font-size: 13px; line-height: 1.4; margin-bottom: 8px; }
.tpproduct__title a { color: var(--tp-text-body); }
.tpproduct__title a:hover { color: var(--tp-text-primary); }
.tpproduct__cart { margin-top: 8px; }
.tpproduct__cart a { display: inline-block; }
.tpproduct__ammount {
    display: flex;
    justify-content: space-between;
    padding: 6px 16px 12px;
    font-size: 12px;
    color: var(--tp-text-5);
}

/* === Banner / Slider === */
.tpslider-banner { border-radius: 10px; overflow: hidden; }
.tpslider-banner__img img { border-radius: 10px; }

/* === Category Grid === */
.category-border { padding-bottom: 30px !important; justify-content: space-evenly !important; gap: 20px !important; }
.tpcategory { margin-bottom: 20px !important; text-align: center; cursor: pointer; }
.tpcategory__icon { margin-bottom: 10px; }
.tpcategory__icon img { border-radius: 8px; transition: transform .3s; width: 44px !important; height: 44px !important; object-fit: contain; }
.tpcategory:hover .tpcategory__icon img { transform: scale(1.03); }
.tpcategory__title { color: var(--tp-text-body); font-size: 12px; text-align: center; }

/* === Shop / Product Listing === */
.tpshop { }
.tpsidebar { }
.tpshop__products { }

/* === Product Detail === */
.tpproductdetail { }
.tpproductdetail__gallery { }
.tpproductdetail__info { }

/* === Sign In/Up === */
.tpsign { }
.tpsign__form { border-radius: 12px; border: 1px solid var(--tp-border-2); box-shadow: 0 4px 20px rgba(0,0,0,.04); }
.tpsign__form .form-control {
    border: 1px solid var(--tp-border-1);
    border-radius: 8px;
    height: 48px;
    font-size: 14px;
    transition: all .3s;
}
.tpsign__form .form-control:focus { border-color: var(--tp-text-primary); box-shadow: 0 0 0 3px rgba(213,18,67,.08); }
.tpsign__header h1 { font-size: 20px; font-weight: 700; }

/* === Cart === */
.tpcart { }

/* === Form Elements (global) === */
.form-control {
    border: 1px solid var(--tp-border-1);
    border-radius: 8px;
    font-size: 14px;
    transition: all .3s;
}
.form-control:focus {
    border-color: var(--tp-text-primary);
    box-shadow: 0 0 0 3px rgba(213,18,67,.08);
}

/* === Cards === */
.card { border-radius: 10px; border: 1px solid var(--tp-border-2); }

/* === Section Headers === */
.section-title h3, .section-title h5, .tpsectionarea h3 {
    font-weight: 700;
}

/* === Pagination === */
.basic-pagination ul li a, .basic-pagination ul li span {
    width: 40px; height: 40px; line-height: 38px;
    border-radius: 6px; border: 1px solid var(--tp-border-1);
    font-size: 14px; font-weight: 600; text-align: center;
    display: inline-block; transition: all .2s;
}
.basic-pagination ul li a:hover, .basic-pagination ul li.active a {
    background: var(--tp-text-primary);
    border-color: var(--tp-text-primary);
    color: #fff;
}

/* === Mobile Nav === */
.aiz-mobile-bottom-nav { border-radius: 16px 16px 0 0; box-shadow: 0 -4px 20px rgba(0,0,0,.08); }
.aiz-mobile-bottom-nav .bg-primary { background: var(--tp-text-primary) !important; }

/* === Cookie / Popup === */
.aiz-cookie-alert .btn-primary { }
.website-popup .modal-content { border-radius: 12px; }

/* === Responsive === */
@media (max-width: 991px) {
    .header-search-bar input { height: 40px; }
    .header-sticky .main-menu nav > ul > li > a { padding: 10px 12px; font-size: 13px; }
    .footer-bg { padding: 40px 0 !important; }
}
@media (max-width: 767px) {
    body { font-size: 14px; }
    .tpproduct__content-area { padding: 10px 12px; }
    .tpproduct__priceinfo-list { font-size: 14px; }
}