/* Production-only ribbon, wrapped around the left edge of the legacy card. */
.production-version-badge .fundo-principal > .row > .col-lg-4 {
  padding-inline: 24px;
}
.production-version-badge .fundo-principal > .row > .col-lg-4 > .card {
  position: relative;
}
.production-version-badge-trigger {
  --badge-overhang: 24px;
  position: absolute;
  top: 0;
  left: calc(-1 * var(--badge-overhang));
  z-index: 3;
  width: clamp(112px, 35%, 160px);
  aspect-ratio: 3 / 2;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  clip-path: polygon(0 0, 100% 0, 100% 52%, var(--badge-overhang) 74%, var(--badge-overhang) 100%, 0 100%);
}
.production-version-badge-trigger img {
  display: block;
  width: 100%;
  height: auto;
  /* Keep the printed face in front; its folded tail belongs behind the card. */
  clip-path: polygon(0 0, 100% 0, 100% 52%, 0 78%);
}
.production-version-badge-trigger::before {
  content: "";
  position: absolute;
  left: 4%;
  top: 70%;
  width: calc(var(--badge-overhang) - 4% - 1px);
  height: 30%;
  background: linear-gradient(135deg, #94002f, #e60046);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 35%);
  pointer-events: none;
}
.production-version-badge-trigger:focus-visible {
  outline: 2px solid #381e9b;
  outline-offset: -2px;
}
.production-version-modal .modal-dialog { max-width: 420px; }
.production-version-modal .modal-content { border-radius: 16px; color: #302740; }
.production-version-modal .modal-title { font-size: 20px; font-weight: 700; }
.production-version-modal .modal-body { font-size: 15px; line-height: 1.6; }
.production-version-modal .modal-footer { border-top: 0; }
.production-version-modal .production-version-confirm { color: #fff; background: #381e9b; border-color: #381e9b; }
