body {
  margin: 0;
  display: flex;
  font-family: 'Courier New', monospace;
  height: 100vh;
  background-color: #f5faff;
  color: #222;
}

#method-list {
  width: 300px;
  background: white;
  padding: 30px;
  overflow-y: auto;
  /* border-right: 2px solid #b3d5ef; */
}

#method-list h3 {
  font-size: 1.2rem;
  margin-bottom: 10px;
  color: #125b88;
  font-weight: bold;
}
#method-details h2 {
  font-weight: bold;
}

#method-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#method-list li {
  padding: 10px;
  cursor: pointer;
  border-bottom: 1px solid #cce2f2;
  color: #154c6c;
  font-size: 16px;
  transition: background-color 0.2s;
}

#method-list li:hover {
  background: #d0e9ff;
}

#method-list li.active {
  background: #b8dcff;
  font-weight: bold;
  border-left: 4px solid #0d7cb8;
}

#method-details {
  flex: 1;
  padding: 30px;
  overflow-y: auto;
}

#method-content h2, #method-content h3 {
  font-size: larger;
  color: #125b88;
  font-weight: bold;
  margin-bottom: 15px;
}

#method-content label {
  font-size: 15px;
  display: block;
  margin-top: 10px;
  font-weight: bold;
}

#m_productName, #m_serviceUrl, #productName, #m_customerKey, #m_customerUrl, #serviceUrl, #m_email, #isVendor, #customerKey, #method-content textarea {
  width: 100%;
  margin-top: 4px;
  padding: 8px;
  margin-bottom: 10px;
  border: 1px solid #a8cce7;
  border-radius: 4px;
  background-color: #f9fdff;
  font-family: 'Courier New', monospace;
}

#method-content button {
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 10px 16px;
  background-color: #007acc;
  color: black;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-family: 'Courier New', monospace;
}


#method-details button {
  padding: 10px 16px;
  background-color: #007acc;
  color: rgb(255, 255, 255);
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-family: 'Courier New', monospace;
}
#method-details button:hover {
  background-color: #015085;
}
#response-box {
  background: #f1faff;
  border: 1px solid #a2cbe4;
  padding: 16px;
  margin-top: 10px;
  border-radius: 5px;
  font-family: 'Courier New', monospace;
  white-space: pre-wrap;
  color: #003047;
  font-size: 0.95rem;
  line-height:20px;
  /* Add these properties to fix overflow */
  white-space: pre-wrap;         /* Wraps long lines of JSON */
  word-break: break-word;        /* Breaks long words (like long keys/values) */
  overflow-wrap: anywhere;       /* Ensures breaks inside long continuous strings */
  overflow: visible;   
}

#method-content .param-desc {
  font-size: 15px;
  color: #555;
  /* margin-top: -8px; */
  margin-bottom: 12px;
  padding-left: 4px;
  font-family: 'Courier New', monospace;
}
.download-btn{
  background-color:  #007acc;
  color: rgb(255, 255, 255);
}
.param-input{
  width: 100%;
    margin-top: 4px;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #a8cce7;
    border-radius: 4px;
    background-color: #f9fdff;
    font-family: 'Courier New', monospace;
}

#profileForm input{
  border: 1px solid #a2cbe4;
  padding: 3px;
  border-radius: 4px;
}