/* Mobile Store — blue tech overlay on ecommerce-v5 (Karl).
   Shared catalog/cart CSS lives in vegetable-store/style.css (:is(.theme-mobile-store, ...)). */

/* Shop-card logo: narrower width, taller display (portrait transparent PNG) */
.theme-mobile-store .vs-shop__logo {
    width: 112px;
    height: 152px;
    border-radius: 18px;
    background: transparent;
    border-color: transparent;
}

.theme-mobile-store .vs-shop__logo img {
    object-fit: contain;
}

.theme-mobile-store .vs-shop__logo span {
    font-size: 56px;
}

@media (min-width: 768px) {
    .theme-mobile-store .vs-shop__logo {
        width: 136px;
        height: 188px;
        border-radius: 20px;
    }

    .theme-mobile-store .vs-shop__logo span {
        font-size: 68px;
    }
}

/* Top nav: compact bar with larger logo */
.theme-mobile-store .header_area .top_header_area {
    height: 80px;
}

.theme-mobile-store .top_logo a img {
    max-height: 68px !important;
    max-width: 180px !important;
    width: auto !important;
    height: auto !important;
}

@media (min-width: 992px) {
    .theme-mobile-store .header_area .top_header_area {
        height: 88px;
    }

    .theme-mobile-store .top_logo a img {
        max-height: 76px !important;
        max-width: 200px !important;
    }
}

/* Shop-card collage banner — white */
.theme-mobile-store .vs-shop__cover {
    height: 168px;
    background-color: #fff;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-bottom: 1px solid #e2e8f0;
}

@media (min-width: 768px) {
    .theme-mobile-store .vs-shop__cover {
        height: 220px;
    }
}

@media (min-width: 1100px) {
    .theme-mobile-store .vs-shop__cover {
        height: 260px;
    }
}

/* Hero offers strip — orange, half height */
.theme-mobile-store .vs-offers .vs-offer {
    height: 60px;
    background-color: #f97316;
}

@media (min-width: 768px) {
    .theme-mobile-store .vs-offers .vs-offer {
        height: 70px;
    }
}

.theme-mobile-store .header_area .top_header_area {
    background: #f97316;
    /* height set above with logo sizing */
}

.theme-mobile-store .header_area .top_header_area,
.theme-mobile-store .header_area .top_header_area a,
.theme-mobile-store .header_area .top_header_area .header-search-btn {
    color: #fff;
}

.theme-mobile-store .header_area .main_header_area {
    border-bottom: 3px solid #ea580c;
}

.theme-mobile-store .footer_area {
    background: #0b1220;
    color: #e8eef8;
}

/* Karl core sets `p { color: #3a3a3a }` — override so footer copy stays readable on dark bg. */
.theme-mobile-store .footer_area p,
.theme-mobile-store .footer_area .copywrite_text > p {
    color: #e8eef8;
}

.theme-mobile-store .footer_area a {
    color: #7dd3fc;
}

.theme-mobile-store .sd-footer {
    padding: 24px 0;
}

.theme-mobile-store .sd-footer p {
    margin: 0 0 6px;
    font-size: 14px;
}

.theme-mobile-store .sd-footer .sd-footer-name {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
}

.theme-mobile-store .sd-footer .sd-footer-links a {
    color: #bfdbfe;
}

.theme-mobile-store .sd-footer .sd-footer-links a:hover {
    color: #fff;
}

.theme-mobile-store .sd-footer .sd-footer-copy {
    opacity: .75;
    font-size: 12px;
    color: #94a3b8;
}

.theme-mobile-store .widget-title h6,
.theme-mobile-store .section-heading h2 {
    color: #1d4ed8;
}

.theme-mobile-store .karl-btn,
.theme-mobile-store .header-search-btn {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
}

.theme-mobile-store .single_product_desc .product-price,
.theme-mobile-store .product-price {
    color: #1d4ed8;
}

.theme-mobile-store .catagories-side-menu .nav-side-menu h6 {
    background: #1d4ed8;
    color: #fff;
}

.theme-mobile-store .welcome_area .hero_text p:first-child {
    display: inline-block;
    background: #0ea5e9;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 10px;
}

.theme-mobile-store .widget.catagory ul li a {
    border-left: 3px solid transparent;
}

.theme-mobile-store .widget.catagory ul li a:hover,
.theme-mobile-store .widget.catagory ul li.active a {
    border-left-color: #0ea5e9;
    color: #1d4ed8;
}
