/* Font Awesome Emoji Kart Stili (fa) */
/* Mevcut markup: label > input + span.checkmark + span.yazi */
/* Bu dosya sadece emoji_style=fa iken yüklenecek */

/* GRID yerleşim: 5 sütun → tablet 3 → mobil 2 */
.memnuniyet { display:grid; gap:12px; grid-template-columns:repeat(5,minmax(110px,1fr)); align-items:stretch; }
@media (max-width: 768px){ .memnuniyet { grid-template-columns:repeat(3,minmax(110px,1fr)); gap:10px; } }
@media (max-width: 480px){ .memnuniyet { grid-template-columns:repeat(2,minmax(120px,1fr)); gap:10px; } }

.memnuniyet .fa-emoji { position: relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:14px 10px; border:1px solid #eef2f6; border-radius:16px; background:#f7f9fb !important; transition:border-color .15s ease, box-shadow .15s ease, transform .08s ease, background-color .15s ease; min-width:0; min-height:118px; }
.memnuniyet .fa-emoji:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.06); background:#f7f9fb !important; border-color:var(--fa-c,#dbeafe); }
/* Force neutral hover background to avoid nth-child tinted hovers from survey-form.css */
.memnuniyet .fa-emoji:nth-child(n):hover { background:#f7f9fb !important; }

/* Gizli input zaten emoji-style.css tarafından display:none oluyor */
.memnuniyet .fa-checkmark { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; position:relative; transition:color .15s ease, transform .15s ease; border:0; background:transparent; box-shadow:none; }
.fa-emoji__icon { font-size:42px; color:var(--fa-c,#64748b); width:1em; height:1em; display:inline-block; background-repeat:no-repeat; background-position:center; background-size:contain; }
.fa-emoji__label { font-weight:600; font-size:.9rem; color:#111827; text-align:center; }

/* Seçili durum */
.memnuniyet input[type="radio"]:checked + .fa-checkmark,
.memnuniyet .fa-checkmark.selected { border:0; background:transparent; box-shadow:0 0 0 3px var(--fa-g,#dbeafe); }
.memnuniyet input[type="radio"]:checked + .fa-checkmark .fa-emoji__icon,
.memnuniyet .fa-checkmark.selected .fa-emoji__icon { transform:scale(1.08); }
/* Neutralize generic ripple/indicator from survey-form.css */
.memnuniyet input[type="radio"]:checked + .fa-checkmark { transform:none !important; filter:none !important; animation:none !important; }
.memnuniyet .fa-checkmark::before,
.memnuniyet input[type="radio"]:checked + .fa-checkmark::before,
.memnuniyet input[type="radio"]:checked + .fa-checkmark::after { content:none !important; background:none !important; box-shadow:none !important; }

/* Kart çerçevesinde vurguyu artır (ring olmadan) */
.memnuniyet .fa-emoji:hover { border-color: #dbeafe; }
.memnuniyet .fa-emoji:focus-within { border-color: var(--fa-c,#2563eb); box-shadow:0 0 0 3px var(--fa-g,#dbeafe); }

/* Renk temaları */
.fa-emoji--verygood { --fa-c:#16a34a; --fa-g:rgba(22,163,74,.18); }
.fa-emoji--good { --fa-c:#65a30d; --fa-g:rgba(101,163,13,.18); }
.fa-emoji--neutral { --fa-c:#eab308; --fa-g:rgba(234,179,8,.2); }
.fa-emoji--bad { --fa-c:#f59e0b; --fa-g:rgba(245,158,11,.2); }
.fa-emoji--verybad { --fa-c:#ef4444; --fa-g:rgba(239,68,68,.22); }

/* Yerel, hafifletilmiş SVG ikonlar (currentColor ile boyanır) */
.fa-emoji--verygood .fa-emoji__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%2316a34a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M20 38c4 6 20 6 24 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%2316a34a'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%2316a34a'/%3E%3C/svg%3E"); }
.fa-emoji--good .fa-emoji__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%2365a30d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 39c8 5 12 5 20 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%2365a30d'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%2365a30d'/%3E%3C/svg%3E"); }
.fa-emoji--neutral .fa-emoji__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23eab308' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cline x1='22' y1='40' x2='42' y2='40'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23eab308'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23eab308'/%3E%3C/svg%3E"); }
.fa-emoji--bad .fa-emoji__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23f59e0b' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 44c8 -5 12 -5 20 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23f59e0b'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23f59e0b'/%3E%3C/svg%3E"); }
.fa-emoji--verybad .fa-emoji__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23ef4444' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 45c8 -6 12 -6 20 0'/%3E%3Cpath d='M20 22l8 4M44 22l-8 4'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23ef4444'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23ef4444'/%3E%3C/svg%3E"); }

/* Sonuç sayfası ikonları */
.fa-result--verygood .fa-result__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23166534' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M20 38c4 6 20 6 24 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23166534'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23166534'/%3E%3C/svg%3E"); }
.fa-result--good .fa-result__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%233f6212' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 39c8 5 12 5 20 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%233f6212'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%233f6212'/%3E%3C/svg%3E"); }
.fa-result--neutral .fa-result__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23a16207' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cline x1='22' y1='40' x2='42' y2='40'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23a16207'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23a16207'/%3E%3C/svg%3E"); }
.fa-result--bad .fa-result__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23b45309' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 44c8 -5 12 -5 20 0'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23b45309'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23b45309'/%3E%3C/svg%3E"); }
.fa-result--verybad .fa-result__icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none' stroke='%23b91c1c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='32' cy='32' r='26'/%3E%3Cpath d='M22 45c8 -6 12 -6 20 0'/%3E%3Cpath d='M20 22l8 4M44 22l-8 4'/%3E%3Ccircle cx='24' cy='26' r='2.5' fill='%23b91c1c'/%3E%3Ccircle cx='40' cy='26' r='2.5' fill='%23b91c1c'/%3E%3C/svg%3E"); }

/* Edit ekranındaki eski gradyan arka planları kesin olarak etkisizleştir */
.emoji-options-preview.memnuniyet .smiley-input-group .checkmark,
.question-card .memnuniyet .checkmark,
.memnuniyet .checkmark {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Sonuç görünümü */
.fa-result { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:20px; font-size:.85rem; font-weight:500; background:#f1f5f9; border:1px solid #e2e8f0; }
.fa-result__icon { font-size:20px; width:1em; height:1em; display:inline-block; background-repeat:no-repeat; background-position:center; background-size:contain; }
.fa-result--verygood { background:rgba(22,163,74,.08); color:#166534; border-color:rgba(22,163,74,.25); }
.fa-result--good { background:rgba(101,163,13,.08); color:#3f6212; border-color:rgba(101,163,13,.25); }
.fa-result--neutral { background:rgba(234,179,8,.1); color:#a16207; border-color:rgba(234,179,8,.25); }
.fa-result--bad { background:rgba(245,158,11,.1); color:#b45309; border-color:rgba(245,158,11,.25); }
.fa-result--verybad { background:rgba(239,68,68,.12); color:#b91c1c; border-color:rgba(239,68,68,.3); }

/* Mobil */
@media (max-width:768px){
  .memnuniyet .fa-emoji { padding:10px 6px; }
  .memnuniyet .fa-checkmark { width:44px; height:44px; }
  .fa-emoji__icon { font-size:32px; }
  .fa-emoji__label { font-size:.65rem; }
  .fa-result { font-size:.7rem; padding:3px 8px; }
  .fa-result__icon { font-size:16px; }
}

@media (max-width:480px){
  .memnuniyet .fa-emoji { padding:8px 4px; }
  .memnuniyet .fa-checkmark { width:38px; height:38px; }
  .fa-emoji__icon { font-size:26px; }
  .fa-emoji__label { font-size:.55rem; }
}

/* ===== MOBILE MINIMAL MODE (phones) ===== */
@media (max-width:640px){
  /* Turn grid into a single horizontal row with scroll */
  .memnuniyet { display:flex !important; flex-wrap:nowrap; justify-content:space-between; align-items:center; gap:12px; overflow-x:auto; padding:10px 6px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .memnuniyet::-webkit-scrollbar { display:none; }
  /* Card chrome removed */
  .memnuniyet .fa-emoji { background:transparent !important; border:0 !important; box-shadow:none !important; padding:4px 2px; min-height:auto; flex:0 0 auto; }
  /* Show labels (two-line possible) */
  .memnuniyet .fa-emoji__label { display:block !important; font-size:.55rem; line-height:1.05; margin-top:4px; max-width:54px; white-space:normal; word-break:break-word; text-align:center; font-weight:600; }
  /* Icon sizing balanced with label visibility */
  .memnuniyet .fa-checkmark { width:48px; height:48px; }
  .memnuniyet .fa-emoji__icon { font-size:40px; }
  /* Selection halo thinner for mobile */
  .memnuniyet input[type="radio"]:checked + .fa-checkmark, .memnuniyet .fa-checkmark.selected { box-shadow:0 0 0 2px var(--fa-g,#dbeafe); }
}

/* Ultra narrow fallback (<360px): slightly smaller icons to avoid overflow */
@media (max-width:360px){
  .memnuniyet { gap:8px; }
  .memnuniyet .fa-checkmark { width:42px; height:42px; }
  .memnuniyet .fa-emoji__icon { font-size:34px; }
  .memnuniyet .fa-emoji__label { font-size:.5rem; max-width:46px; }
}
