@charset "UTF-8";
/* ---------- UL: Tailwind `space-y-4 list-none p-0 m-0` ---------- */
.feed-list {
  list-style: none;   /* list-none */
  padding: 0;         /* p-0 */
  margin: 0;          /* m-0 */
}

/* vertical spacing between LIs: space-y-4 (1rem) */
.feed-list > li + li {
  margin-top: 1rem;
}

/* ---------- LI container: bg-[#F5F5F5] p-4 rounded flex flex-col ... ---------- */
.feed-list > li {
  background-color: #F5F5F5; /* bg-[#F5F5F5] */
  padding: 1rem;             /* p-4 */
  border-radius: 0.25rem;    /* rounded */
  display: flex;             /* flex */
  flex-direction: column;    /* flex-col */
  gap: 0.75rem;              /* gap-3 (12px) */
}

/* sm:flex-row sm:items-center sm:justify-between */
@media (min-width: 640px) {
  .feed-list > li {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

/* ---------- Title link: underline font-bold text-black ---------- */
.feed-title {
  text-decoration: underline;
  font-weight: 700;
  color: #000000;
}

/* ---------- URL text: text-gray-700 text-sm break-all ---------- */
.feed-url {
  color: #374151;            /* Tailwind gray-700 */
  font-size: 0.875rem;       /* text-sm */
  line-height: 1.25rem;      /* line-height for text-sm */
  word-break: break-all;     /* break-all */
}

/* sm:text-right sm:flex-1 */
@media (min-width: 640px) {
  .feed-url {
    text-align: right;
    flex: 1 1 auto; /* flex-1 */
  }
}

/* ---------- Copy button (from your previous step) ---------- */
.copy-button {
  background-color: #0472E3;
  color: #ffffff;
  padding: 0.5rem 0.75rem;   /* py-2 px-3 */
  border-radius: 0.25rem;    /* rounded */
  font-size: 0.875rem;       /* text-sm */
  font-weight: 700;          /* font-bold */
  white-space: nowrap;       /* whitespace-nowrap */
  transition: background-color 0.2s ease; /* transition-colors */
  align-self: flex-start;    /* self-start (mobile) */
}

@media (min-width: 640px) {
  .copy-button {
    align-self: auto;        /* sm:self-auto */
  }
}

.copy-button:hover {
  background-color: #0359B1; /* hover:bg-[#0359B1] */
}