/* ✅ NO BLINK CSS - Smooth Transitions */

/* Smooth value updates */
.market-price,
.cash-value,
.option-price,
.signal-value {
  transition: all 0.3s ease;
}

/* Flash effect on value change */
@keyframes valueFlash {
  0% { background-color: transparent; }
  50% { background-color: rgba(34, 197, 94, 0.2); }
  100% { background-color: transparent; }
}

.value-updated {
  animation: valueFlash 0.5s ease;
}

/* Smooth color transitions */
.market-change,
.option-change {
  transition: color 0.3s ease;
}

.market-change.positive,
.option-change.positive {
  color: #22c55e;
}

.market-change.negative,
.option-change.negative {
  color: #ef4444;
}

/* Prevent layout shifts */
.market-price,
.cash-value,
.option-price {
  min-width: 100px;
  display: inline-block;
}

/* Smooth refresh button rotation */
#clear-btn {
  transition: transform 0.5s ease;
}

/* Trend display smooth scaling */
#trend-display {
  transition: transform 0.2s ease, color 0.3s ease;
}

/* Signal cards - no blink on updates */
.signal-card {
  transition: opacity 0.3s ease;
}

.signal-card.updating {
  opacity: 0.8;
}

/* Buy signals container - smooth height changes */
#buy-signals-list {
  transition: height 0.3s ease;
}

/* Cash flow values - smooth number changes */
.cash-item .cash-value {
  font-variant-numeric: tabular-nums;
  min-width: 120px;
  text-align: right;
}

/* ITM options - smooth price updates */
.itm-option-price {
  font-variant-numeric: tabular-nums;
  transition: background-color 0.3s ease;
}

/* Status indicators - smooth color changes */
.signal-status {
  transition: background-color 0.3s ease, color 0.3s ease;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 0.85em;
}

.signal-status {
  background-color: #3b82f620;
  color: #3b82f6;
}

/* Prevent text selection during updates */
.market-price,
.cash-value,
.option-price,
.signal-value {
  user-select: none;
}

/* Loading state - subtle */
.loading {
  opacity: 0.7;
  pointer-events: none;
}

/* Smooth fade for new elements */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

.signal-card {
  animation: fadeIn 0.3s ease;
}

/* Grid layout stability - prevent shifts */
.market-overview,
.cash-metrics,
.itm-options-grid {
  display: grid;
  gap: 16px;
}

.market-item,
.cash-item,
.option-item {
  min-height: 80px;
}

/* Ensure numbers don't cause layout shifts */
.market-price,
.cash-value {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.5px;
}

/* Smooth timestamp updates */
.signal-footer small,
#candle-timestamp {
  transition: opacity 0.3s ease;
  font-variant-numeric: tabular-nums;
}

/* Prevent flicker on re-paint */
* {
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Hardware acceleration for smooth updates */
.market-price,
.cash-value,
.option-price,
.signal-card {
  transform: translateZ(0);
  will-change: contents;
}