/*
    THEME RAPHA v2 (báo giá giao diện 22/10/2026 - hạng mục 1)
    Bám theo ảnh mẫu: nền kem có cành lá mờ, header trắng, thẻ sản phẩm trắng bo tròn,
    giá xanh lá đậm, nút "Mua ngay" vàng đồng, footer kem có cành lá.
    Nạp SAU CÙNG trong layout nên chỉ ghi đè, không sửa các file CSS cũ.
    Bỏ dòng <link> nạp file này là quay về giao diện cũ.
*/
:root {
    --rp-green: #1B5E3F;
    --rp-green-dark: #134630;
    --rp-green-soft: #2E7A55;
    --rp-cream: #F6F4EC;
    --rp-cream-2: #EFECE1;
    --rp-paper: #FFFFFF;
    /* 31/10/2026: vàng đồng đậm nhẹ (#B88F56 -> #A57E48) để chữ trắng trên nút đạt độ tương phản 3.7 (trước 2.96) */
    --rp-gold: #A57E48;
    --rp-gold-dark: #8A6532;
    --rp-gold-soft: #E9DCC6;
    --rp-sage: #D6E5D0;
    --rp-sage-text: #2F6B4B;
    --rp-gray: #6B7280;
    --rp-line: #E7E3D6;
    --rp-text: #1E2A23;
    --rp-radius: 14px;
    --rp-radius-lg: 20px;
    --rp-shadow: 0 2px 6px rgba(30, 42, 35, .04), 0 8px 24px rgba(30, 42, 35, .06);
    --rp-shadow-hover: 0 4px 10px rgba(30, 42, 35, .06), 0 16px 36px rgba(30, 42, 35, .10);
    --rp-font: 'Be Vietnam Pro', 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --rp-font-title: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --rp-leaf: url(../images/theme/leaf-branch.svg);
    --rp-leaf-soft: url(../images/theme/leaf-soft.svg);
}

/* =========================================================
   1. NỀN, CHỮ
   ========================================================= */
html body,
body,
.wrapper {
    font-family: var(--rp-font);
    color: var(--rp-text);
    background-color: var(--rp-cream);
    -webkit-font-smoothing: antialiased;
}
body {
    /* Cành lá mờ ở hai mép trang, đứng yên khi cuộn như ảnh mẫu */
    background-image: var(--rp-leaf-soft), var(--rp-leaf-soft);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 380px auto, 420px auto;
    background-position: left -120px top 140px, right -140px bottom -60px;
}
.wrapper { background-color: transparent; }
main, .service-section, .bannner-section, .block-news,
.deal-of-day-section, .deal-of-day-section.flash-sale { background: transparent !important; }
h1, h2, h3, h4, h5, h6, p, a, span, li, input, button, select, textarea {
    font-family: var(--rp-font);
}
a { transition: color .2s ease; }
a:hover { color: var(--rp-green); }

/* =========================================================
   2. HEADER
   ========================================================= */
.site-header,
.menu-top-area { background: var(--rp-green) !important; }
.menu-top-area { font-size: 13px; }
.menu-top-area,
.menu-top-area a,
.menu-top-area span,
.menu-top-area i { color: rgba(255, 255, 255, .92) !important; }

.site-header .topbar {
    background-color: var(--rp-paper) !important;
    background-image: var(--rp-leaf-soft), var(--rp-leaf-soft);
    background-repeat: no-repeat;
    background-size: 210px auto, 210px auto;
    background-position: left -60px top -50px, right -70px bottom -90px;
    border-bottom: 1px solid var(--rp-line);
}
.site-header .topbar img[src*="logo"] { max-height: 76px; width: auto; }

/* Ô tìm kiếm dạng viên thuốc */
#header_search_form {
    border: 1.5px solid #D9D5C7 !important;
    border-radius: 999px !important;
    overflow: hidden;
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
#header_search_form:focus-within {
    border-color: var(--rp-green) !important;
    box-shadow: 0 0 0 4px rgba(27, 94, 63, .08);
}
#header_search_form input,
#header_search_form .form-control { border: 0 !important; box-shadow: none !important; background: transparent; }
#header_search_form button,
#header_search_form .btn { background: transparent !important; color: var(--rp-green) !important; }

/* Điện thoại / Đăng nhập / Giỏ hàng */
.site-header .toolbar .toolbar-item > a > div i,
.site-header .topbar .hotline-text a,
.site-header .topbar .text-label,
.site-header .toolbar .toolbar-item > a > div > .text-label {
    color: var(--rp-green) !important;
}
.site-header .toolbar .toolbar-item > a > div > .text-label,
.site-header .topbar .hotline-text a { font-weight: 500; font-size: 14px; }
.site-header .count,
.site-header .cart-count,
a.btn-carts {
    background: var(--rp-gold) !important;
    color: #fff !important;
}

/* Thanh menu: một dải trắng liền (bản gốc có thêm khối xám bo góc .nav-inner nằm giữa -> lệch màu) */
.site-header .navbar {
    background: var(--rp-paper) !important;
    border-top: 1px solid var(--rp-line);
    border-bottom: 1px solid var(--rp-line);
    box-shadow: 0 6px 18px rgba(30, 42, 35, .04);
}
.site-header .navbar .nav-inner {
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.site-header .site-menu > ul > li a {
    color: var(--rp-text) !important;
    font-weight: 500;
    font-size: 14.5px;
    letter-spacing: .3px;
    position: relative;
}
.site-header .site-menu > ul > li > a::after {
    content: "";
    position: absolute;
    left: 50%; right: 50%; bottom: 6px;
    height: 2px;
    background: var(--rp-green);
    border-radius: 2px;
    transition: left .25s ease, right .25s ease;
}
.site-header .site-menu > ul > li:hover > a,
.site-header .site-menu > ul > li.active > a { color: var(--rp-green) !important; }
.site-header .site-menu > ul > li:hover > a::after,
.site-header .site-menu > ul > li.active > a::after { left: 18%; right: 18%; }

/* =========================================================
   3. BANNER + Ô ƯU ĐIỂM
   ========================================================= */
.slideshow .slideshow__img,
.slideshow .slideshow__img img,
.slideshow-list .slideshow__img img,
.bannner-section img {
    border-radius: var(--rp-radius-lg) !important;
    overflow: hidden;
}
.slideshow { padding-top: 22px; }

.service-section { padding: 22px 0 8px !important; }
.service-section .single-service {
    background: var(--rp-paper) !important;
    border: 1px solid var(--rp-line) !important;
    border-radius: var(--rp-radius) !important;
    box-shadow: var(--rp-shadow) !important;
    padding: 16px 18px !important;
    transition: transform .2s ease, box-shadow .2s ease;
}
.service-section .single-service:hover { transform: translateY(-2px); box-shadow: var(--rp-shadow-hover) !important; }
/* Vòng tròn sage phía sau icon (vẽ riêng vì bộ lọc màu bên dưới sẽ tô cả nền của ảnh) */
.service-section .single-service { position: relative; }
.service-section .single-service::before {
    content: "";
    position: absolute;
    left: 18px; top: 50%;
    width: 62px; height: 62px;
    margin-top: -31px;
    border-radius: 50%;
    background: var(--rp-sage);
}
.service-section .single-service img {
    position: relative;
    z-index: 1;
    width: 42px !important; height: 42px !important;
    margin: 0 10px !important;
    padding: 0 !important;
    background: none !important;
    object-fit: contain;
    /* Icon gốc màu đỏ: lọc về xanh lá thương hiệu */
    filter: brightness(0) saturate(100%) invert(27%) sepia(37%) saturate(780%) hue-rotate(100deg) brightness(92%) contrast(92%);
}
.service-section .single-service h3,
.service-section .single-service h4,
.service-section .single-service .title {
    color: var(--rp-green) !important;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .2px;
}
.service-section .single-service p { color: var(--rp-gray) !important; font-size: 13px; }
/* Màn hình <= 992px: bản gốc xếp icon ở trên, chữ ở dưới (giữa ô) -> vòng tròn theo icon */
@media (max-width: 992px) {
    .service-section .single-service::before {
        left: 50%; top: 7px;
        margin-left: -31px; margin-top: 0;
    }
    /* chừa khoảng dưới icon để chữ không đè lên vòng tròn */
    .service-section .single-service img { margin: 0 0 18px !important; }
    .service-section .single-service.single-service2 .content { margin-left: 0; text-align: center; }
}

/* =========================================================
   4. TIÊU ĐỀ KHỐI (thay thanh xanh + ruy-băng vàng cũ)
   ========================================================= */
.deal-of-day-section .group-title,
.section-title,
.box-hedding-title-block .section-title {
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    justify-content: center;
    text-align: center;
    padding: 6px 0 18px !important;
    position: relative;
    margin-bottom: 8px;
}
.deal-of-day-section .group-title p,
.deal-of-day-section .group-title .tt-up,
.section-title h2,
.section-title .h3 {
    font-family: var(--rp-font-title) !important;
    color: var(--rp-green) !important;
    font-size: 30px !important;
    font-weight: 700 !important;
    text-transform: none !important;
    letter-spacing: .2px;
    background: none !important;
    margin: 0 !important;
    padding: 0 !important;
    -webkit-text-fill-color: currentColor;
    text-shadow: none !important;
    line-height: 1.25;
}
.section-title h2::before { display: none !important; }
/* Gạch chân vàng đồng + chấm lá dưới tiêu đề */
.deal-of-day-section .group-title::after,
.section-title::after {
    content: "";
    position: absolute;
    left: 50%; bottom: 4px;
    width: 64px; height: 3px;
    margin-left: -32px;
    border-radius: 3px;
    background: linear-gradient(90deg, transparent, var(--rp-gold) 20%, var(--rp-gold) 80%, transparent);
}

/* Khối "Sản phẩm nổi bật": bỏ mảng xanh đậm, để nền sáng */
.box_flash {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 28px 0 10px !important;
}

/* =========================================================
   5. THẺ SẢN PHẨM (theo ảnh mẫu)
   ========================================================= */
.product-card {
    background: var(--rp-paper) !important;
    border: 1px solid var(--rp-line) !important;
    border-radius: var(--rp-radius-lg) !important;
    box-shadow: var(--rp-shadow) !important;
    overflow: hidden;
    padding: 12px 12px 14px !important;
    transition: box-shadow .25s ease, transform .25s ease;
}
.product-card:hover { box-shadow: var(--rp-shadow-hover) !important; transform: translateY(-3px); }
.product-card .product-thumb {
    border-radius: var(--rp-radius) !important;
    overflow: hidden;
    background: var(--rp-cream);
}
.product-card .product-thumb img { border-radius: var(--rp-radius) !important; }
.product-card .product-card-body { padding: 14px 4px 4px !important; }
.product-card .product-title,
.product-card .product-title a {
    color: var(--rp-text) !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 1.4;
    text-align: center;
}
.product-card .product-title a:hover { color: var(--rp-green) !important; }
.product-card .product-category,
.product-card .product-category a { color: var(--rp-gray) !important; font-size: 12px; }

/* Nút nhanh trên ảnh (link / xem ảnh / thêm giỏ) */
.product-card .product-button-group .product-button {
    background: rgba(255, 255, 255, .95) !important;
    color: var(--rp-green) !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}
.product-card .product-button-group .product-button:hover { background: var(--rp-green) !important; color: #fff !important; }
.product-card .product-button-group .product-button i { color: inherit !important; }

/* Nhãn HOT: viên thuốc vàng đồng như ảnh mẫu */
.hot-badge {
    background: rgba(156, 118, 67, .92) !important;
    border-radius: 999px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    letter-spacing: .6px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .18) !important;
    top: 10px !important; left: 10px !important;
}

/* Khối giá: số to xanh đậm, bỏ khung viền */
.product-card .product-price { margin: 6px 0 0 !important; }
.pd-wrap.pd-compact .pd-box {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 2px 0 0 !important;
}
.pd-wrap.pd-plain .pd-single,
.pd-wrap .pd-final {
    color: var(--rp-green-dark) !important;
    font-weight: 700 !important;
    font-size: 24px !important;
    letter-spacing: -.2px;
}
.pd-wrap .pd-vat-only,
.pd-wrap .pd-vat {
    color: var(--rp-gray) !important;
    font-size: 12px !important;
}
.pd-wrap .pd-badge,
.pd-badge--inline,
.pd-badge--community {
    background: var(--rp-sage) !important;
    color: var(--rp-sage-text) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-weight: 600;
}

/* =========================================================
   6. NÚT BẤM
   ========================================================= */
.btn, button, input[type="submit"],
.featured-buy-now, a.buy-now button, .btn-orange, .btn-contacts,
.btn-web--primary, .primary-btn, .layout-product .button_actions .btn,
.timhieuthem a, a.more-gioithieu {
    border-radius: 999px !important;
    transition: background-color .2s ease, box-shadow .2s ease, transform .1s ease, color .2s ease;
}
/* Nút chính: vàng đồng, đổi sang xanh khi trỏ */
.featured-buy-now, a.buy-now button, .btn-orange, .btn-contacts,
.btn-web--primary, .primary-btn, .layout-product .button_actions .btn {
    background: var(--rp-gold) !important;
    border: 1px solid var(--rp-gold) !important;
    color: #fff !important;
    font-weight: 600 !important;
    box-shadow: 0 6px 16px rgba(184, 143, 86, .28);
}
.featured-buy-now:hover, a.buy-now button:hover, .btn-orange:hover, .btn-contacts:hover,
.btn-web--primary:hover, .primary-btn:hover, .layout-product .button_actions .btn:hover {
    background: var(--rp-green) !important;
    border-color: var(--rp-green) !important;
    box-shadow: 0 6px 16px rgba(27, 94, 63, .25);
}
.featured-buy-now:active, .btn-web--primary:active { transform: translateY(1px); }

/* Nút "Mua ngay" trong thẻ sản phẩm: icon giỏ + chữ + mũi tên */
.featured-buy-now {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 14px 4px 0 !important;
    padding: 12px 18px !important;
    font-size: 15px !important;
    letter-spacing: .2px;
    text-transform: none !important;
}
.featured-buy-now .fa-chevron-right { font-size: 11px; opacity: .85; transition: transform .2s ease; }
.featured-buy-now:hover .fa-chevron-right { transform: translateX(3px); }

/* Nút viền phụ (Xem thêm, Tìm hiểu thêm) */
.timhieuthem a, a.more-gioithieu, .block-news .btn, .block-news a.btn-more {
    background: transparent !important;
    border: 1.5px solid var(--rp-green) !important;
    color: var(--rp-green) !important;
    box-shadow: none !important;
}
.timhieuthem a:hover, a.more-gioithieu:hover { background: var(--rp-green) !important; color: #fff !important; }

/* =========================================================
   7. TIN TỨC
   ========================================================= */
.block-news { padding: 24px 0 36px; }
.block-news .slick-blog-news { background: transparent !important; }
.block-news .item-blog-news .item {
    background: var(--rp-paper) !important;
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-lg) !important;
    box-shadow: var(--rp-shadow);
    overflow: hidden;
    transition: box-shadow .25s ease, transform .25s ease;
}
.block-news .item-blog-news .item:hover { box-shadow: var(--rp-shadow-hover); transform: translateY(-3px); }
.block-news .item-blog-news .image-post img { border-radius: 0 !important; }
.block-news .item-blog-news h3,
.block-news .item-blog-news h3 a { color: var(--rp-text) !important; font-weight: 600 !important; }
.block-news .item-blog-news h3 a:hover { color: var(--rp-green) !important; }

/* =========================================================
   8. FOOTER
   ========================================================= */
.site-footer {
    background-color: var(--rp-cream-2) !important;
    background-image: var(--rp-leaf-soft), var(--rp-leaf-soft);
    background-repeat: no-repeat;
    background-size: 300px auto, 260px auto;
    background-position: left -80px bottom -90px, right -60px top -60px;
    border-top: 1px solid var(--rp-line);
}
.site-footer .widget,
.site-footer a,
.site-footer p,
.site-footer span { color: #3B4740 !important; }
.site-footer .widget-title {
    color: var(--rp-green) !important;
    font-weight: 700 !important;
    letter-spacing: .4px;
    border-bottom: 1px solid var(--rp-gold-soft) !important;
    padding-bottom: 10px;
}
.site-footer a:hover { color: var(--rp-green) !important; }
.site-footer input[type="email"],
.site-footer input[type="text"] {
    border-radius: 999px 0 0 999px !important;
    border: 1px solid #D9D5C7 !important;
    background: #fff !important;
    padding-left: 16px !important;
}
.site-footer .push-btn,
.site-footer form button {
    background: var(--rp-gold) !important;
    border-color: var(--rp-gold) !important;
    color: #fff !important;
    border-radius: 0 999px 999px 0 !important;
    font-weight: 600;
}
.site-footer .push-btn:hover,
.site-footer form button:hover { background: var(--rp-green) !important; border-color: var(--rp-green) !important; }
.site-footer .footer-social-links a {
    background: var(--rp-green) !important;
    border-radius: 50% !important;
}
.site-footer .footer-social-links a:hover { background: var(--rp-gold) !important; }
.site-footer .footer-social-links a i { color: #fff !important; }

/* =========================================================
   9. MÀN HÌNH HẸP
   ========================================================= */
@media (max-width: 991px) {
    body { background-size: 220px auto, 240px auto; }
    .deal-of-day-section .group-title p,
    .deal-of-day-section .group-title .tt-up,
    .section-title h2, .section-title .h3 { font-size: 24px !important; }
}
@media (max-width: 575px) {
    .site-header .topbar { background-size: 120px auto, 120px auto; }
    .pd-wrap.pd-plain .pd-single, .pd-wrap .pd-final { font-size: 20px !important; }
    .featured-buy-now { padding: 10px 14px !important; font-size: 14px !important; }
}


/* =========================================================
   10. ĐIỆN THOẠI: header, thanh menu dưới, danh sách sản phẩm
   ========================================================= */
/* Giá không bao giờ bị ngắt giữa số */
.pd-wrap .pd-single, .pd-wrap .pd-final, .pd-wrap .pd-old { white-space: nowrap; }

/* Header điện thoại: nền trắng như bản máy tính (bản gốc vàng #ffde59) */
section.header-mobile {
    background: var(--rp-paper) !important;
    border-bottom: 1px solid var(--rp-line);
    box-shadow: 0 2px 12px rgba(30, 42, 35, .05);
    padding: 8px 0 !important;
}
.header-mobile .icon-mav-mobile svg path { stroke: var(--rp-green) !important; }
.header-mobile .cart-icon > i { color: var(--rp-green) !important; }
.header-mobile .count-label { background: var(--rp-gold) !important; color: #fff !important; }
.logo-menu-logo { background: var(--rp-cream) !important; border-bottom: 1px solid var(--rp-line); }
.hoso-user ul li:hover { background: var(--rp-sage) !important; }

/* Thanh menu dưới: chữ 1 dòng, gọn */
.tab-menu-mobile {
    background: var(--rp-green-dark) !important;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -4px 18px rgba(0, 0, 0, .12);
}
.tab-menu-mobile .items-tabs-menu-mobile p {
    font-size: 11px !important;
    white-space: nowrap;
    margin: 2px 0 0 !important;
    line-height: 1.2;
}

/* Nút "Mua ngay" ở thẻ trang danh sách sản phẩm */
.product-card .pl-buy {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    margin-top: 10px; width: 100%;
    padding: 9px 14px; border-radius: 999px;
    background: var(--rp-gold) !important; color: #fff !important;
    font-weight: 600; font-size: 14px;
    transition: background .2s ease;
}
.product-card .pl-buy:hover { background: var(--rp-gold-dark) !important; }
.product-card .pl-buy .fa-chevron-right { font-size: 11px; }

/* Danh sách sản phẩm trên điện thoại: mỗi dòng 1 thẻ nằm ngang (ảnh trái, thông tin phải) */
@media (max-width: 575px) {
    .wrap-list-product .popular-category-slider .row > .clm { --w-xs: 12 !important; }
    .wrap-list-product .product-card {
        display: flex; align-items: center; gap: 12px;
        padding: 10px !important;
        margin-bottom: 12px;
    }
    .wrap-list-product .product-card .product-thumb { flex: 0 0 40%; max-width: 40%; }
    .wrap-list-product .product-card .product-button-group { display: none !important; }
    .wrap-list-product .product-card .product-card-body {
        flex: 1; min-width: 0;
        padding: 0 !important;
        text-align: left;
    }
    .wrap-list-product .product-card .product-title,
    .wrap-list-product .product-card .product-title a {
        text-align: left !important;
        font-size: 14px !important;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    }
    .wrap-list-product .pd-wrap, .wrap-list-product .pd-box, .wrap-list-product .pd-single { text-align: left !important; justify-content: flex-start !important; }
    .wrap-list-product .pd-wrap.pd-plain .pd-single, .wrap-list-product .pd-wrap .pd-final { font-size: 18px !important; }
    .wrap-list-product .product-card .pl-buy { width: auto; padding: 7px 16px; font-size: 13px; }

    /* 4 ô ưu điểm trên trang chủ: gọn hơn */
    .service-section .single-service { padding: 14px 10px !important; }
    .service-section .single-service.single-service2 .content h6 { font-size: 13px !important; }
    .service-section .single-service p {
        font-size: 12px !important;
        display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    }
}

/* Nền trang con (sản phẩm, tin tức, chi tiết...): bản gốc dùng dải trắng (đường dẫn) + nền xám
   -> cho trong suốt để lộ nền kem có cành lá như trang chủ */
.content-wrapper > .main,
.main { background: transparent !important; }
.breadcrumbs {
    background: transparent !important;
    border-bottom: 0 !important;
}
.breadcrumbs a, .breadcrumbs li, .breadcrumbs span { color: var(--rp-gray) !important; }
.breadcrumbs a:hover { color: var(--rp-green) !important; }
.content-wrapper { background: transparent !important; }
.breadcrumbs *:not(a):not(i) { background-color: transparent !important; }

/* Tiêu đề trang danh sách (Sản phẩm, Tin tức...): chữ có chân + lá nhỏ + gạch vàng đồng, như trang chủ */
.rp-page-title {
    text-align: center;
    margin: 18px 0 22px !important;
    font-family: var(--rp-font-title) !important;
    font-style: italic;
    font-weight: 700 !important;
    font-size: 34px !important;
    color: var(--rp-green) !important;
    line-height: 1.25;
}
.rp-page-title span { position: relative; display: inline-block; padding: 0 34px 12px; }
.rp-page-title span::before {
    content: ""; position: absolute; right: 0; top: 2px; width: 26px; height: 26px;
    background: var(--rp-leaf) no-repeat center / contain; opacity: .85;
}
.rp-page-title span::after {
    content: ""; position: absolute; left: 50%; bottom: 0; width: 64px; height: 3px; margin-left: -32px;
    border-radius: 3px; background: var(--rp-gold);
}
@media (max-width: 575px) { .rp-page-title { font-size: 26px !important; margin: 8px 0 16px !important; } }

/* Thẻ bài viết ở trang Tin tức: giống thẻ tin ở trang chủ (ảnh trên, tiêu đề + tóm tắt dưới) */
.template-detail .blog-post {
    display: block;
    background: var(--rp-paper);
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow);
    overflow: hidden;
    margin-bottom: 24px;
    transition: box-shadow .25s ease, transform .25s ease;
}
.template-detail .blog-post:hover { box-shadow: var(--rp-shadow-hover); transform: translateY(-3px); }
.template-detail .blog-post .post-thumb { border-radius: 0 !important; overflow: hidden; aspect-ratio: 4 / 3; }
.template-detail .blog-post .post-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.template-detail .blog-post:hover .post-thumb img { transform: scale(1.04); }
.template-detail .blog-post .post-body { padding: 14px 16px 16px !important; background: transparent !important; }
.template-detail .blog-post .post-title {
    position: static !important;
    background: none !important;
    color: var(--rp-text) !important;
    font-size: 15.5px !important; font-weight: 700 !important; line-height: 1.45;
    padding: 0 !important; margin: 0 0 8px !important;
    white-space: normal !important;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.template-detail .blog-post:hover .post-title { color: var(--rp-green) !important; }
.template-detail .blog-post p {
    color: var(--rp-gray) !important; font-size: 13.5px; line-height: 1.6; margin: 0;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.template-detail .blog-post .post-title { height: auto !important; max-height: none !important; min-height: 0 !important; text-align: left !important; }
.template-detail .blog-post p { border: 0 !important; padding: 0 !important; text-align: left !important; }
/* Tiêu đề khối "Tin tức nổi bật" cùng kiểu chữ nghiêng với "Sản phẩm nổi bật" */
.section-title h2, .section-title .h3 { font-style: italic; }

/* =========================================================
   11. TRANG CHI TIẾT SẢN PHẨM: số lượng + 2 nút mua, khung mô tả
   ========================================================= */
.model-content-details .layout-product .flex-quantity {
    display: flex !important; flex-wrap: wrap; align-items: center; gap: 14px 16px;
}
.model-content-details .custom-btn-number { display: flex !important; align-items: center; gap: 12px; margin: 0 !important; }
.model-content-details .custom-btn-number label { margin: 0 !important; font-weight: 600; color: var(--rp-text); }
.model-content-details .input_number_product {
    display: inline-flex !important; align-items: center;
    border: 1.5px solid var(--rp-line); border-radius: 999px; overflow: hidden; background: #fff;
}
.model-content-details .input_number_product .btn_num {
    width: 40px !important; height: 40px !important; border: 0 !important; border-radius: 0 !important;
    background: transparent !important; color: var(--rp-green) !important; font-size: 18px !important; line-height: 1;
}
.model-content-details .input_number_product .btn_num:hover { background: var(--rp-sage) !important; }
.model-content-details .input_number_product input.prd_quantity {
    width: 48px !important; height: 40px !important; border: 0 !important; box-shadow: none !important;
    text-align: center; font-weight: 600; padding: 0 !important; background: transparent;
}
.model-content-details .btn-mua {
    display: flex !important; gap: 12px; flex: 1 1 100%; margin: 0 !important; float: none !important;
}
.model-content-details .btn-mua > a { flex: 1; display: block; margin: 0 !important; float: none !important; }
.model-content-details .btn-mua > a > button {
    width: 100% !important; height: 50px !important; margin: 0 !important;
    border-radius: 999px !important; font-weight: 700 !important; font-size: 15px !important;
    display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
    text-transform: none !important; box-shadow: none !important;
    transition: background .2s ease, color .2s ease, transform .1s ease;
}
.model-content-details .btn-mua > a > button:active { transform: translateY(1px); }
/* Thêm vào giỏ: viền xanh */
.model-content-details .btn-mua a.add-to-cart > button {
    background: #fff !important; color: var(--rp-green) !important; border: 2px solid var(--rp-green) !important;
}
.model-content-details .btn-mua a.add-to-cart > button svg path { fill: var(--rp-green) !important; }
.model-content-details .btn-mua a.add-to-cart > button:hover { background: var(--rp-sage) !important; }
/* Mua ngay: nền vàng đồng */
.model-content-details .btn-mua a.buy-now > button {
    background: var(--rp-gold) !important; color: #fff !important; border: 2px solid var(--rp-gold) !important;
}
.model-content-details .btn-mua a.buy-now > button:hover { background: var(--rp-gold-dark) !important; border-color: var(--rp-gold-dark) !important; }
.model-content-details .btn-mua .txt-main { color: inherit !important; }
@media (max-width: 575px) {
    .model-content-details .btn-mua > a > button { height: 46px !important; font-size: 14px !important; }
}

/* Khối giá ở trang chi tiết: rộng hết cột, nền kem nhẹ */
.model-content-details .pd-wrap.pd-full { max-width: none !important; width: 100%; }
.model-content-details .pd-wrap.pd-full .pd-box {
    background: #FBF8F1 !important; border: 1px solid var(--rp-gold-soft) !important; border-radius: var(--rp-radius) !important;
    padding: 12px 16px !important;
}

/* Phần "Thông tin chi tiết / Tìm hiểu thêm": đặt trong khung trắng bo tròn */
.tabs-products-details > .ctnr {
    background: var(--rp-paper);
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow);
    padding: 22px 28px 26px !important;
    margin-top: 26px; margin-bottom: 30px;
}
.tabs-products-details .box-tabs-detailss { border-bottom: 1px solid var(--rp-line) !important; margin-bottom: 18px; }
.tabs-products-details .tablinks {
    background: transparent !important; border: 0 !important; border-radius: 0 !important;
    color: var(--rp-gray) !important; font-weight: 600 !important; padding: 10px 4px !important; margin-right: 22px;
    position: relative;
}
.tabs-products-details .tablinks.active { color: var(--rp-green) !important; }
.tabs-products-details .tablinks.active::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; border-radius: 3px; background: var(--rp-green);
}
@media (max-width: 575px) {
    .tabs-products-details > .ctnr { padding: 16px 14px 18px !important; border-radius: var(--rp-radius); }
}
@media (max-width: 575px) {
    /* Điện thoại: 2 nút xếp dọc, "Mua ngay" lên trên */
    .model-content-details .btn-mua { flex-direction: column-reverse; gap: 10px; }
    .model-content-details .btn-mua > a > button { white-space: nowrap; }
    /* Thanh tab: cuộn ngang nhưng ẩn thanh cuộn */
    .tabs-products-details .box-tabs-detailss {
        display: flex; overflow-x: auto; white-space: nowrap;
        scrollbar-width: none; -ms-overflow-style: none;
    }
    .tabs-products-details .box-tabs-detailss::-webkit-scrollbar { display: none; }
    .tabs-products-details .tablinks { font-size: 13.5px !important; margin-right: 16px; flex: 0 0 auto; }
}

/* =========================================================
   12. GIỎ HÀNG
   ========================================================= */
.cart-page .table-carts {
    background: var(--rp-paper);
    border: 1px solid var(--rp-line);
    border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow);
    padding: 8px 18px 0;
    margin-top: 16px;
}
.cart-page .table-carts .table-carts { background: none; border: 0; box-shadow: none; padding: 0; margin: 0; }
.cart-page .cart-headers { border-bottom: 1px solid var(--rp-line) !important; color: var(--rp-gray); font-weight: 600; background: transparent !important; }
.cart-page .item-cart-bodys { border-bottom: 1px solid var(--rp-line) !important; padding: 14px 0 !important; background: transparent !important; }
.cart-page .item-cart-bodys:last-child { border-bottom: 0 !important; }
.cart-page .product-item .product-thumb img { border-radius: 12px; border: 1px solid var(--rp-line); background: var(--rp-cream); }
.cart-page .product-item .product-title, .cart-page .product-item .product-title a {
    color: var(--rp-text) !important; font-weight: 600 !important; font-size: 15px !important; line-height: 1.4;
}
.cart-page .item-price, .cart-page .div-chiet-khau + div { color: var(--rp-green-dark) !important; font-weight: 700 !important; }
.cart-page .item-chiet-khau, .cart-page .div-chiet-khau { color: #B5543C !important; font-size: 13px !important; }
.cart-page .old_price { color: var(--rp-gray); font-weight: 400; font-size: 12px; }
.cart-page .qtySelector {
    display: inline-flex !important; align-items: center; border: 1.5px solid var(--rp-line) !important;
    border-radius: 999px !important; overflow: hidden; background: #fff;
}
.cart-page .qtySelector span { width: 32px; height: 32px; display: inline-flex !important; align-items: center; justify-content: center;
    color: var(--rp-green) !important; background: transparent !important; border: 0 !important; cursor: pointer; font-size: 11px; }
.cart-page .qtySelector span:hover { background: var(--rp-sage) !important; }
.cart-page .qtySelector input { width: 36px !important; height: 32px !important; border: 0 !important; text-align: center; font-weight: 600; padding: 0 !important; box-shadow: none !important; }
.cart-page .remove-from-cart { color: var(--rp-gray) !important; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.cart-page .remove-from-cart:hover { background: #F6E3DE; color: #B5543C !important; }
.cart-page .btton-cart-clear { background: transparent !important; color: var(--rp-gray) !important; border: 1px solid var(--rp-line) !important; border-radius: 999px !important; }
.cart-page .cart-total {
    display: flex; justify-content: space-between; align-items: baseline;
    border-top: 1px dashed var(--rp-line); margin: 0 -18px; padding: 16px 18px;
    background: #FBF8F1; border-radius: 0 0 var(--rp-radius-lg) var(--rp-radius-lg);
}
.cart-page .cart-total span { color: var(--rp-text); font-weight: 600; }
.cart-page .cart-total strong { color: var(--rp-green-dark); font-size: 22px; font-weight: 800; }
.cart-page .alert-warning {
    background: var(--rp-sage) !important; border: 0 !important; color: var(--rp-sage-text) !important;
    border-radius: var(--rp-radius) !important; font-size: 14px;
}
.cart-page .cart-next-steps { gap: 12px; }
.cart-page .cart-next-steps .btn {
    display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
    height: 48px; padding: 0 24px !important; border-radius: 999px !important;
    font-weight: 700 !important; font-size: 15px !important; box-shadow: none !important;
}
.cart-page .cart-next-steps .btn-cart-blade { background: #fff !important; color: var(--rp-green) !important; border: 2px solid var(--rp-green) !important; }
.cart-page .cart-next-steps .btn-cart-blade:hover { background: var(--rp-sage) !important; }
.cart-page .cart-next-steps .button-contrues { background: var(--rp-gold) !important; color: #fff !important; border: 2px solid var(--rp-gold) !important; }
.cart-page .cart-next-steps .button-contrues:hover { background: var(--rp-gold-dark) !important; border-color: var(--rp-gold-dark) !important; }
.cart-page .cart-next-steps .btn i, .cart-page .cart-next-steps .btn span { color: inherit !important; margin: 0 !important; }
@media (max-width: 767px) {
    .cart-page .table-carts { padding: 4px 14px 0; }
    .cart-page .cart-total { margin: 0 -14px; padding: 14px; }
    .cart-page .product-item { display: flex !important; gap: 12px; align-items: flex-start; }
    .cart-page .product-item .product-thumb { flex: 0 0 72px; }
    .cart-page .product-item .product-thumb img { width: 72px; height: 72px; object-fit: cover; }
    .cart-page .product-item .product-info { flex: 1; min-width: 0; }
    .cart-page .cart-mobile { display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 8px; }
    .cart-page .cart-mobile .item-price { margin-left: auto; font-size: 16px !important; }
    .cart-page .cart-mobile .text-right { position: absolute; top: 10px; right: 0; }
    .cart-page .item-cart-bodys, .cart-page .table-tr-items { position: relative; }
    .cart-page .product-item .product-title { padding-right: 28px; font-size: 14.5px !important; }
    /* Nút: xếp dọc, "Tiến hành thanh toán" lên trên */
    .cart-page .cart-next-steps { flex-direction: column-reverse !important; }
    .cart-page .cart-next-steps .btn { width: 100%; }
}

/* =========================================================
   13. TRANG CHỦ ĐIỆN THOẠI: cân lại 4 ô ưu điểm + khoảng cách
   ========================================================= */
@media (max-width: 575px) {
    .service-section { padding: 16px 0 0 !important; }
    .service-section .row { margin-left: -6px !important; margin-right: -6px !important; }
    .service-section .row > .clm { padding-left: 6px !important; padding-right: 6px !important; margin-bottom: 12px !important; }
    .service-section .single-service {
        justify-content: flex-start !important;   /* căn trên: icon cùng một hàng ở mọi ô */
        height: 100%;
        padding: 14px 10px 12px !important;
    }
    .service-section .single-service.single-service2 .content { width: 100%; }
    .service-section .single-service.single-service2 .content h6 {
        min-height: 2.7em;                         /* tiêu đề luôn chiếm 2 dòng -> mô tả thẳng hàng */
        display: flex; align-items: center; justify-content: center;
        line-height: 1.35; margin-bottom: 4px !important;
    }
    .service-section .single-service p { -webkit-line-clamp: 2; line-height: 1.45; }
    .deal-of-day-section { padding-top: 6px !important; margin-top: 0 !important; }
    .deal-of-day-section .group-title { padding-top: 0 !important; margin-bottom: 4px; }
}
/* Bảng giỏ hàng máy tính: bỏ kẻ ô + nền xám của bản gốc */
.cart-page .cart-headers, .cart-page .cart-headers > div,
.cart-page .item-cart-bodys, .cart-page .item-cart-bodys > div,
.cart-page .table-tr-items { border-left: 0 !important; border-right: 0 !important; border-top: 0 !important; background: transparent !important; }
.cart-page .cart-headers > div, .cart-page .item-cart-bodys > div { border-bottom: 0 !important; }
.cart-page .cart-headers { font-size: 13px; text-transform: uppercase; letter-spacing: .4px; padding: 12px 0 !important; }
.cart-page .ck-none { color: #C9C4B5; }
@media (max-width: 767px) {
    /* Giỏ hàng điện thoại: các ô trong hàng số lượng/giá co theo nội dung, giá không tràn */
    .cart-page .cart-mobile > div { width: auto !important; flex: 0 0 auto !important; max-width: none !important; padding: 0 !important; }
    .cart-page .cart-mobile .item-price { margin-left: auto !important; white-space: nowrap; }
    .cart-page .table-carts { overflow: hidden; }
}
@media (max-width: 575px) {
    .service-section .single-service p { -webkit-line-clamp: 3; }
}

/* =========================================================
   14. HEADER MÁY TÍNH (thiết kế lại 26/10)
   ========================================================= */
/* Thanh trên cùng: xanh đậm, chữ nhỏ, icon vàng đồng */
.site-header .menu-top-area { background: var(--rp-green-dark) !important; padding: 7px 0 !important; font-size: 12.5px !important; }
.site-header .menu-top-area .t-m-s-a { gap: 22px; }
.site-header .menu-top-area i, .site-header .menu-top-area svg { color: var(--rp-gold-soft) !important; fill: var(--rp-gold-soft) !important; }
.site-header .menu-top-area a, .site-header .menu-top-area span, .site-header .menu-top-area li { color: rgba(255, 255, 255, .88) !important; letter-spacing: .2px; }
.site-header .menu-top-area a:hover { color: #fff !important; }

/* Hàng logo – tìm kiếm – tiện ích */
.site-header .topbar { padding: 12px 0 !important; }
.site-header .topbar .d-flex.js-between { align-items: center; gap: 32px; }
.site-header .site-logo img, .site-header .topbar img[src*="logo"] { max-height: 74px !important; width: auto; }
.site-header .search-box-wrap { flex: 1; max-width: 520px; }
#header_search_form {
    display: flex !important; flex-wrap: nowrap; align-items: center;
    height: 48px; padding: 4px !important;
    background: #F6F4EC !important; border: 1.5px solid transparent !important;
}
#header_search_form:focus-within { background: #fff !important; }
#header_search_form .input-group-btn { order: 2; display: flex; }
#header_search_form input { order: 1; height: 38px !important; padding-left: 18px !important; font-size: 14.5px; }
#header_search_form button {
    width: 40px; height: 40px; border-radius: 50% !important;
    background: var(--rp-green) !important; color: #fff !important; border: 0 !important;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .2s ease;
}
#header_search_form button i { color: #fff !important; font-size: 14px; }
#header_search_form button:hover { background: var(--rp-green-dark) !important; }

.site-header .toolbar { display: flex; align-items: center; gap: 26px; }
.site-header .toolbar .toolbar-item > a > .flec-user {
    display: flex !important; flex-direction: row !important; align-items: center; gap: 10px; text-align: left;
}
.site-header .toolbar .toolbar-item .cart-icon {
    position: relative;
    width: 44px; height: 44px; border-radius: 50%;
    background: var(--rp-sage); display: inline-flex !important; align-items: center; justify-content: center;
    margin: 0 !important; transition: background .2s ease;
}
.site-header .toolbar .toolbar-item .cart-icon i { color: var(--rp-green) !important; font-size: 17px !important; margin: 0 !important; }
.site-header .toolbar .toolbar-item:hover .cart-icon { background: var(--rp-green); }
.site-header .toolbar .toolbar-item:hover .cart-icon i { color: #fff !important; }
.site-header .toolbar .toolbar-item .count-label {
    position: absolute; top: -3px; right: -4px; min-width: 19px; height: 19px; padding: 0 5px;
    border-radius: 999px; background: var(--rp-gold) !important; color: #fff !important;
    font-size: 11px; font-weight: 700; line-height: 19px; text-align: center; border: 2px solid #fff;
}
.site-header .toolbar .toolbar-item > a > div > .text-label {
    display: flex !important; flex-direction: column; line-height: 1.25;
    color: var(--rp-text) !important; font-weight: 700 !important; font-size: 14.5px !important;
    margin: 0 !important; white-space: nowrap;
}
.site-header .toolbar .text-label small { color: var(--rp-gray); font-weight: 500; font-size: 12px; }
/* Đã đăng nhập: ảnh đại diện + tên */
.site-header .toolbar .profile-login > a { display: flex !important; align-items: center; gap: 10px; }
.site-header .toolbar .item-avart-login img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 2px solid var(--rp-sage); }
.site-header .toolbar .name-profile-usear p { margin: 0; font-weight: 700; color: var(--rp-text) !important; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Thanh menu */
.site-header .navbar { padding: 0 !important; }
.site-header .site-menu > ul { display: flex !important; justify-content: space-between; width: 100%; margin: 0; }
.site-header .navbar .nav-inner { width: 100%; }
.site-header .site-menu > ul > li > a {
    display: block; padding: 15px 6px !important;
    font-size: 14px !important; font-weight: 600 !important; letter-spacing: .5px; text-transform: uppercase;
    color: var(--rp-text) !important;
}
.site-header .site-menu > ul > li > a::after { bottom: 8px !important; height: 2px; background: var(--rp-gold) !important; }
.site-header .site-menu > ul > li:hover > a::after,
.site-header .site-menu > ul > li.active > a::after { left: 6px !important; right: 6px !important; }
.site-header .site-menu > ul > li.active > a { color: var(--rp-green) !important; }
.site-header .t-h-dropdown-menu {
    border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius) !important;
    box-shadow: var(--rp-shadow-hover) !important; padding: 8px !important; background: #fff !important;
}
.site-header .t-h-dropdown-menu a { border-radius: 8px; padding: 9px 12px !important; color: var(--rp-text) !important; }
.site-header .t-h-dropdown-menu a:hover { background: var(--rp-sage) !important; color: var(--rp-green) !important; }
/* Menu dính khi cuộn: có bóng nhẹ */
.site-header.navbar-stuck, .site-header.sticky { box-shadow: 0 6px 20px rgba(30, 42, 35, .08); }

/* =========================================================
   15. FOOTER (thiết kế lại 26/10): xanh đậm, 4 cột gọn, dải bản quyền
   ========================================================= */
.site-footer.rp-footer {
    background-color: var(--rp-green-dark) !important;
    background-image: var(--rp-leaf-soft), var(--rp-leaf-soft) !important;
    background-repeat: no-repeat; background-size: 280px auto, 240px auto;
    background-position: left -90px bottom -110px, right -70px top -80px;
    border-top: 0 !important; padding: 0 !important; margin-top: 40px;
}
.rp-footer .footer { padding: 46px 0 30px !important; background: transparent !important; }
.rp-footer .rp-footer-grid {
    display: grid; grid-template-columns: 1.05fr 1.9fr 1fr 1.55fr; gap: 36px; align-items: start;
}
.rp-footer, .rp-footer p, .rp-footer span, .rp-footer li, .rp-footer a, .rp-footer .widget { color: rgba(255, 255, 255, .82) !important; }
.rp-footer a:hover { color: #fff !important; }
.rp-footer .widget { margin: 0 !important; padding: 0 !important; }
.rp-footer .widget-title {
    color: var(--rp-gold-soft) !important; font-size: 14px !important; font-weight: 700 !important;
    letter-spacing: 1px; text-transform: uppercase; margin: 0 0 16px !important;
    border-bottom: 0 !important; padding: 0 0 10px !important; position: relative;
}
.rp-footer .widget-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 2px; border-radius: 2px; background: var(--rp-gold); }

/* Cột 1: logo trên ô kem, khẩu hiệu, mạng xã hội, Bộ Công Thương */
.rp-footer .rp-f-brand .logo_footer {
    display: inline-flex; padding: 12px 16px; border-radius: 16px; background: #FAF8F2;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
}
.rp-footer .rp-f-brand .logo_footer img { height: 70px; width: auto; }
.rp-footer .rp-f-tagline { margin: 14px 0 12px !important; font-family: var(--rp-font-title); font-style: italic; font-size: 16px; color: #fff !important; }
.rp-footer .footer-social-links { display: flex; gap: 10px; margin: 0 0 14px !important; }
.rp-footer .footer-social-links a {
    width: 36px; height: 36px; border-radius: 50% !important; display: inline-flex !important; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, .1) !important; border: 1px solid rgba(255, 255, 255, .18); margin: 0 !important;
    transition: background .2s ease;
}
.rp-footer .footer-social-links a:hover { background: var(--rp-gold) !important; border-color: var(--rp-gold); }
.rp-footer .footer-social-links a i, .rp-footer .footer-social-links a span { color: #fff !important; }
.rp-footer .rp-f-bct img { max-width: 140px; height: auto; display: block; }

/* Cột 2: thông tin công ty – gọn, bỏ định dạng chữ dán từ Word */
.rp-footer .rp-f-company .footer-content h3 {
    color: #fff !important; font-size: 15px !important; font-weight: 700 !important; margin: 0 0 8px !important; line-height: 1.4;
}
.rp-footer .rp-f-company .footer-content ul { list-style: none; padding: 0 !important; margin: 0 !important; }
.rp-footer .rp-f-company .footer-content li { margin: 0 0 5px !important; padding: 0 !important; font-size: 13.5px !important; line-height: 1.55; }
.rp-footer .rp-f-company .footer-content li::before { display: none !important; }
.rp-footer .rp-f-company .footer-content span {
    font: inherit !important; color: inherit !important; white-space: normal !important; text-decoration: none !important;
}
.rp-footer .rp-f-company .footer-content strong { color: #fff !important; font-weight: 600; }
.rp-footer .rp-f-company .footer-content p { margin: 0 0 5px !important; font-size: 13.5px; }

/* Cột 3: liên kết */
.rp-footer .rp-f-links ul { list-style: none; padding: 0 !important; margin: 0 !important; }
.rp-footer .rp-f-links li { margin: 0 0 9px !important; }
.rp-footer .rp-f-links a { font-size: 14px; position: relative; padding-left: 14px; transition: padding .2s ease, color .2s ease; }
.rp-footer .rp-f-links a::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--rp-gold); }
.rp-footer .rp-f-links a:hover { padding-left: 18px; }

/* Cột 4: đăng ký nhận tin */
.rp-footer .rp-f-note { font-size: 13.5px; line-height: 1.6; margin: 0 0 14px !important; opacity: .9; }
.rp-footer .subscriber-form {
    display: flex !important; background: #fff; border-radius: 999px; padding: 4px; gap: 4px;
}
.rp-footer .subscriber-form .input-group { flex: 1; }
.rp-footer .subscriber-form input[type="email"] {
    border: 0 !important; border-radius: 999px !important; height: 42px; box-shadow: none !important;
    color: var(--rp-text) !important; padding-left: 16px !important; background: transparent !important;
}
.rp-footer .subscriber-form button {
    border-radius: 999px !important; height: 42px; padding: 0 20px !important; margin: 0 !important;
    background: var(--rp-gold) !important; border: 0 !important; font-weight: 700; white-space: nowrap;
}
.rp-footer .subscriber-form button span { color: #fff !important; }
.rp-footer .subscriber-form button:hover { background: var(--rp-gold-dark) !important; }

/* Dải bản quyền */
.rp-footer .rp-f-bottom { border-top: 1px solid rgba(255, 255, 255, .12); background: rgba(0, 0, 0, .12); padding: 14px 0; }
.rp-footer .rp-f-bottom .ctnr { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; }
.rp-footer .rp-f-bottom span { color: rgba(255, 255, 255, .65) !important; }

@media (max-width: 1199px) {
    .rp-footer .rp-footer-grid { grid-template-columns: 1fr 1.6fr; }
}
@media (max-width: 767px) {
    .site-footer.rp-footer { margin-top: 24px; padding-bottom: 76px !important; } /* chừa chỗ thanh menu dưới */
    .rp-footer .footer { padding: 32px 0 18px !important; }
    .rp-footer .rp-footer-grid { grid-template-columns: 1fr; gap: 26px; }
    .rp-footer .rp-f-brand { text-align: center; }
    .rp-footer .rp-f-brand .footer-social-links { justify-content: center; }
    .rp-footer .rp-f-bct img { margin: 0 auto; }
    .rp-footer .rp-f-bottom .ctnr { justify-content: center; text-align: center; }
    .rp-footer .rp-f-bottom-right { display: none; }
}
/* Sửa bề rộng hàng header: logo + tiện ích co theo nội dung, ô tìm kiếm giãn ra */
.site-header .site-branding { flex: 0 0 auto !important; width: auto !important; max-width: none !important; }
.site-header .toolbar { flex: 0 0 auto !important; width: auto !important; }
.site-header .toolbar .toolbar-item { width: auto !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }
.site-header .search-box-wrap { flex: 1 1 auto !important; max-width: 540px !important; width: auto !important; }
.site-header .search-box-inner, .site-header .search-box, #header_search_form { width: 100% !important; max-width: none !important; }
.site-header .toolbar .toolbar-item .count-label { left: auto !important; }
.site-header .search-box-wrap { padding: 0 !important; }
.site-header .search-box-wrap .search-box-inner { flex: 1 1 auto !important; width: 100% !important; }
.site-header .toolbar .toolbar-item > a > div > .cart-icon > .count-label { left: auto !important; right: -4px !important; top: -3px !important; }
.site-header .site-branding .site-logo { width: auto !important; min-width: 0 !important; display: inline-block; }
@media (min-width: 1200px) { .site-header .search-box-wrap { max-width: 560px !important; } }
/* Thanh menu: bản gốc cố định ô cao 41px + line-height 41px, cộng padding mới làm chữ tràn
   xuống dưới đường kẻ -> để ô tự cao theo chữ */
.site-header .site-menu > ul > li { height: auto !important; line-height: normal !important; }
.site-header .site-menu > ul > li > a { line-height: 20px !important; padding: 14px 6px !important; }
.site-header .navbar { min-height: 0 !important; }
/* Logo footer: logo trắng đặt thẳng trên nền xanh (bỏ ô kem) */
.rp-footer .rp-f-brand .logo_footer { padding: 0 !important; background: none !important; box-shadow: none !important; border-radius: 0 !important; }
.rp-footer .rp-f-brand .logo_footer img { height: 92px !important; filter: brightness(0) invert(1); opacity: .96; }
.rp-footer .rp-f-tagline { margin-top: 10px !important; color: var(--rp-gold-soft) !important; }

/* =========================================================
   16. TRANG LIÊN HỆ
   ========================================================= */
.wrap-template-contact, .wrap-template-contact .ctnr, .contacts { background: transparent !important; }
.wrap-template-contact { padding: 18px 0 40px !important; }
.wrap-template-contact .card {
    background: var(--rp-paper) !important; border: 1px solid var(--rp-line) !important;
    border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important;
}
.wrap-template-contact .widget.card { padding: 22px 24px !important; margin-bottom: 20px !important; }
.wrap-template-contact .widget-title, .wrap-template-contact .contact-form-box h2 {
    color: var(--rp-green) !important; font-weight: 700 !important; font-size: 17px !important;
    letter-spacing: .3px; text-transform: uppercase; border-bottom: 0 !important; position: relative; padding-bottom: 10px !important; margin-bottom: 14px !important;
}
.wrap-template-contact .widget-title::after, .wrap-template-contact .contact-form-box h2::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 2px; border-radius: 2px; background: var(--rp-gold);
}
.wrap-template-contact .widget-title::before { display: none !important; }
.wrap-template-contact .widget, .wrap-template-contact .widget p, .wrap-template-contact .list-icon li {
    color: var(--rp-text) !important; font-size: 14.5px; line-height: 1.65; text-wrap: pretty;
}
.wrap-template-contact .list-icon { padding: 0 !important; list-style: none; }
.wrap-template-contact .list-icon li { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; }
.wrap-template-contact .list-icon li i { color: var(--rp-green) !important; margin-top: 4px; width: 16px; text-align: center; flex: 0 0 16px; }
.wrap-template-contact .social-button {
    width: 36px; height: 36px; border-radius: 50% !important; display: inline-flex !important; align-items: center; justify-content: center;
    background: var(--rp-sage) !important; color: var(--rp-green) !important; border: 0 !important; margin-right: 6px;
}
.wrap-template-contact .social-button i { color: var(--rp-green) !important; }
.wrap-template-contact .social-button:hover { background: var(--rp-green) !important; }
.wrap-template-contact .social-button:hover i { color: #fff !important; }
.wrap-template-contact .contact-form-box { padding: 26px 28px !important; }
.wrap-template-contact label { font-weight: 600; font-size: 13.5px; color: var(--rp-text); margin-bottom: 6px; }
.wrap-template-contact .form-control {
    border: 1.5px solid var(--rp-line) !important; border-radius: 12px !important; background: #FCFBF7 !important;
    height: 46px; box-shadow: none !important; transition: border-color .2s ease, background .2s ease;
}
.wrap-template-contact textarea.form-control { height: auto; min-height: 120px; }
.wrap-template-contact .form-control:focus { border-color: var(--rp-green) !important; background: #fff !important; }
.wrap-template-contact button[type="submit"], .wrap-template-contact .btn-primary {
    background: var(--rp-gold) !important; border: 0 !important; color: #fff !important; border-radius: 999px !important;
    height: 48px; padding: 0 34px !important; font-weight: 700 !important;
}
.wrap-template-contact button[type="submit"]:hover { background: var(--rp-gold-dark) !important; }
/* Chữ trong footer cũng tránh để 1 chữ lẻ rớt dòng */
.rp-footer p, .rp-footer li { text-wrap: pretty; }
/* Icon thẳng hàng với dòng chữ đầu tiên (bản gốc đặt icon tuyệt đối + flex căn giữa nên lệch) */
.wrap-template-contact .list-icon > li {
    display: block !important; position: relative; padding-left: 28px !important;
    line-height: 1.65 !important; margin-bottom: 10px !important;
}
.wrap-template-contact .list-icon > li > i {
    position: absolute !important; left: 0; top: 0; margin: 0 !important;
    width: 18px; height: 1.65em; display: flex !important; align-items: center; justify-content: center;
    font-size: 15px !important; line-height: 1 !important;
}


/* ---------- Footer: bản cân lại 27/10 (huy hiệu BCT ở dải bản quyền) ---------- */
.rp-footer .rp-footer-grid { align-items: start; }
.rp-footer .rp-f-brand .logo_footer img { height: 84px !important; }
.rp-footer .rp-f-brand-text { margin-top: 12px; }
.rp-footer .rp-f-tagline { margin: 0 0 12px !important; }
.rp-footer .footer-social-links { margin: 0 !important; }
.rp-footer .rp-f-bottom .ctnr { align-items: center; }
.rp-footer .rp-f-bottom .rp-f-bct img { height: 34px; width: auto; max-width: none; display: block; }
@media (max-width: 767px) {
    .rp-footer .footer { padding: 26px 0 8px !important; }
    .rp-footer .rp-footer-grid { gap: 0; }
    /* Mỗi khối cách nhau bằng 1 đường mảnh cho có nhịp */
    .rp-footer .rp-footer-grid > * { padding: 18px 0 !important; border-top: 1px solid rgba(255, 255, 255, .1); }
    .rp-footer .rp-footer-grid > *:first-child { padding-top: 0 !important; border-top: 0; }
    /* Logo trái, khẩu hiệu + mạng xã hội phải, cùng căn trái */
    .rp-footer .rp-f-brand { display: flex; align-items: center; gap: 16px; text-align: left; }
    .rp-footer .rp-f-brand .logo_footer img { height: 64px !important; }
    .rp-footer .rp-f-brand-text { margin: 0; }
    .rp-footer .rp-f-tagline { font-size: 15px; margin-bottom: 10px !important; }
    .rp-footer .rp-f-brand .footer-social-links { justify-content: flex-start !important; }
    .rp-footer .footer-social-links a { width: 34px; height: 34px; }
    .rp-footer .widget-title { margin-bottom: 12px !important; font-size: 13px !important; }
    .rp-footer .rp-f-company .footer-content h3 { font-size: 14.5px !important; }
    .rp-footer .rp-f-company .footer-content li { margin-bottom: 3px !important; font-size: 13px !important; }
    .rp-footer .rp-f-links ul { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; row-gap: 8px; }
    .rp-footer .rp-f-links li { margin: 0 !important; }
    .rp-footer .rp-f-note { text-align: left; font-size: 13px; margin-bottom: 12px !important; }
    .rp-footer .rp-f-bottom { padding: 10px 0; }
    .rp-footer .rp-f-bottom .ctnr { justify-content: space-between !important; text-align: left; flex-wrap: nowrap; }
    .rp-footer .rp-f-bottom .rp-f-bct img { height: 30px; }
}
.rp-footer .rp-f-brand .logo_footer { display: block !important; line-height: 0; margin-top: 2px; }
@media (max-width: 767px) {
    /* Dải cuối: huy hiệu + bản quyền căn giữa (bên phải có nút Zalo nổi) */
    .rp-footer .rp-f-bottom .ctnr { flex-direction: column; justify-content: center !important; align-items: center; gap: 6px; text-align: center; }
    .rp-footer .rp-f-bottom .rp-f-bct { order: -1; }
}
.rp-footer .rp-f-brand .logo_footer img { margin: 0 !important; }

/* =========================================================
   17. TRANG THANH TOÁN (thủ tục đặt hàng)
   ========================================================= */
.shipping-container, .cart-sidebar {
    background: var(--rp-paper) !important; border: 1px solid var(--rp-line) !important;
    border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important; overflow: hidden;
}
.shipping-container { padding: 26px 28px !important; margin-top: 18px; }
.shipping-container .form-title {
    color: var(--rp-green) !important; font-weight: 700 !important; font-size: 18px !important; text-align: left !important;
    padding-bottom: 10px; margin-bottom: 16px !important; position: relative; border: 0 !important;
}
.shipping-container .form-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 2px; border-radius: 2px; background: var(--rp-gold); }
.shipping-container .form-title::before { display: none !important; }
.shipping-container .form-title i, .shipping-container .floating-icon { color: var(--rp-green) !important; }
.shipping-container label { font-weight: 600 !important; font-size: 13.5px !important; color: var(--rp-text) !important; }
.shipping-container .form-control {
    border: 1.5px solid var(--rp-line) !important; border-radius: 12px !important; background: #FCFBF7 !important;
    min-height: 46px; box-shadow: none !important; color: var(--rp-text) !important;
}
.shipping-container .form-control:focus { border-color: var(--rp-green) !important; background: #fff !important; }
.shipping-container .icon-input i, .shipping-container .p-relative > i { color: var(--rp-sage-text) !important; }
.shipping-container .address-note {
    background: #FBF4E6 !important; border: 0 !important; border-left: 3px solid var(--rp-gold) !important;
    color: #7A5A2E !important; border-radius: 10px !important;
}
.shipping-container .address-note * { color: inherit !important; }
.shipping-container .privacy-notice { background: var(--rp-sage) !important; border: 0 !important; color: var(--rp-sage-text) !important; border-radius: 12px !important; }
.shipping-container .privacy-notice a { color: var(--rp-green) !important; font-weight: 600; }
/* Chọn hình thức thanh toán */
.payment-card {
    border: 1.5px solid var(--rp-line) !important; border-radius: 14px !important; background: #fff !important;
    box-shadow: none !important; transition: border-color .2s ease, background .2s ease;
}
.payment-card.is-selected { border-color: var(--rp-green) !important; background: #F3F8F1 !important; }
.payment-card .payment-card-icon { background: var(--rp-sage) !important; color: var(--rp-green) !important; }
.payment-card .payment-title { color: var(--rp-text) !important; font-weight: 700 !important; }
.payment-card .payment-desc { color: var(--rp-gray) !important; }
.payment-badge-pill.pill-bank, .payment-badge-pill.pill-eligible { background: var(--rp-sage) !important; color: var(--rp-sage-text) !important; }
.payment-card-radio input:checked, .payment-radio-input:checked { accent-color: var(--rp-green); }
/* Nút cuối form */
.btn-group-custom { gap: 12px; }
.btn-group-custom .btn {
    height: 50px; border-radius: 999px !important; font-weight: 700 !important; padding: 0 26px !important;
    display: inline-flex !important; align-items: center; justify-content: center; gap: 8px; box-shadow: none !important;
}
.btn-group-custom .btn-back { background: #fff !important; color: var(--rp-green) !important; border: 2px solid var(--rp-green) !important; }
.btn-group-custom .btn-back:hover { background: var(--rp-sage) !important; }
.btn-group-custom .btn-submit { background: var(--rp-gold) !important; color: #fff !important; border: 0 !important; }
.btn-group-custom .btn-submit:hover { background: var(--rp-gold-dark) !important; }
/* Cột giỏ hàng bên phải */
.cart-sidebar { margin-top: 18px; }
.cart-sidebar .cart-header {
    background: var(--rp-green) !important; color: #fff !important; padding: 14px 20px !important;
    display: flex; align-items: center; justify-content: space-between; border-radius: 0 !important;
}
.cart-sidebar .cart-header__ttl { color: #fff !important; font-size: 16px !important; font-weight: 700 !important; margin: 0 !important; }
.cart-sidebar .cart-header .summary-row__value { color: #fff !important; font-weight: 700; }
.cart-sidebar .cart-items__product { border-bottom: 1px solid var(--rp-line) !important; padding: 12px 0 !important; }
.cart-sidebar .cart-items__product-image img { border-radius: 10px; border: 1px solid var(--rp-line); background: var(--rp-cream); }
.cart-sidebar .cart-items__product-qty { background: var(--rp-gold) !important; color: #fff !important; }
.cart-sidebar .cart-items__product-name a { color: var(--rp-text) !important; font-weight: 600; }
.cart-sidebar .text-danger, .cart-sidebar .summary-row__value { color: var(--rp-green-dark) !important; font-weight: 700; }
.cart-sidebar .order-summary { padding-top: 6px !important; }
.cart-sidebar .summary-row { border-bottom: 1px dashed var(--rp-line) !important; padding: 10px 0 !important; }
.cart-sidebar .summary-row:last-child { border-bottom: 0 !important; }
.cart-sidebar .summary-row:last-child .summary-row__label { font-weight: 700; color: var(--rp-text) !important; }
.cart-sidebar .summary-row:last-child .summary-row__value { font-size: 20px; }
@media (max-width: 575px) {
    .shipping-container { padding: 18px 16px !important; }
    .btn-group-custom { flex-direction: column-reverse; }
    .btn-group-custom .btn { width: 100%; }
}
.cart-sidebar .cart-sidebar__content { padding: 4px 18px 14px !important; }
.cart-sidebar .cart-items__product { gap: 12px; }
.cart-sidebar .cart-header { gap: 12px; }
.cart-sidebar .cart-header .summary-row__value { margin-left: auto; padding-right: 22px; white-space: nowrap; }
@media (max-width: 575px) { .btn-group-custom { flex-direction: column !important; } .btn-group-custom .btn-submit { order: -1; } }

/* =========================================================
   18. ĐĂNG NHẬP / QUÊN MẬT KHẨU (trang đứng riêng, không header/footer)
   ========================================================= */
.box-signin {
    background-color: var(--rp-cream) !important;
    background-image: var(--rp-leaf), var(--rp-leaf-soft) !important;
    background-repeat: no-repeat !important; background-size: 340px auto, 300px auto !important;
    background-position: left -90px bottom -60px, right -70px top -40px !important;
    display: flex; align-items: center; justify-content: center; padding: 24px 16px;
}
.box-signin .box-container-wisdom { background: transparent !important; width: 100%; display: flex; justify-content: center; }
.box-signin .box-login-wisdom {
    background: var(--rp-paper) !important; border: 1px solid var(--rp-line) !important;
    border-radius: 22px !important; box-shadow: var(--rp-shadow-hover) !important;
    padding: 30px 30px 24px !important; width: 100%; max-width: 400px;
}
.box-signin .images-logo { text-align: center; }
.box-signin .rp-auth-logo { display: inline-block; margin-bottom: 10px; }
.box-signin .rp-auth-logo img { height: 70px; width: auto; }
.box-signin .images-logo h2 {
    color: var(--rp-green) !important; font-family: var(--rp-font-title) !important; font-style: italic;
    font-size: 26px !important; font-weight: 700 !important; text-transform: none !important; margin: 0 0 18px !important;
}
.box-signin .input-container input, .box-signin .form-input-wisdom input, .box-signin input[type="text"], .box-signin input[type="password"], .box-signin input[type="email"] {
    border: 1.5px solid var(--rp-line) !important; border-radius: 12px !important; background: #FCFBF7 !important; box-shadow: none !important;
}
.box-signin .input-container input:focus, .box-signin input:focus { border-color: var(--rp-green) !important; background: #fff !important; }
.box-signin .label { color: var(--rp-gray) !important; }
.box-signin .ghichu, .box-signin .ghichu label { color: var(--rp-gray) !important; font-size: 13px; }
.box-signin .ghichu input { accent-color: var(--rp-green); }
.box-signin .btn-dangnhap-wisdom {
    background: var(--rp-gold) !important; background-image: none !important; color: #fff !important; border: 0 !important;
    border-radius: 999px !important; height: 48px; font-weight: 700 !important; letter-spacing: .5px; box-shadow: 0 8px 20px rgba(184, 143, 86, .28) !important;
}
.box-signin .btn-dangnhap-wisdom:hover { background: var(--rp-gold-dark) !important; }
.box-signin .btn-dangky a {
    display: flex !important; align-items: center; justify-content: center; height: 46px;
    border: 2px solid var(--rp-green) !important; border-radius: 999px !important; background: #fff !important;
    color: var(--rp-green) !important; font-weight: 700 !important;
}
.box-signin .btn-dangky a:hover { background: var(--rp-sage) !important; }
.box-signin .quenmk a, .box-signin .back-link, .box-signin .home-link, .box-signin .forgot-footer-links a { color: var(--rp-green) !important; font-weight: 500; }
.box-signin .forgot-icon-circle { background: var(--rp-sage) !important; color: var(--rp-green) !important; }
.box-signin .forgot-icon-circle i { color: var(--rp-green) !important; }
.box-signin .subtitle { color: var(--rp-gray) !important; }
html body .wrapper .box-signin, html body .box-signin {
    background-color: var(--rp-cream) !important;
    background-image: var(--rp-leaf), var(--rp-leaf-soft) !important;
    background-repeat: no-repeat !important; background-size: 340px auto, 300px auto !important;
    background-position: left -90px bottom -60px, right -70px top -40px !important;
}
.box-signin .forgot-icon-wrapper { display: none !important; }

/* =========================================================
   19. NỘI DUNG BÀI VIẾT / TRANG GIỚI THIỆU, CHÍNH SÁCH (.rp-prose)
   ========================================================= */
.rp-prose { color: var(--rp-text); font-size: 16px; line-height: 1.75; }
.rp-prose p { margin: 0 0 14px !important; font-size: 16px !important; line-height: 1.75 !important; color: var(--rp-text) !important; text-align: left !important; }
.rp-prose h2 { font-size: 22px !important; font-weight: 700 !important; color: var(--rp-green-dark) !important; margin: 30px 0 12px !important; line-height: 1.35 !important; }
.rp-prose h3 { font-size: 18.5px !important; font-weight: 700 !important; color: var(--rp-green) !important; margin: 24px 0 10px !important; line-height: 1.4 !important; }
.rp-prose h4 { font-size: 16.5px !important; font-weight: 700 !important; margin: 20px 0 8px !important; }
.rp-prose ul, .rp-prose ol { padding-left: 22px !important; margin: 0 0 16px !important; }
.rp-prose li { margin-bottom: 6px !important; line-height: 1.7 !important; font-size: 16px !important; }
.rp-prose ul li::marker { color: var(--rp-gold); }
.rp-prose img { max-width: 100% !important; height: auto !important; border-radius: 14px; display: block; margin: 18px auto !important; }
.rp-prose a { color: var(--rp-green) !important; text-decoration: underline; text-decoration-color: var(--rp-gold-soft); text-underline-offset: 3px; }
.rp-prose blockquote { margin: 18px 0 !important; padding: 14px 18px !important; background: #FBF8F1; border-left: 3px solid var(--rp-gold) !important; border-radius: 0 12px 12px 0; }
.rp-prose table { width: 100% !important; border-collapse: collapse; margin: 16px 0 !important; font-size: 15px; }
.rp-prose table td, .rp-prose table th { border-bottom: 1px solid var(--rp-line) !important; padding: 10px 8px !important; }
.rp-prose strong { color: var(--rp-text); }
.rp-prose--page { max-width: 920px; margin: 0 auto 30px; }

/* Trang chi tiết bài viết */
.news-detail {
    background: var(--rp-paper); border: 1px solid var(--rp-line); border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow); padding: 18px 18px 26px; margin-bottom: 30px;
}
.news-detail .image-post-details { border-radius: 16px; overflow: hidden; margin-bottom: 18px; }
.news-detail .image-post-details img { width: 100%; height: auto; display: block; }
.news-detail .news-title {
    font-size: 30px !important; line-height: 1.3 !important; font-weight: 800 !important; color: var(--rp-green-dark) !important;
    margin: 0 10px 10px !important;
}
.news-detail .post-meta { margin: 0 10px 18px !important; padding: 0 0 14px !important; border-bottom: 1px solid var(--rp-line); color: var(--rp-gray); display: flex; gap: 18px; flex-wrap: wrap; list-style: none; }
.news-detail .post-meta li, .news-detail .post-meta i { color: var(--rp-gray) !important; font-size: 13.5px; }
.news-detail .post-meta i { color: var(--rp-gold) !important; margin-right: 5px; }
.news-detail .content-news { padding: 0 10px; }
/* Cột phải: bài viết liên quan, thẻ */
.box-news-right-post-details, .tag-detail-post {
    background: var(--rp-paper) !important; border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius-lg) !important;
    box-shadow: var(--rp-shadow) !important; padding: 20px !important;
}
.box-news-right-post-details .widget-title, .tag-detail-post .widget-title {
    color: var(--rp-green) !important; font-size: 15px !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .4px;
    position: relative; padding-bottom: 10px !important; margin-bottom: 14px !important; border: 0 !important;
}
.box-news-right-post-details .widget-title::after, .tag-detail-post .widget-title::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 2px; border-radius: 2px; background: var(--rp-gold);
}
.box-news-right-post-details .entry { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0 !important; border-bottom: 1px dashed var(--rp-line); }
.box-news-right-post-details .entry:last-child { border-bottom: 0; }
.box-news-right-post-details .entry-thumb img { width: 76px !important; height: 58px !important; object-fit: cover; border-radius: 10px !important; }
.box-news-right-post-details .entry-title, .box-news-right-post-details .entry-title a {
    font-size: 14px !important; font-weight: 600 !important; line-height: 1.45 !important; color: var(--rp-text) !important; margin: 0 !important;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.box-news-right-post-details .entry:hover .entry-title a { color: var(--rp-green) !important; }
.tag-detail-post .tag { display: inline-block; background: var(--rp-sage) !important; color: var(--rp-sage-text) !important; border: 0 !important; border-radius: 999px !important; padding: 5px 12px !important; margin: 0 6px 6px 0; font-size: 13px; }
@media (max-width: 767px) {
    .news-detail { padding: 12px 12px 20px; }
    .news-detail .news-title { font-size: 23px !important; margin: 0 4px 8px !important; }
    .news-detail .post-meta, .news-detail .content-news { margin-left: 4px !important; margin-right: 4px !important; padding-left: 0; padding-right: 0; }
    .rp-prose, .rp-prose p, .rp-prose li { font-size: 15.5px !important; }
    .rp-prose h2 { font-size: 20px !important; }
}
/* Bỏ định dạng dán từ Word/Google Docs trong nội dung (cỡ 11pt, font Arial, màu đen, ngắt dòng cứng) */
.rp-prose span, .rp-prose font { font-size: inherit !important; font-family: inherit !important; color: inherit !important; white-space: normal !important; line-height: inherit !important; }
.rp-prose b, .rp-prose strong, .rp-prose span[style*="font-weight:700"], .rp-prose span[style*="font-weight: 700"] { font-weight: 700 !important; }
.title-detail-right h1 { color: var(--rp-green-dark) !important; font-weight: 700 !important; }

/* =========================================================
   20. TRANG KHUYẾN MÃI (nội dung soạn trong admin, dùng các class .rp-promo-*)
   ========================================================= */
.rp-promo-intro { text-align: center; max-width: 680px; margin: 0 auto 26px; }
.rp-promo .rp-promo-kicker { color: var(--rp-gold) !important; font-weight: 700 !important; letter-spacing: 1.2px; text-transform: uppercase; font-size: 13px !important; margin: 0 0 6px !important; text-align: center !important; }
.rp-promo-intro h2 { margin: 0 0 10px !important; font-size: 26px !important; }
.rp-promo-intro p { text-align: center !important; color: var(--rp-gray) !important; }
.rp-promo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin: 0 0 32px; }
.rp-promo-card {
    background: var(--rp-paper); border: 1px solid var(--rp-line); border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow); overflow: hidden; display: flex; flex-direction: column;
    transition: box-shadow .25s ease, transform .25s ease;
}
.rp-promo-card:hover { box-shadow: var(--rp-shadow-hover); transform: translateY(-3px); }
.rp-promo .rp-promo-img { display: block; text-decoration: none !important; }
.rp-promo .rp-promo-img img { margin: 0 !important; border-radius: 0 !important; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.rp-promo-body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.rp-promo-tag { align-self: flex-start; background: var(--rp-sage); color: var(--rp-sage-text); font-weight: 700; font-size: 12.5px; border-radius: 999px; padding: 4px 12px; margin-bottom: 10px; }
.rp-promo .rp-promo-body h3 { margin: 0 0 10px !important; font-size: 18px !important; line-height: 1.4 !important; }
.rp-promo .rp-promo-body h3 a { color: var(--rp-text) !important; text-decoration: none !important; }
.rp-promo .rp-promo-body h3 a:hover { color: var(--rp-green) !important; }
.rp-promo .rp-promo-body ul { list-style: none; padding: 0 !important; margin: 0 0 14px !important; }
.rp-promo .rp-promo-body li { position: relative; padding-left: 22px; font-size: 15px !important; }
.rp-promo .rp-promo-body li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--rp-green); font-weight: 700; }
.rp-promo .rp-promo-body li em { color: var(--rp-gray); font-style: normal; }
.rp-promo-price { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: auto; padding-top: 12px; border-top: 1px dashed var(--rp-line); }
.rp-promo-price strong { color: var(--rp-green-dark); font-size: 24px; font-weight: 800; }
.rp-promo-price span { color: var(--rp-gray); font-size: 13px; }
.rp-promo .rp-promo-actions { margin: 14px 0 0 !important; }
.rp-promo .rp-promo-btn {
    display: flex; align-items: center; justify-content: center; height: 48px; border-radius: 999px;
    background: var(--rp-gold); color: #fff !important; font-weight: 700; text-decoration: none !important; transition: background .2s ease;
}
.rp-promo .rp-promo-btn:hover { background: var(--rp-gold-dark); }
.rp-promo .rp-promo-steps { counter-reset: s; list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 0 0 24px !important; }
.rp-promo .rp-promo-steps li {
    counter-increment: s; background: var(--rp-paper); border: 1px solid var(--rp-line); border-radius: var(--rp-radius);
    padding: 16px 16px 16px 58px !important; position: relative; font-size: 15px !important; margin: 0 !important;
}
.rp-promo .rp-promo-steps li::before {
    content: counter(s); position: absolute; left: 16px; top: 14px; width: 30px; height: 30px; border-radius: 50%;
    background: var(--rp-green); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 14px;
}
.rp-promo-help { background: var(--rp-sage); border-radius: var(--rp-radius); padding: 14px 18px; margin-bottom: 14px; }
.rp-promo .rp-promo-help p { margin: 0 !important; text-align: center !important; color: var(--rp-sage-text) !important; }
.rp-promo .rp-promo-help a { color: var(--rp-green-dark) !important; text-decoration: none; }
.rp-promo .rp-promo-note { font-size: 13px !important; color: var(--rp-gray) !important; text-align: center !important; font-style: italic; }
@media (max-width: 767px) {
    .rp-promo-grid { grid-template-columns: 1fr; gap: 16px; }
    .rp-promo .rp-promo-steps { grid-template-columns: 1fr; }
    .rp-promo-intro h2 { font-size: 22px !important; }
}
/* Khuyến mãi: các bước + ô tư vấn căn giữa, cân đối */
.rp-promo .rp-promo-h2 { text-align: center; margin-top: 8px !important; }
.rp-promo .rp-promo-steps li {
    padding: 22px 18px 18px !important; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px;
    color: var(--rp-gray) !important; font-size: 14.5px !important; line-height: 1.6 !important;
}
.rp-promo .rp-promo-steps li::before { position: static; margin-bottom: 4px; width: 36px; height: 36px; font-size: 15px; }
.rp-promo .rp-promo-steps li strong { color: var(--rp-green-dark) !important; font-size: 16px; }
.rp-promo-help {
    display: flex; align-items: center; justify-content: center; gap: 14px 18px; flex-wrap: wrap;
    background: var(--rp-sage); border-radius: var(--rp-radius-lg); padding: 16px 20px; margin-bottom: 14px;
}
.rp-promo .rp-promo-help p { margin: 0 !important; }
.rp-promo .rp-promo-help-text { font-weight: 700 !important; color: var(--rp-green-dark) !important; font-size: 16px !important; }
.rp-promo .rp-promo-help-btns { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.rp-promo .rp-promo-btn-line {
    display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 999px;
    background: #fff; border: 1.5px solid var(--rp-green); color: var(--rp-green) !important; font-weight: 700; font-size: 14px;
    text-decoration: none !important; transition: background .2s ease, color .2s ease;
}
.rp-promo .rp-promo-btn-line:hover { background: var(--rp-green); color: #fff !important; }
.rp-promo .rp-promo-note { max-width: 760px; margin: 0 auto 10px !important; }
@media (max-width: 767px) {
    /* Điện thoại: số bên trái, chữ bên phải cho gọn */
    .rp-promo .rp-promo-steps li { display: grid; grid-template-columns: 36px 1fr; column-gap: 12px; row-gap: 2px; text-align: left; align-items: start; padding: 14px 16px !important; }
    .rp-promo .rp-promo-steps li::before { grid-row: 1 / span 2; margin: 0; }
}
/* Footer – thông tin công ty: nhãn đậm, giá trị (kể cả số điện thoại, email là link) chữ thường đều nhau */
.rp-footer .rp-f-company .footer-content li a { font-weight: 400 !important; color: rgba(255, 255, 255, .82) !important; text-decoration: none; }
.rp-footer .rp-f-company .footer-content li a strong { font-weight: 400 !important; color: inherit !important; }
.rp-footer .rp-f-company .footer-content li a:hover { color: #fff !important; text-decoration: underline; }
/* Ô tư vấn: bỏ khoảng đệm dưới mặc định của thẻ p (bản gốc p có padding-bottom) để chữ + nút nằm giữa khung */
.rp-promo .rp-promo-help p { padding: 0 !important; line-height: 1.4 !important; }

/* =========================================================
   21. TAB "TÌM HIỂU THÊM" Ở TRANG SẢN PHẨM
   ========================================================= */
.tabs-products-details .rp-learn-title { margin-top: 4px !important; font-size: 22px !important; }
.rp-learn-card {
    display: flex; gap: 18px; align-items: center; text-decoration: none !important;
    background: #FBF8F1; border: 1px solid var(--rp-gold-soft); border-radius: var(--rp-radius-lg); padding: 14px; max-width: 760px;
    transition: box-shadow .2s ease, border-color .2s ease;
}
.rp-learn-card:hover { box-shadow: var(--rp-shadow); border-color: var(--rp-gold); }
.rp-learn-card img { width: 180px; height: 120px; object-fit: cover; border-radius: 12px; flex: 0 0 auto; }
.rp-learn-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rp-learn-text small { color: var(--rp-gold-dark); font-weight: 700; text-transform: uppercase; letter-spacing: .6px; font-size: 12px; }
.rp-learn-text strong { color: var(--rp-green-dark); font-size: 18px; line-height: 1.4; }
.rp-learn-text > span { color: var(--rp-gray); font-size: 14px; line-height: 1.55; }
.rp-learn-text em { font-style: normal; color: var(--rp-green); font-weight: 700; font-size: 14px; margin-top: 2px; }
@media (max-width: 575px) {
    .rp-learn-card { flex-direction: column; align-items: stretch; }
    .rp-learn-card img { width: 100%; height: auto; aspect-ratio: 16 / 9; }
}

/* =========================================================
   22. HEADER MÁY TÍNH – NÚT BẤM RÕ RÀNG (27/10)
   ========================================================= */
.site-header .toolbar { gap: 10px !important; }
/* Mỗi mục là 1 nút bo tròn: icon tròn bên trái + chữ */
.site-header .toolbar .toolbar-item > a {
    display: inline-flex !important; align-items: center; height: 46px; padding: 0 18px 0 5px !important;
    border: 1.5px solid var(--rp-line); border-radius: 999px; background: #fff;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.site-header .toolbar .toolbar-item > a:hover { border-color: var(--rp-green); background: #F3F8F1; box-shadow: 0 4px 14px rgba(27, 94, 63, .10); }
.site-header .toolbar .toolbar-item > a > .flec-user { gap: 9px !important; }
.site-header .toolbar .toolbar-item .cart-icon { width: 36px !important; height: 36px !important; }
.site-header .toolbar .toolbar-item .cart-icon i { font-size: 15px !important; }
.site-header .toolbar .toolbar-item:hover .cart-icon { background: var(--rp-green); }
.site-header .toolbar .toolbar-item > a > div > .text-label { font-size: 14.5px !important; font-weight: 700 !important; color: var(--rp-text) !important; }
/* Giỏ hàng: nút nền xanh nổi bật */
.site-header .toolbar .toolbar-item:last-child > a { background: var(--rp-green); border-color: var(--rp-green); }
.site-header .toolbar .toolbar-item:last-child > a:hover { background: var(--rp-green-dark); border-color: var(--rp-green-dark); }
.site-header .toolbar .toolbar-item:last-child .cart-icon { background: rgba(255, 255, 255, .16) !important; }
.site-header .toolbar .toolbar-item:last-child .cart-icon i,
.site-header .toolbar .toolbar-item:last-child > a > div > .text-label { color: #fff !important; }
.site-header .toolbar .toolbar-item > a > div > .cart-icon > .count-label { border-color: var(--rp-green) !important; }
/* Đã đăng nhập: ảnh đại diện + tên trong nút */
.site-header .toolbar .profile-login > a { gap: 9px; padding-left: 5px !important; }
.site-header .toolbar .item-avart-login img { width: 36px !important; height: 36px !important; border-width: 0 !important; }
.site-header .toolbar .name-profile-usear p { font-size: 14.5px; }

/* Menu: mỗi mục là 1 viên nút */
.site-header .navbar { padding: 7px 0 !important; border-top: 1px solid var(--rp-line) !important; border-bottom: 1px solid var(--rp-line) !important; box-shadow: none !important; }
.site-header .site-menu > ul { justify-content: space-between; gap: 4px; }
.site-header .site-menu > ul > li > a {
    padding: 9px 16px !important; border-radius: 999px; line-height: 20px !important;
    font-size: 14px !important; font-weight: 600 !important; letter-spacing: .4px;
    transition: background .2s ease, color .2s ease;
}
.site-header .site-menu > ul > li > a::after { display: none !important; }
.site-header .site-menu > ul > li:hover > a { background: var(--rp-sage); color: var(--rp-green-dark) !important; }
.site-header .site-menu > ul > li.active > a { background: var(--rp-green); color: #fff !important; }
.site-header .site-menu > ul > li.active > a i { color: #fff !important; }
.site-header .t-h-dropdown-menu { margin-top: 6px; }

/* =========================================================
   23. KHUYẾN MÃI: nhãn trên thẻ sản phẩm, khung ở trang chi tiết
   ========================================================= */
.rp-promo-tag-inline {
    display: inline-flex; align-items: center; gap: 5px; vertical-align: middle;
    background: #FBEFE0; color: #9C5A1A; border: 1px solid #F1D3AE; border-radius: 999px;
    font-size: 11.5px; font-weight: 700; padding: 2px 9px; margin: 2px 0 0 4px; white-space: nowrap; line-height: 1.5;
}
.rp-promo-tag-inline i { font-size: 10px; }
.rp-detail-promo {
    display: flex; gap: 12px; align-items: flex-start; margin: 12px 0 14px;
    background: #FBF3E6; border: 1px dashed #E2B98A; border-radius: var(--rp-radius); padding: 12px 14px;
    color: #6B4A1E; font-size: 14px; line-height: 1.55;
}
.rp-detail-promo-ico { width: 34px; height: 34px; border-radius: 50%; background: var(--rp-gold); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; }
.rp-detail-promo strong { color: #8A4F14; font-size: 15px; display: block; margin-bottom: 2px; }
.rp-detail-promo a { color: var(--rp-green) !important; font-weight: 700; font-size: 13px; display: inline-block; margin-top: 4px; }
/* Tiêu đề các phần trong 1 trang (vd Khuyến mãi: Tin khuyến mãi / Sản phẩm khuyến mãi) */
.rp-section-h2 {
    font-family: var(--rp-font-title) !important; font-style: italic; font-weight: 700 !important;
    color: var(--rp-green) !important; font-size: 26px !important; text-align: center;
    margin: 10px 0 20px !important; scroll-margin-top: 90px;
}
.rp-section-h2 + .rp-prose--page { margin-top: 0; }
#san-pham-khuyen-mai { margin-top: 26px !important; }
@media (max-width: 575px) { .rp-section-h2 { font-size: 22px !important; } }

/* =========================================================
   24. Thanh chọn dòng sản phẩm (trang Sản phẩm / danh mục)
   ========================================================= */
.rp-cat-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 4px 0 22px; }
.rp-cat-chips a { padding: 8px 18px; border-radius: 999px; border: 1px solid #DCE5D6; background: #fff; color: var(--rp-green); font-weight: 600; font-size: 14px; text-decoration: none; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.rp-cat-chips a:hover { border-color: var(--rp-green-soft); }
.rp-cat-chips a.active { background: var(--rp-green); border-color: var(--rp-green); color: #fff; }
@media (max-width: 575px) {
    .rp-cat-chips { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
    .rp-cat-chips::-webkit-scrollbar { display: none; }
    .rp-cat-chips a { flex: 0 0 auto; padding: 7px 14px; font-size: 13px; }
}
.rp-empty-list { text-align: center; padding: 40px 16px 56px; color: #6B7280; }
.rp-empty-list p { font-size: 15px; margin-bottom: 14px; }
.rp-btn-outline { display: inline-block; padding: 9px 22px; border-radius: 999px; border: 1px solid var(--rp-green); color: var(--rp-green); font-weight: 600; text-decoration: none; }
.rp-btn-outline:hover { background: var(--rp-green); color: #fff; }

/* =========================================================
   25. Trang Khuyến mãi: combo 4 thẻ/hàng gọn + tin khuyến mãi nổi bật
   ========================================================= */
.rp-prose--wide { max-width: 1140px; }
.rp-prose--wide .rp-promo-intro, .rp-prose--wide .rp-promo-h2, .rp-prose--wide .rp-promo-steps,
.rp-prose--wide .rp-promo-help, .rp-prose--wide .rp-promo-note { max-width: 920px; margin-left: auto !important; margin-right: auto !important; }
.rp-promo-grid { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 18px; }
.rp-promo-grid .rp-promo-card { flex: 0 1 calc(25% - 14px); min-width: 0; }
.rp-promo .rp-promo-body { padding: 12px 14px 14px; }
.rp-promo-tag { font-size: 11.5px; padding: 3px 10px; margin-bottom: 8px; }
.rp-promo .rp-promo-body h3 { font-size: 15px !important; line-height: 1.4 !important; margin: 0 0 8px !important;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rp-promo .rp-promo-gift { display: flex; gap: 6px; align-items: flex-start; margin: 0 0 8px !important; font-size: 13px !important; line-height: 1.45 !important; color: #8A4F14 !important; }
.rp-promo .rp-promo-gift i { color: var(--rp-gold); margin-top: 3px; }
.rp-promo .rp-promo-gift span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.rp-promo-price { padding-top: 10px; gap: 6px; flex-direction: column; align-items: flex-start; }
.rp-promo-price strong { font-size: 19px; }
.rp-promo-price span { font-size: 12px; }
.rp-promo .rp-promo-actions { margin: 10px 0 0 !important; }
.rp-promo .rp-promo-btn { height: 40px; font-size: 14px; }
@media (max-width: 991px) { .rp-promo-grid .rp-promo-card { flex-basis: calc(33.333% - 12px); } }
@media (max-width: 767px) {
    .rp-promo-grid { gap: 12px; }
    .rp-promo-grid .rp-promo-card { flex-basis: calc(50% - 6px); }
    .rp-promo .rp-promo-body { padding: 10px 10px 12px; }
    .rp-promo .rp-promo-body h3 { font-size: 14px !important; }
    .rp-promo-price strong { font-size: 17px; }
    .rp-promo .rp-promo-btn { height: 36px; font-size: 13px; }
}

/* Tin khuyến mãi: dải nền kem, thẻ ngang ảnh trái - chữ phải */
.rp-promo-news { background: var(--rp-cream); border: 1px solid var(--rp-cream-2); border-radius: 22px; padding: 26px 26px 18px; margin: 0 auto 34px; max-width: 1140px; }
.rp-promo-news .rp-section-h2 { margin: 0 0 4px !important; }
.rp-promo-news-sub { text-align: center; color: var(--rp-gray); font-size: 14.5px; margin: 0 0 20px; }
.rp-promo-news-list { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.rp-promo-news-list.is-single { grid-template-columns: minmax(0, 760px); justify-content: center; }
.rp-promo-news-card { display: flex; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: var(--rp-shadow); text-decoration: none !important; color: var(--rp-text) !important; transition: box-shadow .25s ease, transform .25s ease; min-height: 190px; }
.rp-promo-news-card:hover { box-shadow: var(--rp-shadow-hover); transform: translateY(-3px); }
.rp-promo-news-img { flex: 0 0 42%; overflow: hidden; background: #f1efe7; }
.rp-promo-news-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.rp-promo-news-card:hover .rp-promo-news-img img { transform: scale(1.04); }
.rp-promo-news-body { flex: 1; min-width: 0; padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.rp-promo-news-meta { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--rp-gray); }
.rp-promo-news-tag { background: #FBEFE0; color: #9C5A1A; font-weight: 700; border-radius: 999px; padding: 3px 10px; font-size: 12px; }
.rp-promo-news-tag i { font-size: 11px; }
.rp-promo-news-title { font-weight: 800; font-size: 17px; line-height: 1.4; color: var(--rp-green-dark); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rp-promo-news-desc { font-size: 14px; line-height: 1.55; color: var(--rp-gray); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rp-promo-news-more { margin-top: auto; color: var(--rp-gold-dark, #9A7442); font-weight: 700; font-size: 14px; }
.rp-promo-news-more i { font-size: 12px; margin-left: 4px; transition: margin .2s ease; }
.rp-promo-news-card:hover .rp-promo-news-more i { margin-left: 8px; }
.rp-promo-news-pages:empty { display: none; }
.rp-promo-news-pages { margin-top: 14px; }
@media (max-width: 991px) { .rp-promo-news-list { grid-template-columns: 1fr; } }
@media (max-width: 575px) {
    .rp-promo-news { padding: 18px 12px 10px; border-radius: 16px; }
    .rp-promo-news-card { flex-direction: column; min-height: 0; }
    .rp-promo-news-img { flex-basis: auto; aspect-ratio: 16 / 9; }
    .rp-promo-news-title { font-size: 16px; }
}
.rp-promo .rp-promo-price span { font-size: 12px !important; line-height: 1.3 !important; }
.rp-promo .rp-promo-price strong { line-height: 1.2 !important; }
@media (max-width: 767px) { .rp-promo-tag { font-size: 11px; padding: 2px 9px; } }
/* Dấu Bộ Công Thương: to hơn, nằm dưới mạng xã hội */
.rp-footer .rp-f-brand .rp-f-bct { display: inline-block; margin-top: 4px; }
.rp-footer .rp-f-brand .rp-f-bct img { max-width: 190px; width: 190px; height: auto; display: block; }
@media (max-width: 767px) { .rp-footer .rp-f-brand .rp-f-bct img { width: 170px; margin: 0 auto; } }

/* =========================================================
   26. Trang Đăng nhập / Đăng ký / Quên mật khẩu: nút Quay lại + Trang chủ
   ========================================================= */
.rp-auth-topbar { position: fixed; top: 0; left: 0; right: 0; z-index: 50; display: flex; justify-content: space-between; align-items: center; padding: 16px 22px; pointer-events: none; }
.rp-auth-topbar a { pointer-events: auto; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px; background: rgba(255,255,255,.92); border: 1px solid #E3E8DF; color: var(--rp-green) !important; font-weight: 600; font-size: 14px; text-decoration: none !important; box-shadow: 0 2px 8px rgba(30,42,35,.06); transition: background .2s ease, color .2s ease, border-color .2s ease; }
.rp-auth-topbar a:hover { background: var(--rp-green); border-color: var(--rp-green); color: #fff !important; }
.rp-auth-topbar a i { font-size: 12px; }
@media (max-width: 575px) {
    .rp-auth-topbar { position: absolute; padding: 12px; }
    .rp-auth-topbar a { height: 36px; padding: 0 13px; font-size: 13px; }
}
/* Nút dạng liên kết nền đậm trong nội dung soạn ở admin (vd "Khám phá sản phẩm" trang Giới thiệu): giữ chữ trắng */
.rp-prose a[style*="color:#ffffff"], .rp-prose a[style*="color:#fff;"], .rp-prose a[style*="color: #fff"], .rp-prose a[style*="color:#FFF"] { color: #fff !important; text-decoration: none !important; }
.rp-prose a[style*="color:#ffffff"]:hover { opacity: .9; }
/* Khi có thanh Quay lại / Trang chủ thì ẩn header điện thoại của trang (tránh chồng nhau) và chừa chỗ phía trên */
body:has(.rp-auth-topbar) section.header-mobile { display: none !important; }
@media (max-width: 575px) {
    body:has(.rp-auth-topbar) .box-signin, body:has(.rp-auth-topbar) .content-wrapper { padding-top: 60px !important; }
}

/* =========================================================
   27. Chi tiết sản phẩm: ảnh nhỏ bấm được, viền ảnh đang xem
   ========================================================= */
.slider-1-details-lefts .slick-slide { cursor: pointer; }
.slider-1-details-lefts .item-slicks-left img { border: 2px solid transparent; border-radius: 10px; transition: border-color .2s, opacity .2s; opacity: .75; }
/* thẻ ảnh nhỏ chính là .slick-slide nên .slick-current nằm ngay trên .item-slicks-left */
.slider-1-details-lefts .item-slicks-left.slick-current img,
.slider-1-details-lefts .item-slicks-left:hover img { opacity: 1; }
.slider-1-details-lefts .item-slicks-left.slick-current img { border-color: var(--rp-green); }

/* =========================================================
   28. Thanh toán: số tiền không rớt chữ "đ" xuống dòng;
       Liên hệ (điện thoại): khung form thẳng hàng; giá thẻ sản phẩm cũ màu xanh
   ========================================================= */
.cart-sidebar .summary-row__value,
.cart-sidebar .cart-items__product-price { white-space: nowrap; }
.cart-sidebar .summary-row { gap: 10px; }
@media (max-width: 991px) {
    .wrap-template-contact .contact-form-box { margin-left: 0 !important; margin-right: 0 !important; }
}
/* Giá ở "Sản phẩm liên quan" / kết quả tìm kiếm (thẻ cũ .product-price màu đỏ) cùng màu xanh với thẻ sản phẩm ở trang chủ */
.product-card .product-price { color: var(--rp-green-dark) !important; font-weight: 700 !important; }
/* Banner giữa trang: thẻ <picture> (ảnh riêng cho điện thoại) chiếm đủ khung như ảnh cũ */
a.genius-banner picture { display: block; }

/* =========================================================
   29. Trang tài khoản > Đổi mật khẩu: ô Hủy tài khoản
   ========================================================= */
.rp-huy-tk { margin-top: 18px; border: 1px solid #F0D5CF !important; }
.rp-huy-tk .card-header { background: #FBEDEA !important; border-bottom: 1px solid #F0D5CF !important; }
.rp-huy-tk .card-header .card-title { color: #B4372A !important; }
.rp-huy-tk details > summary { cursor: pointer; color: #B4372A; font-weight: 600; }
.rp-huy-tk-list { margin: 10px 0 14px; padding-left: 20px !important; line-height: 1.7; }
.rp-huy-tk-list li { list-style: disc !important; }
.rp-huy-tk .btn-danger { background: #B4372A !important; border-color: #B4372A !important; color: #fff !important; }

/* =========================================================
   30. Tối ưu điện thoại (30/10/2026)
   - Header: logo ở giữa, nút tìm kiếm trái, nút menu phải, vùng bấm 44px
   - Ô nhập chữ 16px: iPhone không tự phóng to khi bấm vào ô
   - Chừa chỗ cho thanh menu dưới để không che chân trang
   ========================================================= */
.rp-m-search { display: none; }
@media (max-width: 992px) {
    .box-header-mobile { position: relative; min-height: 52px; }
    .box-header-mobile .logo-mobile {
        position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
        width: auto !important; line-height: 0;
    }
    .box-header-mobile .logo-mobile a img { height: 52px !important; width: auto; }
    .box-header-mobile .box-menu-mobile { width: auto !important; margin-left: auto; }
    .rp-m-search {
        display: inline-flex; align-items: center; justify-content: center;
        width: 44px; height: 44px; padding: 0; margin-left: -6px;
        border: 0; border-radius: 50%; background: transparent;
        color: var(--rp-green); font-size: 19px; cursor: pointer;
    }
    .rp-m-search:active { background: var(--rp-sage); }
    .header-mobile .icon-mav-mobile {
        display: inline-flex; align-items: center; justify-content: center;
        width: 44px; height: 44px; margin-right: -6px; cursor: pointer;
    }
    .header-mobile .icon-mav-mobile svg { width: 30px !important; height: 30px !important; }
    /* chừa chỗ cho thanh menu dưới ngay trong chân trang (nền xanh), không lộ nền trắng sau góc bo */
    footer.rp-footer { padding-bottom: calc(64px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width: 767px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea { font-size: 16px !important; }
    .rp-footer a[href^="tel:"], .rp-footer a[href^="mailto:"] { display: inline-block; padding: 6px 0; }
    .breadcrumb a, .rp-breadcrumb a { display: inline-block; padding: 6px 0; }
}
/* Điện thoại 2 thẻ/hàng (thẻ rộng ~180px): nút Mua ngay 1 dòng, giá vừa thẻ */
@media (max-width: 440px) {
    .featured-buy-now, .product-card .pl-buy {
        white-space: nowrap; gap: 6px !important; padding: 9px 10px !important;
        font-size: 13.5px !important; min-height: 40px;
    }
    .featured-buy-now .fa-chevron-right, .product-card .pl-buy .fa-chevron-right { display: none; }
    .featured-product-card .pd-wrap .pd-single, .featured-product-card .pd-wrap .pd-final { font-size: 18px !important; }
}

/* =========================================================
   31. Danh sách sản phẩm điện thoại: các thẻ cao bằng nhau, cân 2 bên
   - ảnh vuông cố định bên trái, giữa theo chiều dọc
   - tên giữ chỗ 2 dòng, giá + nút luôn nằm đáy thẻ, nút kín bề ngang cột chữ
   ========================================================= */
@media (max-width: 575px) {
    .wrap-list-product .product-card { align-items: stretch !important; min-height: 186px; }
    .wrap-list-product .product-card .product-thumb { flex: 0 0 38% !important; max-width: 38% !important; align-self: center; }
    .wrap-list-product .product-card .product-thumb img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
    .wrap-list-product .product-card .product-card-body { display: flex; flex-direction: column; }
    .wrap-list-product .product-card .product-title { margin: 0 !important; }
    .wrap-list-product .product-card .product-title a { min-height: 2.7em; line-height: 1.35 !important; }
    .wrap-list-product .product-card .product-title .rp-promo-tag-inline { margin-top: 4px; }
    .wrap-list-product .product-card .product-price { margin-top: auto !important; padding-top: 6px; }
    .wrap-list-product .product-card .pl-buy { width: 100% !important; margin-top: 8px !important; justify-content: center; }
}

/* =========================================================
   32. Giỏ hàng trống: khung thông báo + gợi ý sản phẩm
   ========================================================= */
.rp-cart-empty {
    background: #fff; border: 1px solid var(--rp-line); border-radius: var(--rp-radius-lg);
    box-shadow: var(--rp-shadow); text-align: center; padding: 36px 20px 30px; margin: 24px 0 8px;
}
.rp-cart-empty-ico {
    width: 84px; height: 84px; margin: 0 auto 14px; border-radius: 50%;
    background: var(--rp-sage); color: var(--rp-green); display: flex; align-items: center; justify-content: center; font-size: 34px;
}
.rp-cart-empty-title { font-family: var(--rp-font-title) !important; color: var(--rp-green) !important; font-size: 24px !important; font-weight: 700 !important; margin: 0 0 8px !important; }
.rp-cart-empty-text { color: var(--rp-gray); font-size: 14.5px; margin: 0 auto 20px; max-width: 440px; }
.rp-cart-empty-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rp-cart-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px;
    padding: 10px 22px; border-radius: 999px; font-weight: 600; font-size: 15px; text-decoration: none !important;
}
.rp-cart-btn--solid { background: var(--rp-green); color: #fff !important; border: 1px solid var(--rp-green); }
.rp-cart-btn--solid:hover { background: var(--rp-green-dark); }
.rp-cart-btn--line { background: #fff; color: var(--rp-green) !important; border: 1px solid var(--rp-green); }
.rp-cart-btn--line:hover { background: var(--rp-sage); }
.rp-cart-suggest { margin: 26px 0 36px; }
.rp-cart-suggest-title { font-family: var(--rp-font-title) !important; color: var(--rp-green) !important; font-size: 22px !important; text-align: center; margin: 0 0 14px !important; }
.rp-cart-suggest-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.rp-cart-sp {
    background: #fff; border: 1px solid var(--rp-line); border-radius: var(--rp-radius); padding: 10px;
    display: flex; flex-direction: column; text-align: center;
}
.rp-cart-sp-img img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 10px; display: block; }
.rp-cart-sp-name {
    color: var(--rp-text) !important; font-weight: 600; font-size: 14px; line-height: 1.35; margin: 10px 0 4px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em;
}
.rp-cart-sp-price { color: var(--rp-green-dark); font-weight: 800; font-size: 17px; margin-bottom: 8px; }
.rp-cart-sp-buy {
    margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px;
    border-radius: 999px; background: var(--rp-gold); color: #fff !important; font-weight: 600; font-size: 14px; text-decoration: none !important;
}
.rp-cart-sp-buy:hover { background: var(--rp-gold-dark); }
@media (max-width: 767px) {
    .rp-cart-empty { padding: 28px 16px 24px; margin-top: 16px; }
    .rp-cart-empty-title { font-size: 21px !important; }
    .rp-cart-btn { flex: 1 1 140px; padding: 10px 14px; }
    .rp-cart-suggest-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .rp-cart-sp-price { font-size: 16px; }
}

/* =========================================================
   33. Trang tài khoản (tổng quan + các trang con): theo tông Rapha
   Trước: cam #D4884A, xanh ngọc #17a2b8, nền xanh dương/xanh lá chói. Nay: xanh rêu + vàng đồng + nền kem.
   ========================================================= */
.sidebar-unified { border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important; background: #fff !important; }
.sidebar-unified .profile-ttl { color: var(--rp-green) !important; font-weight: 700 !important; letter-spacing: .3px; border-bottom-color: var(--rp-line) !important; }
.sidebar-unified .profile-ttl::after { background: var(--rp-gold) !important; }
.sidebar-unified .list-info__icon { background: var(--rp-sage) !important; color: var(--rp-green) !important; }
.sidebar-unified .list-info__item > a:hover .list-info__icon,
.sidebar-unified .list-info__item > div:hover .list-info__icon,
.sidebar-unified .list-info__item > a.active-sidebar .list-info__icon { background: var(--rp-green) !important; color: #fff !important; box-shadow: none !important; }
.sidebar-unified .list-info__item > a.active-sidebar { background: #F4F7F1 !important; color: var(--rp-green) !important; border-right-color: var(--rp-green) !important; }
.sidebar-unified .badge-warning { background: var(--rp-gold) !important; }
.rp-pf-menu-btn { display: none; }

/* Tổng quan */
.page-profile .profile-header-card { background: linear-gradient(135deg, var(--rp-green-dark) 0%, var(--rp-green-soft) 100%) !important; border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important; }
.page-profile .profile-header-card h2 { color: #fff !important; font-family: var(--rp-font) !important; }
.page-profile .user-avatar-lg { border: 3px solid rgba(255, 255, 255, .55); object-fit: cover; }
.page-profile .user-rank-badge { background: var(--rp-gold) !important; color: #fff !important; border: 0 !important; }
.rp-pf-id { font-size: 12px; opacity: .85; word-break: break-all; }
.page-profile .stat-card { border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important; }
.page-profile .stat-card.bg-accumulated { background: linear-gradient(135deg, #C9A46C 0%, var(--rp-gold-dark) 100%) !important; }
.page-profile .stat-card.bg-available { background: linear-gradient(135deg, var(--rp-green-soft) 0%, var(--rp-green) 100%) !important; }
.page-profile .stat-card .label { letter-spacing: .4px; }
.page-profile .cycle-tracker { border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius-lg) !important; box-shadow: var(--rp-shadow) !important; }
.page-profile .cycle-title { color: var(--rp-green) !important; }
.page-profile .cycle-title i { color: var(--rp-gold) !important; }
.rp-cycle-date { font-size: 11.5px; color: var(--rp-green); background: #F4F7F1; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--rp-sage); white-space: nowrap; }
.page-profile .cycle-step.start-month .step-dot,
.page-profile .cycle-step.qualified .step-dot { background: var(--rp-green) !important; border-color: var(--rp-green) !important; color: #fff !important; }
.page-profile .cycle-step.active .step-dot { background: var(--rp-gold) !important; border-color: var(--rp-gold) !important; color: #fff !important; box-shadow: 0 0 0 5px rgba(184, 143, 86, .18) !important; }
.page-profile .cycle-step.active .step-label { color: var(--rp-green) !important; }
.page-profile .action-card { border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius) !important; }
.page-profile .action-card:hover { border-color: var(--rp-gold) !important; box-shadow: var(--rp-shadow) !important; }
.page-profile .action-card h4 { font-size: 15px; font-weight: 700; margin-bottom: 5px; color: var(--rp-text); }
.page-profile .action-card p { font-size: 12px; color: var(--rp-gray); margin: 0; }
.page-profile .action-icon { background: var(--rp-sage) !important; color: var(--rp-green) !important; border-radius: 50% !important; }
.page-profile .rp-chi-dt { display: none !important; }
.page-profile .referral-hub { background: #FBFAF5 !important; border: 1px dashed var(--rp-gold-soft) !important; border-radius: var(--rp-radius-lg) !important; }
.rp-ref-title { font-size: 15px; font-weight: 700; color: var(--rp-green); margin-bottom: 6px; }
.rp-ref-sub { font-size: 13px; color: var(--rp-gray); margin-bottom: 12px; }
.rp-ref-row { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--rp-line); border-radius: 12px; padding: 6px 6px 6px 12px; }
.rp-ref-row input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--rp-gray); font-size: 13px; outline: none; }
.rp-ref-copy { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 999px; background: var(--rp-gold); color: #fff; font-weight: 600; font-size: 13.5px; padding: 8px 14px; cursor: pointer; }
.rp-ref-copy:hover { background: var(--rp-gold-dark); }
.rp-pf-logout { width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; background: #fff; border: 1px solid #F0D5CF; border-radius: 14px; color: #B4372A; font-weight: 700; font-size: 15px; }

@media (max-width: 767px) {
    /* Tổng quan trên điện thoại: chào → 2 ô số tiền → lưới chức năng 3 cột → chu kỳ → link giới thiệu → đăng xuất */
    .page-profile .rp-pf-side { display: none !important; }
    .page-profile .profile-header-card { padding: 16px !important; margin-bottom: 14px !important; }
    .page-profile .profile-header-card h2 { font-size: 18px !important; }
    .page-profile .rp-pf-stats { margin-left: -6px; margin-right: -6px; }
    .page-profile .rp-pf-stats > .col-md-6 { flex: 0 0 50%; max-width: 50%; padding-left: 6px; padding-right: 6px; }
    .page-profile .stat-card { padding: 14px 12px !important; margin-bottom: 14px !important; min-height: 92px; }
    .page-profile .stat-card .label { font-size: 10.5px !important; }
    .page-profile .stat-card .value { font-size: 19px !important; }
    .page-profile .stat-card .value small { font-size: 11px !important; }
    .page-profile .stat-card .icon-bg { font-size: 56px !important; }
    .page-profile .action-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; margin-bottom: 4px; }
    .page-profile .action-card { padding: 12px 6px !important; display: flex !important; flex-direction: column; align-items: center; }
    .page-profile .rp-chi-dt { display: flex !important; }
    .page-profile .action-card h4 { font-size: 12.5px !important; line-height: 1.3; margin: 0 !important; }
    .page-profile .action-card p { display: none; }
    .page-profile .action-icon { width: 42px !important; height: 42px !important; line-height: 42px !important; font-size: 17px !important; margin-bottom: 8px !important; }
    .page-profile .cycle-tracker { padding: 16px !important; margin: 14px 0 !important; }
    .page-profile .cycle-tracker > .d-flex:first-child { flex-wrap: wrap; gap: 8px; margin-bottom: 14px !important; }
    .page-profile .referral-hub { padding: 16px !important; margin-top: 14px !important; }

    /* Trang con trên điện thoại: menu gập thành 1 nút */
    .rp-pf-menu-btn {
        display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 46px;
        padding: 10px 14px; margin: 0; border: 0; border-radius: 12px; background: #F4F7F1;
        color: var(--rp-green); font-weight: 700; font-size: 15px; cursor: pointer;
    }
    .rp-pf-menu-btn span { display: inline-flex; align-items: center; gap: 8px; }
    .rp-pf-menu-mui { transition: transform .2s ease; }
    .sidebar-unified.rp-mo .rp-pf-menu-mui { transform: rotate(180deg); }
    .box-bg-item.sidebar-unified { padding: 8px !important; }
    .sidebar-unified:not(.rp-mo) .profile-ttl,
    .sidebar-unified:not(.rp-mo) ul.list-info { display: none !important; }
    .sidebar-unified.rp-mo .profile-ttl { margin: 14px 4px 10px !important; padding-left: 4px !important; }
    .sidebar-unified ul.list-info {
        display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 8px !important;
        overflow: visible !important; padding: 0 2px !important; margin-bottom: 6px !important;
    }
    .sidebar-unified ul.list-info .list-info__item { width: auto !important; flex: none !important; min-width: 0; }
    .sidebar-unified ul.list-info .list-info__ttl { font-size: 11.5px !important; }
}
@media (max-width: 767px) {
    .page-profile > .ctnr { padding: 0 12px !important; }
    .page-profile .cycle-step .step-date { margin-left: 6px; }
}
.sidebar-unified .list-info__item > a.active-sidebar .list-info__ttl { color: var(--rp-green) !important; }
@media (max-width: 767px) { .sidebar-unified .list-info__item > a.active-sidebar { border: 1px solid var(--rp-green) !important; } }
/* Nút đóng menu điện thoại (góc phải khung logo) */
.logo-menu-logo { position: relative; }
.rp-menu-close {
    position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
    width: 40px; height: 40px; border: 0; border-radius: 50%; background: #fff;
    color: var(--rp-green); font-size: 18px; display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .08); cursor: pointer;
}
.rp-menu-close:active { background: var(--rp-sage); }
/* Danh sách sản phẩm máy tính/máy tính bảng: giá + nút Mua ngay luôn thẳng hàng ở đáy thẻ trong cùng 1 hàng */
@media (min-width: 576px) {
    .wrap-list-product .popular-category-slider .row > .clm { display: flex; }
    .wrap-list-product .slider-item { display: flex; width: 100%; }
    .wrap-list-product .product-card { display: flex !important; flex-direction: column; width: 100%; }
    .wrap-list-product .product-card .product-card-body { flex: 1; display: flex; flex-direction: column; }
    .wrap-list-product .product-card .product-price { margin-top: auto !important; }
}
@media (max-width: 420px) {
    .rp-cart-empty-btns { flex-direction: column; }
    .rp-cart-btn { flex: none; width: 100%; white-space: nowrap; }
}

/* =========================================================
   34. Thanh đầu trang khi ĐÃ ĐĂNG NHẬP: ô tài khoản là 1 viên nút ngang như "Đăng nhập"
   (header.css cũ ép xếp dọc ảnh trên - tên dưới và bỏ chiều cao 46px nên ô bị cao vượt)
   ========================================================= */
.site-header .toolbar .toolbar-item > a { height: 46px !important; }
.site-header .toolbar .profile-login > a {
    flex-direction: row !important; justify-content: flex-start !important;
    gap: 9px !important; padding: 0 14px 0 5px !important;
}
.site-header .toolbar .profile-login .item-avart-login { width: auto !important; flex: 0 0 auto; display: flex; }
.site-header .toolbar .profile-login .item-avart-login img {
    width: 36px !important; height: 36px !important; border: 0 !important; filter: none !important;
    border-radius: 50% !important; object-fit: cover; background: var(--rp-sage);
}
.site-header .toolbar .profile-login .name-profile-usear { text-align: left !important; min-width: 0; }
.site-header .toolbar .profile-login .name-profile-usear p {
    font-size: 14.5px !important; font-weight: 700 !important; line-height: 1.2; max-width: 150px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--rp-text) !important;
}
.site-header .toolbar .profile-login > a::after {
    content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 12px;
    color: var(--rp-gray); margin-left: 2px; transition: transform .2s ease;
}
.site-header .toolbar .profile-login:hover > a::after { transform: rotate(180deg); }
/* Menu xổ xuống: khung trắng bo tròn, chữ xanh khi rê chuột (trước: chữ trắng trên nền xanh nhạt, không đọc được) */
.site-header .toolbar .profile-login .hoso-user {
    top: calc(100% + 8px); right: 0; width: 200px; padding: 6px !important;
    border: 1px solid var(--rp-line); border-radius: 14px; box-shadow: var(--rp-shadow-hover);
}
.site-header .toolbar .profile-login .hoso-user::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
.site-header .toolbar .profile-login .hoso-user ul { border-radius: 10px; }
.site-header .toolbar .profile-login .hoso-user ul li { border-bottom: 0 !important; border-radius: 10px; }
.site-header .toolbar .profile-login .hoso-user ul li a { padding: 10px 12px !important; font-size: 14.5px !important; font-weight: 600; color: var(--rp-text) !important; border-radius: 10px; }
.site-header .toolbar .profile-login .hoso-user ul li a i { color: var(--rp-green) !important; }
.site-header .toolbar .profile-login .hoso-user ul li:hover { background: #F3F8F1 !important; }
.site-header .toolbar .profile-login .hoso-user ul li:hover a,
.site-header .toolbar .profile-login .hoso-user ul li:hover i { color: var(--rp-green) !important; }
.site-header .toolbar .profile-login .hoso-user ul li:last-child a,
.site-header .toolbar .profile-login .hoso-user ul li:last-child a i { color: #B4372A !important; }

/* =========================================================
   35. Các trang con tài khoản (Thành viên, Điểm thưởng, Rút tiền, Đơn hàng, Doanh số, Hồ sơ, Hợp đồng, KYC...)
   Đưa màu Bootstrap/Tailwind cũ (xanh ngọc, xanh dương, tím, vàng chói) và font Roboto/Courier về tông Rapha.
   ========================================================= */
:root { --navy: #134630 !important; --navy-light: #1B5E3F !important; --gold: #A57E48 !important; --green: #1B5E3F !important; --orange: #9C7643 !important; --gray-text: #6B7280 !important; }
.wrap-profile-container { background: var(--rp-cream) !important; }
.wrap-profile-container .btn, .wrap-profile-container button, .wrap-profile-container input,
.wrap-profile-container select, .wrap-profile-container textarea, .wrap-profile-container .text-amount,
.page-profile .btn, .page-profile button { font-family: var(--rp-font) !important; }
.wrap-profile-container .text-amount { font-variant-numeric: tabular-nums; }
/* Nút */
.wrap-profile-container .btn-primary, .wrap-profile-container .btn-success, .wrap-profile-container .btn-info:not(.bg-white) {
    background: var(--rp-green) !important; border-color: var(--rp-green) !important; color: #fff !important; border-radius: 999px !important;
}
.wrap-profile-container .btn-primary:hover, .wrap-profile-container .btn-success:hover, .wrap-profile-container .btn-info:not(.bg-white):hover { background: var(--rp-green-dark) !important; }
.wrap-profile-container .btn-warning { background: var(--rp-gold) !important; border-color: var(--rp-gold) !important; color: #fff !important; border-radius: 999px !important; font-weight: 600; }
.wrap-profile-container .btn-warning:hover { background: var(--rp-gold-dark) !important; }
.wrap-profile-container .btn-danger { background: #fff !important; border: 1px solid #F0D5CF !important; color: #B4372A !important; border-radius: 999px !important; }
.wrap-profile-container .btn-danger:hover { background: #FBEDEA !important; }
.wrap-profile-container .card-header .btn-info { background: #fff !important; color: var(--rp-green) !important; border: 0 !important; border-radius: 999px !important; font-size: 13px !important; font-weight: 700; }
/* Hộp thông báo */
.wrap-profile-container .alert { border-radius: 12px !important; border-width: 1px !important; }
.wrap-profile-container .alert-success { background: #F4F7F1 !important; border-color: var(--rp-sage) !important; color: var(--rp-green) !important; }
.wrap-profile-container .alert-danger { background: #FBEDEA !important; border-color: #F0D5CF !important; color: #8A2A1F !important; }
.wrap-profile-container .alert-warning { background: #FBF6EE !important; border-color: var(--rp-gold-soft) !important; color: #6E5228 !important; }
.wrap-profile-container .alert-info, .wrap-profile-container .alert-light { background: #FBFAF5 !important; border-color: var(--rp-line) !important; color: var(--rp-text) !important; }
/* Nhãn */
.wrap-profile-container .badge-success { background: var(--rp-green) !important; color: #fff !important; }
.wrap-profile-container .badge-warning { background: var(--rp-gold) !important; color: #fff !important; }
.wrap-profile-container .badge-danger { background: #B4372A !important; color: #fff !important; }
.wrap-profile-container .badge-info, .wrap-profile-container .badge-primary { background: var(--rp-sage) !important; color: var(--rp-green) !important; }
.wrap-profile-container .text-primary, .wrap-profile-container .text-info, .wrap-profile-container .text-success { color: var(--rp-green) !important; }
.wrap-profile-container .text-warning { color: var(--rp-gold-dark) !important; }
.sidebar-unified .list-info__item .text-danger, .sidebar-unified .list-info__item .text-danger .list-info__ttl { color: #B4372A !important; }
/* Nhãn nguồn hoa hồng (màu ghi ở config/kpi.php, dùng chung với admin nên đổi ở đây) */
.src-tag[style*="2563eb"] { color: var(--rp-green) !important; background: #F4F7F1 !important; }
.src-tag[style*="7c3aed"] { color: var(--rp-gold-dark) !important; background: #FBF6EE !important; }
.src-tag[style*="0891b2"] { color: var(--rp-green-soft) !important; background: #EEF5EF !important; }
.src-tag[style*="059669"] { color: #8A5A2B !important; background: #FBF1E6 !important; }
/* Doanh số: tiến độ thưởng */
.wrap-profile-container .kpi-section { border-color: var(--rp-sage) !important; }
.wrap-profile-container .kpi-top .pct { color: var(--rp-green) !important; background: #F4F7F1 !important; }
.wrap-profile-container .kpi-track { background: #EFECE1 !important; }
.wrap-profile-container .kpi-fill { background: linear-gradient(90deg, var(--rp-green-soft) 0%, var(--rp-green) 100%) !important; }
.wrap-profile-container .kpi-fill.is-done { background: linear-gradient(90deg, #C9A46C 0%, var(--rp-gold-dark) 100%) !important; }
.wrap-profile-container .kpi-marks .mark.target, .wrap-profile-container .kpi-remain strong { color: #B4372A !important; }
.wrap-profile-container .kpi-remain { background: #FBFAF5 !important; color: var(--rp-text) !important; border-left-color: var(--rp-gold) !important; }
.wrap-profile-container .badge-up { background: #F4F7F1 !important; color: var(--rp-green) !important; }
/* Rút tiền: ô số dư cùng tông với trang tổng quan */
.wrap-profile-container .balance-badge { background: linear-gradient(135deg, #C9A46C 0%, var(--rp-gold-dark) 100%) !important; box-shadow: var(--rp-shadow) !important; }
/* Ô chọn tệp (ảnh đại diện, CCCD): bỏ nút xám mặc định của trình duyệt */
.wrap-profile-container input[type="file"] { font-size: 13px !important; color: var(--rp-gray); max-width: 100%; }
.wrap-profile-container input[type="file"]::file-selector-button {
    margin-right: 10px; padding: 7px 14px; border: 1px solid var(--rp-green); border-radius: 999px;
    background: #fff; color: var(--rp-green); font-weight: 600; font-family: var(--rp-font); cursor: pointer;
}
.wrap-profile-container input[type="file"]::file-selector-button:hover { background: #F4F7F1; }
.wrap-profile-container input[type="file"]:disabled::file-selector-button { border-color: var(--rp-line); color: var(--rp-gray); background: #F6F4EC; cursor: default; }
/* Đơn hàng của tôi: nhãn trạng thái dạng viên tông Rapha, bảng không tràn khung */
.wrap-profile-container .badge.badge-1, .wrap-profile-container .badge.badge-2, .wrap-profile-container .badge.badge-3,
.wrap-profile-container .badge.badge-4, .wrap-profile-container .badge.badge-danger {
    display: inline-block; width: auto !important; padding: 6px 11px !important; border-radius: 999px !important;
    font-size: 12.5px !important; font-weight: 700 !important; white-space: nowrap; border: 1px solid transparent;
}
.wrap-profile-container .badge.badge-1 { background: #FBF6EE !important; color: var(--rp-gold-dark) !important; border-color: var(--rp-gold-soft); }
.wrap-profile-container .badge.badge-2 { background: #EEF5EF !important; color: var(--rp-green-soft) !important; border-color: var(--rp-sage); }
.wrap-profile-container .badge.badge-3 { background: var(--rp-green-soft) !important; color: #fff !important; }
.wrap-profile-container .badge.badge-4 { background: var(--rp-green) !important; color: #fff !important; }
.wrap-profile-container .badge.badge-danger { background: #FBEDEA !important; color: #B4372A !important; border-color: #F0D5CF; }
.wrap-profile-container table.table-head-fixed { white-space: normal !important; }
.wrap-profile-container table.table-head-fixed td:last-child .btn { min-width: 76px; border-radius: 999px !important; font-size: 13px !important; padding: 5px 12px !important; }
.wrap-profile-container table.table-head-fixed td:last-child .btn-info.bg-white { border: 1px solid var(--rp-green) !important; color: var(--rp-green) !important; }
.wrap-profile-container table.table-head-fixed ul { padding-left: 0; margin: 0; list-style: none; }

/* =========================================================
   36. Hóa đơn (popup Chi tiết đơn hàng ở trang tài khoản + trang chi tiết đơn): tông Rapha
   (trước: dải vàng chói #ffde59, chữ cam #e67e22, đầu bảng xanh navy #2c3e50)
   ========================================================= */
.invoice-container .invoice-header { background: var(--rp-cream) !important; border-bottom: 2px solid var(--rp-gold) !important; }
.invoice-container .invoice-header .invoice-meta h2 { color: var(--rp-green) !important; font-family: var(--rp-font-title) !important; }
.invoice-container .invoice-header .company-info h4, .invoice-container .info-block h5 { color: var(--rp-green) !important; }
.invoice-container .invoice-header .invoice-meta p span[style*="e67e22"] { color: var(--rp-gold-dark) !important; font-weight: 700; }
.invoice-container .info-block h5 { border-bottom-color: var(--rp-gold) !important; }
.invoice-container .invoice-table th { background: var(--rp-green-dark) !important; color: #fff !important; }
.invoice-container .summary-table tr.total-row td, .invoice-container .summary-table tr.total-row td:last-child { color: var(--rp-green) !important; }
.invoice-container, .invoice-container * { font-family: var(--rp-font); }
.invoice-container .fa, .invoice-container .fas, .invoice-container .far, .invoice-container .fab { font-family: "Font Awesome 5 Free"; }
.invoice-container .fab { font-family: "Font Awesome 5 Brands"; }
/* Bảng đơn hàng trên máy tính (điện thoại đã có dạng thẻ riêng) */
@media (min-width: 768px) {
    .wrap-profile-container table.table-head-fixed td.text-right, .wrap-profile-container table.table-head-fixed th { white-space: nowrap; }
    .wrap-profile-container table.table-head-fixed td:last-child { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
    .wrap-profile-container table.table-head-fixed td:nth-child(2) { min-width: 210px; }
    .wrap-profile-container table.table-head-fixed td:nth-child(2) li { white-space: nowrap; }
}
/* Doanh số trên điện thoại: 2 ô thống kê/hàng cho gọn */
@media (max-width: 599px) {
    .wrap-profile-container .stat-grid .stat-card { padding: 12px 11px !important; min-width: 0; }
    .wrap-profile-container .stat-grid .stat-value { font-size: 17px !important; }
    .wrap-profile-container .stat-grid .stat-unit { font-size: 11px !important; }
    .wrap-profile-container .stat-grid .stat-label { font-size: 10.5px !important; line-height: 1.3; }
    .wrap-profile-container .stat-grid .stat-sub { font-size: 11px !important; }
}

/* =========================================================
   37. Trang chi tiết sản phẩm: chữ mô tả về font Rapha (nội dung dán từ Word/Docs mang theo Arial),
   ô "Link giới thiệu của bạn" (khi đã đăng nhập) theo tông Rapha
   ========================================================= */
.tabcontent :not(i):not(.fa):not(.fas):not(.far):not(.fab):not([class*="fa-"]),
.short-description :not(i):not([class*="fa-"]), .content-sp :not(i):not([class*="fa-"]) { font-family: var(--rp-font) !important; }
.affiliate-link { background: #FBFAF5 !important; border: 1px solid var(--rp-line) !important; border-radius: var(--rp-radius) !important; padding: 16px !important; }
.affiliate-link > strong { font-size: 15px !important; color: var(--rp-green) !important; display: inline-flex; align-items: center; gap: 8px; }
.affiliate-link > strong i { color: var(--rp-gold) !important; }
.affiliate-link .form-control { height: 44px; border-radius: 12px 0 0 12px !important; border-color: var(--rp-line) !important; font-size: 14px !important; color: var(--rp-gray); }
.affiliate-link .btn-primary { height: 44px !important; border-radius: 0 12px 12px 0 !important; background: var(--rp-green) !important; border-color: var(--rp-green) !important; padding: 0 16px; }
.affiliate-link .btn-primary:hover { background: var(--rp-green-dark) !important; }
.affiliate-link small { font-size: 12.5px !important; line-height: 1.5; }
.affiliate-link .input-group { flex-wrap: nowrap !important; }
.affiliate-link .input-group .form-control { min-width: 0; }
.affiliate-link .btn { font-family: var(--rp-font) !important; white-space: nowrap; }
/* Mọi nút trên web dùng font Rapha (vài nút Bootstrap còn Roboto) */
.btn, button { font-family: var(--rp-font); }
/* Chữ nhỏ nhất ở trang tài khoản 11px; tiêu đề khung Liên hệ dùng font Rapha */
.wrap-profile-container .stat-label { font-size: 11px !important; }
.page-profile .cycle-step .step-date { font-size: 11px !important; }
.page-profile .stat-card .label { font-size: 11px !important; }
.contact-form-box h2, .contact-form-box .h4 { font-family: var(--rp-font) !important; }
/* Nút trong hộp nhắc (Rút tiền: Xác thực KYC / Ký hợp đồng / Cập nhật ngay) không bị ngắt chữ giữa từ ở màn hẹp */
.wrap-profile-container .alert .btn { white-space: nowrap; word-break: keep-all; overflow-wrap: normal; padding: 6px 16px !important; }
/* Nút nhỏ ở trang tài khoản trên điện thoại: đủ tương phản, đủ lớn để bấm */
.wrap-profile-container .filter-bar .btn-clear { background: #fff !important; border: 1px solid var(--rp-line) !important; color: var(--rp-green) !important; }
.wrap-profile-container .filter-bar .btn-clear i { color: var(--rp-green) !important; }
.wrap-profile-container .btn-link { color: var(--rp-green) !important; display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 4px 2px !important; }
.wrap-profile-container .js-huydon, .wrap-profile-container .btn-sm { white-space: nowrap; }