/* =========================================================
   EUROSPACE PUBLIC BUTTON SYSTEM V1
   One minimalist visual language for public-site actions.
   ========================================================= */

:root {
    --es-btn-height: 44px;
    --es-btn-radius: 6px;

    --es-btn-border: #6e3524;
    --es-btn-text: #6e3524;

    --es-btn-bg: #ffffff;
    --es-btn-hover: #f3eeeb;
    --es-btn-active: #ebe2dd;

    --es-btn-primary: #6e3524;
    --es-btn-primary-hover: #55291d;
    --es-btn-primary-active: #452117;

    --es-btn-font-size: 14px;
    --es-btn-font-weight: 600;
}


/* =========================================================
   SECONDARY / DEFAULT ACTION BUTTONS
   ========================================================= */

main .main-btn:not([data-callback-open]),
main a.btn:not([data-callback-open]),
main button.btn:not([data-callback-open]),

main a.button:not([data-callback-open]),
main button.button:not([data-callback-open]),

main a[class*="btn-"]:not([data-callback-open]),
main button[class*="btn-"]:not([data-callback-open]),

main a[class*="button"]:not([data-callback-open]):not(.es-home-feed-arrow):not(.es23-launcher):not(.es23-close):not(.es23-file):not(.es23-send),

main button[class*="button"]:not([data-callback-open]):not(.es-home-feed-arrow):not(.es23-launcher):not(.es23-close):not(.es23-file):not(.es23-send),

main a.es-price-v3-row__order,
main button.es-price-v3-row__order,

main a.legacy-price-order,
main button.legacy-price-order,

main a.price-order,
main button.price-order,

main a.price__order,
main button.price__order,

main a[data-price-order],
main button[data-price-order],

main a[data-order-price],
main button[data-order-price],

main a[data-inner-order-open],
main button[data-inner-order-open],

main a[href="#online-order"],
main a[href="#calculation"],

main .es-home-promo-card__more {
    display: inline-flex !important;

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

    gap: 10px !important;

    box-sizing: border-box !important;

    min-height: var(--es-btn-height) !important;
    height: var(--es-btn-height) !important;

    width: auto !important;
    min-width: 140px !important;
    max-width: none !important;

    padding:
        0
        14px !important;

    border:
        1px solid
        var(--es-btn-border) !important;

    border-radius:
        var(--es-btn-radius) !important;

    background:
        var(--es-btn-bg) !important;

    background-image:
        none !important;

    color:
        var(--es-btn-text) !important;

    box-shadow:
        none !important;

    font-size:
        var(--es-btn-font-size) !important;

    font-weight:
        var(--es-btn-font-weight) !important;

    line-height:
        1 !important;

    letter-spacing:
        0 !important;

    text-transform:
        none !important;

    text-decoration:
        none !important;

    white-space:
        nowrap !important;

    opacity:
        1 !important;

    filter:
        none !important;

    cursor:
        pointer !important;

    pointer-events:
        auto !important;

    -webkit-text-fill-color:
        var(--es-btn-text) !important;

    transition:
        background-color .14s ease,
        border-color .14s ease,
        color .14s ease !important;
}


/* Inner text / arrow / svg follows same color */

main a.es-price-v3-row__order *,
main button.es-price-v3-row__order *,

main a.legacy-price-order *,
main button.legacy-price-order *,

main a[data-price-order] *,
main button[data-price-order] *,

main a[data-order-price] *,
main button[data-order-price] *,

main a[data-inner-order-open] *,
main button[data-inner-order-open] *,

main .main-btn:not([data-callback-open]) * {
    color:
        var(--es-btn-text) !important;

    fill:
        var(--es-btn-text) !important;

    stroke:
        var(--es-btn-text) !important;

    -webkit-text-fill-color:
        var(--es-btn-text) !important;
}


/* Secondary hover */

main .main-btn:not([data-callback-open]):hover,
main a.btn:not([data-callback-open]):hover,
main button.btn:not([data-callback-open]):hover,

main a.button:not([data-callback-open]):hover,
main button.button:not([data-callback-open]):hover,

main a.es-price-v3-row__order:hover,
main button.es-price-v3-row__order:hover,

main a.legacy-price-order:hover,
main button.legacy-price-order:hover,

main a[data-price-order]:hover,
main button[data-price-order]:hover,

main a[data-order-price]:hover,
main button[data-order-price]:hover,

main a[data-inner-order-open]:hover,
main button[data-inner-order-open]:hover,

main a[href="#online-order"]:hover,
main a[href="#calculation"]:hover,

main .es-home-promo-card__more:hover {
    background:
        var(--es-btn-hover) !important;

    border-color:
        var(--es-btn-border) !important;

    color:
        var(--es-btn-text) !important;

    -webkit-text-fill-color:
        var(--es-btn-text) !important;
}


/* Secondary press */

main a.es-price-v3-row__order:active,
main button.es-price-v3-row__order:active,

main a.legacy-price-order:active,
main button.legacy-price-order:active,

main a[data-price-order]:active,
main button[data-price-order]:active,

main a[data-order-price]:active,
main button[data-order-price]:active,

main a[data-inner-order-open]:active,
main button[data-inner-order-open]:active,

main .main-btn:not([data-callback-open]):active {
    background:
        var(--es-btn-active) !important;

    transform:
        none !important;
}


/* =========================================================
   PRIMARY CALLBACK BUTTON
   Only callback / call-request action is visually dominant.
   ========================================================= */

main [data-callback-open],
main [data-inner-callback-open],

main a[href="#modalform"],
main a[href="#callback"],

main .es-callback-open,

.es-callback-submit {
    display: inline-flex !important;

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

    gap: 10px !important;

    box-sizing: border-box !important;

    min-height:
        var(--es-btn-height) !important;

    height:
        var(--es-btn-height) !important;

    width: auto !important;

    min-width:
        150px !important;

    max-width:
        none !important;

    padding:
        0
        16px !important;

    border:
        1px solid
        var(--es-btn-primary) !important;

    border-radius:
        var(--es-btn-radius) !important;

    background:
        var(--es-btn-primary) !important;

    background-image:
        none !important;

    color:
        #ffffff !important;

    box-shadow:
        none !important;

    font-size:
        var(--es-btn-font-size) !important;

    font-weight:
        var(--es-btn-font-weight) !important;

    line-height:
        1 !important;

    letter-spacing:
        0 !important;

    text-transform:
        none !important;

    text-decoration:
        none !important;

    white-space:
        nowrap !important;

    opacity:
        1 !important;

    cursor:
        pointer !important;

    -webkit-text-fill-color:
        #ffffff !important;

    transition:
        background-color .14s ease,
        border-color .14s ease !important;
}


/* All callback inner content stays white */

main [data-callback-open] *,
main [data-inner-callback-open] *,
main a[href="#modalform"] *,
main a[href="#callback"] *,
main .es-callback-open *,
.es-callback-submit * {
    color:
        #ffffff !important;

    fill:
        #ffffff !important;

    stroke:
        #ffffff !important;

    -webkit-text-fill-color:
        #ffffff !important;
}


/* Callback hover = simply darker */

main [data-callback-open]:hover,
main [data-inner-callback-open]:hover,
main a[href="#modalform"]:hover,
main a[href="#callback"]:hover,
main .es-callback-open:hover,
.es-callback-submit:hover {
    background:
        var(--es-btn-primary-hover) !important;

    border-color:
        var(--es-btn-primary-hover) !important;

    color:
        #ffffff !important;

    -webkit-text-fill-color:
        #ffffff !important;
}


/* Callback press */

main [data-callback-open]:active,
main [data-inner-callback-open]:active,
main a[href="#modalform"]:active,
main a[href="#callback"]:active,
main .es-callback-open:active,
.es-callback-submit:active {
    background:
        var(--es-btn-primary-active) !important;

    border-color:
        var(--es-btn-primary-active) !important;

    transform:
        none !important;
}


/* =========================================================
   PRICE TABLE ACTION COLUMN
   Compact but not squeezed.
   ========================================================= */

table td:last-child:has(
    > a[data-inner-order-open]
),
table td:last-child:has(
    > button[data-inner-order-open]
),
table td:last-child:has(
    > a.legacy-price-order
),
table td:last-child:has(
    > button.legacy-price-order
) {
    width:
        164px !important;

    min-width:
        164px !important;
}


/* =========================================================
   MOBILE
   Same visual system, touch-safe.
   ========================================================= */

@media (
    max-width: 640px
) {
    :root {
        --es-btn-height:
            44px;

        --es-btn-font-size:
            13px;
    }

    main .main-btn:not([data-callback-open]),
    main a.btn:not([data-callback-open]),
    main button.btn:not([data-callback-open]),

    main a.es-price-v3-row__order,
    main button.es-price-v3-row__order,

    main a.legacy-price-order,
    main button.legacy-price-order,

    main a[data-price-order],
    main button[data-price-order],

    main a[data-order-price],
    main button[data-order-price],

    main a[data-inner-order-open],
    main button[data-inner-order-open],

    main [data-callback-open],
    main [data-inner-callback-open],

    .es-callback-submit {
        min-width:
            140px !important;

        height:
            var(--es-btn-height) !important;

        min-height:
            var(--es-btn-height) !important;

        padding:
            0
            13px !important;

        border-radius:
            var(--es-btn-radius) !important;

        touch-action:
            manipulation;
    }
}
