/* Admin · Jan — painel de administración */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: #fafafa;
  color: #17181c;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* toolbar */
.toolbar {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e3e6ea;
}
.toolbar .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

/* views */
.view {
  display: none;
}
.view.active { display: block; }

.card {
  background: #fff;
  border: 1px solid #e3e6ea;
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}
.card .error { color: #b00020; margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #e3e6ea; }
fieldset { border: none; margin: 0; padding: 0; }

/* login form */
#login-form { max-width: 360px; }
#login-form h2 { margin-top: 0; margin-bottom: 1rem; font-size: 1.25rem; }
#login-form .error { margin-top: 1rem; color: #b00020; display: block; }
#login-form .btn { width: 100%; margin-top: 1rem; }

/* editor form */
.editor .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; margin-bottom: 1rem; }
.editor .grid2 label { display: block; font-size: 0.875rem; margin-bottom: 0.5rem; }
.editor .grid2 input, .editor .grid2 select, .editor .grid2 textarea { width: 100%; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px; font-family: inherit; font-size: 1rem; }
.editor .grid2 textarea { resize: vertical; min-height: 120px; }
.editor .langs { margin-top: 1rem; display: flex; gap: 0.5rem; }
.editor .tab { padding: 0.5rem 1rem; border: 1px solid #ddd; border-radius: 4px 4px 0 0; cursor: pointer; }
.editor .tab.active { background: #f0f0f0; border-color: #b0b0b0; }
.editor .lang-pane { margin-top: 1rem; display: none; }
.editor .lang-pane.active { display: block; }
.editor .lang-pane[data-pane="es"] { display: block; } /* inicial */
.actions { margin-top: 1rem; display: flex; gap: 0.5rem; justify-content: flex-end; }
.status { margin-top: 0.5rem; font-size: 0.875rem; color: #555; }

/* article list */
.list { list-style: none; margin: 0; padding: 0; }
.list li { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 0.75rem; font-size: 0.875rem; }
.list .actions .btn { gap: 0; padding: 0.25rem 0.5rem; font-size: 0.75rem; }

/* utils */
.btn { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.5rem 1rem; border: 1px solid #ddd; border-radius: 4px; font-size: 0.875rem; cursor: pointer; background: #fff; color: #17181c; text-decoration: none; }
.btn--primary { background: #7ADD73; color: #10290f; border-color: #7ADD73; }
.btn--primary:hover { background: #6ED069; }
.btn--ghost { background: transparent; border-color: #17181c; color: #17181c; }
.btn--ghost:hover { background: #e5e5e5; }
.error { color: #b00020; }