/* mapsviet-core.css — thư viện CSS dùng chung cho toàn bộ site.
   Mọi plugin khác (directory/regions/classifieds/guide...) chỉ enqueue CSS
   RIÊNG cho phần đặc thù của mình, KHÔNG lặp lại các lớp topbar/sidebar/card
   /grid/footer/toast/ad-slot/breadcrumb/section-head đã có sẵn ở đây. */

.mv-hamburger{ display:none; width:38px; height:38px; border-radius:10px; align-items:center; justify-content:center; background:var(--mv-surface-alt); border:1px solid var(--mv-border); flex-shrink:0; font-size:16px; }
@media (max-width:820px){ .mv-hamburger{ display:flex; } }

/* Topbar */
header.mv-topbar{ background:var(--mv-surface); border-bottom:1px solid var(--mv-border); position:sticky; top:0; z-index:60; height:var(--mv-header-h); box-shadow:var(--mv-shadow-sm); }
.mv-topbar-inner{ height:100%; display:flex; align-items:center; gap:20px; padding:0 24px; }
.mv-logo{ display:flex; align-items:center; gap:8px; font-size:21px; font-weight:800; white-space:nowrap; width:calc(var(--mv-sidebar-w) - 24px); letter-spacing:-0.02em; font-family:var(--mv-font-display); }
.mv-logo i{ color:var(--mv-brand); font-size:20px; }
.mv-search-box{ flex:1; min-width:0; max-width:460px; display:flex; align-items:center; gap:10px; height:42px; padding:0 16px; background:var(--mv-surface-alt); border:1px solid var(--mv-border); border-radius:999px; }
.mv-search-box input{ border:none; background:none; outline:none; font-size:15px; width:100%; color:var(--mv-text-primary); font-family:inherit; }
.mv-search-box i{ color:var(--mv-text-muted); font-size:15px; }
.mv-topbar-right{ display:flex; align-items:center; gap:18px; margin-left:auto; }
.mv-icon-btn{ width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--mv-surface-alt); border:1px solid var(--mv-border); color:var(--mv-text-secondary); position:relative; flex-shrink:0; font-size:15px; }
.mv-icon-btn .mv-dot{ position:absolute; top:7px; right:8px; width:7px; height:7px; border-radius:50%; background:var(--mv-danger); border:1.5px solid var(--mv-surface); }
.mv-avatar{ width:38px; height:38px; border-radius:50%; background:var(--mv-accent-light); color:var(--mv-accent-dark); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex-shrink:0; }
.mv-btn-primary{ background:var(--mv-accent); color:#fff; border:none; border-radius:999px; padding:11px 22px; font-size:14.5px; font-weight:600; white-space:nowrap; box-shadow:var(--mv-shadow-sm); font-family:var(--mv-font-display); display:inline-flex; align-items:center; gap:8px; }
.mv-btn-primary:hover{ background:var(--mv-accent-dark); }
.mv-btn-outline{ background:var(--mv-surface); color:var(--mv-text-primary); border:1px solid var(--mv-border-strong); border-radius:999px; padding:11px 20px; font-size:14.5px; font-weight:700; white-space:nowrap; font-family:var(--mv-font-display); display:inline-flex; align-items:center; gap:8px; }
.mv-btn-outline:hover{ background:var(--mv-surface-alt); }

/* Layout: sidebar + content */
.mv-layout{ display:flex; align-items:flex-start; }
aside.mv-sidebar{ width:var(--mv-sidebar-w); flex-shrink:0; background:var(--mv-surface); border-right:1px solid var(--mv-border); position:sticky; top:var(--mv-header-h); height:calc(100vh - var(--mv-header-h)); overflow-y:auto; padding:20px 14px 28px; }
@media (max-width:820px){
	aside.mv-sidebar{ display:flex; flex-direction:column; position:fixed; top:0; left:0; height:100vh; z-index:90; width:min(var(--mv-sidebar-w), 85vw); transform:translateX(-100%); transition:transform .2s ease; box-shadow:var(--mv-shadow-md); }
	aside.mv-sidebar.mv-open{ transform:translateX(0); }
	.mv-sidebar-backdrop.mv-open{ display:block; position:fixed; inset:0; background:rgba(15,16,20,.4); z-index:80; }
	.mv-logo{ width:auto; }
}
.mv-sidebar-backdrop{ display:none; }
@media (max-width:680px){ .mv-topbar-inner{ gap:10px; padding:0 14px; } .mv-topbar-right{ gap:10px; } .mv-topbar-right .mv-btn-outline, .mv-topbar-right .mv-btn-primary{ display:none; } }
@media (max-width:480px){ .mv-logo{ font-size:18px; } .mv-logo .mv-logo-text{ display:none; } }
.mv-nav-group{ margin-bottom:22px; }
.mv-nav-group-title{ font-size:11.5px; font-weight:700; color:var(--mv-text-muted); letter-spacing:.06em; text-transform:uppercase; padding:0 14px; margin:0 0 8px; }
.mv-nav-item{ display:flex; align-items:center; gap:11px; padding:11px 14px; border-radius:10px; font-size:14.5px; font-weight:600; color:var(--mv-text-primary); cursor:pointer; margin-bottom:2px; font-family:var(--mv-font-display); }
.mv-nav-item .mv-ic{ width:18px; text-align:center; color:var(--mv-text-secondary); font-size:15.5px; }
.mv-nav-item:hover{ background:var(--mv-surface-alt); }
.mv-nav-item.mv-active{ background:var(--mv-accent-light); font-weight:700; color:var(--mv-accent-dark); }
.mv-nav-item.mv-active .mv-ic{ color:var(--mv-accent-dark); }
.mv-nav-divider{ height:1px; background:var(--mv-border); margin:10px 14px 16px; }

main.mv-content{ flex:1; min-width:0; padding:28px 32px 60px; max-width:calc(100% - var(--mv-sidebar-w)); }
.mv-content-inner{ max-width:1180px; margin:0 auto; }
@media (max-width:820px){ main.mv-content{ max-width:100%; padding:22px 20px 48px; } }
@media (max-width:600px){ main.mv-content{ padding:16px 14px 40px; } }

/* Section headers */
.mv-section{ margin-bottom:34px; }
.mv-section-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; gap:12px; flex-wrap:wrap; }
.mv-section-head h2{ font-size:19px; margin:0; }
.mv-section-head .mv-sub{ font-size:13px; color:var(--mv-text-muted); margin-top:3px; font-weight:500; }
.mv-section-head .mv-link{ font-size:14px; color:var(--mv-accent); font-weight:600; white-space:nowrap; }

/* Breadcrumb */
.mv-breadcrumb{ font-size:13px; color:var(--mv-text-muted); margin:18px 0 6px; }
.mv-breadcrumb a{ color:var(--mv-text-secondary); font-weight:600; }
.mv-breadcrumb a:hover{ color:var(--mv-accent); }
.mv-breadcrumb .mv-sep{ margin:0 7px; color:var(--mv-border-strong); }

/* Cards + grid (dùng chung cho địa điểm/rao vặt/tỉnh thành...) */
.mv-grid{ display:grid; grid-template-columns:repeat(2, 1fr); gap:16px; }
@media (max-width:820px){ .mv-grid{ grid-template-columns:1fr; } }
.mv-card{ background:var(--mv-surface); border:1px solid var(--mv-border); border-radius:16px; padding:18px; transition:box-shadow .15s, border-color .15s; box-shadow:var(--mv-shadow-sm); cursor:pointer; }
.mv-card:hover{ border-color:var(--mv-border-strong); box-shadow:var(--mv-shadow-md); }
.mv-card-top{ display:flex; gap:14px; }
.mv-thumb{ width:58px; height:58px; border-radius:13px; position:relative; overflow:hidden; flex-shrink:0; }
.mv-thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mv-card-info{ flex:1; min-width:0; }
.mv-card-info-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.mv-name-row{ display:flex; align-items:center; gap:6px; min-width:0; }
.mv-name-row .mv-name{ font-size:16px; font-weight:700; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-family:var(--mv-font-display); }
.mv-name-row .mv-verified{ color:var(--mv-accent); font-size:13px; flex-shrink:0; }
.mv-badge{ font-size:11px; padding:3px 9px; border-radius:7px; font-weight:600; white-space:nowrap; flex-shrink:0; }
.mv-badge.mv-open{ background:var(--mv-success-light); color:var(--mv-success); }
.mv-badge.mv-closed{ background:var(--mv-danger-light); color:var(--mv-danger); }
.mv-badge.mv-featured{ background:var(--mv-accent-light); color:var(--mv-accent-dark); }
.mv-badge.mv-new{ background:var(--mv-accent-light); color:var(--mv-accent-dark); }
.mv-card-meta{ font-size:13px; color:var(--mv-text-secondary); margin:4px 0 0; }
.mv-card-stats{ display:flex; align-items:center; gap:10px; margin-top:8px; font-size:12.5px; flex-wrap:wrap; color:var(--mv-text-secondary); }
.mv-card-stats .mv-rating i{ color:var(--mv-warning); }

/* Ad slots (dán mã đơn vị quảng cáo tự chọn qua Customizer, không hard-code) */
.mv-ad-slot{ text-align:center; margin:28px 0; }
.mv-ad-slot .mv-ad-label{ font-size:11px; color:var(--mv-text-muted); margin:0 0 8px; letter-spacing:.06em; text-transform:uppercase; }
.mv-ad-slot .mv-ad-box{ background:var(--mv-surface-alt); border:1px solid var(--mv-border); border-radius:12px; display:flex; align-items:center; justify-content:center; gap:8px; color:var(--mv-text-muted); font-size:13px; margin:0 auto; padding:0 20px; text-align:center; line-height:1.5; }
.mv-ad-leaderboard .mv-ad-box{ max-width:728px; min-height:90px; }
.mv-ad-rectangle .mv-ad-box{ max-width:300px; min-height:250px; }

/* Toast */
.mv-toast{ position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(16px); background:#202124; color:#fff; padding:13px 22px; border-radius:999px; font-size:14px; font-weight:600; display:flex; align-items:center; gap:10px; box-shadow:var(--mv-shadow-md); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; z-index:200; }
.mv-toast.mv-show{ opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; }
.mv-toast i{ color:#34a853; }

/* Footer */
footer.mv-footer{ background:var(--mv-surface); border-top:1px solid var(--mv-border); margin-top:36px; }
.mv-footer-inner{ max-width:1180px; margin:0 auto; padding:32px 32px; display:flex; gap:56px; flex-wrap:wrap; }
.mv-footer-col h4{ font-size:14.5px; margin:0 0 12px; }
.mv-footer-col a{ display:block; font-size:13.5px; color:var(--mv-text-secondary); margin-bottom:9px; }
.mv-footer-col a:hover{ color:var(--mv-accent); }
.mv-footer-bottom{ border-top:1px solid var(--mv-border); text-align:center; padding:16px; font-size:12.5px; color:var(--mv-text-muted); }

/* Google-style hero (trang chủ) */
.mv-google-hero{ text-align:center; padding:40px 20px 36px; }
.mv-google-logo{ display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:12px; }
.mv-google-logo i{ font-size:36px; color:var(--mv-brand); }
.mv-google-logo .mv-logo-word{ font-family:var(--mv-font-display); font-size:42px; font-weight:800; letter-spacing:-0.01em; }
.mv-google-tagline{ font-size:14.5px; color:var(--mv-text-secondary); margin:0 0 28px; font-weight:500; }
.mv-google-search-box{ display:flex; align-items:center; gap:12px; max-width:584px; margin:0 auto; background:var(--mv-surface); border:1px solid #dfe1e5; border-radius:999px; padding:0 20px; height:46px; transition:box-shadow .15s, border-color .15s; }
.mv-google-search-box:hover, .mv-google-search-box:focus-within{ box-shadow:0 1px 6px rgba(32,33,36,.28); border-color:transparent; }
.mv-google-search-box input{ flex:1; min-width:0; border:none; outline:none; background:none; font-size:15px; font-family:inherit; color:var(--mv-text-primary); }
.mv-google-buttons{ display:flex; justify-content:center; gap:10px; margin:24px 0 26px; flex-wrap:wrap; }
.mv-google-btn{ background:#f8f9fa; border:1px solid #f8f9fa; border-radius:4px; height:36px; padding:0 16px; font-size:13.5px; color:#3c4043; font-weight:500; }
.mv-google-btn:hover{ border-color:#dadce0; box-shadow:0 1px 1px rgba(0,0,0,.1); }
.mv-google-quick-links{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.mv-quick-cat{ display:flex; align-items:center; gap:6px; font-size:13px; font-weight:500; color:#3c4043; background:#f1f3f4; border:none; border-radius:999px; padding:8px 14px; }
.mv-quick-cat:hover{ background:#e8eaed; }
.mv-quick-cat.mv-active{ background:var(--mv-accent); color:#fff; }

/* Empty state dùng chung */
.mv-empty-state{ grid-column:1 / -1; text-align:center; padding:56px 20px; color:var(--mv-text-secondary); }
.mv-empty-state i{ font-size:32px; color:var(--mv-text-muted); margin-bottom:12px; display:block; }
