/* ==========================================================================
 * Fethiyede.com — T4639-G04 & T4639-G05:
 *   G04: "Bu sayfa için" (#fzb) — 390px ekranı örtmez, >=44px kapat düğmesi,
 *        alt tabbar ve çerez/haber bantlarının üstüne binmez, JS sözlüğü silinmez.
 *   G05: /k/ (.kb21-iskelet) ve /blog/ (.t21-bos) düzenli site-rengi boş durum
 *        (sıfır uydurma içerik).
 * ========================================================================== */

/* --- T4639-G04: #fzb ("Bu sayfa için") --- */
#fzb {
  box-sizing: border-box !important;
  max-width: min(360px, calc(100vw - 24px)) !important;
  border-radius: 14px !important;
  border: 1px solid rgba(112, 45, 59, 0.24) !important;
  box-shadow: 0 10px 28px rgba(16, 42, 67, 0.16) !important;
  z-index: 72 !important;
}

#fzb .fd-fzb-close-btn,
#fzb .fzb-close,
#fzb [data-fzb-close] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 44px !important;
  min-height: 44px !important;
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(112, 45, 59, 0.24) !important;
  background: #FFFDF9 !important;
  color: #702D3B !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
}

#fzb .fd-fzb-close-btn:hover,
#fzb .fzb-close:hover {
  background: #702D3B !important;
  color: #FAF5EC !important;
}

#fzb.fd-fzb-collapsed {
  max-height: 46px !important;
  width: auto !important;
  max-width: calc(100vw - 24px) !important;
  overflow: hidden !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
#fzb.fd-fzb-collapsed > *:not(.fd-fzb-pill-toggle):not(script) {
  display: none !important;
}
#fzb .fd-fzb-pill-toggle {
  display: none;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  padding: 0 12px;
  border: none;
  background: transparent;
  color: inherit;
  font-weight: 700;
  font-size: 0.84rem;
  cursor: pointer;
}
#fzb.fd-fzb-collapsed .fd-fzb-pill-toggle {
  display: inline-flex !important;
}

@media (max-width: 900px) {
  #fzb {
    position: fixed !important;
    left: 12px !important;
    right: auto !important;
    top: auto !important;
    bottom: calc(68px + env(safe-area-inset-bottom, 0px)) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: min(42vh, 310px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
  html[dir="rtl"] #fzb {
    left: auto !important;
    right: 12px !important;
  }
}

/* --- T4639-G05: /k/ kb21-iskelet ve /blog/ t21-bos Düzenli Boş Durumları --- */
.kb21-iskelet,
[class*="kb21-iskelet"],
.t21-bos,
[class*="t21-bos"] {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  max-width: 820px;
  margin: 22px auto !important;
  padding: clamp(20px, 3.5vw, 30px) clamp(18px, 3.5vw, 28px) !important;
  background: linear-gradient(180deg, #FFFDF9 0%, #FAF5EC 100%) !important;
  border: 1px solid rgba(112, 45, 59, 0.22) !important;
  border-inline-start: 5px solid #702D3B !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 24px rgba(34, 26, 20, 0.05) !important;
  color: #221A14 !important;
  box-sizing: border-box !important;
  line-height: 1.6 !important;
}

.kb21-iskelet::before,
.t21-bos::before {
  content: "";
  display: block;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background-color: rgba(112, 45, 59, 0.10);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23702D3B' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H20v20H6.5a2.5 2.5 0 0 1 0-5H20'/%3E%3Cpath d='M9 8h6M9 12h4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}

.kb21-iskelet h1,
.kb21-iskelet h2,
.kb21-iskelet h3,
.t21-bos h1,
.t21-bos h2,
.t21-bos h3 {
  margin: 0 !important;
  color: #221A14 !important;
  font-size: clamp(1.15rem, 2.5vw, 1.42rem) !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

.kb21-iskelet p,
.t21-bos p {
  margin: 0 !important;
  color: #4C433A !important;
  font-size: 0.94rem !important;
  max-width: 68ch;
}

.kb21-iskelet a,
.t21-bos a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 6px 14px;
  margin-top: 4px;
  border-radius: 10px;
  background: #702D3B;
  color: #FAF5EC !important;
  text-decoration: none !important;
  font-weight: 700;
  font-size: 0.88rem;
}
.kb21-iskelet a:hover,
.t21-bos a:hover {
  background: #58212D;
}

html[data-theme="dark"] .kb21-iskelet,
html[data-theme="dark"] .t21-bos,
body.dark-mode .kb21-iskelet,
body.dark-mode .t21-bos {
  background: linear-gradient(180deg, #1E293B 0%, #0F172A 100%) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  border-inline-start-color: #FB7185 !important;
  color: #F8FAFC !important;
}
html[data-theme="dark"] .kb21-iskelet h1,
html[data-theme="dark"] .kb21-iskelet h2,
html[data-theme="dark"] .t21-bos h1,
html[data-theme="dark"] .t21-bos h2,
body.dark-mode .kb21-iskelet h2,
body.dark-mode .t21-bos h2 {
  color: #F8FAFC !important;
}
html[data-theme="dark"] .kb21-iskelet p,
html[data-theme="dark"] .t21-bos p,
body.dark-mode .kb21-iskelet p,
body.dark-mode .t21-bos p {
  color: #CBD5E1 !important;
}
