@charset "utf-8";

.ods-c-header-icon { display: flex; align-items: end; gap: var(--space-padding-S); }

.ods-c-header-icon__ico { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--color-header-iconBackgroundOld); color: var(--color-header-iconOld); transition: 0.3s ease-in-out; cursor: pointer; }

.ods-c-header-icon__ico:hover { color: var(--color-header-iconHoverOld); background: var(--color-header-iconBackgroundHoverOld); }

.ods-c-header-icon__ico.ods-active-services-menu { background-color: inherit; }

.ods-c-header-icon__ico.ods-active-services-menu .ods-c-header-icon__service-nav-svg { display: none; }

.ods-c-header-icon__ico.ods-active-services-menu .ods-c-header-icon__service-nav-close-btn-active { display: block; }

.ods-c-header-icon__svg, .ods-c-header-icon__service-nav-close-btn-active, .ods-c-header-icon__service-nav-svg { width: 24px; height: 24px; pointer-events: none; }

.ods-c-header-icon__service-mailbox-svg { pointer-events: auto; }

.ods-c-header-icon__service-nav-close-btn-active { display: none; position: relative; }

.ods-c-header-icon__service-nav-close-btn-active .ods-c-header-icon__close-btn-slice { display: block; position: absolute; margin-top: 4px; height: 2px; width: 18px; background: var(--color-neutral-90); border-radius: 4px; opacity: 1; left: 5px; transform-origin: left center; }

.ods-c-header-icon__service-nav-close-btn-active .ods-c-header-icon__close-btn-slice:first-child { top: 1px; transform: rotate(42deg); }

.ods-c-header-icon__service-nav-close-btn-active .ods-c-header-icon__close-btn-slice:last-child { top: 13px; transform: rotate(-42deg); }