chore: clean up unused css on payment form

src/static/squarepay.css

@@ -9,114 +9,6 @@ button {
     border: 0;
 }
 
-hr {
-    height: 1px;
-    border: 0;
-    background-color: #CCC;
-}
-
-fieldset {
-    margin: 0;
-    padding: 0;
-    border: 0;
-}
-
-.label {
-    font-size: 14px;
-    font-weight: 500;
-    line-height: 24px;
-    letter-spacing: 0.5;
-    text-transform: uppercase;
-}
-
-.half {
-    float: left;
-    width: calc((100% - 16px) / 2);
-    padding: 0;
-    margin-right: 16px;
-}
-
-.half:last-of-type {
-    margin-right: 0;
-}
-
-/* Define how SqPaymentForm iframes should look */
-.sq-input,
-#sq-expiration-date, #sq-card-number, #sq-cvv {
-    box-sizing: border-box;
-    border: 1px solid #E0E2E3;
-    border-radius: 4px;
-    outline-offset: -2px;
-    /*display: inline-block;*/
-    height: 56px;
-    -webkit-transition: border-color .2s ease-in-out, background .2s ease-in-out;
-         -moz-transition: border-color .2s ease-in-out, background .2s ease-in-out;
-            -ms-transition: border-color .2s ease-in-out, background .2s ease-in-out;
-                    transition: border-color .2s ease-in-out, background .2s ease-in-out;
-}
-
-div#sq-expiration-date, div#sq-card-number, div#sq-cvv {
-    background-color: #f2f2f2;
-}
-
-/* Define how SqPaymentForm iframes should look when they have focus */
-.sq-input--focus {
-    border: 1px solid #4A90E2;
-    background-color: rgba(74,144,226,0.02);
-}
-
-
-/* Define how SqPaymentForm iframes should look when they contain invalid values */
-.sq-input--error {
-    border: 1px solid #E02F2F;
-    background-color: rgba(244,47,47,0.02);
-}
-
-#sq-card-number {
-    margin-bottom: 16px;
-}
-
-/* Customize the "Pay with Credit Card" button */
-.button-credit-card {
-    width: 100%;
-    height: 56px;
-    margin-top: 10px;
-    background: #ccf;
-    border-radius: 4px;
-    cursor: default;
-    display: block;
-    color: #FFFFFF;
-    font-size: 16px;
-    line-height: 24px;
-    font-weight: 700;
-    letter-spacing: 0;
-    text-align: center;
-
-}
-.button-credit-card:enabled {
-    width: 100%;
-    height: 56px;
-    margin-top: 10px;
-    background: #4A90E2;
-    border-radius: 4px;
-    cursor: pointer;
-    display: block;
-    color: #FFFFFF;
-    font-size: 16px;
-    line-height: 24px;
-    font-weight: 700;
-    letter-spacing: 0;
-    text-align: center;
-    -webkit-transition: background .2s ease-in-out;
-         -moz-transition: background .2s ease-in-out;
-            -ms-transition: background .2s ease-in-out;
-                    transition: background .2s ease-in-out;
-}
-
-.button-credit-card:hover:enabled {
-    background-color: #4281CB;
-}
-
 .payment-info {
     float: left;
     margin: 20px auto;
@@ -149,14 +41,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv {
     min-width: 300px;
   }
   
-  .buyer-inputs {
-    display: flex;
-    gap: 20px;
-    justify-content: space-between;
-    border: none;
-    margin: 0;
-    padding: 0;
-  }
   
   #card-container {
     /* this height depends on the size of the container element */
@@ -165,10 +49,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv {
     min-height: 90px;
   }
   
-  #gift-card-container {
-    margin-top: 45px;
-    min-height: 90px;
-  }
   
   @media screen and (max-width: 500px) {
     #card-container {
@@ -176,47 +56,6 @@ div#sq-expiration-date, div#sq-card-number, div#sq-cvv {
     }
   }
   
-  #ach-button {
-    margin-top: 20px;
-  }
-  
-  #landing-page-layout {
-    width: 80%;
-    margin: 150px auto;
-    max-width: 1000px;
-  }
-  
-  #its-working {
-    color: #737373;
-  }
-  
-  #example-container {
-    width: 100%;
-    border: 1px solid #b3b3b3;
-    padding: 48px;
-    margin: 32px 0;
-    border-radius: 12px;
-  }
-  
-  #example-list {
-    display: flex;
-    flex-direction: column;
-    gap: 15px;
-  }
-  
-  #customer-input {
-    margin-bottom: 40px;
-  }
-  
-  #card-input {
-    margin-top: 0;
-    margin-bottom: 40px;
-  }
-  
-  h3 {
-    margin: 0;
-  }
-  
   p {
     line-height: 24px;
   }