/* Coin detail page */

/* Section spacing */
section[data-bg="first-to-second"] > [data-layout="article"] {
  padding-top: 1.5rem;
}

/* ─── Description collapse ─── */
[data-component="coin-description"] {
  display: flex;
  flex-direction: column;
}

[data-component="coin-description"] p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

[data-component="coin-description"]:has(details[open]) p {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}

[data-component="coin-description"] details {
  display: contents;
}

[data-component="coin-description"] summary {
  cursor: pointer;
  list-style: none;
  color: rgb(var(--primary));
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: background-color 0.15s;
  position: sticky;
  bottom: 1rem;
  align-self: flex-end;
  margin-top: 0.25rem;
}

[data-component="coin-description"] summary::-webkit-details-marker {
  display: none;
}

[data-component="coin-description"] summary::after {
  content: '↓';
  font-size: 0.9rem;
}

[data-component="coin-description"] details[open] summary::after {
  content: '↑';
}

[data-component="coin-description"] summary:hover {
  background-color: rgba(var(--primary), 0.1);
}

/* ─── Whitepaper button ─── */
.coin-whitepaper-wrap {
  display: flex;
}

.coin-whitepaper-wrap a[role="button"]::after {
  display: none;
}

@media (max-width: 64rem) {
  .coin-whitepaper-wrap {
    justify-content: center;
  }
}

/* ─── Left sidebar ─── */
[data-component="coin-sidebar"] {
  padding: 1.5rem;
  gap: 0.75rem;
}

[data-component="coin-sidebar"] hr {
  margin: 0.25rem 0;
}

[data-component="coin-sidebar"] h4 {
  margin-bottom: 0.25rem;
}

/* Price group */
[data-component="coin-price-group"] {
  gap: 0.15rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Date "au XX mois YYYY HH:MM:SS UTC" */
.coin-data-date {
  display: block;
  text-transform: none;
}

[data-component="coin-sidebar"] .coin-data-date,
[data-component="coin-perftable"] .coin-data-date {
  text-align: right;
}

/* Change indicators */
.is-positive {
  color: var(--success);
}

.is-negative {
  color: var(--danger);
}

/* Strategy tag pills */
.coin-tag {
  padding: 0.25rem 0.7rem;
  border-radius: 1rem;
  font-size: 0.82rem;
  border: 1px solid rgba(var(--primary), 0.25);
  display: inline-block;
  text-decoration: none;
  color: rgb(var(--primary));
  transition: background-color 0.15s, color 0.15s;
}

a.coin-tag:hover {
  background-color: rgb(var(--primary));
  color: var(--blanc);
  border-color: rgb(var(--primary));
}

/* ─── Right column ─── */
#coin-chart {
  width: 100%;
  min-height: 400px;
}

@media (max-width: 64rem) {
  #coin-chart {
    min-height: 300px;
  }
}

/* Performance table */
[data-component="coin-perftable"] table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}

[data-component="coin-perftable"] th,
[data-component="coin-perftable"] td {
  padding: 0.5rem 1rem;
}

[data-component="coin-perftable"] th {
  font-size: 0.85rem;
  opacity: 0.7;
}

[data-component="coin-perftable"] td[data-color="success"] {
  color: var(--success);
}

[data-component="coin-perftable"] td[data-color="danger"] {
  color: var(--danger);
}
