/* =========================================================
   DESIRE DISTRICT
   MASTER ADMIN V2
   ========================================================= */

:root {
  --admin-sidebar: #1d1722;
  --admin-sidebar-soft: #2c2230;

  --admin-accent: #b73566;
  --admin-accent-dark: #982950;
  --admin-accent-soft: #fff1f6;

  --admin-bg: #f7f3f6;
  --admin-surface: #ffffff;
  --admin-surface-soft: #fbf8fa;

  --admin-border: #e5dce2;
  --admin-border-strong: #d6cad2;

  --admin-text: #261f28;
  --admin-text-soft: #756a77;
  --admin-text-faint: #958a96;

  --admin-success: #277a56;
  --admin-success-bg: #ecfaf3;

  --admin-warning: #885f14;
  --admin-warning-bg: #fff4df;

  --admin-error: #8d2848;
  --admin-error-bg: #fff6f9;

  --admin-radius: 16px;
  --admin-sidebar-width: 260px;
  --admin-topbar-height: 72px;

  --admin-shadow:
    0 12px 35px rgba(47, 28, 43, 0.06);
}


/* =========================================================
   RESET
   ========================================================= */

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
}

body {
  min-height: 100vh;
  margin: 0;

  background: var(--admin-bg);
  color: var(--admin-text);

  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  font-size: 15px;
  line-height: 1.5;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
}

button {
  cursor: pointer;
}

button:disabled {
  cursor: wait;
  opacity: 0.6;
}

[hidden] {
  display: none !important;
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 999;

  padding: 10px 14px;

  border-radius: 10px;

  background: #ffffff;
  color: #111111;

  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.admin-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;

  width: var(--admin-sidebar-width);
  height: 100vh;

  display: flex;
  flex-direction: column;

  overflow-y: auto;

  background: var(--admin-sidebar);
  color: #f8eef5;

  border-right:
    1px solid
    rgba(255, 255, 255, 0.06);
}

.admin-brand {
  padding: 22px 20px 18px;
}

.admin-brand-link {
  display: flex;
  align-items: center;
  gap: 12px;

  text-decoration: none;
}

.admin-monogram {
  flex: 0 0 42px;

  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  border-radius: 12px;

  background: var(--admin-accent);
  color: #ffffff;

  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.admin-brand-copy {
  min-width: 0;

  display: flex;
  flex-direction: column;
}

.admin-brand-copy strong {
  color: #ffffff;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 18px;
  line-height: 1.15;
}

.admin-brand-copy small {
  margin-top: 4px;

  color: #d9b7c9;

  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.22em;
}

.admin-mobile-toggle {
  display: none;

  margin: 0 14px 14px;
  padding: 11px 12px;

  align-items: center;
  justify-content: space-between;

  border:
    1px solid
    rgba(255, 255, 255, 0.12);

  border-radius: 10px;

  background: transparent;
  color: #ffffff;
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.admin-navigation {
  padding: 4px 10px 28px;
}

.admin-nav-group + .admin-nav-group {
  margin-top: 5px;
}

.admin-nav-heading {
  width: 100%;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 10px;

  border: 0;

  background: transparent;
  color: #dcb8cb;

  text-align: left;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.admin-nav-heading:hover {
  color: #ffffff;
}

.admin-nav-items {
  display: grid;
  gap: 3px;
}

.admin-nav-items[hidden] {
  display: none;
}

.admin-nav-link {
  display: block;

  padding: 10px 12px;

  border-radius: 9px;

  color: #f7edf4;

  text-decoration: none;

  font-size: 13px;

  transition:
    background-color 120ms ease,
    color 120ms ease;
}

.admin-nav-link:hover {
  background:
    rgba(255, 255, 255, 0.07);
}

.admin-nav-link.is-active {
  background: #3a2a3a;
  color: #ffffff;
}

.admin-sidebar-footer {
  margin-top: auto;
  padding: 20px;

  border-top:
    1px solid
    rgba(255, 255, 255, 0.07);
}

.admin-sidebar-footer span {
  display: block;

  color: #b99aad;

  font-size: 10px;
}

.admin-sidebar-footer strong {
  display: block;

  margin-top: 8px;

  color: #97798d;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 17px;
  font-weight: 400;
  line-height: 1.1;
}

.admin-sidebar-footer a {
  display: inline-block;

  margin-top: 24px;

  color: #f3d6e5;

  font-size: 11px;

  text-decoration: none;
}


/* =========================================================
   WORKSPACE
   ========================================================= */

.admin-workspace {
  min-height: 100vh;

  margin-left:
    var(--admin-sidebar-width);

  display: flex;
  flex-direction: column;
}


/* =========================================================
   TOPBAR
   ========================================================= */

.admin-topbar {
  min-height:
    var(--admin-topbar-height);

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 24px;

  padding: 0 34px;

  background: #ffffff;

  border-bottom:
    1px solid
    var(--admin-border);
}

.admin-breadcrumb {
  display: flex;
  align-items: center;
  gap: 11px;

  color:
    var(--admin-text-soft);

  font-size: 12px;
}

.admin-breadcrumb strong {
  color:
    var(--admin-text);
}

.admin-breadcrumb-separator {
  color: #c6bac3;
}

.admin-account {
  display: flex;
  align-items: center;
  gap: 18px;
}

.admin-environment {
  padding: 5px 9px;

  border-radius: 999px;

  background:
    var(--admin-accent-soft);

  color:
    var(--admin-accent-dark);

  font-size: 10px;
  font-weight: 700;
}

.admin-account-link {
  display: flex;
  align-items: center;
  gap: 10px;

  color:
    var(--admin-text-soft);

  font-size: 12px;
  text-decoration: none;
}

.admin-avatar {
  width: 34px;
  height: 34px;

  display: grid;
  place-items: center;

  border-radius: 50%;

  background: #f5e8ee;
  color:
    var(--admin-accent);

  font-size: 10px;
  font-weight: 800;
}


/* =========================================================
   MAIN
   ========================================================= */

.admin-main {
  width: 100%;
  max-width: 1320px;

  margin: 0 auto;

  flex: 1;

  padding: 48px 42px 72px;
}

.admin-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 24px;

  margin-bottom: 28px;
}

.admin-eyebrow {
  margin: 0 0 10px;

  color:
    var(--admin-accent);

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.17em;

  text-transform: uppercase;
}

.admin-page-header h1 {
  margin: 0;

  color:
    var(--admin-text);

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    clamp(34px, 4vw, 50px);

  line-height: 1.05;

  letter-spacing: -0.025em;
}

.admin-page-description {
  max-width: 720px;

  margin: 12px 0 0;

  color:
    var(--admin-text-soft);

  font-size: 15px;
}


/* =========================================================
   DASHBOARD
   ========================================================= */

.admin-dashboard-grid {
  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 16px;
}

.admin-card {
  min-width: 0;

  padding: 22px;

  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-surface);

  box-shadow:
    var(--admin-shadow);
}

.admin-card--wide {
  grid-column: 1 / -1;

  padding: 26px;
}

.admin-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 18px;
}

.admin-card h2 {
  margin: 4px 0 0;

  font-size: 20px;
}

.admin-card p {
  margin: 10px 0 0;

  color:
    var(--admin-text-soft);
}

.admin-card-label {
  color:
    var(--admin-text-faint);

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-stat {
  display: block;

  margin-top: 16px;

  color:
    var(--admin-text);

  font-size: 36px;
  line-height: 1;
}

.admin-status-badge {
  display: inline-flex;

  padding: 6px 10px;

  border-radius: 999px;

  background:
    var(--admin-success-bg);

  color:
    var(--admin-success);

  font-size: 10px;
  font-weight: 700;
}


/* =========================================================
   MODULE
   ========================================================= */

.admin-module-placeholder {
  min-height: 300px;

  padding: 0;

  background: transparent;
}


/* =========================================================
   COMMON CONTROLS
   ========================================================= */

.admin-button {
  min-height: 40px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0 16px;

  border:
    1px solid
    var(--admin-border-strong);

  border-radius: 10px;

  background: #ffffff;
  color:
    var(--admin-text);

  font-weight: 700;
  text-decoration: none;

  transition:
    background-color 120ms ease,
    border-color 120ms ease;
}

.admin-button:hover:not(:disabled) {
  border-color:
    var(--admin-accent);

  background:
    var(--admin-accent-soft);
}

.admin-button--primary {
  border-color:
    var(--admin-accent);

  background:
    var(--admin-accent);

  color: #ffffff;
}

.admin-button--primary:hover:not(:disabled) {
  background:
    var(--admin-accent-dark);

  color: #ffffff;
}

.admin-field {
  min-width: 0;

  display: grid;

  gap: 7px;

  color:
    var(--admin-text-soft);

  font-size: 12px;
  font-weight: 700;
}

.admin-input,
.admin-select,
.admin-textarea {
  width: 100%;

  padding: 11px 12px;

  border:
    1px solid
    var(--admin-border-strong);

  border-radius: 10px;

  background: #ffffff;
  color:
    var(--admin-text);
}

.admin-textarea {
  resize: vertical;
}

.admin-input:focus,
.admin-select:focus,
.admin-textarea:focus {
  outline: none;

  border-color:
    var(--admin-accent);

  box-shadow:
    0 0 0 3px
    rgba(183, 53, 102, 0.12);
}

.admin-muted {
  color:
    var(--admin-text-faint);

  font-size: 12px;
}


/* =========================================================
   REQUESTS
   ========================================================= */

.admin-request-summary {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 16px;

  margin-bottom: 20px;
}

.admin-request-stat {
  min-width: 0;

  padding: 22px;

  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-surface);

  box-shadow:
    var(--admin-shadow);
}

.admin-request-stat strong {
  display: block;

  color:
    var(--admin-text);

  font-size: 32px;
  line-height: 1;
}

.admin-request-stat span {
  display: block;

  margin-top: 8px;

  color:
    var(--admin-text-soft);
}

.admin-request-section {
  margin-top: 18px;

  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  overflow: hidden;

  background:
    var(--admin-surface);

  box-shadow:
    var(--admin-shadow);
}

.admin-request-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;

  padding: 22px;

  border-bottom:
    1px solid
    var(--admin-border);
}

.admin-request-section-heading h2 {
  margin: 0;

  color:
    var(--admin-text);

  font-size: 20px;
}

.admin-request-section-heading p {
  margin: 5px 0 0;

  color:
    var(--admin-text-soft);
}

.admin-request-list {
  display: grid;
}

.admin-request-row {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 24px;

  padding: 18px 22px;
}

.admin-request-row + .admin-request-row {
  border-top:
    1px solid
    var(--admin-border);
}

.admin-request-info {
  min-width: 0;

  display: flex;
  flex-direction: column;
  align-items: flex-start;

  gap: 6px;
}

.admin-request-info > strong {
  color:
    var(--admin-text);

  font-size: 15px;
}

.admin-request-info small {
  color:
    var(--admin-text-faint);
}

.admin-request-info p {
  margin: 4px 0 0;

  color:
    var(--admin-text-soft);
}

.admin-request-actions {
  flex: 0 0 auto;

  display: flex;
  flex-wrap: wrap;

  gap: 8px;
}

.admin-request-badge {
  display: inline-flex;
  width: fit-content;

  padding: 5px 9px;

  border-radius: 999px;

  background: #f2edf1;
  color: #675b67;

  font-size: 10px;
  font-weight: 700;
}

.admin-request-badge--warning {
  background:
    var(--admin-warning-bg);

  color:
    var(--admin-warning);
}

.admin-request-badge--success {
  background:
    var(--admin-success-bg);

  color:
    var(--admin-success);
}

.admin-request-loading,
.admin-empty {
  margin: 0;

  padding: 22px;

  color:
    var(--admin-text-soft);
}


/* =========================================================
   REQUEST DETAILS
   ========================================================= */

.admin-request-detail {
  margin-top: 20px;
  padding: 24px;

  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-surface);

  box-shadow:
    var(--admin-shadow);
}

.admin-request-detail-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;

  margin-bottom: 20px;
}

.admin-request-detail-heading h2 {
  margin: 0;

  color:
    var(--admin-text);

  font-size: 22px;
}

.admin-detail-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 12px;
}

.admin-detail-property {
  min-width: 0;

  padding: 15px;

  border:
    1px solid
    var(--admin-border);

  border-radius: 12px;

  background:
    var(--admin-surface-soft);
}

.admin-detail-property-label {
  display: block;

  margin-bottom: 5px;

  color:
    var(--admin-text-faint);

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-detail-property strong {
  overflow-wrap: anywhere;
}

.admin-detail-block {
  margin-top: 20px;
  padding-top: 18px;

  border-top:
    1px solid
    var(--admin-border);
}

.admin-detail-block h3 {
  margin: 0 0 10px;

  font-size: 17px;
}

.admin-detail-block p {
  margin: 0;

  color:
    var(--admin-text-soft);

  white-space: pre-wrap;
}

.admin-detail-block ul {
  margin: 0;
  padding-left: 20px;

  color:
    var(--admin-text-soft);
}

.admin-detail-list-row {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;

  padding: 12px 0;
}

.admin-detail-list-row + .admin-detail-list-row {
  border-top:
    1px solid
    var(--admin-border);
}

.admin-detail-list-row > div {
  min-width: 0;

  display: flex;
  flex-direction: column;
}

.admin-detail-list-row strong {
  overflow-wrap: anywhere;
}

.admin-detail-list-row span {
  color:
    var(--admin-text-soft);
}


/* =========================================================
   MEMBERS
   ========================================================= */

.admin-member-panel {
  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-surface);

  box-shadow:
    var(--admin-shadow);

  overflow: hidden;
}

.admin-member-panel-heading {
  padding: 22px 24px 0;
}

.admin-member-panel-heading h2 {
  margin: 0;

  font-size: 21px;
}

.admin-member-panel-heading p {
  margin: 6px 0 0;

  color:
    var(--admin-text-soft);
}

.admin-member-toolbar {
  display: flex;
  align-items: flex-end;

  gap: 12px;

  padding: 22px 24px;
}

.admin-member-toolbar .admin-field {
  width: min(440px, 100%);
}

.admin-member-status {
  min-height: 20px;

  margin: 0;

  padding: 0 24px 12px;

  color:
    var(--admin-text-soft);

  font-size: 12px;
}

.admin-member-content {
  padding: 0 24px 24px;
}

.admin-member-loading {
  margin: 0;

  padding: 20px 0;

  color:
    var(--admin-text-soft);
}

.admin-member-summary {
  display: grid;

  grid-template-columns:
    repeat(4, minmax(0, 1fr));

  gap: 12px;

  margin-bottom: 20px;
}

.admin-member-stat {
  padding: 18px;

  border:
    1px solid
    var(--admin-border);

  border-radius: 13px;

  background:
    var(--admin-surface-soft);
}

.admin-member-stat strong {
  display: block;

  font-size: 26px;
  line-height: 1;
}

.admin-member-stat span {
  display: block;

  margin-top: 7px;

  color:
    var(--admin-text-soft);

  font-size: 12px;
}

.admin-member-group {
  margin-top: 18px;

  border:
    1px solid
    var(--admin-border);

  border-radius: 14px;

  overflow: hidden;
}

.admin-member-group-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding: 18px;

  background:
    var(--admin-surface-soft);

  border-bottom:
    1px solid
    var(--admin-border);
}

.admin-member-group-heading h2 {
  margin: 0;

  font-size: 18px;
}

.admin-member-group-heading p {
  margin: 4px 0 0;

  color:
    var(--admin-text-soft);

  font-size: 12px;
}

.admin-member-badge {
  display: inline-flex;

  width: fit-content;

  padding: 5px 9px;

  border-radius: 999px;

  background: #f1edf0;
  color: #665b65;

  font-size: 10px;
  font-weight: 800;

  white-space: nowrap;
}

.admin-member-badge--success {
  background:
    var(--admin-success-bg);

  color:
    var(--admin-success);
}

.admin-member-badge--danger {
  background:
    var(--admin-error-bg);

  color:
    var(--admin-error);
}

.admin-member-badge--warning {
  background:
    var(--admin-warning-bg);

  color:
    var(--admin-warning);
}

.admin-table-wrap {
  width: 100%;

  overflow-x: auto;
}

.admin-table {
  width: 100%;

  border-collapse: collapse;

  background:
    var(--admin-surface);
}

.admin-table th,
.admin-table td {
  padding: 14px 16px;

  border-bottom:
    1px solid
    var(--admin-border);

  text-align: left;
  vertical-align: middle;
}

.admin-table th {
  background:
    #fcfafb;

  color:
    var(--admin-text-faint);

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.07em;
  text-transform: uppercase;

  white-space: nowrap;
}

.admin-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-table td {
  color:
    var(--admin-text-soft);

  font-size: 13px;
}

.admin-table td strong {
  color:
    var(--admin-text);

  font-size: 13px;
}

.admin-member-actions {
  display: flex;
  flex-wrap: wrap;

  gap: 7px;
}

.admin-member-actions .admin-button {
  min-height: 34px;

  padding: 0 11px;

  font-size: 11px;

  white-space: nowrap;
}

.admin-empty-panel {
  padding: 22px;

  border:
    1px dashed
    var(--admin-border-strong);

  border-radius: 12px;

  color:
    var(--admin-text-soft);

  text-align: center;
}


/* =========================================================
   ACCOUNTS & ADVERTISERS
   ========================================================= */

.admin-account-toolbar {
  display: grid;

  grid-template-columns:
    minmax(260px, 1fr)
    220px
    auto;

  align-items: end;

  gap: 12px;

  padding: 22px 24px;
}

.admin-account-results {
  display: grid;

  gap: 12px;

  padding:
    0 24px 24px;
}

.admin-account-card {
  overflow: hidden;

  border:
    1px solid
    var(--admin-border);

  border-radius: 14px;

  background:
    var(--admin-surface);
}

.admin-account-card summary {
  list-style: none;
}

.admin-account-card summary::-webkit-details-marker {
  display: none;
}

.admin-account-summary {
  position: relative;

  min-height: 74px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding:
    16px 50px 16px 18px;

  cursor: pointer;

  background:
    var(--admin-surface);
}

.admin-account-summary::after {
  content: "+";

  position: absolute;
  top: 50%;
  right: 18px;

  width: 24px;
  height: 24px;

  display: grid;
  place-items: center;

  border-radius: 50%;

  background:
    var(--admin-surface-soft);

  color:
    var(--admin-text-soft);

  font-size: 17px;
  line-height: 1;

  transform:
    translateY(-50%);
}

.admin-account-card[open]
.admin-account-summary::after {
  content: "−";
}

.admin-account-summary:hover {
  background:
    #fdfafb;
}

.admin-account-heading {
  min-width: 0;

  display: flex;
  flex-direction: column;

  gap: 4px;
}

.admin-account-heading strong {
  color:
    var(--admin-text);

  font-size: 14px;

  overflow-wrap: anywhere;
}

.admin-account-heading span {
  color:
    var(--admin-text-faint);

  font-size: 11px;
}

.admin-account-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;

  gap: 6px;
}

.admin-account-body {
  padding: 20px;

  border-top:
    1px solid
    var(--admin-border);

  background:
    var(--admin-surface-soft);
}

.admin-account-meta {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 12px;

  margin: 0;
}

.admin-account-meta dt,
.admin-account-meta dd {
  margin: 0;
}

.admin-account-meta dt {
  color:
    var(--admin-text-faint);

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.admin-account-meta dd {
  margin-top: 5px;

  color:
    var(--admin-text);

  font-size: 13px;

  overflow-wrap: anywhere;
}

.admin-account-profiles {
  margin-top: 20px;

  padding-top: 18px;

  border-top:
    1px solid
    var(--admin-border);
}

.admin-account-profiles h3 {
  margin:
    0 0 12px;

  font-size: 15px;
}

.admin-account-profile-row {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;

  padding: 12px 0;
}

.admin-account-profile-row
+ .admin-account-profile-row {
  border-top:
    1px solid
    var(--admin-border);
}

.admin-account-profile-info {
  min-width: 0;
}

.admin-account-profile-info strong {
  display: block;

  color:
    var(--admin-text);

  font-size: 13px;

  overflow-wrap: anywhere;
}

.admin-account-profile-info p {
  margin: 4px 0 0;

  color:
    var(--admin-text-soft);

  font-size: 12px;
}

.admin-account-load-more {
  display: flex;
  justify-content: center;

  padding:
    0 24px 24px;
}


/* =========================================================
   DIALOG
   ========================================================= */

.admin-dialog {
  width:
    min(540px, calc(100vw - 32px));

  padding: 0;

  border:
    1px solid
    var(--admin-border);

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-surface);

  color:
    var(--admin-text);

  box-shadow:
    0 30px 90px
    rgba(31, 20, 30, 0.25);
}

.admin-dialog::backdrop {
  background:
    rgba(25, 17, 25, 0.52);

  backdrop-filter:
    blur(2px);
}

.admin-dialog-form {
  padding: 24px;
}

.admin-dialog-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;

  margin-bottom: 12px;
}

.admin-dialog-heading h2 {
  margin: 0;

  font-size: 21px;
}

.admin-dialog-copy {
  margin: 0 0 20px;

  color:
    var(--admin-text-soft);
}

.admin-dialog-feedback {
  min-height: 20px;

  margin: 8px 0 0;

  color:
    var(--admin-error);

  font-size: 12px;
}

.admin-dialog-actions {
  display: flex;
  justify-content: flex-end;

  gap: 10px;

  margin-top: 20px;
}


/* =========================================================
   ERRORS
   ========================================================= */

.admin-warning {
  color:
    var(--admin-warning) !important;
}

.admin-error {
  color:
    var(--admin-error);
}

.admin-error-panel {
  padding: 22px;

  border:
    1px solid
    #edc6d3;

  border-radius:
    var(--admin-radius);

  background:
    var(--admin-error-bg);

  color:
    var(--admin-error);
}

.admin-error-panel strong {
  display: block;

  margin-bottom: 6px;
}

.admin-error-panel p {
  margin: 0;
}


/* =========================================================
   FOOTER
   ========================================================= */

.admin-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding: 18px 34px;

  border-top:
    1px solid
    var(--admin-border);

  color:
    var(--admin-text-faint);

  font-size: 11px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
  .admin-dashboard-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .admin-member-summary {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .admin-account-toolbar {
    grid-template-columns:
      minmax(0, 1fr)
      200px;
  }

  .admin-account-toolbar
  .admin-button {
    grid-column:
      1 / -1;
  }
}


@media (max-width: 820px) {
  :root {
    --admin-sidebar-width: 280px;
  }

  .admin-sidebar {
    transform:
      translateX(-100%);

    transition:
      transform 160ms ease;
  }

  .admin-sidebar.is-open {
    transform:
      translateX(0);
  }

  .admin-mobile-toggle {
    display: flex;
  }

  .admin-workspace {
    margin-left: 0;
  }

  .admin-topbar {
    padding: 0 18px;
  }

  .admin-main {
    padding:
      32px 18px 52px;
  }
}


@media (max-width: 700px) {
  .admin-request-summary,
  .admin-detail-grid {
    grid-template-columns:
      1fr;
  }

  .admin-request-row {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .admin-request-actions {
    width: 100%;
  }

  .admin-request-actions
  .admin-button {
    width: 100%;
  }

  .admin-detail-list-row {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .admin-member-toolbar {
    align-items:
      stretch;

    flex-direction:
      column;
  }

  .admin-member-toolbar
  .admin-field {
    width: 100%;
  }

  .admin-member-toolbar
  .admin-button {
    width: 100%;
  }

  .admin-account-toolbar {
    grid-template-columns:
      1fr;
  }

  .admin-account-toolbar
  .admin-button {
    grid-column: auto;
  }

  .admin-account-meta {
    grid-template-columns:
      1fr;
  }

  .admin-account-profile-row {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .admin-account-profile-row
  .admin-member-actions {
    width: 100%;
  }
}


@media (max-width: 600px) {
  .admin-dashboard-grid,
  .admin-member-summary {
    grid-template-columns:
      1fr;
  }

  .admin-card--wide {
    grid-column: auto;
  }

  .admin-account
  .admin-environment {
    display: none;
  }

  .admin-account-link {
    font-size: 0;
  }

  .admin-footer {
    flex-direction:
      column;

    align-items:
      flex-start;
  }

  .admin-dialog-actions {
    flex-direction:
      column-reverse;
  }

  .admin-dialog-actions
  .admin-button {
    width: 100%;
  }

  .admin-account-summary {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .admin-account-chips {
    justify-content:
      flex-start;
  }
}
/* Member dossier and moderation forms. */
.admin-member-dossier { width:min(760px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); overflow:auto; }
.admin-member-dossier form { display:grid; gap:16px; }
.admin-member-dossier-summary { padding:12px 16px; margin-bottom:20px; background:var(--admin-bg,#f8f5f8); border-radius:12px; overflow-wrap:anywhere; }
.admin-member-history { padding-left:20px; }
.admin-member-history li { padding:12px 0; border-bottom:1px solid var(--admin-border); overflow-wrap:anywhere; }