/* ═══════════════════════════════════════════════════════════
   billing.css — Billing: top-up button, subscribe button,
                 on-demand ledger table (future modal use)
   ═══════════════════════════════════════════════════════════ */

/* ── Action buttons (compact billing row in MY DOMAINS) ── */
#e7_billing_btns {
  display: flex;
  gap:     8px;
  margin:  0 0 8px;
}

#e7_topup_btn,
#e7_subscribe_btn {
  flex:           1;
  background:     transparent;
  border:         var(--border-dim);
  color:          var(--text-secondary);
  padding:        7px 6px;
  font-family:    var(--font-mono);
  font-size:      0.65rem;
  letter-spacing: 1px;
  cursor:         pointer;
  transition:     all 0.2s;
}

#e7_topup_btn:hover {
  border-color: var(--amber);
  color:        var(--amber);
}

#e7_subscribe_btn {
  border-color: var(--green);
  color:        var(--green);
}

#e7_subscribe_btn:hover {
  background: var(--green-dim);
  box-shadow: 0 0 10px var(--green-glow);
}

#e7_billing_action_msg {
  font-size:     0.65rem;
  min-height:    1em;
  margin-bottom: 8px;
}

/* ── On-demand ledger table (future modal / expanded view) ── */
#e7_ledger_section {
  margin-top:  14px;
  border-top:  var(--border-dim);
  padding-top: 10px;
}

#e7_ledger_header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  margin-bottom:   8px;
}

#e7_ledger_title {
  color:          var(--green);
  font-size:      0.65rem;
  letter-spacing: 2px;
  text-transform: uppercase;
}

#e7_ledger_refresh_btn {
  background:     transparent;
  border:         var(--border-dim);
  color:          var(--text-secondary);
  padding:        2px 8px;
  font-family:    var(--font-mono);
  font-size:      0.6rem;
  letter-spacing: 1px;
  cursor:         pointer;
  transition:     all 0.15s;
}

#e7_ledger_refresh_btn:hover {
  border-color: var(--green);
  color:        var(--green);
}

#e7_ledger_msg {
  font-size:     0.65rem;
  color:         var(--text-secondary);
  margin-bottom: 4px;
  min-height:    1em;
}

#e7_ledger_table_wrap { overflow-x: auto; }

#e7_ledger_table {
  width:           100%;
  border-collapse: collapse;
  font-size:       0.65rem;
}

#e7_ledger_table th {
  color:          var(--text-secondary);
  letter-spacing: 1px;
  text-align:     left;
  padding:        4px 6px;
  border-bottom:  var(--border-dim);
  font-weight:    normal;
}

#e7_ledger_table td {
  padding:       4px 6px;
  border-bottom: 1px solid var(--bg-surface);
}

/* ── cBot section (fx.spot only — kept for future use) ── */
#e7_cbot_section {
  margin-top:  20px;
  border-top:  var(--border-dim);
  padding-top: 12px;
}

#e7_cbot_header { margin-bottom: 8px; }

#e7_cbot_title {
  color:          var(--green);
  font-size:      0.65rem;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.e7_cbot_desc {
  color:       var(--text-secondary);
  font-size:   0.68rem;
  margin-top:  4px;
  line-height: 1.5;
}

#e7_cbot_dl_btn,
#e7_cbot_dl_btn_billing {
  margin-top:     12px;
  width:          100%;
  background:     transparent;
  border:         var(--border-dim);
  color:          var(--text-muted);
  padding:        8px;
  font-family:    var(--font-mono);
  font-size:      0.68rem;
  letter-spacing: 1px;
  cursor:         not-allowed;
  box-sizing:     border-box;
}

#e7_cbot_setup_toggle {
  margin-top:  10px;
  color:       var(--text-secondary);
  font-size:   0.65rem;
  cursor:      pointer;
  user-select: none;
}

#e7_cbot_setup_toggle:hover { color: var(--green); }

#e7_cbot_setup { margin-top: 8px; }

.e7_setup_step {
  color:         var(--text-secondary);
  font-size:     0.65rem;
  padding:       3px 0;
  border-bottom: 1px solid var(--bg-surface);
  line-height:   1.6;
}

.e7_setup_step span { color: var(--green); }