/* Trebien Superadmin — shell editorial alinhado à loja */

.admin-body {
  min-height: 100vh;
  margin: 0;
  color: var(--color-text);
  background:
    radial-gradient(circle at 88% 6%, rgba(166, 83, 0, .08), transparent 24rem),
    linear-gradient(180deg, #faf9f5 0%, var(--color-page) 48%, #f2f0e9 100%);
}

.admin-topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  min-height: 4.75rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem clamp(1rem, 3vw, 2rem);
  background: rgba(250, 249, 245, .92);
  border-bottom: 1px solid rgba(115, 57, 0, .12);
  box-shadow: 0 .45rem 1.5rem rgba(24, 30, 27, .045);
  backdrop-filter: blur(16px);
}

.admin-brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.admin-brand img {
  display: block;
  width: auto;
  height: 2.55rem;
  max-width: 11rem;
  object-fit: contain;
}

.admin-topbar-actions {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.admin-role-badge,
.admin-readonly-badge {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: .35rem .7rem;
  border-radius: var(--radius-pill);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.admin-role-badge {
  color: var(--color-brand-strong);
  background: var(--color-brand-soft);
  border: 1px solid #edd1ad;
}

.admin-store-link {
  display: inline-flex;
  min-height: 2.5rem;
  align-items: center;
  padding: .35rem .7rem;
  color: var(--color-text);
  border-radius: .45rem;
  font-size: .82rem;
  font-weight: 900;
  text-decoration: none;
}

.admin-store-link:hover {
  color: var(--color-brand-strong);
  background: var(--color-brand-soft);
}

.admin-shell {
  display: grid;
  grid-template-columns: 16.5rem minmax(0, 1fr);
  min-height: calc(100vh - 4.75rem);
}

.admin-sidebar {
  position: sticky;
  top: 4.75rem;
  align-self: start;
  height: calc(100vh - 4.75rem);
  padding: 1.65rem 1rem 1.25rem;
  overflow-y: auto;
  color: #f9f7f1;
  background:
    radial-gradient(circle at 30% 0%, rgba(166, 83, 0, .24), transparent 17rem),
    linear-gradient(180deg, #17201d 0%, #1b2521 58%, #111815 100%);
  border-right: 1px solid rgba(255,255,255,.05);
}

.admin-sidebar-heading {
  display: grid;
  gap: .18rem;
  margin-bottom: 1.35rem;
  padding: 0 .65rem .9rem;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

.admin-sidebar-kicker,
.admin-eyebrow {
  color: var(--color-brand);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.admin-sidebar-kicker { color: #d7b27d; }

.admin-sidebar-heading strong {
  color: #fff;
  font-family: var(--font-display);
  font-size: 1.12rem;
  letter-spacing: -.02em;
}

.admin-nav {
  display: grid;
  gap: .28rem;
}

.admin-nav a {
  position: relative;
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  padding: .65rem .8rem .65rem 1rem;
  color: #cbd1cd;
  border: 1px solid transparent;
  border-radius: .58rem;
  font-size: .86rem;
  font-weight: 750;
  text-decoration: none;
  transition: color var(--transition-fast) ease, background var(--transition-fast) ease, border-color var(--transition-fast) ease;
}

.admin-nav a::before {
  content: "";
  position: absolute;
  left: .42rem;
  width: .18rem;
  height: 1rem;
  background: transparent;
  border-radius: var(--radius-pill);
}

.admin-nav a:hover {
  color: #fff;
  background: rgba(255,255,255,.065);
  border-color: rgba(255,255,255,.06);
}

.admin-nav a.active,
.admin-nav a[aria-current="page"] {
  color: #fff;
  background: rgba(166, 83, 0, .2);
  border-color: rgba(222, 168, 99, .18);
}

.admin-nav a.active::before,
.admin-nav a[aria-current="page"]::before {
  background: #dba96b;
}

.admin-nav a[aria-disabled="true"] {
  color: #737d77;
  cursor: not-allowed;
}

.admin-sidebar-note {
  margin-top: 2rem;
  padding: 1rem;
  color: #cbd1cd;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: .72rem;
}

.admin-sidebar-note strong {
  color: #f1d7b1;
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .09em;
}

.admin-sidebar-note p {
  margin: .45rem 0 0;
  font-size: .75rem;
  line-height: 1.55;
}

.admin-main {
  width: min(100%, 94rem);
  padding: clamp(1.25rem, 3vw, 2.5rem);
}

.admin-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.25rem;
  margin-bottom: 1rem;
  padding: clamp(1rem, 2.2vw, 1.5rem) 0 .5rem;
}

.admin-hero h1 {
  max-width: 18ch;
  margin: .3rem 0 .5rem;
  font-size: clamp(2.25rem, 4.5vw, 3.65rem);
  line-height: 1;
  letter-spacing: -.04em;
}

.admin-hero p:last-child {
  max-width: 52rem;
  margin: 0;
  color: var(--color-text-muted);
}

.admin-refresh,
.admin-primary-button,
.admin-secondary-button {
  display: inline-flex;
  min-height: 2.85rem;
  align-items: center;
  justify-content: center;
  padding: .62rem 1rem;
  border-radius: .55rem;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}

.admin-refresh,
.admin-primary-button {
  flex: 0 0 auto;
  color: #fff;
  background: var(--color-surface-inverse);
  border: 1px solid var(--color-surface-inverse);
}

.admin-refresh:hover,
.admin-primary-button:hover {
  background: var(--color-brand-strong);
  border-color: var(--color-brand-strong);
}

.admin-secondary-button {
  color: var(--color-brand-strong);
  background: var(--color-brand-soft);
  border: 1px solid #edd1ad;
}

.admin-secondary-button:hover {
  color: #fff;
  background: var(--color-brand);
  border-color: var(--color-brand);
}

.admin-link-button {
  padding: .35rem .45rem;
  color: var(--color-brand-strong);
  background: transparent;
  border: 0;
  font-weight: 850;
  cursor: pointer;
}

.admin-status {
  margin: 1rem 0 1.25rem;
  padding: .85rem 1rem;
  color: var(--color-text-muted);
  background: rgba(255,255,255,.86);
  border: 1px solid var(--color-border);
  border-radius: .65rem;
  box-shadow: 0 .45rem 1.5rem rgba(24,30,27,.035);
  font-size: .84rem;
}

.admin-status[data-state="ok"],
.admin-status.success {
  color: var(--color-success);
  background: var(--color-success-soft);
  border-color: #bfd9c9;
}

.admin-status[data-state="error"],
.admin-status.error {
  color: var(--color-danger);
  background: var(--color-danger-soft);
  border-color: #e6bcb8;
}

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

.admin-metric {
  position: relative;
  display: grid;
  gap: .35rem;
  min-height: 8.5rem;
  padding: 1.15rem;
  overflow: hidden;
  background: rgba(255,255,255,.9);
  border: 1px solid var(--color-border);
  border-radius: .78rem;
  box-shadow: 0 .8rem 2rem rgba(24,30,27,.045);
}

.admin-metric::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 3.4rem;
  height: .22rem;
  background: var(--color-brand);
}

.admin-metric span,
.admin-metric small {
  color: var(--color-text-soft);
  font-size: .75rem;
}

.admin-metric span {
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.admin-metric strong {
  margin-top: auto;
  font-family: var(--font-display);
  font-size: 2.15rem;
  line-height: 1;
}

.admin-section {
  margin-top: 2.2rem;
}

.admin-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.admin-section-heading h2 {
  margin: .18rem 0 0;
  font-size: clamp(1.55rem, 2.6vw, 2.15rem);
}

.admin-section-copy {
  max-width: 72ch;
  color: var(--color-text-muted);
}

.admin-readonly-badge {
  color: var(--color-warning);
  background: var(--color-warning-soft);
  border: 1px solid #e6d19a;
}

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

.admin-module {
  position: relative;
  min-height: 15.5rem;
  padding: 1.2rem;
  overflow: hidden;
  background: rgba(255,255,255,.9);
  border: 1px solid var(--color-border);
  border-radius: .8rem;
  box-shadow: 0 .8rem 2rem rgba(24,30,27,.045);
}

.admin-module-enabled {
  border-color: #d7d1c4;
}

.admin-module-enabled:hover {
  transform: translateY(-2px);
  box-shadow: 0 1rem 2.6rem rgba(24,30,27,.075);
}

.admin-module-icon {
  display: grid;
  width: 2.45rem;
  height: 2.45rem;
  place-items: center;
  margin-bottom: 1rem;
  color: var(--color-brand-strong);
  background: var(--color-brand-soft);
  border: 1px solid #edd1ad;
  border-radius: .58rem;
  font-size: .7rem;
  font-weight: 950;
}

.admin-module h3 {
  margin: 0 0 .45rem;
  font-size: 1.03rem;
}

.admin-module p {
  min-height: 3.6rem;
  margin: 0 0 1rem;
  color: var(--color-text-muted);
  font-size: .84rem;
  line-height: 1.55;
}

.admin-module button {
  width: 100%;
  min-height: 2.65rem;
  color: #858b86;
  background: #f2f1ec;
  border: 1px solid #deddd6;
  border-radius: .5rem;
  font-weight: 850;
}

.admin-module .admin-primary-button {
  width: 100%;
}

.admin-module small {
  display: block;
  margin-top: .65rem;
  color: var(--color-text-soft);
  line-height: 1.45;
}

.admin-module-critical {
  border-color: #e4ccb0;
  background: #fff9f1;
}

.admin-security-section {
  padding-bottom: 3rem;
}

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

.admin-security-grid > div {
  padding: 1rem 1.05rem;
  background: rgba(255,255,255,.86);
  border: 1px solid var(--color-border);
  border-left: .24rem solid var(--color-brand);
  border-radius: 0 .65rem .65rem 0;
}

.admin-security-grid strong {
  font-size: .86rem;
}

.admin-security-grid p {
  margin: .35rem 0 0;
  color: var(--color-text-muted);
  font-size: .8rem;
  line-height: 1.55;
}

@media (max-width: 70rem) {
  .admin-shell { grid-template-columns: 13.75rem minmax(0, 1fr); }
  .admin-module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
  .admin-topbar { position: static; min-height: 4rem; }
  .admin-shell { display: block; }
  .admin-sidebar { position: static; height: auto; padding: .75rem 1rem; }
  .admin-sidebar-heading,
  .admin-sidebar-note { display: none; }
  .admin-nav { display: flex; gap: .4rem; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: thin; }
  .admin-nav a { flex: 0 0 auto; min-height: 2.45rem; padding: .5rem .75rem; white-space: nowrap; }
  .admin-nav a::before { display: none; }
  .admin-main { padding: 1rem; }
  .admin-hero { align-items: start; flex-direction: column; }
  .admin-refresh { width: 100%; }
  .admin-module-grid,
  .admin-security-grid { grid-template-columns: 1fr; }
}

@media (max-width: 32rem) {
  .admin-role-badge { display: none; }
  .admin-topbar-actions { gap: .25rem; }
  .admin-store-link { font-size: .76rem; }
  .admin-metrics { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .admin-metric { min-height: 7rem; padding: .9rem; }
  .admin-metric strong { font-size: 1.75rem; }
}