/* Admin-Bereich – nutzt die Variablen aus ../css/styles.css (dunkles Theme, Markenrot) */
.admin {
  background: var(--c-ink, #15151a);
  color: #e9e9ee;
  font-family: var(--font-body, system-ui, sans-serif);
  min-height: 100vh;
  margin: 0;
}
.admin a { color: #e9e9ee; }

/* Topbar */
.admin-top { border-bottom: 1px solid var(--c-graphite, #26262e); background: var(--c-carbon, #1b1b21); }
.admin-top__in { max-width: 1100px; margin: 0 auto; padding: 1rem 1.4rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.admin-top strong { font-family: var(--font-display, sans-serif); font-size: 1.1rem; }
.admin-top nav { display: flex; gap: 1.2rem; align-items: center; }
.admin-top nav a { font-size: .9rem; color: #b6b6c0; text-decoration: none; }
.admin-top nav a:hover { color: #fff; }
.admin-logout { color: var(--c-red, #e10613) !important; font-weight: 600; }

/* Layout */
.admin-wrap { max-width: 1100px; margin: 0 auto; padding: 1.6rem 1.4rem 4rem; display: grid; gap: 1.6rem; }
.admin-card {
  background: var(--c-carbon, #1b1b21);
  border: 1px solid var(--c-graphite, #26262e);
  border-radius: var(--radius-lg, 10px);
  padding: clamp(1.2rem, 3vw, 2rem);
}
.admin-card h2 { font-family: var(--font-display, sans-serif); font-size: 1.25rem; margin: 0 0 .4rem; }
.admin-muted { color: #9a9aa2; font-size: .9rem; line-height: 1.6; margin: 0 0 1rem; }
.admin-count { color: #9a9aa2; font-weight: 400; font-size: .85rem; font-family: var(--font-body, sans-serif); }
.admin-empty { color: #9a9aa2; padding: 1.5rem 0; }

/* Hinweise */
.admin-alert { padding: .8rem 1rem; border-radius: var(--radius, 4px); margin-bottom: 1.2rem; font-size: .92rem; }
.admin-alert--ok  { background: rgba(40,160,80,.14);  border: 1px solid rgba(40,160,80,.5);  color: #c7f0d4; }
.admin-alert--err { background: var(--c-red-tint, rgba(225,6,19,.12)); border: 1px solid var(--c-red, #e10613); color: #ffd4d7; }

/* Felder */
.admin-field { display: flex; flex-direction: column; gap: .35rem; margin-bottom: .9rem; }
.admin-field > span { font-size: .82rem; color: #c8c8d0; font-weight: 600; }
.admin-field input, .admin-upload input[type=file] {
  width: 100%; padding: .7rem .85rem; color: #fff;
  background: var(--c-ink, #15151a); border: 1px solid var(--c-steel, #3a3a44);
  border-radius: var(--radius, 4px); font: inherit; box-sizing: border-box;
}
.admin-field input:focus, .admin-upload input:focus {
  outline: none; border-color: var(--c-red, #e10613); box-shadow: 0 0 0 3px var(--c-red-tint, rgba(225,6,19,.12));
}
.admin-field--sm input { padding: .55rem .7rem; font-size: 1rem; }   /* >=16px -> kein iOS-Auto-Zoom beim Fokus */
.admin-check { display: flex; align-items: center; gap: .5rem; font-size: .88rem; color: #c8c8d0; margin: .2rem 0 .8rem; cursor: pointer; }
.admin-check input { width: 1.1rem; height: 1.1rem; accent-color: var(--c-red, #e10613); }

/* Upload-Form */
.admin-upload { display: flex; gap: .8rem; flex-wrap: wrap; align-items: center; }
.admin-upload input[type=file] { flex: 1 1 320px; }

/* Buttons (kleine Variante zusätzlich zu .btn aus styles.css) */
.btn--sm { padding: .5rem .9rem; font-size: .85rem; }
.btn--block { width: 100%; justify-content: center; }

/* Medien-Raster */
.admin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1.2rem; }
.admin-item {
  background: var(--c-ink, #15151a); border: 1px solid var(--c-graphite, #26262e);
  border-radius: var(--radius, 4px); padding: .8rem; display: flex; flex-direction: column;
}
.admin-thumb { position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius, 4px); overflow: hidden; background: #000; margin-bottom: .8rem; }
.admin-thumb img, .admin-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; }
.admin-thumb__badge {
  position: absolute; top: .5rem; left: .5rem; background: var(--c-red, #e10613); color: #fff;
  font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  padding: .15rem .5rem; border-radius: 99px;
}
.admin-meta { display: flex; flex-direction: column; }
.admin-actions { margin-top: .2rem; }
.admin-del { margin-top: .6rem; text-align: right; }
.admin-trash {
  background: none; border: none; color: #9a9aa2; font: inherit; font-size: .82rem;
  cursor: pointer; padding: .2rem; text-decoration: underline;
}
.admin-trash:hover { color: var(--c-red, #e10613); }

/* Login-Seite */
.admin-auth { min-height: 100vh; display: grid; place-items: center; padding: 1.4rem; }
.admin-login { width: min(420px, 100%); }
.admin-login h1 { font-family: var(--font-display, sans-serif); font-size: 1.6rem; margin: .2rem 0 .3rem; }
.admin-login .eyebrow { color: var(--c-red, #e10613); }
.admin-back { display: inline-block; margin-top: 1.1rem; color: #9a9aa2; font-size: .88rem; text-decoration: none; }
.admin-back:hover { color: #fff; }