/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
/* The primary use-case for responsive spacings are
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
/* Elevation */
/* Border */
/* Transitions */
/* Variants for adaptive components like input, select, notification, ... */
.db-card {
  border: var(--db-border-height-3xs) solid var(--db-adaptive-on-bg-basic-emphasis-60-default);
}

.db-card {
  /* stylelint-disable-next-line db-ui/use-border-radius */
  border-radius: var(--default-card-border-radius, var(--db-border-radius-sm));
}

.db-card {
  /* stylelint-disable-next-line at-rule-empty-line-before */
  display: flex;
  flex-direction: column;
}
.db-card:not([data-spacing]) {
  padding: var(--db-spacing-fixed-sm);
}
.db-card[data-spacing=large] {
  padding: var(--db-spacing-fixed-lg);
}
.db-card[data-spacing=medium] {
  padding: var(--db-spacing-fixed-md);
}
.db-card[data-spacing=small] {
  padding: var(--db-spacing-fixed-sm);
}
.db-card[data-spacing=none] {
  padding: 0;
}
.db-card[data-elevation-level="1"], .db-card:not([data-elevation-level]) {
  background-color: var(--db-adaptive-bg-basic-level-1-default);
}
.db-card[data-elevation-level="1"][data-behaviour=interactive], .db-card:not([data-elevation-level])[data-behaviour=interactive] {
  /* stylelint-disable-next-line a11y/selector-pseudo-class-focus */
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]), .db-card:not([data-elevation-level])[data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-1-hovered);
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="1"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input), .db-card:not([data-elevation-level])[data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(textarea), .db-card:not([data-elevation-level])[data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="1"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)), .db-card:not([data-elevation-level])[data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card:not([data-elevation-level])[data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]), .db-card:not([data-elevation-level])[data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-1-pressed);
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="1"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input), .db-card:not([data-elevation-level])[data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(textarea), .db-card:not([data-elevation-level])[data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="1"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="1"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)), .db-card:not([data-elevation-level])[data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card:not([data-elevation-level])[data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}
.db-card[data-elevation-level="2"] {
  background-color: var(--db-adaptive-bg-basic-level-2-default);
}
.db-card[data-elevation-level="2"][data-behaviour=interactive] {
  /* stylelint-disable-next-line a11y/selector-pseudo-class-focus */
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-2-hovered);
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="2"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="2"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-2-pressed);
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="2"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="2"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="2"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}
.db-card[data-elevation-level="3"] {
  background-color: var(--db-adaptive-bg-basic-level-3-default);
}
.db-card[data-elevation-level="3"][data-behaviour=interactive] {
  /* stylelint-disable-next-line a11y/selector-pseudo-class-focus */
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-3-hovered);
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="3"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="3"][data-behaviour=interactive]:hover:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]) {
  cursor: pointer;
  background-color: var(--db-adaptive-bg-basic-level-3-pressed);
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(textarea), .db-card[data-elevation-level="3"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input) {
  cursor: initial;
}
.db-card[data-elevation-level="3"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=checkbox]), .db-card[data-elevation-level="3"][data-behaviour=interactive]:active:not(:disabled, [aria-disabled=true]):is(input[type=radio]:not(:checked)) {
  cursor: pointer;
}