/* Athenian Social Users Core - Public UI (minimal foundation) */
:root{
  --asu-surface-1: var(--ab-surface-1, #0b0f14);
  --asu-surface-2: var(--ab-surface-2, #111820);
  --asu-surface-3: var(--ab-surface-3, rgba(255,255,255,0.06));
  --asu-border: var(--ab-border, rgba(255,255,255,0.12));
  --asu-border-2: var(--ab-border-2, rgba(255,255,255,0.08));
  --asu-text: var(--ab-text, rgba(255,255,255,0.92));
  --asu-muted: var(--ab-text-muted, rgba(255,255,255,0.65));
  --asu-accent: var(--ab-accent, #7c3aed);
  --asu-accent-12: var(--ab-accent-12, rgba(124,58,237,.12));
  --asu-accent-16: var(--ab-accent-16, rgba(124,58,237,.16));
  --asu-accent-35: var(--ab-accent-35, rgba(124,58,237,.35));
  --asu-ring: var(--ab-ring, rgba(124,58,237,.22));
  --asu-radius: var(--ab-radius, 16px);
  --asu-radius-sm: var(--ab-radius-sm, 12px);
}

.asu-box{
  color: var(--asu-text);
  background:
    radial-gradient(720px 260px at 16% 14%, var(--asu-accent-16), transparent 60%),
    var(--asu-surface-2);
  border: 1px solid var(--asu-border);
  border-radius: var(--asu-radius);
  padding: 16px;
  margin: 16px 0;
  box-shadow: 0 14px 36px rgba(0,0,0,.35);
}

.asu-row{ display:flex; flex-direction:column; gap:6px; margin: 10px 0; }
.asu-row label{ font-size: 12px; color: var(--asu-muted); text-transform: uppercase; letter-spacing: 0; }
.asu-row input, .asu-row textarea, .asu-row select{
  background: var(--asu-surface-3);
  border: 1px solid var(--asu-border);
  color: var(--asu-text);
  border-radius: 12px;
  padding: 10px 12px;
  outline: none;
}
.asu-row input:focus, .asu-row textarea:focus, .asu-row select:focus,
.asu-compose textarea:focus{
  border-color: var(--asu-accent-35);
  box-shadow: 0 0 0 3px var(--asu-ring);
}

.asu-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 10px 14px; border-radius: 12px;
  border: 1px solid var(--asu-accent-35);
  background: var(--asu-accent-12);
  color: var(--asu-text);
  cursor: pointer;
  font-weight: 800;
}
.asu-btn:hover{ background: var(--asu-accent-16); box-shadow: 0 0 0 3px var(--asu-ring); }

.asu-btn--small{ padding: 8px 10px; font-size: 12px; border-radius: 10px; }
.asu-btn--ghost{ background: var(--asu-surface-3); border-color: var(--asu-border); }
.asu-btn--ghost:hover{ border-color: var(--asu-accent-35); background: var(--asu-accent-12); }

.asu-muted{ color: var(--asu-muted); font-size: 12px; }
.asu-status{ margin-top: 8px; font-size: 12px; color: var(--asu-muted); }

.asu-dashboard-head{ display:flex; align-items:center; justify-content:space-between; gap: 12px; margin-bottom: 12px; }
.asu-dashboard-head h3{ margin: 0; }
.asu-dashboard-cards{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin: 12px 0 16px; }
.asu-dashboard-cards--account{ margin: 18px 0; }
.asu-dashboard-card{
  display:grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--asu-border);
  border-radius: var(--asu-radius-sm);
  color: var(--asu-text);
  text-decoration: none;
  background:
    radial-gradient(520px 220px at 16% 18%, var(--asu-accent-12), transparent 60%),
    var(--asu-surface-2);
  box-shadow: 0 14px 36px rgba(0,0,0,.35);
}
.asu-dashboard-card:hover{ border-color: var(--asu-accent-35); background: var(--asu-accent-12); color: var(--asu-text); }
.asu-dashboard-card__title{ color: var(--asu-muted); font-size: 12px; text-transform: uppercase; letter-spacing: 0; }
.asu-dashboard-card__value{ font-size: 30px; line-height: 1; }
.asu-dashboard-card__label{ color: var(--asu-muted); font-size: 12px; }
.asu-dashboard-panels{ display:grid; gap: 16px; }
.asu-dashboard-panel{ min-width: 0; }
.asu-user-dashboard .asu-inbox,
.asu-user-dashboard .asu-alerts{ margin: 0; }

.asu-thumb{ margin-top: 8px; width: 96px; height: 96px; overflow:hidden; border-radius: var(--asu-radius-sm); border:1px solid var(--asu-border); }
.asu-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.asu-thumb--wide{ width: 100%; max-width: 520px; height: 140px; }

.asu-inbox__cols{ display:grid; grid-template-columns: 280px 1fr; gap: 14px; }
.asu-inbox__threads ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap: 8px; }
.asu-inbox__threads li{ padding:10px; border:1px solid var(--asu-border-2); border-radius: var(--asu-radius-sm); background: var(--asu-surface-3); cursor:pointer; display:grid; gap: 4px; }
.asu-inbox__threads li.is-active{ border-color: var(--asu-accent-35); background: var(--asu-accent-12); }
.asu-thread-preview{ color: var(--asu-muted); font-size: 12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.asu-messages{ display:flex; flex-direction:column; gap: 8px; padding: 10px; border:1px solid var(--asu-border); border-radius: var(--asu-radius-sm); min-height: 220px; background: var(--asu-surface-3); }
.asu-msg{ padding:10px; border-radius: var(--asu-radius-sm); border:1px solid var(--asu-border-2); background: var(--asu-surface-2); }
.asu-msg--me{ border-color: var(--asu-accent-35); background: var(--asu-accent-12); }
.asu-compose{ margin-top: 10px; display:flex; gap: 10px; align-items:flex-end; }
.asu-compose textarea{ flex: 1; background: var(--asu-surface-3); border: 1px solid var(--asu-border); border-radius: 12px; color: var(--asu-text); padding: 10px 12px; outline: none; }

.asu-alerts__head{ display:flex; justify-content:space-between; align-items:center; gap: 12px; margin-bottom: 10px; }
.asu-alerts__head h3{ margin: 0; }
.asu-alerts__list{ list-style:none; padding:0; margin:0; display:grid; gap: 8px; }
.asu-alert{ padding: 10px; border:1px solid var(--asu-border-2); border-radius: var(--asu-radius-sm); background: var(--asu-surface-3); }
.asu-alert.is-unread{ border-color: var(--asu-accent-35); background: var(--asu-accent-12); }
.asu-alert__meta{ display:flex; align-items:center; justify-content:space-between; gap: 10px; margin-top: 8px; color: var(--asu-muted); }

.asu-grid__wrap{ display:grid; grid-template-columns: repeat(auto-fill, minmax(180px,1fr)); gap: 12px; }
.asu-card-user{
  border:1px solid var(--asu-border);
  border-radius: var(--asu-radius);
  padding: 12px;
  background: var(--asu-surface-3);
  display:flex; flex-direction:column; gap: 8px;
}
.asu-card-user__avatar{ width: 64px; height:64px; border-radius: var(--asu-radius-sm); overflow:hidden; border:1px solid var(--asu-border); background: var(--asu-surface-3); }
.asu-card-user__avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.asu-avatar-fallback{ width:100%; height:100%; background: linear-gradient(135deg, var(--asu-accent-35), var(--asu-accent-12)); }
.asu-card-user__name{ font-weight: 700; }
.asu-card-user__tagline{ color: var(--asu-muted); font-size: 12px; }

#account-content .ab-account-main__inner.woocommerce > .asu-dashboard-cards--account{
  grid-column: 1 / -1 !important;
  margin: 0 !important;
}

#account-content .asu-box,
#account-content .asu-dashboard-card{
  border-radius: var(--ab-radius, var(--asu-radius));
}

@media (max-width: 860px){
  .asu-inbox__cols{ grid-template-columns: 1fr; }
  .asu-dashboard-cards{ grid-template-columns: 1fr; }
  .asu-compose{ flex-direction:column; align-items:stretch; }
  .asu-alerts__head,
  .asu-alert__meta{ align-items:flex-start; flex-direction:column; }
}
