/* ===== VahanGuide — Site Styles ===== */
:root {
    --vg-primary: #1a1a2e;
    --vg-accent: #e94560;
    --vg-accent-hover: #d63851;
    --vg-surface: #fff;
    --vg-bg: #f8f9fa;
    --vg-text: #1a1a2e;
    --vg-muted: #6c757d;
    --vg-border: #e9ecef;
    --vg-radius: 10px;
    --vg-shadow: 0 2px 12px rgba(0,0,0,.06);
    --vg-shadow-lg: 0 8px 30px rgba(0,0,0,.1);
}
* { box-sizing: border-box; }
body { font-family: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; color: var(--vg-text); background: var(--vg-bg); line-height: 1.6; -webkit-font-smoothing: antialiased; }
.fw-500{font-weight:500!important}.fw-600{font-weight:600!important}.fw-700{font-weight:700!important}.fw-800{font-weight:800!important}
.text-accent{color:var(--vg-accent)!important}
.card{border-radius:var(--vg-radius);border-color:var(--vg-border)}

/* Topbar */
.topbar{background:var(--vg-primary);color:rgba(255,255,255,.7);font-size:.8rem;padding:6px 0}
.topbar-link{color:rgba(255,255,255,.7);font-size:.8rem;text-decoration:none}.topbar-link:hover{color:#fff}

/* Navbar */
.vg-navbar{background:var(--vg-surface);border-bottom:1px solid var(--vg-border);box-shadow:var(--vg-shadow);padding:.6rem 0;z-index:1020}
.vg-navbar .navbar-brand{font-size:1.25rem;color:var(--vg-primary);font-weight:800;letter-spacing:-.3px}
.vg-navbar .navbar-brand:hover{color:var(--vg-accent)}
.vg-navbar .nav-link{color:var(--vg-text);font-weight:500;font-size:.9rem;padding:.4rem .75rem!important;border-radius:6px;transition:all .15s}
.vg-navbar .nav-link:hover,.vg-navbar .nav-link.active{background:rgba(233,69,96,.08);color:var(--vg-accent)}
.vg-navbar .navbar-toggler{color:var(--vg-text)}

/* Buttons */
.btn-accent{background:var(--vg-accent);color:#fff;border:none;font-weight:600;border-radius:8px;transition:all .2s}
.btn-accent:hover{background:var(--vg-accent-hover);color:#fff;transform:translateY(-1px)}

/* Hero */
.hero-section{background:linear-gradient(135deg,var(--vg-primary) 0%,#16213e 60%,#0f3460 100%);color:#fff;padding:4rem 0 3.5rem;position:relative;overflow:hidden}
.hero-section::before{content:'';position:absolute;top:-50%;right:-20%;width:600px;height:600px;background:radial-gradient(circle,rgba(233,69,96,.15),transparent 70%);border-radius:50%}
.hero-title{font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.15;letter-spacing:-.5px}
.hero-sub{font-size:1.1rem;color:rgba(255,255,255,.7);max-width:520px}
.hero-graphic{display:flex;align-items:center;justify-content:center;gap:1.5rem;font-size:5rem;opacity:.2}
.hero-vs{font-size:2rem;font-weight:800;background:var(--vg-accent);color:#fff;width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:1}

/* Page Header */
.page-header{background:var(--vg-primary);color:#fff;padding:2rem 0 1.5rem}
.page-header .breadcrumb-item a{color:rgba(255,255,255,.6);text-decoration:none}
.page-header .breadcrumb-item.active{color:rgba(255,255,255,.8)}
.page-header .breadcrumb-item+.breadcrumb-item::before{color:rgba(255,255,255,.4)}
.page-header h1{font-size:1.8rem}.page-header .text-muted{color:rgba(255,255,255,.6)!important}

/* Vehicle Cards */
.vehicle-card{border:1px solid var(--vg-border);border-radius:var(--vg-radius);overflow:hidden;transition:all .2s;background:var(--vg-surface)}
.vehicle-card:hover{box-shadow:var(--vg-shadow-lg);transform:translateY(-3px);border-color:var(--vg-accent)}
.vehicle-card-img{height:140px;background:linear-gradient(135deg,#f0f2f5,#e8ecf1);display:flex;align-items:center;justify-content:center;position:relative}
.vehicle-card-img i{font-size:3.5rem;color:#b0b8c4}
.vehicle-card-img.bike-img{background:linear-gradient(135deg,#eef1f7,#e3e8f0)}
.badge-fuel{position:absolute;top:10px;right:10px;background:var(--vg-primary);color:#fff;font-size:.65rem;padding:3px 8px;border-radius:4px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.price-tag{font-weight:700;color:var(--vg-accent);font-size:1rem}

/* Brand Tiles */
.brand-tile{background:var(--vg-surface);border:1px solid var(--vg-border);transition:all .2s;cursor:pointer}
.brand-tile:hover{border-color:var(--vg-accent);box-shadow:var(--vg-shadow);transform:translateY(-2px)}
.brand-icon{width:44px;height:44px;border-radius:10px;background:linear-gradient(135deg,#f0f2f5,#e8ecf1);display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--vg-muted)}

/* CTA */
.cta-section{background:linear-gradient(135deg,var(--vg-primary),#16213e)}

/* Detail Page */
.detail-hero-img{height:300px;background:linear-gradient(135deg,#f0f2f5,#e3e8f0);border-radius:var(--vg-radius);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;color:#b0b8c4}
.detail-hero-img i{font-size:5rem}.detail-hero-img span{font-size:1.2rem}
.spec-row{border-bottom:1px solid var(--vg-border)}.spec-row:last-child{border-bottom:none}
.quick-spec-icon,.about-icon{width:40px;height:40px;border-radius:10px;background:rgba(233,69,96,.08);display:flex;align-items:center;justify-content:center;color:var(--vg-accent);font-size:1.1rem;flex-shrink:0}

/* Compare */
.compare-table th,.compare-table td{vertical-align:middle}
.compare-label{font-weight:500;background:#fafbfc;font-size:.88rem;white-space:nowrap}
.compare-vehicle-icon{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#f0f2f5,#e8ecf1);display:inline-flex;align-items:center;justify-content:center;font-size:1.5rem;color:#b0b8c4}

/* Image Gallery */
.gallery-main{height:340px;background:#f0f2f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.gallery-main img{width:100%;height:100%;object-fit:cover}
.gallery-placeholder{text-align:center;color:#b0b8c4}.gallery-placeholder i{font-size:5rem;display:block;margin-bottom:.5rem}.gallery-placeholder span{font-size:1.1rem}
.gallery-thumbs{display:flex;gap:4px;padding:6px;background:#fff;overflow-x:auto}
.gallery-thumb{width:80px;height:60px;flex-shrink:0;border-radius:6px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border .15s;background:#f0f2f5;display:flex;align-items:center;justify-content:center}
.gallery-thumb:hover{border-color:var(--vg-accent)}.gallery-thumb.active{border-color:var(--vg-accent)}
.gallery-thumb img{width:100%;height:100%;object-fit:cover}
.thumb-placeholder{text-align:center;color:#b0b8c4;font-size:.6rem}.thumb-placeholder i{font-size:1rem;display:block}

/* Color Chips */
.color-chip{min-width:56px;cursor:default}
.color-swatch{width:40px;height:40px;border-radius:50%;border:3px solid #e0e0e0;margin:0 auto;transition:transform .15s,box-shadow .15s}
.color-chip:hover .color-swatch{transform:scale(1.15);box-shadow:0 4px 12px rgba(0,0,0,.15)}

/* SEO Content Section */
.seo-content-card{background:var(--vg-surface)}
.seo-content-card h2{font-size:1.3rem;font-weight:700;margin-bottom:.75rem;color:var(--vg-text)}
.seo-content-card p{color:var(--vg-muted);font-size:.92rem;line-height:1.7}
.seo-body{font-size:.92rem;line-height:1.7;color:#555}
.seo-body p{margin-bottom:.75rem}
.accordion-button{font-size:.92rem;padding:.85rem 1rem}
.accordion-button:not(.collapsed){background:rgba(233,69,96,.04);color:var(--vg-accent)}
.accordion-button:focus{box-shadow:none;border-color:var(--vg-border)}

/* Footer */
.vg-footer{background:var(--vg-primary);color:rgba(255,255,255,.85)}.vg-footer h5,.vg-footer h6{color:#fff}
.footer-links li{margin-bottom:.4rem}.footer-links a{color:rgba(255,255,255,.55);text-decoration:none;font-size:.85rem;transition:color .15s}.footer-links a:hover{color:var(--vg-accent)}

/* Forms */
.form-control:focus,.form-select:focus{border-color:var(--vg-accent);box-shadow:0 0 0 .2rem rgba(233,69,96,.15)}
.page-item.active .page-link{background:var(--vg-accent);border-color:var(--vg-accent)}.page-link{color:var(--vg-text)}.page-link:hover{color:var(--vg-accent)}

/* Sitemap */
.sitemap-links li{padding:.25rem 0}.sitemap-links a{color:var(--vg-text);text-decoration:none;font-size:.9rem;transition:color .15s}.sitemap-links a:hover{color:var(--vg-accent)}

/* City Selector */
.city-select{background:transparent;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.8);font-size:.78rem;padding:2px 8px;border-radius:4px;cursor:pointer}
.city-select option{background:var(--vg-primary);color:#fff}
.lead-city-select option{color:var(--vg-text)}

/* Lead Capture Cards */
.lead-card{border-left:3px solid var(--vg-accent)!important}

/* EMI Calculator */
.emi-result{background:rgba(233,69,96,.04);border:1px dashed rgba(233,69,96,.2)}
.form-range::-webkit-slider-thumb{background:var(--vg-accent)}
.form-range::-moz-range-thumb{background:var(--vg-accent)}

/* State Links */
.state-link{color:var(--vg-text);transition:background .15s}
.state-link:hover{background:rgba(233,69,96,.06);color:var(--vg-accent)}

/* Blog Content */
.blog-content h2{font-size:1.3rem;font-weight:700;margin-top:1.5rem;margin-bottom:.75rem}
.blog-content h3{font-size:1.1rem;font-weight:600;margin-top:1.25rem;margin-bottom:.5rem}
.blog-content p{margin-bottom:1rem;line-height:1.8}
.blog-content ul,.blog-content ol{margin-bottom:1rem;padding-left:1.5rem}
.blog-content li{margin-bottom:.5rem}

/* Dropdown */
.dropdown-menu{border:none;box-shadow:var(--vg-shadow-lg);border-radius:var(--vg-radius)}
.dropdown-item{font-size:.9rem;padding:.5rem 1rem}
.dropdown-item:hover{background:rgba(233,69,96,.06);color:var(--vg-accent)}

/* WhatsApp Float */
.whatsapp-float{position:fixed;bottom:24px;right:24px;width:56px;height:56px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(37,211,102,.4);z-index:1050;transition:transform .2s}
.whatsapp-float:hover{transform:scale(1.1)}
@media(max-width:768px){.whatsapp-float{bottom:16px;right:16px;width:50px;height:50px}}

/* ========================================= */
/* ADMIN STYLES                              */
/* ========================================= */
.admin-body{background:#f4f5f7}
.admin-wrapper{display:flex;min-height:100vh}

/* Sidebar */
.admin-sidebar{width:240px;background:var(--vg-primary);color:#fff;flex-shrink:0;position:fixed;top:0;left:0;bottom:0;z-index:1040;display:flex;flex-direction:column;transition:transform .2s}
.sidebar-brand{padding:1.25rem 1.25rem .75rem;font-size:1.1rem;font-weight:800;letter-spacing:-.3px}
.sidebar-nav{padding:.5rem .75rem;flex:1;overflow-y:auto}
.sidebar-heading{display:block;padding:.75rem .5rem .25rem;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,.35)}
.sidebar-link{display:flex;align-items:center;gap:.65rem;padding:.55rem .75rem;border-radius:8px;color:rgba(255,255,255,.65);text-decoration:none;font-size:.88rem;font-weight:500;transition:all .15s;cursor:pointer}
.sidebar-link:hover{background:rgba(255,255,255,.08);color:#fff}
.sidebar-link.active{background:var(--vg-accent);color:#fff}
.sidebar-link i{font-size:1rem;width:20px;text-align:center}

/* Admin main */
.admin-main{margin-left:240px;flex:1;display:flex;flex-direction:column;min-height:100vh}
.admin-topbar{background:#fff;border-bottom:1px solid var(--vg-border);padding:.75rem 1.5rem;display:flex;align-items:center}
.admin-content{padding:1.5rem;flex:1}

/* Stat icons */
.stat-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0}

/* Responsive */
@media(max-width:991px){
    .admin-sidebar{transform:translateX(-100%)}
    .admin-sidebar.show{transform:translateX(0)}
    .admin-main{margin-left:0}
}
@media(max-width:768px){
    .hero-section{padding:2.5rem 0 2rem}.hero-title{font-size:1.8rem}
    .page-header{padding:1.5rem 0 1rem}.page-header h1{font-size:1.4rem}
    .detail-hero-img{height:180px}.detail-hero-img i{font-size:3rem}
    .gallery-main{height:220px}
    .vehicle-card-img{height:110px}
}