/* Darwesh Personal Account — Home design language.
   Same surfaces, champagne accent, typography and restraint as Home.
   No Meta sidebar. No admin shell. No account-only brand logo. */

.aw-scope {
  --aw-page: #F6F1E8;
  --aw-surface: rgba(255, 255, 255, 0.72);
  --aw-surface-solid: #FBF7F0;
  --aw-field: #FFFFFF;
  --aw-text: #2F2A26;
  --aw-muted: #6E6258;
  --aw-soft: #8A7E72;
  --aw-edge: rgba(42, 45, 49, 0.12);
  --aw-edge-strong: rgba(42, 45, 49, 0.18);
  --aw-champagne: #B49A6A;
  --aw-champagne-hi: #D4C4A0;
  --aw-green: #2F4439;
  --aw-green-text: #2F4439;
  --aw-amber: #A66F1A;
  --aw-steel: #5A6F86;
  --aw-violet: #6E5F96;
  --aw-danger: #B42318;
  --aw-danger-bg: rgba(180, 35, 24, 0.07);
  --aw-hover: rgba(47, 42, 38, 0.04);
  --aw-selected: rgba(180, 154, 106, 0.12);
  --aw-radius: 14px;
  --aw-radius-sm: 10px;
  --aw-font: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;
  --aw-max: 1160px;

  min-height: 100dvh;
  background: var(--aw-page);
  color: var(--aw-text);
  font-family: var(--aw-font);
  font-size: 14.5px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

html:not([data-dg-theme="light"]) .aw-scope {
  --aw-page: #0D0F12;
  --aw-surface: rgba(28, 33, 40, 0.72);
  --aw-surface-solid: #141619;
  --aw-field: #1C2128;
  --aw-text: #F1F3F5;
  --aw-muted: #A5ABB3;
  --aw-soft: #8F887C;
  --aw-edge: rgba(215, 219, 224, 0.12);
  --aw-edge-strong: rgba(215, 219, 224, 0.18);
  --aw-champagne: #C69A4B;
  --aw-champagne-hi: #D4AF60;
  --aw-green: #16362E;
  --aw-green-text: #6BD99A;
  --aw-amber: #C9923A;
  --aw-steel: #7A90A8;
  --aw-violet: #8B7BB5;
  --aw-danger: #EFA49A;
  --aw-danger-bg: rgba(92, 26, 26, 0.22);
  --aw-hover: rgba(241, 243, 245, 0.04);
  --aw-selected: rgba(198, 154, 75, 0.14);
}

.aw-scope *,
.aw-scope *::before,
.aw-scope *::after { box-sizing: border-box; }
.aw-scope .material-symbols-outlined {
  font-family: 'Material Symbols Outlined', sans-serif !important;
  font-variation-settings: 'FILL' 0, 'wght' 380, 'GRAD' 0, 'opsz' 24;
  font-size: 18px;
}

/* ——— Page frame ——— */
.aw-page {
  max-width: var(--aw-max);
  margin: 0 auto;
  padding: 28px 20px 64px;
}

/* ——— Compact identity ——— */
.aw-identity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 20px;
  margin-bottom: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--aw-edge);
}
.aw-identity-main {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.aw-avatar-wrap { position: relative; width: 52px; height: 52px; flex: none; }
.aw-avatar {
  width: 52px; height: 52px; border-radius: 14px;
  border: 1px solid var(--aw-edge-strong);
  background: var(--aw-surface-solid);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.aw-avatar .material-symbols-outlined { font-size: 24px; color: var(--aw-soft); }
.aw-avatar img { width: 100%; height: 100%; object-fit: cover; }
.aw-avatar-edit {
  position: absolute; inset-inline-end: -3px; bottom: -3px;
  width: 22px; height: 22px; border-radius: 7px;
  border: 1px solid var(--aw-edge-strong);
  background: var(--aw-surface-solid); color: var(--aw-text);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.aw-avatar-edit .material-symbols-outlined { font-size: 12px; }
.aw-avatar-edit input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.aw-id-block { min-width: 0; }
.aw-display-name {
  margin: 0;
  font-size: 17px; font-weight: 600;
  letter-spacing: -0.015em; color: var(--aw-text);
}
.aw-id-line {
  margin: 3px 0 0;
  font-size: 13px; color: var(--aw-muted); font-weight: 500;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
}
.aw-family { margin: 0; }
.aw-darwesh-id {
  margin: 0;
  font-family: 'IBM Plex Sans', var(--aw-font);
  font-size: 12px; letter-spacing: 0.04em; color: var(--aw-champagne);
  direction: ltr; unicode-bidi: isolate;
}
.aw-id-sep { opacity: 0.45; }
.aw-status {
  display: inline-flex; align-items: center;
  min-height: 22px; padding: 0 8px;
  border-radius: 6px; border: 1px solid var(--aw-edge);
  font-size: 11px; font-weight: 600; color: var(--aw-muted);
  background: transparent;
}
.aw-status[data-tone="ok"] { border-color: color-mix(in srgb, var(--aw-green-text) 40%, transparent); color: var(--aw-green-text); }
.aw-status[data-tone="warn"] { border-color: color-mix(in srgb, var(--aw-amber) 42%, transparent); color: var(--aw-amber); }
.aw-status[data-tone="bad"] { border-color: color-mix(in srgb, var(--aw-danger) 42%, transparent); color: var(--aw-danger); }
.aw-status[data-tone="draft"] { color: var(--aw-steel); border-color: color-mix(in srgb, var(--aw-steel) 38%, transparent); }
.aw-status[data-tone="sold"] { color: var(--aw-steel); }
.aw-photo-status { font-size: 11px; color: var(--aw-muted); margin-top: 4px; }
.aw-identity-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ——— Account nav (Home-like underline) ——— */
.aw-tabs {
  position: relative;
  margin-bottom: 28px;
  border-bottom: 1px solid var(--aw-edge);
}
.aw-tabs-track {
  display: flex; flex-wrap: nowrap; gap: 2px;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; padding-bottom: 0;
}
.aw-tabs-track::-webkit-scrollbar { display: none; }
.aw-tab {
  appearance: none; flex: none;
  min-height: 44px; padding: 0 14px;
  border: 0; border-bottom: 2px solid transparent;
  background: transparent; color: var(--aw-muted);
  font-family: inherit; font-size: 14px; font-weight: 500;
  cursor: pointer; white-space: nowrap;
  transition: color 160ms ease, border-color 160ms ease;
}
.aw-tab:hover { color: var(--aw-text); }
.aw-tab.active {
  color: var(--aw-text); font-weight: 600;
  border-bottom-color: var(--aw-champagne);
}
.aw-tab.hidden { display: none; }
.aw-tabs-select.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ——— Main panels ——— */
.aw-main { min-width: 0; }
.aw-panel { display: none; }
.aw-panel.active {
  display: block;
  animation: aw-in 170ms ease-out;
}
@keyframes aw-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.aw-page-head { margin: 0 0 22px; }
.aw-page-head--row {
  display: flex; flex-wrap: wrap;
  align-items: flex-start; justify-content: space-between;
  gap: 12px 16px;
}
.aw-page-title {
  margin: 0 0 6px;
  font-size: 30px; font-weight: 600;
  letter-spacing: -0.02em; line-height: 1.15; color: var(--aw-text);
}
.aw-page-lead {
  margin: 0; max-width: 36rem;
  font-size: 14px; font-weight: 400; color: var(--aw-muted); line-height: 1.5;
}
.aw-block-title {
  margin: 0 0 12px;
  font-size: 17px; font-weight: 600; color: var(--aw-text);
}
.aw-section-title {
  margin: 0 0 6px;
  font-size: 30px; font-weight: 600; letter-spacing: -0.02em;
}
.aw-section-lead {
  margin: 0 0 18px;
  font-size: 14px; color: var(--aw-muted);
}

/* ——— Surfaces (Home glass restraint) ——— */
.aw-surface {
  border: 1px solid var(--aw-edge);
  border-radius: var(--aw-radius);
  background: var(--aw-surface);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow: hidden;
}
html:not([data-dg-theme="light"]) .aw-surface {
  background: var(--aw-surface-solid);
  backdrop-filter: none;
}

/* ——— Overview ——— */
.aw-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: var(--aw-edge);
  border: 1px solid var(--aw-edge);
  border-radius: var(--aw-radius);
  overflow: hidden;
  margin-bottom: 28px;
}
.aw-metric {
  appearance: none; border: 0; margin: 0; width: 100%; text-align: start;
  background: var(--aw-surface-solid);
  padding: 16px 18px;
  display: flex; flex-direction: column; gap: 6px;
  font-family: inherit; cursor: pointer; color: inherit;
  transition: background-color 150ms ease;
}
.aw-metric:hover { background: color-mix(in srgb, var(--aw-surface-solid) 88%, var(--aw-champagne)); }
.aw-metric:focus-visible { outline: 1.5px solid var(--aw-champagne); outline-offset: -2px; z-index: 1; }
.aw-metric-label {
  font-size: 12px; font-weight: 500; color: var(--aw-muted);
}
.aw-metric-value {
  font-size: 26px; font-weight: 600; letter-spacing: -0.02em; color: var(--aw-text);
}
.aw-metric--published .aw-metric-value { color: var(--aw-green-text); }
.aw-metric--pending .aw-metric-value { color: var(--aw-amber); }
.aw-metric--saved .aw-metric-value { color: var(--aw-violet); }

.aw-ov-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 24px;
  align-items: start;
}
.aw-activity { display: grid; gap: 0; }
.aw-activity-row {
  display: grid; grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px; align-items: start;
  padding: 14px 0;
  border-top: 1px solid var(--aw-edge);
}
.aw-activity-row:first-child { border-top: 0; padding-top: 0; }
.aw-activity-icon {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: var(--aw-field); border: 1px solid var(--aw-edge); color: var(--aw-soft);
}
.aw-activity-title { margin: 0; font-size: 14px; font-weight: 600; color: var(--aw-text); }
.aw-activity-meta { margin: 2px 0 0; font-size: 12.5px; color: var(--aw-muted); }

.aw-summary {
  border: 1px solid var(--aw-edge);
  border-radius: var(--aw-radius);
  background: var(--aw-surface-solid);
  padding: 4px 0;
}
.aw-summary-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 14px 16px;
  border-top: 1px solid var(--aw-edge);
}
.aw-summary-row:first-child { border-top: 0; }
.aw-summary-label { margin: 0; font-size: 12px; color: var(--aw-muted); }
.aw-summary-value { margin: 3px 0 0; font-size: 14.5px; font-weight: 600; color: var(--aw-text); }
.aw-summary-value.ltr { direction: ltr; unicode-bidi: isolate; }
.aw-summary-value--points { color: var(--aw-amber); }

/* ——— Settings groups ——— */
.aw-settings-group { margin-bottom: 22px; }
.aw-settings-group-title {
  margin: 0 0 10px; padding-inline: 2px;
  font-size: 12px; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--aw-soft);
}
.aw-setting-list {
  border: 1px solid var(--aw-edge);
  border-radius: var(--aw-radius);
  background: var(--aw-surface-solid);
  overflow: hidden;
}
.aw-setting-row {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: 12px 16px;
  min-height: 64px; padding: 14px 16px;
  border-top: 1px solid var(--aw-edge);
}
.aw-setting-row:first-child { border-top: 0; }
.aw-setting-copy {
  display: flex; align-items: flex-start; gap: 12px;
  min-width: 0; flex: 1;
}
.aw-setting-icon { color: var(--aw-soft); flex: none; margin-top: 2px; }
.aw-setting-title { margin: 0; font-size: 14.5px; font-weight: 600; color: var(--aw-text); }
.aw-setting-desc { margin: 2px 0 0; font-size: 13px; color: var(--aw-muted); }
.aw-setting-value { margin: 2px 0 0; font-size: 13.5px; color: var(--aw-muted); }
.aw-setting-value.ltr { direction: ltr; unicode-bidi: isolate; }
.aw-setting-action {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px; flex: none;
}
.aw-readonly { font-size: 12px; color: var(--aw-soft); font-weight: 500; }

/* ——— Profile info ——— */
.aw-profile-section { margin-bottom: 26px; }
.aw-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 28px;
}
.aw-info-item { min-width: 0; }
.aw-info-label {
  display: block; font-size: 12px; font-weight: 500;
  color: var(--aw-muted); margin-bottom: 4px;
}
.aw-info-value {
  display: block; font-size: 15px; font-weight: 500;
  color: var(--aw-text); word-break: break-word;
}
.aw-info-value.ltr { direction: ltr; unicode-bidi: isolate; }

/* ——— Forms ——— */
.aw-form { max-width: 420px; }
.aw-field { margin-bottom: 18px; }
.aw-label {
  display: block; font-size: 12.5px; font-weight: 600;
  color: var(--aw-muted); margin-bottom: 8px;
}
.aw-control, .aw-scope .settings-input {
  width: 100%; height: 48px; border-radius: 12px;
  border: 1px solid var(--aw-edge-strong);
  background: var(--aw-field); color: var(--aw-text);
  padding: 0 14px; font-size: 15px; font-family: inherit;
}
.aw-control:focus, .aw-scope .settings-input:focus {
  outline: 2px solid color-mix(in srgb, var(--aw-champagne) 65%, transparent);
  outline-offset: 1px;
}
/* ——— Buttons: see css/darwesh-buttons.css (.dg-action / .aw-btn aliases) ——— */
.aw-form-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }

/* Segment visuals live in darwesh-buttons.css; keep local spacing only */
.aw-segment { margin-bottom: 18px; }

/* ——— Properties / Saved ——— */
.aw-prop-list { display: grid; gap: 12px; }
.aw-prop-row {
  display: grid; grid-template-columns: 148px minmax(0, 1fr) auto;
  gap: 14px; align-items: center; padding: 12px;
  border: 1px solid var(--aw-edge); border-radius: var(--aw-radius);
  background: var(--aw-surface-solid);
  transition: border-color 160ms ease, background 160ms ease;
}
.aw-prop-row:hover { border-color: var(--aw-edge-strong); }
.aw-prop-thumb {
  width: 148px; height: 100px; border-radius: 12px; overflow: hidden;
  background: var(--aw-field); border: 1px solid var(--aw-edge);
  display: flex; align-items: center; justify-content: center;
  color: var(--aw-soft); flex: none;
}
.aw-prop-thumb img { width: 100%; height: 100%; object-fit: cover; }
.aw-prop-body { min-width: 0; }
.aw-prop-title { margin: 0; font-size: 15px; font-weight: 600; color: var(--aw-text); }
.aw-prop-meta {
  margin: 4px 0 0; display: flex; flex-wrap: wrap; gap: 6px 12px;
  font-size: 12.5px; color: var(--aw-muted);
}
.aw-prop-meta .ltr { direction: ltr; unicode-bidi: isolate; font-weight: 600; color: var(--aw-text); }
.aw-prop-status { margin: 8px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.aw-prop-date { font-size: 11.5px; color: var(--aw-soft); }
.aw-prop-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }

.aw-saved-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px;
}
.aw-saved-card {
  border: 1px solid var(--aw-edge); border-radius: var(--aw-radius);
  background: var(--aw-surface-solid); overflow: hidden;
  display: flex; flex-direction: column;
}
.aw-saved-card .aw-prop-thumb {
  width: 100%; height: 148px; border: 0; border-radius: 0;
  border-bottom: 1px solid var(--aw-edge);
}
.aw-saved-card .aw-prop-body { padding: 12px; display: grid; gap: 4px; flex: 1; }
.aw-saved-card .aw-prop-actions { margin-top: 8px; justify-content: flex-start; }

.aw-empty { padding: 4px 0 0; color: var(--aw-muted); font-size: 14px; line-height: 1.5; }
.aw-empty a { color: var(--aw-champagne); }
.aw-empty-block { padding: 32px 0; max-width: 24rem; text-align: center; margin: 0 auto; }
.aw-empty-icon {
  width: 42px; height: 42px; margin: 0 auto 12px; border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  background: var(--aw-field); border: 1px solid var(--aw-edge); color: var(--aw-violet);
}

.aw-mgmt {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  padding: 14px; border: 1px solid var(--aw-edge); border-radius: var(--aw-radius);
  background: var(--aw-surface-solid); margin-bottom: 20px;
}
.aw-mgmt-icon {
  width: 40px; height: 40px; border-radius: 10px;
  background: var(--aw-field); border: 1px solid var(--aw-edge);
  display: flex; align-items: center; justify-content: center;
  color: var(--aw-champagne); flex: none;
}
.aw-mgmt-body { flex: 1; min-width: 160px; }
.aw-mgmt-title { margin: 0; font-size: 15px; font-weight: 600; }
.aw-mgmt-desc { margin: 3px 0 0; font-size: 12.5px; color: var(--aw-muted); }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.hidden { display: none !important; }

@media (max-width: 900px) {
  .aw-ov-grid { grid-template-columns: 1fr; }
  .aw-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aw-saved-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aw-prop-row { grid-template-columns: 110px minmax(0, 1fr); }
  .aw-prop-thumb { width: 110px; height: 78px; }
  .aw-prop-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .aw-info-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .aw-page { padding: 20px 16px 48px; }
  .aw-page-title, .aw-section-title { font-size: 26px; }
  .aw-metrics { grid-template-columns: 1fr 1fr; }
  .aw-saved-grid { grid-template-columns: 1fr; }
  .aw-prop-row { grid-template-columns: 88px minmax(0, 1fr); }
  .aw-prop-thumb { width: 88px; height: 68px; }
  .aw-setting-row { align-items: flex-start; }
}