.theme-text {
      color: var(--text);
      transition: color 0.2s ease;
    }

    .theme-text:hover {
      color: var(--hover);
    }

    .nav-boxes {
      background-color: var(--nav);
    }

    .hover-nav:hover {
      background-color: var(--hover-nav);
    }

    .card-background {
      background-color: var(--card-background)
    }

    .card-new:hover {
      background-color: var(--card-hover)
    }

  .card {
    display: block;
    width: 6rem; /* w-24 */
    padding: 1.5rem; /* p-6 */
    background-color: var(--bg);
    border: 1px solid rgb(59, 64, 73);
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    transition: background-color 0.2s ease;
  }

  .card:hover {
    background-color: var(--card-hover)
  }

  .card img {
    width: 3rem; /* w-12 */
    height: 3rem; /* h-12 */
    border-radius: 9999px;
  }