:root{
  --steel-900:#20242A; --steel-800:#2B3138;
  --paper:#E7E6DD; --paper-2:#F2F1EA;
  --ink:#20241F; --ink-soft:#5B5F56;
  --brass:#B4884F; --brass-light:#D9B679;
  --line:#C9C4B4;
  --green:#3F6E54; --green-bg:#DCE7DE;
  --amber:#A97324; --amber-bg:#EFE1C6;
  --red:#9C4033; --red-bg:#EAD6D1;
  --neutral:#8B8A7E; --neutral-bg:#DEDCD0;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{font-family:'Inter', sans-serif; background:var(--paper-2); color:var(--ink);}

/* El atributo [hidden] siempre debe ganar, sin importar la especificidad de otras reglas */
[hidden]{display:none !important;}

/* LOGIN */
.login-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(160deg, var(--steel-900), var(--steel-800));}
.login-card{background:var(--paper-2); padding:36px 32px; border-radius:16px; width:340px; box-shadow:0 30px 60px rgba(0,0,0,0.35);}
.login-eyebrow{font-family:'IBM Plex Mono', monospace; font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--brass); margin-bottom:6px;}
.login-card h1{font-family:'Oswald', sans-serif; font-size:22px; margin-bottom:20px;}
.login-card label{display:block; font-size:12.5px; font-weight:600; margin-bottom:14px; color:var(--ink-soft);}
.login-card input{width:100%; margin-top:6px; padding:11px 12px; border-radius:8px; border:1.5px solid var(--line); font-size:14px; font-family:'Inter',sans-serif;}
.login-card input:focus{outline:2px solid var(--brass); border-color:var(--brass);}
.login-card button{width:100%; padding:12px; background:var(--steel-900); color:#fff; border:none; border-radius:8px; font-weight:600; font-size:14px; cursor:pointer; margin-top:6px;}
.login-card button:hover{background:var(--steel-800);}
.login-error{margin-top:12px; font-size:12.5px; color:var(--red); background:var(--red-bg); padding:8px 10px; border-radius:6px;}

/* APP LAYOUT */
.admin-app{display:flex; min-height:100vh;}
.sidebar{width:220px; background:var(--steel-900); color:var(--paper-2); padding:24px 18px; display:flex; flex-direction:column; flex-shrink:0;}
.sidebar-title{font-family:'Oswald', sans-serif; font-weight:600; font-size:17px;}
.sidebar-sub{font-family:'IBM Plex Mono', monospace; font-size:10.5px; color:var(--brass-light); margin-bottom:24px;}
nav{display:flex; flex-direction:column; gap:4px; flex:1;}
.nav-item{text-align:left; background:none; border:none; color:#c8ccd2; padding:10px 12px; border-radius:8px; font-size:13.5px; font-weight:500; cursor:pointer;}
.nav-item:hover{background:rgba(255,255,255,0.06);}
.nav-item.active{background:rgba(180,136,79,0.18); color:var(--brass-light); font-weight:600;}
.logout-btn{background:none; border:1px solid rgba(255,255,255,0.2); color:#c8ccd2; padding:9px; border-radius:8px; font-size:12.5px; cursor:pointer; margin-top:20px;}
.logout-btn:hover{border-color:var(--brass);}

.content{flex:1; padding:32px 40px; max-width:1000px;}
.tab{display:none;}
.tab.active{display:block;}
.tab-header{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;}
.tab-header h2{font-family:'Oswald', sans-serif; font-size:24px; font-weight:600;}
.tab-desc{font-size:13px; color:var(--ink-soft); margin-bottom:18px;}

.primary-btn{background:var(--steel-900); color:#fff; border:none; padding:10px 16px; border-radius:8px; font-weight:600; font-size:13.5px; cursor:pointer;}
.primary-btn:hover{background:var(--steel-800);}
.secondary-btn{background:none; border:1.5px solid var(--line); padding:10px 16px; border-radius:8px; font-weight:600; font-size:13.5px; cursor:pointer; color:var(--ink);}
.secondary-btn:hover{border-color:var(--brass);}

.inline-form{display:flex; gap:10px; margin:18px 0;}
.inline-form input{flex:1; max-width:320px; padding:10px 12px; border-radius:8px; border:1.5px solid var(--line); font-size:13.5px;}

.table-wrap{margin-top:18px; background:var(--paper-2); border:1px solid var(--line); border-radius:12px; overflow:hidden;}
table{width:100%; border-collapse:collapse;}
th{text-align:left; font-family:'IBM Plex Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft); background:var(--paper); padding:10px 14px; border-bottom:1px solid var(--line);}
td{padding:11px 14px; font-size:13.5px; border-bottom:1px solid var(--line);}
tr:last-child td{border-bottom:none;}
.badge{display:inline-block; padding:3px 9px; border-radius:6px; font-size:11.5px; font-weight:600;}
.badge-numero{background:var(--steel-900); color:#fff; font-family:'Oswald',sans-serif;}
.badge-activo{background:var(--green-bg); color:var(--green);}
.badge-inactivo{background:var(--neutral-bg); color:var(--ink-soft);}
.link-btn{background:none; border:none; color:var(--ink-soft); text-decoration:underline; cursor:pointer; font-size:12.5px;}

/* MODAL */
.modal-scrim{position:fixed; inset:0; background:rgba(20,23,27,0.55); display:flex; align-items:center; justify-content:center; z-index:100; padding:20px;}
.modal{background:var(--paper-2); border-radius:16px; padding:28px; width:480px; max-width:100%; max-height:90vh; overflow-y:auto;}
.modal h2{font-family:'Oswald', sans-serif; font-size:20px; margin-bottom:18px;}
.modal label{display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:12px;}
.modal input, .modal select{width:100%; margin-top:5px; padding:10px 11px; border-radius:8px; border:1.5px solid var(--line); font-size:13.5px; font-family:'Inter',sans-serif;}
.form-row{display:flex; gap:12px;}
.form-row label{flex:1;}
#bMap{height:200px; border-radius:10px; margin-top:6px; border:1.5px solid var(--line);}
.coords-row{font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--ink-soft); margin:8px 0 16px;}
.modal-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:8px;}
.form-error{margin-top:12px; font-size:12.5px; color:var(--red); background:var(--red-bg); padding:8px 10px; border-radius:6px;}

.toast{position:fixed; left:50%; bottom:24px; transform:translate(-50%, 12px); background:var(--steel-900); color:#fff; padding:11px 18px; border-radius:10px; font-size:12.5px; font-weight:500; opacity:0; pointer-events:none; transition:opacity 0.2s ease, transform 0.2s ease; z-index:200;}
.toast.show{opacity:1; transform:translate(-50%, 0);}