/* בלק צ'רי — פורטל עסקי: פרופיל משתמש
   מקור: עיצוב/figma-extract/2026-07-20/phase-b/ · Profile 2053:5765 (דסקטופ 1440) ·
   profile 2088:9033 (מובייל 393). כל המידות נמדדו מ-node-JSON (figma-spec.js), לא מהעין.
   ⚠ אין edit ל-tokens.css/base.css/checkout.css — הכל כאן. */

.pp-main { padding-block: 48px 96px; }

/* 2053:5768/5769/5770 — Heading3 Google Sans 24/400/lh36 · 2053:5771 קו-רקע 48×4 מתחתיו */
.pp-head { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; margin-block-end: 48px; }
.pp-title {
  font-family: var(--font-display); font-size: var(--fs-h3); font-weight: var(--fw-regular);
  line-height: 1.5; color: #1a1c1b; margin: 0;
}
.pp-accent { inline-size: 48px; block-size: 4px; background: #7b535c; border-radius: var(--radius-hair); }

.pp-status { color: var(--bc-ink-soft); }
.pp-error { color: #b3261e; }
.pp-sr-live { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.pp-sections { display: flex; flex-direction: column; gap: 32px; max-inline-size: 916px; margin-inline-start: auto; }

/* ── כרטיס סקשן (2055:1227/1286/2097:2808) — לא נבנה כ"כרטיס" נפרד בפיגמה (בלי רקע/צל
   על כל סקשן), אבל כרטיס עדין עוזר להפריד שלושה בלוקים בעמוד עצמאי; קו-הפרדה תחתון
   כמו checkout.css .co-section. ── */
.pp-card {
  background: var(--bc-white);
  border: 1px solid rgba(214, 194, 196, .1);
  border-radius: var(--radius-btn);
  box-shadow: 0 4px 24px rgba(0, 0, 0, .04);
  padding: 32px;
}
.pp-card-muted { background: var(--bc-base-2); box-shadow: none; }

/* 2055:1281/1325 — Container gap 12, justify-end, align-center; כותרת 20/400 + כפתור-עריכה */
.pp-card-head {
  display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end;
  gap: 12px; margin-block-end: 32px;
}
.pp-card-head h2 {
  display: flex; align-items: center; gap: 12px;
  font-size: var(--fs-20); font-weight: var(--fw-regular); line-height: 1.4;
  color: var(--bc-ink); margin: 0; flex: 1;
}
.pp-card-head h2 i { font-size: 16px; color: var(--bc-ink); flex: none; }

/* 2055:1917/1922 — קו-תחתון ורוד 2px, טקסט 18/500 בורדו; מצב Disable = אפור, בלי אינטראקציה */
.pp-edit {
  color: var(--bc-primary); font-size: var(--fs-lg); font-weight: var(--fw-medium);
  border-block-end: 2px solid var(--bc-rose-soft); padding-block-end: 2px;
}
.pp-edit:hover { border-block-end-color: var(--bc-primary); }
.pp-edit-disabled, .pp-edit:disabled {
  color: #9f9f9f; border-block-end-color: #d8d8d8; cursor: default; pointer-events: none;
}

/* 2055:1232/1329/2097:2816 — grid 2×393, gap 32/32; שורות 86px */
.pp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.pp-grid-1 { grid-template-columns: 1fr; max-inline-size: 394px; }
.pp-field { display: flex; flex-direction: column; gap: 8px; min-inline-size: 0; }
/* 2055:1235 — Heebo 400/14/lh20 #444 */
.pp-field label { font-size: var(--fs-sm); font-weight: var(--fw-regular); line-height: 1.43; color: var(--bc-ink-mute); }
/* 2055:1236 Input — גובה 58, r2, fill #f8f7f4, stroke #d8d8d8; ערך 16/400 Google Sans */
.pp-field input {
  font: inherit; font-size: var(--fs-md); color: var(--bc-ink);
  border: 1px solid #d8d8d8; border-radius: var(--radius-hair);
  padding: 16px; background: var(--bc-base-2); inline-size: 100%; min-block-size: 58px;
}
.pp-field input:disabled { color: var(--bc-ink); cursor: default; }
.pp-field input:not(:disabled):focus {
  outline: 2px solid var(--bc-rose); outline-offset: 1px; border-color: transparent; background: var(--bc-white);
}
.pp-field input.invalid { border-color: #b3261e; }

/* 2097:2843/2848 — "הנחת לקוח" אפור לגמרי גם בלייבל (#9f9f9f), לא רק בכפתור */
.pp-field-muted label, .pp-field-muted input { color: #9f9f9f; }
.pp-field-muted input { font-style: normal; }

.pp-hint { margin: 16px 0 0; font-size: var(--fs-2xs); color: var(--bc-ink-soft); }

.pp-field-error { color: #b3261e; font-size: var(--fs-sm); margin: 16px 0 0; }

/* 2055:1379/1380/1381 — Frame154 gap 48; Primary button r54, Text-button ביטול */
.pp-actions { display: flex; align-items: center; gap: 48px; margin-block-start: 32px; }
.pp-save-btn { border-radius: var(--radius-hero); padding-inline: 32px; min-block-size: 48px; font-size: var(--fs-lg); }
.pp-save-btn:disabled { opacity: .6; cursor: default; }
.pp-cancel {
  color: var(--bc-primary); font-size: var(--fs-lg); font-weight: var(--fw-medium);
  border-block-end: 2px solid var(--bc-rose-soft); padding-block-end: 2px;
}
.pp-cancel:hover { border-block-end-color: var(--bc-primary); }

/* ── מובייל (profile 2088:9033, 393 רוחב) — שדות נערמים, כרטיס padding מצומצם ── */
@media (max-width: 960px) {
  .pp-main { padding-block: 24px 64px; }
  .pp-head { margin-block-end: 32px; }
  .pp-card { padding: 24px 16px; }
  .pp-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .pp-actions { gap: 24px; flex-wrap: wrap; }
  /* סדר-המסך המובייל (2088:9365→9373→9381→9389): שם מלא · טלפון · דוא"ל · טלפון נוסף —
     זהה לסדר ה-DOM שלנו כבר (grid דסקטופ 2×2 R,L,R,L נקרא באותו סדר). */
  #addressGrid { display: flex; flex-direction: column; gap: 16px; }
  /* סדר-כתובת מובייל (2088:9489→9497→9505→9524): עיר · רחוב · מספר בית · קומה */
  #addressGrid .pp-field:nth-child(1) { order: 3; } /* רחוב */
  #addressGrid .pp-field:nth-child(2) { order: 4; } /* קומה */
  #addressGrid .pp-field:nth-child(3) { order: 1; } /* עיר */
  #addressGrid .pp-field:nth-child(4) { order: 2; } /* מספר בית */
}