/* Humayun Hasimler - Hmyn.net
 * Header/Menu + Dropdown + Kart Görselleri + Yardımcılar
 * Amaç: Sade, okunaklı, responsive; gereksiz stil yok.
 */

/* ------ Dropdown Tema ve Konum ------ */
.navbar .dropdown-menu{
  background-color:#1f1f1f;
  border:1px solid rgba(255,255,255,.08);
  min-width:240px;
}
.navbar .dropdown-item{ color:#eaeaea; }
.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus{
  color:#fff;
  background-color:rgba(13,110,253,.20);
}

/* Nested submenu */
.dropdown-submenu{ position:relative; }
.dropdown-submenu > .dropdown-menu{
  top:0; left:100%;
  margin-left:.25rem;
  background-color:#111;
  border-color:rgba(255,255,255,.1);
}

/* Sağ ok göstergesi */
.dropdown-submenu > .has-submenu::after{
  content:"›"; float:right; margin-left:.5rem; opacity:.7;
}

/* ---------- HOVER ile açılma (yalnızca masaüstü) ---------- */
@media (hover:hover) and (pointer:fine){
  .nav-item.dropdown:hover > .dropdown-menu{ display:block; }
  .dropdown-submenu:hover > .dropdown-menu{ display:block; }
}

/* === Menu Light Theme (opsiyonel) === */
body.menu-light{
  --menu-bg:#ffffff;
  --submenu-bg:#f7f7f9;
  --menu-text:#1f2937;
  --menu-border:rgba(0,0,0,.08);
  --menu-hover-bg:rgba(13,110,253,.12);
  --menu-accent:#0d6efd;
  --menu-divider:#e5e7eb;
}
/* Light değişkenleri varsa koyu ayarları ezer */
body.menu-light .navbar .dropdown-menu{
  background-color:var(--menu-bg);
  border:1px solid var(--menu-border);
}
body.menu-light .navbar .dropdown-item{ color:var(--menu-text); }
body.menu-light .navbar .dropdown-item:hover{
  background-color:var(--menu-hover-bg); color:#000;
}
body.menu-light .dropdown-submenu > .dropdown-menu{
  background-color:var(--submenu-bg);
  border:1px solid var(--menu-border);
}

/* --------- Makale sayfası küçük yardımcılar --------- */
.article-title { font-weight:800; font-size:2rem; margin-bottom:.25rem; }
.article-meta  { color:#6c757d; margin-bottom:1rem; font-size:.925rem; }

.article-content h2, .article-content h3 {
  margin-top:2rem; scroll-margin-top:90px;
  padding-top:.25rem; border-top:1px solid #f1f3f5;
}

pre { position:relative; padding:14px; border-radius:10px; overflow:auto; }
pre code { display:block; }
pre .copy-btn{
  position:absolute; top:8px; right:8px; border:0; padding:4px 10px;
  border-radius:6px; font-size:.8rem; background:#f1f5f9; cursor:pointer;
}

.callout.note{
  background:#eef6ff; border-left:4px solid #3b82f6;
  padding:12px 14px; border-radius:10px; margin:12px 0 20px;
}

/* line-clamp yardımcıları */
.line-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.line-3{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }

/* --------- Kart görsel standardizasyonu ---------
   Amaç: eşit yükseklik; resimler kutuyu doldursun. */
.thumb{
  aspect-ratio: var(--ar, 16/9);
  background:#f3f4f6;
  overflow:hidden;
  border-top-left-radius:.375rem;
  border-top-right-radius:.375rem;
}
.thumb > img{
  width:100%; height:100%;
  object-fit:cover;        /* küçük kalmaz; gerekirse contain kullan */
  object-position:center;
}
.thumb--contain > img{ object-fit:contain; padding:6%; }

/* Kart içi buton altta sabitlensin */
.card.h-100 .card-body{ display:flex; flex-direction:column; }
.card.h-100 .card-body .btn{ margin-top:auto; }
/* Humayun Hasimler - Hmyn.net
   Brand (logo + yazı) iyileştirmeleri */

/* Brand kapsayıcı */
.brand {
  color: #fff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* Kare avatar (logo/monogram) */
.brand-avatar{
  width: 36px; height: 36px;
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  display: grid; place-items: center;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.15);
}
.brand-avatar img{
  width: 100%; height: 100%;
  object-fit: contain;          /* logo kırpılmasın */
}

/* Monogram fallback (logo yoksa) */
.brand-initials{
  font-weight: 800;
  font-size: .95rem;
  letter-spacing: .5px;
  color: #fff;
}

/* Yazı bloğu: iki ağırlık */
.brand-text{ line-height: 1; }
.brand-name{ font-weight: 800; letter-spacing: .2px; }     /* Humayun */
.brand-surname{ font-weight: 600; opacity: .92; }          /* Hasimler */

/* Hover'da ufak canlılık */
.brand:hover .brand-avatar{ box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }
.brand:hover{ text-decoration: none; }

/* Mobilde yazıyı gizle: sadece avatar kalsın */
@media (max-width: 991.98px){
  .brand-text{ display: none; }
}

/* vietnamese */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dancingscript/v29/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7B1i03Rep8ltA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dancingscript/v29/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7B1i03ROp8ltA.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/dancingscript/v29/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7B1i03Sup8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Humayun Hasimler - Hmyn.net | Brand Script Font (Google Fonts)
   Kullanım: Sadece marka ve opsiyonel hero başlıkta uygula */

/* 1) Değişken: markada kullanılacak font ailesi */
:root{
  --brand-script-font: 'Dancing Script', system-ui, -apple-system, 'Segoe UI',
                      Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
}

/* 2) Marka adı (Humayun) script font, soyadı sans-serif kalsın */
.brand-name{
  font-family: var(--brand-script-font);
  font-weight: 700;                 /* Dancing Script için önerilen kalınlık */
  letter-spacing: .2px;
  font-size: 1.15rem;               /* çok büyütmeden, dengeli */
  line-height: 1;
}

/* 3) İsteğe bağlı: Hero başlıkta minimal vurgu */
.hero-dark .display-5{
  letter-spacing: .3px;
}
@media (min-width: 992px){
  .hero-dark .display-5{ font-size: 2.75rem; }
}

/* 4) Küçük ekranda script aşırı büyük görünmesin */
@media (max-width: 991.98px){
  .brand-name{ font-size: 1.05rem; }
}

/* ==========================================================
   Humayun Hasimler - Hmyn.net | Dropdown Hover Köprü Fix
   İmza: Humayun
   Amaç: Parent ↔ Submenu arasında boşluğu sıfırlamak (flicker yok)
   ========================================================== */

/* Bootstrap varsayılan boşlukları kapat */
.navbar .dropdown-menu {
  margin: 0 !important;          /* dikey boşlukları kaldır */
}

/* Submenu konumlandırma */
.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu {
  position: absolute;
  top: 0;                         /* parent item ile aynı hiza */
  left: 100%;                     /* sağa açıl */
  margin-left: -1px;              /* 1px bindirme: görünmez köprü */
  margin-top: -1px;               /* border hizası için min ayar */
  display: none;                  /* hover ile açacağız */
  z-index: 1030;                  /* her şeyin üstünde kalsın */
  border-top-left-radius: 0;      /* görsel hizalama */
}

/* Masaüstünde hover ile aç (mobilde JS zaten çalışıyor) */
@media (hover:hover) and (pointer:fine) {
  .navbar .dropdown:hover > .dropdown-menu { display: block; }
  .dropdown-submenu:hover > .dropdown-menu { display: block; }
}

/* ➊ KÖPRÜ: Parent linkin sağına görünmez hover alanı ekle
   - İmleç submenu’ye geçerken hover kopmasın */
.dropdown-submenu > .has-submenu {
  position: relative;
  padding-right: 1.25rem;         /* ok işareti + köprü alanı için yer */
}
.dropdown-submenu > .has-submenu::before {
  content: "";
  position: absolute;
  top: 0;
  right: -10px;                   /* submenu ile üst üste gelsin */
  width: 12px;                    /* köprü genişliği */
  height: 100%;
  background: transparent;
  pointer-events: auto;           /* hover’ı tut */
}

/* UX: sağ ok işareti */
.dropdown-submenu > .has-submenu::after {
  content: "›";
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  opacity: .6;
}

/* Dar padding varsa satır kaçmasını önle */
.dropdown-menu .dropdown-item { white-space: nowrap; }
