/* Disable both Add to Cart and Buy Now buttons temporarily */

/*
.gc-product-actions button,
.gc-product-actions a {
    pointer-events: none !important;     
    opacity: 1.0 !important;            
    cursor: not-allowed !important;      
}


.gc-product-actions .gc-btn-primary {
    opacity: 1.0 !important;            
}

*/



.gc-product-grid {
  margin: 24px auto 40px;
  padding: 200px 20px 20px 20px;
  background: #ffffff;
  
}

.gc-product-grid {
    margin-top: 0 !important;       /* removes the 24px top margin */
}



@media (max-width: 768px) {
  .gc-product-grid {
 
  background: #ffffff;
  }
}




.gc-product-grid-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  background: #fff;
  padding-top: 20px;
}

.gc-product-grid-title {
  font-size: 20px;
  font-weight: 700;
  margin: 0;
  color: #000;
  
}

/* GRID: 5 / 4 / 2 */
.gc-product-grid-inner {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 1200px) {
  .gc-product-grid-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .gc-product-grid-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.gc-product-card {
  background: transparent;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
  overflow: hidden;
  display: flex;
  flex-direction: column;
 border:  1px solid #fcf0f4; /*rgb(234, 2, 6, 0.55); */
  transition: all 0.30s ease;     /* Smooth animation */
  
}


.gc-product-card:hover {
  background: transparent;
  border-radius: 12px;
  
  overflow: hidden;
  display: flex;
  flex-direction: column;
  
  transform: translateY(-4px);           /* Moves the card UP by 8px */
  box-shadow: 0px 20px 35px rgba(15, 23, 42, 0.12);  /* Stronger shadow on hover */
  border-color: rgba(39, 173, 52, 0.6);              /* Green border on hover */
}




.gc-product-image-wrap {
  display: block;
  background: transparent;
}

.gc-product-image {
  width: 100%;
  height: 170px;
  object-fit: contain;
  display: block;
  
}

.gc-product-image-placeholder {
  width: 100%;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
  background: #f3f4f6;
  font-size: 12px;
}

.gc-product-body {
  padding: 10px 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.gc-product-name {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.gc-product-name a {
  color: #111827;
  text-decoration: none;
}
.gc-product-name a:hover {
  color: rgb(39, 173, 52, .9);
}

.gc-product-price {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.gc-product-price-current {
  font-size: 15px;
  font-weight: 700;
  color: rgb(245, 0, 0, 0.9);
}

.gc-product-price-old {
  font-size: 12px;
  text-decoration: line-through;
  color: #9ca3af;
}

.gc-product-actions {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* Buttons (reuse your brand colors) */
.gc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .16s ease;
  white-space: nowrap;
  
}

.gc-btn-primary {
  background: linear-gradient(135deg, #f50000, #ff7a00);
  color: #ffffff;
  width: 100%;
}
.gc-btn-primary:hover {
  box-shadow: 0 10px 25px rgba(245,0,0,.6);
  transform: translateY(-1px);
}



.gc-btn-primary-product {
  background: transparent;
  color: #111827;
  width: 100%;
  border-color: rgb(245, 0, 0, 0.95);
  font-weight: 700;
}
.gc-btn-primary-product:hover {
  box-shadow: 0 10px 25px rgba(245,0,0,.0);
  transform: translateY(-1px);
  border-color: rgb(245, 0, 0, 1);
}




.gc-btn-outline {
  background: #ffffff;
  border-color: rgba(0,0,0,.52);
  color: #111827;
  
}

.gc-btn-outline-product {
  background: #ffffff;
  border-color: rgba(0,0,0,.32);
  color: #111827;
  width: 100%;
}

.gc-btn-outline-product:hover {
  border-color: #000000;
}



/* ====================== REMOVE GAPS FOR PRODUCT GRID SECTIONS ====================== */

/* Make sure the grid section sits directly under the hero with no gap */
.gc-product-grid-section {
    margin-top: 0 !important;
    padding-top: 0 !important;
    background: #ffffff;
}

/* Remove the default top margin and bottom padding from the grid itself */
.gc-product-grid {
    margin: 0 auto 0 !important;   /* Removed top & bottom margin */
    padding: 20px 20px 40px !important;   /* Keep side padding, reduce bottom if needed */
}

/* If the render_product_grid adds its own header, hide it when we provide our own */
.gc-product-grid-header + .gc-product-grid .gc-product-grid-header {
    display: none !important;
}

/* Remove any unwanted black space or extra padding at the very bottom of the grid */
.gc-product-grid:last-child,
.gc-product-grid-section:last-of-type {
    margin-bottom: 0 !important;
    padding-bottom: 20px !important;   /* Adjust this number if you want more/less space at bottom */
}

/* Optional: Make the custom header look better when no gap */
.gc-product-grid-header {
    margin-bottom: 20px;   /* Increase or decrease this for spacing between title and products */
    padding: 0 4px;        /* Small left/right padding to align nicely */
}




/* Fix left spacing for custom Samsung title */
.gc-product-grid-section .gc-product-grid-header {
    padding-left: 20px;     /* This adds nice breathing room from the left */
    padding-right: 20px;    /* Also balance the right side */
}

.gc-product-grid-section .gc-product-grid-title {
    margin-left: 0;
}

/* Optional: Make it look even better on mobile */
@media (max-width: 768px) {
   
   /* Prevent buttons from overflowing the card */
    .gc-product-card {
        box-sizing: border-box;
        padding: 0;                    /* Ensure no extra padding on card itself */
    }
    
    
    
    .gc-product-body {
        padding: 8px 12px 12px !important;
        box-sizing: border-box;
        width: 100%;
    }
   
    .gc-product-grid-section .gc-product-grid-header {
        padding-left: 16px;
        padding-right: 16px;
    }
    
    
    
    .gc-product-grid-section {
    margin-top: 0 !important;
    padding-top: 20px;
    background: #ffffff;
    
    
    
    
/* Make sure the actions container doesn't overflow */
    .gc-product-actions {
        flex-direction: column !important;
        gap: 10px !important;
        margin-top: 8px;
        width: 100% !important;
        padding: 0 4px;                 /* Small safety padding */
        box-sizing: border-box;
    }
    
    
    /* Fix button width properly */
    .gc-product-actions .gc-btn {
        width: 100% !important;
        max-width: 100% !important;     /* Important fix */
        box-sizing: border-box;
        margin: 0 auto;                 /* Center if needed */
    }
    
    
    .gc-product-image {
        height: 150px !important;        /* Smaller image on mobile */
        padding: 5px 0px 5px 0px;
    }
    
    

}