.j2commerce-wrapper .btn-primary, 
.j2commerce-container .btn-primary {
    background-color: #c9a24c !important; /* Change to your brand color */
    color: #ffffff !important;             /* Text color */
    border: none !important;
    border-radius: 6px !important;         /* Rounded corners */
    padding: 12px 24px !important;         /* Button size padding */
    font-weight: 600 !important;
    text-transform: uppercase !important;  /* All caps text */
    letter-spacing: 0.5px !important;
    transition: all 0.2s ease-in-out !important;
}

.btn-outline-primary {
    background-color: #28A745 !important; /* Change to your brand color */
    color: #ffffff !important;             /* Text color */
    border: none !important;
    border-radius: 6px !important;         /* Rounded corners */
    padding: 12px 24px !important;         /* Button size padding */
    font-weight: 600 !important;
    /*text-transform: uppercase !important;  /* All caps text */
    letter-spacing: 0.5px !important;
    transition: all 0.2s ease-in-out !important;
  
}

/* Change Cart Product Name Color */
.j2store-cart-product-name, 
.cart-product-name, 
.product-name a {
    color: #fffbde !important; /* Replace #ff0000 with your desired color hex code */
}

.cart-item-option-title.text-body-secondary {
    color: #fffbde !important;
}

.cart-item-option-value.text-dark-emphasis.fw-medium {
    color: #fffbde !important;
}

.item-option-name {
    color: #fffbde !important;
}

.item-option.item-option-value.fw-bold.ms-1 {
    color: #fffbde !important;
}

/* Changes the colour of all regular text inside the cart wrapper */
.j2commerce-cart {
    color: #fffbde !important;
}

.j2commerce-cart th, 
.j2commerce-cart label {
    color: #fffbde !important;
}

.j2commerce-cart .j2commerce-cart-total,
.j2commerce-cart .price {
    color: #fffbde !important;
}

.line-total-value {
  color: #fffbde !important
}

.cart-footer {
  color: #fffbde !important
}

/* Changes the button color */
.btn-primary, .j2store-cart-button, .btn-checkout {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
    color: #ffffff !important;
}

/* Changes the color when a user hovers over it */
 .btn-primary:hover, .j2store-cart-button:hover, .btn-checkout:hover {
    background-color: #218838 !important;
    border-color: #1e7e34 !important;
    color: #ffffff !important;
}

.fa-plus, .fa-plus::before {
    color: #68b61c !important;
}
.fa-minus, .fa-minus::before {
    color: #68b61c !important;
}

/* Target the specific custom field wrapper */
.j2commerce-custom-field .shipping-included .field-value {
    display: block;
    color: #c9a24c; /* A nice, clean orange color */
    font-weight: bold; /* Makes the text stand out */
    font-size: 1.1rem; /* Slightly larger text */
    /*margin: 10px 0; /* Adds spacing above and below the line */
 /* padding-left:  20px !important; */
  margin-left: 20px !important;
    /*text-align: left; /* Changes to 'center' or 'right' if needed */
}

 .checkout-heading {
    padding: 10px 15px !important;
    background: #062A22 !important;
    border: none !important;
    margin-bottom: 0 !important;
    font-weight: bold !important;
    font-size: 1.1em !important;
   /*color: #333 !important;*/
    cursor: default !important;
}

.fs-5, .text-body-secondary, .justify-content-between {
  color: #6c757d! !important;
}

.j2c-checkout-success,
.j2commerce-order-summary {
    color: #333333 !important; /* Replace with your color code */
}

 .h6, .mb-1, .mb-4 {
  color: #ffffff !important;
}

.j2c-info-label {
  color:#333333 !important;
}

.mb-0.small {
  color: #333333 !important;
}
h4.mb-4 {
 color: #ffffff !important; 
}

/* Change text color for order table rows and data cells */
.table#j2c-orders-table td, 
.table#j2c-orders-table th {
    color: #ffffff !important;
}

.table.table-bordered.mb-0, .table-responsive mb-3, .table {
color: #ffffff !important;
}
   
.row.g-3.mb-4 {
  color: #333333 !important;
}

.modal-body th, .modal-body td, .modal-content th, .modal-content td, .modal-title th, .modal-title td, .modal-header th, .modal-header td, .modal-title#j2commerceOrderModalLabel, h4.mb-3  {
color: #000 !important;  
}

/* Target J2Commerce component pages EXCEPT the main checkout layout */
.com-j2commerce.view-checkout:not(.layout-checkout),
.j2commerce-order-status-wrapper,
div[id*="j2commerce-payment-response"] {

    /* Force all text blocks, span elements, and native text to dark grey */
    &, p, span, div, td, th, li {
        color: grey !important;
    }

    /* Target specific framework muted text, small print, and descriptions */
    .text-muted, .text-secondary, .text-black-50, .small, small {
        color: #333333 !important;
    }

    /* Target Bootstrap 5 alerts (e.g., payment failed, canceled, or pending) */
    .alert, .alert-info, .alert-warning, .alert-danger, .alert-heading {
        color: #333333 !important;
    }

    /* Target status section headers and tables */
    h1, h2, h3, h4, .order-status-title {
        color: #333333 !important;
    }
}
.col-lg-5.j2c-sidebar-bg.p-4, .flex-grow-1.small, .card.mb-4, .h6.mb-1, .h5.mb-4, .h4.mb-1.alert-heading, p.mb-1 {
  color: grey !important;
}
.modal {
  color: #000000 !important;
}

.rounded-img img {
    border-radius: 20px;
}
#checkout .checkout-content h4 {
    color: #ffffff !important; /* Replace with your desired hex code */
}
#checkout .checkout-content .text-muted {
    color: grey !important;
}

/* Force thumbnails to wrap into multiple rows */
#thumbs .swiper-wrapper {
    flex-wrap: wrap !important;
    height: auto !important;
}

#thumbs .swiper-slide {
    height: auto !important;
    /* Adjust width to control how many per row */
    flex: 0 0 16.666% !important; /* 6 per row on large screens */
    max-width: 16.666% !important;
}

/* Optional: smaller thumbnails on mobile */
@media (max-width: 991px) {
    #thumbs .swiper-slide {
        flex: 0 0 25% !important; /* 4 per row */
        max-width: 25% !important;
    }
}