/* BTC Latest News Widget - Ghost Rinne Theme Integration */

/* Widget container styling to match sidebar design */
.btc-news-widget-container {
  margin-top: 1.5rem;
}

/* Make widget sticky like subscribe form */
.btc-news-widget-container.is-sticky {
  position: sticky;
  top: calc(var(--global-header-height) + 2rem);
  z-index: 10;
}

/* Ensure widget fits nicely in sidebar */
#btc-latest-news-widget {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

/* Override widget background to match theme */
html[data-color-scheme="light"] #btc-latest-news-widget .btc-news-widget {
  background: var(--color-base-10) !important;
  border-color: var(--color-base-20) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-widget {
  background: var(--color-base-05) !important;
  border-color: var(--color-base-15) !important;
}

/* Match text colors with theme */
html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-item-title {
  color: var(--color-base-90) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-excerpt {
  color: var(--color-base-70) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-meta {
  color: var(--color-base-60) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-empty {
  color: var(--color-base-70) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget .btc-news-footer {
  border-top-color: var(--color-base-15) !important;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .btc-news-widget-container.is-sticky {
    position: relative;
    top: auto;
  }
}

/* Performance optimization - only load animations when visible */
@media (prefers-reduced-motion: reduce) {
  #btc-latest-news-widget * {
    transition: none !important;
    animation: none !important;
  }
}

/* Loading state styling */
#btc-latest-news-widget:empty::before {
  content: "";
  display: block;
  width: 100%;
  height: 200px;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: loading 2s infinite;
  border-radius: 8px;
}

html[data-color-scheme="dark"] #btc-latest-news-widget:empty::before {
  background: linear-gradient(90deg, #2a2a2a 25%, #3a3a3a 50%, #2a2a2a 75%);
  background-size: 200% 100%;
}

@keyframes loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Hide loading animation when widget has content */
#btc-latest-news-widget:not(:empty)::before {
  display: none;
}

/* Noscript fallback styling */
#btc-latest-news-widget noscript > div {
  font-family: inherit;
  border-color: var(--color-base-20) !important;
}

html[data-color-scheme="dark"] #btc-latest-news-widget noscript > div {
  background: var(--color-base-05) !important;
  border-color: var(--color-base-15) !important;
  color: var(--color-base-80) !important;
}