/* ============================= */
/* Category card */
/* ============================= */

/* Card Style */
.container.unit-card-wrp {
   margin-top: 40px;
}

section.unit-section {
   padding: 30px 0px;
}

.unit-card {
   border: 2px solid var(--color-primary);
   text-align: center;
   max-width: 350px;
   width: 100%;
   transition: 0.3s ease;
}

.unit-card a {
   padding: 25px 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 10px;
}

.unit-card:hover {
   border-color: var(--color-secondary);
   transform: translateY(-5px);
}

/* Title */
.unit-title {
   font-size: 22px;
   font-weight: 600;
   color: #1e2a78;
   margin-bottom: 0;
   transition: color 0.3s ease;
}

.unit-card:hover .unit-title {
   color: var(--color-secondary);
}

/* Highlight Text */
.unit-desc {
   display: inline-block;
   color: #000;
   padding: 6px 0px 0px;
   font-size: 14px;
   border-radius: 2px;
   line-height: 1.5;
   margin: 0;
}

/* ===============================
   PRODUCT GRID
================================= */
.products_wapper {
   padding: 40px 0;
}

.products {
   display: grid !important;
   grid-template-columns: repeat(4, 1fr);
   gap: 15px;
   list-style: none;
   margin: 0;
   padding: 0;
}

@media (max-width: 1200px) {
   .products {
      grid-template-columns: repeat(3, 1fr);
   }
}

@media (max-width: 991px) {
   .products {
      grid-template-columns: repeat(2, 1fr);
   }
}

@media (max-width: 576px) {
   .products {
      grid-template-columns: 1fr;
   }
}

/* ===============================
   PRODUCT CARD
================================= */
.products .product {
   background: #fff;
   overflow: hidden;
   position: relative;
   transition: all 0.3s ease;
   border: 1px solid #eee;
   display: flex;
   flex-direction: column;
   height: 100%;
   box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

.products .product:hover {
   transform: translateY(-6px);
}

/* ===============================
   IMAGE
================================= */
.products .product img {
   width: 100%;
   height: 240px;
   object-fit: cover;
   background: #f9f9f9;
   transition: transform 0.3s ease;
}

/* ===============================
   CONTENT AREA
================================= */
.products .woocommerce-loop-product__link {
   padding: 15px;
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   text-decoration: none;
   padding-bottom: 0;
}

/* TITLE */
.products .woocommerce-loop-product__title {
   font-size: 18px;
   font-weight: 600;
   color: var(--color-primary);
   margin-bottom: 8px;
   line-height: 1.3;
   transition: color 0.2s ease;
   margin-top: 14px;
}

.products .product:hover .woocommerce-loop-product__title {
   color: var(--color-secondary)
}

/* ===============================
   PRICE
================================= */
.products .price {
   font-size: 14px;
   margin-bottom: 12px;
   font-weight: 600;
   color: #111;
   margin-top: auto;
}

.products .price del {
   color: #999;
   font-weight: 400;
   font-size: 13px;
   line-height: 1.3;
}

.products .price ins {
   color: #0073ff;
   text-decoration: none;
}

/* Trade price container — keep label inline with trade price */
.products .price .trade-price-container {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 4px;
   width: 100%;
}

.products .price .trade-price-container del {
   margin-right: 0 !important;
   /* Override inline style */
}

.products .price .trade-price-container ins {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 4px;
}

.products .price .trade-label {
   margin-left: 0 !important;
   /* Override inline style */
   align-self: flex-start;
}

/* ===============================
   ADD TO CART BUTTON
================================= */
.products .button {
   margin: 15px auto;
   margin-top: 0;
   padding: 10px 14px;
   border-radius: 8px;
   background: var(--color-accent);
   color: #fff;
   font-weight: 500;
   text-align: center;
   text-decoration: none;
   transition: all 0.25s ease;
   border: none;

}

.products .button:hover {
   background: var(--color-primary);
}

.products .product.outofstock {
   opacity: 0.6;
   pointer-events: none;
}

.products .out-of-stock-badge {
   position: absolute;
   top: 12px;
   right: 12px;
   background: #6c757d;
   color: #fff;
   font-size: 12px;
   font-weight: 600;
   padding: 5px 10px;
   border-radius: 20px;
   z-index: 3;
}

a.added_to_cart.wc-forward {
   padding: 25px;
   padding-top: 0;
   padding-bottom: 12px;
}

/* ============================= */
/* Sort Select */
/* ============================= */

select.orderby {
   padding: 10px 12px;
   border-radius: 8px;
   border: 1px solid #d1d5db;
   font-size: 14px;
   background: #fff;
   transition: 0.2s;
}

/* ===============================
   PAGINATION WRAPPER
================================= */
.woocommerce-pagination {
   display: flex;
   justify-content: center;
   margin-bottom: 40px;
   margin-top: 25px;
}

/* ===============================
   PAGINATION LIST
================================= */
.woocommerce-pagination ul.page-numbers {
   display: flex;
   gap: 8px;
   list-style: none;
   padding: 0;
   margin: 0;
}

/* ===============================
   PAGE ITEMS
================================= */
.woocommerce-pagination .page-numbers {
   display: flex;
   align-items: center;
   justify-content: center;
   min-width: 40px;
   height: 40px;
   padding: 0 12px;
   border-radius: 10px;
   font-size: 14px;
   font-weight: 500;
   text-decoration: none;
   color: #333;
   background: #f5f7fa;
   transition: all 0.25s ease;
   border: 1px solid transparent;
}

/* ===============================
   HOVER EFFECT
================================= */
.woocommerce-pagination a.page-numbers:hover {
   background: var(--color-secondary);
   color: #000;
   transform: translateY(-2px);
   box-shadow: 0 6px 14px rgba(0, 115, 255, 0.25);
}

/* ===============================
   ACTIVE PAGE
================================= */
.woocommerce-pagination .page-numbers.current {
   background: var(--color-primary);
   color: #fff;
   font-weight: 600;
   box-shadow: 0 4px 12px rgba(0, 115, 255, 0.2);
   cursor: default;
}

/* ===============================
   NEXT / PREV BUTTON
================================= */
.woocommerce-pagination .next,
.woocommerce-pagination .prev {
   font-size: 16px;
   font-weight: 600;
   padding: 0 14px;
}

/* ===============================
   DISABLED
================================= */
.woocommerce-pagination .disabled {
   opacity: 0.4;
   pointer-events: none;
}

/* ============================= */
/* No product found */
/* ============================= */

.woocommerce-no-products-found {
   display: flex;
   align-items: center;
}

.woocommerce-no-products-found .woocommerce-info {
   padding-left: 10px;
   box-shadow: none;
   margin-bottom: 2rem;
}

@media (max-width:991px) {
   .category-title {
      font-size: 33px;
   }
}

@media (max-width:767px) {
   .category-title {
      font-size: 27px;
   }
}

/* ===============================
   MOBILE OPTIMIZATION
================================= */
@media (max-width: 480px) {
   .woocommerce-pagination .page-numbers {
      min-width: 36px;
      height: 36px;
      font-size: 13px;
   }
}