/*
Theme Name:   Xstore child
Theme URI:    https://xstore.8theme.com
Description:  XStore is a multi-purpose theme that offers the ultimate WordPress and WooCommerce synergy, providing a comprehensive, all-in-one solution.
Author:       8theme
Author URI:   https://www.8theme.com
Template:     xstore
Version:      1.0
Text Domain:  xstore-child
Tags: e-commerce, two-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, full-width-template, threaded-comments, accessibility-ready, rtl-language-support, footer-widgets, sticky-post, theme-options, translation-ready, ecommerce, woocommerce, shop, elementor, business, corporate, blog, news, light, dark
*/
.product-details .product-title {
    margin-top: 18px;
    margin-bottom: 8px;
    text-align: center;
}

/* Mobile: tab filter gallery Review (#Review) → xuống nhiều hàng, căn giữa, hiện đủ tab
   (mỗi tab 1 dòng, không cắt chữ giữa từ) */
@media (max-width: 767px) {
    .etheme-gallery-tabs {
        flex-wrap: wrap !important;
        justify-content: center;
        gap: 8px 10px;
        row-gap: 8px;
    }
    .etheme-gallery-tabs .etheme-gallery-tab {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

/* Menu dropdown: hiệu ứng hover (nền cream ấm + chữ nâu brand) để biết đang trỏ vào */
.nav-sublist-dropdown a.item-link {
    transition: background-color .18s ease, color .18s ease, padding-left .18s ease;
    border-radius: 8px;
}
.nav-sublist-dropdown a.item-link:hover,
.nav-sublist-dropdown a.item-link:focus,
.nav-sublist-dropdown .menu-item:hover > a.item-link {
    background-color: #fdf0e3 !important;   /* cream/peach ấm theo palette */
    color: #982800 !important;              /* nâu đỏ brand */
    padding-left: 6px;                      /* nhích nhẹ khi hover */
}

/* Header: NÚT ĐĂNG NHẬP (thay cho phần hiện tên tài khoản).
   Desktop = icon + chữ "Đăng nhập"; Mobile = chỉ icon cho gọn. */
.se-header-login {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
}
.se-header-login .se-login-icon { font-size: 18px; line-height: 1; }
.se-header-login .se-login-text { display: inline; }

/* Desktop: hiển thị dạng NÚT bấm (pill brand) cho nổi bật */
@media (min-width: 768px) {
    .se-header-login {
        background: #982800 !important;
        color: #fff !important;
        padding: 13px 24px !important;   /* cao ~43px cho cân xứng với giỏ hàng */
        margin-right: 16px;              /* cách giỏ hàng ra */
        border-radius: 999px !important;
        font-weight: 700 !important;
        font-size: 14.5px !important;
        line-height: 1 !important;
        box-shadow: 0 4px 12px rgba(152, 40, 0, .22);
        transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
    }
    .se-header-login:hover,
    .se-header-login:focus {
        background: #7a2000 !important;
        color: #fff !important;
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(152, 40, 0, .30);
    }
    .se-header-login .se-login-icon { font-size: 16px; }
    .se-header-login .se-login-text { color: #fff !important; }
}

/* Mobile: ẩn chữ, chỉ để icon đăng nhập */
@media (max-width: 767px) {
    .se-header-login .se-login-text { display: none; }
    .se-header-login .se-login-icon { font-size: 20px; }

    /* Header mobile: icon account + giỏ hàng nằm CÙNG 1 HÀNG.
       Container cha (elementor-element-57279e49) đang rộng ~69px + flex-wrap:wrap
       → cart bị rớt xuống hàng 2. Cho nowrap + width auto để 2 icon nằm ngang. */
    .elementor-element-57279e49 {
        flex-wrap: nowrap !important;
        width: auto !important;
        max-width: none !important;
        column-gap: 4px;
    }
}