/* Vidyarc add-on: new layout and theme on top of app.css. Remove this file and vx-shell.js to go back. */
:root{--vx-side:232px;--vx-top:60px;--vx-teal:#0F7B77;--vx-teal-dd:#073F3D;--vx-teal-l:#E4F2F0;--vx-ink:#1C2326;--vx-grey:#5B6770;--vx-line:#E3E7EA;--vx-bg:#F5F7F8}
body{background:var(--vx-bg)}
#app>header.top{position:sticky;top:0;z-index:40}
#vx-menu-btn{display:none;width:40px;height:40px;border:1px solid var(--vx-line);border-radius:10px;background:#fff;color:var(--vx-ink);align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
#vx-side{display:none}
body.vx-on #vx-side{display:flex;flex-direction:column;gap:14px;position:fixed;top:var(--vx-top);left:0;bottom:0;width:var(--vx-side);background:#fff;border-right:1px solid var(--vx-line);padding:14px 10px 72px;overflow-y:auto;z-index:30;box-sizing:border-box}
body.vx-on #app>main#view{margin-left:var(--vx-side)}
body.vx-on #app>header.top nav.nav{display:none}
.vx-grp{display:flex;flex-direction:column;gap:2px}
.vx-gl{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--vx-grey);padding:0 10px 4px}
.vx-it{display:flex;align-items:center;gap:10px;min-height:38px;padding:0 10px;border-radius:10px;color:var(--vx-ink);text-decoration:none;font-size:14px;font-weight:600}
.vx-it svg{flex-shrink:0;color:var(--vx-grey)}
.vx-it:hover{background:var(--vx-bg);color:var(--vx-ink)}
.vx-it.on{background:var(--vx-teal-l);color:var(--vx-teal-dd);font-weight:800}
.vx-it.on svg{color:var(--vx-teal)}
.vx-it:focus-visible,#vx-menu-btn:focus-visible{outline:2px solid var(--vx-teal);outline-offset:2px}
/* Floating shortcuts are now in the menu */
body.vx-on #vr-reassign-link,body.vx-on #vlb-link,body.vx-on #vlb-nav{display:none!important}
body.vx-on #vl-new-btn{left:12px!important;bottom:12px!important;z-index:35!important;max-width:calc(var(--vx-side) - 24px)}
.lpanel{z-index:60!important}
/* Calmer, consistent controls */
.card{border-radius:14px}
.btn{border-radius:10px}
.inp{border-radius:10px}
@media (max-width:980px){
  #vx-menu-btn{display:inline-flex}
  body.vx-on #app>main#view{margin-left:0}
  body.vx-on #vx-side{transform:translateX(-100%);transition:transform .2s ease;box-shadow:none;width:min(280px,85vw)}
  body.vx-on.vx-open #vx-side{transform:none;box-shadow:0 16px 40px rgba(28,35,38,.25)}
  body.vx-on #app>header.top nav.nav{display:none}
  body.vx-on #vl-new-btn{left:auto!important;right:12px!important}
}
@media (prefers-reduced-motion:reduce){body.vx-on #vx-side{transition:none}}
@media print{#vx-side,#vx-menu-btn{display:none!important}body.vx-on #app>main#view{margin-left:0}}
/* Page layer: the new design's type scale and controls on every classic page */
#view .page h1,#view .ph h1{font-size:28px;font-weight:800;letter-spacing:-.2px;line-height:1.2}
#view .page h2{font-weight:800}
#view .page h3{font-weight:700}
#view .tbl th{font-size:13px;font-weight:700;color:#4A555D;text-transform:none;letter-spacing:0;background:#F5F7F8}
#view .btn{font-weight:700;border-radius:10px}
#view .chip{font-weight:700;border-radius:999px}
#view .cp,#view .pill{font-weight:700}
#view .kpi .v{font-weight:800}
#view .eb{font-weight:800;letter-spacing:.08em}
/* Appearance: theme switch and brand logo */
.vx-app{margin-top:auto;padding-top:12px;border-top:1px solid var(--vx-line)}
.vx-sw{display:flex;flex-direction:column;gap:4px;padding:0 2px}
.vx-sw button{display:flex;align-items:center;gap:10px;min-height:36px;padding:0 10px;border:1px solid var(--vx-line);border-radius:10px;background:#fff;font:inherit;font-size:13px;font-weight:600;color:var(--vx-ink);cursor:pointer;text-align:left}
.vx-sw button i{width:16px;height:16px;border-radius:50%;flex:none}
.vx-sw button[aria-pressed=true]{border-color:var(--vx-teal);box-shadow:inset 0 0 0 1px var(--vx-teal);font-weight:800}
.vx-sw button:focus-visible,button.vx-it:focus-visible,.vx-b:focus-visible{outline:2px solid var(--vx-teal);outline-offset:2px}
button.vx-it{border:0;background:none;width:100%;font:inherit;font-size:14px;cursor:pointer;text-align:left}
#vx-brand{display:inline-flex;align-items:center;padding-left:12px;border-left:1px solid var(--vx-line);height:32px;flex-shrink:0}
#vx-brand img{max-height:28px;max-width:120px;display:block}
#vx-login-brand{display:flex;align-items:center;gap:10px}
#vx-login-brand img{max-height:40px;max-width:160px;display:block}
#vx-login-brand span{font-size:12px;color:var(--vx-grey);font-weight:700}
.vx-modal{position:fixed;inset:0;background:rgba(28,35,38,.5);display:flex;align-items:center;justify-content:center;padding:16px;z-index:80}
.vx-mbox{background:#fff;border-radius:14px;max-width:440px;width:100%;padding:22px;display:flex;flex-direction:column;gap:12px;font-family:'Nunito Sans',system-ui,sans-serif;color:var(--vx-ink)}
.vx-mbox h3{margin:0;font-size:19px;font-weight:800}
.vx-note{margin:0;font-size:13px;color:var(--vx-grey);line-height:1.5}
.vx-prev{height:84px;border:1px dashed #C9D1D6;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--vx-bg);font-size:13px;color:var(--vx-grey)}
.vx-prev img{max-height:60px;max-width:80%}
.vx-fl{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700}
.vx-fl input[type=text]{height:40px;border:1px solid #D5DBDF;border-radius:10px;padding:0 10px;font:inherit;font-size:14px}
.vx-err{margin:0;min-height:1em;font-size:13px;color:#A5231B}
.vx-mact{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.vx-b{height:40px;padding:0 14px;border:1px solid #D5DBDF;border-radius:10px;background:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;color:var(--vx-ink)}
.vx-b.p{background:var(--vx-teal);border-color:var(--vx-teal);color:#fff}
.vx-b.rd{color:#A5231B;border-color:#F1C4BF}
@media (max-width:640px){#vx-brand{display:none}}
/* Gradify orange theme: variables for the add-ons (classic pages are recoloured by vx-theme-gradify.css) */
html.vxt-g{--vx-teal:#C2410C;--vx-teal-dd:#7C2D12;--vx-teal-l:#FFEDE3}
html.vxt-g #vxh{--teal-m:#F5B08F;--teal:#C2410C;--teal-d:#9A3412;--teal-dd:#7C2D12;--teal-l:#FFEDE3;--teal-xl:#FFF6F1}
html.vxt-g #vl-root{--vl-teal:#C2410C;--vl-teal-d:#9A3412;--vl-teal-l:#FFEDE3;--vl-teal-xl:#FFF6F1}
html.vxt-g .vx-it{color:var(--vx-ink)}html.vxt-g .vx-it.on{color:var(--vx-teal-dd)}html.vxt-g #vx-side a.vx-it:hover{color:var(--vx-ink)}
body.vx-brand-on header.top .wsname{display:none}
/* Add-on pages (approvals, new leads, homes) sit next to #view: keep every one clear of the left menu */
body.vx-on #app>main#view~div{margin-left:var(--vx-side);min-width:0;box-sizing:border-box}
@media (max-width:980px){body.vx-on #app>main#view~div{margin-left:0}}
/* Shortcut links that used to float over the page now sit in a row above the content */
#vx-tools{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;padding:14px 28px 0}
#vx-tools a,#vx-tools button{position:static!important;inset:auto!important;box-shadow:none!important;transform:none!important;height:36px!important;padding:0 14px!important;border-radius:10px!important;font:700 13px 'Nunito Sans',system-ui,sans-serif!important;display:inline-flex!important;align-items:center;gap:6px;text-decoration:none}
body.vx-on #vp-cc-panel{left:calc(var(--vx-side) + 20px)!important}
@media (max-width:980px){#vx-tools{padding:12px 16px 0}body.vx-on #vp-cc-panel{left:16px!important}}