/**
 * Listing variant modal — style poza cache CCC theme.css.
 */
.listing-variant-modal__brand {
  font-weight: 500;
  color: #000;
}

.listing-variant-modal__details {
  display: inline-block;
  margin: 20px 0 24px;
  font-family: "Source Sans 3", sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: #232323;
  text-decoration: none;
}

.listing-variant-modal__details[hidden] {
  display: none !important;
}

.listing-variant-modal__details:hover,
.listing-variant-modal__details:focus {
  color: #ccb85f;
  text-decoration: none;
}

@media (max-width: 767px) {
  .listing-variant-modal {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 0 !important;
  }

  .listing-variant-modal__panel {
    width: 100% !important;
    max-width: none !important;
    padding: 20px 18px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    max-height: min(92vh, 100%);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .listing-variant-modal__panel.is-picker-open,
  .listing-variant-modal__panel:has(.listing-variant-modal__picker.is-open) {
    max-height: min(96vh, 100%);
    overflow-y: visible;
  }

  .listing-variant-modal__picker.is-open .product-variant-picker__panel {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    max-height: none;
    overflow: visible;
    margin-top: 4px;
  }

  .listing-variant-modal__title {
    font-size: 18px !important;
    letter-spacing: 0.02em;
  }

  .listing-variant-modal__body {
    grid-template-columns: minmax(88px, 112px) minmax(0, 1fr) !important;
    gap: 12px 16px !important;
  }

  .listing-variant-modal__media {
    grid-column: 1;
    grid-row: 1 / span 3;
    max-width: none !important;
    margin: 0 !important;
    width: 100%;
  }

  .listing-variant-modal__content {
    display: contents;
  }

  .listing-variant-modal__brand {
    grid-column: 2;
    grid-row: 1;
    margin-bottom: 2px;
    font-size: 16px;
  }

  .listing-variant-modal__name {
    grid-column: 2;
    grid-row: 2;
    margin-bottom: 0;
    font-size: 14px;
  }

  .listing-variant-modal__details {
    grid-column: 2;
    grid-row: 3;
    margin-top: 14px;
    margin-bottom: 16px;
    font-size: 13px;
  }

  .listing-variant-modal__field {
    grid-column: 1 / -1;
    grid-row: 4;
    margin-bottom: 16px;
  }

  .listing-variant-modal__submit {
    grid-column: 1 / -1;
    grid-row: 5;
  }
}