* {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }

      body {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          Oxygen, Ubuntu, Cantarell, sans-serif;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
      }

      .container {
        background: white;
        border-radius: 20px;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
        max-width: 500px;
        width: 100%;
        padding: 40px;
      }

      .logo {
        text-align: center;
        margin-bottom: 30px;
      }

      .logo img {
        width: 150px;
        height: auto;
      }

      h1 {
        font-size: 28px;
        color: #333;
        text-align: center;
        margin-bottom: 10px;
      }

      .subtitle {
        text-align: center;
        color: #666;
        margin-bottom: 30px;
        font-size: 14px;
      }

      .form-group {
        margin-bottom: 20px;
      }

      label {
        display: block;
        color: #333;
        font-weight: 600;
        margin-bottom: 8px;
        font-size: 14px;
      }

      input,
      textarea {
        width: 100%;
        padding: 12px 15px;
        border: 2px solid #e0e0e0;
        border-radius: 8px;
        font-size: 16px;
        transition: border-color 0.3s;
      }

      input:focus,
      textarea:focus {
        outline: none;
        border-color: #667eea;
      }

      .phone-input-group {
        display: flex;
        gap: 10px;
      }

      .phone-prefix {
        width: 80px;
        background: #f5f5f5;
        text-align: center;
      }

      .phone-number {
        flex: 1;
      }

      .btn {
        width: 100%;
        padding: 15px;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        color: white;
        border: none;
        border-radius: 8px;
        font-size: 16px;
        font-weight: 600;
        cursor: pointer;
        transition: transform 0.2s, box-shadow 0.2s;
      }

      .btn:hover:not(:disabled) {
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(102, 126, 234, 0.4);
      }

      .btn:disabled {
        opacity: 0.6;
        cursor: not-allowed;
      }

      .loading {
        display: none;
        text-align: center;
        margin-top: 20px;
      }

      .loading.active {
        display: block;
      }

      .spinner {
        border: 3px solid #f3f3f3;
        border-top: 3px solid #667eea;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        animation: spin 1s linear infinite;
        margin: 0 auto 15px;
      }

      @keyframes spin {
        0% {
          transform: rotate(0deg);
        }
        100% {
          transform: rotate(360deg);
        }
      }

      .error {
        background: #fee;
        color: #c33;
        padding: 15px;
        border-radius: 8px;
        margin-bottom: 20px;
        display: none;
        font-size: 14px;
      }

      .error.active {
        display: block;
      }

      .success {
        background: #e8f5e9;
        color: #2e7d32;
        padding: 15px;
        border-radius: 8px;
        margin-bottom: 20px;
        display: none;
        font-size: 14px;
      }

      .success.active {
        display: block;
      }

      .info-box {
        background: #e3f2fd;
        padding: 15px;
        border-radius: 8px;
        margin-bottom: 20px;
        font-size: 14px;
        color: #1565c0;
      }

      .info-box strong {
        display: block;
        margin-bottom: 5px;
      }

      .back-link {
        text-align: center;
        margin-top: 20px;
      }

      .back-link a {
        color: #667eea;
        text-decoration: none;
        font-size: 14px;
      }

      .back-link a:hover {
        text-decoration: underline;
      }

      .pending-payment {
        display: none;
        text-align: center;
        margin-top: 20px;
      }

      .pending-payment.active {
        display: block;
      }

      .pending-payment .icon {
        width: 80px;
        height: 80px;
        margin: 0 auto 20px;
        background: linear-gradient(135deg, #ffa726 0%, #fb8c00 100%);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 40px;
      }

      .pending-payment h2 {
        color: #333;
        margin-bottom: 10px;
      }

      .pending-payment p {
        color: #666;
        margin-bottom: 20px;
      }

      .status-check {
        display: none;
        margin-top: 20px;
        padding: 15px;
        background: #f5f5f5;
        border-radius: 8px;
      }

      .status-check.active {
        display: block;
      }

      .status-check .status {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
      }

      .status-check .status-label {
        font-weight: 600;
        color: #666;
      }

      .status-check .status-value {
        color: #333;
      }
    
.inline-155319eadfbb{
                color: #666;
                font-size: 12px;
                margin-top: 5px;
                display: block;
              }