/**
 * GMP Dashboard Fixes - v1.6.0
 */

/* 1. PROFILE ICON */
nav.nav .nav__list .nav__list-item.nav__profile-avatar {
  margin-bottom: 16px !important;
  margin-top: auto !important;
}
nav.nav .nav__list {
  padding-bottom: 8px !important;
}

/* 2. REDUCE GAP */
.content .grid-container.content__main .content__block {
  max-width: 1300px !important;
  margin-left: 40px !important;
  margin-right: auto !important;
}

/* 3. COMPLETION CIRCLE STYLING */
.progress-bar .progressbar-text {
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #2d3748 !important;
}

/* 4. HIDE FAVOURITED QUESTIONS */
.gmp-stat-cards .gmp-stat-card:nth-child(3) {
  display: none !important;
}
.gmp-stat-cards {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}

/* 5. SLIMMER STAT CARDS */
.gmp-stat-cards .gmp-stat-card {
  padding: 14px 20px !important;
  min-height: unset !important;
}
.gmp-stat-card__number { font-size: 28px !important; }
.gmp-stat-card__label { font-size: 12px !important; }

/* 6. AREAS OF LIFE GRID */
body.template-plan .cell.small-12.medium-12.large-8 > .card.areas-of-life,
.dashboard .card.areas-of-life,
.content .card.areas-of-life,
div.card.areas-of-life {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  flex-direction: unset !important;
}

body.template-plan .card.areas-of-life .area-of-life,
.dashboard .card.areas-of-life .area-of-life,
.card.areas-of-life .area-of-life {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  transition: box-shadow 0.15s ease !important;
}
.card.areas-of-life .area-of-life:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
}

.card.areas-of-life .progress-bar.small svg {
  display: none !important;
}

.card.areas-of-life .progress-bar.small {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
}

.card.areas-of-life .progress-bar.small .gmp-area-emoji,
.card.areas-of-life .progress-bar.small span {
  font-size: 24px !important;
  line-height: 1 !important;
  z-index: 1 !important;
}

.card.areas-of-life .progress-bar.small .gmp-area-emoji img.emoji,
.card.areas-of-life .progress-bar.small img.emoji {
  width: 28px !important;
  height: 28px !important;
}

.card.areas-of-life .area-of-life.health .progress-bar.small { background: #ffeef0 !important; }
.card.areas-of-life .area-of-life.relationship .progress-bar.small { background: #fff0f5 !important; }
.card.areas-of-life .area-of-life.wealth .progress-bar.small { background: #e8f4fd !important; }
.card.areas-of-life .area-of-life.social .progress-bar.small { background: #eef0ff !important; }
.card.areas-of-life .area-of-life.wisdom .progress-bar.small { background: #f5f0ff !important; }
.card.areas-of-life .area-of-life.sprituality .progress-bar.small { background: #fef9e7 !important; }
.card.areas-of-life .area-of-life.business .progress-bar.small { background: #fef3e2 !important; }
.card.areas-of-life .area-of-life.life .progress-bar.small { background: #e8f4fd !important; }

.card.areas-of-life .area-of-life > a.progress-bar__link:first-of-type {
  flex: 0 0 auto !important;
}

.card.areas-of-life .area-of-life > a.progress-bar__link:last-of-type {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  text-decoration: none !important;
}

.card.areas-of-life .progress-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.card.areas-of-life .progress-content .title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 0 !important;
}

/* Completion text - must beat body.template-plan .area-of-life .progress-content p:not(.title) */
body.template-plan .area-of-life .progress-content p:not(.title),
body.template-plan .card.areas-of-life .area-of-life .progress-content p:not(.title),
.card.areas-of-life .progress-content p:last-child {
  font-size: 13px !important;
  color: #64748b !important;
  margin: 8px 0 0 0 !important;
  padding: 16px 0 0 0 !important;
  position: relative !important;
}

body.template-plan .area-of-life .progress-content p:not(.title)::before,
.card.areas-of-life .progress-content p:last-child::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 4px !important;
  background: #e2e8f0 !important;
  border-radius: 2px !important;
}

body.template-plan .area-of-life .progress-content p:not(.title)::after,
.card.areas-of-life .progress-content p:last-child::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  height: 4px !important;
  background: linear-gradient(90deg, #00D4FF, #00B4D8) !important;
  border-radius: 2px !important;
  width: 0% !important;
}

.card.areas-of-life .health .progress-content p:last-child::after,
body.template-plan .area-of-life.health .progress-content p:not(.title)::after { width: 10% !important; }
.card.areas-of-life .relationship .progress-content p:last-child::after,
body.template-plan .area-of-life.relationship .progress-content p:not(.title)::after { width: 2% !important; }

.card.areas-of-life input[type="hidden"] {
  display: none !important;
}

@media (max-width: 900px) {
  body.template-plan .cell.small-12.medium-12.large-8 > .card.areas-of-life,
  .dashboard .card.areas-of-life,
  .card.areas-of-life {
    grid-template-columns: 1fr !important;
  }
}
