/* ============================================================
   Edix Portal - פורטל לקוחות ופורטל סוכנים
   אותה שפת עיצוב כמו האתר: הטוקנים מגיעים מ-tokens.css, הכרום
   נסוג (שטוח עם hairline, בלי צללים), מבטא יחיד וגלולות לפעולות.
   ה-aliases של --p-* נשמרים כדי שהמחלקות הקיימות לא ישתנו.
   ============================================================ */

:root {
  --p-page: var(--panel-2);
  --p-shell: var(--pearl);
  --p-panel: var(--panel);
  --p-sub: var(--pearl);
  --p-border: var(--border);
  --p-text: var(--text);
  --p-text-2: var(--muted-80);
  --p-muted: var(--muted);
  --p-micro: var(--muted);
  --p-action: var(--text);
  --p-ok: var(--success);
  --p-warn: var(--warning);
  --p-risk: var(--danger);
  --p-data: var(--accent-ink);
  --p-brand: var(--accent-ink);
  --p-r: var(--r-lg);
  --p-r-sm: var(--r-md);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { overflow-x: clip; }
body {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.47;
  letter-spacing: -0.02em;
  color: var(--p-text);
  background: var(--p-page);
  -webkit-font-smoothing: antialiased;
}
b, strong, h1, h2, h3 { font-weight: 600; }
a { color: var(--p-brand); text-decoration: none; }
img { max-width: 100%; }

/* ---------- App shell: sidebar (ימין ב-RTL) + workspace ---------- */
.pshell {
  display: grid;
  grid-template-columns: 256px 1fr;
  min-height: 100dvh;
  background: var(--p-shell);
  border-inline: 1px solid var(--p-border);
  max-width: 1560px;
  margin: 0 auto;
}

/* ---------- Sidebar ---------- */
.psidebar {
  border-inline-end: 1px solid var(--p-border);
  background: var(--p-shell);
  padding: 18px 12px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.pbrand { display: flex; align-items: center; gap: 9px; padding: 2px 6px; }
.pbrand-chip {
  width: 26px; height: 26px; border-radius: var(--r-sm); flex: none;
  background: var(--p-action); color: #fff;
  display: grid; place-items: center;
  font-size: 13px; font-weight: 600;
}
.pbrand-name { font-size: 15px; font-weight: 600; line-height: 1.2; }
.pbrand-sub { font-size: 12px; color: var(--p-muted); line-height: 1.2; }

.pmicro {
  font-size: 12px; font-weight: 600; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--p-micro);
  padding: 0 8px; margin-bottom: 4px;
}
.pnav { display: flex; flex-direction: column; gap: 2px; }
.pnav a {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 15px; color: var(--p-text-2);
  padding: 9px 12px; border-radius: var(--p-r-sm);
  border: 1px solid transparent;
  transition: background 0.15s, color 0.15s;
}
.pnav a:hover { background: var(--accent-tint); color: var(--p-text); }
.pnav a.active {
  background: var(--p-panel); color: var(--p-text);
  border-color: var(--p-border); font-weight: 600;
  box-shadow: inset 3px 0 0 var(--accent-ink);
}
.pnav .pcount { font-size: 13px; color: var(--p-micro); }

.psidebar-card {
  margin-top: auto;
  background: var(--p-panel);
  border: 1px solid var(--p-border);
  border-radius: var(--p-r);
  padding: 14px;
}
.psidebar-card b { display: block; font-size: 15px; margin-bottom: 5px; }
.psidebar-card p { font-size: 14px; color: var(--p-muted); line-height: 1.43; margin-bottom: 11px; }

/* ---------- Workspace ---------- */
.pwork { display: flex; flex-direction: column; min-width: 0; }
.ptop {
  height: 56px; flex: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 18px;
  border-bottom: 1px solid var(--p-border);
  background: var(--p-shell);
}
.pcrumb { font-size: 14px; color: var(--p-muted); }
.pcrumb b { color: var(--p-text); font-weight: 600; }
.ptop-actions { display: flex; gap: 8px; align-items: center; }
.pmain { padding: 20px 18px; display: flex; flex-direction: column; gap: 18px; }

.ptitle { font-size: 21px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.19; }
.psubtitle { font-size: 14px; color: var(--p-muted); margin-top: 4px; max-width: 640px; line-height: 1.43; }

/* ---------- Buttons - גלולה לפעולה, שטוח, בלי צל ---------- */
.pbtn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 38px; padding: 0 18px;
  font-family: inherit; font-size: 14px; font-weight: 600;
  letter-spacing: -0.224px;
  border-radius: var(--r-pill); cursor: pointer; text-decoration: none;
  background: var(--p-panel); color: var(--p-text);
  border: 1px solid var(--p-border);
  transition: background 0.15s, border-color 0.15s, transform 0.1s;
  white-space: nowrap;
}
.pbtn:hover { border-color: #c8c8cd; background: var(--p-sub); }
.pbtn:active { transform: scale(0.95); }
.pbtn:focus-visible { outline: 2px solid var(--accent-focus); outline-offset: 2px; }
.pbtn-primary { background: var(--accent-ink); color: #fff; border-color: var(--accent-ink); }
.pbtn-primary:hover { background: #095c89; border-color: #095c89; }
.pbtn-sm { height: 32px; padding: 0 14px; font-size: 13px; }
.pbtn-block { width: 100%; }

/* ---------- Cards / panels - שטוח עם hairline ---------- */
.pcard {
  background: var(--p-panel);
  border: 1px solid var(--p-border);
  border-radius: var(--p-r);
  padding: 20px;
}
.pcard-title { font-size: 17px; font-weight: 600; letter-spacing: -0.374px; }
.pcard-help { font-size: 14px; color: var(--p-muted); margin-top: 3px; margin-bottom: 14px; line-height: 1.43; }
.psub-surface {
  background: var(--p-sub);
  border: 1px solid var(--p-border);
  border-radius: var(--p-r-sm);
  padding: 14px;
}

/* ---------- KPI strip ---------- */
.pkpis {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  background: var(--p-panel);
  border: 1px solid var(--p-border);
  border-radius: var(--p-r);
  overflow: hidden;
}
.pkpi {
  min-height: 112px;
  padding: 18px;
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
}
.pkpi + .pkpi { border-inline-start: 1px solid var(--p-border); }
.pkpi .pmicro { padding: 0; margin: 0; }
.pkpi-value { font-size: 28px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.14; }
.pkpi-help { font-size: 14px; color: var(--p-muted); }

/* ---------- Badges ---------- */
.pbadge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 13px; font-weight: 600;
  padding: 3px 11px; border-radius: var(--r-pill);
  background: var(--p-sub); color: var(--p-text-2);
  border: 1px solid var(--p-border);
  white-space: nowrap;
}
.pbadge-ok { color: var(--p-ok); background: rgba(26, 137, 23, 0.07); border-color: rgba(26, 137, 23, 0.25); }
.pbadge-warn { color: var(--p-warn); background: rgba(180, 83, 9, 0.07); border-color: rgba(180, 83, 9, 0.28); }
.pbadge-risk { color: var(--p-risk); background: rgba(215, 0, 21, 0.06); border-color: rgba(215, 0, 21, 0.25); }
.pbadge-data { color: var(--accent-ink); background: var(--accent-tint); border-color: rgba(11, 111, 164, 0.3); }

/* ---------- Rows / tables ---------- */
.prow {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 2px;
  border-bottom: 1px solid var(--p-border);
  font-size: 15px;
}
.prow:last-child { border-bottom: none; }
.prow-sub { font-size: 14px; color: var(--p-muted); margin-top: 2px; }

.ptable { width: 100%; border-collapse: collapse; font-size: 14px; }
.ptable th {
  text-align: start; font-size: 12px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--p-micro);
  padding: 9px 10px; border-bottom: 1px solid var(--p-border);
  white-space: nowrap;
}
.ptable td { padding: 11px 10px; border-bottom: 1px solid var(--p-border); vertical-align: top; }
.ptable tr:last-child td { border-bottom: none; }
.ptable .tsub { font-size: 13px; color: var(--p-muted); margin-top: 2px; }

/* ---------- Forms ---------- */
.plabel { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.pinput {
  width: 100%;
  font-family: inherit; font-size: 17px; color: var(--p-text);
  background: var(--p-panel);
  border: 1px solid var(--p-border);
  border-radius: var(--p-r-sm);
  padding: 10px 14px;
  outline: none;
  transition: border-color 0.15s;
}
.pinput:focus { border-color: var(--accent-ink); }
textarea.pinput { min-height: 84px; resize: vertical; }

/* ---------- Progress ---------- */
.pprogress { background: var(--p-border); border-radius: var(--r-pill); height: 6px; overflow: hidden; }
.pprogress > div { background: var(--accent-ink); height: 6px; border-radius: var(--r-pill); }
.pkpi-hero { background: var(--accent-ink); }
.pkpi-hero .pmicro { color: rgba(255, 255, 255, 0.85); }
.pkpi-hero .pkpi-value { color: #fff; }
.pkpi-hero .pkpi-help { color: rgba(255, 255, 255, 0.8); }
.pprogress-row { display: flex; align-items: center; justify-content: space-between; font-size: 14px; margin-bottom: 5px; }
.pprogress-row b { font-weight: 600; }

/* ---------- Flash / notices ---------- */
.pflash { border-radius: var(--p-r-sm); padding: 12px 16px; font-size: 15px; border: 1px solid; }
.pflash-ok { color: var(--p-ok); background: rgba(26, 137, 23, 0.06); border-color: rgba(26, 137, 23, 0.25); }
.pflash-err { color: var(--p-risk); background: rgba(215, 0, 21, 0.05); border-color: rgba(215, 0, 21, 0.25); }

/* ---------- Grid helpers ---------- */
.pgrid { display: grid; gap: 18px; }
.pgrid-main { grid-template-columns: 1.85fr 0.95fr; align-items: start; }
.pgrid-2 { grid-template-columns: 1fr 1fr; }

/* ---------- Login (עמוד נקי בלי sidebar) ---------- */
.plogin {
  min-height: 100dvh; display: grid; place-items: center;
  background: var(--p-page); padding: 24px;
}
.plogin-card {
  width: 100%; max-width: 400px;
  background: var(--p-panel); border: 1px solid var(--p-border);
  border-radius: var(--p-r);
  padding: 32px;
}

/* ---------- Mobile ---------- */
@media (max-width: 860px) {
  .pshell { grid-template-columns: 1fr; border-inline: none; }
  .psidebar {
    flex-direction: row; align-items: center; gap: 10px;
    padding: 10px 12px;
    border-inline-end: none; border-bottom: 1px solid var(--p-border);
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .psidebar .pmicro, .psidebar-card { display: none; }
  /* ברצועה האופקית: לוגו נקי בלבד - שורת המשנה נחתכת שם */
  .pbrand-sub { display: none; }
  .pbrand { flex: none; padding: 0; }
  .pbrand img { height: 20px !important; width: auto; }
  .pnav { flex-direction: row; gap: 4px; }
  .pnav a { white-space: nowrap; padding: 8px 13px; }
  /* מטרות מגע 44px במובייל */
  .pbtn { height: 44px; padding: 0 20px; }
  .pbtn-sm { height: 38px; padding: 0 16px; }
  .pkpis { grid-auto-flow: row; grid-template-columns: 1fr 1fr; }
  .pkpi { min-height: 96px; padding: 16px; }
  .pkpi + .pkpi { border-inline-start: none; }
  .pkpi:nth-child(even) { border-inline-start: 1px solid var(--p-border); }
  .pkpi:nth-child(n+3) { border-top: 1px solid var(--p-border); }
  .pgrid-main, .pgrid-2 { grid-template-columns: 1fr; }
  .ptop { padding: 0 14px; }
  .pmain { padding: 16px 14px; gap: 14px; }
  input, textarea, select { font-size: 16px !important; }
  .ptable-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---------- Intake fill (agents) ---------- */
.pintake-h { font-size: 14px; font-weight: 600; color: var(--p-micro); letter-spacing: 0.04em; border-top: 1px solid var(--p-border); padding-top: 18px; margin: 22px 0 2px; }
form .pintake-h:first-child { border-top: none; padding-top: 0; margin-top: 0; }
.pchecks { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 2px 16px; }
.pcheck { display: flex; align-items: center; gap: 9px; font-size: 15px; padding: 5px 0; cursor: pointer; }
.pcheck input { accent-color: var(--accent-ink); width: 17px; height: 17px; flex: none; }

/* ---------- חלון פרטי שירות (מחירון הסוכנים) ---------- */
.ptable tr[data-svc] { cursor: pointer; }
.ptable tr[data-svc]:hover td { background: var(--p-sub); }
.svc-link { color: inherit; }
.svc-link:hover b { color: var(--p-brand); }

/* המודאל הוא הצף הפונקציונלי היחיד שמקבל צל - לא היררכיית UI */
.pmodal { border: 1px solid var(--p-border); border-radius: var(--p-r); background: var(--p-panel);
  box-shadow: var(--shadow-float); padding: 0; width: min(640px, calc(100vw - 32px)); }
.pmodal::backdrop { background: rgba(29, 29, 31, 0.45); }
.pmodal-frame { position: relative; padding: 24px; overflow-y: auto; max-height: 88vh; }
.pmodal-close { position: absolute; top: 16px; inset-inline-end: 16px; }
.pmodal-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; padding-inline-end: 44px; }
.pmodal-price { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: baseline; margin-top: 14px;
  padding: 12px 14px; background: var(--p-sub); border: 1px solid var(--p-border); border-radius: var(--p-r-sm); font-size: 15px; }
.pmodal-comm { color: var(--p-ok); font-weight: 600; }
.pmodal-sec { margin-top: 18px; border-top: 1px solid var(--p-border); padding-top: 14px; }
.pmodal-sec h3 { font-size: 15px; font-weight: 600; margin: 0 0 9px; }
.pmodal-sec-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pmodal-pitch { background: var(--p-sub); border-radius: var(--p-r-sm); padding: 12px 14px; font-size: 15px; line-height: 1.6; color: var(--p-text-2); margin: 0; }
.pmodal-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 7px; font-size: 15px; color: var(--p-text-2); }
.pmodal-phase { margin-top: 9px; font-size: 15px; }
.pmodal-phase ul { list-style: none; padding: 0; margin: 5px 0 0; display: grid; gap: 5px; color: var(--p-text-2); }
.pmodal-when { display: inline-block; min-width: 56px; font-size: 13px; color: var(--p-micro); }
.pmodal-q { font-weight: 600; font-size: 15px; margin: 12px 0 3px; }
.pmodal-a { font-size: 14px; color: var(--p-text-2); line-height: 1.6; margin: 0 0 7px; }
.pmodal-foot { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 20px; }

@media (max-width: 720px) {
  .pmodal { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0; border: none; border-radius: 0; }
  .pmodal-frame { max-height: 100dvh; padding: 20px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}
