@db-ux/core-components 4.14.0-shell-52d18db → 5.0.0

package/build/components/control-panel-mobile/control-panel-mobile.css

@@ -1,442 +0,0 @@
-/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */
-/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */
-/* Variants for adaptive components like input, select, notification, ... */
-/* Sub components for shell */
-@keyframes popover-animation {
-  0% {
-    pointer-events: none;
-    opacity: 0;
-    transform: translate(var(--db-popover-center-x, var(--db-popover-translate-x, 0%)), var(--db-popover-center-y, var(--db-popover-translate-y, 0%)));
-  }
-  100% {
-    pointer-events: auto;
-    opacity: 1;
-    transform: translate(var(--db-popover-center-x, 0%), var(--db-popover-center-y, 0%));
-  }
-}
-@keyframes rotate {
-  100% {
-    transform: rotate(1turn);
-  }
-}
-dialog {
-  padding: 0;
-  margin: 0;
-  border: 0;
-  z-index: 9996;
-  color: inherit;
-}
-dialog:not([data-position=absolute])[data-variant], dialog:not([data-position=absolute])[data-backdrop] {
-  position: fixed;
-  inset: 0;
-  z-index: 9995;
-}
-dialog:not([data-position=absolute])[data-variant=inside]:not([data-backdrop=none])::before {
-  content: "";
-  position: fixed;
-  inset: 0;
-}
-dialog:not([data-backdrop=none])::backdrop, dialog:not([data-backdrop=none])::before {
-  background-color: color(from var(--db-adaptive-on-bg-basic-emphasis-100-default) srgb r g b/var(--db-opacity-lg));
-}
-dialog:not([data-backdrop=none])[data-backdrop=invisible]::backdrop, dialog:not([data-backdrop=none])[data-backdrop=invisible]::before {
-  background-color: transparent;
-}
-dialog:not([data-backdrop=none])[data-backdrop=weak]::backdrop, dialog:not([data-backdrop=none])[data-backdrop=weak]::before {
-  background-color: color(from var(--db-adaptive-on-bg-basic-emphasis-100-default) srgb r g b/var(--db-opacity-sm));
-}
-
-.db-drawer .db-drawer-container:not([data-direction]), .db-drawer .db-drawer-container[data-direction=to-left], .db-drawer .db-drawer-container[data-direction=to-right] {
-  inline-size: calc(100lvw - var(--db-drawer-container-backdrop-spacing, 0px));
-  min-inline-size: var(--db-drawer-min-width, auto);
-  max-inline-size: var(--db-drawer-max-width, var(--db-drawer-max-width-horizontal));
-}
-.db-drawer .db-drawer-container:not([data-container-size]):not([data-direction]), .db-drawer .db-drawer-container[data-direction=to-left]:not([data-container-size]), .db-drawer .db-drawer-container[data-direction=to-right]:not([data-container-size]), .db-drawer [data-container-size=small].db-drawer-container:not([data-direction]), .db-drawer [data-container-size=small].db-drawer-container[data-direction=to-left], .db-drawer [data-container-size=small].db-drawer-container[data-direction=to-right] {
-  --db-drawer-max-width-horizontal: var(--db-container-xs);
-}
-.db-drawer [data-container-size=medium].db-drawer-container:not([data-direction]), .db-drawer [data-container-size=medium].db-drawer-container[data-direction=to-left], .db-drawer [data-container-size=medium].db-drawer-container[data-direction=to-right] {
-  --db-drawer-max-width-horizontal: var(--db-container-lg);
-}
-.db-drawer [data-container-size=large].db-drawer-container:not([data-direction]), .db-drawer [data-container-size=large].db-drawer-container[data-direction=to-left], .db-drawer [data-container-size=large].db-drawer-container[data-direction=to-right] {
-  --db-drawer-max-width-horizontal: var(--db-container-3xl);
-}
-
-.db-drawer .db-drawer-container[data-direction=down], .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > .db-drawer-container, .db-drawer .db-drawer-container[data-direction=up] {
-  block-size: calc(100lvh - var(--db-drawer-container-backdrop-spacing, 0px));
-  min-block-size: var(--db-drawer-min-height, auto);
-  max-block-size: var(--db-drawer-max-height, var(--db-drawer-max-height-vertical));
-}
-.db-drawer [data-container-size=small].db-drawer-container[data-direction=down], .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > [data-container-size=small].db-drawer-container, .db-drawer [data-container-size=small].db-drawer-container[data-direction=up] {
-  --db-drawer-max-height-vertical: 33lvh;
-}
-.db-drawer [data-container-size=medium].db-drawer-container[data-direction=down], .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > [data-container-size=medium].db-drawer-container, .db-drawer [data-container-size=medium].db-drawer-container[data-direction=up] {
-  --db-drawer-max-height-vertical: 50lvh;
-}
-.db-drawer .db-drawer-container[data-direction=down]:not([data-container-size]), .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > .db-drawer-container:not([data-container-size]), .db-drawer .db-drawer-container[data-direction=up]:not([data-container-size]), .db-drawer [data-container-size=large].db-drawer-container[data-direction=down], .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > [data-container-size=large].db-drawer-container, .db-drawer [data-container-size=large].db-drawer-container[data-direction=up] {
-  --db-drawer-max-height-vertical: 67lvh;
-}
-
-.db-drawer .db-drawer-container[data-direction=to-right]:not([data-transition=open]) {
-  transform: translateX(-110%);
-}
-.db-drawer .db-drawer-container[data-direction=to-right] {
-  inset-inline: 0 auto;
-}
-.db-drawer [data-rounded=true].db-drawer-container[data-direction=to-right] {
-  border-start-end-radius: var(--db-border-radius-sm);
-  border-end-end-radius: var(--db-border-radius-sm);
-}
-
-.db-drawer .db-drawer-container:not([data-transition=open]):not([data-direction]), .db-drawer .db-drawer-container[data-direction=to-left]:not([data-transition=open]) {
-  transform: translateX(110%);
-}
-.db-drawer .db-drawer-container:not([data-direction]), .db-drawer .db-drawer-container[data-direction=to-left] {
-  inset-inline: auto 0;
-}
-.db-drawer [data-rounded=true].db-drawer-container:not([data-direction]), .db-drawer [data-rounded=true].db-drawer-container[data-direction=to-left] {
-  border-start-start-radius: var(--db-border-radius-sm);
-  border-end-start-radius: var(--db-border-radius-sm);
-}
-
-.db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > .db-drawer-container:not([data-transition=open]), .db-drawer .db-drawer-container[data-direction=up]:not([data-transition=open]) {
-  transform: translateY(110%);
-}
-.db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > .db-drawer-container, .db-drawer .db-drawer-container[data-direction=up] {
-  inset: auto 0 0;
-}
-.db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > [data-rounded=true].db-drawer-container, .db-drawer [data-rounded=true].db-drawer-container[data-direction=up] {
-  border-start-end-radius: var(--db-border-radius-sm);
-  border-start-start-radius: var(--db-border-radius-sm);
-}
-
-.db-drawer .db-drawer-container[data-direction=down]:not([data-transition=open]) {
-  transform: translateY(-110%);
-}
-.db-drawer .db-drawer-container[data-direction=down] {
-  inset: 0 0 auto;
-}
-.db-drawer [data-rounded=true].db-drawer-container[data-direction=down] {
-  border-end-end-radius: var(--db-border-radius-sm);
-  border-end-start-radius: var(--db-border-radius-sm);
-}
-
-.db-drawer .db-drawer-container:not(:has(.db-drawer-footer)) > .db-drawer-content {
-  margin-block-end: env(safe-area-inset-bottom);
-}
-.db-drawer .db-drawer-container:has(.db-drawer-footer) .db-drawer-footer {
-  padding-block-end: calc(var(--db-spacing-fixed-xs) + env(safe-area-inset-bottom));
-}
-
-.db-drawer .db-drawer-container {
-  --db-drawer-close-delay: 0;
-}
-@media (prefers-reduced-motion: no-preference) {
-  .db-drawer .db-drawer-container {
-    --db-drawer-close-delay: var(--db-transition-duration-slow);
-  }
-}
-.db-drawer .db-drawer-container {
-  display: grid;
-  grid-template-rows: [header] auto [main] 1fr [footer] auto;
-  background-color: var(--db-adaptive-bg-basic-level-1-default);
-  inline-size: 100lvw;
-  block-size: 100lvh;
-  position: fixed;
-  box-shadow: var(--db-elevation-md);
-}
-.db-drawer .db-drawer-container > .db-drawer-content {
-  overflow-y: auto;
-  overscroll-behavior: contain;
-  padding: var(--db-drawer-content-padding, var(--db-spacing-fixed-xs) max(var(--db-spacing-fixed-sm), max(env(safe-area-inset-left), env(safe-area-inset-right))));
-}
-.db-drawer .db-drawer-container[data-show-spacing=true] {
-  --db-drawer-container-backdrop-spacing: var(--db-sizing-md);
-}
-.db-drawer .db-drawer-container[data-show-spacing=true]:not([data-direction]), .db-drawer .db-drawer-container[data-show-spacing=true][data-direction=to-left] {
-  border-inline-end: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-}
-.db-drawer .db-drawer-container[data-show-spacing=true][data-direction=to-right] {
-  border-inline-start: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-}
-.db-drawer .db-drawer-container[data-show-spacing=true][data-direction=up] {
-  border-block-start: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-}
-.db-drawer .db-drawer-container[data-show-spacing=true][data-direction=down] {
-  border-block-end: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-}
-.db-drawer .db-drawer-container[data-rounded=true] {
-  box-shadow: var(--db-elevation-md);
-}
-@media (prefers-reduced-motion: no-preference) {
-  .db-drawer .db-drawer-container {
-    transition: transform var(--db-transition-duration-extra-slow) var(--db-transition-timing-emotional);
-  }
-}
-.db-drawer[data-position=absolute] {
-  position: absolute;
-  z-index: 3;
-  inset: 0;
-  block-size: 100%;
-  inline-size: 100%;
-  background-color: transparent;
-}
-.db-drawer[data-position=absolute][open] {
-  display: flex;
-}
-.db-drawer[data-position=absolute]:not([data-direction]), .db-drawer[data-position=absolute][data-direction=to-right], .db-drawer[data-position=absolute][data-direction=to-left] {
-  flex-direction: column;
-}
-.db-drawer[data-position=absolute][data-direction=to-right], .db-drawer[data-position=absolute][data-direction=down] {
-  align-items: flex-start;
-}
-.db-drawer[data-position=absolute]:not([data-direction]), .db-drawer[data-position=absolute][data-direction=to-left], .db-drawer[data-position=absolute][data-direction=up] {
-  align-items: flex-end;
-}
-.db-drawer[data-position=absolute] .db-drawer-container {
-  position: relative;
-}
-.db-drawer[open] .db-drawer-container[data-transition=open] {
-  transform: none;
-}
-@media (prefers-reduced-motion: no-preference) {
-  .db-drawer[open] .db-drawer-container[data-transition=close] {
-    transition: transform var(--db-drawer-close-delay) var(--db-transition-timing-emotional);
-  }
-}
-
-.db-control-panel-mobile[data-position=top] {
-  border-block-end: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-  grid-template-areas: var(--db-control-panel-mobile-position-top-grid-areas, "brand primary drawer-button");
-  grid-template-columns: var(--db-control-panel-mobile-position-top-grid-columns, [brand] 1fr [primary] min-content [drawer-button] min-content);
-  justify-items: center;
-  padding-block: calc(var(--db-spacing-fixed-xs) + env(safe-area-inset-top)) var(--db-spacing-fixed-xs);
-}
-.db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions {
-  padding-inline-end: var(--db-spacing-fixed-xs);
-  --db-divider-bg-color: var(--db-adaptive-on-bg-basic-emphasis-60-default);
-  position: var(--db-tooltip-parent-position, relative);
-}
-.db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions[data-emphasis=strong] {
-  --db-divider-bg-color: var(--db-adaptive-on-bg-basic-emphasis-70-default);
-}
-.db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions::before {
-  content: "";
-  background-color: var(--db-divider-bg-color);
-  position: absolute;
-  /* jscpd:ignore-start */
-  inline-size: var(--db-border-width-3xs);
-  inset-inline-end: 0;
-  inset-block: 0;
-  /* stylelint-disable-next-line db-ux/use-border-color */
-}
-@media (forced-colors: active) {
-  .db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions::before {
-    /* stylelint-disable-next-line db-ux/use-border-color */
-    border-inline-end: var(--db-border-width-3xs) solid var(--db-divider-bg-color);
-  }
-}
-.db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions::before {
-  /* jscpd:ignore-end */
-}
-.db-control-panel-mobile[data-position=top] .db-control-panel-primary-actions::before {
-  margin-inline-start: var(--db-spacing-fixed-xs);
-}
-
-.db-control-panel-mobile[data-position=bottom] {
-  border-block-start: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-  grid-template-areas: "brand drawer-button primary";
-  grid-template-columns: minmax(var(--db-sizing-md), min-content) 1fr minmax(var(--db-sizing-md), min-content);
-  justify-content: space-evenly;
-  padding-block: var(--db-spacing-fixed-xs) calc(var(--db-spacing-fixed-xs) + env(safe-area-inset-bottom));
-  /* jscpd:ignore-start */
-}
-.db-control-panel-mobile[data-position=bottom] .db-control-panel-brand {
-  inline-size: var(--db-sizing-md);
-  overflow: hidden;
-}
-.db-control-panel-mobile[data-position=bottom] .db-control-panel-brand::before {
-  aspect-ratio: var(--db-logo-aspect-ratio-short, var(--db-logo-aspect-ratio));
-  background-image: var(--db-logo-url-short, var(--db-logo-url));
-}
-.db-control-panel-mobile[data-position=bottom] {
-  /* jscpd:ignore-end */
-}
-.db-control-panel-mobile[data-position=bottom] > db-button > .db-control-panel-mobile-button,
-.db-control-panel-mobile[data-position=bottom] > .db-control-panel-mobile-button {
-  place-self: center;
-}
-.db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) {
-  --db-drawer-max-height: 67lvh;
-}
-.db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container) > .db-drawer-container {
-  border-block-start: var(--db-border-width-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
-  border-inline-end: 0;
-  inline-size: 100lvw;
-  max-inline-size: 100lvw;
-}
-@media screen and (prefers-reduced-motion: no-preference) {
-  .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container)[open] .db-drawer-container {
-    animation: show-bottom-to-top var(--db-transition-straight-show);
-  }
-}
-@media screen and (prefers-reduced-motion: no-preference) {
-  .db-control-panel-mobile[data-position=bottom] .db-drawer:has(.db-control-panel-mobile-drawer-scroll-container)[open] .db-drawer-container[hidden] {
-    animation: hide-bottom-to-top var(--db-transition-straight-hide);
-  }
-}
-
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group::after {
-  content: "";
-  position: absolute;
-  border-radius: var(--db-border-radius-xs);
-  background: linear-gradient(135deg, var(--db-pride-red, var(--db-brand-on-bg-basic-emphasis-70-default)) 16.7%, var(--db-pride-orange, var(--db-brand-on-bg-basic-emphasis-70-default)) 0, var(--db-pride-orange, var(--db-brand-on-bg-basic-emphasis-70-default)) 33.4%, var(--db-pride-yellow, var(--db-brand-on-bg-basic-emphasis-70-default)) 0, var(--db-pride-yellow, var(--db-brand-on-bg-basic-emphasis-70-default)) 50.1%, var(--db-pride-green, var(--db-brand-on-bg-basic-emphasis-70-default)) 0, var(--db-pride-green, var(--db-brand-on-bg-basic-emphasis-70-default)) 66.8%, var(--db-pride-blue, var(--db-brand-on-bg-basic-emphasis-70-default)) 0, var(--db-pride-blue, var(--db-brand-on-bg-basic-emphasis-70-default)) 83.5%, var(--db-pride-violet, var(--db-brand-on-bg-basic-emphasis-70-default)) 0);
-}
-@media (prefers-reduced-motion: no-preference) {
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item::after,
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group::after {
-    transition: block-size var(--db-transition-duration-fast) var(--db-transition-timing-emotional), inline-size var(--db-transition-duration-fast) var(--db-transition-timing-emotional);
-  }
-}
-
-.db-control-panel-mobile {
-  background-color: var(--db-adaptive-bg-basic-level-1-default);
-  display: grid;
-  position: relative;
-  min-block-size: calc(var(--db-sizing-md) + 2 * var(--db-spacing-fixed-xs));
-  gap: var(--db-spacing-fixed-xs);
-  padding-inline: var(--db-spacing-fixed-sm);
-  grid-area: control-panel;
-}
-.db-control-panel-mobile .db-control-panel-brand {
-  justify-self: self-start;
-  inline-size: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.db-control-panel-mobile .db-control-panel-mobile-button {
-  grid-area: drawer-button;
-}
-.db-control-panel-mobile:has(.db-control-panel-mobile-drawer-scroll-container:empty):not(:has(.db-control-panel-secondary-actions)) {
-  --db-control-panel-mobile-position-top-grid-areas: "brand primary";
-  --db-control-panel-mobile-position-top-grid-columns: [brand] 1fr
-  	[primary] min-content;
-}
-.db-control-panel-mobile:has(.db-control-panel-mobile-drawer-scroll-container:empty):not(:has(.db-control-panel-secondary-actions)) .db-control-panel-mobile-button {
-  display: none;
-}
-.db-control-panel-mobile:has(.db-control-panel-mobile-drawer-scroll-container:empty):not(:has(.db-control-panel-secondary-actions)) .db-control-panel-primary-actions {
-  padding-inline-end: 0;
-}
-.db-control-panel-mobile:has(.db-control-panel-mobile-drawer-scroll-container:empty):not(:has(.db-control-panel-secondary-actions)) .db-control-panel-primary-actions::before {
-  display: none;
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer:not(:has(.db-control-panel-secondary-actions)) .db-drawer-footer {
-  display: none;
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content {
-  padding: 0;
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container {
-  display: flex;
-  flex-direction: column;
-  block-size: 100%;
-  overflow-x: hidden;
-  /* jscpd:ignore-start */
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-meta {
-  /* stylelint-disable-next-line db-ux/use-spacings */
-  padding: var(--db-spacing-fixed-xs) max(var(--db-spacing-fixed-sm), max(env(safe-area-inset-left), env(safe-area-inset-right)));
-  margin-block-start: auto;
-  flex-flow: column nowrap;
-  --db-divider-bg-color: var(--db-adaptive-on-bg-basic-emphasis-60-default);
-  position: var(--db-tooltip-parent-position, relative);
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-meta[data-emphasis=strong] {
-  --db-divider-bg-color: var(--db-adaptive-on-bg-basic-emphasis-70-default);
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-meta::before {
-  content: "";
-  background-color: var(--db-divider-bg-color);
-  position: absolute;
-  /* jscpd:ignore-start */
-  block-size: var(--db-border-width-3xs);
-  inset-block-start: 0;
-  inset-inline: 0;
-  /* stylelint-disable-next-line db-ux/use-border-color */
-}
-@media (forced-colors: active) {
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-meta::before {
-    /* stylelint-disable-next-line db-ux/use-border-color */
-    border-block-start: var(--db-border-width-3xs) solid var(--db-divider-bg-color);
-  }
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-meta::before {
-  /* stylelint-disable-next-line at-rule-empty-line-before */
-  /* jscpd:ignore-end */
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container {
-  /* jscpd:ignore-end */
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation {
-  /* stylelint-disable-next-line db-ux/use-spacings */
-  padding: var(--db-spacing-fixed-xs) max(var(--db-spacing-fixed-sm), max(env(safe-area-inset-left), env(safe-area-inset-right)));
-  /* jscpd:ignore-start */
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group::after {
-  block-size: 0;
-  inline-size: var(--db-border-width-xs);
-  transform: translate(0, -50%);
-  inset-block: var(--indicator-vertical-inset-block-start, 50%) auto;
-  inset-inline-start: calc(-1 * var(--db-spacing-fixed-xs));
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item[data-active=true]::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([aria-current=page])::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([data-active=true])::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[aria-current=page]::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group[data-active=true]::after {
-  block-size: var(--indicator-vertical-block-size, 100%);
-  inline-size: var(--db-border-width-xs);
-}
-@media (forced-colors: active), print {
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item[data-active=true]::after,
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([aria-current=page])::after,
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([data-active=true])::after,
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[aria-current=page]::after,
-  .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group[data-active=true]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group:has([aria-current=page])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group:has([data-active=true])::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group[aria-current=page]::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group[data-active=true]::after {
-    border: calc(var(--db-border-width-xs) - 1px) solid var(--db-adaptive-on-bg-basic-emphasis-100-default);
-  }
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group {
-  /* Workaround for custom-elements */
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item > .db-control-panel-navigation-item-group::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > db-control-panel-navigation-item > .db-control-panel-navigation-item::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item::after,
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > * > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after, .db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation > menu > .db-control-panel-navigation-item-group > .db-control-panel-navigation-item-group::after {
-  content: none;
-}
-.db-control-panel-mobile .db-control-panel-mobile-drawer .db-drawer-content .db-control-panel-mobile-drawer-scroll-container .db-control-panel-navigation {
-  /* jscpd:ignore-end */
-}

package/build/components/control-panel-mobile/control-panel-mobile.scss

@@ -1,119 +0,0 @@
-@use "sass:string";
-@use "@db-ux/core-foundations/build/styles/variables";
-@use "@db-ux/core-foundations/build/styles/screen-sizes";
-@use "@db-ux/core-foundations/build/styles/helpers";
-@use "@db-ux/core-foundations/build/styles/colors";
-@use "../../styles/internal/component";
-@use "../../styles/internal/custom-elements";
-@use "../../styles/internal/control-panel-mobile";
-@use "../../styles/internal/navigation-item";
-@use "../../styles/internal/indicator";
-
-.db-control-panel-mobile {
-	background-color: colors.$db-adaptive-bg-basic-level-1-default;
-	display: grid;
-	position: relative;
-	min-block-size: component.$min-mobile-header-height;
-	gap: variables.$db-spacing-fixed-xs;
-	padding-inline: variables.$db-spacing-fixed-sm;
-	grid-area: control-panel;
-
-	&[data-position="top"] {
-		@extend %control-panel-mobile-position-top;
-	}
-
-	&[data-position="bottom"] {
-		@extend %control-panel-mobile-position-bottom;
-	}
-
-	.db-control-panel-brand {
-		justify-self: self-start;
-		inline-size: 100%;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-	}
-
-	.db-control-panel-mobile-button {
-		grid-area: drawer-button;
-	}
-
-	@include control-panel-mobile.has-empty-drawer {
-		--db-control-panel-mobile-position-top-grid-areas: "brand primary";
-		--db-control-panel-mobile-position-top-grid-columns: [brand] 1fr
-			[primary] min-content;
-
-		// If drawer is empty we hide burger button
-		.db-control-panel-mobile-button {
-			display: none;
-		}
-
-		// We don't show primary border in this case
-		.db-control-panel-primary-actions {
-			padding-inline-end: 0;
-
-			&::before {
-				display: none;
-			}
-		}
-	}
-
-	.db-control-panel-mobile-drawer {
-		&:not(:has(.db-control-panel-secondary-actions)) {
-			.db-drawer-footer {
-				display: none;
-			}
-		}
-
-		.db-drawer-content {
-			padding: 0;
-
-			.db-control-panel-mobile-drawer-scroll-container {
-				display: flex;
-				flex-direction: column;
-				block-size: 100%;
-				overflow-x: hidden;
-
-				/* jscpd:ignore-start */
-				.db-control-panel-meta {
-					/* stylelint-disable-next-line db-ux/use-spacings */
-					padding: variables.$db-spacing-fixed-xs
-						component.$drawer-content-padding-inline;
-					margin-block-start: auto;
-					flex-flow: column nowrap;
-
-					@include helpers.divider("top");
-				}
-
-				/* jscpd:ignore-end */
-
-				.db-control-panel-navigation {
-					/* stylelint-disable-next-line db-ux/use-spacings */
-					padding: variables.$db-spacing-fixed-xs
-						component.$drawer-content-padding-inline;
-
-					/* jscpd:ignore-start */
-					> menu {
-						@include navigation-item.direct-navigation-items {
-							@extend %indicator;
-							@include indicator.set-indicator-vertical;
-
-							@include navigation-item.active-navigation-item {
-								@include indicator.show-indicator-vertical;
-							}
-
-							@include navigation-item.direct-navigation-items {
-								/* Workaround for custom-elements */
-								&::after {
-									content: none;
-								}
-							}
-						}
-					}
-
-					/* jscpd:ignore-end */
-				}
-			}
-		}
-	}
-}