/* ---- WavePay Styles for AZM2D ---- */

.wave-container {
  background: #fff;
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  font-family: 'Poppins', 'Myanmar3', 'Padauk', 'Noto Sans Myanmar', sans-serif;
}

.header {
  background: #0974d0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}

.header-title {
  font-size: 1.22em;
  font-weight: 600;
  color: #fff;
}

.header-icon a {
  color: #fff;
  font-size: 1.2em;
  text-decoration: none;
}

.wm-section {
  background: #fff;
  margin: 18px 10px 0 10px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(9,116,208,0.07);
  padding: 18px 13px;
  position: relative;
}

.wm-title {
  font-size: 1.07em;
  font-weight: 600;
  color: #0974d0;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 7px;
}

.wm-balance {
  font-size: 2.2em;
  font-weight: 700;
  color: #222;
  margin-bottom: 5px;
}

.wm-note {
  background: #f6f9ff;
  color: #0c406f;
  padding: 9px 10px;
  border-radius: 7px;
  font-size: 0.98em;
  margin: 7px 0 0 0;
}

.wm-tabs {
  display: flex;
  gap: 10px;
  margin-bottom: 14px;
}

.wm-tab-btn {
  flex: 1;
  border: none;
  background: #e4f1fd;
  color: #0974d0;
  font-size: 1.04em;
  font-weight: 600;
  padding: 10px 0;
  border-radius: 7px 7px 0 0;
  cursor: pointer;
  transition: background 0.14s;
}

.wm-tab-btn.active,
.wm-tab-btn:focus {
  background: #0974d0;
  color: #fff;
}

.wm-form-group {
  margin-bottom: 13px;
}

.wm-label {
  font-size: 1em;
  font-weight: 500;
  color: #222;
  margin-bottom: 4px;
  display: block;
}

.wm-input {
  width: 100%;
  font-size: 1.1em;
  padding: 8px 10px;
  border: 1px solid #c3d6eb;
  border-radius: 6px;
  background: #f6f9ff;
  outline: none;
  margin-top: 3px;
  transition: border 0.14s;
}

.wm-input:focus {
  border-color: #0974d0;
}

.wm-btn {
  width: 100%;
  background: #0974d0;
  color: #fff;
  font-size: 1.13em;
  font-weight: 600;
  border: none;
  border-radius: 7px;
  padding: 12px 0;
  margin-top: 7px;
  cursor: pointer;
  transition: background 0.14s;
}

.wm-btn:hover,
.wm-btn:focus {
  background: #0759a8;
}

/* Success & Error messages */
.wm-success, .wm-error {
  font-size: 1em;
  margin-top: 9px;
  border-radius: 6px;
  padding: 9px 10px;
  display: none;
}
.wm-success { background: #e0fce7; color: #1d7a37; }
.wm-error   { background: #ffe3e3; color: #b10015; }

.wm-copy-btn {
  margin-left: 9px;
  padding: 3px 9px;
  background: #e4f1fd;
  color: #0974d0;
  border: none;
  border-radius: 5px;
  font-size: 0.93em;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  transition: background 0.12s;
}
.wm-copy-btn:hover { background: #d0eafb; }

@media (max-width: 480px) {
  .wave-container, main { max-width: 100vw; }
  .wm-section { margin-left: 4px; margin-right: 4px; }
}

/* File upload input for screenshot */
#wave-container input[type="file"],
#wm-deposit-screenshot {
  background: #f6f9ff;
  border: 1px solid #c3d6eb;
  border-radius: 5px;
  padding: 7px;
  font-size: 1em;
  width: 100%;
  margin-top: 3px;
}

#wave-container input[type="file"]:focus,
#wm-deposit-screenshot:focus {
  outline: 1.5px solid #0974d0;
}
