/* =========================================================
   ADMIN NEEDS ACTION, SETTINGS, ACTIVITY LOG
   ========================================================= */

.admin-needs-action-page,
.admin-settings-page,
.admin-activity-page {
  display: grid;
  gap: 1rem;
}

.admin-needs-action-count,
.admin-activity-count {
  flex-shrink: 0;
  padding: .7rem .85rem;
  border: 1px solid var(--admin-border);
  border-radius: .8rem;
  background: rgba(250,247,240,.75);
  text-align: right;
}

.admin-needs-action-count span,
.admin-activity-count span {
  display: block;
  color: var(--admin-text-muted);
  font-size: .5rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.admin-needs-action-count strong,
.admin-activity-count strong {
  display: block;
  margin-top: .15rem;
  color: var(--admin-text);
  font-size: .9rem;
}

.admin-needs-action-table-panel,
.admin-activity-table-panel {
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: 1rem;
  background: linear-gradient(145deg,rgba(250,247,240,.98),rgba(246,241,232,.96));
  box-shadow: 0 12px 28px rgba(65,74,65,.055);
}

.admin-needs-action-table-scroll,
.admin-activity-table-scroll {
  overflow-x: auto;
}

.admin-needs-action-table,
.admin-activity-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-needs-action-table {
  min-width: 72rem;
  table-layout: fixed;
}

.admin-activity-table {
  min-width: 46rem;
}

.admin-needs-action-table th,
.admin-activity-table th {
  padding: .82rem .9rem;
  border-bottom: 1px solid var(--admin-border);
  color: var(--admin-text-muted);
  background: rgba(119,137,119,.055);
  font-size: .54rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: left;
  text-transform: uppercase;
}

.admin-needs-action-table td,
.admin-activity-table td {
  padding: .8rem .9rem;
  border-bottom: 1px solid var(--admin-border);
  color: var(--admin-text-soft);
  font-size: .62rem;
  vertical-align: middle;
}

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

.admin-needs-action-table tbody tr:hover,
.admin-activity-table tbody tr:hover {
  background: rgba(119,137,119,.045);
}

.admin-needs-action-order strong,
.admin-activity-time strong {
  display: block;
  color: var(--admin-text);
  font-size: .63rem;
  font-weight: 800;
}

.admin-needs-action-order span,
.admin-activity-time span {
  display: block;
  margin-top: .13rem;
  color: var(--admin-text-muted);
  font-size: .51rem;
}

.admin-needs-action-product,
.admin-needs-action-whatsapp {
  color: var(--admin-text);
  font-weight: 700;
}

.admin-status-pill.is-danger {
  color: #9b594f;
  background: rgba(173,103,93,.12);
  border-color: rgba(173,103,93,.2);
}

.admin-status-pill.is-warning {
  color: #8b6736;
  background: rgba(185,154,100,.14);
  border-color: rgba(185,154,100,.22);
}

.admin-needs-action-error {
  max-width: 18rem;
  overflow: hidden;
  color: var(--admin-text-muted);
  font-size: .55rem;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-needs-action-process {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .45rem .62rem;
  border-radius: .62rem;
  color: #fffaf0;
  background: var(--admin-primary-deep);
  font-size: .56rem;
  font-weight: 800;
}

.admin-needs-action-process svg {
  width: .72rem;
  height: .72rem;
}

.admin-needs-action-empty,
.admin-activity-empty {
  min-height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  padding: 1.5rem;
}

.admin-needs-action-empty-icon,
.admin-activity-empty-icon {
  width: 2.7rem;
  height: 2.7rem;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  border-radius: .8rem;
  color: var(--admin-primary-deep);
  background: rgba(119,137,119,.1);
}

.admin-needs-action-empty-icon svg,
.admin-activity-empty-icon svg {
  width: 1.2rem;
  height: 1.2rem;
}

.admin-needs-action-empty p,
.admin-activity-empty p {
  color: var(--admin-text);
  font-size: .72rem;
  font-weight: 750;
}

.admin-needs-action-empty div > span,
.admin-activity-empty div > span {
  display: block;
  margin-top: .14rem;
  color: var(--admin-text-muted);
  font-size: .58rem;
}

.admin-needs-action-mobile-list,
.admin-activity-mobile-list {
  display: none;
  gap: .7rem;
}

.admin-needs-action-mobile-card,
.admin-activity-mobile-card {
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: .95rem;
  background: linear-gradient(145deg,rgba(250,247,240,.98),rgba(246,241,232,.96));
  box-shadow: 0 10px 24px rgba(65,74,65,.05);
}

.admin-needs-action-mobile-card header,
.admin-activity-mobile-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .7rem;
  padding: .85rem;
  border-bottom: 1px solid var(--admin-border);
}

.admin-needs-action-mobile-card header strong {
  display: block;
  color: var(--admin-text);
  font-size: .62rem;
}

.admin-needs-action-mobile-card header div > span {
  display: block;
  margin-top: .12rem;
  color: var(--admin-text-muted);
  font-size: .52rem;
}

.admin-needs-action-mobile-body,
.admin-activity-mobile-body {
  display: grid;
  gap: .55rem;
  padding: .8rem .85rem;
}

.admin-needs-action-mobile-body > div,
.admin-activity-mobile-body > div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.admin-needs-action-mobile-body span,
.admin-activity-mobile-body span {
  color: var(--admin-text-muted);
  font-size: .55rem;
}

.admin-needs-action-mobile-body strong,
.admin-activity-mobile-body strong {
  max-width: 70%;
  color: var(--admin-text);
  font-size: .59rem;
  text-align: right;
  overflow-wrap: anywhere;
}

.admin-needs-action-mobile-process {
  display: flex;
  justify-content: center;
  margin: 0 .85rem .85rem;
  padding: .58rem;
  border-radius: .68rem;
  color: #fffaf0;
  background: var(--admin-primary-deep);
  font-size: .57rem;
  font-weight: 800;
}

.admin-settings-form {
  width: min(100%, 50rem);
  display: grid;
  gap: 1rem;
}

.admin-settings-notice {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .75rem;
  border: 1px solid rgba(119,137,119,.18);
  border-radius: .75rem;
  background: rgba(119,137,119,.07);
}

.admin-settings-notice > span {
  width: 1.8rem;
  height: 1.8rem;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  border-radius: .55rem;
  color: var(--admin-primary-deep);
  background: rgba(255,255,255,.48);
}

.admin-settings-notice svg {
  width: .9rem;
  height: .9rem;
}

.admin-settings-notice p {
  color: var(--admin-text-soft);
  font-size: .58rem;
  line-height: 1.55;
}

.admin-settings-notice code {
  color: #8f6d39;
  font-weight: 800;
}

.admin-settings-source {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-top: .4rem;
  color: var(--admin-text-muted);
  font-size: .53rem;
}

.admin-settings-source > span {
  width: .4rem;
  height: .4rem;
  flex-shrink: 0;
  border-radius: 999px;
  background: currentColor;
}

.admin-settings-source.is-override {
  color: #8f6d39;
}

.admin-settings-source.is-env {
  color: var(--admin-success);
}

.admin-settings-password-wrap {
  position: relative;
}

.admin-settings-password-wrap .admin-form-control {
  padding-right: 5.6rem;
}

.admin-settings-password-toggle {
  position: absolute;
  top: 50%;
  right: .5rem;
  padding: .35rem .5rem;
  border: 1px solid var(--admin-border);
  border-radius: .55rem;
  color: var(--admin-primary-deep);
  background: rgba(255,255,255,.5);
  font-size: .52rem;
  font-weight: 800;
  transform: translateY(-50%);
}

.admin-settings-submit-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid var(--admin-border);
  border-radius: 1rem;
  background: linear-gradient(145deg,rgba(250,247,240,.98),rgba(246,241,232,.96));
  box-shadow: 0 12px 28px rgba(65,74,65,.055);
}

.admin-settings-submit-panel p {
  margin-top: .35rem;
  color: var(--admin-text-muted);
  font-size: .56rem;
}

.admin-settings-submit-button {
  flex-shrink: 0;
  gap: .45rem;
}

.admin-settings-submit-button svg {
  width: .86rem;
  height: .86rem;
}

.admin-activity-admin {
  display: flex;
  align-items: center;
  gap: .55rem;
}

.admin-activity-admin > span {
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  border-radius: .62rem;
  color: var(--admin-primary-deep);
  background: rgba(119,137,119,.1);
  font-family: 'Fraunces', serif;
  font-size: .68rem;
  font-weight: 750;
}

.admin-activity-admin strong {
  color: var(--admin-text);
  font-size: .62rem;
  font-weight: 750;
}

.admin-activity-action {
  display: inline-flex;
  padding: .34rem .52rem;
  border: 1px solid rgba(119,137,119,.17);
  border-radius: 999px;
  color: var(--admin-primary-deep);
  background: rgba(119,137,119,.09);
  font-size: .54rem;
  font-weight: 750;
}

.admin-activity-subject strong {
  display: block;
  color: var(--admin-text);
  font-size: .6rem;
}

.admin-activity-subject span {
  display: block;
  margin-top: .12rem;
  color: var(--admin-text-muted);
  font-size: .51rem;
}

@media (max-width: 900px) {
  .admin-needs-action-table-panel,
  .admin-activity-table-panel {
    display: none;
  }

  .admin-needs-action-mobile-list,
  .admin-activity-mobile-list {
    display: grid;
  }
}

@media (max-width: 639px) {
  .admin-settings-submit-panel {
    display: block;
  }

  .admin-settings-submit-button {
    width: 100%;
    margin-top: .85rem;
  }
}


/* Maintenance settings and admin accounts */

.admin-account-page {
  display: grid;
  gap: 1rem;
}

.admin-maintenance-status,
.admin-account-count {
  flex-shrink: 0;
  padding: .7rem .85rem;
  border: 1px solid var(--admin-border);
  border-radius: .8rem;
  background: rgba(250,247,240,.75);
  color: var(--admin-text);
  font-size: .62rem;
  font-weight: 800;
}

.admin-maintenance-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
}

.admin-maintenance-status > span {
  width: .48rem;
  height: .48rem;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 .25rem color-mix(in srgb, currentColor 12%, transparent);
}

.admin-maintenance-status.is-enabled {
  color: var(--admin-danger);
}

.admin-maintenance-status.is-disabled {
  color: var(--admin-success);
}

.admin-maintenance-impact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .6rem;
}

.admin-maintenance-impact-grid article {
  padding: .75rem;
  border: 1px solid var(--admin-border);
  border-radius: .75rem;
  background: rgba(255,255,255,.38);
}

.admin-maintenance-impact-grid span,
.admin-account-count span {
  display: block;
  color: var(--admin-text-muted);
  font-size: .52rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.admin-maintenance-impact-grid strong,
.admin-account-count strong {
  display: block;
  margin-top: .2rem;
  color: var(--admin-text);
  font-size: .65rem;
}

.admin-button-secondary {
  border: 1px solid rgba(173,103,93,.25);
  color: #8e5149;
  background: rgba(173,103,93,.1);
}

.admin-button-secondary:hover {
  background: rgba(173,103,93,.16);
}

.admin-account-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.admin-account-identity {
  padding: .75rem;
  border: 1px solid var(--admin-border);
  border-radius: .75rem;
  background: rgba(119,137,119,.06);
}

.admin-account-identity strong,
.admin-account-identity span {
  display: block;
}

.admin-account-identity strong {
  color: var(--admin-text);
  font-size: .72rem;
}

.admin-account-identity span {
  margin-top: .15rem;
  color: var(--admin-text-muted);
  font-size: .57rem;
}

.admin-account-submit {
  width: 100%;
  justify-content: center;
}

.admin-account-list-panel {
  overflow: hidden;
  border: 1px solid var(--admin-border);
  border-radius: 1rem;
  background: linear-gradient(145deg,rgba(250,247,240,.98),rgba(246,241,232,.96));
  box-shadow: 0 12px 28px rgba(65,74,65,.055);
}

.admin-account-list-panel > header {
  padding: 1rem;
  border-bottom: 1px solid var(--admin-border);
}

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

.admin-account-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  padding: .8rem 1rem;
  border-bottom: 1px solid var(--admin-border);
}

.admin-account-item:last-child {
  border-bottom: 0;
}

.admin-account-avatar {
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  border-radius: .68rem;
  color: #fffaf0;
  background: var(--admin-primary-deep);
  font-family: 'Fraunces', serif;
  font-size: .8rem;
  font-weight: 700;
}

.admin-account-item strong,
.admin-account-item > div > span,
.admin-account-meta span,
.admin-account-meta small {
  display: block;
}

.admin-account-item strong {
  color: var(--admin-text);
  font-size: .65rem;
}

.admin-account-item > div > span {
  margin-top: .13rem;
  color: var(--admin-text-muted);
  font-size: .55rem;
}

.admin-account-meta {
  text-align: right;
}

.admin-account-meta span {
  color: var(--admin-success);
  font-size: .56rem;
  font-weight: 800;
}

.admin-account-meta small {
  margin-top: .13rem;
  color: var(--admin-text-muted);
  font-size: .5rem;
}

@media (max-width: 800px) {
  .admin-account-grid,
  .admin-maintenance-impact-grid {
    grid-template-columns: 1fr;
  }

  .admin-account-item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .admin-account-meta {
    grid-column: 2;
    text-align: left;
  }
}

.admin-maintenance-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
}

@media (max-width: 640px) {
  .admin-maintenance-actions,
  .admin-maintenance-actions .admin-button {
    width: 100%;
  }
}

/* Admin account detail and session monitoring */

.admin-account-summary {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  gap: .6rem;
  flex-wrap: wrap;
}

.admin-account-current {
  min-width: 11rem;
  padding: .7rem .85rem;
  border: 1px solid var(--admin-border);
  border-radius: .8rem;
  background: rgba(119,137,119,.07);
}

.admin-account-current span,
.admin-account-current strong,
.admin-account-current small {
  display: block;
}

.admin-account-current span {
  color: var(--admin-text-muted);
  font-size: .5rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.admin-account-current strong {
  margin-top: .22rem;
  color: var(--admin-text);
  font-size: .62rem;
}

.admin-account-current small {
  margin-top: .1rem;
  color: var(--admin-text-muted);
  font-size: .5rem;
}

.admin-account-item {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.admin-account-main {
  min-width: 0;
}

.admin-account-name-row {
  display: flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: wrap;
}

.admin-account-you {
  display: inline-flex !important;
  align-items: center;
  padding: .18rem .4rem;
  border-radius: 999px;
  color: var(--admin-primary-deep) !important;
  background: rgba(119,137,119,.12);
  font-size: .45rem !important;
  font-weight: 800;
}

.admin-account-meta span.is-online,
.admin-account-detail-status.is-online,
.admin-session-item-head span.is-online {
  color: var(--admin-success);
}

.admin-account-meta span.is-offline,
.admin-account-detail-status.is-offline,
.admin-session-item-head span.is-offline {
  color: var(--admin-text-muted);
}

.admin-account-detail-link {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  padding: .48rem .62rem;
  border: 1px solid var(--admin-border);
  border-radius: .62rem;
  color: var(--admin-text);
  background: rgba(255,255,255,.48);
  font-size: .52rem;
  font-weight: 800;
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.admin-account-detail-link:hover {
  border-color: rgba(119,137,119,.34);
  background: rgba(119,137,119,.08);
  transform: translateY(-1px);
}

.admin-account-detail-link svg,
.admin-back-link svg {
  width: .8rem;
  height: .8rem;
}

.admin-account-detail-page {
  display: grid;
  gap: 1rem;
}

.admin-back-link {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-bottom: .7rem;
  color: var(--admin-text-muted);
  font-size: .55rem;
  font-weight: 800;
}

.admin-account-detail-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .65rem .8rem;
  border: 1px solid var(--admin-border);
  border-radius: 999px;
  background: rgba(250,247,240,.78);
  font-size: .55rem;
  font-weight: 800;
}

.admin-account-detail-status > span {
  width: .48rem;
  height: .48rem;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 .22rem color-mix(in srgb, currentColor 12%, transparent);
}

.admin-account-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.admin-account-detail-grid > .admin-form-panel {
  min-height: 100%;
}

.admin-account-avatar-large {
  width: 2.8rem;
  height: 2.8rem;
  font-size: 1rem;
}

.admin-account-detail-list {
  display: grid;
  gap: .55rem;
}

.admin-account-detail-list > div,
.admin-session-item dl > div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem 0;
  border-bottom: 1px solid var(--admin-border);
}

.admin-account-detail-list > div:last-child,
.admin-session-item dl > div:last-child {
  border-bottom: 0;
}

.admin-account-detail-list dt,
.admin-session-item dt {
  color: var(--admin-text-muted);
  font-size: .52rem;
  font-weight: 750;
}

.admin-account-detail-list dd,
.admin-session-item dd {
  color: var(--admin-text);
  font-size: .56rem;
  font-weight: 750;
  text-align: right;
}

.admin-session-list {
  display: grid;
  gap: .65rem;
  padding: 1rem;
}

.admin-session-item {
  padding: .8rem;
  border: 1px solid var(--admin-border);
  border-radius: .8rem;
  background: rgba(255,255,255,.38);
}

.admin-session-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
}

.admin-session-item-head strong {
  color: var(--admin-text);
  font-size: .62rem;
}

.admin-session-item-head span {
  font-size: .5rem;
  font-weight: 800;
}

.admin-session-item dl {
  margin-top: .45rem;
}

.admin-session-item small {
  display: block;
  margin-top: .6rem;
  color: var(--admin-primary-deep);
  font-size: .48rem;
  font-weight: 800;
}

.admin-login-history {
  display: grid;
}

.admin-login-history article {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .7rem;
  padding: .7rem 1rem;
  border-bottom: 1px solid var(--admin-border);
}

.admin-login-history article:last-child {
  border-bottom: 0;
}

.admin-login-history strong,
.admin-login-history small {
  color: var(--admin-text);
  font-size: .54rem;
}

.admin-login-history small {
  color: var(--admin-text-muted);
  text-align: right;
}

.admin-login-result {
  width: fit-content;
  padding: .24rem .45rem;
  border-radius: 999px;
  font-size: .48rem;
  font-weight: 800;
}

.admin-login-result.is-success {
  color: var(--admin-success);
  background: rgba(79,122,83,.1);
}

.admin-login-result.is-failed {
  color: var(--admin-danger);
  background: rgba(173,103,93,.1);
}

.admin-empty-state-compact {
  padding: 1rem;
  color: var(--admin-text-muted);
  font-size: .56rem;
  text-align: center;
}

.admin-danger-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr);
  gap: 1rem;
  padding: 1rem;
  border: 1px solid rgba(173,103,93,.28);
  border-radius: 1rem;
  background: rgba(173,103,93,.06);
}

.admin-danger-panel header p {
  max-width: 38rem;
  margin-top: .45rem;
  color: var(--admin-text-muted);
  font-size: .56rem;
  line-height: 1.65;
}

.admin-delete-admin-form {
  display: grid;
  gap: .65rem;
}

.admin-button-danger {
  justify-content: center;
  border: 1px solid rgba(173,103,93,.32);
  color: #fffaf5;
  background: #a65f56;
}

.admin-button-danger:hover {
  background: #914f47;
}

@media (max-width: 900px) {
  .admin-account-detail-grid,
  .admin-danger-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 800px) {
  .admin-account-item {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .admin-account-detail-link {
    grid-column: 2 / -1;
    width: fit-content;
  }
}

@media (max-width: 560px) {
  .admin-account-summary,
  .admin-account-current,
  .admin-account-count {
    width: 100%;
  }

  .admin-login-history article {
    grid-template-columns: 1fr;
  }

  .admin-login-history small {
    text-align: left;
  }
}
