
@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-VariableFont_slnt,wght.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;}
:root{--vf-green:#3C9156;--vf-green-600:#2e7243;--vf-navy:#1D3B73;--vf-bg:#F6F7F9;--vf-muted:#6b7280;--vf-radius:28px;}
html,body{height:100%}body{background:var(--vf-bg);font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial;color:#111827}

/* Auth */
.vf-auth{min-height:100vh}
.vf-auth .left{background:#fff;padding:56px clamp(24px,4vw,64px);display:flex;flex-direction:column;justify-content:center}
.vf-auth .right{background:#e5e7eb url("/assets/images/enerfab-viewfab.jpg") center/cover no-repeat;border-top-left-radius:var(--vf-radius);border-bottom-left-radius:var(--vf-radius)}
.brand{display:inline-flex;align-items:center;gap:12px;margin-bottom:28px}.brand img{height:42px}
.vf-title{font-weight:800;font-size:clamp(26px,3.2vw,36px);line-height:1.2;margin-bottom:10px}.vf-sub{color:var(--vf-muted);margin-bottom:28px}
/* .form-label{color:var(--vf-muted);font-weight:600}.form-control{border-radius:12px;padding:12px 14px}.form-control:focus{border-color:var(--vf-navy);box-shadow:0 0 0 .2rem rgba(29,59,115,.12)} */
.btn-brand{background:var(--vf-green);color:#fff;border:none;border-radius:12px;padding:12px 18px;font-weight:700}.btn-brand:hover{background:var(--vf-green-600);color:#fff}
.vf-pass{position:relative}.vf-toggle{position:absolute;right:12px;top:72%;transform:translateY(-50%);background:transparent;border:0;opacity:.65}.vf-toggle:hover{opacity:1}
.footer-note{color:#9ca3af;font-size:12px;margin-top:14px}
@media(max-width:992px){.vf-auth .right{min-height:40vh;border-radius:0 0 var(--vf-radius) var(--vf-radius)}}

/* App layout */
.app{min-height:100vh;display:grid;grid-template-columns:260px 1fr}
.sidebar{background:#fff;border-right:1px solid #e5e7eb;padding:15px 0 20px 20px;position:sticky;top:0;height:100vh}
.sidebar .logo{padding:10px 10px 16px}
.nav-aside{list-style:none;padding-left:0;margin:12px 0 0}
.nav-aside li{margin-bottom:8px}
.nav-aside a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top-right-radius:15px;border-bottom-right-radius:15px;text-decoration:none;color:#374151}
.nav-aside a:hover{background:#f3f4f6}
.nav-aside a.active{background:var(--vf-green);color:#fff}
.nav-aside .icon{width:20px;height:20px;display:inline-block}
.main{display:flex;flex-direction:column;min-width:0}
.search{max-width:520px;width:100%;display:flex;align-items:center;gap:10px;background:#f3f4f6;border-radius:999px;padding:10px 14px}
.search input{border:0;background:transparent;outline:none;width:100%}
.header{background:#fff;border-bottom:1px solid #e5e7eb;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;box-shadow: 0px 4px 4px 0px rgba(211, 211, 211, 0.25);}
.header-actions{display:flex;align-items:center;gap:16px}
.header .avatar{width:36px;height:36px;border-radius:50%;overflow:hidden}
.content{padding:20px}
.table.vf-table tr td,.table.vf-table tr th{vertical-align:middle}
@media(max-width:992px){.app{grid-template-columns:1fr}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid #e5e7eb}}
.header-actions a {text-decoration: none; color: inherit;}
.container{--bs-gutter-x:0;--bs-gutter-y:0}
.container-card{background:#fff;padding:20px 20px;border-radius:12px;box-shadow:0 2px 6px rgb(0 0 0 / .1)}
.header .heading{color: #17468F;}
.required-star {color: red;}
.map700 {width: 100%; height: 700px; border: 1px solid #ccc; border-radius: 12px;}
.map500 {width: 100%; height: 500px; border: 1px solid #ccc; border-radius: 12px;}
.map800 {width: 100%; height: 800px; border: 1px solid #ccc; border-radius: 12px;}
