/* Ortak Destek merkezi: sol alttaki düğme ve açılır panel (Components/Shared/Destek).
   Katman: içerik (.wrap 1) ve yapışkan modül şeridi (40) üstünde, üst bar (50) ve menüleri (70) altında. */
.destek__dugme { position:fixed; left:16px; bottom:16px; z-index:45; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:1px solid var(--hat-kart); border-radius:50%; background:var(--yuzey); color:var(--marka-700); cursor:pointer; box-shadow:0 14px 30px -16px color-mix(in srgb,var(--marka-600) 55%,transparent); transition:background .15s,color .15s,border-color .15s; }
.destek__dugme svg { width:22px; height:22px; flex:0 0 auto; }
.destek__dugme-metin { line-height:1; }
.destek__dugme:hover { border-color:color-mix(in srgb,var(--marka-500) 45%,var(--hat-kart)); background:color-mix(in srgb,var(--marka-500) 6%,var(--yuzey)); }
.destek__dugme[aria-expanded="true"] { border-color:var(--marka-600); background:var(--marka-600); color:#fff; }
.destek__dugme:focus-visible,.destek__ikon-dugme:focus-visible,.destek__konu:focus-visible,.destek__baglantilar a:focus-visible,.destek__yardim summary:focus-visible { outline:2px solid var(--turkuaz-500); outline-offset:2px; }

.destek__perde { position:fixed; inset:0; z-index:44; }
.destek__panel { position:fixed; left:16px; bottom:72px; z-index:45; display:flex; flex-direction:column; width:min(380px,calc(100vw - 32px)); max-height:min(620px,calc(100dvh - 140px)); overflow:hidden; border:1px solid var(--hat-kart); border-radius:var(--kose-kart); background:var(--yuzey); color:var(--metin-murekkep); font-family:var(--font-body); box-shadow:0 32px 64px -30px color-mix(in srgb,var(--marka-600) 55%,transparent); animation:destek-acil .16s ease-out; }
.destek__panel::before { content:""; flex:0 0 3px; background:var(--marka-rampa-serit); }
.destek__panel:focus { outline:none; }
@keyframes destek-acil { from { opacity:0; transform:translateY(8px); } }

.destek__ust { display:flex; align-items:flex-start; gap:8px; padding:14px 12px 12px 16px; border-bottom:1px solid var(--hat-kart); }
.destek__ust .destek__ikon-dugme:first-child { margin-left:-6px; }
.destek__baslik { flex:1; min-width:0; }
.destek__baslik h2 { margin:0; font:700 16px/1.3 var(--font-display); letter-spacing:-.01em; color:var(--marka-700); }
.destek__baslik p { margin:3px 0 0; font-size:12px; line-height:1.45; color:var(--metin-ikincil); }
.destek__ikon-dugme { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--metin-ikincil); cursor:pointer; }
.destek__ikon-dugme svg { width:18px; height:18px; }
.destek__ikon-dugme:hover { background:color-mix(in srgb,var(--marka-500) 8%,transparent); color:var(--marka-700); }

.destek__govde { flex:1 1 auto; min-height:0; overflow:auto; padding:8px; overscroll-behavior:contain; }

.destek__konular,.destek__baglantilar { list-style:none; margin:0; padding:0; }
.destek__konu { display:flex; align-items:center; gap:12px; width:100%; padding:10px 8px; border:0; border-radius:10px; background:transparent; color:inherit; text-align:left; font:inherit; cursor:pointer; }
.destek__konu:hover { background:color-mix(in srgb,var(--marka-500) 6%,transparent); }
.destek__konu-ikon { flex:0 0 36px; display:inline-flex; align-items:center; justify-content:center; height:36px; border-radius:10px; background:color-mix(in srgb,var(--turkuaz-500) 12%,transparent); color:var(--turkuaz-600); }
.destek__konu-ikon svg { width:18px; height:18px; }
.destek__konu-metin { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.destek__konu-metin strong { font:700 13.5px/1.3 var(--font-display); color:var(--metin-murekkep); }
.destek__konu-metin small,.destek__baglantilar small { font-size:12px; line-height:1.4; color:var(--metin-ikincil); }
.destek__konu-ok { flex:0 0 auto; width:16px; height:16px; color:var(--metin-ikincil); }

.destek__yardim details { border-bottom:1px solid var(--hat-kart); padding:0 8px; }
.destek__yardim details:last-child { border-bottom:0; }
.destek__yardim summary { padding:12px 0; font:600 13px/1.4 var(--font-display); cursor:pointer; }
.destek__yardim details[open] summary { color:var(--marka-700); }
.destek__yardim p { margin:0 0 10px; font-size:12.5px; line-height:1.6; white-space:pre-line; }
.destek__yardim-baglantilar { display:flex; flex-wrap:wrap; gap:6px 14px; padding-bottom:12px; font-size:12.5px; font-weight:600; }
.destek__yardim-baglantilar a { color:var(--marka-600); }

.destek__baglantilar li+li { margin-top:6px; }
.destek__baglantilar a { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid var(--hat-kart); border-radius:10px; color:inherit; text-decoration:none; }
.destek__baglantilar a>span { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.destek__baglantilar strong { font:700 13.5px/1.3 var(--font-display); }
.destek__baglantilar svg { flex:0 0 auto; width:16px; height:16px; color:var(--marka-600); }
.destek__baglantilar a:hover { border-color:color-mix(in srgb,var(--marka-500) 45%,var(--hat-kart)); background:color-mix(in srgb,var(--marka-500) 4%,var(--yuzey)); }

.destek__durum { margin:0; padding:24px 12px; text-align:center; font-size:13px; color:var(--metin-ikincil); }
.destek__durum--hata { color:var(--red-600); }

@media (max-width:640px) {
  .destek__perde { background:color-mix(in srgb,var(--metin-murekkep) 28%,transparent); }
  .destek__panel { left:12px; right:12px; bottom:68px; width:auto; max-height:calc(100dvh - 96px); }
  .destek__dugme { left:12px; bottom:12px; }
}
@media (pointer:coarse) {
  .destek__ikon-dugme { width:44px; height:44px; }
}
@media (prefers-reduced-motion:reduce) { .destek__panel { animation:none; } }
@media print { .destek { display:none; } }

/* 3308: ortak destek düğmesi modülün ana eylem ölçeğine çıkarılır. Metinli
   lacivert düğme, modülün kapak ve üst menü renkleriyle aynı ağırlığı taşır;
   diğer modüllerdeki kompakt ikon düğmesi değişmeden kalır. */
.destek--3308 .destek__dugme {
  left:18px;
  bottom:18px;
  width:auto;
  min-width:136px;
  height:56px;
  gap:10px;
  padding:0 20px;
  border-color:var(--marka-700);
  border-radius:3px 16px 16px 16px;
  background:var(--marka-600);
  color:var(--on-brand);
  font:600 14px/1 var(--font-body);
  letter-spacing:.01em;
  box-shadow:0 16px 34px -18px color-mix(in srgb,var(--marka-700) 68%,transparent);
  transition:background .15s,color .15s,border-color .15s,transform .15s,box-shadow .15s;
}
.destek--3308 .destek__dugme svg { width:24px; height:24px; }
.destek--3308 .destek__dugme:hover { border-color:var(--marka-500); background:var(--marka-500); color:var(--on-brand); transform:translateY(-1px); box-shadow:0 18px 36px -18px color-mix(in srgb,var(--marka-700) 74%,transparent); }
.destek--3308 .destek__dugme[aria-expanded="true"] { border-color:var(--marka-700); background:var(--marka-700); color:var(--on-brand); }
.destek--3308 .destek__dugme:focus-visible { outline:2px solid var(--turkuaz-500); outline-offset:3px; }
.destek--3308 .destek__panel { left:18px; bottom:86px; width:min(420px,calc(100vw - 36px)); border-radius:3px 16px 16px 16px; }

@media (max-width:640px) {
  .destek--3308 .destek__dugme { left:12px; bottom:12px; min-width:128px; height:52px; padding-inline:16px; }
  .destek--3308 .destek__panel { left:12px; right:12px; bottom:76px; width:auto; }
}
@media (pointer:coarse) {
  .destek--3308 .destek__dugme { min-height:52px; }
}
