/* A local staff-management example. All rules stay within this component. */
.td-staff{color:#16232c;background:#fff;border:1px solid #d6dad4;border-radius:6px;overflow:hidden;font-family:var(--df-ui-font,inherit);text-align:left;min-width:0}
.td-staff [hidden]{display:none!important}
.td-staff .td-staff-bar{display:flex;align-items:center;gap:22px;padding:23px 28px;background:#fbfcf8;border-bottom:1px solid #d6dad4;font-size:14px;font-weight:550;line-height:1.45}
.td-staff .td-staff-bar img{width:78px;height:auto;object-fit:contain;flex:none}
.td-staff .td-staff-bar small{margin-left:auto;color:#68736e;font-size:12px;font-weight:400}
.td-staff .td-staff-layout{display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,1.25fr)}
.td-staff .td-staff-people{min-width:0;background:#f2f3ed;border-right:1px solid #d6dad4;padding:29px 24px}
.td-staff .td-staff-list-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:0 0 23px}
.td-staff .td-staff-list-heading h3{font-family:inherit;font-size:15px;font-weight:650;letter-spacing:-.02em;line-height:1.4;margin:0}
.td-staff .td-staff-list-heading>span{color:#68736e;font-size:12px;white-space:nowrap}
.td-staff .td-staff-roster{display:flex;flex-direction:column;gap:0}
.td-staff .td-staff-person{width:100%;min-height:85px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:transparent;border:0;border-top:1px solid #d6dad4;padding:19px 12px;text-align:left;color:#16232c;font:inherit;cursor:pointer;border-radius:0;transition:background .18s ease}
.td-staff .td-staff-person:last-child{border-bottom:1px solid #d6dad4}
.td-staff .td-staff-person>span{display:block;min-width:0}
.td-staff .td-staff-person strong{display:block;font-size:16px;font-weight:650;line-height:1.35;overflow-wrap:anywhere}
.td-staff .td-staff-person>span>span{display:block;font-size:12px;color:#68736e;margin-top:5px;line-height:1.4}
.td-staff .td-staff-person small{font-size:11px;line-height:1.4;color:#54705b;flex:none}
.td-staff .td-staff-person[aria-pressed=true]{background:#fff;box-shadow:inset 3px 0 #4b46c8}
.td-staff .td-staff-person:hover{background:#ffffffaa}
.td-staff .td-staff-person.is-inactive small{color:#777c78}
.td-staff .td-staff-add,.td-staff .td-staff-cancel{min-height:48px;border:0;border-radius:0;background:transparent;font:inherit;font-size:14px;font-weight:600;color:#4b46c8;cursor:pointer;padding:12px 0;text-align:left;text-underline-offset:5px}
.td-staff .td-staff-add{margin-top:15px}
.td-staff .td-staff-add:hover,.td-staff .td-staff-cancel:hover{text-decoration:underline}
.td-staff .td-staff-roster-note{font-size:12px;line-height:1.6;color:#68736e;margin:15px 0 0}
.td-staff .td-staff-detail{padding:36px clamp(24px,3vw,44px) 27px;min-width:0;background:#fff}
.td-staff .td-staff-eyebrow{font-size:11px;line-height:1.5;letter-spacing:.11em;text-transform:uppercase;font-weight:650;color:#4b46c8;margin:0 0 13px}
.td-staff .td-staff-detail h3{font-size:clamp(28px,3vw,40px);line-height:1.1;font-weight:500;letter-spacing:-.05em;margin:0 0 12px;color:#16232c}
.td-staff .td-staff-access{font-size:13px;line-height:1.6;color:#68736e;margin:0 0 29px}
.td-staff .td-staff-form{margin:0}
.td-staff .td-staff-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.td-staff .td-staff-form label:not(.td-staff-active){display:flex;flex-direction:column;gap:9px;font-size:13px;line-height:1.5;font-weight:600;min-width:0;margin:0}
.td-staff .td-staff-form :is(input[type=text],select){appearance:auto;width:100%;max-width:100%;min-width:0;min-height:50px;border:1px solid #cdd3ca;border-radius:4px;background:#fff;color:#16232c;font-family:inherit;font-size:16px;font-weight:400;line-height:1.35;padding:12px 13px}
.td-staff .td-staff-form :is(input[type=text],select):hover{border-color:#909b93}
.td-staff .td-staff-field-note{font-size:11px;font-weight:400;line-height:1.5;color:#68736e}
.td-staff .td-staff-active{display:flex;align-items:flex-start;gap:13px;min-height:54px;padding:23px 0;margin:25px 0 0;border-top:1px solid #dce0d8;border-bottom:1px solid #dce0d8;cursor:pointer}
.td-staff .td-staff-active input{accent-color:#4b46c8;width:19px;height:19px;min-width:19px;margin:3px 0 0;cursor:pointer}
.td-staff .td-staff-active>span{min-width:0}
.td-staff .td-staff-active strong{display:block;font-size:14px;font-weight:600;line-height:1.5}
.td-staff .td-staff-active>span>span{display:block;color:#68736e;font-size:12px;font-weight:400;line-height:1.55;margin-top:3px}
.td-staff .td-staff-actions{display:flex;align-items:center;gap:22px;margin-top:26px;flex-wrap:wrap}
.td-staff .td-staff-actions>span{font-size:12px;line-height:1.6;color:#68736e;flex:1;min-width:150px}
.td-staff .td-staff-primary{min-height:48px;border:1px solid #4b46c8;border-radius:3px;background:#4b46c8;color:#fff;font-family:inherit;font-size:14px;font-weight:650;line-height:1.3;padding:14px 21px;cursor:pointer;transition:background .18s ease;max-width:100%}
.td-staff .td-staff-primary:hover{background:#3c37ad;border-color:#3c37ad}
.td-staff .td-staff-status{font-size:12px;line-height:1.65;min-height:40px;margin:24px 0 0;color:#54705b}
.td-staff .td-staff-foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid #d6dad4;background:#fbfcf8;padding:16px 28px;color:#68736e;font-size:11px;line-height:1.6}
.td-staff .td-staff-foot>span:first-child{color:#44544b;font-weight:550}
.td-staff .td-staff-new h3{margin-bottom:27px}
.td-staff .td-staff-new>.td-staff-fields{margin-top:19px}
.td-staff .td-staff-new-note{font-size:12px;line-height:1.65;color:#68736e;margin:20px 0 0}
.td-staff :is(button,input,select):focus-visible{outline:3px solid #4b46c8;outline-offset:4px}
@media(max-width:760px){
 .td-staff .td-staff-bar{padding:19px 20px;gap:15px;flex-wrap:wrap}
 .td-staff .td-staff-bar small{flex-basis:100%;margin-left:0;font-size:11px}
 .td-staff .td-staff-layout{grid-template-columns:minmax(0,1fr)}
 .td-staff .td-staff-people{border-right:0;border-bottom:1px solid #d6dad4;padding:24px 20px 18px}
 .td-staff .td-staff-list-heading{margin-bottom:15px}
 .td-staff .td-staff-person{min-height:72px;padding:14px 12px}
 .td-staff .td-staff-person strong{font-size:15px}
 .td-staff .td-staff-add{margin-top:8px}
 .td-staff .td-staff-roster-note{margin-top:5px}
 .td-staff .td-staff-detail{padding:29px 20px 18px}
 .td-staff .td-staff-fields{grid-template-columns:minmax(0,1fr);gap:19px}
 .td-staff .td-staff-active{margin-top:23px;padding:20px 0}
 .td-staff .td-staff-actions{gap:15px;margin-top:23px}
 .td-staff .td-staff-actions>span{flex-basis:100%}
 .td-staff .td-staff-status{margin-top:19px;min-height:35px}
 .td-staff .td-staff-foot{padding:16px 20px;gap:6px}
 .td-staff .td-staff-foot>span{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){.td-staff *{transition:none!important}}
