/* MovCampo — CSS Nativo Compilado (substitui Tailwind CDN) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* ── Reset & Base ────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,sans-serif;min-height:100vh;background:#0f172a;color:#f8fafc;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{cursor:pointer;border:none;background:none;font-family:inherit}
input,select,textarea{font-family:inherit}
ul{list-style:none}

/* ── Variáveis CSS ───────────────────────────────────────────── */
:root{
  --blue-400:#60a5fa;--blue-500:#3b82f6;--blue-600:#2563eb;--blue-700:#1d4ed8;
  --slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;--slate-600:#475569;
  --slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;--slate-950:#020617;
  --red-400:#f87171;--red-500:#ef4444;--red-600:#dc2626;
  --amber-400:#fbbf24;--amber-500:#f59e0b;
  --cyan-200:#a5f3fc;--cyan-300:#67e8f9;--cyan-400:#22d3ee;
  --emerald-400:#34d399;--green-400:#4ade80;
  --white-5:rgba(255,255,255,.05);--white-10:rgba(255,255,255,.1);--white-15:rgba(255,255,255,.15);
}

/* ── Layout Principal (App autenticado) ──────────────────────── */
body.app-layout{display:flex;flex-direction:column;min-height:100vh}
@media(min-width:1024px){body.app-layout{flex-direction:row}}

/* ── Sidebar ─────────────────────────────────────────────────── */
aside#sidebar{
  position:fixed;inset-block:0;left:0;width:16rem;
  background:rgba(30,41,59,.95);border-right:1px solid var(--white-10);
  padding:1.5rem;display:flex;flex-direction:column;
  z-index:40;height:100%;overflow-y:auto;
  transform:translateX(-100%);transition:transform .3s ease-in-out;
  backdrop-filter:blur(16px);
}
@media(min-width:1024px){
  aside#sidebar{position:relative;transform:translateX(0);flex-shrink:0;padding:2rem;overflow:visible}
}
aside#sidebar .logo{font-size:1.5rem;font-weight:700;color:#fff;display:flex;align-items:center;gap:.5rem;margin-bottom:3rem;margin-top:.5rem}
@media(min-width:1024px){aside#sidebar .logo{margin-top:0}}
aside#sidebar .logo span{color:var(--blue-500)}

/* ── Overlay Sidebar Mobile ──────────────────────────────────── */
#sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:30;backdrop-filter:blur(4px)}

/* ── Header Mobile ───────────────────────────────────────────── */
.mobile-header{display:flex;align-items:center;justify-content:space-between;padding:1rem;border-bottom:1px solid var(--white-10);background:rgba(30,41,59,.95);position:sticky;top:0;z-index:20}
@media(min-width:1024px){.mobile-header{display:none}}
.mobile-header .logo{font-size:1.25rem;font-weight:700;color:#fff}
.mobile-header .logo span{color:var(--blue-500)}
.hamburger-btn{padding:.5rem;color:var(--slate-400);border-radius:.5rem}
.hamburger-btn:hover{color:#fff}

/* ── Sidebar close btn mobile ────────────────────────────────── */
.sidebar-close-btn{display:block;padding:.5rem;color:var(--slate-400);border-radius:.5rem}
@media(min-width:1024px){.sidebar-close-btn{display:none}}

/* ── Sidebar header row ───────────────────────────────────────── */
.sidebar-header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;margin-top:.5rem}
@media(min-width:1024px){.sidebar-header-row{margin-bottom:3rem;margin-top:0}}

/* ── Nav Links ───────────────────────────────────────────────── */
.nav-link{display:block;padding:.75rem 1rem;color:var(--slate-400);font-weight:500;border-radius:.5rem;transition:color .15s,background .15s;margin-bottom:.5rem}
.nav-link:hover{background:rgba(59,130,246,.1);color:var(--blue-500)}
.nav-link.active{background:rgba(59,130,246,.1);color:var(--blue-500)}
.nav-section{margin-top:2rem;margin-bottom:1rem;margin-left:1rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--slate-500)}
.nav-section.emerald{color:rgba(52,211,153,.7)}
.nav-section.amber{color:rgba(251,191,36,.7)}
.nav-link.emerald{color:var(--emerald-400)}
.nav-link.emerald:hover{background:rgba(52,211,153,.1);color:var(--emerald-400)}

/* ── Sidebar User Footer ─────────────────────────────────────── */
.sidebar-footer{padding-top:1.5rem;margin-top:2rem;border-top:1px solid var(--white-10)}
.sidebar-user{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.sidebar-avatar{width:2.25rem;height:2.25rem;border-radius:50%;border:2px solid rgba(59,130,246,.5);flex-shrink:0;object-fit:cover}
.sidebar-avatar-initials{width:2.25rem;height:2.25rem;border-radius:50%;background:var(--blue-600);display:flex;align-items:center;justify-content:center;color:#fff;font-size:.75rem;font-weight:700;flex-shrink:0}
.sidebar-user-name{display:block;color:#fff;font-size:.875rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-user-level{display:block;color:var(--blue-500);font-size:.625rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.sidebar-version{text-align:center;margin-top:.75rem;font-size:.625rem;letter-spacing:.05em;color:rgba(100,116,139,.7);font-family:monospace}
.sidebar-terms{text-align:center;margin-top:.25rem}
.sidebar-terms a{font-size:.625rem;color:var(--slate-600);transition:color .15s}
.sidebar-terms a:hover{color:var(--slate-400)}

/* ── Main Content ────────────────────────────────────────────── */
main.main-content{flex:1;padding:1rem;overflow-y:auto;background:linear-gradient(135deg,#0f172a 0%,rgba(30,41,59,.4) 100%);position:relative;width:100%}
@media(min-width:640px){main.main-content{padding:2rem}}
@media(min-width:1024px){main.main-content{padding:3rem;min-height:0}}

/* ── Cards ───────────────────────────────────────────────────── */
.card{background:rgba(30,41,59,.7);backdrop-filter:blur(12px);border:1px solid var(--white-10);border-radius:1rem;padding:2rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}

/* ── Page Title ──────────────────────────────────────────────── */
.page-title{font-size:1.875rem;font-weight:600;letter-spacing:-.025em}

/* ── Buttons ─────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:var(--blue-600);color:#fff;border-radius:.5rem;font-weight:500;font-family:inherit;font-size:1rem;border:none;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;text-decoration:none}
.btn:hover{background:var(--blue-700);transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,.3)}
.btn-danger{background:var(--red-500)}
.btn-danger:hover{background:var(--red-600);box-shadow:0 4px 12px rgba(239,68,68,.3)}
.btn-sm{padding:.375rem .75rem;font-size:.875rem}
.btn-outline{background:transparent;border:1px solid var(--white-10);color:#fff}
.btn-outline:hover{background:var(--white-5)}
.btn-ghost{background:rgba(51,65,85,.6);color:#fff}
.btn-ghost:hover{background:var(--slate-700)}

/* ── Forms ───────────────────────────────────────────────────── */
.form-group{margin-bottom:1.5rem}
.form-group label{display:block;margin-bottom:.5rem;font-size:.875rem;color:var(--slate-400)}
.form-control{width:100%;padding:.75rem 1rem;background:var(--slate-900);border:1px solid var(--slate-700);border-radius:.5rem;color:#f1f5f9;font-family:inherit;font-size:1rem;transition:border-color .15s,box-shadow .15s;appearance:none;-webkit-appearance:none}
.form-control:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 4px rgba(59,130,246,.2)}
select.form-control option{background:var(--slate-900);color:#fff}

/* ── Tables ──────────────────────────────────────────────────── */
table{width:100%;margin-top:1rem;border-collapse:collapse;display:block;overflow-x:auto;white-space:nowrap}
@media(min-width:1024px){table{display:table;white-space:normal}}
th,td{padding:1rem;text-align:left;border-bottom:1px solid var(--white-10)}
th{color:var(--slate-400);font-weight:500;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em}
tbody tr:hover td{background:var(--white-5);transition:background .15s}
.text-right{text-align:right}

/* ── Empty State ─────────────────────────────────────────────── */
.empty-state{text-align:center;padding:4rem 2rem;color:var(--slate-400);display:flex;flex-direction:column;align-items:center;justify-content:center}

/* ── Flash / Alert Messages ──────────────────────────────────── */
.flash{padding:1rem;border-radius:.75rem;margin-bottom:1.5rem;font-weight:500;display:flex;align-items:center;gap:.75rem}
.flash-success{background:rgba(52,211,153,.15);border:1px solid var(--emerald-400);color:var(--emerald-400)}
.flash-error{background:rgba(239,68,68,.15);border:1px solid var(--red-500);color:var(--red-400)}
.flash-warning{background:rgba(245,158,11,.15);border:1px solid var(--amber-500);color:var(--amber-500)}

/* ── Readonly Banner ─────────────────────────────────────────── */
.readonly-banner{padding:1rem;border-radius:.75rem;margin-bottom:1.5rem;font-weight:500;display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:rgba(245,158,11,.15);border:1px solid var(--amber-500);color:var(--amber-500)}

/* ── Badges ──────────────────────────────────────────────────── */
.badge{display:inline-block;padding:.125rem .5rem;border-radius:9999px;font-size:.625rem;font-weight:700}
.badge-blue{background:var(--blue-500);color:#fff}
.badge-red{background:rgba(239,68,68,.2);color:var(--red-400)}
.badge-amber{background:rgba(245,158,11,.2);color:var(--amber-400)}
.badge-slate{background:rgba(51,65,85,1);color:var(--slate-400)}

/* ── Grid Utilities ──────────────────────────────────────────── */
.grid{display:grid}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.gap-4{gap:1rem}
.gap-3{gap:.75rem}
.gap-2{gap:.5rem}
@media(min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:flex-row{flex-direction:row}
  .sm\:items-end{align-items:flex-end}
  .sm\:justify-between{justify-content:space-between}
  .sm\:w-auto{width:auto}
  .sm\:block{display:block}
  .sm\:hidden{display:none}
}
@media(min-width:1024px){
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:hidden{display:none}
}

/* ── Flex Utilities ──────────────────────────────────────────── */
.flex{display:flex}.inline-flex{display:inline-flex}
.flex-col{flex-direction:column}.flex-row{flex-direction:row}
.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}
.items-center{align-items:center}.items-start{align-items:flex-start}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.justify-end{justify-content:flex-end}
.flex-wrap{flex-wrap:wrap}
.gap-6{gap:1.5rem}

/* ── Spacing Utilities ───────────────────────────────────────── */
.p-4{padding:1rem}.p-5{padding:1.25rem}.p-8{padding:2rem}
.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}
.mr-4{margin-right:1rem}

/* ── Width / Height ──────────────────────────────────────────── */
.w-full{width:100%}.w-auto{width:auto}
.w-3{width:.75rem}.h-3{height:.75rem}
.w-4{width:1rem}.h-4{height:1rem}
.w-5{width:1.25rem}.h-5{height:1.25rem}
.w-6{width:1.5rem}.h-6{height:1.5rem}
.w-7{width:1.75rem}.h-7{height:1.75rem}
.w-9{width:2.25rem}.h-9{height:2.25rem}
.w-3\.5{width:.875rem}.h-3\.5{height:.875rem}
.min-w-0{min-width:0}
.h-px{height:1px}

/* ── Typography ──────────────────────────────────────────────── */
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.font-medium{font-weight:500}.font-semibold{font-weight:600}
.font-bold{font-weight:700}.font-mono{font-family:monospace}
.uppercase{text-transform:uppercase}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}
.tracking-widest{letter-spacing:.1em}
.leading-none{line-height:1}
.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}
.underline{text-decoration:underline}
.block{display:block}.hidden{display:none}.inline-block{display:inline-block}

/* ── Colors ──────────────────────────────────────────────────── */
.text-white{color:#fff}
.text-slate-300{color:var(--slate-300)}.text-slate-400{color:var(--slate-400)}
.text-slate-500{color:var(--slate-500)}.text-slate-600{color:var(--slate-600)}
.text-blue-400{color:var(--blue-400)}.text-blue-500{color:var(--blue-500)}
.text-red-400{color:var(--red-400)}.text-red-500{color:var(--red-500)}
.text-amber-300{color:#fcd34d}.text-amber-400{color:var(--amber-400)}.text-amber-500{color:var(--amber-500)}
.text-cyan-200{color:var(--cyan-200)}.text-cyan-300{color:var(--cyan-300)}.text-cyan-400{color:var(--cyan-400)}
.text-emerald-400{color:var(--emerald-400)}
.text-green-400{color:var(--green-400)}
.text-red-100{color:#fee2e2}
.text-amber-200{color:#fde68a}

.bg-slate-700{background:var(--slate-700)}.bg-slate-900{background:var(--slate-900)}
.bg-white\/5{background:var(--white-5)}.bg-white\/10{background:var(--white-10)}
.bg-blue-600{background:var(--blue-600)}.bg-blue-500{background:var(--blue-500)}
.bg-amber-500{background:var(--amber-500)}.bg-red-500{background:var(--red-500)}
.bg-cyan-400{background:var(--cyan-400)}.bg-amber-400{background:var(--amber-400)}
.bg-red-500\/15{background:rgba(239,68,68,.15)}.bg-red-500\/20{background:rgba(239,68,68,.2)}
.bg-amber-500\/15{background:rgba(245,158,11,.15)}.bg-amber-500\/20{background:rgba(245,158,11,.2)}
.bg-slate-700\/60{background:rgba(51,65,85,.6)}
.bg-slate-900\/50{background:rgba(15,23,42,.5)}

.border{border-width:1px;border-style:solid}
.border-white\/5{border-color:rgba(255,255,255,.05)}
.border-white\/10{border-color:var(--white-10)}.border-white\/15{border-color:var(--white-15)}
.border-white\/25{border-color:rgba(255,255,255,.25)}
.border-slate-700{border-color:var(--slate-700)}
.border-blue-500\/20{border-color:rgba(59,130,246,.2)}
.border-red-500\/20{border-color:rgba(239,68,68,.2)}
.border-t{border-top-width:1px;border-top-style:solid}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border-l-4{border-left-width:4px;border-left-style:solid}
.border-l-blue-500{border-left-color:var(--blue-500)}
.border-l-red-500{border-left-color:var(--red-500)}
.border-l-cyan-500{border-left-color:#06b6d4}
.border-l-amber-500{border-left-color:var(--amber-500)}
.border-l-green-600{border-left-color:#16a34a}
.border-l-slate-600{border-left-color:var(--slate-600)}

.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}
.rounded-full{border-radius:9999px}.rounded-md{border-radius:.375rem}

.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.3)}

.opacity-80{opacity:.8}
.overflow-hidden{overflow:hidden}
.overflow-x-auto{overflow-x:auto}
.object-cover{object-fit:cover}
.relative{position:relative}.fixed{position:fixed}.sticky{position:sticky}
.inset-0{inset:0}.top-0{top:0}.left-0{left:0}
.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}
.self-start{align-self:flex-start}
.space-y-2>*+*{margin-top:.5rem}.space-y-5>*+*{margin-top:1.25rem}
.flex-none{flex:none}

/* ── Hover utilities ─────────────────────────────────────────── */
.hover\:text-blue-400:hover{color:var(--blue-400)}
.hover\:text-red-300:hover{color:#fca5a5}
.hover\:text-red-400:hover{color:var(--red-400)}
.hover\:text-amber-300:hover{color:#fcd34d}
.hover\:text-slate-200:hover{color:#e2e8f0}
.hover\:text-slate-300:hover{color:var(--slate-300)}
.hover\:bg-blue-500\/10:hover{background:rgba(59,130,246,.1)}
.hover\:bg-red-500\/10:hover{background:rgba(239,68,68,.1)}
.hover\:text-white:hover{color:#fff}
.transition-colors{transition:color .15s,background-color .15s,border-color .15s}

/* ── Sidebar Mobile Toggle (via JS .open) ────────────────────── */
aside#sidebar.open{transform:translateX(0)}
#sidebar-overlay.open{display:block}

/* ── Animações ───────────────────────────────────────────────── */
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.animate-fade{animation:fadeIn .4s ease-out forwards}

/* ── Página de Login ─────────────────────────────────────────── */
body.login-layout{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at top,#1e293b,#020617);padding:1rem}
.login-card{width:100%;max-width:28rem;background:rgba(30,41,59,.8);backdrop-filter:blur(16px);border:1px solid var(--white-10);padding:2.5rem;border-radius:1.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.8)}
.login-logo{font-size:1.875rem;font-weight:700;text-align:center;margin-bottom:2rem;color:#fff}
.login-logo span{color:var(--blue-500)}
.login-error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.5);color:var(--red-400);padding:1rem;border-radius:.75rem;margin-bottom:1.5rem;font-weight:500;font-size:.875rem}
.login-success{background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.5);color:var(--emerald-400);padding:1rem;border-radius:.75rem;margin-bottom:1.5rem;font-weight:500;font-size:.875rem}
.btn-google{display:flex;align-items:center;justify-content:center;gap:.75rem;width:100%;padding:.75rem 1rem;margin-bottom:1.5rem;border-radius:.75rem;border:1px solid var(--white-15);background:var(--white-5);color:#e2e8f0;font-weight:600;font-size:.875rem;transition:background .2s,transform .2s,box-shadow .2s,border-color .2s;cursor:pointer;text-decoration:none}
.btn-google:hover{background:var(--white-10);transform:translateY(-1px);box-shadow:0 10px 15px -3px rgba(0,0,0,.3);border-color:var(--white-25)}
.login-divider{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem}
.login-divider-line{flex:1;height:1px;background:var(--white-10)}
.login-divider-text{color:var(--slate-500);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}
.login-form .form-control{background:var(--slate-900);border-color:var(--slate-700)}
.btn-login{width:100%;background:var(--blue-600);color:#fff;padding:.75rem;border-radius:.5rem;font-weight:600;font-size:1rem;border:none;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s;margin-top:.5rem}
.btn-login:hover{background:var(--blue-700);transform:translateY(-1px);box-shadow:0 10px 15px -3px rgba(37,99,235,.3)}
.login-footer{text-align:center;color:var(--slate-500);font-size:.75rem;margin-top:1.5rem}
.login-footer a{color:var(--blue-500);transition:color .15s}
.login-footer a:hover{color:var(--blue-400)}
.login-branding{text-align:center;color:rgba(100,116,139,.4);font-size:.625rem;margin-top:1rem}
.forgot-link{font-size:.75rem;color:var(--blue-500);transition:color .15s}
.forgot-link:hover{color:var(--blue-400)}
.field-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}
.field-label{font-size:.875rem;font-weight:500;color:var(--slate-400)}

/* ── Misc inline utilities ───────────────────────────────────── */
.border-t.border-white\/5{border-top:1px solid rgba(255,255,255,.05)}
.pt-2{padding-top:.5rem}.pt-6{padding-top:1.5rem}
.pb-0{padding-bottom:0}
.whitespace-nowrap{white-space:nowrap}
.max-w-md{max-width:28rem}

/* ── Responsive SM helpers ───────────────────────────────────── */
@media(min-width:640px){
  .sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}
  .sm\:flex-none{flex:none}
  .sm\:items-center{align-items:center}
}
