/* =========================================================
   Minimalist Journeys Global Button System

   File:
   /wp-content/themes/divi-child/css/minjourneys-button.css

   Purpose:
   Centralise button styling for buttons that are generated by Divi,
   Fluent Forms, TablePress Styler, WooCommerce, Divi Tabs Maker and
   Minimalist Journeys custom shortcodes/templates.

   Functionality:
   - Applies one consistent visual button style across supported button classes.
   - Uses the Minimalist Journeys CTA colours: #F64658 for normal state and #F76A79 for hover/focus state.
   - Keeps TablePress button links from being overridden by generic TablePress link styles.
   - Keeps WooCommerce product-card CTA alignment separate from visual button styling.
   - Keeps compact button sizing for header/search contexts.
   - Removes references to the legacy custom product-review button class.

   Integration:
   - Must be enqueued after Divi, Fluent Forms, TablePress Styler, WooCommerce,
     Divi Tabs Maker and other child-theme CSS files.
   - Divi-controlled buttons should continue to use .et_pb_button where possible.
   - Minimalist Journeys custom shortcode/product-review buttons should use:
       .minjourneys-shop-button
       .minjourneys-shop-learn-more-button
       .minjourneys-shop-buy-now-button
       .minjourneys-product-filter
   - The existing .learn-more and .buy-now selectors remain temporarily within
     .resources-container so current shortcode output keeps working until the
     PHP template is renamed fully.

   Notes:
   - Uses older WordPress/cPanel-friendly CSS syntax.
   - Avoids CSS variables and :is() because some hosting editors flag them.
   - Plugin-generated classes such as .tps_button, .dvmd_tps_button,
     .ff-btn-submit and .pac_dtm-label are retained because they are not
     Minimalist Journeys custom classes.
   - Do not add broad selectors such as a.button or button globally; that could
     affect checkout, account, admin or plugin controls unexpectedly.

   Added/Updated by OpenAI on 03 July 2026
   ========================================================= */

/* =========================================================
   1. Shared visual button treatment
   ---------------------------------------------------------
   These selectors define the temporary orange test style for known
   front-end CTA buttons. Keep this list deliberate and scoped.
   ========================================================= */
.et_pb_button,
.minjourneys_button,
.minjourneys-product-filter,
.tps_button,
.dvmd_tps_button,
.fluentform .ff-btn-submit,
.ff-btn.ff-btn-submit.minjourneys_button,
.div-more-info a.btn-more-info,
.div-buy-now a.btn-buy-now,
.resources-container .minjourneys-shop-button,
.resources-container .minjourneys-shop-learn-more-button,
.resources-container .minjourneys-shop-buy-now-button,
.resources-container .learn-more,
.resources-container .buy-now,
.single-product .summary .button,
.single-product .summary .single_add_to_cart_button,
.single-product .summary .wc-product-retailers-product-button,
.single-product .summary .wc-product-retailers a,
.single-product .summary .wc-product-retailers button,
.single-product .summary .product-retailers a,
.single-product .summary .product-retailers button,
.tabs-maker-background .tt_tabs_navigation.pac_dtm-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;

    min-height: 48px !important;
    padding: 10px 22px !important;

    background-color: #F64658 !important;
    border: 2px solid #F64658 !important;
    border-radius: 50px !important;

    color: #ffffff !important;
    font-family: inherit !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    white-space: normal !important;

    cursor: pointer !important;
    box-shadow: none !important;
    transition: all 0.2s ease-in-out !important;
}

/* =========================================================
   2. Shared hover and focus state
   ---------------------------------------------------------
   During testing, hover/focus intentionally remains orange.
   When switching back to production colours, normal state should
   use #F64658 and hover/focus should use #F76A79.
   ========================================================= */
.et_pb_button:hover,
.et_pb_button:focus,
.minjourneys_button:hover,
.minjourneys_button:focus,
.minjourneys-product-filter:hover,
.minjourneys-product-filter:focus,
.tps_button:hover,
.tps_button:focus,
.dvmd_tps_button:hover,
.dvmd_tps_button:focus,
.fluentform .ff-btn-submit:hover,
.fluentform .ff-btn-submit:focus,
.ff-btn.ff-btn-submit.minjourneys_button:hover,
.ff-btn.ff-btn-submit.minjourneys_button:focus,
.div-more-info a.btn-more-info:hover,
.div-more-info a.btn-more-info:focus,
.div-buy-now a.btn-buy-now:hover,
.div-buy-now a.btn-buy-now:focus,
.resources-container .minjourneys-shop-button:hover,
.resources-container .minjourneys-shop-button:focus,
.resources-container .minjourneys-shop-learn-more-button:hover,
.resources-container .minjourneys-shop-learn-more-button:focus,
.resources-container .minjourneys-shop-buy-now-button:hover,
.resources-container .minjourneys-shop-buy-now-button:focus,
.resources-container .learn-more:hover,
.resources-container .learn-more:focus,
.resources-container .buy-now:hover,
.resources-container .buy-now:focus,
.single-product .summary .button:hover,
.single-product .summary .button:focus,
.single-product .summary .single_add_to_cart_button:hover,
.single-product .summary .single_add_to_cart_button:focus,
.single-product .summary .wc-product-retailers-product-button:hover,
.single-product .summary .wc-product-retailers-product-button:focus,
.single-product .summary .wc-product-retailers a:hover,
.single-product .summary .wc-product-retailers a:focus,
.single-product .summary .wc-product-retailers button:hover,
.single-product .summary .wc-product-retailers button:focus,
.single-product .summary .product-retailers a:hover,
.single-product .summary .product-retailers a:focus,
.single-product .summary .product-retailers button:hover,
.single-product .summary .product-retailers button:focus,
.tabs-maker-background .tt_tabs_navigation.pac_dtm-label:hover,
.tabs-maker-background .tt_tabs_navigation.pac_dtm-label:focus,
.tabs-maker-background .pac_dtm_active_tab .tt_tabs_navigation.pac_dtm-label {
    background-color: #F76A79 !important;
    border-color: #F76A79 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* =========================================================
   3. Keyboard accessibility
   ---------------------------------------------------------
   Provides a clear focus outline for keyboard users. This does
   not replace browser focus behaviour; it standardises it for
   the buttons controlled by this file.
   ========================================================= */
.et_pb_button:focus,
.minjourneys_button:focus,
.minjourneys-product-filter:focus,
.tps_button:focus,
.dvmd_tps_button:focus,
.fluentform .ff-btn-submit:focus,
.ff-btn.ff-btn-submit.minjourneys_button:focus,
.div-more-info a.btn-more-info:focus,
.div-buy-now a.btn-buy-now:focus,
.resources-container .minjourneys-shop-button:focus,
.resources-container .minjourneys-shop-learn-more-button:focus,
.resources-container .minjourneys-shop-buy-now-button:focus,
.resources-container .learn-more:focus,
.resources-container .buy-now:focus,
.single-product .summary .button:focus,
.single-product .summary .single_add_to_cart_button:focus,
.single-product .summary .wc-product-retailers-product-button:focus,
.single-product .summary .wc-product-retailers a:focus,
.single-product .summary .wc-product-retailers button:focus,
.single-product .summary .product-retailers a:focus,
.single-product .summary .product-retailers button:focus,
.tabs-maker-background .tt_tabs_navigation.pac_dtm-label:focus {
    outline: 2px solid #F64658 !important;
    outline-offset: 3px !important;
}

/* =========================================================
   4. Luggage and organisation filter buttons
   ---------------------------------------------------------
   Used by the custom luggage and organisation filter shortcode.
   The shortcode action buttons use `.et_pb_button.minjourneys-product-filter`
   so they inherit the global button system without using broad
   site-wide button selectors.

   Normal:
   - #F64658 background and border.

   Hover/focus:
   - #F76A79 background and border.

   The `.is-active` and `[aria-pressed="true"]` selectors remain available
   for future filter buttons that may need a persistent selected state.

   Added/Updated by OpenAI on 03 July 2026
   ========================================================= */
.et_pb_button.minjourneys-product-filter,
.minjourneys-product-filter {
    background-color: #F64658 !important;
    border-color: #F64658 !important;
    color: #ffffff !important;
}

.et_pb_button.minjourneys-product-filter:hover,
.et_pb_button.minjourneys-product-filter:focus,
.minjourneys-product-filter:hover,
.minjourneys-product-filter:focus,
.et_pb_button.minjourneys-product-filter.is-active,
.minjourneys-product-filter.is-active,
.et_pb_button.minjourneys-product-filter[aria-pressed="true"],
.minjourneys-product-filter[aria-pressed="true"],
.et_pb_button.minjourneys-product-filter.is-active:hover,
.et_pb_button.minjourneys-product-filter.is-active:focus,
.minjourneys-product-filter.is-active:hover,
.minjourneys-product-filter.is-active:focus,
.et_pb_button.minjourneys-product-filter[aria-pressed="true"]:hover,
.et_pb_button.minjourneys-product-filter[aria-pressed="true"]:focus,
.minjourneys-product-filter[aria-pressed="true"]:hover,
.minjourneys-product-filter[aria-pressed="true"]:focus {
    background-color: #F76A79 !important;
    border-color: #F76A79 !important;
    color: #ffffff !important;
}

/* =========================================================
   5. TablePress button protection
   ---------------------------------------------------------
   TablePress tables have separate link styling. These selectors
   ensure TablePress Styler buttons and Divi-style buttons remain
   visually button-like inside table cells.
   ========================================================= */
.tablepress a.tps_button,
.tablepress .tps_button,
.tablepress a.dvmd_tps_button,
.tablepress .dvmd_tps_button,
.tablepress a.et_pb_button,
.tablepress .et_pb_button {
    color: #ffffff !important;
    text-decoration: none !important;
    width: auto !important;
    min-width: 120px !important;
}

.tablepress td a.tps_button,
.tablepress td .tps_button,
.tablepress td a.dvmd_tps_button,
.tablepress td .dvmd_tps_button,
.tablepress td a.et_pb_button,
.tablepress td .et_pb_button {
    padding: 8px 14px !important;
    font-size: 16px !important;
    line-height: 1.15 !important;
}

.tablepress td.column-4,
.tablepress th.column-4 {
    text-align: center !important;
    vertical-align: middle !important;
}

/* =========================================================
   6. WooCommerce product-card button alignment
   ---------------------------------------------------------
   Visual styling is handled by the shared treatment above.
   These rules only keep product-card CTA containers centred.
   ========================================================= */
.div-more-info,
.div-buy-now {
    text-align: center !important;
}

.div-more-info a.btn-more-info,
.div-buy-now a.btn-buy-now {
    display: inline-flex !important;
}

/* =========================================================
   7. Product-review shortcode link protection
   ---------------------------------------------------------
   Product-review blocks can wrap buttons inside links. These rules
   prevent wrapper links from adding underlines or unexpected link colours.
   ========================================================= */
.resources-container a {
    text-decoration: none !important;
}

.resources-container a:hover,
.resources-container a:focus {
    text-decoration: none !important;
}

/* =========================================================
   8. WooCommerce single-product button protection
   ---------------------------------------------------------
   Single product pages may output CTAs through WooCommerce or the
   WooCommerce Product Retailers plugin. These rules are scoped to
   the single-product summary area to avoid checkout/account buttons.
   ========================================================= */
.single-product .summary .button,
.single-product .summary .single_add_to_cart_button,
.single-product .summary .wc-product-retailers-product-button,
.single-product .summary .wc-product-retailers a,
.single-product .summary .wc-product-retailers button,
.single-product .summary .product-retailers a,
.single-product .summary .product-retailers button {
    width: auto !important;
}

/* =========================================================
   9. Divi Tabs Maker homepage pill buttons
   ---------------------------------------------------------
   The homepage Latest Posts and Popular Posts sections use Divi
   Tabs Maker. The wrapper class `tabs-maker-background` is set in:
   Divi Tabs Maker Settings > Advanced > CSS ID & Classes.

   The parent reset removes the plugin's original pill background so
   the visible style comes from .tt_tabs_navigation.pac_dtm-label only.
   ========================================================= */
.tabs-maker-background .pac_dtm_tabnav-tab,
.tabs-maker-background .pac_dtm_title_subtitle,
.tabs-maker-background .pac_dtm_active_tab,
.tabs-maker-background .pac_dtm_tabnav-tab.pac_dtm_active_tab {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* =========================================================
   10. Owl Carousel arrow protection
   ---------------------------------------------------------
   Prevents carousel previous/next arrows from being styled as CTA
   buttons where they appear inside homepage or product sliders.
   ========================================================= */
.latest-post-tabs button.owl-prev,
.latest-post-tabs button.owl-next,
.latest-post-wrapper button.owl-prev,
.latest-post-wrapper button.owl-next,
.popular-post-wrapper button.owl-prev,
.popular-post-wrapper button.owl-next,
.popular-maker-background button.owl-prev,
.popular-maker-background button.owl-next,
.recommended-products-slider button.owl-prev,
.recommended-products-slider button.owl-next {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* =========================================================
   11. Compact button contexts
   ---------------------------------------------------------
   Header search/article-shop buttons need to remain smaller than
   normal content CTAs, especially on tablet and desktop headers.
   ========================================================= */
header .article-shop-button-wrap button.et_pb_button,
header .product-search-btns .minjourneys_button,
.search-btns-col .search-btns {
    min-height: 40px !important;
    padding: 8px 18px !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
}

/* =========================================================
   12. Mobile adjustments
   ---------------------------------------------------------
   Reduces button height, padding and font size on narrow screens.
   TablePress buttons receive separate sizing because they sit inside
   constrained table columns.
   ========================================================= */
@media screen and (max-width: 767px) {
    .et_pb_button,
    .minjourneys_button,
    .minjourneys-product-filter,
    .tps_button,
    .dvmd_tps_button,
    .fluentform .ff-btn-submit,
    .ff-btn.ff-btn-submit.minjourneys_button,
    .div-more-info a.btn-more-info,
    .div-buy-now a.btn-buy-now,
    .resources-container .minjourneys-shop-button,
    .resources-container .minjourneys-shop-learn-more-button,
    .resources-container .minjourneys-shop-buy-now-button,
    .resources-container .learn-more,
    .resources-container .buy-now,
    .single-product .summary .button,
    .single-product .summary .single_add_to_cart_button,
    .single-product .summary .wc-product-retailers-product-button,
    .single-product .summary .wc-product-retailers a,
    .single-product .summary .wc-product-retailers button,
    .single-product .summary .product-retailers a,
    .single-product .summary .product-retailers button,
    .tabs-maker-background .tt_tabs_navigation.pac_dtm-label {
        min-height: 44px !important;
        padding: 9px 18px !important;
        font-size: 16px !important;
    }

    .tablepress td a.tps_button,
    .tablepress td .tps_button,
    .tablepress td a.dvmd_tps_button,
    .tablepress td .dvmd_tps_button,
    .tablepress td a.et_pb_button,
    .tablepress td .et_pb_button {
        min-width: 100px !important;
        padding: 8px 12px !important;
        font-size: 16px !important;
    }
}