/*components.css*/

.card,
.about-me-main,
.system-panel,
.profile-section {
  background: white;
  padding: 16px;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.card { padding: 15px; }

.updates {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}

.card h2 { margin-top: 0; }

.image-placeholder {
  margin: 0 auto 10px; /* centers it */
}

/* === SCROLLBAR ============================================= */

/* width */
::-webkit-scrollbar {
  width: 8px;
}

/* track (the background) */
::-webkit-scrollbar-track {
  background: #fff0f7;
  border-radius: 8px;
}

/* handle (the draggable bit) */
::-webkit-scrollbar-thumb {
  background: #ffd6ea;
  border-radius: 8px;
}

/* handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #ffb8d9;
}

/* handle when dragging */
::-webkit-scrollbar-thumb:active {
  background: #ff8fc6;
}

/* firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #ffd6ea #fff0f7;
}