.MYUI-ContentCard {
  transition: padding var(--transition_time_default) ease-out;
}


.MYUI-ContentCard__in {
  border-radius: var(--border_radius_optimaze);
  padding: var(--margin_super_low);

  background: rgba(var(--background_card), var(--background_primary-opacity));
  backdrop-filter: blur(var(--backdrop_filter_blur));

  width: 100%;
  box-shadow: var(--box_shadow_card);
}

.MYUI-ContentCard--mushroom .MYUI-ContentCard__top {
  width: calc(100% + var(--margin_optimaze)*2);
  border-radius: var(--border_radius_optimaze);
  margin-left: calc(var(--margin_optimaze) - var(--margin_optimaze)*2);
  margin-right: calc(var(--margin_optimaze) - var(--margin_optimaze)*2);
}

.MYUI-ContentCard__top {
  overflow: hidden;
  box-shadow: var(--box_shadow_image);

  border-radius: var(--border_radius_optimaze) var(--border_radius_optimaze) calc(var(--border_radius_optimaze)/2) calc(var(--border_radius_optimaze)/2);

  width: 100%;
  height: 100%;
}

.MYUI-ContentCard__image {
  overflow: hidden;
  box-shadow: var(--box_shadow_image);

  border-radius: var(--border_radius_optimaze) var(--border_radius_optimaze) calc(var(--border_radius_optimaze)/2) calc(var(--border_radius_optimaze)/2);

  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;

  width: 100%;
  height: 100%;
}

.MYUI-ContentCard__global {
  overflow: hidden;
  padding: calc(var(--margin_optimaze) - var(--margin_super_low));
}

.MYUI-ContentCard__text {
  font-size: var(--font_size_title);
  color: var(--text_primary);
}

.MYUI-ContentCard__description {
  margin-top: var(--margin_optimaze);
  font-size: var(--font_size_optimaze);
  color: var(--text_secondary);
}


/* Гриб = mushroom */
.MYUI-ContentCard--mushroom {}


.MYUI-ContentCard--mushroom .MYUI-ContentCard__image {
  width: calc(100% + var(--margin_default)*2);
  border-radius: var(--border_radius_optimaze);
  margin-left: calc(var(--margin_default) - var(--margin_default)*2);
  margin-right: calc(var(--margin_default) - var(--margin_default)*2);
}

.MYUI-ContentCard--mushroom_animation .MYUI-ContentCard__image {
  animation: ContentCard--mushroom 0.4s linear;
}

@keyframes ContentCard--mushroom {
  0% {
    width: calc(100%);
    margin-left: 0px;
    margin-right: 0px;
  }

  100% {
    width: calc(100% + var(--margin_default)*2);
    margin-left: calc(var(--margin_default) - var(--margin_default)*2);
    margin-right: calc(var(--margin_default) - var(--margin_default)*2);
  }
}


/* Button */
.MYUI-ContentCard .MYUI-Button {
  padding: var(--margin_optimaze) 0px 0px 0px;
}

.MYUI-ContentCard .MYUI-Button__in--wide {
  margin: var(--padding_default) calc(var(--padding_default) - var(--padding_default) * 2) calc(var(--padding_default) - var(--padding_default) * 2) calc(var(--padding_default) - var(--padding_default) * 2);
  width: calc(100% + calc(var(--padding_default) * 2)) !important;
}

.MYUI-ContentCard__text .MYUI-Button {
  padding: 0px;
}