/*
Theme Name: Smiles Unlimited - Coffee Shop Corner Child
Description: Child theme for Coffee Shop Corner Pro, created for the Smiles Unlimited Designs rebuild.
Author: Smiles Unlimited Designs
Template: coffee-shop-corner
Version: 2.9.0
Text Domain: smiles-coffee-shop-child
*/

/*
 * Smiles Unlimited typography system.
 *
 * Coffee Shop Corner Pro prints its selected Customizer fonts as inline CSS,
 * so these brand rules use !important to keep the child-theme typography
 * authoritative without editing the parent theme.
 *
 * Playfair Display: headings, titles, product titles
 * Montserrat: body copy, navigation, buttons, forms, labels
 */

/* Functional and reading text */
body,
p,
li,
dt,
dd,
th,
td,
label,
a,
button,
input,
select,
textarea,
.btn,
.btn span,
.button,
.wp-block-button__link,
.ht-main-navigation,
.ht-main-navigation a,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce form,
.woocommerce form label,
.woocommerce .price,
#appointment .info-txt a,
#appointment .info-txt p,
#appointment .workbx li,
.wpcf7-form-control,
#innerpage-box .cntpgtxt p,
#innerpage-box .cntpgtxt a {
    font-family: 'Montserrat', sans-serif !important;
}

/* Display headings and titles */
h1,
h2,
h3,
h4,
h5,
h6,
.ht-section-title,
.ht-title-wrap,
.ht-slide-cap-title,
.slider_section .title,
.slider_section .title span,
.slider_section .title small,
.slider_section .title strong,
.slider_section .title b,
.slider_section .title big,
.slider_section .title sub,
.slider_section .title sup,
.section-title h1,
.section-title h2,
.section-title h1 span,
.section-title h2 span,
.section-title h1 small,
.section-title h2 small,
.section-title h1 strong,
.section-title h2 strong,
.section-title h1 b,
.section-title h2 b,
.section-title h1 big,
.section-title h2 big,
.inner-area-title,
.inner-area-title small,
.inner-area-title span,
.inner-area-title strong,
.inner-area-title sub,
.inner-area-title sup,
.inner-area-title big,
.inner-area-title b,
#ht-contactus-wrap h1,
#ht-contactus-wrap h1 small,
#ht-contactus-wrap h1 strong,
#ht-contactus-wrap h1 span,
#ht-contactus-wrap h1 sub,
#ht-contactus-wrap h1 sup,
#ht-contactus-wrap h1 big,
#ht-contactus-wrap h1 b,
main#innerpage-box .social_area h4,
.woocommerce div.product .product_title,
main#innerpage-box h2.woocommerce-loop-product__title,
body.page-template-default main#innerpage-box h4,
div#commentsAdd h4 {
    font-family: 'Playfair Display', Georgia, serif !important;
}

/*
 * Slider startup fix.
 * Coffee Shop Corner Pro outputs a second full-width copy of each featured
 * image (.slide-mainimg). Before bxSlider initializes, that duplicate is
 * briefly visible at full width and causes the startup flash/stretch.
 *
 * Keep the original Pro slider and curved image, but suppress the duplicate
 * layer and hold the raw slider to one correctly sized slide until bxSlider
 * creates its wrapper. Once bxSlider wraps #ht-bx-slider, the direct-child
 * rules below automatically stop applying.
 */
#slider .slide-mainimg {
    display: none !important;
}

#slider .ht-slide,
#slider > #ht-bx-slider {
    height: 640px;
    overflow: hidden;
}

#slider > #ht-bx-slider > .ht-slide:not(:first-child) {
    display: none !important;
}

@media (max-width: 999px) {
    #slider .ht-slide,
    #slider > #ht-bx-slider {
        height: 400px;
    }
}

@media (max-width: 520px) {
    #slider .ht-slide,
    #slider > #ht-bx-slider {
        height: 250px;
    }
}


/*
 * Playfair slider sizing refinement.
 * The parent theme was designed around a compact cursive display face and
 * sets desktop slider titles to 90px/75px. Playfair Display occupies more
 * vertical space, which can push the description/CTA below the 640px hero.
 * These rules retain the theme's composition while keeping all slider copy
 * and buttons comfortably inside the hero at desktop, tablet, and phone sizes.
 */
@media (min-width: 1000px) {
    .slider_section .title {
        font-size: 72px !important;
        line-height: 0.94 !important;
    }

    .slider_section .sub-title {
        margin-top: 1.25em !important;
    }

    .slider_section .slider-btn {
        margin-top: 1.5em !important;
    }
}

@media (min-width: 521px) and (max-width: 999px) {
    .slider_section .title {
        font-size: 50px !important;
        line-height: 1 !important;
    }

    .slider_section .sub-title {
        margin-top: 1em !important;
    }

    .slider_section .slider-btn {
        margin-top: 1em !important;
    }
}

@media (max-width: 520px) {
    .slider_section .title {
        font-size: 34px !important;
        line-height: 1.02 !important;
    }
}


/*
 * Homepage product CTA sizing.
 * Coffee Shop Corner Pro hard-codes these product buttons at 22px, which is
 * oversized in Montserrat and causes "Add To Cart" to wrap on desktop cards.
 * Keep the theme's shape/colors/hover behavior, but use a compact brand size.
 */
#product-section .readmore a {
    font-size: 16px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    padding: 7px 18px !important;
    white-space: nowrap !important;
}

@media (max-width: 520px) {
    #product-section .readmore a {
        font-size: 15px !important;
        padding: 7px 14px !important;
    }
}

/*
 * Inner-page responsive header refinement.
 * Coffee Shop Corner Pro sets the featured-image background to background-size:100%,
 * which can leave a visible strip beneath the image when the header becomes taller
 * at narrower desktop/tablet widths. Fill the image pane instead, preserving the
 * curved right-hand title panel and the 1900x700 service-banner composition.
 */
.page-main-header .innlhs-imgbx {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
}


/*
 * Inner-page right title panel
 * Use the customized parent-theme innheadrhs.png directly.
 * That file contains the exact transparent swoosh shape used across inside pages.
 * Do not hide or recreate it with CSS.
 */

/*
 * Compact the desktop/tablet header before the theme's navigation has enough room
 * to wrap. This keeps the site name and all five primary menu items on one line
 * while leaving the theme's true mobile navigation behavior untouched.
 */
@media (min-width: 769px) and (max-width: 1100px) {
    .site-header .ht-site-title,
    .site-header .site-title {
        font-size: 19px !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
    }

    .navigation .mainmenu li {
        margin-left: 4px !important;
        margin-right: 4px !important;
    }

    .navigation .mainmenu > li > a,
    .navigation .mainmenu li a {
        font-size: 15px !important;
    }

    .page-main-header .ht-main-title {
        line-height: 1.08 !important;
        letter-spacing: 1px !important;
    }
}



/*
 * Service-card featured-image fit.
 * Service/detail banners use a wide 1900x700 composition. The parent theme
 * forces that same featured image into a fixed-height card and previously
 * stretched it to 100% width x 280/300px height. Crop instead of distort,
 * keeping the intentionally product-heavy left side in view.
 */
#innerpage-box .singleinner-service .service_inimg img,
.service-area .service-icon img {
    object-fit: cover !important;
    object-position: left center !important;
    display: block !important;
}


/*
 * Site-wide customization announcement bar.
 * Rendered by the child theme directly after the opening <body> tag.
 * Hidden on phones to preserve the compact mobile header/slider layout.
 */
.sud-site-announcement {
    width: 100%;
    background: #D6A9C7;
    color: #4A201C;
    text-align: center;
    padding: 10px 15px;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.35;
    box-sizing: border-box;
}

.sud-site-announcement a {
    color: #4A201C !important;
    font-family: 'Playfair Display', Georgia, serif !important;
    font-weight: 700;
    text-decoration: underline;
}

.sud-site-announcement a:hover,
.sud-site-announcement a:focus {
    color: #4A201C !important;
    text-decoration: none;
}

@media (max-width: 767px) {
    .sud-site-announcement {
        display: none !important;
    }
}


/* =====================================================
   SMILES UNLIMITED DESIGNS — CONSOLIDATED SITE CSS
   Added in child theme v1.8
   ===================================================== */


/* =====================================================
   SHOP GRID
   ===================================================== */

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 24px;
    line-height: 1.05;
    height: 4.25em;
    margin-bottom: 10px;
    overflow: hidden;
}

.woocommerce ul.products li.product .price {
    margin-top: -10px !important;
    margin-bottom: 3px !important;
}

.woocommerce ul.products li.product .button {
    margin-top: 0 !important;
    color: #4A201C !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .button:focus {
    color: #4A201C !important;
}


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

@media (max-width: 767px) {

    .woocommerce ul.products li.product .woocommerce-loop-product__title {
        font-size: 19px;
        line-height: 1.1;
        height: auto;
        margin-bottom: 10px;
        overflow: visible;
    }

    .woocommerce ul.products li.product .price {
        margin-top: 0 !important;
        margin-bottom: 3px !important;
    }

    .woocommerce ul.products li.product .button {
        margin-top: 0 !important;
    }

    /* Hide floating Contact Us tab on mobile */
    .headcorn-btn {
        display: none !important;
    }

    /* Keep long contact email addresses inside the viewport */
    a[href^="mailto:"] {
        font-size: 20px !important;
        line-height: 1.25 !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    /* White mobile navigation panel */
    .menu-content {
        background: #FFFFFF !important;
    }
}

@media (max-width: 420px) {
    a[href^="mailto:"] {
        font-size: 18px !important;
    }
}


/* =====================================================
   CART + CHECKOUT ICON CLEANUP
   ===================================================== */

#shipping_method li::before,
.woocommerce-shipping-methods li::before,
#shipping_method li label::before,
.woocommerce-shipping-methods li label::before {
    display: none !important;
    content: none !important;
}

.woocommerce-shipping-calculator::after,
.shipping-calculator-button::before,
.shipping-calculator-button::after {
    display: none !important;
    content: none !important;
}


/* =====================================================
   WOOCOMMERCE NOTICE ICON CLEANUP
   ===================================================== */

.woocommerce-error::before,
.woocommerce-error li::before,
.woocommerce-info::before,
.woocommerce-info li::before,
.woocommerce-message::before,
.woocommerce-message li::before {
    display: none !important;
    content: none !important;
}


/* =====================================================
   OUR SPECIALTIES
   ===================================================== */

#service .single-service-bx .ser-smoke {
    display: none !important;
}


/* =====================================================
   HOMEPAGE SEND A MESSAGE BUTTON
   ===================================================== */

div:has(> .sud-home-contact-cta) {
    overflow: visible !important;
    background-size: 100% auto !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    padding-bottom: 18px !important;
}

.sud-home-contact-cta {
    position: relative !important;
    z-index: 10 !important;
    text-align: center;
    padding-top: 185px !important;
    margin: 0 !important;
}

.sud-home-contact-cta a {
    display: inline-block;
    padding: 11px 26px;
    background: #D6A9C7;
    color: #4A201C !important;
    border: 2px solid #4A201C;
    border-radius: 4px;
    box-shadow: 4px 4px 0 #4A201C;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.sud-home-contact-cta a:hover {
    background: #4A201C;
    color: #FFFFFF !important;
    box-shadow: 2px 2px 0 #4A201C;
    transform: translate(2px, 2px);
}


/* =====================================================
   HOMEPAGE GALLERY — KEEP IMAGES SQUARE
   ===================================================== */

.homegalry .lz-gallery-images .spa-gall {
    position: relative;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden;
}

.homegalry .lz-gallery-images .spa-gall img.secondry-bg {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    object-position: center center;
    display: block;
}


/* =====================================================
   HOMEPAGE HERO — DESKTOP POSITIONING
   ===================================================== */

@media (min-width: 1200px) {
    #slider .ht-slide .slider_content {
        transform: translateX(clamp(-220px, -11vw, -120px)) !important;
    }
}


/* =====================================================
   MOBILE HOMEPAGE HERO — TEXT ONLY
   Keep bxSlider structure/height/viewport untouched.
   ===================================================== */

@media (max-width: 767px) {

    #slider .ht-slide .slider_content {
        position: absolute !important;
        top: 16% !important;
        right: 4% !important;
        left: auto !important;
        width: 46% !important;
        max-width: 46% !important;
        transform: none !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        text-align: left !important;
    }

    #slider .ht-slide .slider_content .title {
        color: #4A201C !important;
        font-family: 'Playfair Display', Georgia, serif !important;
        font-size: 16px !important;
        line-height: 1.05 !important;
        margin: 0 0 5px !important;
        padding: 0 !important;
    }

    #slider .ht-slide .slider_content .sub-title {
        color: #4A201C !important;
        font-size: 11px !important;
        line-height: 1.08 !important;
        margin: 0 0 7px !important;
        padding: 0 !important;
    }

    #slider .ht-slide .slider_content .slider-btn a,
    #slider .ht-slide .slider_content .button,
    #slider .ht-slide .slider_content a {
        font-size: 13px !important;
        line-height: 1.15 !important;
        padding: 7px 12px !important;
        margin: 0 !important;
        white-space: normal !important;
    }
}


/* =====================================================
   HOMEPAGE PRODUCT CAROUSEL — PREVENT IMAGE STRETCHING
   ===================================================== */

.home .product-grid .product-image img.wp-post-image {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: cover !important;
    object-position: center;
    display: block;
}

.home .product-grid .product-image {
    aspect-ratio: 1 / 1;
    overflow: hidden;
}


/* =====================================================
   SINGLE PRODUCT ACTION BUTTONS
   ===================================================== */

.single-product .summary .button,
.single-product .summary a.button,
.single-product .summary button.button {
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
}

.single-product .summary .button:hover,
.single-product .summary .button:focus,
.single-product .summary a.button:hover,
.single-product .summary a.button:focus,
.single-product .summary button.button:hover,
.single-product .summary button.button:focus {
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
}


/* =====================================================
   PRODUCT TABS
   ===================================================== */

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: #D6A9C7 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #D6A9C7 !important;
}


/* =====================================================
   SELECT SIZE FIRST BUTTON
   ===================================================== */

.woocommerce div.product form.cart .button.disabled,
.woocommerce div.product form.cart .button:disabled,
.woocommerce div.product form.cart .button:disabled[disabled],
.single-product div.product .summary .button.disabled,
.single-product div.product .summary .button:disabled {
    background: #4A201C !important;
    background-color: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
    border-color: #4A201C !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}

/* =====================================================
   FAQ PAGE

   - Use Smiles espresso for answer text
   - Replace the parent theme coffee image with the
     Smiles Unlimited Designs FAQ image bundled here
   ===================================================== */

/* FAQ answer text */
#innerpage-box .faq-content .panel,
#innerpage-box .faq-content .panel p,
#innerpage-box .faq-content .faq-description,
#innerpage-box .faq-content .faq-description p {
    color: #4A201C !important;
}

/* FAQ custom image */
#innerpage-box .faq-img img {
    content: url("assets/images/faq-picture.webp") !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    display: block !important;
    border-radius: 8px 8px 100px 100px !important;
}


/* =====================================================
   PORTFOLIO IMAGES - PRESERVE ORIGINAL PROPORTIONS
   Prevent stretching without cropping
   ===================================================== */

#innerpage-box .lz-gallery-images img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: initial !important;
    object-position: initial !important;
    display: block !important;
}


/* =====================================================
   BROWSE ITEMS / MAIN SHOP PAGE BANNER
   Use the Smiles custom banner bundled with the child theme.
   ===================================================== */

body.woocommerce-shop .page-main-header .innlhs-imgbx,
body.post-type-archive-product .page-main-header .innlhs-imgbx {
    background-image: url("assets/images/gifts-and-goods-page-banner.webp") !important;
    background-size: cover !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
}


/* =====================================================
   WOOCOMMERCE INNER-PAGE BACKGROUND
   Match the soft textured background used on other inside pages.
   Applies to Browse Items, product categories, and individual items.
   ===================================================== */

body.woocommerce-shop .page-main-header,
body.post-type-archive-product .page-main-header,
body.tax-product_cat .page-main-header,
body.single-product .page-main-header {
    background-image: url("assets/images/inner-page-background.webp") !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #f8f1f6 !important;
}


/* =====================================================
   WOOCOMMERCE SHOP + CATEGORY + PRODUCT PAGE HEADERS
   Reduce excessive pale-pink empty space.
   Applies globally to:
   - Main Browse Items page
   - All product category pages
   - All individual product pages
   ===================================================== */

body.woocommerce-shop .page-main-header,
body.post-type-archive-product .page-main-header,
body.tax-product_cat .page-main-header,
body.single-product .page-main-header {
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
}

/* Give title + breadcrumb comfortable room below navigation */
body.woocommerce-shop .page-main-header > .ht-container,
body.post-type-archive-product .page-main-header > .ht-container,
body.tax-product_cat .page-main-header > .ht-container,
body.single-product .page-main-header > .ht-container {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 90px !important;
    padding-bottom: 35px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Remove extra theme spacing around title */
body.woocommerce-shop .page-main-header .ht-main-title,
body.post-type-archive-product .page-main-header .ht-main-title,
body.tax-product_cat .page-main-header .ht-main-title,
body.single-product .page-main-header .ht-main-title {
    margin-top: 0 !important;
}

/* Remove unnecessary breadcrumb spacing */
body.woocommerce-shop .page-main-header .woocommerce-breadcrumb,
body.post-type-archive-product .page-main-header .woocommerce-breadcrumb,
body.tax-product_cat .page-main-header .woocommerce-breadcrumb,
body.single-product .page-main-header .woocommerce-breadcrumb {
    margin-bottom: 0 !important;
}


/* =====================================================
   BROWSE ITEMS DROPDOWN MENU COLORS
   First dropdown: espresso normally, pink on hover.
   Second fly-out: espresso normally, pink only on hover/current item.
   ===================================================== */

.menu-item-has-children > .sub-menu > li > a {
    color: #4A201C !important;
}

.menu-item-has-children > .sub-menu > li:hover > a {
    color: #D6A9C7 !important;
}

.menu-item-has-children > .sub-menu >
.menu-item-has-children > .sub-menu > li > a {
    color: #4A201C !important;
}

.menu-item-has-children > .sub-menu >
.menu-item-has-children > .sub-menu > li:hover > a {
    color: #D6A9C7 !important;
}

.menu-item-has-children > .sub-menu >
.menu-item-has-children > .sub-menu > li.current-menu-item > a {
    color: #D6A9C7 !important;
}

.sub-menu li:hover > .sub-menu li:not(:hover) > a {
    color: #4A201C !important;
}

.sub-menu li:hover > .sub-menu li:hover > a {
    color: #D6A9C7 !important;
}


/* =====================================================
   LANDING PAGE COLUMN SUBHEADINGS
   Remove decorative lines from headings inside columns.
   ===================================================== */

#innerpage-box .wp-block-columns .wp-block-heading::after {
    display: none !important;
    content: none !important;
}


/* =====================================================
   WEDDINGS & SPECIAL EVENTS
   Replace Coffee Shop Corner coffee-cup bullets with smiley faces.
   Page ID: 3239
   ===================================================== */

body.page-id-3239 #innerpage-box .entry-content ul.wp-block-list {
    list-style: none !important;
    padding-left: 0 !important;
}

body.page-id-3239 #innerpage-box .entry-content ul.wp-block-list li {
    position: relative;
    padding-left: 2em !important;
    margin-bottom: 0.45em;
}

body.page-id-3239 #innerpage-box .entry-content ul.wp-block-list li::before {
    content: "\f118" !important;
    font-family: FontAwesome !important;
    font-style: normal !important;
    font-weight: normal !important;
    color: #D6A9C7 !important;
    font-size: 1.2em !important;
    position: absolute;
    left: 0;
    top: 0.02em;
}


/* =====================================================
   HOMEPAGE ABOUT SECTION
   Prevent heading descenders from being clipped.
   ===================================================== */

body.home #about .section-title,
body.home #about .section-title .tilticnbx,
body.home #about .section-title h2 {
    overflow: visible !important;
}

body.home #about .section-title h2 {
    line-height: 1.13 !important;
    padding-bottom: 0.12em !important;
    margin-bottom: 0.12em !important;
}


/* =====================================================
   HOMEPAGE GALLERY TITLES
   Keep all six titles the same size.
   ===================================================== */

.homegalry .lz-gallery-images .over-text {
    font-size: 32px !important;
    line-height: 1.1 !important;
}

/* =====================================================
   THE SMILES DIFFERENCE - RESPONSIVE CARDS

   Prevent awkward mid-word breaks on smaller desktop
   and laptop screens while preserving the three-card layout.
   ===================================================== */

#feature .feature-area-data h4 {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

@media (min-width: 992px) and (max-width: 1299px) {

    #feature .featurebx {
        padding-left: 0.75em !important;
        padding-right: 0.75em !important;
    }

    #feature .featureus-single {
        padding-left: 2em !important;
        padding-right: 2em !important;
    }

    #feature .feature-area-data h4 {
        font-size: 30px !important;
        line-height: 1.08 !important;
    }

    #feature .feature-area-data p {
        line-height: 1.25 !important;
    }
}

/* =====================================================
   THE SMILES DIFFERENCE - INFORMATIONAL CARDS
   Keep feature-card buttons hidden even when the parent
   theme restores its default "Read More" label.
   ===================================================== */

#feature .feature-area-data .feabtn {
    display: none !important;
}

/* =====================================================
   CART BUTTONS

   Apply coupon, Update cart, and Proceed to checkout
   use the Smiles Unlimited Designs brand colors.
   ===================================================== */

.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce-cart table.cart td.actions button[name="update_cart"],
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    background: #D6A9C7 !important;
    background-color: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    border-color: #D6A9C7 !important;
}

.woocommerce-cart table.cart td.actions .coupon .button:hover,
.woocommerce-cart table.cart td.actions .coupon .button:focus,
.woocommerce-cart table.cart td.actions button[name="update_cart"]:hover:not(:disabled),
.woocommerce-cart table.cart td.actions button[name="update_cart"]:focus:not(:disabled),
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus {
    background: #4A201C !important;
    background-color: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
    border-color: #4A201C !important;
}

/* Keep Update cart visibly disabled until a quantity changes. */
.woocommerce-cart table.cart td.actions button[name="update_cart"]:disabled,
.woocommerce-cart table.cart td.actions button[name="update_cart"]:disabled[disabled] {
    background: #D6A9C7 !important;
    background-color: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    opacity: 0.45 !important;
    cursor: not-allowed !important;
}

/* =====================================================
   CART - COUPON FIELD + PRODUCT THUMBNAIL

   Give the coupon placeholder enough room to display in full
   and make cart item images easier to recognize.
   ===================================================== */

@media (min-width: 769px) {
    .woocommerce-cart table.cart td.actions .coupon #coupon_code {
        width: 145px !important;
        min-width: 145px !important;
    }
}

.woocommerce-cart table.cart .product-thumbnail img {
    width: 60px !important;
    max-width: 60px !important;
    height: auto !important;
}



/* =====================================================
   CHECKOUT - PLACE ORDER BUTTON

   Match the active Place order button to the Cart buttons
   while leaving the disabled checkout state visibly muted.
   ===================================================== */

.woocommerce-checkout #payment #place_order:not(:disabled):not(.disabled) {
    background: #D6A9C7 !important;
    background-color: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    border-color: #D6A9C7 !important;
}

.woocommerce-checkout #payment #place_order:not(:disabled):not(.disabled):hover,
.woocommerce-checkout #payment #place_order:not(:disabled):not(.disabled):focus {
    background: #4A201C !important;
    background-color: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
    border-color: #4A201C !important;
}


/* =====================================================
   MY ACCOUNT - LOGGED-IN DASHBOARD

   Give the WooCommerce account area a clean two-column
   desktop layout with branded navigation. The login /
   registration view is intentionally left untouched.
   ===================================================== */

@media (min-width: 769px) {
    body.woocommerce-account.logged-in #innerpage-box .woocommerce {
        display: grid !important;
        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) !important;
        gap: 48px !important;
        align-items: start !important;
    }

    body.woocommerce-account.logged-in #innerpage-box .woocommerce-MyAccount-navigation,
    body.woocommerce-account.logged-in #innerpage-box .woocommerce-MyAccount-content {
        float: none !important;
        width: auto !important;
        margin: 0 !important;
    }
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #D6A9C7 !important;
    background: rgba(255, 255, 255, 0.58) !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation li {
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(214, 169, 199, 0.62) !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: 0 !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation a {
    display: block !important;
    padding: 14px 18px !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation li.is-active > a {
    background: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    font-weight: 700 !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation li:not(.is-active) > a:hover,
body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation li:not(.is-active) > a:focus {
    background: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-content {
    min-width: 0 !important;
    color: #4A201C !important;
}

body.woocommerce-account #innerpage-box .woocommerce-MyAccount-content > :first-child {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    body.woocommerce-account #innerpage-box .woocommerce-MyAccount-navigation {
        width: 100% !important;
        float: none !important;
        margin: 0 0 28px !important;
    }

    body.woocommerce-account #innerpage-box .woocommerce-MyAccount-content {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
    }
}


/* =====================================================
   MY ACCOUNT - LOGIN / REGISTER BUTTONS

   Match the logged-out WooCommerce account buttons to
   the Smiles Unlimited Designs button treatment.
   ===================================================== */

body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-login .woocommerce-button:not(:disabled):not(.disabled),
body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-register .woocommerce-button:not(:disabled):not(.disabled) {
    background: #D6A9C7 !important;
    background-color: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    border-color: #D6A9C7 !important;
}

body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-login .woocommerce-button:not(:disabled):not(.disabled):hover,
body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-login .woocommerce-button:not(:disabled):not(.disabled):focus,
body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-register .woocommerce-button:not(:disabled):not(.disabled):hover,
body.woocommerce-account:not(.logged-in) #innerpage-box .woocommerce-form-register .woocommerce-button:not(:disabled):not(.disabled):focus {
    background: #4A201C !important;
    background-color: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
    border-color: #4A201C !important;
}

/* =====================================================
   MY ACCOUNT - LOGGED-OUT LOGIN / REGISTER LAYOUT

   Place Login and Register side by side on desktop while
   preserving WooCommerce's natural stacked layout on
   tablets and phones.
   ===================================================== */

@media (min-width: 900px) {
    body.woocommerce-account:not(.logged-in) #innerpage-box #customer_login {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 40px !important;
        align-items: start !important;
    }

    body.woocommerce-account:not(.logged-in) #innerpage-box #customer_login > .u-column1,
    body.woocommerce-account:not(.logged-in) #innerpage-box #customer_login > .u-column2 {
        float: none !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    body.woocommerce-account:not(.logged-in) #innerpage-box #customer_login > .u-column1 > h2,
    body.woocommerce-account:not(.logged-in) #innerpage-box #customer_login > .u-column2 > h2 {
        margin-top: 0 !important;
    }
}

/* =====================================================
   CONTACT PAGE - FINAL POLISH

   Keep the contact email readable on one line at desktop
   sizes and match the Forminator Send Message button to
   the Smiles Unlimited Designs button treatment.
   ===================================================== */

/* Undo the parent theme's aggressive break-all behavior
   on contact phone/email links. */
#innerpage-box .contact-address-area .cntpgtxt p,
#innerpage-box .contact-address-area .cntpgtxt a {
    word-break: normal !important;
    overflow-wrap: normal !important;
}

/* Give the contact details enough room to stay readable. */
@media (min-width: 992px) {
    #innerpage-box .contact-address-area .cntpgtxt a,
    #innerpage-box .contact-address-area .cntpgtxt p {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }

    #innerpage-box .contact-address-area .cntpgtxt a[href^="mailto:"] {
        white-space: nowrap !important;
    }
}

/* Forminator Send Message button - normal state. */
#ht-contactus-wrap .forminator-button-submit,
#ht-contactus-wrap button.forminator-button-submit,
#ht-contactus-wrap input[type="submit"] {
    background: #D6A9C7 !important;
    background-color: #D6A9C7 !important;
    color: #4A201C !important;
    -webkit-text-fill-color: #4A201C !important;
    border-color: #D6A9C7 !important;
    transition: all 0.3s ease !important;
}

/* Forminator Send Message button - hover/focus state. */
#ht-contactus-wrap .forminator-button-submit:hover,
#ht-contactus-wrap .forminator-button-submit:focus,
#ht-contactus-wrap button.forminator-button-submit:hover,
#ht-contactus-wrap button.forminator-button-submit:focus,
#ht-contactus-wrap input[type="submit"]:hover,
#ht-contactus-wrap input[type="submit"]:focus {
    background: #4A201C !important;
    background-color: #4A201C !important;
    color: #D6A9C7 !important;
    -webkit-text-fill-color: #D6A9C7 !important;
    border-color: #4A201C !important;
}



/* =====================================================
   CONTACT PAGE - PHONE + EMAIL ONLY

   Smiles Unlimited Designs intentionally does not publish
   a street address. Center the remaining phone and email
   details as a balanced two-column row on desktop and
   stack them naturally on smaller screens.
   ===================================================== */

@media (min-width: 769px) {
    body.page-template-contact-template #innerpage-box .contact-address-area .cntlhsbx {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 36px !important;
        float: none !important;
        width: min(820px, calc(100% - 40px)) !important;
        max-width: 820px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    body.page-template-contact-template #innerpage-box .contact-address-area .cntlhsbx > .col-md-4 {
        float: none !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (max-width: 768px) {
    body.page-template-contact-template #innerpage-box .contact-address-area .cntlhsbx {
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 15px !important;
    }

    body.page-template-contact-template #innerpage-box .contact-address-area .cntlhsbx > .col-md-4 {
        float: none !important;
        width: 100% !important;
    }
}


/* =====================================================
   CUSTOMIZATION / SERVICES CARD POLISH

   Keep card headings centered by the parent theme while
   left-aligning the descriptive copy for easier reading.
   ===================================================== */

body.page-template-default #innerpage-box .singleinner-service .service_inbox p,
body.page-template-default #innerpage-box .singleinner-service .service_inbox .description {
    text-align: left !important;
}



/* =====================================================
   HOMEPAGE - SMILES DIFFERENCE INFORMATIONAL LINKS
   Keep the icon and title visually informational only.
   The Read More button is already hidden above.
   ===================================================== */

#feature .feature-box a,
#feature .feature-area-data > a {
    cursor: default !important;
    text-decoration: none !important;
}


/* =====================================================
   HOMEPAGE DIVIDER DIAMONDS - FULL WIDTH SWEEP

   Preserve the Coffee Shop Corner divider line while
   allowing the diamond to travel from the true left edge
   to the true right edge of each homepage section title.
   ===================================================== */

body.home .section-title .titleicon {
    position: relative !important;
    height: 28px !important;
    min-height: 28px !important;
    overflow: hidden !important;
}

body.home .section-title .titleicon > svg.sud-diamond-sweep {
    position: absolute !important;
    width: 15px !important;
    height: 15px !important;
    left: 0 !important;
    top: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    animation: none !important;
    transition: none !important;
    display: block !important;
    z-index: 2 !important;
}


/* =====================================================
   HOMEPAGE GALLERY - DIRECT DESTINATION LINKS

   Disable Coffee Shop Corner Pro's lightbox click layer
   so each complete gallery tile acts as the destination
   link defined by the child theme.
   ===================================================== */

body.home .homegalry .lz-gallery-images {
    cursor: pointer;
}

body.home .homegalry .lz-gallery-images .spa-gall {
    pointer-events: none !important;
}

body.home .homegalry .lz-gallery-images:focus-visible {
    outline: 2px solid #D6A9C7;
    outline-offset: 3px;
}
/* =====================================================
   SMILES UNLIMITED DESIGNS
   POLICY FOOTER - FINAL
   ===================================================== */


/* -----------------------------------------------------
   POLICY LINKS
   White normally / Brand pink on hover
   ----------------------------------------------------- */

.s-footer .wp-block-paragraph a {
    color: #ffffff !important;
    text-decoration: none !important;
}

.s-footer .wp-block-paragraph a:hover,
.s-footer .wp-block-paragraph a:focus {
    color: #D6A9C7 !important;
    text-decoration: none !important;
}


/* -----------------------------------------------------
   REMOVE EXCESS VERTICAL SPACE
   ----------------------------------------------------- */

.s-footer {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.s-footer > .single-footer {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
}

.s-footer .widget {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.s-footer .wp-block-paragraph {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}


/* -----------------------------------------------------
   DESKTOP
   Make the three policy widgets evenly share the row
   ----------------------------------------------------- */

@media (min-width: 992px) {

    .s-footer.single-footer-1,
    .s-footer.single-footer-2,
    .s-footer.single-footer-3 {
        width: 33.333333% !important;
        max-width: 33.333333% !important;
        flex: 0 0 33.333333% !important;
        text-align: center !important;
    }
}


/* -----------------------------------------------------
   MOBILE
   Keep links easy to read
   ----------------------------------------------------- */

@media (max-width: 767px) {

    .s-footer {
        width: 100% !important;
        max-width: 100% !important;
        text-align: center !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}


/* =====================================================
   COMPACT FOOTER HEIGHT
   ===================================================== */

footer.footer-area#footer {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Policy-link area */

footer.footer-area#footer .top-area {
    padding-top: 0.30em !important;
    padding-bottom: 0.30em !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* Remove extra widget spacing */

footer.footer-area#footer .single-footer,
footer.footer-area#footer .widget,
footer.footer-area#footer .wp-block-paragraph {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Copyright area */

footer.footer-area#footer .bottom-area {
    padding-top: 0.3em !important;
    padding-bottom: 0.3em !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* =====================================================
   HOMEPAGE CONTACT SECTION - MOBILE POLISH
   ===================================================== */

@media (max-width: 767px) {

    /* Keep email address together */

    #appointment a[href^="mailto:"] {
        font-size: 18px !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    /* Keep business hours on single lines */

    #appointment li {
        font-size: 18px !important;
        line-height: 1.35 !important;
        white-space: nowrap !important;
    }
}


/* =====================================================
   MOBILE MENU - SHOW SUBMENU TOGGLE BUTTONS
   ===================================================== */

@media (max-width: 991px) {

    /* Parent menu items need room for the toggle */

    .navigation .mainmenu li.menu-item-has-children {
        position: relative !important;
    }

    .navigation .mainmenu li.menu-item-has-children > a {
        padding-right: 55px !important;
    }

    /* Reveal the theme's built-in submenu button */

    .navigation .mainmenu li.menu-item-has-children > .menu-click {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: absolute !important;
        top: 0 !important;
        right: 8px !important;

        width: 42px !important;
        height: 42px !important;

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

        cursor: pointer !important;
        z-index: 20 !important;
    }

    /* Visible plus symbol */

    .navigation .mainmenu li.menu-item-has-children > .menu-click::before {
        content: "+" !important;
        display: block !important;

        font-family: Montserrat, sans-serif !important;
        font-size: 28px !important;
        font-weight: 400 !important;
        line-height: 1 !important;

        color: #4A201C !important;
    }
}


/* =====================================================
   MOBILE MENU - MAIN + SECOND LEVEL STYLING
   ===================================================== */

@media (max-width: 991px) {

    /* -------------------------------------------------
       TOP-LEVEL MOBILE MENU TITLES
       Playfair Display + Bold
       ------------------------------------------------- */

    .navigation .mainmenu > li > a {
        font-family: "Playfair Display", serif !important;
        font-size: 24px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        letter-spacing: 0 !important;
        color: #4A201C !important;
    }


    /* Current / active top-level menu item */

    .navigation .mainmenu > li.current-menu-item > a,
    .navigation .mainmenu > li.current-menu-ancestor > a {
        color: #D6A9C7 !important;
    }


    /* -------------------------------------------------
       SECOND-LEVEL MENU ITEMS
       Keep Existing Font + Make Bold
       ------------------------------------------------- */

    .navigation .mainmenu > li > .sub-menu > li > a {
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        color: #4A201C !important;
    }


    /* -------------------------------------------------
       THIRD-LEVEL + DEEPER MENU ITEMS
       Leave Existing Font / Normal Weight
       ------------------------------------------------- */

    .navigation .mainmenu > li > .sub-menu > li > .sub-menu li > a {
        font-weight: 500 !important;
        color: #4A201C !important;
    }
}
/* =====================================================
   HOMEPAGE CONTACT SECTION - MOBILE
   ===================================================== */

@media (max-width: 767px) {

    /* Keep email address together */
    #appointment a[href^="mailto:"] {
        font-size: 18px !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    /* Keep Business Hours on single lines */
    #appointment li {
        font-size: 18px !important;
        line-height: 1.35 !important;
        white-space: nowrap !important;
    }
}


/* =====================================================
   MOBILE NAVIGATION
   Dropdown controls + visual hierarchy
   ===================================================== */

@media (max-width: 991px) {

    /* Parent items containing submenus */
    .navigation .mainmenu li.menu-item-has-children {
        position: relative !important;
    }

    .navigation .mainmenu li.menu-item-has-children > a {
        padding-right: 55px !important;
    }


    /* Reveal theme's built-in submenu control */
    .navigation .mainmenu li.menu-item-has-children > .menu-click {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute !important;
        top: 0 !important;
        right: 8px !important;
        width: 42px !important;
        height: 42px !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        z-index: 20 !important;
    }


    /* Plus symbol */
    .navigation .mainmenu li.menu-item-has-children > .menu-click::before {
        content: "+" !important;
        display: block !important;
        font-family: "Montserrat", sans-serif !important;
        font-size: 28px !important;
        font-weight: 400 !important;
        line-height: 1 !important;
        color: #4A201C !important;
    }


    /* Top-level mobile menu titles */
    .navigation .mainmenu > li > a {
        font-family: "Playfair Display", serif !important;
        font-size: 24px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        letter-spacing: 0 !important;
        color: #4A201C !important;
    }


    /* Current / active top-level item */
    .navigation .mainmenu > li.current-menu-item > a,
    .navigation .mainmenu > li.current-menu-ancestor > a {
        color: #D6A9C7 !important;
    }


    /* Second-level menu items */
    .navigation .mainmenu > li > .sub-menu > li > a {
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        color: #4A201C !important;
    }


    /* Third-level and deeper menu items */
    .navigation .mainmenu > li > .sub-menu > li > .sub-menu li > a {
        font-weight: 500 !important;
        color: #4A201C !important;
    }
}