/* ============================================================
   PND-B2B Pharmacy — Modern Theme Pharma Override
   Professional B2B Pharma Look (Netmeds/1mg inspired)
   ============================================================ */

/* ── Brand Colors ── */
:root {
    --primary-color: #24A148;
    --secondary-color: #1B7F37;
}

/* ── Body & Background ── */
body {
    background-color: #F7F9FC !important;
}

/* ── Top Bar (App download strip) ── */
.bg-gradient-reverse-primary {
    background: linear-gradient(135deg, #24A148 0%, #1B7F37 100%) !important;
    color: #fff !important;
    padding: 8px 0 !important;
}

.bg-gradient-reverse-primary a,
.bg-gradient-reverse-primary span,
.bg-gradient-reverse-primary .text-dark,
.bg-gradient-reverse-primary .text-primary {
    color: #fff !important;
}

/* ── Navigation Bar ── */
.navbar.navbar-light {
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.06) !important;
}

/* ── Product Cards ── */
.card {
    border-radius: 10px !important;
    border: 1px solid #E8ECF0 !important;
    transition: all 0.3s ease !important;
}

.card:hover {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-3px) !important;
}

/* Product image hover */
.card img {
    transition: transform 0.3s ease !important;
}

.card:hover img {
    transform: scale(1.03) !important;
}

/* ── Buttons ── */
.btn-primary {
    background-color: #24A148 !important;
    border-color: #24A148 !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #1B7F37 !important;
    border-color: #1B7F37 !important;
    box-shadow: 0 4px 12px rgba(36, 161, 72, 0.3) !important;
    transform: translateY(-1px) !important;
}

/* ── Links ── */
a.text-primary,
.text-primary {
    color: #24A148 !important;
}

/* ── Footer ── */
footer.bg-dark,
.bg-dark {
    background-color: #1A2332 !important;
}

/* ── Breadcrumb ── */
.bg-soft-grape,
section.wrapper.bg-soft-grape {
    background-color: #E8F5E9 !important;
}

/* ── Search Box ── */
.search-form .form-control,
.select2-container .select2-selection {
    border: 2px solid #24A148 !important;
    border-radius: 25px !important;
}

.search-form .form-control:focus {
    box-shadow: 0 0 0 3px rgba(36, 161, 72, 0.15) !important;
}

/* ── Badge / Pills ── */
.badge.bg-primary,
.badge-primary {
    background-color: #24A148 !important;
}

/* ── Swiper Pagination ── */
.swiper-pagination-bullet-active {
    background: #24A148 !important;
}

/* ── Form Focus States ── */
.form-control:focus,
.form-select:focus {
    border-color: #24A148 !important;
    box-shadow: 0 0 0 0.2rem rgba(36, 161, 72, 0.15) !important;
}

/* ── Nav Pills / Tabs ── */
.nav-pills .nav-link.active {
    background-color: #24A148 !important;
}

/* ── Progress Bar ── */
.progress-bar {
    background-color: #24A148 !important;
}

/* ── Checkout Button ── */
.btn-checkout,
.checkout-btn {
    background: linear-gradient(135deg, #24A148 0%, #1B7F37 100%) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 12px 30px !important;
    font-weight: 600 !important;
}

/* ── Price Styling ── */
.price ins,
.amount {
    color: #1A1A2E !important;
    font-weight: 700 !important;
}

.price del {
    color: #9CA3AF !important;
}

/* ── Discount Badge ── */
.discount-badge,
.offer-badge {
    background: #FF6B35 !important;
    color: #fff !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* ── Section Headings ── */
.section-title h2,
h2.display-4 {
    font-weight: 700 !important;
    color: #1A1A2E !important;
}

/* ── See All Link ── */
a[href*="see-all"],
.see-all-link,
a.text-primary {
    color: #24A148 !important;
    font-weight: 600 !important;
}

/* ── Smooth Transitions ── */
a, button, .btn, .card, img {
    transition: all 0.2s ease !important;
}

/* ── Mobile Responsive ── */
@media (max-width: 768px) {
    .bg-gradient-reverse-primary {
        padding: 6px 0 !important;
        font-size: 12px !important;
    }
}

/* ── Product Page — Variant/Attribute Buttons (Pack Size, Flavour, etc.) ── */
.product-page-details .btn-group,
.product-page-details .variant-group,
.product-page-details ul.p-0 {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.product-page-details .btn-group .btn,
.product-page-details .btn-group label,
.product-page-details ul.p-0 li {
    white-space: nowrap !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    border-radius: 20px !important;
    border: 1px solid #E0E0E0 !important;
    background: #fff !important;
    color: #333 !important;
    cursor: pointer !important;
    margin: 0 !important;
    transition: all 0.2s ease !important;
}

.product-page-details .btn-group .btn:hover,
.product-page-details .btn-group label:hover,
.product-page-details ul.p-0 li:hover {
    border-color: #24A148 !important;
    color: #24A148 !important;
    background: #E8F5E9 !important;
}

.product-page-details .btn-group > .active,
.product-page-details .btn-group .btn.active,
.product-page-details ul.p-0 li.active {
    background-color: #24A148 !important;
    border-color: #24A148 !important;
    color: #fff !important;
}

/* ── Homepage Enhancements ── */

/* Section spacing */
section.wrapper,
.container > .row {
    margin-bottom: 10px;
}

/* Section headings */
.section-title,
h2.display-4,
.fw-bold.display-4 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1A1A2E !important;
    margin-bottom: 20px !important;
}

/* Brand/Category cards — rounded with subtle border */
.swiper-slide .card,
.brand-card,
.category-card {
    border-radius: 12px !important;
    border: 1px solid #E8ECF0 !important;
    overflow: hidden !important;
    background: #fff !important;
}

/* Hero slider — rounded corners */
.swiper-container,
.swiper {
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* "See All" link styling */
a[class*="see-all"],
.see-all {
    color: #24A148 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
}

a[class*="see-all"]:hover,
.see-all:hover {
    text-decoration: underline !important;
}

/* Product grid cards on homepage */
.product-card,
.shop-product-card {
    border-radius: 10px !important;
    border: 1px solid #E8ECF0 !important;
    background: #fff !important;
    transition: all 0.3s ease !important;
}

.product-card:hover,
.shop-product-card:hover {
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-3px) !important;
}

/* Add to Cart button on product cards */
.btn-cart,
.add-to-cart-btn,
button[class*="cart"] {
    background: #24A148 !important;
    border-color: #24A148 !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

/* ── Product Detail Page Polish ── */
.product-page-details h2,
.product-page-details h1 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1A1A2E !important;
    line-height: 1.4 !important;
}

.product-page-details .price {
    font-size: 24px !important;
    font-weight: 700 !important;
}

.product-page-details .price del {
    font-size: 16px !important;
    color: #9CA3AF !important;
    font-weight: 400 !important;
}

/* Zipcode check section */
.product-page-details input[placeholder*="Zipcode"],
.product-page-details input[placeholder*="zipcode"],
.product-page-details input[placeholder*="Pincode"] {
    border-radius: 8px 0 0 8px !important;
    border: 2px solid #E0E0E0 !important;
    padding: 12px 16px !important;
}

/* Check availability button */
.product-page-details .btn[class*="check"],
button[class*="availability"] {
    border-radius: 0 8px 8px 0 !important;
    background: #24A148 !important;
    border-color: #24A148 !important;
    font-weight: 600 !important;
}

/* ── Quantity Selector ── */
.num-in,
.quantity-selector {
    border: 2px solid #E0E0E0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: inline-flex !important;
    align-items: center !important;
}

.num-in span,
.quantity-selector button {
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    background: #F7F9FC !important;
    font-weight: 700 !important;
    font-size: 18px !important;
}

.num-in span:hover {
    background: #E8F5E9 !important;
    color: #24A148 !important;
}

.num-in input,
.quantity-selector input {
    width: 45px !important;
    text-align: center !important;
    border: none !important;
    font-weight: 600 !important;
    font-size: 15px !important;
}