/* تبويب "كلّم محامي" جوه نافذة الشات */
#hpfai-root .hpl-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 8px; background: var(--hpfai-surface); border-bottom: 1px solid var(--hpfai-border); }
#hpfai-root .hpl-tabs button {
  font: inherit; font-size: 14px; font-weight: 500; border: 0; cursor: pointer; padding: 9px 8px; border-radius: 10px;
  background: transparent; color: var(--hpfai-muted); display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  transition: background-color .2s ease, color .2s ease;
}
#hpfai-root .hpl-tabs button[aria-selected="true"] { background: var(--hpfai-brand); color: #fff; }
#hpfai-root .hpl-dot { width: 8px; height: 8px; border-radius: 50%; background: #e5484d; display: inline-block; }
#hpfai-root .hpl-dot[hidden] { display: none; }
#hpfai-root.hpl-unread .hpfai-fab::after { content: ""; position: absolute; top: 4px; inset-inline-end: 4px; width: 12px; height: 12px; border-radius: 50%; background: #e5484d; border: 2px solid #fff; }
#hpfai-root .hpfai-fab { position: relative; }

#hpfai-root .hpl-live { flex: 1; display: flex; flex-direction: column; min-height: 0; }
#hpfai-root .hpl-live[hidden] { display: none; }
#hpfai-root .hpl-status { margin: 0; padding: 8px 16px; display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--hpfai-muted); border-bottom: 1px solid var(--hpfai-border); }
#hpfai-root .hpl-led { width: 9px; height: 9px; border-radius: 50%; background: #c2a35a; flex: none; }
#hpfai-root .hpl-live.is-online .hpl-led { background: #2fae6a; box-shadow: 0 0 0 4px rgba(47, 174, 106, .18); }
#hpfai-root .hpl-body { flex: 1; display: flex; flex-direction: column; min-height: 0; }
#hpfai-root .hpl-thread { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
#hpfai-root .hpl-lawyer small { display: block; font-size: 12px; color: var(--hpfai-muted); margin-bottom: 2px; }
#hpfai-root .hpl-sys { align-self: center; margin: 4px 0; font-size: 12.5px; color: var(--hpfai-muted); text-align: center; background: var(--hpfai-surface); border: 1px dashed var(--hpfai-border); border-radius: 12px; padding: 6px 12px; max-width: 90%; }
#hpfai-root .hpfai-msg.is-sending { opacity: .6; }
#hpfai-root .hpfai-msg.is-failed { outline: 2px solid #e5484d; }

#hpfai-root .hpl-start { padding: 16px; display: grid; gap: 10px; overflow-y: auto; }
#hpfai-root .hpl-intro { margin: 0 0 4px; font-size: 14.5px; line-height: 1.7; color: var(--hpfai-text); }
#hpfai-root .hpl-start label { display: grid; gap: 4px; font-size: 13px; color: var(--hpfai-muted); }
#hpfai-root .hpl-start input, #hpfai-root .hpl-start textarea {
  font: inherit; font-size: 15px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--hpfai-border);
  background: var(--hpfai-surface); color: var(--hpfai-text); outline: none; resize: vertical;
}
#hpfai-root .hpl-start input:focus, #hpfai-root .hpl-start textarea:focus { border-color: var(--hpfai-brand); }
#hpfai-root .hpl-err { margin: 0; color: #d64545; font-size: 13px; }
#hpfai-root .hpl-err[hidden] { display: none; }
#hpfai-root .hpl-btn { font: inherit; font-weight: 600; border: 0; cursor: pointer; border-radius: 12px; min-height: 46px; background: var(--hpfai-brand); color: #fff; }
#hpfai-root .hpl-btn:disabled { opacity: .6; cursor: wait; }
#hpfai-root .hpl-wa {
  display: flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 12px 10px; font-size: 12.5px;
  color: #136c3e; font-weight: 500; text-decoration: none; min-height: 40px; background: var(--hpfai-surface); border-top: 1px solid var(--hpfai-border);
}
#hpfai-root .hpl-wa:hover { text-decoration: underline; }
html[data-theme="dark"] #hpfai-root .hpl-wa { color: #5fd08e; }
html[data-theme="dark"] #hpfai-root .hpl-tabs button[aria-selected="true"] { background: #2a7479; }

/* أجزاء المساعد الذكي بتتخفي لما تبويب المحامي يتفتح (عندها display مكتوب صريح) */
#hpfai-root .hpfai-panel > [hidden] { display: none !important; }
/* الوضع الغامق: دهبي على زيتي (هوية المكتب) */
html[data-theme="dark"] #hpfai-root .hpl-tabs button[aria-selected="true"],
html[data-theme="dark"] #hpfai-root .hpl-btn { background: #d5b167; color: #12292e; }

/* تنبيه: المحادثة اللي فاتت اتقفلت */
#hpfai-root .hpl-ended { margin: 0 0 10px; padding: 10px 12px; border-radius: 12px; background: var(--hpfai-surface); border: 1px dashed var(--hpfai-accent); color: var(--hpfai-text); font-size: 13.5px; line-height: 1.6; }

/* نموذج صفحة "تواصل معنا" (نفس "كلّم محامي") — بياخد شكل نماذج الموقع من design.css */
.hpl-page .hpl-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hpl-page .hpl-opt { font-weight: 400; color: var(--hp-muted, #586668); font-size: 13px; }
.hpl-page .hpl-page-note { margin: 0 0 14px; font-size: 14px; line-height: 1.8; color: var(--hp-muted, #586668); }
.hpl-page .hpl-page-err { margin: 0 0 12px; padding: 10px 14px; border-radius: 12px; background: #fdecea; color: #b42318; font-size: 14px; }
.hpl-page .hpl-page-err[hidden], .hpl-page [hidden] { display: none !important; }
.hpl-page button[type=submit]:disabled { opacity: .6; cursor: wait; }
.hpl-page .hpl-page-done { padding: 24px !important; outline: none; }
.hpl-page .hpl-page-done strong { display: block; font-size: 19px; margin-bottom: 6px; color: var(--hp-ink, #17353c); }
.hpl-page .hpl-page-done strong::before { content: "✓"; display: inline-grid; place-items: center; width: 30px; height: 30px; margin-inline-end: 10px; border-radius: 50%; background: #2fae6a; color: #fff; font-size: 16px; vertical-align: middle; }
.hpl-page .hpl-page-done p { margin: 0 0 12px; line-height: 1.8; }
.hpl-page .hpl-page-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 0 !important; }
.hpl-page .hpl-page-actions button { font: inherit; font-size: 15px; min-height: 46px; padding: 0 22px; border-radius: 999px; cursor: pointer; border: 1px solid var(--hp-btn, #17353c); background: transparent; color: var(--hp-ink, #17353c); }
.hpl-page .hpl-page-actions .hpl-page-open { background: var(--hp-btn, #17353c); color: var(--hp-btn-ink, #fff); }
html[data-theme="dark"] .hpl-page .hpl-page-err { background: #3a1d1b; color: #ff8a80; }