.custom-modal-host{--spacing-x: var(--telekom-spacing-composition-space-06);--background-overlay: var( --telekom-color-background-backdrop, rgba(108, 108, 108, .7) );--max-height-window: calc( 100vh - (2 * var(--telekom-spacing-composition-space-19)) );--min-height-window: ;--radius-window: var(--telekom-radius-large);--box-shadow-window: var(--telekom-shadow-top);--background-window: var(--telekom-color-background-surface);--color-window: var(--telekom-color-text-and-icon-standard);--size-window-small: calc( (6 * var(--telekom-spacing-unit-x14, 3.5rem)) + (5 * var(--telekom-spacing-composition-space-10)) );--size-window-default: calc( (8 * var(--telekom-spacing-unit-x14, 3.5rem)) + (7 * var(--telekom-spacing-composition-space-10)) );--size-window-large: calc( (12 * var(--telekom-spacing-unit-x14, 3.5rem)) + (11 * var(--telekom-spacing-composition-space-10)) );--spacing-x-header: var(--telekom-spacing-composition-space-08);--spacing-y-header: var(--telekom-spacing-composition-space-08);--border-bottom-header-has-scroll: var(--telekom-line-weight-standard) solid var(--telekom-color-ui-subtle);--font-family-heading: var(--telekom-typography-font-family-sans);--font-size-heading: var(--telekom-typography-font-size-callout);--font-weight-heading: var(--telekom-typography-font-weight-extra-bold);--spacing-close-button: var(--telekom-spacing-composition-space-04);--radius-close-button: var(--telekom-radius-standard);--transition-close-button: all var(--telekom-motion-duration-transition) var(--telekom-motion-easing-standard);--box-shadow-close-button-focus: 0 0 0 var(--telekom-line-weight-highlight) var(--telekom-color-functional-focus-standard);--color-close-button: var(--telekom-color-text-and-icon-standard);--color-close-button-hover: var(--telekom-color-primary-hovered);--color-close-button-active: var(--telekom-color-primary-pressed);--spacing-x-body-wrapper: var(--telekom-spacing-composition-space-08);--spacing-y-body: var(--telekom-spacing-composition-space-08);--spacing-actions: var(--telekom-spacing-composition-space-06) var(--telekom-spacing-composition-space-08) var(--telekom-spacing-composition-space-08);--spacing-x-actions-slotted: var(--telekom-spacing-composition-space-04);--background-actions-has-scroll: var( --telekom-color-background-surface-subtle )}.custom-modal-host .modal{top:0;left:0;width:100%;bottom:0;display:none;z-index:100;position:fixed;box-sizing:border-box;align-items:center;justify-content:center;padding-left:var(--spacing-x);padding-right:var(--spacing-x)}.custom-modal-host .modal.modal--is-open{display:flex}.custom-modal-host .modal__backdrop{top:0;left:0;width:100%;height:100%;z-index:0;position:absolute;background:var(--background-overlay)}.custom-modal-host .modal__window{width:100%;height:auto;display:flex;z-index:1;position:relative;overflow-y:auto;flex-direction:column;background-color:var(--background-window);color:var(--color-window);max-height:var(--max-height-window);min-height:var(--min-height-window);border-radius:var(--radius-window);box-shadow:var(--box-shadow-window)}.custom-modal-host .modal__window .modal__body-wrapper{overflow-y:auto;flex-shrink:1;flex-grow:1}.custom-modal-host .modal--size-small .modal__window{max-width:var(--size-window-small)}.custom-modal-host .modal--size-default .modal__window{max-width:var(--size-window-default)}.custom-modal-host .modal--size-large .modal__window{max-width:var(--size-window-large)}@media(max-height:30em){.custom-modal-host .modal__window{max-height:calc(100vh - var(--telekom-spacing-composition-space-08))}}.custom-modal-host .modal__window:after{top:0;left:0;width:100%;border:1px solid transparent;height:100%;content:"";display:block;position:absolute;box-sizing:border-box;pointer-events:none;border-radius:var(--radius-window)}.custom-modal-host .modal__header{display:flex;align-items:flex-start;flex-shrink:0;justify-content:space-between;margin-left:var(--spacing-x-header);margin-right:var(--spacing-x-header);padding-top:var(--spacing-y-header);padding-bottom:var(--spacing-y-header)}.custom-modal-host .modal--has-scroll .modal__header{border-bottom:var(--border-bottom-header-has-scroll)}.custom-modal-host .modal__heading{margin:0;font-family:var(--font-family-heading);font-size:var(--font-size-heading);font-weight:var(--font-weight-heading)}.custom-modal-host .modal__close-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-close-button);margin-bottom:calc(-2 * var(--spacing-close-button));border:0;border-radius:var(--radius-close-button);outline:none;color:var(--color-close-button);background:transparent;transition:var(--transition-close-button);transform:translate(var(--spacing-close-button),calc(-1 * var(--spacing-close-button)));-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.custom-modal-host .modal__close-button:focus{box-shadow:var(--box-shadow-close-button-focus)}.custom-modal-host .modal__close-button:hover{color:var(--color-close-button-hover)}.custom-modal-host .modal__close-button:active{color:var(--color-close-button-active)}.custom-modal-host .modal__body-wrapper{padding-left:var(--spacing-x-body-wrapper);padding-right:var(--spacing-x-body-wrapper)}.custom-modal-host .modal--has-body .modal__body-wrapper{min-height:var(--telekom-spacing-related-lg)}.custom-modal-host .modal--has-body .modal__body{margin-top:0;margin-bottom:0}.custom-modal-host .modal--has-body:not(.modal--has-actions) .modal__body{margin-bottom:var(--spacing-y-body)}.custom-modal-host .modal--has-scroll.modal--has-body .modal__body{margin-top:var(--spacing-y-body);margin-bottom:var(--spacing-y-body)}.custom-modal-host .modal__actions{display:none;flex-shrink:0;justify-content:flex-end;padding:var(--spacing-actions)}.custom-modal-host .modal--has-actions .modal__actions{display:flex}.custom-modal-host .modal--align-actions-left .modal__actions{justify-content:flex-start}.custom-modal-host .modal--align-actions-left .modal__actions>*{margin-left:0;margin-right:var(--spacing-x-actions-slotted)}.custom-modal-host .modal--has-scroll .modal__actions{background-color:var(--background-actions-has-scroll)}.custom-modal-host .modal__actions>*{margin-left:var(--spacing-x-actions-slotted)}