.wpplatform-post-sidebar {
  --post-sidebar-heading: var(--school-heading);
  --post-sidebar-text: var(--school-text);
  --post-sidebar-primary: var(--school-primary);
  --post-sidebar-secondary: var(--school-secondary);
  --post-sidebar-border: var(--school-card-border-color);
  --post-sidebar-card: var(--school-card-background);
  --post-sidebar-radius: var(--school-card-radius);
  --post-sidebar-radius-lg: var(--school-radius-large);
  --post-sidebar-shadow: var(--school-card-shadow);
  display: grid;
  gap: var(--school-space-4);
  position: sticky;
  top: calc(var(--school-header-sticky-top) + var(--school-space-4));
}

.wpplatform-post-sidebar__card {
  /*
  overflow: hidden;
  border: var(--school-card-border-width) solid var(--post-sidebar-border);
  border-top: 0.35rem solid var(--post-sidebar-secondary);
  border-radius: var(--post-sidebar-radius-lg);
  background: var(--post-sidebar-card);
  box-shadow: var(--post-sidebar-shadow);
  padding: var(--school-space-4);
  */
    position: relative;
    overflow: hidden;
    padding: var(--school-space-4);
    border: var(--school-card-border-width) solid var(--post-sidebar-border);
    border-radius: var(--post-sidebar-radius-lg);
    background: var(--post-sidebar-card);
}
.wpplatform-post-sidebar__card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 0.3rem;
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    content: "";
}
.wpplatform-post-sidebar__card h2 {
  margin: 0 0 var(--school-space-3);
  color: var(--post-sidebar-heading);
  font-size: var(--wp--preset--font-size--heading-5);
}

.wpplatform-post-sidebar__category-list {
  display: grid;
  gap: var(--school-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.wpplatform-post-sidebar__category-list li {
  display: flex;
  gap: var(--school-space-2);
  align-items: center;
  justify-content: space-between;
  min-height: 3.8rem;
  padding: var(--school-space-2);
  border: var(--school-card-border-width) solid var(--post-sidebar-border);
  border-radius: var(--post-sidebar-radius);
  color: var(--post-sidebar-primary);
  font-weight: 700;
}

.wpplatform-post-sidebar__category-list a {
  color: var(--post-sidebar-heading);
  text-decoration: none;
}

.wpplatform-post-sidebar__category-list a:hover,
.wpplatform-post-sidebar__category-list a:focus-visible {
  color: var(--post-sidebar-primary);
}

.wpplatform-post-sidebar__recent-list {
  display: grid !important;
  gap: var(--school-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.wpplatform-post-sidebar__recent-list > li {
  margin: 0;
}

.wpplatform-post-sidebar__recent-item {
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr);
  gap: var(--school-space-2);
  align-items: start;
  margin: 0;
}

.wpplatform-post-sidebar__recent-item + .wpplatform-post-sidebar__recent-item {
  padding-top: var(--school-space-3);
  border-top: var(--school-card-border-width) solid var(--post-sidebar-border);
}

.wpplatform-post-sidebar__recent-image,
.wpplatform-post-sidebar__recent-image a,
.wpplatform-post-sidebar__recent-image img {
  display: block;
  width: 100%;
  margin: 0;
}

.wpplatform-post-sidebar__recent-image img {
  aspect-ratio: 1;
  border-radius: var(--post-sidebar-radius);
  object-fit: cover;
}

.wpplatform-post-sidebar__recent-title {
  margin: 0 0 0.35rem;
  color: var(--post-sidebar-heading);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--fs-15, 1rem);
  font-weight: 700;
  line-height: 1.25;
}

.wpplatform-post-sidebar__recent-title a {
  color: inherit;
  text-decoration: none;
}

.wpplatform-post-sidebar__recent-title a:hover,
.wpplatform-post-sidebar__recent-title a:focus-visible {
  color: var(--post-sidebar-primary);
}

.wpplatform-post-sidebar__recent-date {
  margin: 0;
  color: var(--post-sidebar-text);
  font-size: var(--wp--preset--font-size--caption);
}

@media (max-width: 59.9375rem) {
  .wpplatform-post-sidebar {
    position: static;
  }
}

@media (max-width: 37.4375rem) {
  .wpplatform-post-sidebar__recent-item {
    grid-template-columns: 4.5rem minmax(0, 1fr);
  }
}