/* Daylight brand layer for the management workspace; loaded after readability.css. */
body.admin-mode {
  background: #f8f8fc;
}

body.admin-mode .adm-root {
  --adm-purple: #401dfc;
  --adm-purple-2: #7058ff;
  --adm-ink: #20213a;
  --adm-muted: #65718b;
  --adm-line: #e7e8f0;
  --adm-bg: #f8f8fc;
  --adm-card: #ffffff;
  --adm-green: #0b9f77;
  --adm-red: #d84270;
  --adm-amber: #b66a16;
  background:
    radial-gradient(circle at 92% -12%, rgb(64 29 252 / 7%), transparent 26rem),
    radial-gradient(circle at 74% 0%, rgb(249 3 125 / 4%), transparent 20rem),
    #f8f8fc;
  color: var(--adm-ink);
}

/* Brand marks use the supplied white-backed MoMo image in every admin context. */
body.admin-mode .adm-brand > img,
body.admin-mode .adm-login__mobile-brand > img {
  width: 36px;
  height: 36px;
  display: block;
  flex: 0 0 auto;
  object-fit: cover;
  background: #fff;
  border: 1px solid #ebe8ff;
  border-radius: 10px;
  box-shadow: 0 8px 20px rgb(64 29 252 / 12%);
}

body.admin-mode .adm-login__mobile-brand > img {
  width: 30px;
  height: 30px;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 8px -2px 0;
  border-radius: 8px;
  box-shadow: 0 5px 14px rgb(64 29 252 / 10%);
}

body.admin-mode .adm-sidebar,
body.admin-mode .adm-topbar,
body.admin-mode .adm-panel,
body.admin-mode .adm-service-card,
body.admin-mode .adm-setting,
body.admin-mode .adm-modal,
body.admin-mode .adm-range,
body.admin-mode .adm-search,
body.admin-mode .adm-btn--soft {
  border-color: #e5e6ef;
}

body.admin-mode .adm-sidebar,
body.admin-mode .adm-topbar,
body.admin-mode .adm-panel,
body.admin-mode .adm-service-card,
body.admin-mode .adm-setting,
body.admin-mode .adm-modal {
  background: rgb(255 255 255 / 94%);
}

body.admin-mode .adm-sidebar {
  box-shadow: 8px 0 30px rgb(32 33 58 / 3%);
}

body.admin-mode .adm-sidebar nav a:hover,
body.admin-mode .adm-sidebar nav a.is-active {
  color: #401dfc;
  background: linear-gradient(90deg, #f1eeff, #fff1f8);
}

body.admin-mode .adm-sidebar nav a.is-active .adm-icon,
body.admin-mode .adm-sidebar nav a:hover .adm-icon,
body.admin-mode .adm-sidebar__foot > a:hover,
body.admin-mode .adm-text-link,
body.admin-mode .adm-range button:hover,
body.admin-mode .adm-table-btn:hover {
  color: #401dfc;
}

body.admin-mode .adm-kicker {
  color: #8c2be7;
}

body.admin-mode .adm-btn--primary,
body.admin-mode .adm-steps .is-current b {
  background: linear-gradient(115deg, #401dfc, #8a31f5 58%, #f9037d);
  box-shadow: 0 8px 18px rgb(64 29 252 / 20%);
}

body.admin-mode .adm-btn--primary:hover {
  background: linear-gradient(115deg, #3214dc, #7623ea 58%, #dd006d);
}

body.admin-mode .adm-readonly,
body.admin-mode .adm-badge--admin,
body.admin-mode .adm-tag {
  color: #5a2ac8;
  background: #f2efff;
  border-color: #e1dbff;
}

body.admin-mode .adm-preview-banner {
  color: #554b77;
  background: linear-gradient(100deg, #f4f1ff, #fff4fa);
  border-color: #e3dbff;
}

body.admin-mode .adm-preview-banner span {
  color: #401dfc;
  background: #eae5ff;
}

body.admin-mode .adm-kpi,
body.admin-mode .adm-panel,
body.admin-mode .adm-service-card {
  box-shadow: 0 10px 28px rgb(32 33 58 / 4%);
}

body.admin-mode .adm-kpi > span,
body.admin-mode .adm-order-icon {
  color: #401dfc;
  background: linear-gradient(135deg, #eeeaff, #fff0f8);
}

body.admin-mode .adm-kpi--3 > span {
  color: #e40d78;
  background: #fff0f7;
}

body.admin-mode .adm-line-chart .area {
  fill: rgb(64 29 252 / 8%);
}

body.admin-mode .adm-line-chart .visits,
body.admin-mode .adm-chart-legend i {
  stroke: #401dfc;
  background: #401dfc;
}

body.admin-mode .adm-line-chart .clicks,
body.admin-mode .adm-chart-legend i.c {
  stroke: #f9037d;
  background: #f9037d;
}

body.admin-mode .adm-search:focus-within,
body.admin-mode .adm-modal input:focus,
body.admin-mode .adm-modal textarea:focus,
body.admin-mode .adm-modal select:focus,
body.admin-mode .adm-campaign input:focus,
body.admin-mode .adm-campaign textarea:focus,
body.admin-mode .adm-campaign select:focus,
body.admin-mode .adm-login__form input:focus {
  border-color: #8c76ff;
  box-shadow: 0 0 0 3px rgb(64 29 252 / 11%);
}

body.admin-mode .adm-check,
body.admin-mode .adm-consent-check input {
  accent-color: #401dfc;
}

/* The login visual stays bright, with the existing copy and controls unchanged. */
body.admin-mode .adm-login-root {
  background: #fbfbfe;
}

body.admin-mode .adm-login__brand {
  color: #20213a;
  background:
    radial-gradient(circle at 75% 22%, rgb(249 3 125 / 10%), transparent 19rem),
    radial-gradient(circle at 20% 78%, rgb(64 29 252 / 12%), transparent 24rem),
    linear-gradient(135deg, #ffffff 0%, #f7f4ff 54%, #fdf4fa 100%);
}

body.admin-mode .adm-brand--login small {
  color: #70778d;
}

body.admin-mode .adm-login__copy .adm-kicker {
  color: #7a2fe3;
}

body.admin-mode .adm-login__copy h1 {
  color: #25213e;
}

body.admin-mode .adm-login__copy p {
  color: #626d83;
}

body.admin-mode .adm-orbit {
  border-color: rgb(64 29 252 / 15%);
}

body.admin-mode .adm-orbit--two {
  border-color: rgb(249 3 125 / 16%);
}

body.admin-mode .adm-login__mobile-brand {
  color: #401dfc;
}

@media (max-width: 760px) {
  body.admin-mode .adm-sidebar {
    box-shadow: 14px 0 36px rgb(32 33 58 / 12%);
  }

  body.admin-mode .adm-login__brand {
    min-height: 185px;
  }
}

/* Prevent intrinsic grid sizing from forcing a 375px form on narrow phones. */
body.admin-mode .adm-login__form-wrap {
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
}
body.admin-mode .adm-login__form {
  width: 100%;
  max-width: 375px;
  min-width: 0;
}
body.admin-mode .adm-login__form input {
  width: 100%;
  min-width: 0;
}