/* =========================================================
   MOTOX - 01 GLOBAL
   Tokens màu, global, thông báo Woo, side menu, hệ thống cửa hàng,
   nút mua trang sản phẩm, form liên hệ.
   Load: TOÀN SITE (các file khác dùng biến --mx-* ở đây)
   ========================================================= */

:root {
    --mx-red: #D52927;
    --mx-red-dark: #a51f1d;
    --mx-ink: #111;
    --mx-text: #2b2b2b;
    --mx-muted: #6b6b6b;
    --mx-line: #e3e3e3;
    --mx-field: #d4d4d4;
    --mx-soft: #f6f6f5;
    --mx-r: 4px;
}

/* ---------- GLOBAL ---------- */
body {
    background-repeat: no-repeat !important;
}

main {
    background: #fff;
}

/* Ảnh có title: không hiện tooltip / chặn tương tác trực tiếp lên ảnh */
img[title] {
    pointer-events: none;
}

/* Fix chiều cao slide (post 677) */
.elementor-677 .elementor-element.elementor-element-1669c6a .swiper-slide > .elementor-element {
    height: auto !important;
}

/* ---------- THÔNG BÁO WOO ---------- */
div.woocommerce-message,
div.woocommerce-message:focus-visible {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    margin: 0 0 24px;
    padding: 14px 18px !important;
    background: var(--mx-soft) !important;
    border: 0 !important;
    border-left: 2px solid var(--mx-ink) !important;
    border-radius: 0;
    color: var(--mx-text);
    font-weight: 500;
    outline: none !important;
}

div.woocommerce-message::before {
    display: none;
}

div.woocommerce-message .button,
div.woocommerce-message a.wc-forward {
    order: 2;
    margin-left: auto !important;
    padding: 10px 20px !important;
    background: var(--mx-ink) !important;
    border: 0 !important;
    border-radius: var(--mx-r) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .1em;
    text-transform: uppercase;
    transition: background-color .15s ease;
}

div.woocommerce-message .button:hover,
div.woocommerce-message a.wc-forward:hover {
    background: var(--mx-red) !important;
}

/* ---------- SIDE MENU ---------- */
.side-menu .elementor-heading-title {
    color: #fff !important;
}

.side-menu .e-con-inner {
    flex-direction: row !important;
    align-items: center !important;
}

.side-menu .elementor-loop-container .e-con-inner img {
    filter: invert(1);
}

.side-menu .elementor-loop-container .e-con-inner > div {
    min-width: 40px;
    text-align: left;
}

/* ---------- HỆ THỐNG CỬA HÀNG ---------- */
.htch-wrapper {
    position: sticky;
    top: 80px;
}

/* ---------- NÚT MUA (trang sản phẩm) ---------- */
.e-atc-qty-button-holder {
    display: flex !important;
    flex-direction: column;
    gap: 15px;
}

.hvn-buttons-group {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: 100%;
}

.hvn-buttons-group .single_add_to_cart_button {
    flex: 1;
    width: 50%;
    margin: 0 !important;
    justify-content: center;
    text-align: center;
}

.id_buy_now_button {
    background-color: var(--mx-red) !important;
    border: none !important;
    color: #fff !important;
    transition: background-color .15s ease;
}

.id_buy_now_button:hover {
    background-color: var(--mx-red-dark) !important;
}

@media (max-width: 500px) {
    .hvn-buttons-group {
        flex-wrap: wrap;
    }
}

/* ---------- FORM LIÊN HỆ (Fluent Form) ---------- */
#fluentform_1 fieldset .ff-btn-submit {
    background-color: var(--mx-ink);
    border-radius: var(--mx-r);
    transition: background-color .15s ease;
}

#fluentform_1 fieldset .ff-btn-submit:hover {
    background-color: var(--mx-red);
}