/* Listing detail clean CSS: moved from show.blade.php to load early in . */ .ct5-cluster-card{border:1px solid rgba(15,23,42,.08);background:linear-gradient(180deg,#fff,#f8fafc)} .ct5-cluster-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:10px} .ct5-cluster-head h2{margin:8px 0 0;font-size:22px;line-height:1.25} .ct5-asset-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#eef6ff;color:#075985;font-weight:700;font-size:13px} .ct5-cluster-money-link{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:9px 14px;background:#0f172a;color:#fff;text-decoration:none;font-weight:700;white-space:nowrap} .ct5-cluster-money-link:hover{color:#fff;opacity:.92} .ct5-cluster-intro{margin:0 0 14px;color:#475569;line-height:1.65} .ct5-cluster-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .ct5-cluster-link{display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid rgba(15,23,42,.08);text-decoration:none;color:#0f172a;font-weight:700;line-height:1.35} .ct5-cluster-link:hover{border-color:rgba(14,165,233,.45);box-shadow:0 8px 24px rgba(15,23,42,.08)} .ct5-cluster-link--money_shop{background:#fff7ed;border-color:#fed7aa;color:#9a3412} @media(max-width:767px){.ct5-cluster-head{display:block}.ct5-cluster-money-link{margin-top:10px}.ct5-cluster-links{grid-template-columns:1fr}} .ct5-feature-grid .ct5-feature-call strong{display:flex;align-items:center;gap:8px;flex-wrap:wrap} .ct5-feature-grid .ct5-feature-call a{color:#ef3b1f;text-decoration:none;font-weight:800} .ct5-feature-grid .ct5-feature-call a:hover{text-decoration:underline} .ct5-description-source{margin:0 0 12px;font-size:13px;font-weight:800;color:#64748b;text-transform:uppercase;letter-spacing:.03em} .ct5-auto-seo-support{margin-top:22px;padding:18px;border-radius:18px;background:#f8fafc;border:1px dashed rgba(15,23,42,.16)} .ct5-auto-seo-head{margin-bottom:10px}.ct5-auto-seo-head h3{margin:8px 0 0;font-size:21px}.ct5-auto-seo-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#ecfeff;color:#0e7490;font-weight:800;font-size:13px} .ct5-auto-seo-support h4{margin:16px 0 8px;font-size:18px}.ct5-auto-seo-support p,.ct5-auto-seo-support li{line-height:1.75} .ct5-hub-group{margin-top:14px}.ct5-hub-group h3{font-size:16px;margin:0 0 8px;color:#334155}.ct5-hub-group .ct5-cluster-links{margin-top:0} .ct5-contextual-links{border:1px solid rgba(14,165,233,.18);background:linear-gradient(180deg,#ffffff,#f8fbff)} .ct5-contextual-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px} .ct5-contextual-head h2{margin:0;font-size:22px;line-height:1.25;color:#0f172a} .ct5-contextual-groups{display:grid;gap:16px} .ct5-contextual-group h3{margin:0 0 9px;font-size:16px;color:#334155} .ct5-contextual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .ct5-contextual-item{display:block;text-decoration:none;border:1px solid rgba(15,23,42,.08);border-radius:15px;background:#fff;padding:12px 14px;color:#0f172a} .ct5-contextual-item:hover{border-color:rgba(14,165,233,.45);box-shadow:0 10px 26px rgba(15,23,42,.08)} .ct5-contextual-item span{display:block;font-weight:800;line-height:1.35} @media(max-width:767px){.ct5-contextual-grid{grid-template-columns:1fr}} .ct5-map-embed{position:relative;overflow:hidden;border-radius:18px;border:1px solid rgba(15,23,42,.08);background:#f8fafc;min-height:280px} .ct5-map-embed iframe{display:block;width:100%;height:320px;border:0} .ct5-map-meta{display:grid;gap:10px;margin-top:12px} .ct5-map-meta-item{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:14px;background:#fff;border:1px solid rgba(15,23,42,.08);color:#334155;line-height:1.45} .ct5-map-meta-item i{color:#ef3b1f;font-size:18px;margin-top:1px} .ct5-map-meta-item strong{display:block;color:#0f172a;margin-bottom:2px} .ct5-map-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px} .ct5-map-actions a{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 14px;text-decoration:none;font-weight:800;background:#0f172a;color:#fff} .ct5-map-actions a:hover{color:#fff;opacity:.92} @media (max-width: 991.98px){ .ct5-map-embed{ min-height:180px !important; } .ct5-map-embed iframe{ height:180px !important; } } @media (max-width: 991px){ .ct5-listing-page .ct5-container{ padding-left:8px!important; padding-right:8px!important; } .ct5-listing-page .ct5-panel.ct5-hero-card{ padding:0!important; background:#fff!important; border-radius:14px!important; overflow:hidden!important; } .ct5-listing-page .ct5-gallery-shell{ margin:0!important; border-radius:10px!important; overflow:hidden!important; background:#f8fafc!important; touch-action:pan-y!important; -webkit-user-select:none!important; user-select:none!important; } .ct5-listing-page .ct5-main-photo{ display:block!important; border-radius:10px!important; overflow:hidden!important; background:#f8fafc!important; } .ct5-listing-page .ct5-main-photo img{ display:block!important; width:100%!important; height:auto!important; aspect-ratio:4/3!important; max-height:none!important; object-fit:cover!important; border-radius:10px!important; background:#f8fafc!important; } .ct5-listing-page .ct5-thumb-row{ width:100%!important; margin:10px 0 0!important; padding:0 0 10px!important; display:flex!important; gap:10px!important; overflow-x:auto!important; overflow-y:hidden!important; scroll-snap-type:x proximity!important; scrollbar-width:none!important; box-sizing:border-box!important; } .ct5-listing-page .ct5-thumb-row::-webkit-scrollbar{display:none!important;} .ct5-listing-page .ct5-thumb:first-child{margin-left:0!important;} .ct5-listing-page .ct5-thumb{ flex:0 0 92px!important; width:92px!important; height:58px!important; padding:0!important; margin:0!important; border-radius:8px!important; overflow:hidden!important; scroll-snap-align:start!important; } .ct5-listing-page .ct5-thumb img{ width:100%!important; height:100%!important; object-fit:cover!important; border-radius:7px!important; } .ct5-listing-page .ct5-title-block{ padding:16px 0 20px!important; margin:0!important; border-top:1px solid #eef0f3!important; } .ct5-listing-page .ct5-title-block h1, .ct5-listing-page .ct5-price-row, .ct5-listing-page .ct5-address, .ct5-listing-page .ct5-posted{ margin-left:0!important; margin-right:0!important; padding-left:0!important; padding-right:0!important; } .ct5-listing-page .ct5-title-block h1{ font-size:22px!important; line-height:1.32!important; margin-bottom:10px!important; } .ct5-listing-page .ct5-price-row{ display:block!important; margin-bottom:12px!important; } .ct5-listing-page .ct5-price-row strong{ display:block!important; font-size:23px!important; line-height:1.2!important; color:#e11d48!important; margin-bottom:10px!important; } .ct5-listing-page .ct5-price-row span{ display:block!important; font-size:16px!important; line-height:1.72!important; color:#6b7280!important; } .ct5-listing-page .ct5-address, .ct5-listing-page .ct5-posted{ display:flex!important; align-items:center!important; gap:12px!important; font-size:17px!important; line-height:1.35!important; color:#111827!important; margin-top:14px!important; } .ct5-listing-page .ct5-address i, .ct5-listing-page .ct5-posted i{ width:26px!important; flex:0 0 26px!important; text-align:center!important; font-size:23px!important; color:#555!important; } .ct5-listing-page .ct5-feature-card{ padding:16px!important; border-radius:14px!important; } .ct5-listing-page .ct5-feature-card h2{ font-size:22px!important; margin:0 0 14px!important; } .ct5-listing-page .ct5-feature-grid{ display:block!important; } .ct5-listing-page .ct5-feature-grid > div{ display:grid!important; grid-template-columns:28px minmax(86px,auto) minmax(0,1fr)!important; align-items:center!important; column-gap:10px!important; padding:12px 0!important; border-bottom:1px solid #eef0f3!important; min-height:0!important; } .ct5-listing-page .ct5-feature-grid > div:last-child{border-bottom:0!important;} .ct5-listing-page .ct5-feature-grid > div i{ grid-column:1!important; width:28px!important; margin:0!important; font-size:20px!important; color:#111!important; text-align:left!important; } .ct5-listing-page .ct5-feature-grid > div span{ grid-column:2!important; margin:0!important; font-size:16px!important; line-height:1.3!important; color:#4b5563!important; white-space:nowrap!important; } .ct5-listing-page .ct5-feature-grid > div span::after{content:':';} .ct5-listing-page .ct5-feature-grid > div strong{ grid-column:3!important; display:block!important; margin:0!important; font-size:16px!important; line-height:1.35!important; color:#111827!important; font-weight:800!important; min-width:0!important; overflow:hidden!important; text-overflow:ellipsis!important; white-space:nowrap!important; } .ct5-listing-page .ct5-feature-grid .ct5-feature-call strong{ display:block!important; white-space:nowrap!important; } .ct5-listing-page .ct5-feature-grid .ct5-feature-call a{ display:inline!important; white-space:nowrap!important; } } @media (max-width:575px){ .ct5-listing-page .ct5-container{padding-left:8px!important;padding-right:8px!important;} .ct5-listing-page .ct5-thumb{flex-basis:88px!important;width:88px!important;height:65px!important;} .ct5-listing-page .ct5-title-block h1{font-size:21px!important;} .ct5-listing-page .ct5-feature-grid > div{ grid-template-columns:28px minmax(78px,auto) minmax(0,1fr)!important; column-gap:8px!important; } } /* Gallery chuẩn chung PC + mobile */ .ct5-listing-page .ct5-gallery-shell{ position:relative!important; width:100%!important; aspect-ratio:4/3!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:hidden!important; border-radius:12px!important; background:#0b0b0b!important; } .ct5-listing-page .ct5-main-photo{ position:absolute!important; inset:0!important; display:block!important; width:100%!important; height:100%!important; overflow:hidden!important; border-radius:inherit!important; background:#0b0b0b!important; } .ct5-listing-page .ct5-main-photo::before, .ct5-listing-page .ct5-main-photo::after{ content:""!important; position:absolute!important; top:0!important; bottom:0!important; width:50%!important; z-index:0!important; opacity:0!important; pointer-events:none!important; background-size:cover!important; background-position:center!important; background-repeat:no-repeat!important; transform:scale(1.03)!important; filter:blur(2px)!important; } .ct5-listing-page .ct5-main-photo::before{left:0!important;background-image:var(--ct5-prev-photo)!important;} .ct5-listing-page .ct5-main-photo::after{right:0!important;background-image:var(--ct5-next-photo)!important;} .ct5-listing-page .ct5-main-photo.ct5-sidefill-on::before, .ct5-listing-page .ct5-main-photo.ct5-sidefill-on::after{opacity:1!important;} .ct5-listing-page .ct5-main-photo img#ct5MainImage{ position:relative!important; z-index:1!important; display:block!important; width:100%!important; height:100%!important; max-width:100%!important; max-height:100%!important; margin:0 auto!important; border-radius:inherit!important; background:transparent!important; object-position:center center!important; } /* Ảnh chuẩn 4:3: full vùng gallery như PC, không bù */ .ct5-listing-page .ct5-main-photo img#ct5MainImage.ct5-fit-4x3{ object-fit:cover!important; } /* Ảnh vuông/đứng: giữ full ảnh, chỉ lộ hai bên để nền ảnh kế tiếp bù */ .ct5-listing-page .ct5-main-photo img#ct5MainImage.ct5-fit-sidefill{ object-fit:contain!important; } .ct5-listing-page .ct5-gallery-nav, .ct5-listing-page .ct5-gallery-tools{z-index:3!important;} .ct5-listing-page .ct5-thumb-row{ width:100%!important; margin:12px 0 0!important; padding:0 0 10px!important; display:flex!important; align-items:flex-start!important; gap:12px!important; overflow-x:auto!important; overflow-y:hidden!important; scrollbar-width:none!important; box-sizing:border-box!important; } .ct5-listing-page .ct5-thumb-row::-webkit-scrollbar{display:none!important;} .ct5-listing-page .ct5-thumb{ flex:0 0 112px!important; width:112px!important; aspect-ratio:4/3!important; height:auto!important; padding:0!important; margin:0!important; border-radius:9px!important; overflow:hidden!important; position:relative!important; background:#f1f5f9!important; } .ct5-listing-page .ct5-thumb img{ display:block!important; width:100%!important; height:100%!important; object-fit:cover!important; border-radius:inherit!important; } .ct5-listing-page .ct5-thumb.has-more::after{ content:""!important; position:absolute!important; inset:0!important; z-index:2!important; background:rgba(0,0,0,.46)!important; pointer-events:none!important; } .ct5-listing-page .ct5-thumb-more{ position:absolute!important; inset:0!important; z-index:3!important; display:flex!important; align-items:center!important; justify-content:center!important; color:#fff!important; font-size:24px!important; font-weight:900!important; line-height:1!important; text-shadow:0 1px 2px rgba(0,0,0,.35)!important; pointer-events:none!important; } @media (max-width: 991px){ .ct5-listing-page .ct5-container{ width:100%!important; max-width:100%!important; padding-left:8px!important; padding-right:8px!important; box-sizing:border-box!important; } .ct5-listing-page .ct5-panel.ct5-hero-card{ padding:0!important; border-radius:14px!important; overflow:hidden!important; background:#fff!important; } .ct5-listing-page .ct5-gallery-shell{ border-radius:12px!important; touch-action:pan-y!important; } .ct5-listing-page .ct5-thumb-row{ gap:10px!important; padding-left:0!important; padding-right:0!important; scroll-snap-type:x proximity!important; } .ct5-listing-page .ct5-thumb{ flex:0 0 calc((100vw - 16px - 40px) / 5)!important; width:calc((100vw - 16px - 40px) / 5)!important; max-width:96px!important; min-width:68px!important; aspect-ratio:4/3!important; scroll-snap-align:start!important; border-radius:8px!important; } .ct5-listing-page .ct5-title-block{ padding:18px 18px 22px!important; margin:0!important; border-top:1px solid #eef0f3!important; } .ct5-listing-page .ct5-title-block h1{font-size:22px!important;line-height:1.35!important;margin:0 0 12px!important;} .ct5-listing-page .ct5-price-row{display:block!important;margin:0 0 12px!important;} .ct5-listing-page .ct5-price-row strong{display:block!important;font-size:23px!important;color:#e11d48!important;margin-bottom:10px!important;} .ct5-listing-page .ct5-price-row span{display:block!important;font-size:16px!important;line-height:1.75!important;color:#6b7280!important;} .ct5-listing-page .ct5-address, .ct5-listing-page .ct5-posted{display:flex!important;align-items:center!important;gap:12px!important;margin-top:14px!important;font-size:17px!important;} .ct5-listing-page .ct5-address i, .ct5-listing-page .ct5-posted i{width:26px!important;flex:0 0 26px!important;text-align:center!important;font-size:23px!important;color:#555!important;} .ct5-listing-page .ct5-feature-grid{display:block!important;} .ct5-listing-page .ct5-feature-grid > div{display:grid!important;grid-template-columns:28px minmax(86px,auto) minmax(0,1fr)!important;align-items:center!important;column-gap:10px!important;padding:12px 0!important;border-bottom:1px solid #eef0f3!important;} .ct5-listing-page .ct5-feature-grid > div:last-child{border-bottom:0!important;} .ct5-listing-page .ct5-feature-grid > div i{grid-column:1!important;width:28px!important;margin:0!important;font-size:20px!important;color:#111!important;text-align:left!important;} .ct5-listing-page .ct5-feature-grid > div span{grid-column:2!important;margin:0!important;font-size:16px!important;color:#4b5563!important;white-space:nowrap!important;} .ct5-listing-page .ct5-feature-grid > div span::after{content:':'!important;} .ct5-listing-page .ct5-feature-grid > div strong{grid-column:3!important;margin:0!important;font-size:16px!important;font-weight:800!important;color:#111827!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;} } @media (max-width: 991px){ html, body{overflow-x:hidden!important;} .ct5-page.ct5-listing-page{ padding-top:8px!important; padding-bottom:18px!important; background:#f5f5f5!important; } .ct5-listing-page .ct5-container{ width:100%!important; max-width:100%!important; padding-left:8px!important; padding-right:8px!important; margin-left:auto!important; margin-right:auto!important; box-sizing:border-box!important; } .ct5-listing-page .ct5-detail-banner, .ct5-listing-page .ct5-detail-banner-top, .ct5-listing-page .ct5-detail-banner-bottom{ display:block!important; width:100%!important; max-width:100%!important; margin:0 0 10px!important; border-radius:10px!important; overflow:hidden!important; background:#fff!important; clear:both!important; box-sizing:border-box!important; opacity:1!important; visibility:visible!important; } .ct5-listing-page .ct5-detail-banner .front-banner, .ct5-listing-page .ct5-detail-banner .front-banner img{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:72px!important; max-height:135px!important; object-fit:cover!important; border-radius:10px!important; } .ct5-listing-page .ct5-breadcrumb{ display:flex!important; align-items:center!important; gap:6px!important; width:100%!important; max-width:100%!important; margin:0 0 10px!important; padding:9px 10px!important; overflow-x:auto!important; white-space:nowrap!important; scrollbar-width:none!important; background:#fff!important; border-radius:10px!important; box-sizing:border-box!important; box-shadow:none!important; opacity:1!important; visibility:visible!important; } .ct5-listing-page .ct5-breadcrumb::-webkit-scrollbar{display:none!important;} .ct5-listing-page .ct5-detail-layout{ display:block!important; width:100%!important; max-width:100%!important; margin:0!important; padding:0!important; box-sizing:border-box!important; } .ct5-listing-page .ct5-detail-main, .ct5-listing-page .ct5-detail-sidebar, .ct5-listing-page .ct5-panel, .ct5-listing-page .ct5-wide-related{ width:100%!important; max-width:100%!important; box-sizing:border-box!important; } #ct5StickyTabs.ct5-scrollbar{ display:block!important; position:fixed!important; top:0!important; left:0!important; right:0!important; width:100vw!important; max-width:100vw!important; margin:0!important; padding:0!important; z-index:2147483000!important; background:#fff!important; border:0!important; border-bottom:1px solid #e5e7eb!important; box-shadow:0 4px 16px rgba(15,23,42,.12)!important; opacity:0!important; visibility:hidden!important; pointer-events:none!important; transform:translate3d(0,-100%,0)!important; transition:transform .18s ease, opacity .18s ease!important; } body.ct5-fixed-tabs-show #ct5StickyTabs.ct5-scrollbar, body.ct5-fixed-tabs-show #ct5StickyTabs.ct5-scrollbar.is-visible{ display:block!important; opacity:1!important; visibility:visible!important; pointer-events:auto!important; transform:translate3d(0,0,0)!important; } #ct5StickyTabs .ct5-scrollbar-inner{ width:100%!important; max-width:100%!important; min-height:0!important; margin:0!important; padding:0 10px!important; display:grid!important; grid-template-columns:1fr!important; grid-template-rows:56px 44px!important; gap:0!important; box-sizing:border-box!important; background:#fff!important; } #ct5StickyTabs .ct5-sticky-top-row{ min-width:0!important; display:flex!important; align-items:center!important; justify-content:space-between!important; gap:8px!important; border-bottom:1px solid #f1f5f9!important; } #ct5StickyTabs .ct5-mini-product{ min-width:0!important; display:flex!important; align-items:center!important; gap:8px!important; padding:6px 0!important; } #ct5StickyTabs .ct5-mini-product img{ width:42px!important; height:42px!important; flex:0 0 42px!important; border-radius:7px!important; object-fit:cover!important; } #ct5StickyTabs .ct5-mini-product strong{ max-width:calc(100vw - 78px)!important; display:block!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; font-size:14px!important; line-height:1.2!important; font-weight:900!important; color:#111!important; } #ct5StickyTabs .ct5-mini-product span{ display:block!important; margin-top:2px!important; font-size:13px!important; line-height:1.1!important; font-weight:900!important; color:#ef3b1f!important; } #ct5StickyTabs .ct5-top-actions{display:none!important;} #ct5StickyTabs .ct5-tabs{ display:flex!important; align-items:stretch!important; justify-content:space-between!important; gap:0!important; width:100%!important; overflow-x:auto!important; scrollbar-width:none!important; border:0!important; background:#fff!important; } #ct5StickyTabs .ct5-tabs::-webkit-scrollbar{display:none!important;} #ct5StickyTabs .ct5-tabs a{ flex:1 0 auto!important; min-width:78px!important; height:44px!important; display:flex!important; align-items:center!important; justify-content:center!important; padding:0 8px!important; border-bottom:3px solid transparent!important; text-decoration:none!important; font-size:14px!important; font-weight:900!important; color:#4b5563!important; background:#fff!important; } #ct5StickyTabs .ct5-tabs a.is-active, #ct5StickyTabs .ct5-tabs a:hover{ color:#111!important; border-bottom-color:#111!important; } .ct5-listing-page #ct5-overview, .ct5-listing-page #ct5-features, .ct5-listing-page #ct5-description, .ct5-listing-page #ct5-map{scroll-margin-top:112px!important;} } @media (max-width: 991px){ .ct5-listing-page .ct5-detail-banner-mobile-fallback, .ct5-listing-page .ct5-detail-banner-top{ display:block!important; position:relative!important; z-index:2!important; width:100%!important; margin:0 0 10px!important; padding:0!important; opacity:1!important; visibility:visible!important; transform:none!important; overflow:hidden!important; border-radius:10px!important; background:#fff!important; } .ct5-listing-page .ct5-detail-banner-top .front-banner, .ct5-listing-page .ct5-detail-banner-top .front-banner a, .ct5-listing-page .ct5-detail-banner-top .front-banner img{ display:block!important; width:100%!important; max-width:100%!important; min-height:72px!important; height:auto!important; max-height:135px!important; object-fit:cover!important; border-radius:10px!important; } } @media (max-width: 991.98px){ body.ct5-listing-detail-page{ overflow-x:hidden!important; padding-bottom:70px!important; } body.ct5-listing-detail-page main.w11-pro-main{ min-height:0!important; padding-top:0!important; padding-bottom:0!important; margin-bottom:0!important; content-visibility:visible!important; contain-intrinsic-size:auto!important; contain:none!important; background:#f5f5f5!important; } body.ct5-listing-detail-page .alogiare-mobile-app-header{ display:block!important; position:relative!important; top:auto!important; z-index:50!important; width:100%!important; max-width:100%!important; flex:0 0 auto!important; margin:0!important; padding:0!important; transform:none!important; } body.ct5-listing-detail-page .alogiare-mobile-appbar{ min-height:56px!important; height:56px!important; box-sizing:border-box!important; } body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ margin:0!important; padding:10px 0 0!important; min-height:0!important; background:#f5f5f5!important; overflow:visible!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-container{ padding-left:8px!important; padding-right:8px!important; padding-bottom:0!important; margin-bottom:0!important; min-height:0!important; } /* Banner top: không crop / không bị ăn lên trên. Ảnh banner hiện đủ như trang mobile gốc. */ body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{ display:block!important; position:relative!important; z-index:1!important; width:100%!important; max-width:100%!important; margin:0 0 12px!important; padding:0!important; overflow:hidden!important; border-radius:12px!important; background:#fff!important; box-shadow:none!important; opacity:1!important; visibility:visible!important; transform:none!important; clear:both!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner a, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner a{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; margin:0!important; padding:0!important; overflow:hidden!important; border-radius:12px!important; background:#fff!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner img, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner img{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; aspect-ratio:auto!important; object-fit:contain!important; object-position:center center!important; border-radius:12px!important; background:#fff!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-breadcrumb{ margin:0 0 12px!important; clear:both!important; } /* Bottom banner: sát footer, không tạo khoảng trắng lớn. */ body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom{ display:block!important; position:relative!important; width:100%!important; max-width:100%!important; margin:12px 0 6px!important; padding:0!important; overflow:hidden!important; border-radius:12px!important; background:#fff!important; box-shadow:none!important; clear:both!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom .front-banner, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom .front-banner a{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; margin:0!important; padding:0!important; overflow:hidden!important; background:#fff!important; border-radius:12px!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom .front-banner img{ display:block!important; width:100%!important; max-width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; object-fit:contain!important; object-position:center center!important; border-radius:12px!important; background:#fff!important; } body.ct5-listing-detail-page .page-region, body.ct5-listing-detail-page .page-region-bottom, body.ct5-listing-detail-page .page-region-after-content{ margin-top:0!important; margin-bottom:0!important; padding-top:0!important; padding-bottom:0!important; min-height:0!important; } body.ct5-listing-detail-page .alogiare-footer{ margin-top:8px!important; padding-top:22px!important; padding-bottom:72px!important; } body.ct5-listing-detail-page .alogiare-mobile-bottom-nav{ display:grid!important; position:fixed!important; left:0!important; right:0!important; bottom:0!important; z-index:2147482500!important; transform:none!important; opacity:1!important; visibility:visible!important; } } /* Final detail override: giữ navbar PC/mobile ở layout chung, không kéo vào container riêng. */ body.ct5-listing-detail-page .header-wow, body.ct5-listing-detail-page .alogiare-mobile-app-header{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; bottom:auto!important; transform:none!important; z-index:50!important; } body.ct5-listing-detail-page main.w11-pro-main{padding-top:0!important;margin-top:6px!important;} body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{position:relative!important;z-index:1!important;clear:both!important;margin-top:6px!important;} body.ct5-listing-detail-page .ct5-listing-page .ct5-title-block{padding-left:18px!important;padding-right:18px!important;box-sizing:border-box!important;} @media(max-width:991.98px){body.ct5-listing-detail-page .ct5-listing-page .ct5-title-block{padding-left:16px!important;padding-right:16px!important;}} body.ct5-listing-detail-page main.w11-pro-main > .header-wow, body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; bottom:auto!important; transform:none!important; z-index:30!important; width:100%!important; clear:both!important; margin:0 0 6px!important; } body.ct5-listing-detail-page main.w11-pro-main > .header-wow{ display:block!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page main.w11-pro-main > .header-wow{display:none!important;} body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{display:block!important;} } @media(min-width:992px){ body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{display:none!important;} } body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ margin-top:0!important; padding-top:0!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{ position:relative!important; z-index:1!important; clear:both!important; margin-top:0!important; } /* DTX final safety: navbar/detail spacing, loaded early to reduce layout shift. */ body.ct5-listing-detail-page main.w11-pro-main > .header-wow, body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; bottom:auto!important; transform:none!important; z-index:30!important; width:100%!important; clear:both!important; margin:0 0 6px!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page main.w11-pro-main > .header-wow{display:none!important;} body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{display:block!important;} } @media(min-width:992px){ body.ct5-listing-detail-page main.w11-pro-main > .header-wow{display:block!important;} body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header{display:none!important;} body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom{margin-bottom:8px!important;} body.ct5-listing-detail-page .alogiare-footer{margin-top:8px!important;} } body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{ margin-top:0!important; } /* PATCH ONLY 2026-05-17: PC listing detail - triệt khoảng trắng bottom + khóa CLS khu footer/banner. */ @media (min-width: 992px){ html body.ct5-listing-detail-page .w11-pro-main{ min-height:auto!important; padding-bottom:0!important; margin-bottom:0!important; display:block!important; } html body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ min-height:0!important; padding-bottom:10px!important; margin-bottom:0!important; } html body.ct5-listing-detail-page .ct5-listing-page > .ct5-container{ padding-bottom:0!important; margin-bottom:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom{ margin-top:12px!important; margin-bottom:0!important; padding-bottom:0!important; min-height:0!important; height:auto!important; line-height:0!important; overflow:hidden!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom .front-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom .frontend-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom [class*="banner"]{ margin-bottom:0!important; padding-bottom:0!important; min-height:0!important; line-height:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom img{ display:block!important; margin:0!important; width:100%!important; max-width:100%!important; height:auto!important; max-height:150px!important; object-fit:cover!important; } html body.ct5-listing-detail-page .ct5-listing-page + .page-region, html body.ct5-listing-detail-page .ct5-listing-page + .page-region-bottom, html body.ct5-listing-detail-page .page-region-bottom, html body.ct5-listing-detail-page .page-region-after-content, html body.ct5-listing-detail-page main.w11-pro-main > .page-region, html body.ct5-listing-detail-page main.w11-pro-main > .page-region-bottom{ display:block!important; min-height:0!important; height:auto!important; margin:0!important; padding:0!important; } html body.ct5-listing-detail-page .alogiare-footer, html body.ct5-listing-detail-page footer, html body.ct5-listing-detail-page .w11-footer{ margin-top:0!important; clear:both!important; } } /* PATCH ONLY 2026-05-17: critical layout backup khi CSS chính bị cache trễ. */ body.ct5-listing-detail-page .ct5-detail-layout{align-items:start!important;} body.ct5-listing-detail-page .ct5-gallery-shell,body.ct5-listing-detail-page .ct5-main-photo{contain:layout paint;} body.ct5-listing-detail-page .ct5-main-photo{min-height:260px;} @media(max-width:991.98px){body.ct5-listing-detail-page .ct5-main-photo{min-height:220px;}} /* DTX PATCH 2026-05-17B: PC listing detail sync with home 1280 container + stable first paint. */ @media (min-width: 992px){ html body.ct5-listing-detail-page, html body.ct5-listing-detail-page .w11-pro-main, html body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ width:100%!important; max-width:100%!important; overflow-x:hidden!important; background:#f4f4f4!important; } html body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ padding:0 0 10px!important; margin:0!important; min-height:0!important; } html body.ct5-listing-detail-page .ct5-listing-page > .ct5-container, html body.ct5-listing-detail-page .ct5-listing-page .ct5-container{ width:min(1280px, calc(100% - 32px))!important; max-width:1280px!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important; box-sizing:border-box!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom, html body.ct5-listing-detail-page .ct5-listing-page .ct5-breadcrumb, html body.ct5-listing-detail-page .ct5-listing-page .ct5-scrollbar, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-layout, html body.ct5-listing-detail-page .ct5-listing-page .ct5-wide-related{ width:100%!important; max-width:100%!important; margin-left:0!important; margin-right:0!important; box-sizing:border-box!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-layout{ display:grid!important; grid-template-columns:minmax(0, 860px) 400px!important; gap:20px!important; align-items:start!important; justify-content:stretch!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-main, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-sidebar{ width:100%!important; max-width:100%!important; min-width:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top{ margin-top:0!important; margin-bottom:10px!important; border-radius:12px!important; overflow:hidden!important; line-height:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom{ margin:12px 0 0!important; padding:0!important; border-radius:12px!important; overflow:hidden!important; line-height:0!important; clear:both!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner .front-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner .front-banner a, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner img{ display:block!important; width:100%!important; max-width:100%!important; margin:0!important; padding:0!important; box-sizing:border-box!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top img{ height:auto!important; max-height:155px!important; object-fit:cover!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-bottom img{ height:auto!important; max-height:150px!important; object-fit:cover!important; } html body.ct5-listing-detail-page .alogiare-footer, html body.ct5-listing-detail-page .dtf-premium-footer, html body.ct5-listing-detail-page footer{ margin-top:0!important; clear:both!important; } } /* DTX PATCH 2026-05-17C: final listing detail FOUC/CLS fix. Root cause: detail page used to disable global navbar and render inside content. This override keeps the detail content stable after switching back to the global navbar flow used by /shop pages. */ body.ct5-listing-detail-page main.w11-pro-main{ display:block!important; min-height:0!important; margin:0!important; padding:0!important; background:#f4f4f4!important; } body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ display:block!important; width:100%!important; max-width:100%!important; margin:0!important; padding:10px 0 10px!important; background:#f4f4f4!important; overflow-x:hidden!important; } body.ct5-listing-detail-page .ct5-listing-page > .ct5-container{ width:min(1280px, calc(100% - 32px))!important; max-width:1280px!important; margin-left:auto!important; margin-right:auto!important; padding-left:0!important; padding-right:0!important; box-sizing:border-box!important; } body.ct5-listing-detail-page .ct5-detail-banner, body.ct5-listing-detail-page .ct5-detail-banner .front-banner, body.ct5-listing-detail-page .ct5-detail-banner .front-banner a{ display:block!important; width:100%!important; max-width:100%!important; margin-left:0!important; margin-right:0!important; padding:0!important; box-sizing:border-box!important; line-height:0!important; overflow:hidden!important; } body.ct5-listing-detail-page .ct5-detail-banner img{ display:block!important; width:100%!important; max-width:100%!important; margin:0!important; padding:0!important; object-fit:cover!important; } body.ct5-listing-detail-page .ct5-detail-banner-top{ margin:0 0 10px!important; border-radius:12px!important; } body.ct5-listing-detail-page .ct5-detail-banner-top img{ height:135px!important; max-height:135px!important; } body.ct5-listing-detail-page .ct5-breadcrumb{ margin:0 0 12px!important; } body.ct5-listing-detail-page .ct5-detail-layout{ display:grid!important; grid-template-columns:minmax(0, 860px) 400px!important; gap:20px!important; align-items:start!important; justify-content:stretch!important; width:100%!important; max-width:100%!important; margin:0!important; box-sizing:border-box!important; } body.ct5-listing-detail-page .ct5-detail-main, body.ct5-listing-detail-page .ct5-detail-sidebar{ min-width:0!important; width:100%!important; max-width:100%!important; } body.ct5-listing-detail-page .ct5-gallery-shell, body.ct5-listing-detail-page .ct5-main-photo{ contain:layout paint!important; } body.ct5-listing-detail-page .ct5-main-photo{ aspect-ratio:4/3!important; min-height:0!important; background:#eef2f7!important; } body.ct5-listing-detail-page .ct5-main-photo img{ width:100%!important; height:100%!important; object-fit:cover!important; } body.ct5-listing-detail-page .ct5-detail-banner-bottom{ margin:12px 0 0!important; border-radius:12px!important; clear:both!important; } body.ct5-listing-detail-page .ct5-detail-banner-bottom img{ height:135px!important; max-height:135px!important; } body.ct5-listing-detail-page .ct5-page.ct5-listing-page + .page-region, body.ct5-listing-detail-page .page-region-after-content, body.ct5-listing-detail-page .page-region-bottom{ margin:0!important; padding:0!important; min-height:0!important; } body.ct5-listing-detail-page .dtf-premium-footer, body.ct5-listing-detail-page footer{ margin-top:0!important; clear:both!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page .ct5-page.ct5-listing-page{padding:8px 0 12px!important;} body.ct5-listing-detail-page .ct5-listing-page > .ct5-container{ width:100%!important; max-width:100%!important; padding-left:8px!important; padding-right:8px!important; } body.ct5-listing-detail-page .ct5-detail-layout{display:block!important;} body.ct5-listing-detail-page .ct5-detail-banner-top img, body.ct5-listing-detail-page .ct5-detail-banner-bottom img{ height:auto!important; max-height:none!important; object-fit:contain!important; } body.ct5-listing-detail-page .ct5-main-photo{aspect-ratio:4/3!important;} } /* DTX STEP6 FINAL: consistent listing gallery ratio and navbar flow to prevent CLS. */ body.ct5-listing-detail-page .header-wow{position:relative!important;z-index:1000!important;clear:both!important;margin:0!important;transform:none!important;} body.ct5-listing-detail-page main.w11-pro-main{clear:both!important;margin:0!important;padding:0!important;} body.ct5-listing-detail-page .ct5-gallery-shell{position:relative!important;width:100%!important;aspect-ratio:4/3!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:hidden!important;background:#eef2f7!important;} body.ct5-listing-detail-page .ct5-main-photo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;aspect-ratio:4/3!important;min-height:0!important;max-height:none!important;overflow:hidden!important;background:#eef2f7!important;} body.ct5-listing-detail-page .ct5-main-photo img#ct5MainImage{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;object-position:center center!important;} @media(max-width:991.98px){body.ct5-listing-detail-page .ct5-gallery-shell,body.ct5-listing-detail-page .ct5-main-photo{aspect-ratio:4/3!important;}} /* ALO GIÁ RẺ 102 NAVBAR REALFIX V4 - listing detail scroll/sticky correction Lỗi v2/v3: navbar bị ép relative nên khi cuộn trang nó nằm trong luồng và rơi xuống gần footer. Fix: chỉ trên trang chi tiết tin đăng, bọc navbar global thành sticky root giống flow /shop/, luôn ở đỉnh viewport. Sticky tabs nội dung detail hạ xuống dưới navbar, không đè lên navbar. */ body.ct5-listing-detail-page #alogiare-global-navbar-root, body.ct5-listing-detail-page .alogiare-global-navbar-root{ display:block!important; position:sticky!important; top:0!important; left:auto!important; right:auto!important; bottom:auto!important; width:100%!important; max-width:none!important; z-index:2147482600!important; margin:0!important; padding:0!important; transform:none!important; background:#fff!important; clear:both!important; isolation:isolate!important; } body.ct5-listing-detail-page #alogiare-global-navbar-root > .header-wow, body.ct5-listing-detail-page .alogiare-global-navbar-root > .header-wow, body.ct5-listing-detail-page #alogiare-global-navbar-root > .alogiare-mobile-app-header, body.ct5-listing-detail-page .alogiare-global-navbar-root > .alogiare-mobile-app-header{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; bottom:auto!important; width:100%!important; max-width:none!important; z-index:auto!important; margin:0!important; transform:none!important; clear:both!important; } body.ct5-listing-detail-page main.w11-pro-main > .header-wow, body.ct5-listing-detail-page main.w11-pro-main > .alogiare-mobile-app-header, body.ct5-listing-detail-page .ct5-detail-navbar-mount{ display:none!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-scrollbar{ position:sticky!important; top:176px!important; z-index:2147481000!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page #alogiare-global-navbar-root, body.ct5-listing-detail-page .alogiare-global-navbar-root{ position:sticky!important; top:0!important; z-index:2147482600!important; } body.ct5-listing-detail-page .ct5-listing-page .ct5-scrollbar{ top:56px!important; z-index:2147481000!important; } } /* ALO GIÁ RẺ 103 GALLERY CLS REALFIX Khóa vùng gallery + thumb row ngay cả khi ảnh load chậm/reload cache lạnh. Chặn ảnh thumbnail/main image bung theo kích thước gốc làm vỡ layout trước khi JS hydrate. */ body.ct5-listing-detail-page .ct5-panel.ct5-hero-card{overflow:hidden!important;} body.ct5-listing-detail-page .ct5-gallery-shell{ position:relative!important; display:block!important; width:100%!important; max-width:100%!important; aspect-ratio:4/3!important; height:auto!important; min-height:0!important; max-height:none!important; overflow:hidden!important; background:#eef2f7!important; contain:layout paint!important; } body.ct5-listing-detail-page .ct5-main-photo{ position:absolute!important; inset:0!important; display:block!important; width:100%!important; max-width:100%!important; height:100%!important; min-height:0!important; max-height:none!important; overflow:hidden!important; background:#eef2f7!important; } body.ct5-listing-detail-page .ct5-main-photo img#ct5MainImage{ position:relative!important; z-index:1!important; display:block!important; width:100%!important; max-width:100%!important; height:100%!important; max-height:100%!important; object-fit:cover!important; object-position:center center!important; } body.ct5-listing-detail-page .ct5-thumb-row{ display:flex!important; flex-wrap:nowrap!important; align-items:flex-start!important; gap:10px!important; width:100%!important; max-width:100%!important; margin:10px 0 0!important; padding:0 0 10px!important; overflow-x:auto!important; overflow-y:hidden!important; scrollbar-width:none!important; box-sizing:border-box!important; contain:layout paint!important; } body.ct5-listing-detail-page .ct5-thumb-row::-webkit-scrollbar{display:none!important;} body.ct5-listing-detail-page .ct5-thumb{ flex:0 0 92px!important; width:92px!important; max-width:92px!important; height:69px!important; max-height:69px!important; display:block!important; padding:0!important; margin:0!important; overflow:hidden!important; border-radius:9px!important; background:#f1f5f9!important; } body.ct5-listing-detail-page .ct5-thumb img{ display:block!important; width:100%!important; max-width:100%!important; height:100%!important; max-height:100%!important; object-fit:cover!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page .ct5-gallery-shell, body.ct5-listing-detail-page .ct5-main-photo{aspect-ratio:4/3!important;} body.ct5-listing-detail-page .ct5-thumb{flex-basis:86px!important;width:86px!important;height:65px!important;max-width:86px!important;max-height:65px!important;} } /* DTX 104: detail top/bottom banner spacing + admin height support. */ html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{ margin-top:6px!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner .front-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner .front-banner a{ display:block!important; width:100%!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner .front-banner img{ display:block!important; width:100%!important; object-fit:cover!important; } /* ALOVN MOBILE LISTING TOP/BLOCK/BREADCRUMB POLISH 2026-07-14 - Banner detail mobile bám sát ngay dưới header. - Breadcrumb mobile full mép trái/phải, không bo góc ngoài. - Không đụng layout PC. */ @media(max-width:991.98px){ html body.ct5-listing-detail-page, html body.ct5-listing-detail-page main.w11-pro-main{ margin-top:0!important; padding-top:0!important; } html body.ct5-listing-detail-page #alogiare-global-navbar-root, html body.ct5-listing-detail-page .alogiare-global-navbar-root, html body.ct5-listing-detail-page #alogiare-global-navbar-root > .alogiare-mobile-app-header, html body.ct5-listing-detail-page .alogiare-global-navbar-root > .alogiare-mobile-app-header, html body.ct5-listing-detail-page .alogiare-mobile-app-header, html body.ct5-listing-detail-page .alogiare-mobile-appbar{ margin-bottom:0!important; padding-bottom:0!important; } html body.ct5-listing-detail-page .ct5-page.ct5-listing-page{ padding-top:0!important; margin-top:0!important; } html body.ct5-listing-detail-page .ct5-listing-page > .ct5-container, html body.ct5-listing-detail-page .ct5-listing-page .ct5-container{ padding-top:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback{ margin-top:0!important; margin-bottom:8px!important; border-radius:0!important; line-height:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner a, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-top .front-banner img, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner a, html body.ct5-listing-detail-page .ct5-listing-page .ct5-detail-banner-mobile-fallback .front-banner img{ border-radius:0!important; margin-top:0!important; } html body.ct5-listing-detail-page .ct5-listing-page .ct5-breadcrumb{ width:calc(100% + 16px)!important; max-width:none!important; margin-left:-8px!important; margin-right:-8px!important; margin-top:0!important; margin-bottom:8px!important; padding:12px 14px!important; border-radius:0!important; border-left:0!important; border-right:0!important; box-shadow:none!important; background:#fff!important; } } /* ALOVN 010 GALLERY LIGHTBOX REALFIX 2026-07-15 - Fix lightbox đen thui do CSS cũ/stacking-context đè ảnh. - Auto slide + chuyển ảnh mượt, vuốt PC/mobile không bị nhảy 2 ảnh/lần. */ body.ct5-listing-detail-page .ct5-gallery-shell{ touch-action:pan-y!important; user-select:none!important; -webkit-user-select:none!important; } body.ct5-listing-detail-page .ct5-main-photo, body.ct5-listing-detail-page .ct5-main-photo img#ct5MainImage{ -webkit-user-drag:none!important; user-drag:none!important; } body.ct5-listing-detail-page .ct5-main-photo img#ct5MainImage{ opacity:1!important; visibility:visible!important; transition:opacity .22s ease, transform .22s ease!important; will-change:opacity,transform!important; backface-visibility:hidden!important; } body.ct5-listing-detail-page .ct5-gallery-shell.is-ct5-dragging img#ct5MainImage{ transition:none!important; cursor:grabbing!important; } body.ct5-listing-detail-page .ct5-gallery-shell.is-ct5-switching img#ct5MainImage{ opacity:.86!important; } html body.ct5-modal-lock{ overflow:hidden!important; touch-action:none!important; } html body.ct5-modal-lock #alogiare-global-navbar-root, html body.ct5-modal-lock .alogiare-global-navbar-root, html body.ct5-modal-lock .header-wow, html body.ct5-modal-lock .alogiare-mobile-app-header, html body.ct5-modal-lock .ct5-scrollbar{ pointer-events:none!important; } body.ct5-listing-detail-page .ct5-image-modal.ct5-lg-modal, body.ct5-listing-detail-page #ct5ImageModal.ct5-lg-modal{ position:fixed!important; inset:0!important; width:100vw!important; height:100vh!important; height:100dvh!important; max-width:none!important; max-height:none!important; margin:0!important; padding:0!important; border:0!important; border-radius:0!important; overflow:hidden!important; background:#050505!important; z-index:2147483647!important; display:none!important; grid-template-rows:minmax(0,1fr) 92px!important; grid-template-columns:100vw!important; align-items:stretch!important; justify-items:stretch!important; box-sizing:border-box!important; isolation:isolate!important; } body.ct5-listing-detail-page .ct5-image-modal.ct5-lg-modal.is-open, body.ct5-listing-detail-page #ct5ImageModal.ct5-lg-modal.is-open{ display:grid!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-backdrop{ position:absolute!important; inset:0!important; z-index:0!important; background:#050505!important; pointer-events:auto!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-stage{ grid-row:1!important; grid-column:1!important; position:relative!important; z-index:2!important; width:100vw!important; height:auto!important; min-width:0!important; min-height:0!important; max-width:100vw!important; max-height:none!important; margin:0!important; padding:58px 92px 12px!important; display:flex!important; align-items:center!important; justify-content:center!important; overflow:hidden!important; box-sizing:border-box!important; background:transparent!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-stage img{ position:relative!important; z-index:3!important; display:block!important; opacity:1!important; visibility:visible!important; width:auto!important; height:auto!important; min-width:0!important; min-height:0!important; max-width:100%!important; max-height:100%!important; object-fit:contain!important; object-position:center center!important; margin:auto!important; padding:0!important; border:0!important; border-radius:6px!important; background:transparent!important; box-shadow:none!important; transform-origin:center center!important; transition:opacity .22s ease, transform .22s ease!important; backface-visibility:hidden!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-stage.is-ct5-switching img{ opacity:.82!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-counter{ position:absolute!important; top:18px!important; left:22px!important; z-index:6!important; display:inline-flex!important; align-items:center!important; min-height:34px!important; padding:0 12px!important; border-radius:999px!important; background:rgba(0,0,0,.55)!important; color:#fff!important; font-weight:900!important; font-size:15px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar{ position:absolute!important; top:14px!important; right:18px!important; z-index:7!important; display:flex!important; align-items:center!important; gap:8px!important; margin:0!important; padding:0!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar button, body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar a{ position:relative!important; width:38px!important; height:38px!important; min-width:38px!important; min-height:38px!important; margin:0!important; padding:0!important; border:0!important; border-radius:10px!important; background:rgba(255,255,255,.12)!important; color:#fff!important; display:grid!important; place-items:center!important; text-decoration:none!important; font-size:19px!important; line-height:1!important; cursor:pointer!important; opacity:1!important; visibility:visible!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar button:hover, body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar a:hover{ background:rgba(255,255,255,.22)!important; color:#fff!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-nav{ position:absolute!important; top:50%!important; transform:translateY(-50%)!important; z-index:6!important; width:48px!important; height:48px!important; border:0!important; border-radius:999px!important; background:rgba(255,255,255,.14)!important; color:#fff!important; display:grid!important; place-items:center!important; font-size:24px!important; cursor:pointer!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-prev{left:22px!important;} body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-next{right:22px!important;} body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumbs{ grid-row:2!important; grid-column:1!important; position:relative!important; z-index:5!important; width:100vw!important; max-width:100vw!important; height:92px!important; margin:0!important; padding:10px 14px!important; display:flex!important; align-items:center!important; justify-content:flex-start!important; gap:8px!important; overflow-x:auto!important; overflow-y:hidden!important; box-sizing:border-box!important; background:#0b0b0b!important; scrollbar-width:none!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumbs::-webkit-scrollbar{display:none!important;} body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumb{ flex:0 0 84px!important; width:84px!important; height:64px!important; min-width:84px!important; min-height:64px!important; margin:0!important; padding:0!important; border:2px solid rgba(255,255,255,.34)!important; border-radius:7px!important; overflow:hidden!important; background-color:#111!important; background-size:cover!important; background-position:center!important; opacity:.72!important; cursor:pointer!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumb.is-active{ border-color:#facc15!important; opacity:1!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumb img{ display:block!important; width:100%!important; height:100%!important; max-width:100%!important; max-height:100%!important; object-fit:cover!important; opacity:1!important; visibility:visible!important; border:0!important; border-radius:0!important; box-shadow:none!important; } @media(max-width:991.98px){ body.ct5-listing-detail-page .ct5-image-modal.ct5-lg-modal, body.ct5-listing-detail-page #ct5ImageModal.ct5-lg-modal{ grid-template-rows:minmax(0,1fr) 82px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-stage{ padding:52px 44px 8px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumbs{ height:82px!important; padding:8px 10px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-thumb{ flex-basis:68px!important; width:68px!important; height:52px!important; min-width:68px!important; min-height:52px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-prev{left:8px!important;} body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-next{right:8px!important;} body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-nav{ width:38px!important; height:38px!important; font-size:20px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-counter{ top:12px!important; left:10px!important; font-size:13px!important; min-height:30px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar{ top:10px!important; right:10px!important; gap:5px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar button, body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar a{ width:32px!important; height:32px!important; min-width:32px!important; min-height:32px!important; font-size:16px!important; } } @media(max-width:575.98px){ body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-stage{ padding:48px 6px 8px!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-modal-nav{ display:none!important; } body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar button[data-ct5-copy], body.ct5-listing-detail-page #ct5ImageModal .ct5-lg-toolbar a[data-ct5-download]{ display:none!important; } }