/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}
/* ============================================================
   VF Car Card — mockup style on white background (car_posts)
   ============================================================ */
.vf-card{
  position:relative; display:flex; flex-direction:column; height:100%;
  background:#fff; border:1px solid #e6e9f0; border-radius:18px;
  padding:16px 13px 14px; overflow:hidden;
  box-shadow:0 6px 22px rgba(16,33,64,.06);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.vf-card:hover{ transform:translateY(-5px); box-shadow:0 16px 38px rgba(16,33,64,.14); border-color:#d3d9e6; }
.vf-card > *{ position:relative; z-index:1; }
.vf-card-top{ display:block; color:inherit; }
.vf-card-top:hover{ color:inherit; }
.vf-card-head{ display:flex; flex-direction:column; }
.vf-logo{ display:flex; align-items:center; gap:7px; color:#12284c; }
.vf-logo svg{ width:26px; height:22px; fill:currentColor; }
.vf-logo-text{ font-weight:700; letter-spacing:.26em; font-size:12px; line-height:1; }
.vf-model{ margin:0 0 0; font-size:30px; line-height:1.05; font-style:italic; font-weight:800;
  color:#0b1f3a; letter-spacing:.5px; }
.vf-card-img{ text-align:center; margin:10px 0 16px; }
.vf-card-img img{ max-height:155px; width:auto; margin:0 auto; object-fit:contain; }
.vf-card-info{ display:flex; align-items:stretch; gap:6px;
  padding-top:15px; margin-top:auto; border-top:1px solid #eef1f6; }
.vf-info-col{ flex:1; display:flex; align-items:center; gap:5px; min-width:0; }
.vf-info-col + .vf-info-col{ border-left:1px solid #eef1f6; padding-left:8px; }
.vf-ic{ color:#12284c; flex:0 0 auto; display:inline-flex; }
.vf-ic svg{ width:16px; height:16px; }
.vf-info-txt{ min-width:0; }
.vf-label{ display:block; font-size:11px; color:#7a8699; margin-bottom:2px; line-height:1.1; }
.vf-value{ display:block; font-size:12px; font-weight:800; color:#0b1f3a; line-height:1.15; white-space:nowrap; }
.vf-value small{ font-size:9px; font-weight:600; color:#7a8699; margin-left:1px; }
.vf-btn{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:16px;
  padding:11px 18px; border:1.5px solid #12284c; border-radius:40px;
  color:#12284c; font-weight:600; font-size:14px; line-height:1;
  transition:background .2s ease, color .2s ease; }
.vf-btn:hover{ background:#12284c; color:#fff; }
.vf-arrow{ transition:transform .2s ease; }
.vf-btn:hover .vf-arrow{ transform:translateX(4px); }
@media (max-width:549px){
  .vf-model{ font-size:24px; }
  .vf-value{ font-size:13px; }
  .vf-card{ padding:18px 16px 16px; }
}

/* ============ Single XE — trang chi tiết ============ */
.single-xe .xe-main-image{ text-align:center; background:#fff; border:1px solid #eef1f6;
  border-radius:14px; padding:24px; min-height:280px; display:flex; align-items:center; justify-content:center; }
.single-xe .xe-main-image img{ max-height:360px; width:auto; margin:0 auto; transition:opacity .2s; }
.xe-color-name{ text-align:center; font-weight:700; margin:16px 0 10px; color:#0b1f3a; font-size:16px; min-height:20px; }
.xe-color-swatches{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.xe-swatch{ width:36px; height:36px; border-radius:50%; border:2px solid #fff;
  box-shadow:0 0 0 1px #d3d9e6; cursor:pointer; padding:0; outline:none; transition:transform .15s, box-shadow .15s; }
.xe-swatch:hover{ transform:scale(1.1); }
.xe-swatch.active{ box-shadow:0 0 0 2px #12284c; }
.single-xe .xe-breadcrumb{ font-size:12px; color:#7a8699; letter-spacing:.04em; margin-bottom:10px; }
.single-xe .xe-breadcrumb a{ color:#7a8699; } .single-xe .xe-breadcrumb span{ margin:0 6px; }
.single-xe .xe-title{ font-size:30px; font-weight:800; color:#0b1f3a; margin:0 0 10px; }
.single-xe .xe-price{ color:#e01a2b; font-size:32px; font-weight:800; line-height:1; margin:0 0 16px; }
.single-xe .xe-price span{ font-size:14px; font-weight:600; }
.xe-info-table{ width:100%; border-collapse:collapse; margin:0 0 16px; }
.xe-info-table td{ padding:9px 0; border-bottom:1px solid #eef1f6; font-size:14px; }
.xe-info-table td:first-child{ color:#7a8699; }
.xe-info-table td:last-child{ text-align:right; font-weight:700; color:#0b1f3a; white-space:nowrap; }
.xe-km{ background:#eaf1fb; border-radius:10px; padding:12px 14px; font-size:13.5px; color:#0b1f3a; margin-bottom:16px; }
.xe-km strong{ display:block; margin-bottom:4px; color:#12284c; }
.xe-cta{ display:flex; gap:10px; flex-wrap:wrap; }
.xe-cta .button{ margin:0 !important; }
.single-xe .xe-desc{ margin-top:24px; background:#fff; border:1px solid #eef1f6; border-radius:16px; padding:26px 28px; box-shadow:0 8px 28px rgba(16,33,64,.08); }
@media (max-width:849px){ .single-xe .xe-title{ font-size:24px; } .single-xe .xe-price{ font-size:26px; } }

/* ============ Calculator: giá lăn bánh & trả góp ============ */
.xe-calc{ margin-top:30px; }
.xe-calc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.xe-calc-box{ background:#fff; border:1px solid #eef1f6; border-radius:16px; padding:22px; box-shadow:0 8px 28px rgba(16,33,64,.08); }
.xe-calc-title{ font-weight:800; color:#12284c; font-size:15px; letter-spacing:.04em; margin-bottom:14px; padding-bottom:12px; border-bottom:2px solid #12284c; }
.xe-calc-loc{ display:flex; gap:6px; margin-bottom:14px; background:#f0f3f9; border-radius:10px; padding:4px; }
.xe-calc-loc label{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px; padding:9px 8px; border-radius:8px; font-size:13px; font-weight:700; color:#42506a; cursor:pointer; margin:0; transition:.15s; position:relative; }
.xe-calc-table{ width:100%; border-collapse:collapse; }
.xe-calc-table td{ padding:8px 0; border-bottom:1px dashed #eef1f6; font-size:13.5px; color:#42506a; }
.xe-calc-table td small{ color:#9aa5b8; font-size:11px; }
.xe-calc-table td.v{ text-align:right; font-weight:700; color:#0b1f3a; white-space:nowrap; }
.xe-calc-total{ display:flex; justify-content:space-between; align-items:center; margin-top:14px; padding:12px 14px; background:#eaf1fb; border-radius:10px; }
.xe-calc-total span{ font-weight:600; color:#12284c; }
.xe-calc-total b{ font-size:20px; font-weight:800; color:#e01a2b; }
.xe-calc-field{ margin-bottom:12px; }
.xe-calc-field label{ display:block; font-size:13px; color:#42506a; margin-bottom:5px; }
.xe-calc-field label b{ color:#12284c; }
.xe-calc-field input[type=range]{ width:100%; accent-color:#12284c; }
.xe-calc-field input[type=number], .xe-calc-field select{ width:100%; padding:8px 10px; border:1px solid #d3d9e6; border-radius:8px; font-size:14px; background:#fff; margin:0; height:auto; }
.xe-calc-row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.xe-calc-note{ font-size:11px; color:#9aa5b8; margin:10px 0 0; font-style:italic; }
@media (max-width:849px){ .xe-calc-grid{ grid-template-columns:1fr; } }

/* ==== ưu đãi + chi phí khác trong calculator ==== */
.xe-sub{ font-weight:700; font-size:12px; letter-spacing:.05em; color:#12284c; margin:16px 0 8px; padding-bottom:6px; border-bottom:1px solid #eef1f6; }
.xe-sub small{ color:#9aa5b8; font-weight:500; letter-spacing:0; }
.xe-fees{ display:flex; flex-direction:column; gap:2px; margin-bottom:6px; }
.fee-item{ display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px dashed #eef1f6; font-size:13.5px; cursor:pointer; margin:0; }
.fee-item input{ margin:0; flex:0 0 auto; accent-color:#12284c; }
.fee-item input:disabled{ opacity:.6; }
.fee-name{ flex:1; color:#42506a; }
.fee-name .req{ font-style:normal; font-size:10px; font-weight:700; color:#0a7d33; background:#e5f5ea; padding:1px 6px; border-radius:4px; margin-left:4px; }
.fee-amt{ font-weight:700; color:#0b1f3a; white-space:nowrap; }
.fee-item input:not(:checked) ~ .fee-amt{ color:#b7bfcd; text-decoration:line-through; }

/* ==== chọn ưu đãi (checkbox + tự loại trừ) ==== */
.xe-uds{ display:flex; flex-direction:column; gap:6px; margin-bottom:6px; }
.ud-row{ border:1px solid #eef1f6; border-radius:10px; padding:9px 11px; transition:border-color .15s, background .15s; }
.ud-row:has(.ud-on:checked){ border-color:#12284c; background:#f5f8fe; }
.ud-head{ display:flex; align-items:center; gap:9px; cursor:pointer; margin:0; }
.ud-head input{ margin:0; flex:0 0 auto; accent-color:#12284c; width:17px; height:17px; }
.ud-title{ font-size:13.5px; color:#0b1f3a; font-weight:600; }
.ud-title small{ color:#9aa5b8; font-weight:500; }
.ud-tier{ width:100%; margin:8px 0 0 !important; padding:7px 10px; border:1px solid #d3d9e6; border-radius:8px; font-size:13px; height:auto; background:#fff; }
.ud-row:not(:has(.ud-on:checked)) .ud-tier{ opacity:.55; }

/* ==== tab phương pháp trả góp + bảng trả hàng tháng ==== */
.tg-tabs{ display:flex; gap:6px; margin:14px 0 12px; background:#f0f3f9; border-radius:10px; padding:4px; }
.tg-tab{ flex:1; padding:9px 8px; border:0; background:transparent; border-radius:8px; font-size:13px; font-weight:700; color:#42506a; cursor:pointer; transition:.15s; }
.tg-tab.active{ background:#12284c; color:#fff; }
.tg-sched-wrap{ margin-top:16px; }
.tg-sched-title{ font-weight:700; font-size:12px; letter-spacing:.05em; color:#12284c; margin-bottom:8px; }
.tg-sched-scroll{ max-height:360px; overflow:auto; border:1px solid #eef1f6; border-radius:10px; }
.tg-sched{ width:100%; border-collapse:collapse; font-size:12.5px; }
.tg-sched thead th{ position:sticky; top:0; background:#12284c; color:#fff; font-weight:600; padding:8px 8px; text-align:right; white-space:nowrap; }
.tg-sched thead th:first-child{ text-align:center; }
.tg-sched td{ padding:7px 8px; border-bottom:1px solid #f0f3f9; text-align:right; white-space:nowrap; color:#42506a; }
.tg-sched td:first-child{ text-align:center; font-weight:700; color:#0b1f3a; }
.tg-sched tbody tr:nth-child(even){ background:#f8fafd; }
.tg-sched tbody tr:hover{ background:#eef4fe; }

/* location segmented button */
.xe-calc-loc label:has(input:checked){ background:#12284c; color:#fff; box-shadow:0 1px 4px rgba(16,33,64,.15); }
.xe-calc-loc input{ position:absolute; opacity:0; width:0; height:0; margin:0; }
.xe-calc-loc label.active{ background:#12284c; color:#fff; box-shadow:0 1px 4px rgba(16,33,64,.15); }
.fee-item[hidden]{ display:none !important; }

/* ==== read more mô tả ==== */
.xe-desc-content{ position:relative; overflow:hidden; }
.xe-desc-content.collapsed{ max-height:300px; }
.xe-desc-content.collapsed::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:90px; background:linear-gradient(rgba(255,255,255,0), #fff); pointer-events:none; }
.xe-desc-toggle{ display:block; margin:16px auto 0; padding:9px 26px; border:1.5px solid #12284c; border-radius:40px; background:#fff; color:#12284c; font-weight:600; font-size:14px; cursor:pointer; transition:all .2s; }
.xe-desc-toggle:hover{ background:#12284c; color:#fff; }
.xe-desc-toggle span{ font-size:12px; }

/* ==== chọn phiên bản ==== */
.xe-versions{ margin-bottom:16px; }
.xe-versions-label{ font-size:12px; font-weight:700; letter-spacing:.04em; color:#7a8699; margin-bottom:8px; }
.xe-versions-btns{ display:flex; flex-wrap:wrap; gap:8px; }
.xe-ver{ padding:9px 18px; border:1.5px solid #d3d9e6; border-radius:40px; background:#fff; color:#42506a; font-weight:600; font-size:13.5px; cursor:pointer; transition:all .18s; }
.xe-ver:hover{ border-color:#12284c; color:#12284c; }
.xe-ver.active{ background:#12284c; border-color:#12284c; color:#fff; box-shadow:0 3px 10px rgba(16,33,64,.18); }

/* ==== overlay versions + swatches lên ảnh xe ==== */
.single-xe .xe-main-image{ position:relative; min-height:360px; padding-bottom:74px; overflow:hidden; }
.xe-versions-overlay{ position:absolute; top:14px; left:14px; right:14px; z-index:3; display:flex; flex-direction:row; flex-wrap:wrap; gap:6px; align-items:flex-start; }
.xe-versions-overlay .xe-ver{ width:auto; text-align:left; line-height:1.25; padding:6px 13px; font-size:12px; font-weight:600; border-radius:30px; background:rgba(255,255,255,.82); border:1.5px solid #ccd3e0; color:#42506a; cursor:pointer; box-shadow:0 1px 3px rgba(16,33,64,.1); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); transition:.15s; }
.xe-versions-overlay .xe-ver:hover{ border-color:#12284c; color:#12284c; }
.xe-versions-overlay .xe-ver.active{ background:#12284c; border-color:#12284c; color:#fff; }
.xe-color-overlay{ position:absolute; left:0; right:0; bottom:14px; z-index:3; text-align:center; padding:0 12px; }
.xe-color-overlay .xe-color-name{ display:inline-block; margin:0 0 9px; padding:3px 15px; min-height:0; font-size:13px; font-weight:700; color:#0b1f3a; background:rgba(255,255,255,.82); border-radius:30px; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.xe-color-overlay .xe-color-swatches{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.xe-swatch{ width:30px !important; height:30px !important; min-width:0 !important; min-height:0 !important; max-height:none !important; border-radius:50% !important; border:2px solid #fff; padding:0 !important; cursor:pointer; position:relative; box-sizing:border-box; flex:0 0 auto; line-height:0; box-shadow:0 2px 6px rgba(0,0,0,.3); transition:transform .15s, box-shadow .15s; }
.xe-swatch::after{ content:""; position:absolute; inset:0; border-radius:50%; pointer-events:none; background:radial-gradient(circle at 32% 26%, rgba(255,255,255,.7), rgba(255,255,255,.08) 52%, rgba(0,0,0,.18)); }
.xe-swatch:hover{ transform:scale(1.12); }
.xe-swatch.active{ box-shadow:0 0 0 2px #12284c, 0 2px 7px rgba(0,0,0,.32); }
@media (max-width:600px){ .xe-versions-overlay .xe-ver{ font-size:11px; padding:5px 10px; } .xe-swatch{ width:26px; height:26px; } }

/* breadcrumb row riêng */
.single-xe .xe-breadcrumb{ margin:0 0 14px; }
.single-xe .xe-breadcrumb .current{ color:#0b1f3a; font-weight:600; }

/* ============ Info panel (cột phải – theo mockup) ============ */
.xe-info-panel{ background:#fff; border:1px solid #eef1f6; border-radius:16px; padding:24px 26px; box-shadow:0 8px 28px rgba(16,33,64,.06); }
.xe-info-head{ padding-bottom:16px; border-bottom:1px solid #eef1f6; margin-bottom:16px; }
.single-xe .xe-title{ font-size:28px; font-weight:800; color:#0b1f3a; margin:0; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.xe-badge{ font-size:12px; font-weight:700; color:#1560d1; background:#e7f0fd; border:1px solid #cfe0fb; padding:3px 12px; border-radius:30px; letter-spacing:.02em; }
.xe-subtitle{ margin:8px 0 0; font-size:14px; color:#6b7688; line-height:1.5; }
/* promo */
.xe-promo{ display:flex; gap:12px; align-items:center; background:linear-gradient(135deg,#eef4fe,#e6f0fd); border:1px solid #d7e6fb; border-radius:12px; padding:13px 15px; margin-bottom:18px; }
.xe-promo-ic{ flex:0 0 auto; width:40px; height:40px; border-radius:10px; background:#1560d1; color:#fff; display:flex; align-items:center; justify-content:center; }
.xe-promo-ic svg{ width:22px; height:22px; }
.xe-promo-txt strong{ display:block; font-size:12px; letter-spacing:.03em; color:#1560d1; margin-bottom:2px; }
.xe-promo-txt div{ font-size:13.5px; color:#42506a; line-height:1.4; }
.xe-promo-txt p{ margin:0; }
/* price */
.xe-price-wrap{ display:flex; align-items:flex-end; gap:26px; margin-bottom:18px; flex-wrap:wrap; }
.xe-price-col{ display:flex; flex-direction:column; gap:3px; }
.xe-price-col .lbl{ font-size:12.5px; color:#8a94a6; }
.xe-list-price{ font-size:17px; font-weight:600; color:#98a2b3; text-decoration:line-through; }
.single-xe .xe-info-panel .xe-price{ font-size:30px; font-weight:800; color:#1560d1; line-height:1; margin:0; }
.single-xe .xe-info-panel .xe-price small{ font-size:14px; font-weight:600; }
.xe-list-price small{ font-size:11px; }
/* CTA */
.xe-cta2{ display:flex; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.xe-btn{ flex:1; min-width:150px; display:flex; align-items:center; gap:11px; padding:11px 16px; border-radius:12px; transition:.18s; }
.xe-btn .ic{ flex:0 0 auto; width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; }
.xe-btn .ic svg{ width:20px; height:20px; }
.xe-btn .tx{ display:flex; flex-direction:column; line-height:1.2; }
.xe-btn .tx b{ font-size:14px; } .xe-btn .tx small{ font-size:12px; opacity:.85; }
.xe-btn-zalo{ background:#1560d1; color:#fff; } .xe-btn-zalo:hover{ background:#0f4fb0; color:#fff; }
.xe-btn-zalo .ic{ background:rgba(255,255,255,.2); }
.xe-btn-call{ background:#fff; color:#12284c; border:1.5px solid #1560d1; } .xe-btn-call:hover{ background:#f2f7fe; color:#12284c; }
.xe-btn-call .ic{ background:#e7f0fd; color:#1560d1; }
/* trust badges */
.xe-trust{ display:flex; gap:10px; padding-top:16px; border-top:1px solid #eef1f6; }
.xe-trust-item{ flex:1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; font-size:11.5px; color:#6b7688; line-height:1.3; }
.xe-trust-item .ic{ width:34px; height:34px; border-radius:50%; background:#f3f6fb; color:#1560d1; display:flex; align-items:center; justify-content:center; }
.xe-trust-item .ic svg{ width:18px; height:18px; }
@media (max-width:849px){ .single-xe .xe-title{ font-size:23px; } .single-xe .xe-info-panel .xe-price{ font-size:25px; } }
.xe-price-col[hidden]{ display:none !important; }

/* ============ Thông số cơ bản + Mô tả 50:50 + Gallery ============ */
.xe-sec-title{ font-size:16px; font-weight:800; color:#12284c; margin:0 0 18px; padding-bottom:12px; border-bottom:2px solid #12284c; display:inline-block; }
.xe-specs-card{ background:#fff; border:1px solid #eef1f6; border-radius:16px; padding:24px 26px; box-shadow:0 8px 28px rgba(16,33,64,.06); height:100%; }
.single-xe .xe-desc{ margin-top:0 !important; height:100%; }
.xe-specs-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
.xe-spec{ display:flex; gap:12px; align-items:center; }
.xe-spec .ic{ flex:0 0 auto; width:44px; height:44px; border-radius:12px; background:#eef4fe; color:#1560d1; display:flex; align-items:center; justify-content:center; }
.xe-spec .ic svg{ width:23px; height:23px; }
.xe-spec .tx{ display:flex; flex-direction:column; min-width:0; }
.xe-spec .lbl{ font-size:12px; color:#8a94a6; line-height:1.25; }
.xe-spec .val{ font-size:15px; font-weight:800; color:#0b1f3a; line-height:1.2; }
/* gallery */
.xe-gallery{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.xe-gallery::-webkit-scrollbar{ height:8px; } .xe-gallery::-webkit-scrollbar-thumb{ background:#cbd3e0; border-radius:8px; }
.xe-gallery-item{ height:150px; border-radius:12px; overflow:hidden; position:relative; box-shadow:0 4px 14px rgba(16,33,64,.1); cursor:zoom-in; }
.xe-gallery-item img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s; }
.xe-gallery-item:hover img{ transform:scale(1.06); }
.xe-gallery-item .cap{ position:absolute; left:0; right:0; bottom:0; padding:16px 12px 8px; font-size:12.5px; font-weight:600; color:#fff; background:linear-gradient(transparent,rgba(11,31,58,.75)); }
/* lightbox */
.xe-lightbox{ position:fixed; inset:0; background:rgba(11,31,58,.92); display:none; align-items:center; justify-content:center; z-index:99999; cursor:zoom-out; }
.xe-lightbox.open{ display:flex; }
.xe-lightbox img{ max-width:90%; max-height:88%; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.55); }
.xe-lb-close{ position:absolute; top:16px; right:26px; color:#fff; font-size:40px; line-height:1; cursor:pointer; }
@media (max-width:849px){ .xe-specs-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .xe-specs-grid{ grid-template-columns:1fr; } }

.xe-gallery-card{ background:#fff; border:1px solid #eef1f6; border-radius:16px; padding:24px 26px; box-shadow:0 8px 28px rgba(16,33,64,.06); }
@media (max-width:849px){ .xe-gallery{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:520px){ .xe-gallery{ grid-template-columns:repeat(2,1fr); } .xe-gallery-item{ height:120px; } }

/* Footer: link menu (ux-menu-link) màu trắng */
#footer .ux-menu-link__link,
.footer .ux-menu-link__link,
.footer-widgets .ux-menu-link__link{ color:#fff; }
#footer .ux-menu-link__link:hover,
.footer .ux-menu-link__link:hover,
.footer-widgets .ux-menu-link__link:hover{ color:rgba(255,255,255,.75); }

/* ============ FLOAT CONTACT (Zalo / Nhận báo giá / Hotline) ============ */
.hotline-footer{display:none}
.float-contact{
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 99999;
}
.chat-zalo{
  background:#1464f4;
  border-radius: 3px;
  padding: 0 18px;
  color: white;
  display: block;
  margin-bottom: 6px;
}
.chat-face{
  background: #1464f4;
  border-radius: 3px;
  padding: 0 18px;
  color: white;
  display: block;
  margin-bottom: 6px;
}
.float-contact .hotline{
  background: #1464f4!important;
  border-radius: 3px;
  padding: 0 18px;
  color: white;
  display: block;
  margin-bottom: 6px;
}
.chat-zalo a, .chat-face a, .hotline a{
  font-size: 15px;
  color: white;
  font-weight: 400;
  text-transform: none;
  line-height: 0;
}
@media (max-width: 549px){
  .hotline-footer{display:block; position:fixed; bottom:0; width:100%; height:50px; z-index:99; background:rgba(0,0,0,0.6)}
  .hotline-footer .left{ width:50%; float:left; height:100%; color:white; line-height:43px; text-align:center; }
  .hotline-footer .right{ width:50%; float:right; height:100%; line-height:43px; text-align:center; }
  .absolute-footer{font-size:13px}
  .blog-single .large-9, .blog-single .large-3{ flex-basis:100%; max-width:100%; }
  .blog-single .large-3{padding-left:15px; font-size:15px}
  .blog-single .large-3 .widget-area .section4{display:none}
  .tin-tuc-section .cot1-2{display:none}
  .hotline-footer a{color:white; display:block;}
  .hotline-footer .left a{ background:#1464f4; line-height:40px; margin:5px; border-radius:3px; }
  .hotline-footer .right a{ background:#1464f4; line-height:40px; margin:5px; border-radius:3px; }
  .hotline-footer .left img, .hotline-footer .right img{width:30px; padding-right:10px;}
  .float-contact{display:none}
}

/* ===================== MOBILE FIX — trang chi tiết xe ===================== */
@media (max-width:600px){
  /* Chống tràn ngang: grid item phải co lại được (mặc định min-width:auto) */
  .xe-calc-grid{ min-width:0; }
  .xe-calc-grid > *{ min-width:0; }
  .xe-calc-box{ min-width:0; padding:16px 14px; overflow:hidden; }

  /* Bảng giá lăn bánh: không để cột ép rộng */
  .xe-calc-table{ table-layout:fixed; }
  .xe-calc-table td{ word-break:break-word; }
  .xe-calc-total b{ font-size:18px; }

  /* Bảng trả góp: cuộn ngang GỌN trong khung, không đẩy cả trang */
  .tg-sched-wrap{ max-width:100%; overflow:hidden; }
  .tg-sched-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

  /* Mô tả + Thông số kỹ thuật: giảm padding 2 bên (đang trống nhiều) */
  .single-xe .xe-desc{ padding:16px 10px; }
  .xe-specs-card{ padding:16px 10px; }
}

/* ===================== CỘT TRÁI: TABS Màu xe / Hình xe ===================== */
.xe-media-tabs{ display:flex; gap:8px; margin-bottom:14px; }
.xe-media-tab{ flex:0 0 auto; padding:9px 22px; border:1.5px solid #e3e8f0; background:#fff; color:#42506a; font-weight:700; font-size:13.5px; border-radius:40px; cursor:pointer; transition:.18s; margin:0; line-height:1.2; }
.xe-media-tab:hover{ border-color:#12284c; color:#12284c; }
.xe-media-tab.active{ background:#12284c; border-color:#12284c; color:#fff; }
.xe-media-panel[hidden]{ display:none !important; }

/* Tab Hình xe: ảnh lớn + thumbnail */
.xe-photo-main{ background:#f6f8fb; border:1px solid #eef1f6; border-radius:16px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.xe-photo-main img{ width:100%; height:auto; display:block; object-fit:contain; }
.xe-photo-thumbs{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px; margin-top:12px; }
.xe-photo-thumb{ padding:0; border:2px solid transparent; border-radius:10px; overflow:hidden; cursor:pointer; background:#f6f8fb; aspect-ratio:4/3; margin:0; transition:.15s; min-width:0; }
.xe-photo-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.xe-photo-thumb.active{ border-color:#12284c; }
.xe-photo-thumb:hover{ border-color:#9fb3d6; }
@media (max-width:600px){ .xe-photo-thumbs{ grid-template-columns:repeat(4,1fr); gap:6px; } .xe-media-tab{ flex:1; text-align:center; padding:9px 10px; } }