/* =========================================================
   SlantFlow SMM - Product UI
   Scoped only to SMM product forms.
   ========================================================= */

form.cart.sf-smm-cart {
    display: block !important;
}

/*
 * WooCommerce quantity = عدد قطع المنتج.
 * في منتج SMM المنتج نفسه قطعة واحدة،
 * والكمية الفعلية بنتحكم فيها من خانة الخدمة.
 */
form.cart.sf-smm-cart > .quantity,
form.cart.sf-smm-cart .quantity:not(.sf-smm-qty-control) {
    display: none !important;
}

/* Main SMM card */
form.cart.sf-smm-cart .sf-smm-box {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;

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

    border: 1px solid rgba(148, 163, 184, .22) !important;
    border-radius: 14px !important;

    background: rgba(255,255,255,.035) !important;
    direction: rtl !important;
}

/* Rows */
form.cart.sf-smm-cart .sf-smm-row {
    display: block !important;
    width: 100% !important;
    margin: 0 0 18px !important;
}

form.cart.sf-smm-cart .sf-smm-row label {
    display: block !important;
    width: 100% !important;

    margin: 0 0 8px !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}

/* Quantity control */
form.cart.sf-smm-cart .sf-smm-qty-control {
    width: 100% !important;
    display: grid !important;

    grid-template-columns: 46px minmax(90px, 1fr) 46px !important;

    align-items: center !important;
    gap: 8px !important;

    margin: 0 !important;
}

/*
 * مهم:
 * بنقفل أي CSS من الثيم بيحوّل الرقم لشريط طويل أو عمودي.
 */
form.cart.sf-smm-cart #sf_smm_quantity {
    appearance: textfield !important;
    -moz-appearance: textfield !important;
    -webkit-appearance: none !important;

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;

    margin: 0 !important;
    padding: 0 12px !important;

    border: 1px solid rgba(148,163,184,.35) !important;
    border-radius: 9px !important;

    background: rgba(255,255,255,.06) !important;
    color: inherit !important;

    text-align: center !important;

    writing-mode: horizontal-tb !important;
    transform: none !important;

    font-size: 15px !important;
    line-height: 46px !important;
}

/* Chrome arrows off */
form.cart.sf-smm-cart #sf_smm_quantity::-webkit-inner-spin-button,
form.cart.sf-smm-cart #sf_smm_quantity::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* +/- */
form.cart.sf-smm-cart .sf-smm-plus,
form.cart.sf-smm-cart .sf-smm-minus {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;

    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;

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

    border: 1px solid rgba(148,163,184,.28) !important;
    border-radius: 9px !important;

    background: rgba(255,255,255,.07) !important;
    color: inherit !important;

    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    cursor: pointer !important;

    float: none !important;
    position: static !important;
    transform: none !important;
}

/* Target/link input */
form.cart.sf-smm-cart #sf_smm_target {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: 48px !important;
    min-height: 48px !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 10px 13px !important;

    border: 1px solid rgba(148,163,184,.35) !important;
    border-radius: 9px !important;

    background: rgba(255,255,255,.06) !important;
    color: inherit !important;

    direction: ltr !important;
    text-align: left !important;

    font-size: 14px !important;
}

/* Notes */
form.cart.sf-smm-cart .sf-smm-row small {
    display: block !important;

    margin: 7px 2px 0 !important;

    font-size: 13px !important;
    line-height: 1.7 !important;

    opacity: .68 !important;
}

/* Price rows */
form.cart.sf-smm-cart .sf-smm-summary,
form.cart.sf-smm-cart .sf-smm-total {
    width: 100% !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    box-sizing: border-box !important;

    padding: 11px 0 !important;

    border-top: 1px solid rgba(148,163,184,.16) !important;
}

form.cart.sf-smm-cart .sf-smm-summary span,
form.cart.sf-smm-cart .sf-smm-total span {
    font-size: 14px !important;
    opacity: .8 !important;
}

form.cart.sf-smm-cart .sf-smm-summary strong {
    font-size: 15px !important;
}

form.cart.sf-smm-cart .sf-smm-total strong {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #dc2626 !important;
}

/*
 * Add to cart.
 * نقفل أي height / flex stretch جاي من الثيم.
 */
form.cart.sf-smm-cart button.single_add_to_cart_button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    float: none !important;

    width: 100% !important;
    max-width: 100% !important;

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 10px 0 0 !important;
    padding: 0 20px !important;

    position: static !important;
    transform: none !important;

    border-radius: 9px !important;

    line-height: 1 !important;
    white-space: normal !important;
}

/* Error */
form.cart.sf-smm-cart .sf-smm-error {
    width: 100% !important;
    box-sizing: border-box !important;

    margin: 14px 0 !important;
    padding: 12px 14px !important;

    border-radius: 9px !important;
}

/* Mobile */
@media (max-width: 767px) {

    form.cart.sf-smm-cart .sf-smm-box {
        padding: 14px !important;
    }

    form.cart.sf-smm-cart .sf-smm-qty-control {
        grid-template-columns: 44px minmax(80px, 1fr) 44px !important;
    }

    form.cart.sf-smm-cart .sf-smm-plus,
    form.cart.sf-smm-cart .sf-smm-minus {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;

        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
    }

    form.cart.sf-smm-cart #sf_smm_quantity {
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        line-height: 44px !important;
    }
}

/* =========================================================
   SMM PRODUCT IMAGE CARD
   الكارت يبقى على قد الصورة نفسها
   ========================================================= */

.sf-smm-product-page .woocommerce-product-gallery {
    width: fit-content !important;
    max-width: 100% !important;

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

    margin: auto !important;

    align-self: center !important;

    background: transparent !important;
    overflow: visible !important;
}

.sf-smm-product-page .woocommerce-product-gallery__wrapper {
    width: fit-content !important;
    max-width: 100% !important;

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

    margin: 0 auto !important;

    background: transparent !important;
}

.sf-smm-product-page .woocommerce-product-gallery__image {
    width: fit-content !important;
    max-width: 100% !important;

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

    margin: 0 auto !important;

    background: transparent !important;
    overflow: hidden !important;

    border-radius: 18px !important;
}

.sf-smm-product-page .woocommerce-product-gallery__image > a {
    display: block !important;

    width: fit-content !important;
    max-width: 100% !important;

    height: auto !important;

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

    background: transparent !important;
}

.sf-smm-product-page
.woocommerce-product-gallery__image
img.wp-post-image,
.sf-smm-product-page
.woocommerce-product-gallery img {
    display: block !important;

    width: auto !important;
    max-width: 420px !important;

    height: auto !important;
    max-height: none !important;

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

    object-fit: contain !important;

    transform: none !important;
}

/*
 * لو الثيم عامل Stretch للعمود كله
 */
.sf-smm-product-page .product {
    align-items: center !important;
}

@media (max-width: 767px) {
    .sf-smm-product-page
    .woocommerce-product-gallery__image
    img.wp-post-image,
    .sf-smm-product-page
    .woocommerce-product-gallery img {
        max-width: 100% !important;
    }
}

/* SMM Saudi Riyal symbol */
.sf-smm-summary strong,
.sf-smm-total strong {
    display: inline-flex;
    align-items: center;
    gap: 0.28em;
}

.sf-smm-riyal-symbol {
    display: inline-block;
    width: 0.82em;
    height: 0.92em;
    object-fit: contain;
    flex: 0 0 auto;

    order: 2;

    margin-inline-start: 0.18em;
}

.sf-smm-price-value {
    direction: ltr;
    unicode-bidi: isolate;

    color: #dc2626;
}
