/*
 Theme Name:   Basel Child
 Description:  Basel Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     basel
 Version:      1.0.0
 Text Domain:  basel-child
*/


/* ==========================================
   LOVE MY HAIR – MAIN MENU SPACING
========================================== */

/* Main menu links */
.menu-main-container > ul.menu > li {
    margin-left: 12px !important;
    margin-right: 11px !important;
}

.menu-main-container > ul.menu > li > a {
    padding-left: 8px !important;
    padding-right: 8px !important;

    font-size: 14px !important;
    letter-spacing: 1.1px !important;
}


/* ==========================================
   SHOP DROPDOWN
========================================== */

/* Make dropdown wider */
.menu-main-container .sub-menu-dropdown {
    min-width: 230px !important;
}

/* Space inside dropdown */
.menu-main-container .sub-menu {
    padding: 16px 12px !important;
}

/* Each dropdown item */
.menu-main-container .sub-menu > li {
    margin: 0 !important;
}

/* Dropdown text */
.menu-main-container .sub-menu > li > a {
    display: block !important;

    padding: 12px 18px !important;

    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.4 !important;

    letter-spacing: 0.5px !important;

    color: #3D3935 !important;
}

/* Dropdown hover */
.menu-main-container .sub-menu > li > a:hover {
    background: #FAE8C8 !important;
    color: #C89B63 !important;
}


.love-hair-text h1 {
    font-family: 'BrittanySignatureScript', cursive !important;
    font-size: 72px;
    font-weight: normal;
    line-height: 1;
}

.love-hair-text h2 {
    font-family: 'Raleway', sans-serif !important;
    font-size: 32px;
    font-weight: 400;
    letter-spacing: 2px;
}

.healthy-hair-title,
.healthy-hair-title * {
    font-family: "Brittany", cursive !important;
    font-weight: 400 !important;
    text-transform: none !important;
}

/* Your customizations starts here */
h1.main-heading,
h2.main-heading,
h3.main-heading,
h4.main-heading,
h5.main-heading,
h6.main-heading{
    font-family: "Montserrat", Arial, sans-serif !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
	font-size: 25px !important; 
}

/* Love My Hair category card */
.lmh-category-card > .vc_column-inner {
    padding: 0 !important;
}

.lmh-category-card > .vc_column-inner > .wpb_wrapper {
    background: #ffffff;
    border: 1px solid #eadfce;
    border-radius: 22px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Remove default image spacing */
.lmh-category-card .wpb_single_image {
    margin-bottom: 0 !important;
}

.lmh-category-card .vc_figure,
.lmh-category-card .vc_single_image-wrapper {
    display: block !important;
    width: 100% !important;
}

/* Category image */
.lmh-category-card .vc_single_image-img {
    display: block;
    width: 100% !important;
    height: 365px;
    object-fit: cover;
    border-radius: 0 !important;
}

/* Heading below image */
.lmh-category-card .main-heading {
    margin: 28px 30px 12px !important;
    padding: 0 !important;
    color: #30302d;
    font-size: 30px;
    line-height: 1.2;
}

/* Description */
.lmh-category-card .wpb_text_column {
    margin: 0 30px !important;
}

.lmh-category-card .wpb_text_column p {
    margin: 0;
    color: #6f6c68;
    font-size: 17px;
    line-height: 1.7;
}

/* Button area */
.lmh-category-card .vc_btn3-container {
    margin: 28px 30px 32px !important;
    margin-top: auto !important;
}

/* Make button look like clean text link */
.lmh-category-card .vc_btn3 {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    color: #1f4329!important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.lmh-category-card .vc_btn3::after {
    content: "→";
    display: inline-block;
    margin-left: 10px;
    font-size: 22px;
    transition: transform 0.25s ease;
}

.lmh-category-card .vc_btn3:hover {
    background: transparent !important;
    color: #D8DDC8 !important;
}

.lmh-category-card .vc_btn3:hover::after {
    transform: translateX(5px);
}

/* Tablet */
@media (max-width: 991px) {
    .lmh-category-card .vc_single_image-img {
        height: 300px;
    }

    .lmh-category-card .main-heading {
        font-size: 27px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .lmh-category-card {
        margin-bottom: 25px;
    }

    .lmh-category-card .vc_single_image-img {
        height: 330px;
    }

    .lmh-category-card .main-heading {
        margin: 24px 24px 12px !important;
        font-size: 27px;
    }

    .lmh-category-card .wpb_text_column {
        margin: 0 24px !important;
    }

    .lmh-category-card .vc_btn3-container {
        margin: 24px 24px 28px !important;
    }
}


/* Make all category cards equal height */
.lmh-category-grid {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
}

.lmh-category-grid > .wpb_column {
    display: flex !important;
}

.lmh-category-grid > .wpb_column > .vc_column-inner {
    display: flex !important;
    width: 100%;
}

.lmh-category-grid .lmh-category-card > .vc_column-inner > .wpb_wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Keep all images the same height */
.lmh-category-grid .lmh-category-card .vc_single_image-img {
    width: 100% !important;
    height: 365px !important;
    object-fit: cover;
}

/* Allow the content area to stretch */
.lmh-category-grid .lmh-category-card .wpb_text_column {
    flex-grow: 1;
}

/* Keep all buttons aligned at the bottom */
.lmh-category-grid .lmh-category-card .vc_btn3-container {
    margin-top: auto !important;
}

/* Tablet */
@media (max-width: 991px) {
    .lmh-category-grid .lmh-category-card .vc_single_image-img {
        height: 300px !important;
    }
}

/* Mobile: stack cards normally */
@media (max-width: 767px) {
    .lmh-category-grid {
        display: block !important;
    }

    .lmh-category-grid > .wpb_column {
        display: block !important;
        width: 100%;
    }

    .lmh-category-grid .lmh-category-card .vc_single_image-img {
        height: 330px !important;
    }
}



/* ==========================================
   LOVE MY HAIR - NEW BEIGE COLOUR
   Main colour: #FAE8C8
========================================== */


/* =========================
   BENEFIT ICONS
========================= */

.lmh-benefits {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 45px;
    padding: 35px 30px;
}

.lmh-benefit-item {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.lmh-benefit-icon {
    width: 70px;
    height: 70px;
    margin-bottom: 28px;
    border-radius: 50%;
    background: #FAE8C8;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lmh-benefit-icon svg {
    width: 34px;
    height: 34px;
    fill: none;
    stroke: #8B7865;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lmh-benefit-item h3 {
    margin: 0 0 14px;
    color: #3D3935;
 font-family: "Montserrat", Arial, sans-serif !important;
	font-size: 23px;
    line-height: 1.2;
    font-weight: 500;
}

.lmh-benefit-item p {
    max-width: 350px;
    margin: 0;
    color: #66615C;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.55;
}

/* =========================
   CERTIFICATION BADGES
========================= */

.lmh-certifications {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.lmh-certification {
    min-height: 88px;
    padding: 16px 28px;
    border: 1px solid #EBCFA5;
    border-radius: 16px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    box-sizing: border-box;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.lmh-certification:hover {
    border-color: #C89B63;
    box-shadow: 0 8px 22px rgba(200, 155, 99, 0.18);
}

/* Icon circle */
.lmh-certification-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background: #FAE8C8;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 10px rgba(61, 57, 53, 0.06);
}

/* Icon */
.lmh-certification-icon svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: #C89B63;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Certification name */
.lmh-certification-title {
    color: #3D3935;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 600;
}


/* =========================
   TABLET
========================= */

@media (max-width: 991px) {

    .lmh-certifications {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================
   MOBILE
========================= */

@media (max-width: 600px) {

    .lmh-certifications {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .lmh-certification {
        min-height: 78px;
        padding: 14px 20px;
    }

    .lmh-certification-icon {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }

    .lmh-certification-title {
        font-size: 16px;
    }
}
/* ==========================================
   LOVE MY HAIR CONTACT FORM
   LIGHT BEIGE COLOUR SCHEME
========================================== */

.lmh-contact-form {
    width: 100%;
    max-width: 980px;
    font-family: "Montserrat", Arial, sans-serif;
}

.lmh-contact-form h2 {
    margin: 0 0 35px;
    color: #3D3935;
    font-family:  "Montserrat", Arial, sans-serif;
    font-size: 32px;
    line-height: 1.2;
    font-weight: 500;
}

.lmh-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 25px 20px;
}

.lmh-form-field {
    min-width: 0;
}

.lmh-form-full {
    grid-column: 1 / -1;
}

.lmh-form-field label {
    display: block;
    margin: 0 0 9px;
    color: #3D3935;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 600;
}

.lmh-form-field label span {
    color: #8B7865;
}

.lmh-form-field label small {
    font-size: inherit;
    font-weight: 400;
}

/* Contact Form 7 wrappers */
.lmh-form-field .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* Form fields */
.lmh-contact-form input[type="text"],
.lmh-contact-form input[type="email"],
.lmh-contact-form input[type="tel"],
.lmh-contact-form select,
.lmh-contact-form textarea {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0;
    border: 1px solid #E6D8C5;
    border-radius: 10px;
    background: #FFFFFF;
    color: #3D3935;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.4;
    box-shadow: none;
    outline: none;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

/* Standard field height */
.lmh-contact-form input[type="text"],
.lmh-contact-form input[type="email"],
.lmh-contact-form input[type="tel"],
.lmh-contact-form select {
    height: 53px;
    padding: 0 15px;
}

/* Message field */
.lmh-contact-form textarea {
    display: block;
    min-height: 152px;
    padding: 14px 15px;
    resize: vertical;
}

/* Placeholder */
.lmh-contact-form input::placeholder,
.lmh-contact-form textarea::placeholder {
    color: #8A8179;
    opacity: 1;
}

/* Focus effect */
.lmh-contact-form input[type="text"]:focus,
.lmh-contact-form input[type="email"]:focus,
.lmh-contact-form input[type="tel"]:focus,
.lmh-contact-form select:focus,
.lmh-contact-form textarea:focus {
    border-color: #CDBBA4;
    box-shadow: 0 0 0 3px rgba(205, 187, 164, 0.20);
}

/* Submit button wrapper */
.lmh-submit-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Paper-plane icon */
.lmh-submit-wrap::before {
    content: "➤";
    position: absolute;
    left: 38px;
    top: 50%;
    z-index: 2;
    color: #3D3935;
    font-size: 19px;
    line-height: 1;
    transform: translateY(-50%) rotate(-35deg);
    pointer-events: none;
}

/* Submit button */
.lmh-contact-form .lmh-contact-submit {
    width: auto !important;
    min-width: 258px;
    height: 64px;
    margin: 0;
    padding: 0 30px 0 68px !important;
    border: 0 !important;
    border-radius: 50px !important;
    background: #F3EBDD !important;
    color: #3D3935 !important;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 16px !important;
    line-height: 64px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px;
    text-align: left;
    text-transform: uppercase;
    box-shadow: none !important;
    cursor: pointer;
    transition:
        background 0.2s ease,
        transform 0.2s ease;
}

.lmh-contact-form .lmh-contact-submit:hover {
    background: #E6D8C5 !important;
    color: #3D3935 !important;
    transform: translateY(-2px);
}

/* Validation messages */
.lmh-contact-form .wpcf7-not-valid-tip {
    margin-top: 6px;
    color: #b42318;
    font-size: 13px;
}

.lmh-contact-form .wpcf7-response-output {
    margin: 22px 0 0 !important;
    padding: 12px 16px !important;
    border-radius: 7px;
    font-size: 14px;
}

.lmh-contact-form .wpcf7-spinner {
    margin: 0 0 0 12px;
}

/* Tablet and mobile */
@media (max-width: 767px) {
    .lmh-contact-form h2 {
        margin-bottom: 25px;
        font-size: 28px;
    }

    .lmh-form-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .lmh-form-full {
        grid-column: auto;
    }

    .lmh-contact-form .lmh-contact-submit {
        min-width: 220px;
        height: 56px;
        line-height: 56px !important;
    }

    .lmh-submit-wrap::before {
        left: 30px;
    }
}

/* Love My Hair free-shipping banner */
.lmh-shipping-banner {
    width: 100%;
    padding: 12px 20px;
    color: black !important;
    text-align: center;
    font-size: 15px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.9px;
    text-transform: uppercase;
    box-sizing: border-box;
	font-family: "Montserrat", Arial, sans-serif;

}

.lmh-shipping-banner a {
    color: black !important;
    text-decoration: none;
}

.lmh-shipping-banner a:hover {
    text-decoration: underline;
}

.lmh-shipping-banner-icon {
    margin-right: 9px;
}

@media (max-width: 600px) {
    .lmh-shipping-banner {
        padding: 10px 12px;
        font-size: 12px;
        letter-spacing: 0.2px;
    }
}



/* ==========================================
   LOVE MY HAIR FOOTER CONTACT & NEWSLETTER
   UPDATED BEIGE / GOLD COLOUR SCHEME
========================================== */

.lmh-footer-contact {
    width: 100%;
    max-width: 460px;
    color: #3D3935;
    font-family: "Montserrat", Arial, sans-serif;
}

/* CONTACT heading */
.lmh-footer-heading {
    margin: 0 0 18px;
    color: #3D3935 !important;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* Contact details */
.lmh-contact-details {
    margin-bottom: 12px;
}

.lmh-contact-details a,
.lmh-contact-details p {
    display: block;
    margin: 0 0 5px;
    color: #66615C !important;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.45;
    text-decoration: none;
}

.lmh-contact-details a:hover {
    color: #C89B63 !important;
}

/* Newsletter heading */
.lmh-newsletter h5 {
    margin: 0 0 9px;
    color: #3D3935 !important;
    font-family:  "Montserrat", Arial, sans-serif;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 400;
}

/* Newsletter form */
.lmh-newsletter-form {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

/* Email field */
.lmh-newsletter-form input[type="email"] {
    flex: 1 1 200px;
    min-width: 190px;
    height: 42px;
    padding: 0 14px;

    border: 1px solid #F0D8B2;
    border-radius: 7px;

    background: #FFFFFF;
    color: #3D3935 !important;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 15px;

    outline: none;
    box-shadow: none;
    box-sizing: border-box;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

/* Placeholder */
.lmh-newsletter-form input[type="email"]::placeholder {
    color: #8A8179 !important;
    opacity: 1;
}

/* Email focus */
.lmh-newsletter-form input[type="email"]:focus {
    border-color: #C89B63;
    box-shadow: 0 0 0 3px rgba(200, 155, 99, 0.15);
}

/* Subscribe button */
.lmh-newsletter-form button {
    width: auto !important;
    min-width: 120px;
    height: 42px;

    padding: 0 18px !important;

    border: 0 !important;
    border-radius: 50px !important;

    background: #C89B63 !important;
    color: #FFFFFF !important;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 14px !important;
    line-height: 42px !important;
    font-weight: 700 !important;

    letter-spacing: 0.4px;
    text-align: center;
    text-transform: uppercase;

    cursor: pointer;
    box-shadow: none !important;

    transition:
        background 0.2s ease,
        transform 0.2s ease;
}

/* Subscribe button hover */
.lmh-newsletter-form button:hover {
    background: #B8834F !important;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

/* Newsletter consent text */
.lmh-newsletter-note {
    max-width: 360px;
    margin: 0;

    color: #66615C !important;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.45;
}

/* Accessibility label */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ==========================
   MOBILE
========================== */

@media (max-width: 480px) {

    .lmh-footer-contact {
        max-width: 100%;
    }

    .lmh-newsletter-form {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .lmh-newsletter-form input[type="email"] {
        width: 100%;
        min-width: 100%;
        flex: none;
    }

    .lmh-newsletter-form button {
        width: 100% !important;
        min-width: 0;
    }
}

/* ==========================================
   LOVE MY HAIR – WHOLESALE ENQUIRY FORM
   LIGHT BEIGE COLOUR SCHEME
========================================== */

.lmh-wholesale-form {
    width: 100%;
    max-width: 980px;
    padding: 36px;
    border: 1px solid #E6D8C5;
    border-radius: 18px;
    background: #FBF8F3;
    box-sizing: border-box;
    font-family: "Montserrat", Arial, sans-serif;
}

/* Two-column form layout */
.lmh-wholesale-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 20px;
}

.lmh-wholesale-field {
    min-width: 0;
}

.lmh-wholesale-full {
    grid-column: 1 / -1;
}

/* Field labels */
.lmh-wholesale-field > label {
    display: block;
    margin: 0 0 9px;
    color: #3D3935;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
}

.lmh-wholesale-field > label span {
    color: #8B7865;
}

/* Contact Form 7 field wrappers */
.lmh-wholesale-field .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* Text fields */
.lmh-wholesale-form input[type="text"],
.lmh-wholesale-form input[type="email"],
.lmh-wholesale-form input[type="tel"],
.lmh-wholesale-form input[type="url"],
.lmh-wholesale-form select,
.lmh-wholesale-form textarea {
    width: 100% !important;
    max-width: 100%;
    margin: 0;
    border: 1px solid #E6D8C5;
    border-radius: 9px;
    background: #ffffff;
    color: #3D3935;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 16px;
    box-sizing: border-box;
    outline: none;
    box-shadow: none;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

/* Standard field height */
.lmh-wholesale-form input[type="text"],
.lmh-wholesale-form input[type="email"],
.lmh-wholesale-form input[type="tel"],
.lmh-wholesale-form input[type="url"],
.lmh-wholesale-form select {
    height: 52px;
    padding: 0 15px;
}

/* Dropdown */
.lmh-wholesale-form select {
    cursor: pointer;
}

/* Message field */
.lmh-wholesale-form textarea {
    display: block;
    min-height: 155px;
    padding: 14px 15px;
    line-height: 1.5;
    resize: vertical;
}

/* Placeholder text */
.lmh-wholesale-form input::placeholder,
.lmh-wholesale-form textarea::placeholder {
    color: #8A8179;
    opacity: 1;
}

/* Active field */
.lmh-wholesale-form input:focus,
.lmh-wholesale-form select:focus,
.lmh-wholesale-form textarea:focus {
    border-color: #CDBBA4;
    box-shadow: 0 0 0 3px rgba(205, 187, 164, 0.20);
}

/* Product-interest checkboxes */
.lmh-wholesale-form .wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.lmh-wholesale-form .wpcf7-list-item {
    margin: 0 !important;
}

.lmh-wholesale-form .wpcf7-checkbox .wpcf7-list-item label {
    min-height: 46px;
    padding: 10px 16px;
    border: 1px solid #E6D8C5;
    border-radius: 8px;
    background: #F3EBDD;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #3D3935;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    box-sizing: border-box;
}

.lmh-wholesale-form input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #8B7865;
}

/* Privacy acceptance */
.lmh-wholesale-form .wpcf7-acceptance {
    display: block;
}

.lmh-wholesale-form .wpcf7-acceptance .wpcf7-list-item {
    display: block;
}

.lmh-wholesale-form .wpcf7-acceptance label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #66615C;
    font-size: 14px;
    line-height: 1.5;
    cursor: pointer;
}

/* Submit button */
.lmh-wholesale-form .lmh-wholesale-submit {
    width: auto !important;
    min-width: 245px;
    height: 54px;
    padding: 0 26px !important;
    border: 0 !important;
    border-radius: 50px !important;
    background: #F3EBDD !important;
    color: #3D3935 !important;
    font-family: "Montserrat", Arial, sans-serif;
    font-size: 14px !important;
    line-height: 54px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: none !important;
    transition:
        background 0.2s ease,
        transform 0.2s ease;
}

.lmh-wholesale-form .lmh-wholesale-submit:hover {
    background: #E6D8C5 !important;
    color: #3D3935 !important;
    transform: translateY(-2px);
}

/* Validation messages */
.lmh-wholesale-form .wpcf7-not-valid {
    border-color: #b42318 !important;
}

.lmh-wholesale-form .wpcf7-not-valid-tip {
    display: block;
    margin-top: 6px;
    color: #b42318;
    font-size: 13px;
}

.lmh-wholesale-form .wpcf7-response-output {
    margin: 22px 0 0 !important;
    padding: 13px 16px !important;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.5;
}

/* Loading spinner */
.lmh-wholesale-form .wpcf7-spinner {
    margin: 0 0 0 12px;
}

/* Tablet and mobile */
@media (max-width: 767px) {
    .lmh-wholesale-form {
        padding: 26px 20px;
    }

    .lmh-wholesale-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .lmh-wholesale-full {
        grid-column: auto;
    }

    .lmh-wholesale-form .wpcf7-checkbox {
        flex-direction: column;
    }

    .lmh-wholesale-form .wpcf7-checkbox .wpcf7-list-item label {
        width: 100%;
    }

    .lmh-wholesale-form .lmh-wholesale-submit {
        width: 100% !important;
        min-width: 0;
    }
}






/* ==========================================
   LOVE MY HAIR CONTACT DETAILS CARD
   NEW BEIGE / GOLD COLOUR SCHEME
========================================== */

.lmh-contact-card {
    width: 100%;
    max-width: 760px;
    padding: 34px 30px;

    border: 1px solid #F0D8B2;
    border-radius: 18px;

    background: #FFF8EC;

    box-sizing: border-box;

    font-family: "Montserrat", Arial, sans-serif;
}

.lmh-contact-card h2 {
    margin: 0 0 28px;

    color: #3D3935;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 31px;
    line-height: 1.2;
    font-weight: 500;
}

.lmh-contact-list {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.lmh-contact-item {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}


/* ==========================
   ICON CIRCLES
========================== */

.lmh-contact-icon {
    width: 50px !important;
    height: 50px !important;

    min-width: 50px !important;
    min-height: 50px !important;

    max-width: 50px !important;
    max-height: 50px !important;

    flex: 0 0 50px;

    border-radius: 50%;

    background: #FAE8C8;

    display: flex !important;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    box-sizing: border-box;
}


/* SVG icons */
.lmh-contact-icon svg {
    display: block !important;

    width: 24px !important;
    height: 24px !important;

    margin: 0 !important;
    padding: 0 !important;

    fill: none !important;

    stroke: #C89B63 !important;
    stroke-width: 1.9 !important;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lmh-contact-icon svg path,
.lmh-contact-icon svg rect,
.lmh-contact-icon svg circle {
    fill: none !important;

    stroke: #C89B63 !important;
    stroke-width: 1.9 !important;
}


/* ==========================
   CONTACT CONTENT
========================== */

.lmh-contact-content {
    flex: 1;
    min-width: 0;
    padding-top: 3px;
}

.lmh-contact-content h3 {
    margin: 0 0 4px;

    color: #3D3935;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
}

.lmh-contact-content p,
.lmh-contact-content a {
    display: block;
    margin: 0;

    color: #66615C !important;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;

    text-decoration: none;
    overflow-wrap: anywhere;
}

.lmh-contact-content a:hover {
    color: #C89B63 !important;
    text-decoration: underline;
}


/* ==========================
   MOBILE
========================== */

@media (max-width: 767px) {

    .lmh-contact-card {
        padding: 26px 22px;
    }

    .lmh-contact-card h2 {
        margin-bottom: 24px;
        font-size: 28px;
    }

    .lmh-contact-list {
        gap: 20px;
    }

    .lmh-contact-icon {
        width: 46px !important;
        height: 46px !important;

        min-width: 46px !important;
        min-height: 46px !important;

        max-width: 46px !important;
        max-height: 46px !important;

        flex-basis: 46px;
    }

    .lmh-contact-icon svg {
        width: 22px !important;
        height: 22px !important;
    }

    .lmh-contact-content h3 {
        font-size: 16px;
    }

    .lmh-contact-content p,
    .lmh-contact-content a {
        font-size: 15px;
    }
}


/* ==========================================
   PRODUCT PAGE CLEANUP
========================================== */

/* Hide product sorting */
.woocommerce-ordering {
    display: none !important;
}


/* Remove product meta + share */
.single-product .product_meta,
.single-product .product-share,
.single-product .share-with-lines,
.single-product .social-icons {
    display: none !important;
}






/* =====================================================
   LOVE MY HAIR - FAQ PAGE
   NEW BEIGE / GOLD COLOUR SCHEME
===================================================== */

/* Main FAQ area */
.lmh-faq-section {
    max-width: 1050px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 65px 30px 80px !important;
    box-sizing: border-box;
}


/* =====================================================
   REMOVE THE OLD TWO-COLUMN LAYOUT
===================================================== */

.lmh-faq-section > .wpb_column,
.lmh-faq-section > .vc_col-sm-6 {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    display: block !important;
}

.lmh-faq-section .vc_column-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.lmh-faq-section > .wpb_column + .wpb_column {
    margin-top: 14px !important;
}


/* =====================================================
   EACH FAQ BOX
===================================================== */

.lmh-faq-section .vc_toggle {
    position: relative;
    margin: 0 0 14px !important;
    padding: 0 !important;

    border: 1px solid #F0D8B2 !important;
    border-radius: 10px !important;

    background: #FFFFFF !important;

    box-shadow: 0 2px 8px rgba(61, 57, 53, 0.025);

    overflow: hidden;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}


/* Hover */
.lmh-faq-section .vc_toggle:hover {
    border-color: #C89B63 !important;
    box-shadow: 0 5px 18px rgba(200, 155, 99, 0.12);
}


/* =====================================================
   QUESTION
===================================================== */

.lmh-faq-section .vc_toggle_title {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-height: 68px;

    margin: 0 !important;
    padding: 20px 70px 20px 24px !important;

    background: #FFFFFF !important;

    cursor: pointer !important;
}


/* Question text */
.lmh-faq-section .vc_toggle_title h4 {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #3D3935 !important;

    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 17px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;

    letter-spacing: 0 !important;
    text-transform: none !important;
}


/* =====================================================
   REMOVE WPBAKERY DEFAULT ICON
===================================================== */

.lmh-faq-section .vc_toggle_icon {
    display: none !important;
}


/* Custom + button */
.lmh-faq-section .vc_toggle_title::after {
    content: "+";

    position: absolute;
    top: 50%;
    right: 22px;

    width: 34px;
    height: 34px;

    transform: translateY(-50%);

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #FAE8C8;

    color: #C89B63;

    font-family: "Montserrat", Arial, sans-serif;
    font-size: 24px;
    line-height: 1;
    font-weight: 400;

    transition: all 0.25s ease;
}


/* Minus when open */
.lmh-faq-section .vc_toggle_active .vc_toggle_title::after {
    content: "−";

    background: #C89B63;
    color: #FFFFFF;
}


/* Question background when open */
.lmh-faq-section .vc_toggle_active .vc_toggle_title {
    background: #FFF8EC !important;
}


/* =====================================================
   ANSWERS
===================================================== */

.lmh-faq-section .vc_toggle_content {
    margin: 0 !important;

    padding: 6px 70px 25px 24px !important;

    background: #FFF8EC !important;

    color: #66615C !important;

    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.75 !important;

    border-top: 0 !important;
}


/* Answer paragraphs */
.lmh-faq-section .vc_toggle_content p {
    margin: 0 0 13px !important;

    color: #66615C !important;

    font-family: "Montserrat", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

.lmh-faq-section .vc_toggle_content p:last-child {
    margin-bottom: 0 !important;
}


/* Links */
.lmh-faq-section .vc_toggle_content a {
    color: #C89B63 !important;
    text-decoration: underline;
}

.lmh-faq-section .vc_toggle_content a:hover {
    color: #B8834F !important;
}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .lmh-faq-section {
        padding: 40px 16px 55px !important;
    }

    .lmh-faq-section .vc_toggle {
        margin-bottom: 11px !important;
        border-radius: 8px !important;
    }

    .lmh-faq-section .vc_toggle_title {
        min-height: 62px;
        padding: 17px 58px 17px 18px !important;
    }

    .lmh-faq-section .vc_toggle_title h4 {
        font-size: 15px !important;
        line-height: 1.45 !important;
    }

    .lmh-faq-section .vc_toggle_title::after {
        right: 16px;
        width: 30px;
        height: 30px;
        font-size: 21px;
    }

    .lmh-faq-section .vc_toggle_content {
        padding: 4px 18px 20px !important;
        font-size: 15px !important;
        line-height: 1.7 !important;
    }

    .lmh-faq-section .vc_toggle_content p {
        font-size: 15px !important;
        line-height: 1.7 !important;
    }
}

/* SEARCH RESULTS TITLE BAR */
.page-title.page-title-default {
    background-color: #F3EBDD !important;
}

/* Search Results heading */
.page-title.page-title-default .entry-title {
    color: #3D3935 !important;
}

/* Breadcrumbs */
.page-title.page-title-default .breadcrumbs,
.page-title.page-title-default .breadcrumbs a,
.page-title.page-title-default .breadcrumbs span {
    color: #6B625A !important;
}




/* ==========================================
   LOVE MY HAIR - PRODUCT ADD TO CART BUTTONS
========================================== */

.quick-shop-btn .button,
.quick-shop-btn a.button,
.products .product .add_to_cart_button,
.products .product .button {
    background: #FAE8C8 !important;
    color: #3D3935 !important;
    border-color: #FAE8C8 !important;
}

/* Hover */
.quick-shop-btn .button:hover,
.quick-shop-btn a.button:hover,
.products .product .add_to_cart_button:hover,
.products .product .button:hover {
    background: #C89B63 !important;
    color: #FFFFFF !important;
    border-color: #C89B63 !important;
}




/* ==========================================
   LOVE MY HAIR - ALL ADD TO CART BUTTONS
========================================== */

/* Shop / category buttons */
.quick-shop-btn .button,
.quick-shop-btn a.button,
.products .product .add_to_cart_button,
.products .product .button,

/* Single product button */
.single_add_to_cart_button,
.single_add_to_cart_button.button,
.single_add_to_cart_button.button.alt {
    background: #FAE8C8 !important;
    color: #3D3935 !important;
    border-color: #FAE8C8 !important;
}

/* Hover */
.quick-shop-btn .button:hover,
.quick-shop-btn a.button:hover,
.products .product .add_to_cart_button:hover,
.products .product .button:hover,
.single_add_to_cart_button:hover,
.single_add_to_cart_button.button:hover,
.single_add_to_cart_button.button.alt:hover {
    background: #C89B63 !important;
    color: #FFFFFF !important;
    border-color: #C89B63 !important;
}



/* Hide stock quantity number but keep "In stock" */
.single-product p.stock.in-stock {
    font-size: 0 !important;
    color: #C89B63 !important;
}

.single-product p.stock.in-stock::after {
    content: "In stock";
    font-size: 15px !important;
    color: #C89B63 !important;
    font-family: "Montserrat", Arial, sans-serif;
    font-weight: 600;
}

.single-product-content .summary-inner .in-stock {
    border: 2px solid #C89B63 !important;
    color: #C89B63 !important;
}