/* NS Elessi Toolkit - front */
.ns-elessi-additional-text{
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 1.35;
}

/* ===== Prices & units ===== */
.ns-etk-unit{
    font-size: 0.9em;
    opacity: 0.85;
    white-space: nowrap;
}

/* Multi-price list (each price on a new line) */
.ns-etk-multi-prices{
    display: block;
    line-height: 1.15;
}
.ns-etk-multi-price-item{
    display: block;
}

/* ====== Requests ("Заявки") ====== */

/*
  Important: we intentionally use !important for the modal and request button layout.
  Elessi (and other Woo themes) often have very aggressive styles that can override
  custom elements in product cards.
*/

/* Ensure the product image wrapper can host absolute-positioned elements */
.woocommerce .product-img-wrap{
    position: relative !important;
}

/* Badge placement (catalog cards): 15px from top-left over the image area */
.woocommerce .ns-elessi-request-badge-wrap{
    position: absolute !important;
    top: 15px !important;
    left: 15px !important;
    z-index: 60 !important;
    pointer-events: none !important;
}
.woocommerce .ns-elessi-request-badge-wrap .ns-elessi-request-btn{
    pointer-events: auto !important;
}

/* Base button */
.woocommerce .ns-elessi-request-btn{
    -webkit-appearance: none !important;
    appearance: none !important;
    cursor: pointer !important;
    border-radius: 12px !important;
    border: 1px solid rgba(0,0,0,0.14) !important;
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(242,242,242,1) 100%) !important;
    color: #111 !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    box-shadow: 0 10px 26px rgba(0,0,0,0.16), 0 2px 0 rgba(0,0,0,0.18) !important;
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease !important;
}

/* Catalog badge variant */
.woocommerce .ns-elessi-request-btn--badge{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    line-height: 1 !important;
}
.woocommerce .ns-elessi-request-btn--badge:hover{
    transform: translateY(-1px) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,0.18), 0 2px 0 rgba(0,0,0,0.20) !important;
}
.woocommerce .ns-elessi-request-btn--badge:active{
    transform: translateY(1px) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,0.14), 0 1px 0 rgba(0,0,0,0.18) !important;
}

/* Single product button variant */
.woocommerce .ns-elessi-request-btn--single{
    display: block !important;
    width: 100% !important;
    padding: 14px 16px !important;
    font-size: 14px !important;
    margin-top: 10px !important;
}

/* Hide original add-to-cart UI when needed (themes/plugins can output different markup). */
body.ns-elessi-requests-mode-replace .woocommerce a.add_to_cart_button,
body.ns-elessi-requests-mode-replace .woocommerce button.add_to_cart_button,
body.ns-elessi-requests-mode-replace .woocommerce a.product_type_simple,
body.ns-elessi-requests-mode-replace .woocommerce a.product_type_variable,
body.ns-elessi-requests-mode-replace .woocommerce a.add-to-cart-grid,
body.ns-elessi-requests-mode-replace .woocommerce .add-to-cart-grid,
body.ns-elessi-requests-mode-replace .woocommerce .single_add_to_cart_button,
body.ns-elessi-requests-mode-replace .woocommerce .clickBuyButton,
body.ns-elessi-requests-mode-replace .woocommerce form.cart,
body.ns-theme-requests-mode-replace .woocommerce a.add_to_cart_button,
body.ns-theme-requests-mode-replace .woocommerce button.add_to_cart_button,
body.ns-theme-requests-mode-replace .woocommerce a.product_type_simple,
body.ns-theme-requests-mode-replace .woocommerce a.product_type_variable,
body.ns-theme-requests-mode-replace .woocommerce a.add-to-cart-grid,
body.ns-theme-requests-mode-replace .woocommerce .add-to-cart-grid,
body.ns-theme-requests-mode-replace .woocommerce .single_add_to_cart_button,
body.ns-theme-requests-mode-replace .woocommerce .clickBuyButton,
body.ns-theme-requests-mode-replace .woocommerce form.cart,
body.ns-elessi-requests-mode-hide .woocommerce a.add_to_cart_button,
body.ns-elessi-requests-mode-hide .woocommerce button.add_to_cart_button,
body.ns-elessi-requests-mode-hide .woocommerce a.product_type_simple,
body.ns-elessi-requests-mode-hide .woocommerce a.product_type_variable,
body.ns-elessi-requests-mode-hide .woocommerce a.add-to-cart-grid,
body.ns-elessi-requests-mode-hide .woocommerce .add-to-cart-grid,
body.ns-elessi-requests-mode-hide .woocommerce .single_add_to_cart_button,
body.ns-elessi-requests-mode-hide .woocommerce .clickBuyButton,
body.ns-elessi-requests-mode-hide .woocommerce form.cart,
body.ns-theme-requests-mode-hide .woocommerce a.add_to_cart_button,
body.ns-theme-requests-mode-hide .woocommerce button.add_to_cart_button,
body.ns-theme-requests-mode-hide .woocommerce a.product_type_simple,
body.ns-theme-requests-mode-hide .woocommerce a.product_type_variable,
body.ns-theme-requests-mode-hide .woocommerce a.add-to-cart-grid,
body.ns-theme-requests-mode-hide .woocommerce .add-to-cart-grid,
body.ns-theme-requests-mode-hide .woocommerce .single_add_to_cart_button,
body.ns-theme-requests-mode-hide .woocommerce .clickBuyButton,
body.ns-theme-requests-mode-hide .woocommerce form.cart{
    display: none !important;
}

/* In hide mode, also hide our request UI (in case a page was cached). */
body.ns-elessi-requests-mode-hide .ns-elessi-request-badge-wrap,
body.ns-theme-requests-mode-hide .ns-elessi-request-badge-wrap,
body.ns-elessi-requests-mode-hide .ns-elessi-request-single-wrap,
body.ns-theme-requests-mode-hide .ns-elessi-request-single-wrap{
    display: none !important;
}

/* ===== Modal ===== */

#ns-elessi-requests-modal.ns-elessi-requests-modal{
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
}

#ns-elessi-requests-modal.ns-elessi-requests-modal.is-open{
    display: flex !important;
}

#ns-elessi-requests-modal .ns-elessi-requests-modal__overlay{
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.62) !important;
}

#ns-elessi-requests-modal .ns-elessi-requests-modal__panel{
    position: relative !important;
    z-index: 1 !important;
    /* Requested: modal width <= 600px, responsive on any device */
    width: min(600px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
    background: #f7f7f8 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 18px 60px rgba(0,0,0,0.35) !important;
    display: flex !important;
    flex-direction: column !important;
}

#ns-elessi-requests-modal .ns-elessi-requests-modal__close{
    position: absolute !important;
    right: 10px !important;
    top: 10px !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(0,0,0,0.12) !important;
    background: #f7f7f8 !important;
    color: #111 !important;
    cursor: pointer !important;
    line-height: 1 !important;
    font-size: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#ns-elessi-requests-modal .ns-elessi-requests-modal__close-svg{
    display: block !important;
}

#ns-elessi-requests-modal .ns-elessi-requests-modal__content{
    padding: 16px !important;
    overflow: auto !important;
    /* Scroll inside the modal (not the page) on tall forms */
    max-height: calc(100vh - 48px) !important;
    flex: 1 1 auto !important;

    /* Center the injected form / shortcode content */
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
}

/* Ensure the first-level content is centered and fits inside the 600px panel */
#ns-elessi-requests-modal .ns-elessi-requests-modal__content > *{
    width: 100% !important;
    max-width: 560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Explicit centering for common form roots (DSTRC Simple Forms and generic forms) */
#ns-elessi-requests-modal .ns-elessi-requests-modal__content .sfz-form,
#ns-elessi-requests-modal .ns-elessi-requests-modal__content .dsf-form,
#ns-elessi-requests-modal .ns-elessi-requests-modal__content > form{
    margin-left: auto !important;
    margin-right: auto !important;
}

body.ns-elessi-requests-modal-open{overflow: hidden !important;}

@media (max-width: 480px){
    #ns-elessi-requests-modal .ns-elessi-requests-modal__content{padding: 12px !important;}
}
