/* HalalVerified Tasks — uses the HalalVerified theme's tokens when present; works with any theme. */
.hvt { --t-primary: var(--hv-primary, #1f7a3f); --t-ink: var(--hv-ink, #1d2327); --t-muted: var(--hv-muted, #5f6b6d); --t-line: var(--hv-line, #e2e6e8); --t-card: var(--hv-card, #fff); --t-radius: var(--hv-radius, 12px); color: var(--t-ink); }
.hvt * { box-sizing: border-box; }
.hvt [hidden] { display: none !important; }
.hvt img { max-width: 100%; height: auto; }
.hvt-lead { font-size: 1.05rem; color: var(--t-muted); }
.hvt-muted, .hvt small { color: var(--t-muted); }
.hvt-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.hvt-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 10px 18px; border-radius: 999px; border: 2px solid var(--t-primary); font-weight: 600; text-decoration: none; cursor: pointer; font-size: 1rem; line-height: 1.2; }
.hvt-btn--primary { background: var(--t-primary); color: #fff; }
.hvt-btn--primary:hover, .hvt-btn--primary:focus { filter: brightness(.92); color: #fff; }
.hvt-btn--ghost { background: transparent; color: var(--t-primary); }
.hvt-btn.hvt-danger { border-color: #b32d2e; color: #b32d2e; }
.hvt-linkbtn { background: none; border: 0; padding: 0; color: var(--t-primary); text-decoration: underline; cursor: pointer; font: inherit; }
.hvt a:focus-visible, .hvt button:focus-visible, .hvt input:focus-visible, .hvt select:focus-visible, .hvt textarea:focus-visible, .hvt summary:focus-visible { outline: 3px solid var(--t-primary); outline-offset: 2px; }
.hvt-notice { padding: 12px 14px; border-radius: 10px; margin: 12px 0; background: #eef5ff; border-inline-start: 4px solid #2c6ecb; }
.hvt-notice.is-success { background: #e9f6ee; border-color: #1f9a45; }
.hvt-notice.is-error { background: #fdeceb; border-color: #d63638; }
.hvt-notice ul { margin: 6px 0 0 1.2em; }
.hvt-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.hvt-badge { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .78rem; font-weight: 600; background: #f0f2f3; color: var(--t-ink); cursor: help; }
.hvt-badge--identity, .hvt-badge--abn { background: #e8f0fb; color: #1d4f91; }
.hvt-badge--licence, .hvt-badge--insurance, .hvt-badge--wwcc { background: #e3f4e8; color: #0b4d2c; }
.hvt-badge--muslim_owned { background: #f4efe1; color: #5b4300; }
.hvt-count { display: inline-block; min-width: 20px; padding: 0 6px; border-radius: 10px; background: #d63638; color: #fff; font-size: .75rem; text-align: center; }
.hvt-status { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; background: #f0f2f3; white-space: nowrap; }
.hvt-status--open, .hvt-status--confirmed, .hvt-status--approved, .hvt-status--active, .hvt-status--accepted { background: #e3f4e8; color: #0b4d2c; }
.hvt-status--pending, .hvt-status--pending_payment, .hvt-status--done, .hvt-status--declared, .hvt-status--incomplete { background: #fcf0d6; color: #7a4700; }
.hvt-status--assigned, .hvt-status--in_progress { background: #e8f0fb; color: #1d4f91; }
.hvt-status--disputed, .hvt-status--rejected, .hvt-status--revoked, .hvt-status--suspended { background: #fdeceb; color: #8a1f1f; }
.hvt-status--completed { background: #1f7a3f; color: #fff; }
/* Forms */
.hvt-form { margin: 12px 0; max-width: 760px; }
.hvt-field { margin: 0 0 14px; display: flex; flex-direction: column; gap: 4px; }
.hvt-field > label, .hvt-field > legend { font-weight: 600; }
.hvt input[type=text], .hvt input:not([type]), .hvt input[type=email], .hvt input[type=password], .hvt input[type=number], .hvt input[type=search], .hvt input[type=date], .hvt select, .hvt textarea { width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid #c3c8cc; border-radius: 10px; font: inherit; font-size: 16px; background: #fff; color: inherit; }
.hvt textarea { min-height: 70px; }
.hvt fieldset { border: 1px solid var(--t-line); border-radius: var(--t-radius); padding: 14px 16px; margin: 0 0 16px; min-width: 0; }
.hvt legend { font-weight: 700; padding: 0 6px; }
.hvt label { display: block; margin: 4px 0; }
.hvt-check { display: block; margin: 8px 0; }
.hvt-check input, .hvt-checks input, .hvt-pill input, .hvt-type input { width: auto; min-height: 0; margin-inline-end: 6px; }
.hvt-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 2px 16px; }
.hvt-grid2 { display: grid; grid-template-columns: 1fr; gap: 0 16px; }
@media (min-width: 700px) { .hvt-grid2 { grid-template-columns: 1fr 1fr; } }
.hvt-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0; }
.hvt-pill { display: inline-flex !important; align-items: center; padding: 6px 12px; border: 1px solid var(--t-line); border-radius: 999px; min-height: 40px; cursor: pointer; }
.hvt-pill:has(input:checked) { border-color: var(--t-primary); background: #f0f8f2; }
.hvt-inline { display: inline; }
.hvt-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.hvt-types { display: grid; gap: 8px; }
.hvt-type { border: 1px solid var(--t-line); border-radius: var(--t-radius); padding: 12px 14px; cursor: pointer; }
.hvt-type:has(input:checked) { border-color: var(--t-primary); background: #f0f8f2; }
.hvt-type small { display: block; margin: 2px 0 0 26px; }
.hvt-thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.hvt-thumbs label { width: 110px; }
.hvt-private { background: #fafbfb; }
/* Browse */
.hvt-browse-head, .hvt-sechead { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.hvt-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px; background: var(--t-card); border: 1px solid var(--t-line); border-radius: var(--t-radius); margin: 14px 0; }
.hvt-filters > input[type=search] { flex: 2 1 220px; width: auto; }
.hvt-filters > select { flex: 1 1 150px; width: auto; }
.hvt-filters .hvt-pc { flex: 0 1 110px; width: auto; }
.hvt-filters label { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.hvt-filters label select { width: auto; }
.hvt-list, .hvt-cards { display: grid; gap: 10px; }
.hvt-cards { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.hvt-card { display: flex; gap: 12px; padding: 14px 16px; background: var(--t-card); border: 1px solid var(--t-line); border-radius: var(--t-radius); text-decoration: none; color: inherit; }
.hvt-card:hover { border-color: var(--t-primary); }
.hvt-card small { display: block; }
.hvt-tcard { justify-content: space-between; }
.hvt-tcard-main { min-width: 0; }
.hvt-tcard-main strong { display: block; font-size: 1.05rem; overflow-wrap: anywhere; }
.hvt-tcard-side { text-align: end; flex: 0 0 auto; }
.hvt-tcard-side b { font-size: 1.15rem; }
.hvt-pager { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0; }
.hvt-pager a, .hvt-pager span { padding: 6px 12px; border: 1px solid var(--t-line); border-radius: 8px; text-decoration: none; }
.hvt-pager span { background: var(--t-primary); color: #fff; }
/* Task page */
.hvt-crumbs { margin: 0 0 8px; }
.hvt-thead { display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: flex-start; }
.hvt-thead h2 { margin: 6px 0 4px; overflow-wrap: anywhere; }
.hvt-budget { text-align: end; }
.hvt-budget small { display: block; }
.hvt-budget b { font-size: 1.6rem; }
.hvt-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin: 14px 0; padding: 0; }
.hvt-facts div { background: var(--t-card); border: 1px solid var(--t-line); border-radius: 10px; padding: 10px 12px; }
.hvt-facts dt { font-size: .8rem; color: var(--t-muted); }
.hvt-facts dd { margin: 0; font-weight: 600; }
.hvt-desc { overflow-wrap: anywhere; }
.hvt-photos { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.hvt-photos img { width: 160px; height: 120px; object-fit: cover; border-radius: 8px; }
.hvt-req { padding: 10px 12px; background: #f4f7f5; border-radius: 10px; }
.hvt-panel { background: var(--t-card); border: 1px solid var(--t-line); border-radius: var(--t-radius); padding: 16px; margin: 16px 0; }
.hvt-panel h3 { margin-top: 0; }
.hvt-bids { display: grid; gap: 12px; }
.hvt-bid { border: 1px solid var(--t-line); border-radius: var(--t-radius); padding: 14px; }
.hvt-bid header { display: flex; gap: 10px; align-items: flex-start; }
.hvt-bid header > div { flex: 1; min-width: 0; }
.hvt-bid header small { display: block; }
.hvt-bid-amt { font-size: 1.3rem; }
.hvt-bid p { overflow-wrap: anywhere; }
.hvt-avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.hvt-avatar--initial { display: inline-flex; align-items: center; justify-content: center; background: #e3f4e8; color: var(--t-primary); font-weight: 700; font-size: 1.2rem; }
.hvt-person { display: flex; align-items: center; gap: 10px; }
.hvt-phead { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.hvt-phead .hvt-avatar { width: 96px; height: 96px; }
.hvt-phead h2 { margin: 0; }
.hvt-mybid { font-weight: 700; }
.hvt-bidform summary, .hvt-vform summary, .hvt details summary { cursor: pointer; font-weight: 600; min-height: 32px; }
.hvt details { margin: 10px 0; }
.hvt-report-link { font-size: .85rem; }
.hvt-report-link a, a.hvt-report-link { color: var(--t-muted); }
/* Messages */
.hvt-thread { margin-top: 8px; }
.hvt-msgs { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 420px; overflow-y: auto; }
.hvt-msgs li { max-width: 85%; padding: 8px 12px; border-radius: 12px; background: #f0f2f3; overflow-wrap: anywhere; }
.hvt-msgs li small { display: block; font-size: .75rem; }
.hvt-msgs li.is-mine { align-self: flex-end; background: #e3f4e8; }
.hvt-msgs li.is-system, .hvt-msgs li.is-empty { align-self: center; background: transparent; color: var(--t-muted); font-size: .88rem; text-align: center; }
.hvt-msgform { display: flex; gap: 8px; align-items: flex-end; }
.hvt-msgform textarea { flex: 1; }
/* Dashboard */
.hvt-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--t-line); margin: 0 0 16px; }
.hvt-tabs a { padding: 10px 14px; text-decoration: none; color: inherit; white-space: nowrap; border-bottom: 3px solid transparent; }
.hvt-tabs a[aria-current] { border-color: var(--t-primary); font-weight: 700; }
.hvt-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hvt-rows a { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 12px 14px; background: var(--t-card); border: 1px solid var(--t-line); border-radius: 10px; text-decoration: none; color: inherit; }
.hvt-rows a > span:first-child { min-width: 0; }
.hvt-rows strong { display: block; overflow-wrap: anywhere; }
.hvt-rows small { display: block; }
@media (max-width: 520px) { .hvt-rows a { grid-template-columns: 1fr auto; } .hvt-rows a b { grid-column: 2; } }
.hvt-table { width: 100%; border-collapse: collapse; margin: 10px 0 16px; display: block; overflow-x: auto; }
.hvt-table th, .hvt-table td { text-align: start; padding: 8px; border-bottom: 1px solid var(--t-line); vertical-align: top; }
.hvt-money { width: 100%; max-width: 360px; border-collapse: collapse; }
.hvt-money td { padding: 4px 0; }
.hvt-money td:last-child { text-align: end; }
.hvt-money .is-total td { font-weight: 700; border-top: 1px solid var(--t-line); padding-top: 6px; }
.hvt-scope { max-height: 260px; overflow-y: auto; background: #fafbfb; padding: 8px 12px; border-radius: 8px; overflow-wrap: anywhere; }
.hvt-files { padding-inline-start: 1.2em; }
/* Reviews */
.hvt-stars { color: #d49b00; letter-spacing: 1px; }
.hvt-stars span { color: #cfd4d6; }
.hvt-reviews ul { list-style: none; padding: 0; }
.hvt-reviews li { border-bottom: 1px solid var(--t-line); padding: 10px 0; }
.hvt-reply { margin-inline-start: 16px; padding-inline-start: 10px; border-inline-start: 3px solid var(--t-line); }
.hvt-rate { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; border: 0; padding: 0; }
.hvt-rate legend { width: 100%; }
.hvt-rate input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hvt-rate label { font-size: 2rem; color: #cfd4d6; cursor: pointer; padding: 0 2px; margin: 0; }
.hvt-rate input:checked ~ label, .hvt-rate label:hover, .hvt-rate label:hover ~ label { color: #d49b00; }
.hvt-rate input:focus-visible + label { outline: 3px solid var(--t-primary); }
.hvt blockquote { margin: 6px 0; padding: 6px 12px; border-inline-start: 3px solid var(--t-line); }
.hvt-badge-help ul { margin: 6px 0 0 1.2em; }