/* Haide Matcher widget styles (hm- prefix). Independent of Haide Chat. */
.hm-root, .hm-root * { box-sizing: border-box; }
.hm-root {
	--hm-primary: #111418;
	--hm-accent: #f332f3;
	--hm-accent-bright: #f55ef5;
	--hm-text: #1f2328;
	--hm-muted: #6b7280;
	--hm-border: rgba(243,50,243,0.22);
	--hm-soft: rgba(243,50,243,0.06);
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; direction: rtl;
}
.hm-root, .hm-root * { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

/* FAB (positioned left by default; PHP inline CSS forces the side) */
.hm-fab {
	position: fixed !important; left: 20px; bottom: calc(20px + env(safe-area-inset-bottom,0px));
	z-index: 2147482900; width: 58px; height: 58px; border: none; border-radius: 999px;
	background: var(--hm-accent); color: #fff; cursor: pointer; box-shadow: 0 10px 25px rgba(0,0,0,.22);
	display: flex; align-items: center; justify-content: center; overflow: hidden;
	transition: transform .15s ease, background .15s ease;
}
.hm-fab:hover { background: var(--hm-accent-bright); transform: scale(1.07); }
.hm-fab:active { transform: scale(.95); }
.hm-fab.hm-open { background: #2a2a2a; }
.hm-fab svg { width: 27px; height: 27px; fill: currentColor; }
.hm-fab-logo { width: 100%; height: 100%; object-fit: contain; padding: 7px; display: block; }
.hm-fab:not(.hm-open)::after { content:''; position:absolute; inset:0; border-radius:999px; border:3px solid var(--hm-accent); opacity:.6; animation: hm-ring 1.8s ease-out infinite; pointer-events:none; }
.hm-fab:not(.hm-open)::before { content:''; position:absolute; inset:0; border-radius:999px; border:3px solid var(--hm-accent); opacity:.6; animation: hm-ring 1.8s ease-out infinite; animation-delay:.9s; pointer-events:none; }
@keyframes hm-ring { 0%{transform:scale(1);opacity:.6;} 100%{transform:scale(1.85);opacity:0;} }
.hm-fab-online { position:absolute; top:4px; right:4px; width:15px; height:15px; border-radius:999px; background:#34c759; border:2.5px solid #fff; }
.hm-fab.hm-open .hm-fab-online { display:none; }
.hm-fab-label {
	position: fixed !important; left: 92px; bottom: calc(108px + env(safe-area-inset-bottom,0px));
	z-index: 2147482899; background:#fff; color: var(--hm-primary); padding:11px 16px; border-radius:14px;
	font-size:15px; font-weight:700; box-shadow:0 8px 22px rgba(0,0,0,.20); white-space:nowrap;
	pointer-events:none; opacity:0; transform: translateY(6px); transition: opacity .3s ease, transform .3s ease;
	border:1.5px solid var(--hm-accent);
}
.hm-fab-label.hm-show { opacity:1; transform: translateY(0); animation: hm-bob 1.6s ease-in-out infinite; }
.hm-fab-label::after { content:''; position:absolute; bottom:-7px; left:22px; width:12px; height:12px; background:#fff; border-right:1.5px solid var(--hm-accent); border-bottom:1.5px solid var(--hm-accent); transform:rotate(45deg); }
@keyframes hm-bob { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-5px);} }

/* Panel */
.hm-panel {
	position: fixed !important; left: 20px; bottom: calc(88px + env(safe-area-inset-bottom,0px));
	z-index: 2147482900; width: 380px; max-width: calc(100vw - 24px); max-height: 75vh;
	background:#fff; color: var(--hm-text); border:1px solid var(--hm-border); border-radius:18px;
	box-shadow:0 24px 60px rgba(0,0,0,.28); display:flex; flex-direction:column; overflow:hidden;
	animation: hm-pop .18s ease-out;
}
@keyframes hm-pop { from{opacity:0;transform:translateY(10px) scale(.98);} to{opacity:1;transform:translateY(0) scale(1);} }
@media (max-width:480px){ .hm-panel{ left:12px !important; right:12px !important; width:auto !important; max-height:80vh; } }

/* Header */
.hm-header { background: var(--hm-primary); color:#fff; padding:12px 14px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.hm-identity { display:flex; align-items:center; gap:8px; min-width:0; }
.hm-avatar { width:38px; height:38px; border-radius:999px; background:rgba(255,255,255,.16); display:flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden; }
.hm-avatar svg { width:18px; height:18px; fill:#fff; }
.hm-avatar-logo { width:100%; height:100%; object-fit:contain; padding:4px; display:block; }
.hm-title { font-weight:700; font-size:14px; line-height:1.2; }
.hm-status { font-size:11px; opacity:.85; display:flex; align-items:center; gap:5px; }
.hm-dot { width:7px; height:7px; border-radius:999px; background:#36d399; display:inline-block; }
.hm-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.hm-iconbtn { width:32px; height:32px; border:none; border-radius:999px; background:rgba(255,255,255,.2); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; text-decoration:none; }
.hm-iconbtn:hover { background:rgba(255,255,255,.4); }
.hm-iconbtn svg { width:16px; height:16px; fill:#fff; }

/* Messages */
.hm-messages { flex:1; overflow-y:auto; padding:14px 12px; display:flex; flex-direction:column; gap:10px; background: var(--hm-soft); }
.hm-bubble { max-width:90%; font-size:14px; line-height:1.5; white-space:pre-wrap; word-wrap:break-word; padding:10px 12px; border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.06); }
.hm-bot { background:#fff; color:var(--hm-text); border:1px solid var(--hm-border); border-top-left-radius:4px; align-self:flex-start; }
.hm-user { background:var(--hm-accent); color:#fff; border-top-right-radius:4px; align-self:flex-end; }
.hm-typing { display:inline-flex; gap:3px; padding:2px 0; }
.hm-typing span { width:6px; height:6px; border-radius:999px; background:var(--hm-muted); animation: hm-blink 1.2s infinite both; }
.hm-typing span:nth-child(2){ animation-delay:.2s; } .hm-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes hm-blink { 0%,80%,100%{opacity:.25;} 40%{opacity:1;} }

/* Opener card */
.hm-card { background:#fff; border:1px solid var(--hm-border); border-radius:14px; overflow:hidden; align-self:flex-start; max-width:92%; }
.hm-hero { height:104px; background:#FBEAF0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
.hm-hero svg { width:32px; height:32px; fill:#C2138F; }
.hm-hero-logo { max-height:62px; max-width:70%; object-fit:contain; }
.hm-hero-tag { font-size:12.5px; font-weight:600; color:#C2138F; }
.hm-card-body { padding:11px 13px; }
.hm-card-title { font-size:14px; font-weight:600; line-height:1.45; }
.hm-card-sub { font-size:12px; color:var(--hm-muted); margin-top:5px; }

/* Action buttons (opener) */
.hm-btnstack { display:flex; flex-direction:column; gap:7px; align-self:stretch; }
.hm-actionbtn { width:100%; text-align:right; border:0.5px solid var(--hm-border); background:#fff; border-radius:10px; padding:12px 14px; font-size:14px; color:var(--hm-text); cursor:pointer; }
.hm-actionbtn:hover { background:var(--hm-soft); }
.hm-actionbtn-primary { border-color:var(--hm-accent); border-width:1.5px; font-weight:600; }

/* Chips */
.hm-chips { display:flex; flex-wrap:wrap; gap:6px; align-self:flex-start; max-width:96%; }
.hm-chip { font-size:12.5px; padding:7px 12px; background:#fff; color:var(--hm-primary); border:1px solid var(--hm-border); border-radius:999px; cursor:pointer; }
.hm-chip:hover { background:var(--hm-accent); color:#fff; border-color:var(--hm-accent); }
.hm-chip-primary { background:var(--hm-accent); color:#fff; border-color:var(--hm-accent); font-weight:600; }

/* Job cards */
.hm-jobs { display:flex; flex-direction:column; gap:8px; align-self:stretch; }
.hm-job { display:flex; gap:10px; align-items:center; background:#fff; border:1px solid var(--hm-border); border-radius:12px; padding:8px; text-decoration:none; color:var(--hm-text); box-shadow:0 1px 2px rgba(0,0,0,.05); }
.hm-job:hover { box-shadow:0 6px 16px rgba(0,0,0,.12); transform:translateY(-1px); }
.hm-job-img { width:54px; height:54px; border-radius:9px; object-fit:contain; flex-shrink:0; background:#fff; border:1px solid var(--hm-border); padding:4px; }
.hm-job-noimg { display:flex; align-items:center; justify-content:center; background:var(--hm-soft); }
.hm-job-noimg svg { width:22px; height:22px; fill:#C2138F; }
.hm-job-body { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.hm-job-name { font-size:13px; font-weight:700; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hm-job-meta { font-size:12px; color:var(--hm-muted); line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hm-job-link { font-size:11.5px; color:var(--hm-primary); font-weight:700; margin-top:2px; }

/* Composer */
.hm-form { border-top:1px solid var(--hm-border); background:#fff; padding:8px 10px; display:flex; gap:8px; align-items:flex-end; }
.hm-input { flex:1; resize:none; font-family:inherit; font-size:14px; line-height:1.4; max-height:96px; padding:9px 11px; border:1px solid var(--hm-border); border-radius:10px; background:#fff; color:var(--hm-text); outline:none; }
.hm-input:focus { box-shadow:0 0 0 3px var(--hm-soft); border-color:var(--hm-accent); }
.hm-send { width:40px; height:40px; border:none; border-radius:10px; background:var(--hm-accent); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.hm-send:hover { background:var(--hm-accent-bright); }
.hm-send svg { width:18px; height:18px; fill:#fff; transform:scaleX(-1); }
.hm-disclaimer { text-align:center; font-size:10px; color:var(--hm-muted); padding:4px 8px 8px; }

.hm-hidden { display:none !important; }