/* Content external / cloud / store link chips — loaded last for specificity */

.article-content a.fs-ext-link,
.article-content a.fs-store-link,
a.fs-ext-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: fit-content !important;
  max-width: min(100%, 420px) !important;
  margin: 10px 0 14px !important;
  padding: 12px 16px 12px 12px !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  border-radius: 12px !important;
  border: 1px solid rgba(232, 201, 106, 0.38) !important;
  background:
    linear-gradient(145deg, rgba(247, 229, 163, 0.1) 0%, transparent 42%),
    #161b24 !important;
  box-shadow:
    0 0 0 1px rgba(232, 201, 106, 0.08),
    0 10px 24px rgba(0, 0, 0, 0.28) !important;
  color: #f2f4f8 !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.article-content a.fs-ext-link:hover,
.article-content a.fs-store-link:hover,
a.fs-ext-link:hover {
  transform: translateY(-2px) !important;
  text-decoration: none !important;
  border-color: rgba(232, 201, 106, 0.7) !important;
  box-shadow:
    0 0 0 1px rgba(232, 201, 106, 0.16),
    0 14px 28px rgba(0, 0, 0, 0.36),
    0 6px 14px rgba(193, 149, 73, 0.12) !important;
  filter: none !important;
  color: #fff !important;
}

.article-content a.fs-ext-link *,
.article-content a.fs-store-link *,
a.fs-ext-link * {
  text-decoration: none !important;
  box-sizing: border-box !important;
}

.fs-ext-link__icon,
.fs-store-link__icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 10px !important;
  background: rgba(232, 201, 106, 0.14) !important;
  color: #e8c96a !important;
  border: 1px solid rgba(232, 201, 106, 0.28) !important;
}

.fs-ext-link__svg,
.fs-store-link__svg {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
}

.fs-ext-link__body,
.fs-store-link__body {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px !important;
  min-width: 0 !important;
  text-align: left !important;
}

.fs-ext-link__title,
.fs-store-link__title {
  display: block !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  color: #f7e5a3 !important;
  line-height: 1.25 !important;
}

.fs-ext-link__desc,
.fs-store-link__desc {
  display: block !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #9aa3af !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 280px !important;
}

/* iOS */
.article-content a.fs-ext-link--ios,
.article-content a.fs-store-link--ios,
a.fs-ext-link--ios {
  background: linear-gradient(180deg, #3d8fff 0%, #1a5fd6 100%) !important;
  border-color: rgba(120, 180, 255, 0.45) !important;
  color: #fff !important;
}
.article-content a.fs-ext-link--ios .fs-ext-link__icon,
.article-content a.fs-store-link--ios .fs-store-link__icon,
a.fs-ext-link--ios .fs-ext-link__icon {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  color: #fff !important;
}
.article-content a.fs-ext-link--ios .fs-ext-link__title,
.article-content a.fs-ext-link--ios .fs-ext-link__desc,
a.fs-ext-link--ios .fs-ext-link__title,
a.fs-ext-link--ios .fs-ext-link__desc {
  color: #fff !important;
}
.article-content a.fs-ext-link--ios .fs-ext-link__desc,
a.fs-ext-link--ios .fs-ext-link__desc {
  opacity: 0.88 !important;
}

/* Android */
.article-content a.fs-ext-link--android,
.article-content a.fs-store-link--android,
a.fs-ext-link--android {
  background: linear-gradient(180deg, #4ec85e 0%, #2d9a45 100%) !important;
  border-color: rgba(140, 230, 150, 0.4) !important;
  color: #fff !important;
}
.article-content a.fs-ext-link--android .fs-ext-link__icon,
a.fs-ext-link--android .fs-ext-link__icon {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  color: #fff !important;
}
.article-content a.fs-ext-link--android .fs-ext-link__title,
.article-content a.fs-ext-link--android .fs-ext-link__desc,
a.fs-ext-link--android .fs-ext-link__title,
a.fs-ext-link--android .fs-ext-link__desc {
  color: #fff !important;
}

/* Cloud / file — keep dark card + gold accents (matches site) */
.article-content a.fs-ext-link--cloud .fs-ext-link__title,
.article-content a.fs-ext-link--file .fs-ext-link__title,
a.fs-ext-link--cloud .fs-ext-link__title,
a.fs-ext-link--file .fs-ext-link__title {
  color: #f7e5a3 !important;
}

.article-content a.fs-ext-link--web .fs-ext-link__title,
a.fs-ext-link--web .fs-ext-link__title {
  color: #e8c96a !important;
}

@media (max-width: 560px) {
  .article-content a.fs-ext-link,
  a.fs-ext-link {
    max-width: 100% !important;
    width: 100% !important;
  }
  .fs-ext-link__desc {
    max-width: 100% !important;
    white-space: normal !important;
  }
}