/* Page Header Section */
   .page-header-section {
       background: linear-gradient(135deg, #865302 0%, #503001 100%);
       color: white;
       padding: 30px 0;
       margin-bottom: 30px;
   }

   .page-title {
       margin: 0 0 10px 0;
       font-size: 28px;
       font-weight: 600;
   }

   .breadcrumb-nav {
       font-size: 14px;
       opacity: 0.9;
   }

   .breadcrumb-nav a {
       color: white;
       text-decoration: none;
       margin: 0 5px;
   }

   .breadcrumb-nav a:hover {
       text-decoration: underline;
   }

   .breadcrumb-nav span {
       margin: 0 5px;
   }

   /* Main Container */
   .main-container {
        margin-bottom: 2em;
   }

   /* Sidebar Filters */
   .sidebar-filters {
       /* width: 280px; */
       flex-shrink: 0;
       background: white;
       padding: 20px;
       border-radius: 8px;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
       height: fit-content;
       /* sticky: top; */
       position: sticky;
       top: 20px;
   }

   .filter-header {
       display: flex;
       justify-content: space-between;
       align-items: center;
       margin-bottom: 20px;
       padding-bottom: 15px;
       border-bottom: 2px solid #eee;
   }

   .filter-header h3 {
       margin: 0;
       font-size: 20px;
       color: #333;
   }

   .filter-actions a {
       color: #503001;
       text-decoration: none;
       font-size: 13px;
       font-weight: 500;
   }

   .filter-actions a:hover {
       text-decoration: underline;
   }

   .filter-section {
       margin-bottom: 25px;
   }

   .filter-section h4 {
       margin: 0 0 12px 0;
       font-size: 16px;
       color: #555;
       font-weight: 600;
   }

   .category-group {
       margin-bottom: 15px;
   }

   .category-group>label {
       display: block;
       margin-bottom: 8px;
       cursor: pointer;
       font-size: 15px;
   }

   .subcategory-list {
       margin-left: 25px;
       margin-top: 8px;
   }

   .subcategory-list label {
       display: block;
       margin-bottom: 6px;
       cursor: pointer;
       font-size: 14px;
       font-weight: 500;
       color: #666;
   }

   .price-inputs {
       display: flex;
       align-items: center;
       gap: 10px;
   }

   .price-inputs input {
       width: 80px;
       padding: 8px;
       border: 1px solid #ddd;
       border-radius: 4px;
       font-size: 14px;
   }

   .price-inputs span {
       color: #999;
       font-size: 13px;
   }

   .apply-filters-btn {
       width: 100%;
       padding: 12px;
       background: #503001;
       color: white;
       border: none;
       border-radius: 6px;
       font-size: 15px;
       font-weight: 600;
       cursor: pointer;
       transition: background 0.3s;
   }

   .apply-filters-btn:hover {
       background: #865302;
   }

   /* Products Section */
   .products-section {
       flex: 1;
   }

   .products-header {
       background: white;
       padding: 15px 20px;
       border-radius: 8px;
       margin-bottom: 20px;
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
   }

   .product-count {
       color: #666;
       font-size: 16px;
   }

   /* Products Grid */
   .products-grid {
       display: grid;
       grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
       gap: 25px;
   }

   .product-card {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
       background: white;
       border-radius: 8px;
       overflow: hidden;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
       transition: transform 0.3s, box-shadow 0.3s;
   }

   .product-card:hover {
       transform: translateY(-5px);
       box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
   }

   .product-link {
       display: block;
       text-decoration: none;
   }

   .product-image {
       width: 100%;
       height: 250px;
       object-fit: cover;
       background: #f0f0f0;
   }

   .product-image.no-image {
       display: flex;
       align-items: center;
       justify-content: center;
       color: #999;
       font-size: 14px;
   }

   .product-info {
       padding: 18px;
   }

   .product-title {
       margin: 0 0 8px 0;
       font-size: 16px;
       font-weight: 600;
   }

   .product-title a {
       color: #333;
       text-decoration: none;
   }

   .product-title a:hover {
       color: #503001;
   }

   .product-description {
       font-size: 13px;
       color: #777;
       margin: 8px 0;
       line-height: 1.5;
   }

   .product-price {
       font-size: 22px;
       font-weight: 700;
       color: #503001;
       margin: 12px 0;
   }

   .add-to-cart {
       width: 100%;
       padding: 10px;
       background: #503001;
       color: white;
       border: none;
       border-radius: 5px;
       font-size: 14px;
       font-weight: 600;
       cursor: pointer;
       transition: background 0.3s;
   }

   .add-to-cart:hover {
       background: #865302;
   }

   /* No Products */
   .no-products {
       text-align: center;
       padding: 60px 20px;
       background: white;
       border-radius: 8px;
       grid-column: 1 / -1;
   }

   .no-products h2 {
       color: #666;
       margin-bottom: 15px;
   }

   .no-products p {
       color: #999;
       margin-bottom: 20px;
   }

   .btn-browse {
       display: inline-block;
       padding: 12px 30px;
       background: #503001;
       color: white;
       text-decoration: none;
       border-radius: 5px;
       font-weight: 600;
       transition: background 0.3s;
   }

   .btn-browse:hover {
       background: #865302;
   }

   /* Responsive */
   @media (max-width: 1024px) {
       .main-container {
           flex-direction: column;
       }

       .sidebar-filters {
           width: 100%;
           position: static;
       }

       .products-grid {
           grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
       }
   }

   @media (max-width: 768px) {
       .products-grid {
           grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
           gap: 15px;
       }

       .page-title {
           font-size: 22px;
       }
   }