/* ONLY MOBILE STYLING HERE */

@media (max-width: 600px) {

  /* Stack label + input */
  body.start .container {
    grid-template-columns: 1fr;
  }

  /* Labels move above inputs */
  body.start .lbl {
    text-align: left;
    padding-right: 0;
    margin-bottom: 4px;
  }

  /* Inputs + readonly fields full width */
  body.start input[type="text"],
  body.start .readonly-text {
    width: 100%;
    max-width: 100%;
  }

  /* Fix horizontal group (name + button) */
  body.start .input-group-horizontal {
    flex-direction: column;
    align-items: stretch;
  }

  body.start .input-group-horizontal input,
  body.start .input-group-horizontal #notme-btn {
    width: 100%;
  }

  /* Buttons stack vertically */
  body.start .action-group {
    flex-direction: column;
    align-items: center;
  }

  body.start .action-group button,
  body.start .action-group a {
    width: 100%;
    max-width: 260px;
  }
  
    /* BEGINNING OF MOBILE FOR GETINFO */
  body.getinfo .form-grid {
  	grid-template-columns: 1fr;
	}
	
  body.getinfo .container {
	  grid-template-columns: 1fr;
	}
  
  body.getinfo .lbl {
	  min-width: auto;
	  margin-bottom: 4px;
	}
  
  body.getinfo input,
	body.getinfo #ccnumber,
	body.getinfo #ccexp,
	body.getinfo #cvv {
	  width: 100%;
	  max-width: 100%;
	}
	
	body.getinfo .header-bar {
	  grid-template-columns: 1fr;
	  gap: 10px;
	  text-align: center;
	}

	body.getinfo .header-left,
	body.getinfo .header-center,
	body.getinfo .header-right {
	  justify-self: center;
	}
  
  body.getinfo .title-row {
	  grid-template-columns: 1fr;
	  gap: 6px;
	  text-align: center;
	}
	
	body.getinfo .title-left,
	body.getinfo .title-center,
	body.getinfo .title-right {
	  text-align: center;
	}
  
  body.getinfo .action-section {
	  grid-template-columns: 1fr;
	  gap: 12px;
	}
	
	body.getinfo .action-left,
	body.getinfo .action-right,
	body.getinfo .verify-text {
	  justify-content: center;
	  text-align: center;
	}
  
  body.getinfo .container.empty {
	  display: none;
	}
	
	body.getinfo .container {
	  margin-bottom: 10px;
	}
	
	body.getinfo .action-section {
	  grid-template-columns: 1fr;
	  gap: 16px;
	  margin-top: 20px;
	}
	
	body.getinfo .action-right {
	  display: flex;
	  justify-content: center;
	  width: 100%;
	}
	
	body.getinfo #btnPay {
	  width: 100%;
	  max-width: 320px;
	  min-height: 48px;
	  font-size: 1rem;
	}
	
	body.getinfo .action-left {
	  display: flex;
	  justify-content: center;
	  width: 100%;
	}
	
	body.getinfo #spnProcessing {
	  display: inline-block;
	}
	
	body.getinfo .action-section {
	  display: grid;
	  grid-template-columns: 1fr !important;
	}
	
	body.getinfo .action-section > div {
	  width: 100%;
	}
	
	body.getinfo #btnPay {
	  width: 100%;
	  max-width: 320px;
	}
	
	body.getinfo .g-recaptcha {
	  transform: scale(0.85);
	  transform-origin: center;
	}
	
	body.getinfo .verify-text {
	  text-align: center;
	}
	
	body.getinfo .action-left {
	  display: flex;
	  justify-content: center;
	}
	
	body.getinfo .action-right {
	  display: flex;
	  justify-content: center;
	}
	
	body.getinfo .action-left,
	body.getinfo .action-right,
	body.getinfo .verify-text {
	  grid-column: auto !important;
	}
  
}