/* Shared portal motion and visual language. Never applied to invoice papers. */
:root{--ui-ease:cubic-bezier(.2,.75,.25,1);--ui-shadow:0 6px 20px #30372309;--ui-focus:#b64e1e;--ui-success:#177245;--ui-danger:#b33238;--ui-attention:#925a0b;--ui-info:#245aa3;--ui-review:#6f5294;--ui-led-animation:ui-led-pulse 2.4s ease-in-out infinite}
body.staff-mode{background:radial-gradient(ellipse at 90% 0,#e9efdf80,transparent 42%),#f6f6ef}
body.staff-mode #main{padding-top:150px}
body :is(.o-workspace,.t-workspace){--line:#dde5d8}
body :is(.section-heading,.access-heading) h1{font-weight:750;letter-spacing:-.8px}
body [data-ui-icon]::before{content:'';display:inline-block;width:24px;height:24px;margin-right:12px;vertical-align:-2px;background:currentColor;mask:var(--ui-icon) center/contain no-repeat;opacity:.85}
[data-ui-icon=property]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Cpath d='m3 10 9-7 9 7v11h-6v-8H9v8H3z'/%3E%3C/svg%3E")}
[data-ui-icon=people]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M2 21v-3a7 7 0 0 1 14 0v3M16 3a4 4 0 0 1 0 8m3 3a6 6 0 0 1 3 5v2'/%3E%3C/svg%3E")}
[data-ui-icon=work]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Crect x='3' y='7' width='18' height='14' rx='3'/%3E%3Cpath d='M8 7V3h8v4M3 13h18m-11 0v3h4v-3'/%3E%3C/svg%3E")}
[data-ui-icon=money]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Crect x='2' y='5' width='20' height='14' rx='3'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M5 9v6m14-6v6'/%3E%3C/svg%3E")}
[data-ui-icon=document]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Cpath d='M5 2h9l5 5v15H5zm9 0v6h5M8 12h8m-8 4h8'/%3E%3C/svg%3E")}
[data-ui-icon=calendar]{--ui-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='black' stroke-width='1.8' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M7 2v6m10-6v6M3 11h18m-14 4h3m4 0h3'/%3E%3C/svg%3E")}
body :is(.page,dialog) :is(.button,.plain-button,.action-link,.text-button,.button-link){transition:background-color .18s,border-color .18s,box-shadow .2s,transform .2s var(--ui-ease),color .18s;position:relative}
body :is(.page,dialog) .button:not(.secondary):not(.danger){background:linear-gradient(135deg,#c6602b,#a94318);border-color:#aa471d;box-shadow:0 3px 9px #a9431820}
@media(hover:hover){body :is(.page,dialog) :is(.button,.plain-button,.action-link,.text-button,.button-link):not(:disabled):not([aria-disabled=true]):hover{transform:translateY(-2px)!important;box-shadow:0 7px 15px #343c201c;border-color:#a4b18b!important}body :is(.page,dialog) .button:not(.secondary):not(.danger):hover{background:linear-gradient(135deg,#d06a34,#b34e21);box-shadow:0 7px 18px #a943182a;border-color:#a94318!important}}
body :is(.page,dialog) :is(button,.button,.action-link):not(:disabled):active{transform:translateY(0) scale(.98)!important}
body :is(.page,dialog) :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #cf773b;outline-offset:3px;box-shadow:0 0 0 6px #cf773b16}
body :is(.page,dialog) :is(input,select,textarea):not([type=checkbox]):not([type=radio]){transition:border-color .18s,box-shadow .18s;background-color:#fff;border-radius:10px}
body :is(.page,dialog) :is(input,select,textarea):not([type=checkbox]):not([type=radio]):hover{border-color:#a6b690}
body :is(.page,dialog) input:is([type=checkbox],[type=radio]){accent-color:#647e3b;transition:box-shadow .18s}
body :is(.m-panel,.portfolio-panel,.ws-widget,.association-card,.unit-billing-card,.form-card){border-radius:16px!important;box-shadow:var(--ui-shadow);border-color:#dfe6d7;transition:box-shadow .22s,border-color .22s}
body :is(.m-panel,.portfolio-panel,.ws-widget,.association-card,.unit-billing-card):focus-within{border-color:#aabd91;box-shadow:0 5px 22px #4b683a10}
body .association-card{border-top:3px solid #91aa65;background:linear-gradient(140deg,#f8fbf3,#fff 38%)}
body :is(.property-row,.p-row,.i-row,.op-row,.m-request-row,.connected-row,.t-lease,.o-publication){transition:background-color .18s,border-color .18s;position:relative}
@media(hover:hover){body :is(.property-row,.p-row,.i-row,.op-row,.m-request-row,.connected-row,.t-lease,.o-publication):hover{background:#edf3e780;border-color:#b7c7a3}body .ws-table tbody tr:hover{background:#eef5e8}body .association-property-link:hover{background:#eaf2e0;box-shadow:inset 3px 0 #78934d}}
body :is(.connected-metrics,.stats,.m-stats,#mi-stats)>:is(article,button){border-radius:16px;box-shadow:var(--ui-shadow);border-top:3px solid #94a86b;background:linear-gradient(145deg,#f5f8ed,#fff 65%);transition:box-shadow .2s,background .2s,transform .2s var(--ui-ease)}
body :is(.connected-metrics,.stats,.m-stats,#mi-stats)>:nth-child(2){border-top-color:#619ba3;background:linear-gradient(145deg,#edf7f7,#fff 65%)}
body :is(.connected-metrics,.stats,.m-stats,#mi-stats)>:nth-child(3){border-top-color:#cd9966;background:linear-gradient(145deg,#fff5e9,#fff 65%)}
body :is(.connected-metrics,.stats,.m-stats,#mi-stats)>:nth-child(4){border-top-color:#a591bd;background:linear-gradient(145deg,#f5f0fa,#fff 65%)}
@media(hover:hover){body .connected-metrics>button:hover{transform:translateY(-3px);box-shadow:0 9px 24px #3e522d16;border-color:#8da86e}}
body [data-ui-tone]{--status-color:#657062;--status-bg:#f0f2ed;--status-border:#d8dfd1;display:inline-flex;align-items:center;gap:7px;width:fit-content;max-width:100%;padding:5px 10px!important;border:1px solid var(--status-border)!important;border-radius:999px!important;background:var(--status-bg)!important;color:var(--status-color)!important;font-size:12px!important;font-weight:650;line-height:1.4;letter-spacing:0;vertical-align:middle}
body [data-ui-tone]::before{content:'';width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--status-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--status-color) 12%,transparent)}
body [data-ui-tone=positive]{--status-color:var(--ui-success);--status-bg:#eaf6ee;--status-border:#c6e3cf}
body [data-ui-tone=danger]{--status-color:var(--ui-danger);--status-bg:#fceff0;--status-border:#efcfd2}
body [data-ui-tone=attention]{--status-color:var(--ui-attention);--status-bg:#fff5e3;--status-border:#efdcb6}
body [data-ui-tone=info]{--status-color:var(--ui-info);--status-bg:#edf3fc;--status-border:#c6d8f0}
body [data-ui-tone=review]{--status-color:var(--ui-review);--status-bg:#f3eff9;--status-border:#ded2ef}
body select[data-ui-status-tone]{border-left-width:4px!important}
body select[data-ui-status-tone=positive]{border-left-color:var(--ui-success)!important;color:var(--ui-success)}
body select[data-ui-status-tone=info]{border-left-color:var(--ui-info)!important;color:var(--ui-info)}
body select[data-ui-status-tone=attention]{border-left-color:var(--ui-attention)!important;color:var(--ui-attention)}
body select[data-ui-status-tone=danger]{border-left-color:var(--ui-danger)!important;color:var(--ui-danger)}
body select[data-ui-status-tone=review]{border-left-color:var(--ui-review)!important;color:var(--ui-review)}
body select[data-ui-status-tone=neutral]{border-left-color:#657062!important;color:#657062}
/* Every option owns its palette; it never inherits the current selection's color. */
body select[data-ui-status-tone] option[data-ui-option-tone]{--option-color:#657062;--option-bg:#f0f2ed;color:var(--option-color);background-color:#fff}
body select[data-ui-status-tone] option[data-ui-option-tone=positive]{--option-color:var(--ui-success);--option-bg:#eaf6ee}
body select[data-ui-status-tone] option[data-ui-option-tone=info]{--option-color:var(--ui-info);--option-bg:#edf3fc}
body select[data-ui-status-tone] option[data-ui-option-tone=attention]{--option-color:var(--ui-attention);--option-bg:#fff5e3}
body select[data-ui-status-tone] option[data-ui-option-tone=danger]{--option-color:var(--ui-danger);--option-bg:#fceff0}
body select[data-ui-status-tone] option[data-ui-option-tone=review]{--option-color:var(--ui-review);--option-bg:#f3eff9}
@supports (appearance:base-select){
 body select[data-ui-status-tone]:not([multiple]):not([size]),body select[data-ui-status-tone][size="1"]{appearance:base-select;background-image:none;align-items:center}
 body select[data-ui-status-tone]::picker(select){appearance:base-select;background:#fff;border:1px solid #d8dfd1;border-radius:10px;padding:5px;box-shadow:0 8px 24px #30372324;max-height:min(360px,60dvh);overflow:auto;box-sizing:border-box}
 body select[data-ui-status-tone]::picker-icon{color:currentColor;transition:rotate .15s}
 body select[data-ui-status-tone]:open::picker-icon{rotate:180deg}
 body select[data-ui-status-tone] option[data-ui-option-tone]{display:flex;align-items:center;gap:12px;min-height:44px;padding:6px 8px;border:0;border-radius:5px;white-space:normal}
 body select[data-ui-status-tone] option[data-ui-option-tone]:is(:hover,:focus-visible,:checked){background:#f3f5f0}
 body select[data-ui-status-tone] option[data-ui-option-tone]:focus-visible{outline:2px solid var(--option-color);outline-offset:-2px}
 body select[data-ui-status-tone] option[data-ui-option-tone]::checkmark{order:1;margin-left:auto;color:var(--option-color);flex-shrink:0}
 body select[data-ui-status-tone] option[data-ui-option-tone]:disabled{opacity:.55}
 body select[data-ui-status-tone] .ui-status-option-badge{display:inline-flex;align-items:center;max-width:100%;padding:3px 8px;border:1px solid currentColor;border-radius:4px;background:var(--option-bg);color:var(--option-color);font-size:12px;font-weight:650;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
 body select[data-ui-status-tone] .ui-status-option-badge[data-ui-option-label]{font-size:0}
 body select[data-ui-status-tone] .ui-status-option-badge[data-ui-option-label]::before{content:attr(data-ui-option-label);font-size:12px}
}
.status-color-index{width:min(900px,calc(100vw - 32px));max-height:85vh;padding:24px}.status-color-index section{margin:24px 0}.status-color-index h3{margin:0 0 4px}.status-color-index section p{margin:0 0 12px}.status-color-examples{display:flex;flex-wrap:wrap;gap:8px}
body :is(.pw-tabs,.p-tabs,.connected-tabs,.m-tablist){border-radius:14px;background:#edf2e5;padding:8px;gap:6px;border-color:#d9e3cb}
body :is(.pw-tabs,.p-tabs,.connected-tabs,.m-tablist)>:is(a,button){transition:background .18s,color .18s,box-shadow .18s;border-radius:9px!important}
body :is(.pw-tabs,.p-tabs,.connected-tabs,.m-tablist)>[aria-current=page],body :is(.p-tabs,.m-tablist)>[aria-selected=true]{box-shadow:0 3px 8px #3e522d20}
body .ws-sidebar .ws-nav-items>a{transition:background .18s,color .18s,box-shadow .18s}
body .ws-sidebar .ws-nav-items>a:hover{background:#ffffff12;box-shadow:inset 3px 0 #cbd9a2}
body dialog[open]{animation:ui-dialog .22s var(--ui-ease);border-radius:20px;box-shadow:0 25px 90px #27371c35}
body dialog::backdrop{background:#20301855;backdrop-filter:blur(3px)}
body .page:not([hidden])>.wrap{animation:ui-arrive .28s var(--ui-ease)}
body .page details{border-radius:10px}
body .page summary{cursor:pointer;transition:color .18s,background .18s;padding-block:6px}
body .page summary:hover{color:#b64e1e}
body :is(.page,dialog) :is(input,textarea,select):user-invalid{border-color:#bc5960;box-shadow:0 0 0 3px #bc596015}
body :is(.page,dialog) button:disabled{opacity:.55;cursor:wait}
body :is(.page,dialog) [role=alert]:not(:empty):not(.o-access-status){padding:12px 16px;border-left:3px solid #d19846;border-radius:10px;background:#fff6e8;color:#704d1d}
body .page :is(#core-status,.form-message):not(:empty){padding:10px 14px;border-left:3px solid #7b984c;border-radius:9px;background:#f0f5e9}
body dialog h2{color:#343f28;font-weight:750}
body .page details[open]>:not(summary){animation:ui-arrive .2s var(--ui-ease)}
body .connected-workflow ol{list-style:none;padding-left:20px}
body .connected-workflow li{position:relative;border-left:2px solid #dbe5cf;padding:10px 0 18px 20px}
body .connected-workflow li::before{content:'';position:absolute;left:-6px;top:20px;width:10px;height:10px;border-radius:50%;background:#a9bc91;border:2px solid #fff;box-shadow:0 0 0 2px #dbe5cf}
body .connected-workflow li:has(.state-complete)::before{background:#238754}
body .connected-workflow li:has(.state-next)::before{background:#cf922e}
.ui-workflow-progress{width:100%;height:7px;border:0;border-radius:999px;overflow:hidden;appearance:none;accent-color:#6d8a43;margin:0 0 16px}
.ui-workflow-progress::-webkit-progress-bar{background:#e9efdf;border-radius:999px}.ui-workflow-progress::-webkit-progress-value{background:linear-gradient(90deg,#657d37,#94b968);border-radius:999px;transition:width .3s}
.ui-workflow-progress::-moz-progress-bar{background:#7d9e4e;border-radius:999px}
.ui-activated{animation:ui-activate .24s var(--ui-ease)}
.ui-access-control{cursor:pointer;white-space:nowrap;transition:box-shadow .18s,filter .18s,transform .18s}
.ui-access-control:not(:disabled):hover{filter:brightness(.94);box-shadow:0 0 0 4px #7a955c18;transform:translateY(-1px)}
.ui-access-control:disabled{cursor:default}
.ui-access-control{display:inline-flex;align-items:center;gap:9px;padding:7px 11px;border:1px solid #d2d8cb;border-radius:999px;font:inherit;font-size:12px;font-weight:600;color:#69735e;background:#f0f2ec}
.ui-access-control.is-enabled{color:#177245;background:#e5f4eb;border-color:#b9dec8}
.ui-access-control.is-disabled{color:#687261;background:#f0f2ec;border-color:#d2d8cb}
.ui-access-control:focus-visible{outline:3px solid #d59e43;outline-offset:3px}
.ui-access-control[role=switch]::after{content:'';display:inline-block;width:26px;height:15px;flex:0 0 26px;border:1px solid currentColor;border-radius:999px;background:radial-gradient(circle at 7px 7px,#fff 0 5px,transparent 5.5px),currentColor;opacity:.85}
.ui-access-control[role=switch][aria-checked=true]::after{background:radial-gradient(circle at 18px 7px,#fff 0 5px,transparent 5.5px),currentColor}
.workflow-access{margin-bottom:24px}.workflow-access [data-access-search]{max-width:420px}.workflow-access [data-access-message]:not(:empty){padding:10px 14px;border-radius:9px;background:#eaf6ee;color:#177245}.workflow-access .connected-row>div:last-child{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
/* Animate the light itself so status text, switches and table cells stay still. */
body [data-ui-tone]::before,body .o-access-status::before,body :is(.connected-workflow,.m-timeline) li::before,body :is(.day-live-dot,.portal-access-dot,.people-event-dot,.qx-event-marker){animation:var(--ui-led-animation);transform-origin:center}
@keyframes ui-led-pulse{0%,100%{opacity:.55;transform:scale(.88)}50%{opacity:1;transform:scale(1.12)}}
@keyframes ui-activate{0%{box-shadow:0 0 0 0 #b64e1e30}100%{box-shadow:0 0 0 8px #b64e1e00}}
@keyframes ui-arrive{from{opacity:.6;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes ui-dialog{from{opacity:.5;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
@media(max-width:850px){body.staff-mode #main{padding-top:145px}}
@media(max-width:700px){body.staff-mode #main{padding-top:190px}body [data-ui-icon]::before{width:20px;height:20px;margin-right:9px}body [data-ui-tone]{font-size:11px!important}}
@media(prefers-reduced-motion:reduce){:root{--ui-led-animation:none}html{scroll-behavior:auto!important}body :is(.page,dialog),body :is(.page,dialog) *{animation:none!important;transition:none!important}body :is(.page,dialog) :is(button,.button,.action-link):hover,body :is(.page,dialog) :is(button,.button,.action-link):active{transform:none!important}}
@media print{:root{--ui-led-animation:none}body [data-ui-icon]::before{display:none}body :is(.page,dialog) *{animation:none!important;transition:none!important;box-shadow:none!important}}
