/* PAYONE Simple Checkout – Frontend Styles (v1.12.0)
   Aligned with ranck.de Gutschein-Seite: klare Typo, großzügige Abstände, dezente Panels */

.payone-button-form { max-width: 760px; margin: 20px auto; }
.payone-button-form .psc-group { margin: 16px 0; padding: 16px 16px 8px 16px; border: 1px solid #e5e7eb; background: #ffffff; }
.payone-button-form .psc-group legend { font-size: 18px; font-weight: 600; margin: 0 0 8px 0; padding: 0 6px; color: #1f2937; text-transform: uppercase; }
.payone-button-form label { font-weight: 500; color: #111827; }
.payone-button-form .form-control { width: 100%; max-width: 420px; }
.payone-button-form .form-inline .form-control { display: inline-block; max-width: 180px; }
.payone-button-form .psc-motifs label { font-weight: 400; }
.payone-button-form .psc-motifs input[type="radio"] { margin-right: 6px; }
.payone-button-form .psc-fulfillment label { margin-right: 16px; }
.payone-button-form .psc-submit { margin-top: 8px; padding: 10px 22px; }
.payone-button-form .psc-submit.btn { background: #fff165; color: #333333; width: 100%; border: 0; border-radius: 0; font-size: 18px; margin-top: 25px; }
.payone-button-form .psc-submit.btn:hover { background: #333333; background: #fff165; }

button.psc-add-position { background: #e5e7eb; color: #333333; width: 100%; border: 0; border-radius: 0; font-size: 18px; margin-top: 25px; padding: 15px; }
button.psc-add-position:hover { background: #e5e7eb; background: #fff165; }
button.psc-remove-position { background: #e5e7eb; color: #333333; width: 100%; border: 0; border-radius: 0; font-size: 18px; margin-top: 0px; padding: 5px 20px; margin-bottom: 9px; }
button.psc-remove-position:hover { background: #e5e7eb; background: #fff165; }



/* Optional Bootstrap 3 alignment helpers */
.payone-button-form .form-inline label { margin-right: 12px; }
.payone-button-form .psc-shipping-fields legend { font-size: 16px; font-weight: 600; margin-bottom: 8px; }

/* Small note text */
.payone-button-form .help { color:#6b7280; font-size: 12px; margin-top: 4px; }

/* Modal iframe height sane on mobile */
@media (max-width: 480px){
  .modal-dialog { width: auto; margin: 10px; }
  .modal-body iframe { height: 70vh !important; }
}

.psc-modal .modal-content, .psc-modal .modal-content iframe {
	height: 700px;
	width: 340px;
}

@media (max-width: 767.99px) {
  .psc-position-row .psc-remove-position-wrapper {
    flex: 0 0 100% !important;
    margin-top: 10px;
    visibility: visible !important;
  }
}


