/*
Theme Name: Divi Child
Theme URI: https://www.elegantthemes.com/gallery/divi/
Description: Child theme for the Divi theme
Author: Your Name
Author URI: http://example.com
Template: Divi
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: Divi-child
*/

/* Add your custom styles below this line */

/* Fix for footer positioning - ensures footer stays at bottom on all pages */
html {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    height: auto;
}

#page-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    flex: 1 0 auto;
}

#et-main-area {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}

#main-content {
    flex: 1 0 auto;
}

#main-footer {
    margin-top: auto;
}


/* Hide any similar API debug outputs that might appear */
.woocommerce-account pre,
.woocommerce-checkout pre {
    display: none !important;
}

/* Custom Login Menu Styling */
#top-menu .menu-item-has-children.my-account-menu > a,
#et-secondary-nav .menu-item-has-children.my-account-menu > a,
.et-menu .menu-item-has-children.my-account-menu > a {
    background-color: #591458 !important;
    color: #ffffff !important;
    padding: 15px 20px !important;
    border-radius: 0 !important;
}

#top-menu .menu-item-has-children.my-account-menu ul.sub-menu,
#et-secondary-nav .menu-item-has-children.my-account-menu ul.sub-menu,
.et-menu .menu-item-has-children.my-account-menu ul.sub-menu {
    background-color: #591458 !important;
    border-color: #591458 !important;
    min-width: 200px !important;
    border-top: 3px solid #591458 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

#top-menu .menu-item-has-children.my-account-menu ul.sub-menu li a,
#et-secondary-nav .menu-item-has-children.my-account-menu ul.sub-menu li a,
.et-menu .menu-item-has-children.my-account-menu ul.sub-menu li a {
    color: #ffffff !important;
    padding: 10px 20px !important;
    width: 100% !important;
    display: block;
    font-weight: 500 !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}

#top-menu .menu-item-has-children.my-account-menu ul.sub-menu li a:hover,
#et-secondary-nav .menu-item-has-children.my-account-menu ul.sub-menu li a:hover,
.et-menu .menu-item-has-children.my-account-menu ul.sub-menu li a:hover {
    background-color: rgba(255,255,255,0.1) !important;
    opacity: 1 !important;
}


/*All Pages*/

.et_right_sidebar #left-area{
    width: 100% !important;
}
.et_right_sidebar #main-content .container:before{
    display: none !important;
}


/*Menu*/
#mega-menu-wrap-primary-menu{
    background: #581358 !important;
}
.mega-sub-menu li{
margin: 20px;
}
#mega-menu-wrap-primary-menu #mega-menu-primary-menu > li.mega-menu-flyout ul.mega-sub-menu {
    width: 100% !important;
}
/*checkout*/
.woocommerce-account-fields , .woocommerce-checkout.woocommerce-page.woocommerce-order-received .et_pb_row.et_pb_row_0{
    display: none !important;
}
.woocommerce-checkout.woocommerce-page.woocommerce-order-received .et_pb_column.et_pb_column_2_5.et_pb_column_2.et_pb_css_mix_blend_mode_passthrough.et-last-child{
width: 100% !important;
}
/* Custom Coupon Field Styling for Checkout Page */
/* Style the coupon section wrapper */
.coupon-section-wrapper {
    margin: 0 0 15px 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

/* Style the coupon toggle */
p.coupon-toggle {
    cursor: pointer;
    margin: 0 !important;
    padding: 10px 0;
}

/* Style the coupon toggle link */
.coupon-toggle-link {
    color: #591458;
    font-weight: 600;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

/* Style the coupon form container */
.coupon-form-container {
    margin: 10px 0 15px;
}

/* Style the coupon form */
tr.coupon-form-row .checkout_coupon {
    display: flex !important;
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
    align-items: center;
}

/* Style the form rows for better layout */
tr.coupon-form-row .checkout_coupon p.form-row {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block;
}

tr.coupon-form-row .checkout_coupon p.form-row:first-child {
    width: 70%;
    padding-right: 10px !important;
}

/* Style the coupon input field */
tr.coupon-form-row .checkout_coupon input#coupon_code {
    width: 100%;
    font-size: 14px !important;
    padding: 10px 15px !important;
    height: 42px !important;
    line-height: normal !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    min-height: 0 !important;
    margin: 0 !important;
}

/* Style the coupon button */
tr.coupon-form-row .checkout_coupon button,
tr.coupon-form-row .checkout_coupon .button,
.woocommerce-checkout tr.coupon-form-row form.checkout_coupon .button,
.woocommerce-checkout .coupon .button {
    background-color: #333 !important;
    color: #fff !important;
    font-size: 14px !important;
    border: none !important;
    padding: 12px 20px !important;
    height: 42px !important;
    line-height: normal !important;
    text-transform: none !important;
    border-radius: 4px !important;
    margin: 0 !important;
    min-height: 0 !important;
    font-weight: normal !important;
    width: auto !important;
    opacity: 1 !important;
}

/* Hide default coupon toggle */
.woocommerce-form-coupon-toggle {
    display: none !important;
}

/* Make sure our custom coupon row displays properly */
tr.coupon-form-row {
    display: table-row !important;
}

/* Style the coupon button with requested colors - more specific selectors */
tr.coupon-form-row .checkout_coupon button,
tr.coupon-form-row .checkout_coupon input[type="submit"],
tr.coupon-form-row .checkout_coupon .button,
tr.coupon-form-row form.checkout_coupon .button,
.coupon-form-row button[name="apply_coupon"],
.woocommerce-checkout .coupon-form-row .button {
    background: #581358 !important;
    color: #fff !important;
    border: unset !important;
    padding: 10px 15px !important;
    height: auto !important;
    line-height: normal !important;
    text-transform: capitalize !important;
    border-radius: 4px !important;
    opacity: 1 !important;
    transition: background-color 0.3s ease !important;
}

/* Add hover effect */
tr.coupon-form-row .checkout_coupon .button:hover,
.coupon-form-row button[name="apply_coupon"]:hover {
    background: #6d2a6d !important;
}

/* For additional specificity to beat other styles */
body.woocommerce-checkout tr.coupon-form-row .button, 
body.woocommerce-checkout tr.coupon-form-row button.button {
    background-color: #581358 !important;
}
.woocommerce-form-coupon-toggle .woocommerce-info{
    display: none !important;
}
#tam_apply_coupon_btn{
    width: 100% !important;
}

/* Coupon button spinner styles */
.coupon-spinner {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 2px solid rgba(255,255,255,.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: coupon-spin 1s ease-in-out infinite;
    margin-right: 8px;
    vertical-align: middle;
}

@keyframes coupon-spin {
    to { transform: rotate(360deg); }
}

button.processing {
    opacity: 0.8;
    cursor: wait;
}

/* Custom Form Validation Styling */
.tam-error-message {
    color: #d8000c;
    font-size: 14px;
    font-weight: 500;
    margin-top: 5px;
    padding-left: 2px;
    display: none;
    transition: all 0.3s ease;
}
.et-pb-contact-message{display: none !important;}
.tam-error-message.visible {
    display: block;
}

.tam-field-error input,
.tam-field-error textarea,
.tam-field-error select {
    border-color: #d8000c !important;
}

/* Hide default Divi validation messages */
.et_pb_contact_form .et-pb-contact-message {
    display: none !important;
}

/* Keep individual field validation visible but move it */
.et_pb_contact_field .et_contact_error {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Hide the default error icon */
.et_pb_contact_field .et_contact_error:before {
    display: none !important;
}

/*Header*/

#et-secondary-menu{
    display: none !important;
}

/*PDP changes*/
.comment-respond input.submit{
color: #fff !important;
border:unset !important;
}

/* Product Card Styling */
.woocommerce ul.products {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.woocommerce ul.products li.product {
    display: flex;
    flex-direction: column;
    margin-bottom: 2.5em !important;
    padding: 15px;
    border-radius: 4px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.08);
    background-color: #fff;
    transition: all 0.3s ease;
}

.woocommerce ul.products li.product:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transform: translateY(-3px);
}

/* Fixed image size */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .et_shop_image {
    height: 200px !important;
    width: 100% !important;
    object-fit: contain;
    margin-bottom: 1em;
}

/* Equal height title containers */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    height: 2.5em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 1em !important;
    padding: 0;
    margin-bottom: 0.5em;
}

/* Price alignment */
.woocommerce ul.products li.product .price {
    margin-top: auto;
    padding-top: 10px;
    font-weight: bold;
    color: #591458 !important;
}

/* Make add to cart buttons consistent if they exist */
.woocommerce ul.products li.product .button {
    margin-top: auto;
    width: 100%;
    text-align: center;
}

/*cart page*/

.wc-block-components-totals-coupon__form .wc-block-components-button__text {
    opacity: 1 !important;
}
.woocommerce-NoticeGroup.woocommerce-NoticeGroup-updateOrderReview {
    display: none !important;
}


/*checkout page*/

.cart-discount td{
    display: flex;
}

a.woocommerce-remove-coupon {
    padding: 0px 0px 0px 10px;
}


.woocommerce ul.order_details{
    margin: 20px 0px;
    padding: unset;
}

/*cart page*/
ul.wc-block-components-totals-discount__coupon-list {
    padding: unset !important;
}
@media only screen and (max-width: 768px) {
    .et_pb_column.et_pb_column_2_5.et_pb_column_2.et_pb_css_mix_blend_mode_passthrough.et-last-child {
        width: 100% !important;
        margin: auto;
    }
    .woocommerce ul.order_details li{
        margin: 1rem;
    }
    #main-header{
        /* box-shadow: unset !important;
        -webkit-box-shadow: unset !important; */
    }
    .et_header_style_left #et-top-navigation{
        padding: 4px 0px !important;
    }
    #top-header #et-info{
        /* display: grid;
        text-align: left;    */
    }
}

/* Tablet-specific styles - will apply to iPads and other tablet devices */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    /* Add your tablet-specific styles here */
    #logo-tagline{
        font-size: 0.7rem;
        margin-left: unset;
    }
    #db_title_and_tagline {
        display: inline-grid;
    }
}

/*contact form*/
.type-product #commentform input[type=text],.type-product #commentform input[type=email]{
width: 100%;
}

/*menu*/
@media only screen and (max-width: 768px) {
    #mega-menu-wrap-primary-menu{
    background: #fff !important;
    }    
    #mega-menu-wrap-primary-menu .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner, #mega-menu-wrap-primary-menu .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::before, #mega-menu-wrap-primary-menu .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::after{
        background: #581358 !important;
        height: 2px !important;
    }
}
@media screen and (max-width: 1024px) {
    .woocommerce-product-gallery__wrapper {
        pointer-events: none !important;
    }

    .zoomImg {
        display: none !important;
    }
}


/*cart page*/
.wc-block-cart-item__quantity {
    display: flex !important;
    align-items: center !important;
  }
  .wc-block-components-quantity-selector {
    margin-right: 10px !important; /* add some space between quantity and remove button */
  }
  .wc-block-cart-item__quantity {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  :where(.wp-block-button__link) {
    border-radius:  unset !important;
  }
  .wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product div .wp-block-cart-cross-sells-product__product-title,.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .wp-block-heading,.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
    margin-bottom: unset !important;
  }

  @media only screen and (max-width: 768px) {
    .wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-button__button{
      margin: 2px !important;
    }
    .wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .wp-block-heading{
        margin-top: 10px !important;
    }
  }
  /* iPad (all models) in both portrait and landscape orientations */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .wc-block-cart-item__remove-link {
        bottom: unset !important;
        right: unset !important;
        left: 49.5% !important;
    }
    .editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product, table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product{
        visibility: unset !important;
    }
    .editor-styles-wrapper table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product span, table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product span{
        display: none !important;
    }
    .wc-block-components-form .wc-block-components-text-input label, .wc-block-components-text-input label{
    transform: translateY(0%) !important;
    top: 0.7em !important;
    }
    .wc-block-components-form .wc-block-components-text-input input:-webkit-autofill+label, .wc-block-components-form .wc-block-components-text-input.is-active label, .wc-block-components-text-input input:-webkit-autofill+label, .wc-block-components-text-input.is-active label {  top: 0 !important; }
}