/* Admin workspace: quiet, modern control-room UI. */
:root {
  --admin-ink: #132238;
  --admin-muted: #66758a;
  --admin-paper: #f3f6fb;
  --admin-card: #fff;
  --admin-line: #dfe6ef;
  --admin-brand: #2457d6;
  --admin-brand-dark: #183c9b;
  --admin-cyan: #07a5b5;
  --admin-success: #16835f;
  --admin-danger: #c63f54;
  --admin-shadow: 0 1rem 2.75rem rgb(23 43 77 / 9%);
  --admin-radius: 0.9rem;
}

.admin-body {
  min-height: 100vh;
  background: var(--admin-paper);
  color: var(--admin-ink);
}

.admin-body::before { display: none; }
.admin-body h1,
.admin-body h2,
.admin-body h3 { color: var(--admin-ink); font-family: inherit; letter-spacing: -0.035em; }
.admin-body h1 { font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 780; }
.admin-body h2 { font-size: clamp(1.55rem, 3vw, 2.25rem); font-weight: 760; }
.admin-body h3 { font-size: 1.03rem; font-weight: 750; }

.login-shell {
  display: grid;
  min-height: 100vh;
  padding: 1.25rem;
  place-items: center;
  background: radial-gradient(circle at 10% 0%, rgb(36 87 214 / 13%), transparent 34rem), var(--admin-paper);
}

.login-card {
  position: relative;
  width: min(100%, 28rem);
  padding: clamp(1.6rem, 5vw, 2.75rem);
  overflow: hidden;
  border: 1px solid var(--admin-line);
  border-radius: 1.25rem;
  background: var(--admin-card);
  box-shadow: var(--admin-shadow);
}

.login-card::after {
  position: absolute;
  right: -4rem;
  bottom: -5rem;
  width: 11rem;
  height: 11rem;
  border: 1px solid rgb(36 87 214 / 16%);
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.login-card .brand { margin-block-end: 2.8rem; }
.login-card h1 { margin-block-end: 0.5rem; }
.login-card > p:not(.eyebrow, .form-message) { color: var(--admin-muted); }
.login-card form { display: grid; gap: 1rem; margin-block-start: 1.6rem; }
.form-message { min-height: 1.6em; margin: 1rem 0 0; color: var(--admin-danger); font-weight: 700; }

.eyebrow {
  color: var(--admin-brand);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.brand { color: var(--admin-ink); }
.brand-mark { background: var(--admin-brand); color: white; }

.admin-app { min-height: 100vh; }
.admin-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: 4.35rem;
  padding: 0.7rem clamp(1rem, 4vw, 2.5rem);
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--admin-line);
  background: rgb(255 255 255 / 91%);
  backdrop-filter: blur(16px);
}

.admin-header .brand { font-size: 0.82rem; }
.admin-header-actions, .form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }

.button-small { min-height: 2.3rem; padding: 0.4rem 0.75rem; font-size: 0.78rem; }
.button-quiet { border-color: transparent; background: transparent; color: var(--admin-muted); }
.button-quiet:hover { background: #edf1f7; color: var(--admin-ink); }
.button-danger { border-color: rgb(198 63 84 / 26%); background: #fff1f3; color: var(--admin-danger); }
.button-danger:hover { border-color: var(--admin-danger); background: #ffe6ea; }
.button-primary { background: var(--admin-brand); color: white; box-shadow: 0 0.35rem 0.8rem rgb(36 87 214 / 18%); }
.button-primary:hover { background: var(--admin-brand-dark); }
.button-secondary { border-color: #cbd5e2; background: white; color: var(--admin-ink); }
.button-secondary:hover { border-color: var(--admin-brand); background: #f3f6ff; color: var(--admin-brand-dark); }

.admin-layout { display: grid; grid-template-columns: 15rem minmax(0, 1fr); }
.admin-sidebar {
  position: sticky;
  top: 4.35rem;
  height: calc(100vh - 4.35rem);
  padding: 1.7rem 1rem;
  border-right: 1px solid #25344c;
  background: #121d31;
  color: white;
}
.admin-sidebar .eyebrow { color: #8ea9e9; padding-inline: 0.7rem; }
.admin-sidebar nav { display: grid; gap: 0.3rem; margin-block-start: 0.8rem; }
.admin-sidebar nav a {
  padding: 0.68rem 0.75rem;
  border-radius: 0.55rem;
  color: #afbdd1;
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease;
}
.admin-sidebar nav a::before { display: inline-block; width: 0.35rem; height: 0.35rem; margin-inline-end: 0.6rem; border: 1px solid currentcolor; border-radius: 50%; content: ""; vertical-align: 0.1em; }
.admin-sidebar nav a:hover, .admin-sidebar nav a:focus-visible { background: #22304a; color: white; }
.sidebar-note { position: absolute; right: 1rem; bottom: 1.3rem; left: 1rem; margin: 0; color: #8290a6; font-size: 0.72rem; line-height: 1.45; }

.admin-content { min-width: 0; padding: 0 clamp(1rem, 4vw, 3rem) 5rem; }
.admin-section { padding-block: clamp(2.5rem, 6vw, 4.25rem); border-bottom: 1px solid var(--admin-line); scroll-margin-top: 4.35rem; }
.admin-section-heading { display: flex; margin-block-end: 1.45rem; align-items: end; justify-content: space-between; gap: 1rem; }
.admin-section-heading h1, .admin-section-heading h2 { margin-block-end: 0; }
.admin-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; }
.admin-stats article {
  display: grid;
  min-height: 7.5rem;
  padding: 1rem 1.1rem;
  align-content: space-between;
  border: 1px solid var(--admin-line);
  border-radius: var(--admin-radius);
  background: var(--admin-card);
  box-shadow: 0 0.4rem 1.3rem rgb(23 43 77 / 4%);
}
.admin-stats article:nth-child(2) { border-top: 3px solid var(--admin-success); }
.admin-stats article:nth-child(3) { border-top: 3px solid var(--admin-cyan); }
.admin-stats article:nth-child(4) { border-top: 3px solid #e7a93b; }
.admin-stats span { color: var(--admin-muted); font-size: 0.68rem; font-weight: 820; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-stats strong { color: var(--admin-ink); font-size: clamp(2rem, 4vw, 3.15rem); font-weight: 780; line-height: 1; }

.admin-form { display: grid; padding: clamp(1rem, 3vw, 1.6rem); gap: 1.05rem; border: 1px solid var(--admin-line); border-radius: var(--admin-radius); background: var(--admin-card); box-shadow: 0 0.4rem 1.4rem rgb(23 43 77 / 4%); }
.compact-form { margin-block-end: 1.1rem; background: #f9fbff; }
.compact-form h3 { margin: 0; }
.form-grid { display: grid; gap: 0.9rem; }
.form-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.admin-field { display: grid; min-width: 0; gap: 0.4rem; }
.admin-field > span, .admin-fieldset legend { color: var(--admin-ink); font-size: 0.74rem; font-weight: 760; }
.admin-field input, .admin-field textarea, .admin-field select { width: 100%; min-height: 2.65rem; padding: 0.56rem 0.7rem; border: 1px solid #ccd6e3; border-radius: 0.55rem; background: white; }
.admin-field input::placeholder { color: #9aa7b7; }
.admin-field input:hover, .admin-field textarea:hover, .admin-field select:hover { border-color: #9eafc5; }
.admin-field input:focus, .admin-field textarea:focus, .admin-field select:focus { border-color: var(--admin-brand); box-shadow: 0 0 0 3px rgb(36 87 214 / 12%); outline: none; }
.admin-field textarea { min-height: auto; resize: vertical; }
.admin-field input[type="file"] { padding: 0.4rem; }
.admin-field small { color: var(--admin-muted); font-size: 0.7rem; }
.admin-fieldset { margin: 0; padding: 1rem; border: 1px solid var(--admin-line); border-radius: 0.65rem; }
.admin-fieldset legend { padding-inline: 0.35rem; }

.admin-prize-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 0.75rem; }
.admin-prize-card { display: grid; overflow: hidden; border: 1px solid var(--admin-line); border-radius: var(--admin-radius); background: var(--admin-card); box-shadow: 0 0.4rem 1.4rem rgb(23 43 77 / 4%); }
.admin-prize-image { display: grid; overflow: hidden; aspect-ratio: 3 / 1.45; place-items: center; background: #e9eff8; color: var(--admin-muted); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-prize-image img { width: 100%; height: 100%; object-fit: cover; }
.admin-prize-copy { padding: 0.95rem 1rem; }
.admin-prize-copy h3 { margin-block-end: 0.3rem; }
.admin-prize-copy p { min-height: 2.7em; margin-block-end: 0.85rem; color: var(--admin-muted); font-size: 0.8rem; line-height: 1.35; }

.admin-ticket-toolbar { display: grid; margin-block-end: 0.9rem; padding: 0.9rem; grid-template-columns: 1fr minmax(10rem, 0.28fr); gap: 0.8rem; border: 1px solid var(--admin-line); border-radius: var(--admin-radius); background: var(--admin-card); }
.admin-ticket-list { display: grid; gap: 0.45rem; }
.admin-ticket-row { display: grid; min-height: 4rem; padding: 0.65rem 0.9rem; align-items: center; grid-template-columns: 4.25rem 7rem minmax(9rem, 1fr) minmax(8rem, 0.5fr) auto; gap: 0.85rem; border: 1px solid var(--admin-line); border-left: 3px solid #c8d2df; border-radius: 0.65rem; background: var(--admin-card); }
.admin-ticket-row.is-sold { border-left-color: var(--admin-success); }
.admin-ticket-row.is-available { border-left-color: #e7a93b; }
.admin-ticket-id { color: var(--admin-muted); font-size: 0.68rem; font-weight: 820; letter-spacing: 0.07em; }
.admin-ticket-pair { color: var(--admin-ink); font-size: 1.1rem; font-weight: 800; letter-spacing: -0.02em; }
.admin-ticket-buyer, .admin-ticket-phone { overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.admin-ticket-buyer { font-size: 0.85rem; font-weight: 750; }
.admin-ticket-phone { color: var(--admin-muted); font-size: 0.77rem; }
.results-summary { margin: 0 0 0.7rem; color: var(--admin-muted); font-size: 0.78rem; font-weight: 700; }
.empty-inline { margin: 0; padding: 1.5rem; border: 1px dashed #c5d1e0; border-radius: 0.65rem; color: var(--admin-muted); text-align: center; }

.admin-dialog { width: min(calc(100% - 2rem), 35rem); max-height: calc(100vh - 2rem); padding: clamp(1.2rem, 4vw, 1.8rem); border: 1px solid var(--admin-line); border-radius: 1rem; background: var(--admin-paper); box-shadow: 0 2rem 6rem rgb(11 27 56 / 28%); }
.admin-dialog::backdrop { background: rgb(9 20 37 / 68%); backdrop-filter: blur(5px); }
.admin-dialog h2 { margin-block-end: 0.55rem; }
.dialog-close-form { position: absolute; top: 0.8rem; right: 0.8rem; }
.icon-button { display: grid; width: 2.25rem; aspect-ratio: 1; place-items: center; border: 1px solid var(--admin-line); border-radius: 0.55rem; background: white; color: var(--admin-muted); font-size: 1.35rem; line-height: 1; }
.icon-button:hover { color: var(--admin-ink); border-color: var(--admin-brand); }
.dialog-pair { margin-block-end: 1rem; color: var(--admin-brand); font-size: 1.18rem; font-weight: 800; }
.admin-dialog .admin-form { padding: 1rem; box-shadow: none; }
.form-actions-between { justify-content: space-between; }
.toast { position: fixed; z-index: 80; right: 1rem; bottom: 1rem; width: min(calc(100% - 2rem), 27rem); padding: 0.8rem 0.95rem; border: 1px solid rgb(255 255 255 / 20%); border-radius: 0.65rem; background: #172d4f; box-shadow: var(--admin-shadow); color: white; font-size: 0.86rem; font-weight: 700; }
.toast.is-error { background: var(--admin-danger); }

@media (max-width: 64rem) {
  .admin-layout { grid-template-columns: 1fr; }
  .admin-sidebar { position: static; display: flex; overflow-x: auto; width: 100%; height: auto; padding: 0.55rem 1rem; align-items: center; border-right: 0; }
  .admin-sidebar .eyebrow, .sidebar-note { display: none; }
  .admin-sidebar nav { display: flex; min-width: max-content; margin: 0; }
  .admin-sidebar nav a { padding: 0.52rem 0.7rem; }
  .admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-ticket-row { grid-template-columns: 4rem 6rem minmax(8rem, 1fr) auto; }
  .admin-ticket-phone { display: none; }
}

@media (max-width: 42rem) {
  .admin-header .brand > span:last-child, .admin-header-actions a { display: none; }
  .admin-header-actions { margin-left: auto; }
  .form-grid-two, .form-grid-three, .admin-ticket-toolbar { grid-template-columns: 1fr; }
  .admin-section-heading { align-items: start; flex-direction: column; }
  .admin-stats article { min-height: 6.25rem; }
  .admin-ticket-row { grid-template-columns: 3.5rem 5.3rem minmax(0, 1fr) auto; gap: 0.45rem; }
  .admin-ticket-row .button { width: 2.5rem; overflow: hidden; padding-inline: 0; font-size: 0; }
  .admin-ticket-row .button::after { content: "↗"; font-size: 1rem; }
  .form-actions-between { align-items: stretch; flex-direction: column-reverse; }
  .form-actions-between .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}
