/* Transfer money — reached from the profile dropdown's "Transfer money"
   link. Simple breadcrumb + title + single info card, same palette as
   the rest of the logged-in area. */
:root{
  --blue-dark:#0f3d28;
  --blue-mid:#1f7a52;
  --blue-bright:#27935f;
  --accent-orange:#f39c1f;
}

html,body{height:100%;}
body{background:#eef5f2;display:flex;flex-direction:column;min-height:100vh;}

.tm-layout{
  flex:1 0 auto;
  max-width:1400px;
  margin:0 auto;
  padding:32px 16px 60px;
  width:100%;
  display:flex;
  align-items:flex-start;
  gap:24px;
  flex-wrap:wrap;
}

/* Match the header's edge-to-edge horizontal inset on mobile (see
   header.css .site-header) so the page content lines up flush with it
   instead of sitting inset relative to it. */
@media (max-width:860px){
  .tm-layout{padding-left:4px;padding-right:4px;}
}

.tm-content{flex:1 1 420px;min-width:0;}

.breadcrumb{
  font-size:13px;
  font-weight:500;
  color:#9fc7b4;
  margin:0 0 10px;
}
.breadcrumb a{color:#9fc7b4;text-decoration:none;}
.breadcrumb a:hover{color:var(--blue-mid);}

.page-title{
  margin:0 0 28px;
  font-family:var(--font-heading);
  font-size:38px;
  font-weight:700;
  color:var(--blue-dark);
}

.tm-card{
  background:#fff;
  border-radius:24px;
  padding:32px 34px;
  box-shadow:0 6px 18px -10px rgba(15,31,61,.18);
}
.tm-card h2{
  margin:0 0 14px;
  font-family:var(--font-heading);
  font-size:19px;
  font-weight:700;
  color:var(--blue-dark);
}
.tm-card p{
  margin:0;
  font-size:14px;
  line-height:1.6;
  color:#3a7a5b;
  font-weight:400;
}
.tm-card p a{color:var(--accent-orange);font-weight:700;text-decoration:none;}
.tm-card p a:hover{text-decoration:underline;}

@media (max-width:560px){
  .page-title{font-size:28px;}
  .tm-card{padding:26px 22px;border-radius:20px;}
}