/* Yashfeeni internal back-office — page specific styles (on top of /assets/mockup.css) */
a.brand{text-decoration:none;color:inherit}
.brand-tag{font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 8px;margin-inline-start:4px}
a.pill{text-decoration:none;color:inherit;display:inline-flex;align-items:center}
.pill svg{width:16px;height:16px}
.alwho .role{color:var(--teal-strong);font-weight:600}
.adm-top{padding-top:28px}
.adm-top .ptabs{margin-bottom:0}
.adm-body{padding-top:22px}
.adm-body h3{margin:0}
.ptabs.sub{border-bottom:0;background:var(--surface2);border-radius:13px;padding:4px;gap:4px;margin-bottom:18px}
.ptabs.sub button{border-bottom:0;border-radius:9px;padding:8px 14px}
.ptabs.sub button[aria-current="page"]{background:var(--surface);box-shadow:0 1px 0 var(--line)}
@media (min-width:861px){.ptabs.sub{flex-wrap:wrap;overflow:visible}}
.chart-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}
.chart-head h4{margin:0}
.chartw{margin-top:8px}
.tbl th[data-sort]{cursor:pointer;user-select:none}
.tbl th[data-sort]:hover{color:var(--ink)}
.sorti{font-style:normal;font-size:10px;margin-inline-start:4px}
.tbl tbody tr.rowlink{cursor:pointer}
.tbl tbody tr.rowlink:hover td{background:var(--surface2)}
.tbl small.blk,small.blk{display:block;color:var(--muted);font-size:12.5px;white-space:normal}
.tbl td.nm{white-space:normal;min-width:160px}
.tbl td.detail{white-space:normal;max-width:360px;font-size:12.5px;color:var(--muted)}
.tbl code{font-size:12.5px;background:var(--surface2);padding:2px 6px;border-radius:6px}
.pcell{display:flex;align-items:center;gap:10px}
.acts-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.acts-row select{width:auto;padding:7px 10px;font-size:14px}
.link.warn,.btn.ghost.warn{color:var(--warn)}
.btn.warnbtn{background:var(--bad)}
.btn.warnbtn:hover{background:#9c2f24}
.stat.live,.stat.active,.stat.paid,.stat.won,.stat.accepted,.stat.answered{background:color-mix(in srgb,#2E9E6A 18%,transparent);color:#1F7A50}
.stat.pending,.stat.due,.stat.open,.stat.invited,.stat.contacted,.stat.quote{background:color-mix(in srgb,#E08A2B 20%,transparent);color:var(--warn)}
.stat.suspended,.stat.rejected,.stat.overdue,.stat.lost,.stat.disabled,.stat.removed,.stat.failed,.stat.expired,.stat.cancelled{background:color-mix(in srgb,#D9534F 16%,transparent);color:var(--bad)}
.stat.closed,.stat.ok,.stat.void,.stat.new{background:var(--surface2);color:var(--muted)}
.kind{display:inline-block;font-size:12px;font-weight:700;border-radius:8px;padding:2px 8px;margin-inline-end:4px;background:color-mix(in srgb,#D9534F 16%,transparent);color:var(--bad)}
.kind.freq{background:color-mix(in srgb,#E08A2B 20%,transparent);color:var(--warn)}
.listbox .it.alert{align-items:flex-start}
.listbox .it.alert.done{opacity:.75}
.al-main{flex:1;min-width:0}
.al-visits{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px;font-size:13px}
.al-visits li{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted)}
.al-visits li b{color:var(--ink);font-weight:500}
.listbox .it.tk small.body{color:var(--ink);white-space:pre-wrap;margin-top:4px}
.listbox .it.tk small.reply-txt{color:var(--teal-strong);margin-top:4px}
.listbox .it>div:first-child{min-width:0;flex:1}
.vsteps .toggle{align-items:flex-start}
.kv dd{word-break:break-word}
.signed-block{margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px}
.signed-block img{max-height:120px;margin:0 auto}
.gfam .gr{grid-template-columns:1fr auto auto}
.gfam .gr.off .n{color:var(--muted);text-decoration:line-through}
#pcForm .gr{grid-template-columns:1.6fr 110px 90px auto}
@media (max-width:620px){#pcForm .gr{grid-template-columns:1fr 1fr;}#pcForm .gr .n{grid-column:1/-1}}
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px 14px;margin-top:10px}
.cfg-grid .field{margin-bottom:0}
form.inl{display:none}
.searchrow{display:flex;gap:10px;margin-bottom:18px;max-width:640px}
.searchrow input{flex:1}
.bens{display:grid;gap:14px}
.ben{display:flex;gap:14px;align-items:flex-start}
.ben .idphoto{width:84px}
.ben .idphoto img,.ben .idphoto .nophoto{width:84px;height:112px;object-fit:cover;border-radius:10px;display:block;background:var(--surface2)}
.ben .idphoto .nophoto svg{width:84px;height:112px;border-radius:10px}
.filebtn{position:relative;cursor:pointer}
.photo-compare{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin:10px 0}
.photo-compare figure{margin:0;text-align:center}
.photo-compare .idp{width:150px;height:200px;object-fit:cover;border-radius:12px;display:block;background:var(--surface2)}
.photo-compare .nophoto svg{width:150px;height:200px;border-radius:12px}
.photo-compare figcaption{font-size:13px;color:var(--muted);margin-top:6px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:16px;letter-spacing:.04em}
.pager{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:16px;color:var(--muted)}
.alog .notice{text-align:center}
.alog form .btn{margin-top:6px}
.dash-ctl form,.dash-ctl .field{margin-bottom:0}
.dash-ctl .btn{align-self:end}
@media (max-width:700px){.kpis4{grid-template-columns:1fr 1fr}.kpi b{font-size:22px}}
@media (max-width:520px){.kpis{grid-template-columns:1fr 1fr}.two{gap:16px}.panel{padding:16px}.searchrow{flex-direction:column}}
[hidden]{display:none!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .legend i.bs{background:#41608F}}
:root[data-theme="dark"] .legend i.bs{background:#41608F}
/* QA fixes */
.pw input{padding:10px 13px;background:transparent;outline:none;min-height:42px}
a.btn.disabled,a.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--bad)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--bad) 18%,transparent)}
.cfg-grid small.blk{font-size:11.5px;margin-top:2px}
.ptabs button .stat{font-size:11px;padding:1px 6px;margin-inline-start:4px}
.tbl td.detail[dir="ltr"]{text-align:start}
.chart-head small.blk{margin-top:2px}
.stat.refunded,.stat.invited{background:color-mix(in srgb,#E08A2B 20%,transparent);color:var(--warn)}
/* QA fixes: phone header and layout */
@media (max-width:860px){#who{display:none}}
@media (max-width:700px){.brand-tag{display:none}.top a.pill[href="/"]{display:none}.top .wrap{gap:6px}#logoutBtn{padding:6px 10px;font-size:13px}.pill{padding:6px 9px}.adm-top{padding-top:16px}.adm-top .space-head h2{font-size:22px}.adm-top .rolebar{display:none}.space-head{flex-wrap:wrap}.acts-row{justify-content:flex-start}.dash-ctl{flex-wrap:wrap}.dash-ctl .field{flex:1 1 140px}.listbox .it{flex-wrap:wrap}}
@media (max-width:420px){.brand b{display:none}.kpis4 .kpi b,.kpis .kpi b{font-size:19px}}

/* phone: tables become stacked cards (labels copied from the header by labelTables()) */
@media (max-width:620px){
 .tblw{border:0;background:transparent;overflow:visible}
 .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%;min-width:0!important}
 .tbl thead{display:none}
 .tbl tr{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin-bottom:10px}
 .tbl td{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:5px 0;border:0;white-space:normal;text-align:end}
 .tbl td::before{content:attr(data-label);color:var(--muted);font-size:12.5px;text-align:start;flex:none;max-width:45%}
 .tbl td[data-label=""]::before{display:none}
 .tbl td:empty{display:none}
 .tbl td.nm{min-width:0}
 .tbl td > small.blk{text-align:end}
}
/* dark mode: readable status chips */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .stat.live,:root:not([data-theme="light"]) .stat.active,:root:not([data-theme="light"]) .stat.paid,:root:not([data-theme="light"]) .stat.won,:root:not([data-theme="light"]) .stat.accepted,:root:not([data-theme="light"]) .stat.answered{color:#6EDCA6}:root:not([data-theme="light"]) .stat.pending,:root:not([data-theme="light"]) .stat.due,:root:not([data-theme="light"]) .stat.open,:root:not([data-theme="light"]) .stat.invited,:root:not([data-theme="light"]) .stat.contacted,:root:not([data-theme="light"]) .stat.refunded{color:#F5B971}:root:not([data-theme="light"]) .stat.suspended,:root:not([data-theme="light"]) .stat.rejected,:root:not([data-theme="light"]) .stat.overdue,:root:not([data-theme="light"]) .stat.lost,:root:not([data-theme="light"]) .stat.disabled,:root:not([data-theme="light"]) .stat.removed,:root:not([data-theme="light"]) .stat.failed,:root:not([data-theme="light"]) .stat.expired,:root:not([data-theme="light"]) .stat.cancelled{color:#FF9A8F}}
:root[data-theme="dark"] .stat.live,:root[data-theme="dark"] .stat.active,:root[data-theme="dark"] .stat.paid,:root[data-theme="dark"] .stat.won,:root[data-theme="dark"] .stat.accepted,:root[data-theme="dark"] .stat.answered{color:#6EDCA6}
:root[data-theme="dark"] .stat.pending,:root[data-theme="dark"] .stat.due,:root[data-theme="dark"] .stat.open,:root[data-theme="dark"] .stat.invited,:root[data-theme="dark"] .stat.contacted,:root[data-theme="dark"] .stat.refunded{color:#F5B971}
:root[data-theme="dark"] .stat.suspended,:root[data-theme="dark"] .stat.rejected,:root[data-theme="dark"] .stat.overdue,:root[data-theme="dark"] .stat.lost,:root[data-theme="dark"] .stat.disabled,:root[data-theme="dark"] .stat.removed,:root[data-theme="dark"] .stat.failed,:root[data-theme="dark"] .stat.expired,:root[data-theme="dark"] .stat.cancelled{color:#FF9A8F}
.chartw{overflow-x:auto;scrollbar-width:thin}