/* HWzone Quotes — marked passages, chips, the sheet, the "על הקטע" block in the comment list (hwzone-quotes.php).
   Colors follow hwzone-article-page's tokens (--hwa-*) with fallbacks for pages without html.hw-new. */

/* ---------- the passage in the article ---------- */
.entry-content mark.hwq, mark.hwq { background: transparent; color: inherit; padding: 0 0 1px; margin: 0; border-bottom: 2px dotted rgba(127, 127, 127, .55); cursor: pointer; transition: background .15s; }
.entry-content .hwq-chip { min-height: 0; line-height: 1.5; text-transform: none; letter-spacing: normal; }
mark.hwq.hwq-q { border-bottom-color: var(--hwa-acc, #01adfe); }
mark.hwq.hwq-new { border-bottom-style: solid; border-bottom-color: var(--hwa-acc, #01adfe); background: var(--hwa-acc-soft, rgba(1, 173, 254, .14)); }
mark.hwq:hover, mark.hwq.hwq-on { background: var(--hwa-acc-soft, rgba(1, 173, 254, .14)); }
mark.hwq.hwq-flash { animation: hwq-flash 1.4s ease-out; }
@keyframes hwq-flash { 0%, 40% { background: rgba(1, 173, 254, .45); } 100% { background: transparent; } }

.hwq-chip { display: inline-flex; align-items: center; gap: 4px; vertical-align: baseline; margin-inline-start: 5px; padding: 1px 7px 1px 5px; border: 1px solid rgba(127, 127, 127, .45); border-radius: 999px; background: transparent; color: inherit; font: 600 12px/1.5 var(--hwa-ui, 'Assistant', 'Open Sans', system-ui, sans-serif); cursor: pointer; opacity: .85; white-space: nowrap; box-shadow: none; text-decoration: none; }
.hwq-chip svg { width: 12px; height: 12px; fill: currentColor; }
.hwq-chip-q { border-color: var(--hwa-acc, #01adfe); color: var(--hwa-acc, #01adfe); opacity: 1; }
.hwq-chip:hover { background: var(--hwa-acc-soft, rgba(1, 173, 254, .14)); opacity: 1; }

/* ---------- "הגב על הקטע" above a text selection (desktop) ---------- */
.hwq-selbtn { position: absolute; z-index: 2147482001; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 0; border-radius: 999px; background: #1f2328; color: #fff; font: 600 13px/1.2 var(--hwa-ui, 'Assistant', 'Open Sans', system-ui, sans-serif); box-shadow: 0 6px 20px rgba(0, 0, 0, .28); cursor: pointer; white-space: nowrap; }
.hwq-selbtn[hidden] { display: none; }
.hwq-selbtn svg { width: 14px; height: 14px; fill: currentColor; }
body[data-theme="dark"] .hwq-selbtn { background: #fff; color: #1f2328; }

/* ---------- the sheet: bottom sheet on phones / app, popover on desktop ---------- */
.hwq-bd { position: fixed; inset: 0; z-index: 2147482000; display: none; background: rgba(0, 0, 0, .45); }
.hwq-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147482001; display: none; box-sizing: border-box; max-height: 82vh; overflow: auto; direction: rtl; text-align: right; padding: 12px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 16px 16px 0 0; background: var(--hwa-card, #fff); color: var(--hwa-fg, #1f2328); box-shadow: 0 -8px 40px rgba(0, 0, 0, .25); font-family: var(--hwa-ui, 'Assistant', 'Open Sans', system-ui, sans-serif); }
body[data-theme="dark"] .hwq-sheet { background: var(--hwa-card, #1f2328); color: var(--hwa-fg, #fff); }
.hwq-sheet.hwq-open, .hwq-bd.hwq-open { display: block; }
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
    .hwq-bd { display: none !important; }
    .hwq-sheet { position: absolute; left: auto; right: auto; bottom: auto; width: min(460px, calc(100vw - 32px)); max-height: min(70vh, 640px); border-radius: 14px; border: 1px solid var(--hwa-line, #e1e5ea); box-shadow: 0 12px 40px rgba(0, 0, 0, .18); padding: 12px 16px 14px; }
    body[data-theme="dark"] .hwq-sheet { border-color: var(--hwa-line, #2e333a); }
}
.hwq-sh-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.hwq-sh-t { font-size: 12px; font-weight: 800; letter-spacing: .02em; color: var(--hwa-acc, #01adfe); }
.hwq-x { flex: none; width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 15px; line-height: 1; cursor: pointer; opacity: .7; box-shadow: none; padding: 0; }
.hwq-x:hover { opacity: 1; background: var(--hwa-card2, rgba(127, 127, 127, .12)); }
.hwq-sh-q { margin: 0 0 10px; padding: 4px 12px 4px 0; border-inline-start: 3px solid var(--hwa-acc, #01adfe); font-size: 14px; line-height: 1.5; font-style: italic; color: var(--hwa-mut2, #3f4652); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
body[data-theme="dark"] .hwq-sh-q { color: var(--hwa-mut2, #d6dadf); }
.hwq-sh-q::before { content: '“'; }
.hwq-sh-q::after { content: '”'; }
.hwq-sh-list { max-height: 38vh; overflow: auto; margin: 0 0 10px; }
.hwq-c { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--hwa-line, #e1e5ea); }
.hwq-c:first-child { border-top: 0; padding-top: 2px; }
body[data-theme="dark"] .hwq-c { border-color: var(--hwa-line, #2e333a); }
.hwq-c > img { width: 32px; height: 32px; border-radius: 50%; flex: none; object-fit: cover; margin: 0; }
.hwq-c-m { min-width: 0; flex: 1; }
.hwq-c-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 2px; }
.hwq-c-h b { font-size: 14px; font-weight: 700; }
.hwq-c-h time { font-size: 12px; color: var(--hwa-mut, #6b7280); }
.hwq-c-b { font-size: 15px; line-height: 1.5; overflow-wrap: anywhere; }
.hwq-c-b p { margin: 0 0 6px; }
.hwq-c-b p:last-child { margin-bottom: 0; }
.hwq-c-q .hwq-c-b { font-size: 16px; font-weight: 700; line-height: 1.4; }
.hwq-c-q .hwq-c-h b::after { content: 'שאלה לדיון'; margin-inline-start: 6px; padding: 1px 7px; border-radius: 999px; background: #0064c8; color: #fff; font-size: 11px; font-weight: 700; vertical-align: 1px; }
.hwq-sh-f textarea { display: block; width: 100%; box-sizing: border-box; min-height: 64px; padding: 10px 12px; border: 1px solid var(--hwa-line, #dddddd); border-radius: 10px; background: var(--hwa-card2, #f4f6f9); color: inherit; font: inherit; font-size: 15px; line-height: 1.5; resize: vertical; }
.hwq-sh-f textarea:focus { outline: 2px solid var(--hwa-acc, #01adfe); outline-offset: -1px; }
body[data-theme="dark"] .hwq-sh-f textarea { background: var(--hwa-card2, #272c33); border-color: var(--hwa-line, #2e333a); }
.hwq-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
@media (max-width: 1023px) { .hwq-row { padding-inline-end: 64px; } } /* clear of the accessibility widget's floating button */
.hwq-post { border: 0; border-radius: 8px; padding: 8px 18px; background: var(--hwa-acc, #01adfe); color: #fff; font: 700 15px/1.2 var(--hwa-ui, 'Assistant', system-ui, sans-serif); cursor: pointer; box-shadow: none; }
.hwq-post:disabled { opacity: .6; cursor: default; }
.hwq-st { font-size: 13px; color: var(--hwa-mut, #6b7280); }
.hwq-st.hwq-ok { color: #1a9c5b; }
.hwq-st a { color: var(--hwa-acc, #01adfe) !important; font-weight: 600; }
.hwq-hint { margin: 10px 0 8px; font-size: 14px; opacity: .8; }
.hwq-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.hwq-btn { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 8px; font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none !important; }
.hwq-btn-google { background: #fff; color: #1f1f1f !important; border: 1px solid #dadce0; }
.hwq-btn-facebook { background: #1877f2; color: #fff !important; }
.hwq-btn-apple { background: #000; color: #fff !important; }
.hwq-more { margin-top: 8px; font-size: 14px; }
.hwq-more a { color: var(--hwa-acc, #01adfe) !important; font-weight: 600; }

/* ---------- the quoted passage above a comment in the wpDiscuz list ---------- */
#wpdcom .hwq-cite { margin: 0 0 8px; }
#wpdcom .hwq-cite-link { display: flex; align-items: flex-start; gap: 8px; padding: 6px 10px; border-inline-start: 3px solid var(--hwa-acc, #01adfe); border-radius: 6px; background: var(--hwa-acc-soft, rgba(1, 173, 254, .1)); color: inherit !important; text-decoration: none !important; font-size: 14px; line-height: 1.45; }
#wpdcom .hwq-cite-lbl { flex: none; font: 700 12px/1.7 var(--hwa-ui, 'Assistant', system-ui, sans-serif); color: var(--hwa-acc, #01adfe); }
#wpdcom .hwq-cite q { quotes: '“' '”'; font-style: italic; opacity: .85; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#wpdcom .hwq-cite-link:hover q { opacity: 1; }
