/* Source-owned administrative surface. It uses the same ALMA tokens as the portal and task workbench. */
#root:has(main) {
  min-height: 100%;
}

body[data-alma-admin-view] {
  background: var(--alma-surface-canvas) !important;
  color: var(--alma-text-primary);
}

body[data-alma-admin-view] main {
  background: transparent !important;
}

body[data-alma-admin-view] main > .max-w-7xl {
  max-width: 1440px !important;
}

body[data-alma-admin-view] main h1 {
  color: var(--alma-text-primary) !important;
  letter-spacing: 0 !important;
  font-weight: 800 !important;
}

body[data-alma-admin-view] main h1 + p {
  color: var(--alma-text-secondary) !important;
}

body[data-alma-admin-view] .alma-card {
  border: 1px solid var(--alma-border-default) !important;
  background: var(--alma-surface-card) !important;
  box-shadow: var(--alma-shadow-card) !important;
}

body[data-alma-admin-view] main button,
body[data-alma-admin-view] main a {
  transition: background-color var(--alma-motion-fast, 120ms) ease,
    border-color var(--alma-motion-fast, 120ms) ease,
    box-shadow var(--alma-motion-fast, 120ms) ease,
    color var(--alma-motion-fast, 120ms) ease;
}

body[data-alma-admin-view] main button:focus-visible,
body[data-alma-admin-view] main a:focus-visible,
body[data-alma-admin-view] main input:focus-visible,
body[data-alma-admin-view] main select:focus-visible,
body[data-alma-admin-view] main textarea:focus-visible {
  outline: none !important;
  box-shadow: var(--alma-focus-ring) !important;
}

body[data-alma-admin-view] .alma-admin-nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--alma-space-2, 8px);
  margin: 0 0 var(--alma-space-5, 20px);
  padding: var(--alma-space-2, 8px);
  border: 1px solid var(--alma-border-default);
  border-radius: var(--alma-radius-xl, 16px);
  background: var(--alma-surface-card);
  box-shadow: var(--alma-shadow-card);
}

body[data-alma-admin-view] .alma-admin-nav__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--alma-space-2, 8px);
  min-height: 42px;
  padding: 0 var(--alma-space-3, 12px);
  border: 1px solid transparent;
  border-radius: var(--alma-radius-md, 8px);
  color: var(--alma-text-secondary);
  font: 700 13px/1.1 var(--alma-font, Inter, system-ui, sans-serif);
  text-decoration: none;
}

body[data-alma-admin-view] .alma-admin-nav__link:hover,
body[data-alma-admin-view] .alma-admin-nav__link:focus-visible,
body[data-alma-admin-view] .alma-admin-nav__link[aria-current="page"] {
  border-color: var(--alma-selection-border);
  background: linear-gradient(135deg, var(--alma-selection-surface), var(--alma-surface-card));
  color: var(--alma-selection-text);
  box-shadow: 0 0 0 1px var(--alma-selection-border),
    0 0 12px var(--alma-selection-glow);
}

body[data-alma-admin-view] .alma-admin-nav__icon {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border-radius: 50%;
  background: var(--alma-surface-strong);
  color: var(--alma-text-secondary);
  font-size: 12px;
}

body[data-alma-admin-view] .alma-admin-nav__link[aria-current="page"] .alma-admin-nav__icon {
  background: var(--alma-selection-surface);
  color: var(--alma-selection-text);
}

body[data-alma-admin-view] .alma-admin-ops {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--alma-space-3, 12px);
  margin: 0 0 var(--alma-space-5, 20px);
}

body[data-alma-admin-view] .alma-admin-metric {
  min-height: 90px;
  padding: var(--alma-space-4, 16px);
  border: 1px solid var(--alma-border-default);
  border-radius: var(--alma-radius-xl, 16px);
  background: var(--alma-surface-card);
  box-shadow: var(--alma-shadow-card);
}

body[data-alma-admin-view] .alma-admin-metric__label {
  display: block;
  color: var(--alma-text-secondary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body[data-alma-admin-view] .alma-admin-metric__value {
  display: block;
  margin-top: 8px;
  color: var(--alma-text-primary);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

body[data-alma-admin-view] .alma-admin-metric[data-state="warning"] .alma-admin-metric__value {
  color: var(--alma-status-warning);
}

body[data-alma-admin-view] .alma-admin-metric[data-state="success"] .alma-admin-metric__value {
  color: var(--alma-status-success);
}

body[data-alma-admin-view] .alma-admin-metric[data-state="info"] .alma-admin-metric__value {
  color: var(--alma-status-info);
}

body[data-alma-admin-view] table thead {
  background: var(--alma-surface-strong) !important;
  color: var(--alma-text-secondary) !important;
}

body[data-alma-admin-view] table th {
  color: var(--alma-text-secondary) !important;
  font-size: 11px !important;
  letter-spacing: .04em !important;
  text-transform: uppercase;
}

body[data-alma-admin-view] table tbody tr:hover {
  background: var(--alma-selection-surface) !important;
}

body[data-alma-admin-view] .alma-admin-task-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--alma-action-primary);
  border-radius: var(--alma-radius-md, 8px);
  background: var(--alma-action-primary);
  color: var(--alma-action-primaryText);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

body[data-alma-admin-view] .alma-admin-task-link:hover,
body[data-alma-admin-view] .alma-admin-task-link:focus-visible {
  background: var(--alma-action-primary-hover);
  border-color: var(--alma-action-primary-hover);
}

body[data-alma-admin-view] .alma-admin-password-field {
  padding: var(--alma-space-3, 12px);
  border: 1px solid var(--alma-border-default);
  border-radius: var(--alma-radius-md, 8px);
  background: var(--alma-surface-strong);
}

body[data-alma-admin-view] .alma-admin-password-field label {
  display: block;
  margin-bottom: 4px;
  color: var(--alma-text-primary);
  font-size: 12px;
  font-weight: 800;
}

body[data-alma-admin-view] .alma-admin-password-field input {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--alma-border-default);
  border-radius: var(--alma-radius-md, 8px);
  background: var(--alma-surface-elevated);
  color: var(--alma-text-primary);
}

body[data-alma-admin-view] .alma-admin-password-field input:focus-visible {
  outline: none;
  border-color: var(--alma-selection-border);
  box-shadow: var(--alma-focus-ring);
}

body[data-alma-admin-view] .alma-admin-password-field small {
  display: block;
  margin-top: 5px;
  color: var(--alma-text-secondary);
  font-size: 11px;
  line-height: 1.35;
}

body[data-alma-admin-view] .alma-admin-password-feedback {
  margin-top: 6px;
  color: var(--alma-status-error);
  font-size: 12px;
  font-weight: 700;
}

body[data-alma-admin-view] .alma-admin-password-feedback[data-state="success"] {
  color: var(--alma-status-success);
}

body[data-alma-admin-view] #alma-tasks-shortcut {
  display: none !important;
}

@media (max-width: 900px) {
  body[data-alma-admin-view] .alma-admin-nav,
  body[data-alma-admin-view] .alma-admin-ops {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  body[data-alma-admin-view] main {
    padding: var(--alma-space-4, 16px) !important;
  }

  body[data-alma-admin-view] .alma-admin-nav,
  body[data-alma-admin-view] .alma-admin-ops {
    grid-template-columns: 1fr;
  }

  body[data-alma-admin-view] .alma-admin-nav__link {
    min-height: 44px;
  }

  body[data-alma-admin-view] .alma-admin-metric {
    min-height: 76px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-alma-admin-view] main button,
  body[data-alma-admin-view] main a {
    transition: none;
  }
}

:root[data-theme="dark"] body[data-alma-admin-view] .alma-admin-nav__link:hover,
:root[data-theme="dark"] body[data-alma-admin-view] .alma-admin-nav__link:focus-visible,
:root[data-theme="dark"] body[data-alma-admin-view] .alma-admin-nav__link[aria-current="page"],
body.theme-dark[data-alma-admin-view] .alma-admin-nav__link:hover,
body.theme-dark[data-alma-admin-view] .alma-admin-nav__link:focus-visible,
body.theme-dark[data-alma-admin-view] .alma-admin-nav__link[aria-current="page"] {
  background: linear-gradient(135deg, var(--alma-selection-surface), var(--alma-surface-card));
}
