@use "../../../styles/abstracts/variables" as *;
@use "../../../styles/abstracts/mixins" as *;

/* ================= PAGE ================= */
.page {
  @include dashPageComponent;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: $bg-soft;
  border: 1px solid $border;
  padding: 0;

  @media (max-width: 768px) {
   margin-top: 1.4rem;
  }
}

/* ================= CONTENT ================= */
.content {
  padding: 1rem 2.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;

  @media (max-width: 1000px) {
    padding: 1.5rem;
  }
}

/* ================= PROJECTS SECTION ================= */
.projectsSection {
  padding: 0 2.5rem 2rem 2.5rem;

  @media (max-width: 1000px) {
    padding: 0 1.5rem 2rem 1.5rem;
  }
}

/* ================= STATS SPACING ================= */
.content :global(.dash-stats-card) {
  margin-top: 0.5rem;
}

/* ================= RESPONSIVE ================= */
@media (max-width: 768px) {
  .content {
    gap: 1rem;
  }

  .projectsSection {
    padding: 0 1rem 2rem 1rem;
  }
}