@charset "UTF-8";
/* ---------------------------- */
/* --- vendor-prefix mixins --- */
/* ---------------------------- */
/* --------------- */
/* --- helpers --- */
/* --------------- */
/* === flip animation ===
   This effect needs the following elements:
   * flip-container: the container the mixin is applied to. Element that contains all the other elements; on this element the perspective
     property is set and the actual animation is triggered (by applying another class, on hover or however ... )
   * flipper: element that is flipped; this contains an element that serves as the front of the flipped thingy.
   * front: element that serves as the front of the flipped thingy
   * back: element that serves as the back of the flipped thingy. In the current implementation this is realized by an after-pseudoelement on
     the flipper-element. This could also be a separate element

   This mixin up to now is not too generic to keep it simple right now and mainly serves to make the CSS where it is called less cluttered.
   Can be made more generic as soon as needed.
*/
/* === breakpoints === */
.clsy-c-loading-indicator, .clsy-c-btn.clsy-c-loading-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
}

.clsy-c-loading-indicator::after, .clsy-c-btn.clsy-c-loading-indicator::after {
  content: " ";
  box-sizing: border-box;
  display: block;
  width: var(--loading-indicator-width);
  height: var(--loading-indicator-width);
  min-width: auto;
  min-height: auto;
  margin: 1px;
  background-color: transparent;
  border-radius: 50%;
  border: var(--loading-indicator-line-thickness) solid;
  border-color: var(--emphasized-color) transparent var(--emphasized-color) transparent;
  animation: rotate-360-deg 1.2s linear infinite;
}

.clsy-c-message {
  --animation-duration-unitless: 200;
  --animation-duration: calc(var(--animation-duration-unitless) * 1ms);
  --mask-icon-width: calc(24px + .8em);
  --mask-icon-height: 100%;
  --mask-icon-color: var(--icon-color-messages);
  display: flex;
  align-items: center;
  position: relative;
  min-height: var(--mask-icon-width);
  line-height: var(--smaller-line-height);
  background-color: var(--cardlike-item-bg-color);
  border-style: solid;
  border-color: var(--message-class-color) !important;
  box-shadow: 0 -1px 0 0 var(--contentsection-border-color), 0 3px 0 0 var(--contentsection-border-color);
  margin: .8em auto;
  max-width: 80ch;
  border-width: 0 5px 0 var(--mask-icon-width);
  transition: opacity var(--animation-duration) ease-out, transform var(--animation-duration) var(--bouncy-transition-function);
  transform: scaleY(1);
  opacity: 1;
}

.clsy-c-message::before {
  content: "";
  flex: none;
  display: block;
  width: var(--mask-icon-width);
  height: var(--mask-icon-height);
  transform: var(--mask-icon-transform);
  opacity: var(--mask-icon-opacity);
  background-color: var(--mask-icon-color);
  -webkit-mask: var(--mask-icon-image) var(--mask-icon-position) no-repeat;
  mask: var(--mask-icon-image) var(--mask-icon-position) no-repeat;
  -webkit-mask-size: var(--mask-icon-size);
  mask-size: var(--mask-icon-size);
  position: absolute;
  top: 0;
  left: calc(-1 * var(--mask-icon-width));
  bottom: 0;
}

.clsy-c-message--info {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/belck9g/image/pwa/icons/icon-message-info.svg);
  --message-class-color: var(--message-color-info);
}

.clsy-c-message--warning {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/86ckdgje/image/pwa/icons/icon-message-warning.svg);
  --message-class-color: var(--message-color-warning);
}

.clsy-c-message--error {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/ihhdd7kg/image/pwa/icons/icon-message-error.svg);
  --message-class-color: var(--message-color-error);
  --mask-icon-color: var(--icon-color-messages--error);
}

.clsy-c-message--success {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/l9gccbbe/image/pwa/icons/icon-message-success.svg);
  --message-class-color: var(--message-color-success);
}

.clsy-c-message:has(.clsy-c-message__close) {
  display: flex;
  gap: var(--button-gutter);
  align-items: flex-start;
}

.clsy-c-message--hidden {
  opacity: 0;
  transform: scaleY(0);
}

.clsy-c-message__close {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/ifjbbllb/image/pwa/icons/icon-close.svg);
  --mask-icon-color: var(--standard-link-color);
  margin-left: auto;
}

.clsy-c-message > div:first-child {
  padding: var(--standard-content-padding-vertical) var(--fixed-content-padding-horizontal);
}

.clsy-c-message ul {
  margin: .4em 0 0 .4em;
  padding: 0;
  list-style-type: none;
}

.clsy-c-message ul > li {
  position: relative;
  margin: 0;
  padding: .2em 0 .2em .6em;
}

.clsy-c-message ul > li::before {
  content: "›";
  position: absolute;
  top: .18em;
  left: 0;
  font-weight: bold;
  color: var(--less-important-text-color);
}

/* === unread items indicator === */
.clsy-count-badge {
  --badge-diameter: 1.9em;
  display: inline-block;
  min-width: var(--badge-diameter);
  height: var(--badge-diameter);
  line-height: 1.7em;
  color: var(--emphasized-background-text-color);
  font-size: var(--fontsize-small);
  font-weight: bold;
  text-align: center;
  background-color: var(--emphasized-color);
  border: 2px solid var(--standard-bg-color);
  border-radius: calc(var(--badge-diameter) / 2);
  transform: scale(1);
  transition: transform 300ms var(--very-bouncy-transition-function), visibility 300ms;
}

.clsy-count-badge--hidden {
  visibility: hidden;
  transform: scale(0);
}

.clsy-count-badge--nav-trigger {
  position: absolute;
  top: 2px;
  right: 2px;
}

.clsy-profile {
  padding: 0 0 var(--standard-content-padding-vertical);
}

@media (min-width: 700px) {
  .clsy-profile .clsy-c-advsection {
    background-color: transparent;
  }
  .clsy-profile-col-wrapper {
    display: flex;
    max-width: 1050px;
    margin: 0 auto;
  }
  .clsy-profile-col-1 {
    flex: 2;
    min-width: 10ch;
  }
  .clsy-profile-col-2 {
    margin-left: var(--container-gutter);
    flex: 1;
    min-width: 10ch;
  }
}

.clsy-profile--public .clsy-profile-col-1 {
  display: grid;
  grid-template-rows: 0;
}

.clsy-profile-card, .clsy-profile__events, .clsy-profile__classifieds {
  overflow: hidden;
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.clsy-profile__about-me {
  width: 100%;
  margin-top: calc(var(--standard-content-padding-vertical) * 2);
}

.clsy-profile__about-me textarea {
  min-height: 100px;
}

.clsy-profile__about-me .clsy-c-wysiwyg-decorator {
  --wysiwyg-editor-height: calc( var(--wysiwyg-content-default-height) + var(--wysiwyg-toolbar-top-2row-height) + var(--wysiwyg-statusbar-bottom-height) );
}

.clsy-profile__marktlet-singlecol {
  margin-bottom: var(--contentsection-bottom-margin);
}

.clsy-profile__button--edit {
  --mask-icon-color: var(--standard-link-color);
  --mask-icon-image: url(https://static.testing.markt.de/bundles/bgildgll/image/pwa/icons/icon-pen.svg);
}

.clsy-profile__profile-contact-disabled {
  font-size: var(--fontsize-small);
  margin-top: var(--standard-content-padding-vertical);
  color: var(--less-important-text-color);
}

.clsy-profile__profile-ads-disabled {
  font-size: var(--fontsize-small);
  margin-top: var(--standard-content-padding-vertical);
  color: var(--less-important-text-color);
}

.clsy-profile__classifieds .clsy-contentsection > h2 {
  padding-left: var(--standard-content-padding-horizontal);
  padding-right: var(--standard-content-padding-horizontal);
}

.clsy-profile__classifieds-link {
  margin-top: var(--standard-bottom-margin);
  padding-left: var(--standard-content-padding-horizontal);
  padding-right: var(--standard-content-padding-horizontal);
}

.clsy-profile__events-list,
.clsy-profile__events ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14em, 1fr));
  grid-gap: 0.4em;
}

.clsy-profile__events li {
  margin: 0;
  padding: 0;
  align-self: center;
}

svg.clsy-btn-icon {
  --initial-color: var(--cta-button-text-color);
  --highlight-color: var(--markt-orange);
  margin-right: .3em;
  overflow: visible;
  z-index: var(--fixed-zindex-floating-menu);
}

body.erotic svg.clsy-btn-icon {
  --highlight-color: var(--markt-purple);
}

.clsy-c-pwa-toolbar__overflow-menu svg.clsy-btn-icon {
  --initial-color: var(--standard-link-color);
}

.clsy-profile__toolbar-likeme::before, .clsy-profile__toolbar-likemelink::before {
  content: none;
}

.clsy-profile__toolbar-likeme span {
  display: inline-block;
  transition: transform 0.3s var(--bouncy-transition-function);
}

.clsy-profile__toolbar-likeme--flip span {
  transform: scaleX(0);
}

.clsy-profile__toolbar-likemelink, .clsy-profile__toolbar-likeme--unliked {
  --fill-opacity: 0;
}

.clsy-profile__toolbar-likeme--liked {
  --fill-opacity: 1;
}

.clsy-profile__toolbar-blockmelink, .clsy-profile__toolbar-blockme--unblocked {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/hddfgafa/image/pwa/icons/icon-user-block.svg);
}

.clsy-profile__toolbar-blockme--blocked {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/9ccce6df/image/pwa/icons/icon-user-unblock.svg);
}

.clsy-profile__toolbar-reportViolation-link, .clsy-profile__toolbar-reportViolation-link-login {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/jfljb96a/image/pwa/icons/icon-alarm.svg);
}

.clsy-profile__toolbar-addContactlist-link::before, .clsy-profile__toolbar-verisign::before {
  content: none;
}

.clsy-profile__toolbar-previewprofile {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/j76hce69/image/pwa/icons/icon-eye-inverted.svg);
}

.clsy-c-pwa-toolbar__overflow-menu .clsy-profile__toolbar-previewprofile {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/gcjhcgle/image/pwa/icons/icon-eye.svg);
}

.clsy-profile__toolbar-updateprofile {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/bgildgll/image/pwa/icons/icon-pen.svg);
}

.clsy-profile__toolbar-contact, .clsy-profile__toolbar-open-contact-dialog {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/lfblb6g9/image/pwa/icons/icon-mail.svg);
}

.clsy-profile__toolbar-chathistory {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/d68fd8d6/image/pwa/icons/icon-mailbox.svg);
}

.clsy-profile__toolbar-prepaid {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/hjc8cjej/image/pwa/icons/icon-prepaid.svg);
}

.clsy-profile__toolbar-edituser {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/b7gllgjf/image/pwa/icons/icon-settings.svg);
}

.clsy-profile__toolbar-usercontactlist {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/ae7dca87/image/pwa/icons/icon-contacts.svg);
}

.clsy-profile-actions .clsy-profile__toolbar-blockmelink, .clsy-profile-actions .clsy-profile__toolbar-blockme--unblocked, .clsy-profile-actions .clsy-profile__toolbar-blockme--blocked, .clsy-profile-actions .clsy-profile__toolbar-reportViolation-link, .clsy-profile-actions .clsy-profile__toolbar-chathistory, .clsy-profile-actions .clsy-profile__toolbar-prepaid, .clsy-profile-actions .clsy-profile__toolbar-verisign {
  --mask-icon-color: var(--standard-link-color);
  color: var(--standard-link-color);
  background-color: var(--contentsection-bg-color);
  border: 1px solid var(--standard-link-color);
}

.clsy-profile-actions .clsy-profile__toolbar-blockmelink:hover, .clsy-profile-actions .clsy-profile__toolbar-blockmelink:focus, .clsy-profile-actions .clsy-profile__toolbar-blockme--unblocked:hover, .clsy-profile-actions .clsy-profile__toolbar-blockme--unblocked:focus, .clsy-profile-actions .clsy-profile__toolbar-blockme--blocked:hover, .clsy-profile-actions .clsy-profile__toolbar-blockme--blocked:focus, .clsy-profile-actions .clsy-profile__toolbar-reportViolation-link:hover, .clsy-profile-actions .clsy-profile__toolbar-reportViolation-link:focus, .clsy-profile-actions .clsy-profile__toolbar-chathistory:hover, .clsy-profile-actions .clsy-profile__toolbar-chathistory:focus, .clsy-profile-actions .clsy-profile__toolbar-prepaid:hover, .clsy-profile-actions .clsy-profile__toolbar-prepaid:focus, .clsy-profile-actions .clsy-profile__toolbar-verisign:hover, .clsy-profile-actions .clsy-profile__toolbar-verisign:focus {
  background-color: var(--standard-button-bg-color--hover);
}

.clsy-profile-actions .clsy-profile__toolbar-blockmelink:active, .clsy-profile-actions .clsy-profile__toolbar-blockme--unblocked:active, .clsy-profile-actions .clsy-profile__toolbar-blockme--blocked:active, .clsy-profile-actions .clsy-profile__toolbar-reportViolation-link:active, .clsy-profile-actions .clsy-profile__toolbar-chathistory:active, .clsy-profile-actions .clsy-profile__toolbar-prepaid:active, .clsy-profile-actions .clsy-profile__toolbar-verisign:active {
  background-color: var(--standard-button-bg-color--active);
}

@media (max-width: 699px) {
  .clsy-profile .clsy-profile-actions {
    display: none;
  }
}

@media (min-width: 700px) {
  .clsy-profile .clsy-profile__toolbar {
    display: none;
  }
}

.clsy-profile__likes-dialog-they-me, .clsy-profile__likes-dialog-i-them {
  margin: .5em 0 0 .2em;
  padding: 0 1em;
}

.clsy-profile__likes-dialog-they-me:focus-visible, .clsy-profile__likes-dialog-i-them:focus-visible {
  z-index: 1;
}

.clsy-profile__settings .clsy-c-collapsibleelement__body {
  padding-top: var(--standard-content-padding-vertical);
  padding-bottom: var(--standard-content-padding-vertical);
}

.clsy-fixed-header {
  display: grid;
  grid-template-columns: auto minmax(10ch, 1fr);
  align-items: center;
  gap: var(--large-gutter);
  position: sticky;
  top: var(--header-height);
  left: 0;
  right: 0;
  height: 0;
  overflow: hidden;
  z-index: var(--fixed-zindex-toolbar);
  padding: 0 var(--standard-content-padding-horizontal);
  transform: translateY(-60px);
  transition: transform 0.3s var(--bouncy-transition-function), height 0.3s var(--bouncy-transition-function);
  background-color: var(--header-bg-color);
}

.clsy-fixed-header--visible {
  --padding-top: .3em;
  --padding-bottom: .1em;
  height: calc(var(--profile-image-small) + var(--padding-top) + var(--padding-bottom));
  padding: var(--padding-top) var(--standard-content-padding-horizontal) var(--padding-bottom);
  transform: translateY(0);
  transition: transform 0.3s var(--bouncy-transition-function);
  box-shadow: var(--header-box-shadow);
}

.clsy-fixed-header__nickname {
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.clsy-profile-card__top-bar {
  display: flex;
  align-items: center;
  gap: var(--button-gutter);
  margin: calc(-1 * var(--standard-contentsection-padding-vertical)) calc(-1 * var(--standard-content-padding-horizontal)) calc(2 * var(--standard-content-padding-vertical));
  padding: 0 var(--standard-content-padding-horizontal);
  min-height: var(--small-touchtarget-min-height);
  font-size: var(--small-copytext-fontsize);
  border-bottom: var(--standard-border-style);
}

.clsy-profile-card__top-bar .clsy-c-tooltip__helpIcon {
  min-height: var(--small-touchtarget-min-height);
  height: var(--small-touchtarget-min-height);
  min-width: var(--small-touchtarget-min-width);
  width: var(--small-touchtarget-min-width);
}

.clsy-profile-card__content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.clsy-profile-card__account-type {
  color: var(--less-important-text-color);
}

.clsy-profile-card__account-type-link {
  margin-left: auto;
}

.clsy-profile-card__name-container .clsy-profile-card__name-wrapper {
  overflow: hidden;
}

.clsy-profile-card__name-container .clsy-profile-card__name-input {
  overflow: hidden;
  display: none;
}

.clsy-profile-card__name-container .clsy-profile-card__name-input fieldset {
  margin-bottom: var(--contentsection-bottom-margin);
}

.clsy-profile-card__name-container .clsy-profile-card__name-input fieldset p {
  margin-bottom: .4em;
}

.clsy-profile-card__name-container--editmode .clsy-profile-card__name-wrapper {
  display: none;
}

.clsy-profile-card__name-container--editmode .clsy-profile-card__name-input {
  display: block;
}

.clsy-profile-card__name-container .clsy-profile__button--edit {
  flex: none;
  transform: translateY(0.1em);
}

.clsy-profile-card__name {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: calc(var(--standard-outline-offset) + var(--standard-outline-width));
  margin: 0;
  gap: var(--button-gutter);
  text-align: center;
  text-wrap: balance;
}

.clsy-profile-card__name:has(.clsy-c-tooltip__helpIcon) {
  align-items: center;
}

.clsy-profile-card__name-input div.clsy-c-form__field-wrapper {
  margin-bottom: 4px;
}

.clsy-profile-card__verisign {
  width: auto;
  height: 3ex;
}

.clsy-profile-card__image {
  position: relative;
  margin-bottom: var(--standard-content-padding-vertical);
}

.clsy-profile-card__image-delete {
  --mask-icon-color: var(--standard-link-color);
  --mask-icon-image: url(https://static.testing.markt.de/bundles/ifjbbllb/image/pwa/icons/icon-close.svg);
  position: absolute;
  top: -20px;
  right: -20px;
  background-color: var(--semitransparent-ui-element-bg-color);
  border-radius: 50%;
}

.clsy-profile-card__image-delete:active {
  top: -20px;
  right: -20px;
  left: unset;
}

.clsy-profile-card__image-delete:focus-visible {
  border-radius: 50%;
}

.clsy-profile-card__image-upload {
  --mask-icon-color: var(--standard-link-color);
  --mask-icon-image: url(https://static.testing.markt.de/bundles/if9fbdfa/image/pwa/icons/icon-upload.svg);
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border-radius: 50%;
}

.clsy-profile-card__image-upload:active {
  top: 0;
  left: 0;
}

.clsy-profile-card__image-progress {
  display: none;
  margin-top: .2em;
  font-size: var(--fontsize-small);
  color: var(--less-important-text-color);
  text-align: center;
}

.clsy-profile-card__image-nsfw > img {
  box-shadow: 0 0 0 5px var(--message-color-error);
}

.clsy-profile-card__image .clsy-profile-card__online {
  position: absolute;
  bottom: 6%;
  right: 1%;
}

.clsy-profile-card__company-url {
  margin: 0 0 .2em;
}

.clsy-profile-card__member-since {
  font-size: var(--fontsize-small);
  color: var(--less-important-text-color);
}

.clsy-profile-card__verifications a, .clsy-profile-card__prepaid a {
  height: 1.4em;
}

.clsy-profile-card__verifications {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: calc(2 * var(--standard-content-padding-vertical)) 0;
}

.clsy-profile-card__prepaid {
  --mask-icon-image: url(https://static.testing.markt.de/bundles/hjc8cjej/image/pwa/icons/icon-prepaid.svg);
  --mask-icon-transform: translateY(-.1em);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--button-gutter);
  margin: 0 0 calc(2 * var(--standard-content-padding-vertical));
}