.app-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  padding: var(--space-md);
  box-shadow: 0 6px 30px -20px color-mix(in srgb, var(--color-black) 45%, transparent);
}

.app-card--flat {
  box-shadow: none;
}

.app-prose > *:last-child {
  margin-bottom: 0;
}

.app-post-title {
  margin-bottom: var(--space-md);
}

.app-post-title--sm {
  font-size: var(--font-size-h4);
  line-height: var(--line-height-h4);
  font-weight: var(--font-weight-h4);
}

.app-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
  margin-top: var(--space-md);
}

.app-inline-links {
  margin-top: var(--space-sm);
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
  font-size: var(--font-size-menu);
  line-height: var(--line-height-menu);
  font-weight: var(--font-weight-menu);
}

.app-button,
button,
input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  padding: 10px 18px;
  text-decoration: none;
  font-size: var(--font-size-button);
  line-height: var(--line-height-button);
  font-weight: var(--font-weight-button);
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
  background: var(--color-primary);
  color: var(--color-white);
}

.app-button:hover,
button:hover,
input[type="submit"]:hover {
  background: var(--color-pink);
  color: var(--color-white);
}

.app-button:active,
button:active,
input[type="submit"]:active {
  background: color-mix(in srgb, var(--color-primary) 75%, var(--color-black));
}

.app-button--secondary {
  background: var(--color-secondary);
  color: var(--color-text);
}

.app-button--ghost {
  background: transparent;
  border-color: var(--color-primary);
  color: var(--color-primary);
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
  opacity: var(--state-disabled-opacity);
  cursor: not-allowed;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea,
select {
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  background: var(--color-white);
  color: var(--color-text);
}

.app-course-thumb {
  display: block;
  margin-bottom: var(--space-sm);
  overflow: hidden;
  border-radius: var(--radius-md);
}

.app-course-card .app-post-title {
  margin-bottom: var(--space-sm);
}

.app-muted {
  color: var(--color-text-soft);
}

.tutor-wrap,
.tutor-container,
.tutor-course-details-page,
.tutor-dashboard {
  font-family: var(--font-family-base);
  color: var(--color-text);
}

.tutor-dashboard .tutor-dashboard-content,
.tutor-wrap-parent {
  max-width: var(--container-max);
  margin-left: auto;
  margin-right: auto;
}

.tutor-dashboard .tutor-btn,
.tutor-btn,
.tutor-button {
  border-radius: var(--radius-md);
}

.tutor-dashboard .tutor-dashboard-left-menu,
.tutor-dashboard .tutor-dashboard-right-menu {
  border-radius: var(--radius-lg);
}
