/* FinderOption — çerçeveli şık satırı. Keskin köşe, ince kenarlık (KEREM dili).
   Hover'da kenarlık vurgu rengine döner ve ok içeri kayar.
   Tıklayınca kısa bir yanıp sönme, ardından sonraki soruya geçiş. */

.cc_ud05zvg3_aZBf6uVUFx .fopt {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  text-align: left;
  border: 1px solid var(--line-2);
  background: var(--paper);
  color: var(--ink);
  padding: 16px 18px;
  cursor: pointer;
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  transition:
    border-color .22s var(--ease),
    color .22s var(--ease),
    background-color .22s var(--ease),
    transform .22s var(--ease);
}

.cc_ud05zvg3_aZBf6uVUFx .fopt:hover {
  border-color: var(--pf-ac, var(--accent));
  color: var(--pf-ac, var(--accent));
  transform: translateY(-2px);
}
.cc_ud05zvg3_aZBf6uVUFx .fopt:focus-visible { outline: 2px solid var(--pf-ac, var(--accent)); outline-offset: 2px; }

.cc_ud05zvg3_aZBf6uVUFx .fopt.is-selected {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--paper);
}

/* Tıklama onayı — hızlı. Kenarlık ve zemin vurgu rengine atlayıp geri dönüyor. */
.cc_ud05zvg3_aZBf6uVUFx .fopt.is-flashing { animation: cc_ud05zvg3_aZBf6uVUFx_fopt-flash .18s var(--ease); }
@keyframes cc_ud05zvg3_aZBf6uVUFx_fopt-flash {
  0%   { background-color: var(--paper); border-color: var(--line-2); color: var(--ink); }
  40%,
  70%  { background-color: var(--pf-ac, var(--accent)); border-color: var(--pf-ac, var(--accent)); color: var(--on-accent); }
  100% { background-color: var(--paper); border-color: var(--line-2); color: var(--ink); }
}

.cc_ud05zvg3_aZBf6uVUFx .fopt__label { flex: 1; min-width: 0; }

/* Görselli şık: solda küçük kare. Çerçeveye yaslanması için padding kısalıyor. */
.cc_ud05zvg3_aZBf6uVUFx .fopt--media { padding: 10px 18px 10px 10px; }
.cc_ud05zvg3_aZBf6uVUFx .fopt__media {
  flex: none;
  order: -1;
  width: 52px;
  height: 52px;
  overflow: hidden;
  background: var(--paper-2);
  display: block;
}
.cc_ud05zvg3_aZBf6uVUFx .fopt__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--ease); }
.cc_ud05zvg3_aZBf6uVUFx .fopt:hover .fopt__media img { transform: scale(1.06); }

/* Sağdaki ok — hover'da içeri kayar. */
.cc_ud05zvg3_aZBf6uVUFx .fopt::before {
  content: "→";
  order: 2;
  flex: none;
  font-size: 15px;
  color: var(--ink-3);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity .22s var(--ease), transform .25s var(--ease), color .22s var(--ease);
}
.cc_ud05zvg3_aZBf6uVUFx .fopt:hover::before { opacity: 1; transform: none; color: var(--pf-ac, var(--accent)); }
.cc_ud05zvg3_aZBf6uVUFx .fopt.is-selected::before, .cc_ud05zvg3_aZBf6uVUFx .fopt.is-flashing::before { opacity: 1; transform: none; color: currentColor; }

@media (prefers-reduced-motion: reduce) {
  .cc_ud05zvg3_aZBf6uVUFx .fopt.is-flashing { animation-duration: .01s; }
  .cc_ud05zvg3_aZBf6uVUFx .fopt:hover { transform: none; }
}

@media (max-width: 480px) {
  .cc_ud05zvg3_aZBf6uVUFx .fopt { padding: 14px 14px; gap: 12px; }
  .cc_ud05zvg3_aZBf6uVUFx .fopt--media { padding: 8px 14px 8px 8px; }
  .cc_ud05zvg3_aZBf6uVUFx .fopt__media { width: 46px; height: 46px; }
}

/* TOKEN KÖPRÜ — bkz. global.css */
.cc_ud05zvg3_aZBf6uVUFx .fopt { letter-spacing: var(--ts-label-narrow-ls, .1em); }
