/* The avatar is the photo control; its absolute remove action adds no space. */
.client-dossier-avatar-editor{position:relative;display:block;flex:0 0 auto;width:64px;height:64px;overflow:visible}
.client-dossier-avatar-editor>button.client-dossier-avatar{appearance:none;margin:0;padding:0;cursor:pointer;font-family:inherit;text-align:center}
.client-dossier-avatar-editor>button.client-dossier-avatar:hover{border-color:#cfb57360;box-shadow:0 0 0 2px #cfb5730a}
.client-dossier-avatar-editor>button.client-dossier-avatar:focus-visible{outline:2px solid var(--gold,#cfb573);outline-offset:3px}
.client-dossier-avatar-editor>.client-dossier-avatar>img{display:block;width:100%;height:100%;object-fit:cover}
.client-avatar-remove{position:absolute;z-index:1;top:-7px;right:-7px;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;min-width:26px;min-height:26px;margin:0;padding:0;border:1px solid #ffffff38;border-radius:50%;background:#171719;color:#eeeef0;box-shadow:0 2px 8px #00000066;cursor:pointer;opacity:0;pointer-events:none;transform:scale(.92)}
.client-avatar-remove>.icon{width:13px;height:13px;flex:none}
.client-avatar-remove[hidden]{display:none!important}
.client-dossier-avatar-editor:is(:hover,:focus-within)>.client-avatar-remove{opacity:1;pointer-events:auto;transform:none}
.client-avatar-remove:hover{border-color:#cfb57380;background:#242426}
.client-avatar-remove:focus-visible{outline:2px solid var(--gold,#cfb573);outline-offset:3px}

/* Photo removal is a small confirmation, with a dedicated close corner. */
.client-photo-removal-prompt .discard-card{position:relative;width:320px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);padding:18px 20px;overflow:auto}
.client-photo-removal-prompt .discard-card>h3{margin:0 0 8px;padding-right:24px;font-size:14px;line-height:1.4;letter-spacing:0}
.client-photo-removal-prompt .discard-card>p{margin:0;color:var(--muted,#a6a6ad);font-size:12px;line-height:1.5}
.client-photo-removal-prompt .discard-actions{gap:8px;margin-top:14px}
.client-photo-removal-prompt .discard-actions>.button{min-height:32px;padding:6px 10px;font-size:11px;line-height:1.4}
.client-photo-removal-prompt .discard-card>.icon-button[data-action=discard-cancel]{position:absolute;top:8px;right:8px;width:26px;height:26px;min-width:26px;min-height:26px;padding:5px;border-radius:6px}
.client-photo-removal-prompt .discard-card>.icon-button[data-action=discard-cancel]>.icon{width:13px;height:13px}

/* A cover overlaps the whole editor rather than only its inner picture. */
.client-dossier-cover:not([hidden])+.task-dossier-body .client-dossier-avatar-editor{width:74px;height:74px;margin-top:-35px;margin-bottom:20px}
.client-dossier-cover:not([hidden])+.task-dossier-body .client-dossier-avatar-editor>.client-dossier-avatar{margin:0}
@media(max-width:580px){
  .client-dossier-avatar-editor{width:54px;height:54px}
  .client-dossier-cover:not([hidden])+.task-dossier-body .client-dossier-avatar-editor{width:66px;height:66px;margin-top:-30px;margin-bottom:17px}
}
@media(hover:none),(pointer:coarse){
  .client-dossier-avatar-editor>.client-avatar-remove{width:28px;height:28px;min-width:28px;min-height:28px;opacity:1;pointer-events:auto;transform:none}
}
@media(prefers-reduced-motion:no-preference){
  .client-dossier-avatar-editor>button.client-dossier-avatar{transition:border-color 120ms ease,box-shadow 120ms ease}
  .client-avatar-remove{transition:opacity 120ms ease,transform 120ms ease,background-color 120ms ease,border-color 120ms ease}
}
@media(forced-colors:active){.client-avatar-remove{background:ButtonFace;color:ButtonText;border-color:ButtonText;box-shadow:none}}

/* Client identity keeps the single editable phone quietly below the name. */
.client-dossier-heading>.client-dossier-identity{flex:1;min-width:0;width:100%;max-width:100%}
.client-dossier-heading>.client-dossier-identity>h2{min-width:0;margin:0;color:#eef0f1;font-size:34px;font-weight:700;line-height:1.25;letter-spacing:-.8px;overflow-wrap:anywhere}
.client-dossier-heading-phone{display:flex;align-items:center;gap:6px;min-width:0;max-width:100%;margin-top:4px;color:var(--muted,#a6a6ad)}
.client-dossier-heading-phone>.icon{width:16px;height:16px;flex:0 0 16px;color:inherit}
.client-dossier-heading-phone>#field-phone{display:block;width:190px;min-width:0;max-width:calc(100% - 22px);height:27px;min-height:27px;padding:3px 6px;box-sizing:border-box;border:1px solid var(--editable-field-border,#ffffff12);border-radius:var(--editable-field-radius,6px);background:transparent;font-size:13.5px;font-weight:500;line-height:1.5;color:#c4c6cb}
.client-dossier-heading-phone>#field-phone::placeholder{color:var(--muted,#a6a6ad);opacity:.7}
.client-dossier-heading-phone>#field-phone:focus{color:var(--ink,#eeeef0);border-color:var(--editable-field-focus,#cfb573);background:var(--glass-control,#ffffff04)}
.client-dossier-heading-phone>#field-phone:disabled{opacity:1;background:transparent;color:var(--muted,#a6a6ad);border-color:transparent}
@media(max-width:800px){.client-dossier-heading>.client-dossier-identity>h2{font-size:30px}}
@media(max-width:580px){.client-dossier-heading>.client-dossier-identity>h2{font-size:26px;letter-spacing:-.5px;line-height:1.3}.client-dossier-heading-phone>#field-phone{font-size:12.5px}}

/* These computed profile values share one inset and quiet readout outline. */
.client-dossier-modal #client-panel-client .task-property:has(>.task-property-value>.client-state-display){align-items:center}
.client-dossier-modal #client-panel-client .task-property-value>.client-state-display{display:flex;align-items:center;width:100%;min-width:0;max-width:100%;min-height:31px;padding:4px 7px;box-sizing:border-box;border:1px solid var(--editable-field-border,#ffffff12);border-radius:var(--editable-field-radius,6px);font-size:12px;line-height:1.5;color:var(--muted,#a6a6ad)}
.client-dossier-modal #client-panel-client #client-contact-timer>.client-contact-timer{width:100%;min-width:0;padding:0}
.client-dossier-modal #client-panel-client .client-state-display .client-first-contact,.client-dossier-modal #client-panel-client .client-state-display .record-state{font-size:12px;line-height:1.5;max-width:100%}
.client-dossier-modal #client-panel-client .client-state-display .record-state-text{min-width:0;overflow-wrap:anywhere}
@media(max-width:580px){.client-dossier-modal #client-panel-client .task-property-value>.client-state-display,.client-dossier-modal #client-panel-client .client-state-display .client-first-contact,.client-dossier-modal #client-panel-client .client-state-display .record-state{font-size:11px}}

/* This secondary Details control belongs only to the client profile toolbar. */
.client-profile-dossier .record-header-tools>.client-details-chevron{order:99;margin-left:auto;flex:0 0 32px;width:32px;height:32px;min-width:32px;min-height:32px;padding:7px;border:1px solid #ffffff12;border-radius:6px;background:var(--glass-control,#ffffff04);color:var(--muted,#a6a6ad)}
.client-profile-dossier .record-header-tools>.client-details-chevron:hover{color:var(--ink,#eeeef0);border-color:#cfb57360;background:#ffffff06}
.client-profile-dossier .record-header-tools>.client-details-chevron:focus-visible{outline:2px solid var(--gold,#cfb573);outline-offset:3px}
.client-profile-dossier .client-details-chevron>.icon{width:16px;height:16px;transform:rotate(0deg);transition:transform var(--motion-details,200ms) var(--motion-ease,ease)}
.client-profile-dossier .client-details-chevron[aria-expanded=true]>.icon{transform:rotate(180deg)}
@keyframes client-profile-details-in{from{opacity:.35;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0)}}
@keyframes client-profile-details-out{from{opacity:1;clip-path:inset(0)}to{opacity:0;clip-path:inset(0 0 0 100%)}}
.client-profile-dossier .client-details-panel.is-details-opening:not([hidden]){animation:client-profile-details-in var(--motion-details,200ms) var(--motion-ease,ease)}
.client-profile-dossier .client-details-panel.is-details-closing:not([hidden]){animation:client-profile-details-out var(--motion-details,200ms) var(--motion-ease,ease) forwards}
@media(prefers-reduced-motion:reduce){.client-profile-dossier .client-details-chevron>.icon{transition:none}.client-profile-dossier .client-details-panel.is-details-opening:not([hidden]),.client-profile-dossier .client-details-panel.is-details-closing:not([hidden]){animation:none}}

/* Keep inquiry avatars and contact glyphs centered beside their selected names. */
.client-profile-dossier .relation-summary:has(>.record-avatar),.client-profile-dossier .relation-summary:has(>.custom-option-icon),.client-profile-dossier .relation-summary:has(>.icon){display:flex;align-items:center;gap:6px;min-width:0;line-height:20px}
.client-profile-dossier .relation-summary>.relation-selected-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.client-profile-dossier .relation-summary>.icon{width:16px;height:16px;flex:0 0 16px}
.client-profile-dossier .relation-selected-more,.client-profile-dossier .relation-picker .relation-count{flex:0 0 auto;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;font-size:10.5px;font-weight:400;line-height:1;color:var(--muted,#a6a6ad)}
.client-profile-dossier .relation-summary:has(>.record-avatar)~.relation-count,.client-profile-dossier .relation-summary:has(>.custom-option-icon)~.relation-count,.client-profile-dossier .relation-summary:has(>.icon)~.relation-count{display:none}