/* ══════════════════════════════════════════════════════
   HiroHonshuku.com — Custom Tools Theme
   Matches the a-no-ne-2025 dark theme
   ══════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&family=Playfair+Display:wght@400;500&display=swap');

/* ── Base ── */
body {
  background-color: #203a51;
  color: #d8d4cc;
  margin: 0;
  padding: 8px;
  font-family: 'Nunito', sans-serif;
  font-size: 0.9rem;
  line-height: 1.6;
}

h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', Georgia, serif;
  color: rgba(255,255,255,0.9);
  margin-top: 0.5em;
}

hr {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin: 12px 0;
}

p { color: #d8d4cc; }

/* ── Tables — overrides legacy bgcolor="#0d542f" HTML attribute ── */
table {
  background-color: #1a2840;
  border-color: rgba(255,255,255,0.12);
  width: 100%;
}
td, th {
  border-color: rgba(255,255,255,0.12);
  color: #d8d4cc;
}

/* ── Text inputs & textareas ── */
input[type="text"],
input[type="email"],
textarea {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.85);
  border-radius: 4px;
  padding: 5px 10px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  font-family: 'Nunito', sans-serif;
}
input[type="text"]:focus,
textarea:focus {
  outline: none;
  border-color: rgba(77,184,255,0.5);
  background: rgba(255,255,255,0.1);
}

/* ── Buttons ── */
input[type="button"],
input[type="submit"] {
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.85);
  border-radius: 4px;
  padding: 5px 14px;
  cursor: pointer;
  font-family: 'Nunito', sans-serif;
  font-weight: 600;
  transition: background 0.15s;
  width: auto !important;
  min-width: 160px;
}
input[type="button"]:hover,
input[type="submit"]:hover {
  background: rgba(255,255,255,0.18);
  color: #fff;
}

input[type="reset"] {
  background: transparent;
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.4);
  border-radius: 4px;
  padding: 5px 10px;
  cursor: pointer;
  font-family: 'Nunito', sans-serif;
  width: auto;
}

/* ── Select dropdowns ── */
select {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.85);
  border-radius: 4px;
  padding: 4px 8px;
  font-family: 'Nunito', sans-serif;
}

/* ── Checkbox ── */
input[type="checkbox"] {
  accent-color: #4db8ff;
}

/* ── numconv: output result field (overrides inline style) ── */
input[name="outputNum"] {
  background-color: rgba(0,0,0,0.25) !important;
  color: #d8d4cc !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
}

/* ── disk-space: readonly result field (overrides inline style) ── */
input[readonly] {
  background-color: rgba(0,0,0,0.2) !important;
  color: #d8d4cc !important;
  border-color: rgba(255,255,255,0.1) !important;
}

/* ── midi-cc-finder: result list ── */
.CC_list {
  background-color: rgba(255,255,255,0.05);
  color: #d8d4cc;
  border-radius: 4px;
  padding: 10px 16px;
}