/* Mobile Improvements Override */

/* Ensure these styles only apply on small screens */
@media (max-width: 768px) {
  
  /* =========================================
     Header Categories - Bigger & Readable 
     ========================================= */
  .flipkart-category-wrapper {
        gap: 15px !important;
        padding: 0 15px !important;
        height: auto !important;
        min-height: 90px !important;
        padding-top: 15px !important;
  }
  
  .flipkart-category-item {
        min-width: 75px !important;
        padding: 8px 5px !important;
        justify-content: flex-start !important;
  }

  .flipkart-category-icon {
    width: 45px !important;
    height: 45px !important;
    margin-bottom: 8px !important;
    background: #f1f3f6 !important; /* Light background for visibility */
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .flipkart-category-icon i {
    font-size: 22px !important;
    color: var(--jetlink-primary) !important;
  }

  /* Override specific inline styles if any */
  .flipkart-category-icon img {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover !important;
      border-radius: 50% !important;
  }
  
  .flipkart-category-text {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #333 !important;
    white-space: normal !important; /* Allow wrapping */
    line-height: 1.2 !important;
    max-width: 100% !important;
  }

  /* =========================================
     Product Cards (Home & Grid) 
     ========================================= */
  .mobile-product-card {
      box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
      border: none !important;
      margin-bottom: 5px !important;
  }

  .mobile-product-image {
    height: 180px !important; /* Taller image area */
    padding: 10px !important;
  }
  
  /* Make image fill the container better */
  .mobile-product-image img {
      width: auto !important;
      height: 100% !important;
      max-width: 100% !important;
  }
  
  .mobile-product-info {
      padding: 12px !important;
  }

  .mobile-product-title {
    font-size: 14px !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
    font-weight: 500 !important;
    height: 40px !important; /* Fixed height for consistency */
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  
  .mobile-product-price {
    gap: 8px !important;
    align-items: baseline !important;
  }

  .mobile-product-new-price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #212121 !important;
  }
  
  .mobile-product-old-price {
    font-size: 12px !important;
    color: #878787 !important;
  }
  
  .mobile-product-badge {
      font-size: 11px !important;
      padding: 4px 8px !important;
  }

  /* =========================================
     Deal Cards (Horizontal/List view)
     ========================================= */
  .mobile-deal-card {
      padding: 10px !important;
  }

  .mobile-deal-title {
      font-size: 15px !important;
      font-weight: 500 !important;
  }

  .mobile-deal-new-price {
      font-size: 18px !important;
      font-weight: 700 !important;
  }
  
  .mobile-deal-old-price {
      font-size: 12px !important;
  }

  /* =========================================
     Carousel & Banners
     ========================================= */
  .mobile-carousel-content {
      padding: 20px !important;
  }

  .mobile-carousel-title {
      font-size: 22px !important; /* Big attractive title */
      font-weight: 800 !important;
      line-height: 1.2 !important;
      margin-bottom: 10px !important;
  }
  
  .mobile-shop-btn {
      padding: 10px 24px !important;
      font-size: 15px !important;
      font-weight: 600 !important;
  }

  .mobile-carousel-price {
      margin-bottom: 15px !important;
  }
  
  .mobile-carousel-price .mobile-price-new {
      font-size: 20px !important;
  }

  /* =========================================
     Product Details Page (Mobile)
     ========================================= */
  .mobile-product-name {
      font-size: 22px !important;
      line-height: 1.3 !important;
  }

  .mobile-price-new {
      font-size: 24px !important; /* Very visible price on details page */
  }

  /* Adjust grid gap for 2-column layout */
  .mobile-products-grid {
      gap: 12px !important;
      padding: 0 12px !important;
  }
}