/* ===========================================================
   Gülistan SHELL — vanilla Bootstrap 5 üstü, yeşil İslami tema
   Sidebar (lg+) + offcanvas (mobil) + içerik alanı
   =========================================================== */
:root{
  --gul-yesil:#1f7a3d;
  --gul-yesil-koyu:#155a2c;
  --gul-yesil-acik:#2e9d52;
}
body{
  margin:0;
  min-height:100vh;
  display:flex;            /* sticky-footer: kısa sayfada gereksiz scroll yok */
  flex-direction:column;
  font-family:"Segoe UI",Tahoma,Arial,sans-serif;
  /* hafif kaligrafi filigranı (eski sitedeki gibi) */
  background:
    linear-gradient(rgba(238,244,238,.93), rgba(238,244,238,.93)),
    url('../img/lailahe.jpg');
  background-repeat:no-repeat, repeat;
  background-size:auto, 150px auto;
}

/* Üst bar (sadece mobilde) */
.gul-navbar{
  background:linear-gradient(135deg,var(--gul-yesil),var(--gul-yesil-acik));
}
.gul-navbar .navbar-brand,.gul-navbar .navbar-toggler{ color:#fff; }
.gul-navbar .navbar-toggler{ border-color:rgba(255,255,255,.5); }

/* Genel yerleşim: sidebar + içerik (flex:1 ile kalan alanı doldurur) */
.gul-layout{ display:flex; align-items:stretch; gap:0; flex:1 1 auto; min-height:0; }

/* Sidebar — krem kaligrafi zemin (resim net görünür) + yeşil butonlar */
.gul-sidebar{
  width:272px; flex:0 0 272px;
  color:#1f5130;
  padding:0;
  background:
    linear-gradient(rgba(255,255,255,.42), rgba(255,255,255,.55)),
    url('../img/lailahe.jpg');
  background-repeat:no-repeat, repeat;
  background-size:auto, 150px auto;
  border-right:1px solid #cfe0d3;
}
/* Masaüstünde sidebar, align-items:stretch ile içerik yüksekliğine uzar;
   ayrı min-height / overflow YOK -> menüde iç scroll çıkmaz. */
.gul-brand{
  text-align:center; padding:1rem 1rem .8rem;
  border-bottom:1px solid #cfe0d3;
}
.gul-brand img{
  width:150px; height:auto;      /* beyaz daire yok; en-boy oranı korunur */
  display:block; margin:0 auto;
}
.gul-brand .ad{ display:block; margin-top:.5rem; font-size:1.2rem; font-weight:700; letter-spacing:.5px; color:#15672f; }
.gul-brand .slogan{ display:block; font-size:.83rem; color:#2c5c3e; font-weight:600; }

/* Menü — yeşil butonlar (kaligrafi zemin üstünde) */
.gul-menu{ list-style:none; margin:0; padding:.6rem .6rem 1.4rem; }
.gul-menu li{ margin:5px 0; }
.gul-menu a{
  display:block; padding:.5rem .9rem;
  color:#fff; text-decoration:none;
  border-radius:8px; font-size:.93rem; line-height:1.3;
  background:linear-gradient(135deg, var(--gul-yesil), var(--gul-yesil-acik));
  box-shadow:0 2px 5px rgba(0,0,0,.18);
  border:1px solid rgba(0,0,0,.06);
  transition:filter .15s, transform .15s;
}
.gul-menu a:hover{
  background:linear-gradient(135deg,#d99e2b,#f0c14b);  /* altın/amber hover */
  color:#4a3200;
  border-color:rgba(0,0,0,.12);
  transform:translateX(3px);
  box-shadow:0 3px 10px rgba(0,0,0,.25);
}
.gul-menu a.active{
  background:#fff; color:#15672f; font-weight:700;
  border:2px solid var(--gul-yesil);
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.gul-menu a.dis::after{ content:" ↗"; opacity:.8; font-size:.8em; }

/* İçerik alanı — sola yaslı, menüye yakın (ortada boşluk kalmaz) */
.gul-main{ flex:1 1 auto; min-width:0; padding:1.3rem clamp(.9rem,1.8vw,1.6rem) 1.3rem; }
.gul-main .gul-icerik{ max-width:1100px; margin:0; }

/* 404 / boş durum */
.gul-bos{
  max-width:560px;margin:3rem auto;text-align:center;background:#fff;
  border-radius:12px;padding:2.4rem;border-top:4px solid var(--gul-yesil);
}

/* Footer */
.gul-footer{
  background:var(--gul-yesil-koyu); color:#dff3e4;
  text-align:center; padding:1rem; font-size:.88rem;
}
.gul-footer a{ color:#fff; }
.gul-footer .gul-sayac{ font-size:.85rem; opacity:.95; margin-bottom:.4rem; }
.gul-footer .gul-sayac b{ color:#fff; }

/* Offcanvas başlık (mobil) yeşil */
.gul-sidebar.offcanvas-lg .offcanvas-header{ background:linear-gradient(135deg,var(--gul-yesil),var(--gul-yesil-acik)); }

/* Mobil: açılan offcanvas menü uzunsa kendi içinde scroll edebilsin */
@media (max-width:991.98px){
	.gul-main{padding-top:0rem;}
  .gul-sidebar.offcanvas-lg{ overflow-y:auto; -webkit-overflow-scrolling:touch; }
  /* logo mobilde menüde DEĞİL; ana sayfa üstünde gösterilir */
  .gul-brand img{ display:none; }
  .gul-brand{ padding:.7rem 1rem; }
}

/* Mobil ana sayfa üstü logo (yalnız mobilde, d-lg-none ile) */
.gul-mobil-logo{ text-align:center; padding:1rem 0; display:flex; justify-content:center; align-items:center; }
.gul-mobil-logo img{ width:150px; height:auto; }