/* VKM Raven — Canlı CSS (otomatik üretildi) */

/* ===== user #3 ===== */
/* Genel */
/* ============================================
   1. SCROLL-TO-TOP
   ============================================ */
@media (min-width: 768px) {
  .cs-scroll-top {
    bottom: 0.5rem !important;
    right: 0.5rem !important;
  }
}

@media (max-width: 767px) {
  .cs-scroll-top { right: 0.6rem !important; }
}

/* ============================================
   2. TEMA DÜZELTMELERİ
   ============================================ */
@media (min-width: 769px) and (max-width: 991px) {
  .cs-header__inner-mobile,
  .cs-header__inner-mobile::before,
  .cs-header__inner-mobile::after {
    background-color: #011d32 !important;
    box-shadow: none !important;
  }
}

.bbt-widget-container { padding: 0 !important; }

.page .cs-sidebar-disabled .cs-entry__header-title-only .cs-entry__title {
  padding-left: 0 !important;
}

/* ============================================
   3. ANİMASYONLAR
   ============================================ */
@keyframes vkmFlow  { to { background-position: 300% 0; } }
@keyframes vkmShine { 0%, 70% { left: -60%; } 100% { left: 130%; } }

/* ============================================
   4. MASAÜSTÜ MENÜ — OYUNLAR (gradyan metin)
   ============================================ */
.cs-header__nav .menu-item-40047 > a span {
  background: linear-gradient(90deg, #ff914d, #bff6ff, #4cb6c6, #ff914d);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  animation: vkmFlow 5s linear infinite;
}

/* ============================================
   5. MOBİL HEADER — OYUNLAR LİNKİ (JS ile eklenir)
   ============================================ */
.vkm-oyunlar { display: none; }

@media (max-width: 1024px) {
  .vkm-oyunlar {
    display: inline-flex;
    align-items: center;
    background: linear-gradient(90deg, #ff914d, #bff6ff, #4cb6c6, #ff914d);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    -webkit-text-fill-color: transparent;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    padding: 0;
    margin-right: 14px;
    text-decoration: none;
    white-space: nowrap;
    animation: vkmFlow 5s linear infinite;
  }
  .vkm-oyunlar::before { content: none; }
}

/* Hamburger menü içindeki Oyunlar maddesini gizle */
.cs-menu-mobile .menu-item-40047 { display: none !important; }

/* ============================================
   6. OFFCANVAS ALT KISIM — İKİ BUTON YAN YANA
   ============================================ */
.cs-offcanvas__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
  padding-bottom: 20px;
  margin-bottom: 14px;
}

.cs-offcanvas__footer-content {
  flex: 1 0 100%;
  margin-top: 4px;
}

.cs-offcanvas__footer .cs-social { padding-right: 60px; }

/* Yükseklik ve hiza eşitleme */
.cs-offcanvas__footer .cs-header__custom-button,
.cs-offcanvas__footer .vkm-oyunlar-btn {
  flex: 1 1 0;
  box-sizing: border-box;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  margin: 0;
  border: 0;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  color: #ffffff !important;
}

.cs-offcanvas__footer .cs-header__custom-button {
  background: #4cb6c6;
  color: #ffffff !important;
}

.cs-offcanvas__footer .vkm-oyunlar-btn {
  position: relative;
  overflow: hidden;
  color: #ffffff !important;
  background: linear-gradient(90deg, #ff914d, #011d32, #4cb6c6, #ff914d);
  background-size: 300% 100%;
  animation: vkmFlow 5s linear infinite;
}

.cs-offcanvas__footer .vkm-oyunlar-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-20deg);
  animation: vkmShine 3.5s ease-in-out infinite;
}



/* ============================================
   8. HAREKET AZALTMA TERCİHİ
   ============================================ */
@media (prefers-reduced-motion: reduce) {
  .cs-header__nav .menu-item-40047 > a span,
  .vkm-oyunlar,
  .cs-offcanvas__footer .vkm-oyunlar-btn,
  .cs-offcanvas__footer .vkm-oyunlar-btn::after {
    animation: none;
  }
}

.vkmfw-converter {
  margin-top: 32px;
}

/* ===== user #4 ===== */
/* Genel */
:root {
    --vkm-radius: 11px;
	--cs-thumbnail-border-radius: var(--vkm-radius);
}
.fi-credits-calculator-wrapper,
.dolphin-xchange-converter-wrapper {
	border-radius: var(--vkm-radius);
}
.dolphin-xchange-converter-app-logo {
	margin-bottom: -1.9rem;
}

/* Header Ticker Sol */
#vkm-finance-ticker .dolphin-xchange-banner-header .--header-icon img {
	height: 28px !important;
}

#vkm-finance-ticker {
	--dolphin-ticker-header-text: #fff;
	--dolphin-ticker-header-bg: #011d32;
	--dolphin-ticker-text: #000;
    --dolphin-ticker-bg: #eee;
    --dolphin-ticker-bg-dark: #e6e6e6;
    --dolphin-ticker-separator-width: 5px;
    --dolphin-ticker-percent-up: green;
    --dolphin-ticker-percent-down: red;
}
#vkm-finance-ticker .dolphin-xchange-banner-header {
	--dolphin-ticker-text: #fff;
}
#vkm-finance-ticker .dolphin-xchange-banner-wrapper {
    border: 1px solid var(--dolphin-ticker-header-bg);
}

.cs-sidebar__inner p {
	display: none
}
    
/* Çeviriciler için Border-Radius */
.dolphin-xchange-converter-wrapper {
	overflow: hidden;
    border-radius: 12px;
    padding-bottom: 30px;
}


#dolphin-xchange-converter-1-wrapper select {
	border-radius: var(--vkm-radius);
}
#dolphin-xchange-converter-2-wrapper select {
	pointer-events: none !important;
    background: #eee;
    border-color: #eee;
	user-select: none;
	border-radius: var(--vkm-radius);
}


/* vkm-btn-before-fix: tema butonlarinin hover'daki ::before halka efekti kapali */
.wp-block-button .wp-block-button__link:before,
.wp-block-file .wp-block-file__button:before {
    display: none !important;
}


/* vkm-btn-before-fix-v2: tema butonlarinin hover halka (::before border) efekti tum buton turlerinde kapali */
button:before,
input[type=button]:before,
input[type=reset]:before,
input[type=submit]:before,
.cs-button:before,
.wp-block-button .wp-block-button__link:before,
.wp-block-file .wp-block-file__button:before,
.wp-block-search .wp-block-search__button:before,
.is-style-cs-secondary-button .wp-element-button:before,
.cs-featured-menu .cs-button:before,
.cs-entry-prev-next__btn .cs-button:before {
    border: 0 !important;
}

/* KrediHesaplama */
/* ================================
   CSS VARIABLES S
   ================================ */
:root {
  /* Renkler */
  --accordion-primary: #011d32;
  --accordion-primary-light: #033a5c;
  --accordion-accent: #4cb6c6;
  --accordion-accent-light: rgba(76, 182, 198, 0.1);
  --accordion-text-dark: #222;
  --accordion-text-light: #ffffff;
  --accordion-bg-light: transparent;
  --accordion-bg-soft: #f8f9fa;
  --accordion-border-color: #e0e0e0;
  
  /* Spacing */
  --accordion-padding-x: 28px;
  --accordion-padding-y: 20px;
  --accordion-content-padding-x: 28px;
  --accordion-content-padding-y: 20px;
  --accordion-gap: 16px;
  --accordion-item-gap: 0;
  
  /* Border & Radius */
  --accordion-radius: 12px;
  --accordion-border-width: 1px;
  --accordion-accent-bar-width: 3px;
  
  /* Typography */
  --accordion-font-family: inherit;
  --accordion-title-size: 1rem;
  --accordion-content-size: 0.95rem;
  --accordion-line-height: 1.6;
  --accordion-content-line-height: 1.85;
  
  /* Counter / Numara */
  --accordion-counter-size: 30px;
  --accordion-counter-font-size: 0.8rem;
  
  /* Arrow Icon */
  --accordion-arrow-size: 10px;
  --accordion-arrow-thickness: 2px;
  
  /* Transitions */
  --accordion-transition-fast: 0.3s ease;
  --accordion-transition-normal: 0.4s ease;
}

/* ================================
   ANA KONTEYNER
   ================================ */
.wp-block-themeisle-blocks-accordion {
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: var(--accordion-font-family);
  background: var(--accordion-bg-light);
  border: var(--accordion-border-width) solid var(--accordion-primary);
  border-radius: var(--accordion-radius);
  overflow: hidden;
  counter-reset: accordion-counter;
}

/* ================================
   AKORDEON ÖĞESİ
   ================================ */
.wp-block-themeisle-blocks-accordion-item {
  background: transparent;
  margin: var(--accordion-item-gap);
  border: none;
  border-bottom: var(--accordion-border-width) solid var(--accordion-border-color);
  overflow: hidden;
  counter-increment: accordion-counter;
}

.wp-block-themeisle-blocks-accordion-item:last-child {
  border-bottom: none;
}

/* ================================
   BAŞLIK (SUMMARY)
   ================================ */
.wp-block-themeisle-blocks-accordion-item__title {
  width: 100%;
  padding: var(--accordion-padding-y) var(--accordion-padding-x);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--accordion-gap);
  background: var(--accordion-bg-light);
  position: relative;
  transition: all var(--accordion-transition-normal);
  list-style: none;
}

.wp-block-themeisle-blocks-accordion-item__title::-webkit-details-marker {
  display: none;
}

/* Hover Efekti */
.wp-block-themeisle-blocks-accordion-item__title:hover {
  background: var(--accordion-bg-soft);
}

/* Ok İkonu */
.wp-block-themeisle-blocks-accordion-item__title::after {
  content: '';
  width: var(--accordion-arrow-size);
  height: var(--accordion-arrow-size);
  min-width: var(--accordion-arrow-size);
  border-right: var(--accordion-arrow-thickness) solid var(--accordion-primary);
  border-bottom: var(--accordion-arrow-thickness) solid var(--accordion-primary);
  transform: rotate(45deg);
  transition: all var(--accordion-transition-fast);
  position: relative;
  z-index: 1;
  margin-top: -4px;
}

details[open] .wp-block-themeisle-blocks-accordion-item__title::after {
  transform: rotate(-135deg);
  margin-top: 4px;
  border-color: var(--accordion-text-light);
}

.wp-block-themeisle-blocks-accordion-item__title:hover::after {
  border-color: var(--accordion-accent);
}

/* ================================
   NUMARA BADGE
   ================================ */
.wp-block-themeisle-blocks-accordion-item__title div {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: var(--accordion-title-size);
  color: var(--accordion-text-dark);
  line-height: var(--accordion-line-height);
  flex: 1;
  position: relative;
  z-index: 1;
  transition: all var(--accordion-transition-fast);
}

.wp-block-themeisle-blocks-accordion-item__title div::before {
  content: counter(accordion-counter);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: var(--accordion-counter-size);
  height: var(--accordion-counter-size);
  background: var(--accordion-primary);
  color: var(--accordion-text-light);
  font-size: var(--accordion-counter-font-size);
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
  transition: all var(--accordion-transition-fast);
}

.wp-block-themeisle-blocks-accordion-item__title strong {
  font-weight: 600;
  color: var(--accordion-text-dark);
}

.wp-block-themeisle-blocks-accordion-item__title:hover div::before {
  background: var(--accordion-accent);
  color: var(--accordion-text-light);
}

/* ================================
   AÇIK DURUM
   ================================ */
details[open] .wp-block-themeisle-blocks-accordion-item__title {
  background: var(--accordion-primary);
}

details[open] .wp-block-themeisle-blocks-accordion-item__title div,
details[open] .wp-block-themeisle-blocks-accordion-item__title strong {
  color: var(--accordion-text-light);
}

details[open] .wp-block-themeisle-blocks-accordion-item__title div::before {
  background: var(--accordion-accent);
  color: var(--accordion-primary);
}

/* ================================
   İÇERİK ALANI
   ================================ */
.wp-block-themeisle-blocks-accordion-item__content {
  padding: var(--accordion-content-padding-y) var(--accordion-content-padding-x);
  padding-left: calc(var(--accordion-content-padding-x) + var(--accordion-counter-size) + 14px);
  background: var(--accordion-bg-soft);
  animation: fadeSlide var(--accordion-transition-normal);
  border-top: 2px solid var(--accordion-accent);
}

.wp-block-themeisle-blocks-accordion-item__content p {
  color: var(--accordion-text-dark);
  font-size: var(--accordion-content-size);
  line-height: var(--accordion-content-line-height);
  margin: 0;
  position: relative;
  padding-left: calc(var(--accordion-content-padding-x) / 2);
}

.wp-block-themeisle-blocks-accordion-item__content p::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: var(--accordion-accent-bar-width);
  height: 100%;
  background: var(--accordion-accent);
  border-radius: calc(var(--accordion-accent-bar-width) / 2);
}

/* ================================
   ANİMASYON
   ================================ */
@keyframes fadeSlide {
  from {
    opacity: 0;
    max-height: 0;
  }
  to {
    opacity: 1;
    max-height: 500px;
  }
}

/* ================================
   TABLET (max-width: 992px)
   ================================ */
@media (max-width: 992px) {
  :root {
    --accordion-radius: 12px;
    --accordion-padding-x: 22px;
    --accordion-padding-y: 18px;
    --accordion-content-padding-x: 22px;
    --accordion-content-padding-y: 18px;
    --accordion-counter-size: 28px;
    --accordion-counter-font-size: 0.75rem;
  }
}

/* ================================
   MOBİL (max-width: 576px)
   ================================ */
@media (max-width: 576px) {
  :root {
    --accordion-radius: 8px;
    --accordion-padding-x: 16px;
    --accordion-padding-y: 14px;
    --accordion-content-padding-x: 16px;
    --accordion-content-padding-y: 14px;
    --accordion-gap: 12px;
    --accordion-title-size: 0.9rem;
    --accordion-content-size: 0.88rem;
    --accordion-arrow-size: 9px;
    --accordion-content-line-height: 1.75;
    --accordion-counter-size: 26px;
    --accordion-counter-font-size: 0.7rem;
  }
  
  .wp-block-themeisle-blocks-accordion-item__title div {
    gap: 12px;
  }
}

/* ================================
   KÜÇÜK EKRANLAR (max-width: 380px)
   ================================ */
@media (max-width: 380px) {
  :root {
    --accordion-padding-x: 12px;
    --accordion-padding-y: 12px;
    --accordion-content-padding-x: 12px;
    --accordion-content-padding-y: 12px;
    --accordion-title-size: 0.85rem;
    --accordion-counter-size: 24px;
    --accordion-counter-font-size: 0.68rem;
  }
  
  .wp-block-themeisle-blocks-accordion-item__title div {
    gap: 10px;
  }
}

/* EskiEkCss */
#dolphin-linkbar {
	margin-top: 8px;
}
#dolphin-linkbar button:before,
#dolphin-linkbar button {
	outline: none !important;
	border: 0 !important;
	box-shadow: none !important;
}
#dolphin-linkbar .cs-container .dolphin-imagelinkbar-wrapper {
	border-radius: var(--cs-header-border-radius);
	overflow: hidden;
}






#vkm-finance-ticker {
	margin-top: 8px;
}
#vkm-finance-ticker .cs-container .dolphin-xchange-banner-wrapper {
	border-radius: var(--cs-header-border-radius);
	overflow: hidden;
}

.dolphin-xchange-banner-right-arrow,
.dolphin-xchange-banner-left-arrow {
	outline: none;
	box-shadow: none;
	border: 0 !important;
	width: 32px;
}

.dolphin-xchange-banner-right-arrow svg,
.dolphin-xchange-banner-left-arrow svg {
	fill: #000 !important;
}


.dolphin-xchange-banner-right-arrow {
	margin-right: -12px;
	border-radius: 0 !important;
	height: 100%;
}
.dolphin-xchange-banner-left-arrow {
	margin-left: -12px;
	border-radius: 0 !important;
	height: 100%;
}



#vkm-credits-calculator .cs-container {
	padding: 0 !important
}

.vkm-credits-calculator-wrapper .cs-load-more {
	display: none !important
}


.page .cs-entry__title {
	width: 100%;
}
.page .cs-entry__header-standard {
	display: block;
	margin: 0;
}
.page .cs-entry__container {
	display: block;
}
.page .cs-sidebar-disabled .cs-entry__header-title-only .cs-entry__title {
	margin-left: 0 !important;
	max-width: 100%;
	text-align: left;
	padding-bottom: 10px;
	padding-left: 20px;
	border-bottom: 5px solid #ddd;
}

#h-yazilim-gelistirme-murat-alabacak-murat-vkmfinans-com-fatih-koc-fatih-vkmfinans-com strong:last-of-type {
    display: block;
    margin-top: 1px; /* boşluğu buradan ayarla */
}

.cs-post-tiles {
    margin-top: 1.35rem;
}

@media (max-width: 767.98px) {
    .cs-post-tiles {
        margin-top: 0.55rem;
    }
}
@media (max-width: 991.98px) {
    .cs-site-content:not(:first-child) .cs-main-content {
        margin-top: -1rem;
    }
}

/* AqzSinpasChatbot */
#chatWidget > div.chat-powered-bar > a > img {
	transform: translateY(-25%);
}

/* GCMLogoForeksPrefix */
/* FOREKS - GCM */
body.category-gcmyatirim .cs-header__nav .menu-item-31499 > a > div,
  body.category-gcmyatirim .cs-menu-mobile .menu-item-31499 > a > div {
      display: inline-flex;
      align-items: center;
      gap: 8px;
  }

  body.category-gcmyatirim .cs-header__nav .menu-item-31499 > a > div::before,
  body.category-gcmyatirim .cs-menu-mobile .menu-item-31499 > a > div::before {
      content: "";
      display: inline-block;
      width: 32px;
      height: 32px;
      background-image: url('https://vkmfinans.com/wp-content/uploads/2026/05/foreks-icon.png');
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      flex-shrink: 0;
  }




/* "Yatırım Fonları" linkine logo (menu-item-27092) — Foreks örneğindeki yöntem */
body.page-id-37659 .cs-header__nav .menu-item-27092 > a > div,
body.page-id-37659 .cs-menu-mobile .menu-item-27092 > a > div {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}
body.page-id-37659 .cs-header__nav .menu-item-27092 > a > div::before,
body.page-id-37659 .cs-menu-mobile .menu-item-27092 > a > div::before {
    content: "" !important;
    display: inline-block !important;
    width: 26px !important;
    height: 26px !important;
    background-image: url('https://vkmfinans.com/wp-content/uploads/2026/05/gedik-com-mini.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    flex-shrink: 0 !important;
}

/* FooterMenu */
/* Footer kolon düzeni Customizer > Ek CSS içindedir (grid repeat(4,1fr), min-width:1024px). Menü: Footer Menü (8391). */