/* Admin MonstruoCity — simple, sobre la paleta de styles.css */
body.adm { background: var(--bg); color: var(--fg); }
.adm-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .75rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.08); background: var(--bg-2); }
.adm-top nav { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.adm-top a { color: var(--fg); text-decoration: none; }
.adm-top a:hover { color: var(--cyan); }
.adm-logo { font-weight: 700; color: var(--cyan) !important; }
.adm-main { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }
.adm-main h1 { margin: .25rem 0 1rem; }
.adm-main h1 small { font-size: .9rem; font-weight: 400; }
.adm-box { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 10px; padding: 1.1rem 1.25rem; margin: 0 0 1.25rem; }
.adm-box h2 { margin-top: 0; font-size: 1.15rem; }
.adm-cols { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: flex-start; }
.adm-cols > .adm-box { flex: 0 1 380px; }
.adm-cols > .adm-grow { flex: 1 1 420px; }
.adm-inline { display: inline-flex; gap: .4rem; margin: 0; align-items: center; }
.adm-form { display: grid; gap: .8rem; }
.adm-form label { display: grid; gap: .3rem; font-weight: 600; }
.adm-form input[type=text], .adm-form input[type=password], .adm-form input[type=date], .adm-form textarea, .adm-form select {
  width: 100%; padding: .55rem .7rem; border-radius: 6px; border: 1px solid rgba(255,255,255,.15);
  background: rgba(0,0,0,.35); color: var(--fg); font: inherit; font-weight: 400; }
.adm-form fieldset { border: 1px solid rgba(255,255,255,.1); border-radius: 6px; }
.adm-check { display: flex !important; grid-template-columns: none; gap: .4rem; font-weight: 400 !important; align-items: center; }
.adm-flash { padding: .75rem 1rem; border-radius: 8px; margin-bottom: 1rem; border: 1px solid; }
.adm-flash--ok { border-color: rgba(0,217,255,.5); background: rgba(0,217,255,.08); }
.adm-flash--error { border-color: rgba(255,80,100,.6); background: rgba(255,80,100,.1); }
.adm-error { color: #ff6b81; margin: 0; }
.adm-login { max-width: 360px; margin: 12vh auto; }
.adm-login h1 { text-align: center; color: var(--cyan); }
.adm-big { font-size: 1.15rem; padding: .8rem 1.6rem; }
.adm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .9rem; margin-bottom: 1.25rem; }
.adm-stat { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 10px; padding: .9rem; color: var(--muted); }
.adm-stat span { display: block; font-size: 1.5rem; font-weight: 700; color: var(--fg); }
.adm-table { width: 100%; border-collapse: collapse; margin: .5rem 0; }
.adm-table th, .adm-table td { padding: .5rem .6rem; border-bottom: 1px solid rgba(255,255,255,.07); text-align: left; vertical-align: middle; }
.adm-table th { color: var(--muted); font-weight: 600; font-size: .85rem; }
.adm-table a { color: var(--fg); }
.adm-dim { opacity: .5; }
.adm-nowrap { white-space: nowrap; }
.adm-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 4px; display: block; }
.adm-cover { width: 100%; max-width: 320px; border-radius: 8px; display: block; margin-bottom: .6rem; }
.adm-video { width: 100%; max-width: 360px; }
.adm-pos { width: 4.5rem; padding: .3rem; background: rgba(0,0,0,.35); color: var(--fg); border: 1px solid rgba(255,255,255,.15); border-radius: 4px; }
.adm-pill { display: inline-block; font-size: .75rem; padding: 1px 8px; border-radius: 999px; background: rgba(255,255,255,.1); margin-left: .3rem; }
.adm-pill--working { background: rgba(0,217,255,.25); }
.adm-pill--error { background: rgba(255,80,100,.3); }
.adm-ok { color: #3ddc97; }
.adm-warn { color: #ffb020; }
.adm-danger { border-color: rgba(255,80,100,.6) !important; color: #ff6b81 !important; }
.adm-file { border-top: 1px solid rgba(255,255,255,.07); padding: .8rem 0; }
.adm-file:first-of-type { border-top: 0; }
.adm-file h3 { margin: 0 0 .4rem; font-size: 1rem; }
.adm-file audio { width: 100%; }
.adm-upload { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .4rem 0; }
.adm-upload input[type=file] { max-width: 220px; font-size: .85rem; }
.adm-upload progress { width: 140px; }
.adm-list { columns: 2 280px; }
.adm-token { word-break: break-all; font-size: 1rem; background: rgba(0,0,0,.4); padding: .3rem .5rem; border-radius: 4px; user-select: all; }

/* Estadísticas */
.adm-head { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.adm-head h1 { margin: 0 auto 0 0; }
.adm-select { padding: .5rem .7rem; border-radius: 6px; border: 1px solid rgba(255,255,255,.15); background: rgba(0,0,0,.35); color: var(--fg); font: inherit; }
.adm-stat small { display: block; font-size: .75rem; color: var(--muted); }
.adm-stat--sitio span { color: #e8eaed; }
.adm-stat--sitio { border-color: rgba(196,127,18,.35); }
.adm-key { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: .5rem; vertical-align: middle; }
.adm-chart { width: 100%; height: auto; display: block; }
.adm-grid { stroke: rgba(255,255,255,.07); stroke-width: 1; }
.adm-axis { stroke: rgba(255,255,255,.18); stroke-width: 1; }
.adm-tick { fill: #9aa0a6; font-size: 11px; font-family: inherit; }
.adm-bar:hover path { opacity: .8; }
.adm-bar:hover rect { fill: rgba(255,255,255,.04); }
.adm-nota { font-size: .82rem; margin: .5rem 0 0; }
.adm-hbars { display: flex; flex-direction: column; gap: .45rem; }
.adm-hbar { display: grid; grid-template-columns: minmax(110px, 38%) 1fr; gap: .6rem; align-items: center; font-size: .88rem; }
.adm-hbar:hover .adm-hbar__fill { opacity: .8; }
.adm-hbar__lab { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #c3c7cc; }
.adm-hbar__track { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.adm-hbar__fill { height: 14px; border-radius: 0 4px 4px 0; flex: 0 0 auto; max-width: calc(100% - 60px); }
.adm-hbar__val { color: #e8eaed; font-variant-numeric: tabular-nums; white-space: nowrap; }
.adm-table-wrap { overflow-x: auto; }
.adm-num td:not(:first-child), .adm-num th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.adm-th-sitio { color: #e0a64a !important; }
.adm-tip { position: fixed; z-index: 99; pointer-events: none; background: #11151b; color: #e8eaed; border: 1px solid rgba(255,255,255,.15);
  padding: .35rem .6rem; border-radius: 6px; font-size: .82rem; box-shadow: 0 8px 20px rgba(0,0,0,.5); }
.adm-pasos li { margin-bottom: .45rem; }
