/*!
 * TeachDemy — "My Wallet" UI/UX refinement
 * ---------------------------------------------------------
 * Scope: ONLY the wallet-related WooCommerce My Account tabs:
 *   - account-funds        (main wallet / balance chart tab)
 *   - withdrawal_requests  (submit + list withdrawal requests)
 *   - wallet_addresses     (saved crypto wallet addresses)
 *
 * WooCommerce automatically adds a body class per endpoint:
 *   woocommerce-endpoint-account-funds
 *   woocommerce-endpoint-withdrawal_requests
 *   woocommerce-endpoint-wallet_addresses
 * so this file cannot leak onto Home, other My Account tabs,
 * or any other page — even if the class names below (.tdp-table,
 * status pills, etc.) are reused elsewhere in the future.
 *
 * Colors are NOT a new palette — they are refined versions of the
 * colors already used in this plugin today (#45add6 blue, the
 * green/red used for credit/debit rows, #f2f2f2 / #eee neutrals),
 * per the client's request to keep the current theme's look.
 * Several elements are styled with `!important` only because the
 * plugin currently prints inline `style="..."` attributes, which
 * otherwise cannot be overridden from a stylesheet.
 * ---------------------------------------------------------
 */

:root{
  --tdw-blue:        #45ADD6;
  --tdw-blue-dark:   #338FB3;
  --tdw-blue-tint:   #EAF6FB;
  --tdw-green:       #1FAE6B;
  --tdw-green-tint:  #E9F9F1;
  --tdw-red:         #E1543A;
  --tdw-red-tint:    #FCEAE7;
  --tdw-amber:       #E0A22B;
  --tdw-amber-tint:  #FBF2E1;
  --tdw-ink:         #10202E;
  --tdw-ink-dim:     #5B6A78;
  --tdw-ink-faint:   #93A0AC;
  --tdw-border:      #E9ECEF;
  --tdw-bg-soft:     #F7F8FA;
  --tdw-radius-lg:   16px;
  --tdw-radius-md:   10px;
  --tdw-radius-sm:   7px;
  --tdw-shadow:      0 8px 24px -12px rgba(16,32,46,.14);
}

body.woocommerce-endpoint-account-funds,
body.woocommerce-endpoint-withdrawal_requests,
body.woocommerce-endpoint-wallet_addresses{
  background:#fff;
}

/* =========================================================
   1. Shared card / section wrapper
   ========================================================= */
body.woocommerce-endpoint-account-funds .woocommerce-MyAccount-content > div,
body.woocommerce-endpoint-withdrawal_requests .woocommerce-MyAccount-content > div,
body.woocommerce-endpoint-wallet_addresses .woocommerce-MyAccount-content > div{
  background:#fff !important;
  border:1px solid var(--tdw-border) !important;
  border-radius:var(--tdw-radius-lg) !important;
  box-shadow:var(--tdw-shadow);
  padding:24px !important;
  margin-top:0 !important;
}

/* section title row ("Withdrawal Requests", "My Wallet Addresses") */
body.woocommerce-endpoint-withdrawal_requests h4,
body.woocommerce-endpoint-wallet_addresses h4{
  font-size:17px !important;
  font-weight:700 !important;
  color:var(--tdw-ink) !important;
}

/* =========================================================
   2. Buttons — unify every hardcoded inline button
   (Submit request, Add wallet, Submit, Filter, Reset, Save CSV)
   ========================================================= */
body.woocommerce-endpoint-account-funds a[id^="save_"],
body.woocommerce-endpoint-account-funds button[id^="save_"],
body.woocommerce-endpoint-withdrawal_requests a[id^="open_"],
body.woocommerce-endpoint-withdrawal_requests a[id^="submit_"],
body.woocommerce-endpoint-withdrawal_requests button[id^="submit_"],
body.woocommerce-endpoint-wallet_addresses a[id^="add_"],
body.woocommerce-endpoint-wallet_addresses button[id^="add_"],
body.woocommerce-endpoint-wallet_addresses a[id^="submit_"],
body.woocommerce-endpoint-wallet_addresses button[id^="submit_"],
body.woocommerce-endpoint-account-funds .table-filter-container button{
  background:var(--tdw-blue) !important;
  border:none !important;
  color:#fff !important;
  padding:10px 20px !important;
  border-radius:var(--tdw-radius-sm) !important;
  font-weight:600 !important;
  font-size:13.5px !important;
  box-shadow:0 6px 16px -8px rgba(69,173,214,.55);
  transition:background .2s, transform .2s;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
body.woocommerce-endpoint-account-funds a[id^="save_"]:hover,
body.woocommerce-endpoint-account-funds button[id^="save_"]:hover,
body.woocommerce-endpoint-withdrawal_requests a[id^="open_"]:hover,
body.woocommerce-endpoint-withdrawal_requests a[id^="submit_"]:hover,
body.woocommerce-endpoint-withdrawal_requests button[id^="submit_"]:hover,
body.woocommerce-endpoint-wallet_addresses a[id^="add_"]:hover,
body.woocommerce-endpoint-wallet_addresses button[id^="add_"]:hover,
body.woocommerce-endpoint-wallet_addresses a[id^="submit_"]:hover,
body.woocommerce-endpoint-wallet_addresses button[id^="submit_"]:hover,
body.woocommerce-endpoint-account-funds .table-filter-container button:hover{
  background:var(--tdw-blue-dark) !important;
  transform:translateY(-1px);
}
/* "Reset" filter button — keep as a quiet secondary action */
body.woocommerce-endpoint-account-funds #reset_filter{
  background:#fff !important;
  border:1.5px solid var(--tdw-border) !important;
  color:var(--tdw-ink-dim) !important;
  box-shadow:none !important;
}
body.woocommerce-endpoint-account-funds #reset_filter:hover{
  border-color:var(--tdw-blue) !important;
  color:var(--tdw-blue) !important;
}
/* delete / danger action buttons */
body.woocommerce-endpoint-withdrawal_requests .delete-wallet-address,
body.woocommerce-endpoint-wallet_addresses .delete-wallet-address{
  background:#fff !important;
  border:1.5px solid var(--tdw-red) !important;
  color:var(--tdw-red) !important;
  padding:6px 14px !important;
  border-radius:var(--tdw-radius-sm) !important;
  font-weight:600 !important;
  font-size:12.5px !important;
  cursor:pointer;
}
body.woocommerce-endpoint-withdrawal_requests .delete-wallet-address:hover,
body.woocommerce-endpoint-wallet_addresses .delete-wallet-address:hover{
  background:var(--tdw-red) !important;
  color:#fff !important;
}

/* =========================================================
   3. Collapsible "new request / new wallet" panels
   ========================================================= */
body.woocommerce-endpoint-withdrawal_requests #request_withdraw_container,
body.woocommerce-endpoint-wallet_addresses #add_new_wallet_container{
  background:var(--tdw-bg-soft) !important;
  border:1px solid var(--tdw-border) !important;
  border-radius:var(--tdw-radius-md) !important;
  padding:20px !important;
  margin-top:14px !important;
  gap:16px !important;
}
/* the "not responsible for wrong address" warning strip */
body.woocommerce-endpoint-withdrawal_requests #request_withdraw_container > div:first-child{
  background:var(--tdw-amber-tint) !important;
  color:#7A5A15 !important;
  border:1px solid #EFD9A6 !important;
  border-radius:var(--tdw-radius-sm) !important;
  padding:10px 14px !important;
  font-size:13px !important;
  text-align:start !important;
}

/* =========================================================
   4. Inputs / selects (amount, wallet address, dates)
   ========================================================= */
body.woocommerce-endpoint-account-funds input,
body.woocommerce-endpoint-account-funds select,
body.woocommerce-endpoint-withdrawal_requests input,
body.woocommerce-endpoint-withdrawal_requests select,
body.woocommerce-endpoint-wallet_addresses input,
body.woocommerce-endpoint-wallet_addresses select{
  border:1.5px solid var(--tdw-border) !important;
  border-radius:var(--tdw-radius-sm) !important;
  padding:10px 12px !important;
  font-size:13.5px !important;
  background:#fff !important;
  transition:border-color .2s;
}
body.woocommerce-endpoint-account-funds input:focus,
body.woocommerce-endpoint-account-funds select:focus,
body.woocommerce-endpoint-withdrawal_requests input:focus,
body.woocommerce-endpoint-withdrawal_requests select:focus,
body.woocommerce-endpoint-wallet_addresses input:focus,
body.woocommerce-endpoint-wallet_addresses select:focus{
  border-color:var(--tdw-blue) !important;
  outline:none;
  box-shadow:0 0 0 3px var(--tdw-blue-tint);
}
body.woocommerce-endpoint-withdrawal_requests label strong,
body.woocommerce-endpoint-wallet_addresses label strong{
  font-size:12.5px !important;
  color:var(--tdw-ink-dim) !important;
  font-weight:600 !important;
  display:block;
  margin-bottom:6px;
}

/* =========================================================
   5. Balance chart card (canvas comes from the plugin's JS,
   this just gives it a clean, contained frame + fixed height)
   ========================================================= */
body.woocommerce-endpoint-account-funds #balanceChart{
  max-height:320px !important;
}
body.woocommerce-endpoint-account-funds .table-filter-container{
  display:flex !important;
  align-items:flex-end !important;
  gap:14px !important;
  flex-wrap:wrap;
  background:var(--tdw-bg-soft) !important;
  border:1px solid var(--tdw-border) !important;
  border-radius:var(--tdw-radius-md) !important;
  padding:16px !important;
  margin-bottom:18px !important;
}

/* =========================================================
   6. Tables (withdrawal requests + transactions)
   ========================================================= */
body.woocommerce-endpoint-account-funds table.tdp-table,
body.woocommerce-endpoint-withdrawal_requests table.tdp-table{
  width:100%;
  border-collapse:separate !important;
  border-spacing:0;
}
body.woocommerce-endpoint-account-funds table.tdp-table thead th,
body.woocommerce-endpoint-withdrawal_requests table.tdp-table thead th{
  background:var(--tdw-bg-soft) !important;
  color:var(--tdw-ink-dim) !important;
  font-size:11.5px !important;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:700 !important;
  padding:12px 14px !important;
  border-bottom:1px solid var(--tdw-border) !important;
  text-align:start;
}
body.woocommerce-endpoint-account-funds table.tdp-table tbody td,
body.woocommerce-endpoint-withdrawal_requests table.tdp-table tbody td{
  padding:12px 14px !important;
  font-size:13px !important;
  border-bottom:1px solid var(--tdw-border) !important;
  color:var(--tdw-ink) !important;
}
/* neutralize the inline row background on transaction rows and
   replace with a subtle left border instead — cleaner, still legible */
body.woocommerce-endpoint-account-funds table.tdp-table tbody tr[style]{
  background:#fff !important;
  border-inline-start:3px solid transparent;
}
body.woocommerce-endpoint-account-funds table.tdp-table tbody tr:hover{
  background:var(--tdw-bg-soft) !important;
}

/* =========================================================
   7. Status pills — catches any "{status}--status" class
   (pending, approved, rejected, completed, cancelled, …)
   ========================================================= */
body.woocommerce-endpoint-withdrawal_requests [class$="--status"]{
  display:inline-block;
  padding:5px 12px;
  border-radius:100px;
  font-size:11.5px;
  font-weight:700;
  background:var(--tdw-bg-soft);
  color:var(--tdw-ink-dim);
}
body.woocommerce-endpoint-withdrawal_requests .pending--status{
  background:var(--tdw-amber-tint);
  color:#8A6414;
}
body.woocommerce-endpoint-withdrawal_requests .completed--status,
body.woocommerce-endpoint-withdrawal_requests .approved--status,
body.woocommerce-endpoint-withdrawal_requests .paid--status{
  background:var(--tdw-green-tint);
  color:var(--tdw-green);
}
body.woocommerce-endpoint-withdrawal_requests .rejected--status,
body.woocommerce-endpoint-withdrawal_requests .failed--status,
body.woocommerce-endpoint-withdrawal_requests .cancelled--status{
  background:var(--tdw-red-tint);
  color:var(--tdw-red);
}

/* =========================================================
   8. Pagination
   ========================================================= */
body.woocommerce-endpoint-account-funds ul.tdp-pagination,
body.woocommerce-endpoint-withdrawal_requests ul.tdp-pagination{
  display:flex !important;
  gap:6px;
  list-style:none;
  padding:0 !important;
  margin:18px 0 0 !important;
}
body.woocommerce-endpoint-account-funds ul.tdp-pagination a,
body.woocommerce-endpoint-withdrawal_requests ul.tdp-pagination a{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:34px;
  padding:0 8px;
  border:1px solid var(--tdw-border);
  border-radius:var(--tdw-radius-sm);
  color:var(--tdw-ink-dim);
  font-size:12.5px;
  text-decoration:none;
}
body.woocommerce-endpoint-account-funds ul.tdp-pagination a.active,
body.woocommerce-endpoint-withdrawal_requests ul.tdp-pagination a.active,
body.woocommerce-endpoint-account-funds ul.tdp-pagination a:hover,
body.woocommerce-endpoint-withdrawal_requests ul.tdp-pagination a:hover{
  background:var(--tdw-blue);
  border-color:var(--tdw-blue);
  color:#fff;
}

/* =========================================================
   9. Wallet addresses table specific
   ========================================================= */
body.woocommerce-endpoint-wallet_addresses table td:first-child{
  font-family:'IBM Plex Mono', ui-monospace, monospace !important;
  font-size:12.5px !important;
  color:var(--tdw-ink) !important;
  letter-spacing:.02em !important;
}

/* =========================================================
   10. Success / error inline message banner
   ========================================================= */
body.woocommerce-endpoint-withdrawal_requests .withdrawal-request-message{
  background:var(--tdw-green-tint) !important;
  border:1px solid var(--tdw-green) !important;
  color:var(--tdw-green) !important;
  border-radius:var(--tdw-radius-sm) !important;
  padding:12px 16px !important;
  margin-bottom:16px !important;
  font-size:13.5px !important;
}