/* Shared close control: keep all icon-only variants here, including runtime dialogs.
   New close controls use .ui-close and an accessible label. Labeled controls
   use .ui-close-label with an aria-hidden .ui-close-icon child. */
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close) {
 display: inline-flex; align-items: center; justify-content: center;
 box-sizing: border-box; width: 44px; height: 44px; min-width: 44px; min-height: 44px;
 flex: 0 0 44px; padding: 0; border-radius: 50%; font-size: 0; line-height: 1;
 color: var(--text, #eee); background: var(--control, #292929); cursor: pointer;
 transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close) > svg { display: none; }
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close)::before,
:root body :is(.ui-close-icon,.document-modal-close > [aria-hidden])::before {
 content: ''; display: block; flex: 0 0 16px; width: 16px; height: 16px;
 background: currentColor;
 mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 6 12 12M18 6 6 18' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
:root body :is(.ui-close-icon,.document-modal-close > [aria-hidden]) {
 display: inline-flex; align-items: center; justify-content: center;
 width: 16px; height: 16px; flex: 0 0 16px; font-size: 0; line-height: 1; vertical-align: middle;
}
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close):hover,
:root body :is(.ui-close-label,.document-modal-close,.workspace-menu-close):hover,
:root #courier-share .courier-share-close:hover,
:root[data-admin-theme] #courier-share .courier-share-close:hover,
:root body.admin .document-modal .document-modal-close:hover {
 background: color-mix(in srgb, var(--text, #eee) 14%, var(--control, #292929));
 color: var(--text, #eee);
 box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text, #eee) 20%, transparent);
}
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close):active {
 background: color-mix(in srgb, var(--text, #eee) 22%, var(--control, #292929));
}
:root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close):focus-visible {
 outline: 2px solid var(--focus-indicator, #a8b3c2); outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
 :root body :is(.ui-close,.entity-dialog-close,.store-dialog-head > button,.member-dialog-close,.modal-close:not(.document-modal-close),.viewer-close,.first-steps-banner-close,.ib-close,button[data-courier-close],.pq-close) { transition: none; }
}

:root #courier-share .courier-share-close { width: 44px; height: 44px; flex-basis: 44px; }
