/* TridLearn V0.8.13 — My TridLearn layout refinement.
   Arrange by task hierarchy, not by forcing a tall sidebar. */

.account-page .account-status{
  display:block;
  border-top:1px solid var(--inner-line);
  padding-top:28px;
}

/* Top: three account actions share one row and one height. */
.account-page .account-actions{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.28fr) minmax(260px,.9fr);
  gap:15px;
  align-items:stretch;
}
.account-page .account-actions > *{
  min-height:205px;
}
.account-page .account-actions .account-block,
.account-page .account-actions .account-aside{
  height:100%;
  margin:0;
}
.account-page .account-actions .account-block{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.account-page .account-actions .account-block .btn{
  width:max-content;
  margin-top:auto;
}
.account-page .account-actions .redeem{
  margin-top:auto;
}
.account-page .account-actions .account-aside{
  display:flex;
  flex-direction:column;
  min-height:205px;
  padding:25px;
}
.account-page .account-actions .account-aside h2{
  margin:16px 0 10px;
}
.account-page .account-actions .account-aside p{
  margin:0;
  max-width:250px;
}
.account-page .account-actions .account-aside .btn{
  margin-top:auto;
}

/* Bottom: learning content uses the full content width. */
.account-page .learning-overview{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
  margin-top:15px;
}
.account-page .learning-overview .account-block{
  min-height:150px;
  display:flex;
  flex-direction:column;
}
.account-page .learning-overview .text-link{
  margin-top:auto;
}

@media(max-width:980px){
  .account-page .account-actions{
    grid-template-columns:1fr 1fr;
  }
  .account-page .account-actions .account-aside{
    grid-column:1/-1;
    min-height:0;
  }
  .account-page .account-actions .account-aside .btn{
    margin-top:22px;
  }
}
@media(max-width:640px){
  .account-page .account-actions,
  .account-page .learning-overview{
    grid-template-columns:1fr;
  }
  .account-page .account-actions > *{
    min-height:0;
  }
  .account-page .account-actions .account-block .btn,
  .account-page .account-actions .redeem{
    margin-top:18px;
  }
}