/**
 * Theme Name:     CFP Divi Child Theme v2.1
 * Author:         Craig Fouché
 * Template:       Divi
 * Text Domain:    cfp-divi-child-theme-v2-0
 * Description:    Designed by C Fouché for Craig Fouché Photography
 * Version:        2.1
 */


/* ==================================================
   1. CFP UNIVERSAL FORMS
================================================== */

.cfp-form-container {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
}

.cfp-universal-form {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.cfp-universal-form input[type="text"],
.cfp-universal-form input[type="email"],
.cfp-universal-form input[type="tel"],
.cfp-universal-form input[type="number"],
.cfp-universal-form input[type="date"],
.cfp-universal-form select,
.cfp-universal-form textarea {
    width: 100%;
    min-height: 52px;
    margin: 0;
    padding: 14px 16px;

    box-sizing: border-box;

    background-color: #ffffff;
    color: #333333;

    font-family: "TT Wellingtons Medium", Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;

    border: 1px solid #cccccc;
    border-radius: 2px;

    outline: none;

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

.cfp-universal-form textarea {
    min-height: 160px;
    resize: vertical;
}

.cfp-universal-form input::placeholder,
.cfp-universal-form textarea::placeholder {
    color: #777777;
    opacity: 1;
}

.cfp-universal-form input:focus,
.cfp-universal-form select:focus,
.cfp-universal-form textarea:focus {
    border-color: #666666;
    box-shadow: 0 0 0 2px rgba(102, 102, 102, 0.12);
}

.cfp-universal-form input[aria-invalid="true"],
.cfp-universal-form select[aria-invalid="true"],
.cfp-universal-form textarea[aria-invalid="true"],
.cfp-universal-form .cfp-field-error {
    border-color: #a63d40;
}

.cfp-universal-form select {
    cursor: pointer;
}

.cfp-field-help {
    display: block;
    margin: -8px 0 2px;
    color: #666666;

    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
}

.cfp-hp-field {
    position: absolute !important;
    left: -9999px !important;
    top: auto !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* ==================================================
   2. CFP UNIVERSAL FORM BUTTONS
================================================== */

.cfp-universal-form button[type="submit"],
.cfp-universal-form .cfp-submit-btn {
    display: block;
    width: 100%;
    max-width: 280px;
    margin: 8px auto 0;
    padding: 14px 24px;

    box-sizing: border-box;

    background-color: #333333;
    color: #ffffff;

    font-family: "TT Wellingtons Medium", Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;

    text-align: center;
    text-transform: uppercase;
    text-decoration: none;

    border: 0;
    border-radius: 2px;

    cursor: pointer;

    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);

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

.cfp-universal-form button[type="submit"]:hover,
.cfp-universal-form button[type="submit"]:focus,
.cfp-universal-form .cfp-submit-btn:hover,
.cfp-universal-form .cfp-submit-btn:focus {
    background-color: #666666;
    color: #ffffff;

    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.18);
}

.cfp-universal-form button[type="submit"]:disabled,
.cfp-universal-form .cfp-submit-btn:disabled,
.cfp-universal-form .cfp-is-sending {
    background-color: #999999;
    color: #ffffff;

    cursor: wait;
    transform: none;
    box-shadow: none;
    opacity: 0.8;
}


/* ==================================================
   3. FORM FEEDBACK
================================================== */

.cfp-form-message,
.cfp-form-success,
.cfp-form-error,
.cfp-success-message,
.cfp-error-message,
.et_bloom_success_message {
    display: block;
    width: 100%;
    margin: 14px 0 0;
    padding: 12px 14px;

    box-sizing: border-box;

    font-family: Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.5;

    border-radius: 2px;
}

.cfp-form-success,
.cfp-success-message,
.et_bloom_success_message {
    color: #234b2c;
    background-color: #f1f7f2;
    border: 1px solid #b9d2bd;
}

.cfp-form-error,
.cfp-error-message {
    color: #7c2528;
    background-color: #fbf1f1;
    border: 1px solid #dfb5b6;
}

/* ==================================================
   4. POPUP MAKER PRESENTATION
================================================== */

.pum-container {
    width: calc(100% - 24px) !important;
    max-width: 390px !important;

    max-height: calc(100vh - 24px) !important;

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

    overflow-y: auto !important;
    overscroll-behavior: contain;
}

.pum-container .et_bloom_form_container {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 auto;
    padding: 18px !important;

    box-sizing: border-box;

    background-color: #ffffff;
    border-radius: 8px;

    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.2);
}

.pum-container .et_bloom_form_text {
    margin-bottom: 13px;
    text-align: center;
}

.pum-container .et_bloom_form_text h2 {
    margin: 0 0 7px;

    color: #333333;

    font-family: "TT Wellingtons Medium", Helvetica, Arial, sans-serif;
    font-size: 23px;
    font-weight: 500;
    line-height: 1.2;
}

.pum-container .et_bloom_form_text p {
    margin: 0;

    color: #555555;

    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.45;
    text-align: center;
}

.pum-container .cfp-universal-form {
    gap: 9px;
}

.pum-container .cfp-universal-form input[type="text"],
.pum-container .cfp-universal-form input[type="email"],
.pum-container .cfp-universal-form input[type="tel"],
.pum-container .cfp-universal-form select,
.pum-container .cfp-universal-form textarea {
    min-height: 43px;
}

.pum-container .cfp-universal-form button[type="submit"],
.pum-container .cfp-universal-form .cfp-submit-btn {
    max-width: 100%;
    margin-top: 3px;
}


/* ==================================================
   5. POPUP IMAGE PRESENTATION
================================================== */

.pum-container .et_bloom_image_swing {
    display: block;

    width: 100%;
    max-width: 185px;
    height: auto;

    margin: 0 auto 14px;

    border-radius: 4px;

    transform-origin: 50% 0%;

    animation:
        cfpPopupPendulum 2.4s
        cubic-bezier(0.42, 0, 0.25, 1)
        forwards;
}

@keyframes cfpPopupPendulum {
    0% {
        transform: rotate(-20deg);
    }

    10% {
        transform: rotate(20deg);
    }

    26% {
        transform: rotate(-14deg);
    }

    40% {
        transform: rotate(14deg);
    }

    56% {
        transform: rotate(-9deg);
    }

    70% {
        transform: rotate(9deg);
    }

    84% {
        transform: rotate(-5deg);
    }

    94% {
        transform: rotate(5deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pum-container .et_bloom_image_swing {
        animation: none;
    }
}


/* ==================================================
   6. POPUP MAKER CLOSE BUTTON
================================================== */

.pum-container .pum-close {
    padding: 6px 10px !important;

    background-color: #333333 !important;
    color: #ffffff !important;

    font-family: "TT Wellingtons Medium", Helvetica, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;

    text-transform: uppercase;

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

    cursor: pointer !important;

    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);

    transition:
        background-color 0.25s ease,
        color 0.25s ease;
}

.pum-container .pum-close:hover,
.pum-container .pum-close:focus {
    background-color: #666666 !important;
    color: #ffffff !important;
}


/* ==================================================
   6.1 MOBILE POPUP SAFETY
================================================== */

@media (max-width: 600px) {
    .pum-container {
        width: calc(100% - 16px) !important;
        max-width: 360px !important;
        max-height: calc(100vh - 16px) !important;
    }

    .pum-container .et_bloom_form_container {
        padding: 15px !important;
    }

    .pum-container .et_bloom_image_swing {
        max-width: 145px;
        margin-bottom: 11px;
    }

    .pum-container .et_bloom_form_text {
        margin-bottom: 11px;
    }

    .pum-container .et_bloom_form_text h2 {
        font-size: 21px;
    }

    .pum-container .et_bloom_form_text p {
        font-size: 13px;
        line-height: 1.4;
    }

    .pum-container .cfp-universal-form {
        gap: 8px;
    }

    .pum-container .cfp-universal-form input[type="text"],
    .pum-container .cfp-universal-form input[type="email"] {
        min-height: 42px;
    }
}

/* ==================================================
   6.2 COMPACT POPUP FINAL OVERRIDES
================================================== */

.pum-container {
    max-width: 350px !important;
}

.pum-container .et_bloom_form_container {
    padding: 14px !important;
}

.pum-container .et_bloom_image_swing {
    max-width: 155px;
    margin-bottom: 10px;
}

.pum-container .et_bloom_form_text {
    margin-bottom: 10px;
}

.pum-container .et_bloom_form_text h2 {
    margin-bottom: 5px;
    font-size: 20px;
}

.pum-container .et_bloom_form_text p {
    font-size: 12px;
    line-height: 1.35;
}

.pum-container .cfp-universal-form {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;

    min-height: 0 !important;
    height: auto !important;

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

    gap: 7px !important;
}

.pum-container .cfp-universal-form input[type="text"],
.pum-container .cfp-universal-form input[type="email"] {
    min-height: 39px !important;
    height: 39px !important;
    padding: 8px 11px !important;
}

.pum-container .cfp-universal-form button[type="submit"],
.pum-container .cfp-submit-btn {
    min-height: 40px !important;
    padding: 10px 14px !important;
    margin: 4px 0 0 !important;
}

@media (max-width: 600px) {
    .pum-container {
        width: calc(100% - 14px) !important;
        max-width: 330px !important;
        max-height: calc(100vh - 14px) !important;
        overflow-y: auto !important;
    }

    .pum-container .et_bloom_image_swing {
        max-width: 125px;
    }

    .pum-container .et_bloom_form_container {
        padding: 12px !important;
    }
}

/* ==================================================
   7. SITE-WIDE DIVI BUTTONS
================================================== */

.et_pb_button,
.dwe_mini_cart_buttons .et_pb_button {
    box-sizing: border-box;

    background-color: #333333;
    color: #ffffff !important;

    font-family: "TT Wellingtons Medium", Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 500;

    text-transform: uppercase;
    text-decoration: none !important;

    border: 0;
    border-radius: 2px;

    transition:
        background-color 0.25s ease,
        color 0.25s ease;
}

.et_pb_button:hover,
.dwe_mini_cart_buttons .et_pb_button:hover {
    background-color: #666666;
    color: #ffffff !important;
}

.dwe_mini_cart_buttons .dwe_mini_cart_checkout_button {
    border: 3px solid #d5c28f;
    background-color: #333333;
    color: #d5c28f !important;
}


/* ==================================================
   8. CHATHELP / WHATSAPP
================================================== */

/*
 * No active ChatHelp overrides are currently required.
 *
 * Add plugin-specific styling here only after confirming
 * the rendered ChatHelp selectors on this site.
 */


/* ==================================================
   9. WOOCOMMERCE LAYOUT STABILITY
================================================== */

html {
    overflow-anchor: none;
    scroll-behavior: auto;
}

.woocommerce-shop {
    overflow-anchor: none;
}

.woocommerce ul.products {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: stretch;
}

.woocommerce ul.products li.product {
    display: flex;
    flex: 1 1 260px;
    flex-direction: column;

    min-height: 420px;
}

/*
 * Restrict the stable square ratio to the primary
 * WooCommerce product image link only.
 */
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link {
    display: block;
}

.woocommerce ul.products li.product
a.woocommerce-LoopProduct-link
img {
    display: block !important;

    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;

    object-fit: cover !important;

    background-color: #f2f2f2;
}

#main-header {
    position: relative;
    z-index: 9999;
}

/* ==================================================
   9a. CFP — SINGLE PRODUCT WISHLIST POSITION
================================================== */

.single-product form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 18px;
    row-gap: 12px;
}

/* Keep quantity and basket button on the first row */
.single-product form.cart .quantity,
.single-product form.cart .single_add_to_cart_button {
    flex: 0 0 auto;
}

/* Place the wishlist on its own row */
.single-product form.cart .yith-wcwl-add-to-wishlist,
.single-product form.cart .tinv-wraper,
.single-product form.cart .woosw-wishlist,
.single-product form.cart .woosw-btn,
.single-product form.cart .dwe-wishlist,
.single-product form.cart .et_pb_wishlist {
    flex: 0 0 100%;
    width: 100%;
    margin: 0 !important;
    text-align: left;
}


/* ==================================================
   10. WOOCOMMERCE WISHLIST
================================================== */

.dwe_add_to_wishlist_button svg path {
    fill: transparent !important;
    stroke: #d5c28f !important;
    stroke-width: 20;
}

.dwe_add_to_wishlist_button.wishlisted svg path,
.dwe_add_to_wishlist_button.wishlisted svg path[fill],
.dwe_add_to_wishlist_button.wishlisted svg path[style],
.dwe_add_to_wishlist_button.wishlisted svg * {
    fill: #d5c28f !important;
    stroke: #d5c28f !important;
}


/* ==================================================
   11. RESPONSIVE ADJUSTMENTS
================================================== */

@media (max-width: 767px) {
    .cfp-form-container {
        max-width: 100%;
    }

    .cfp-universal-form {
        gap: 14px;
    }

    .cfp-universal-form input[type="text"],
    .cfp-universal-form input[type="email"],
    .cfp-universal-form input[type="tel"],
    .cfp-universal-form input[type="number"],
    .cfp-universal-form input[type="date"],
    .cfp-universal-form select,
    .cfp-universal-form textarea {
        font-size: 16px;
    }

    .pum-container .et_bloom_form_container {
        padding: 20px !important;
    }

    .pum-container .et_bloom_form_text h2 {
        font-size: 23px;
    }

    .woocommerce ul.products {
        gap: 16px;
    }

    .woocommerce ul.products li.product {
        flex-basis: 100%;
    }
}


/*==================================================*/
/* 12. DIVI / ACCORDION FIXES                       */
/*==================================================*/

.page-id-16259 .cfp-form-container p,
.pum-container .cfp-universal-form p {
    margin: 0 !important;
}

.page-id-16259 .cfp-form-container p + p {
    margin-top: 0 !important;
}

.pum-container .cfp-universal-form br {
    display: none !important;
}

.page-id-16259 .chiac_divi_accordions .et_pb_toggle_title,
.page-id-16259 .chiac_divi_accordions .chiac_divi_accordion_item_title {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
}

.page-id-16259 .cfp-form-text h2 {
    margin-top: 30px !important;
    margin-bottom: 35px !important;
    line-height: 1.3em;
}

.page-id-16259 .cfp-form-container {
    padding-top: 20px;
}

/* ==========================================
   13. CFP Gallery – Responsive Lightbox
========================================== */

/* Desktop */
.rl-gallery-container img,
.rl-gallery img,
.rl-gallery-item img {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 68vh !important;
    margin: 0 auto;
    object-fit: contain;
}

/* Tablet */
@media (max-width: 980px) {
    .rl-gallery-container img,
    .rl-gallery img,
    .rl-gallery-item img {
        max-height: 62vh !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .rl-gallery-container img,
    .rl-gallery img,
    .rl-gallery-item img {
        max-height: 55vh !important;
    }
}

/* ==========================================
   13. CFP WooCommerce Corrections
========================================== */

/* CFP WooCommerce Stock Status */

.woocommerce div.product p.stock,
.woocommerce div.product .stock.in-stock {
    color: #d5c28f !important;
}


/* ==========================================
   CFP WooCommerce Quantity Field
========================================== */

.woocommerce div.product form.cart div.quantity input.qty {
    box-sizing: border-box !important;
    width: 80px !important;
    min-height: 60px !important;
    padding: 8px !important;
    text-align: center !important;
}


/* ===================================================
   15. CFP blog posts — constrain tall media on desktop
==================================================== */

@media (min-width: 981px) {

    body.single-post img[class*="wp-image-"],
    body.single-post video {
        display: block !important;
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: 80vh !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

}