/* Saas-Luxas "violeta" teması — paylaşılan navbar (tüm sayfalar) */
  @import url('/assets/vendor/fonts/open-sans.css');
  @import url('/assets/vendor/fonts/poppins.css');

  :root {
    --lux-primary: #9C27B0;
    --lux-primary-dark: #6A1B9A;
    --lux-primary-light: #E1BEE7;
    --lux-secondary: #8BC34A;
    --lux-ink: #4a1163;
  }

  @keyframes kalpFadeIn {
    0% {
      opacity: 0;
      transform: scale(0.9) rotate(-3deg);
    }

    50% {
      transform: scale(1.05) rotate(3deg);
    }

    100% {
      opacity: 1;
      transform: scale(1) rotate(0deg);
    }
  }

  .kalpli-giris {
    animation: kalpFadeIn 0.8s ease-in-out;
  }

  body {
    padding-top: 80px;
    /* Tema arka planı — tüm menülü sayfalar (index.php kendi zengin temasıyla bunu ezer) */
    background-color: #faf5fd;
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 928' preserveAspectRatio='none'%3E%3Cpath d='M1280,925c-133.8-192.4-264-288.5-390.5-288.5c-189.8,0-387.2,389.8-606.5,268C136.8,823.2,42.5,750.6,0,686.5V81c114.5,99.3,229.7,148.9,345.8,148.9c174.1,0,228.2-332.1,454.9-198C951.8,121.3,1118.6,137.7,1301,81L1280,925z' fill='%23E1BEE7' fill-opacity='0.4'/%3E%3C/svg%3E"),
      radial-gradient(circle at 12% 22%, rgba(156, 39, 176, .05), transparent 26%),
      radial-gradient(circle at 88% 80%, rgba(139, 195, 74, .05), transparent 26%);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-position: center bottom, center, center;
    background-size: 100% 300px, auto, auto;
    background-attachment: fixed, fixed, fixed;
  }

  /* ===== Navbar: koyu-mor violeta bar (index.php ile tutarlı, beyaz logo) ===== */
  .navbar {
    background: linear-gradient(-45deg, var(--lux-primary-dark) 30%, var(--lux-primary) 90%);
    box-shadow: 0 4px 24px rgba(106, 27, 154, .28);
    border-bottom: none;
    font-family: 'Open Sans', 'Poppins', sans-serif;
    padding-top: .35rem;
    padding-bottom: .35rem;
  }

  .navbar-brand img {
    filter: brightness(0) invert(1);
    transition: transform .2s ease;
  }

  .navbar-brand:hover img {
    transform: scale(1.04);
  }

  /* Toggler -> beyaz */
  .navbar-toggler {
    border-color: rgba(255, 255, 255, .5);
    padding: .35rem .55rem;
  }

  .navbar-toggler:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .25);
  }

  .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23fff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.5' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }

  /* Profil alanı */
  #user-name {
    color: #fff;
    font-weight: 700;
  }

  #user-photo {
    border: 2px solid var(--lux-primary-light);
    box-shadow: 0 2px 8px rgba(156, 39, 176, .22);
  }

  .nav-link.dropdown-toggle {
    color: #fff;
    border-radius: 40px;
    padding: .25rem .5rem;
    transition: background-color .2s ease;
  }

  .nav-link.dropdown-toggle:hover {
    background: rgba(255, 255, 255, .15);
  }

  /* ===== Bölüm menüsü (scroll-spy linkleri) ===== */
  /* Navbar tek şerit kalsın; içerik iki satıra bölünüp "ikinci çubuk" oluşturmasın */
  @media (min-width: 992px) {

    .navbar>.container-fluid {
      flex-wrap: nowrap;
    }

    .lux-scrollnav {
      flex-wrap: nowrap;
    }
  }

  .lux-scrollnav {
    gap: .1rem;
    align-items: center;
  }

  .lux-scrollnav .lux-scrolllink {
    position: relative;
    color: #fff;
    font-weight: 600;
    font-size: .95rem;
    padding: .45rem .9rem !important;
    border-radius: 40px;
    white-space: nowrap;
    transition: color .2s ease, background-color .2s ease;
  }

  .lux-scrollnav .lux-scrolllink:hover,
  .lux-scrollnav .lux-scrolllink:focus {
    color: #fff;
    background: rgba(255, 255, 255, .18);
  }

  .lux-scrollnav .lux-scrolllink.active {
    color: var(--lux-primary-dark);
    background: #fff;
  }

  @media (max-width: 1199.98px) {
    .lux-scrollnav .lux-scrolllink {
      font-size: .88rem;
      padding: .45rem .65rem !important;
    }
  }

  @media (max-width: 991.98px) {
    .lux-scrollnav {
      margin-bottom: .6rem;
    }

    .lux-scrollnav .lux-scrolllink {
      display: inline-block;
    }
  }

  /* ===== Dropdown ===== */
  .dropdown-menu {
    border-radius: 16px;
    border: none;
    padding: .5rem;
    margin-top: .6rem;
    box-shadow: 0 14px 38px rgba(106, 27, 154, .22);
    font-family: 'Open Sans', 'Poppins', sans-serif;
  }

  .dropdown-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .6rem .85rem;
    font-weight: 600;
    border-radius: 10px;
    transition: background-color .18s ease, color .18s ease, transform .18s ease;
  }

  .dropdown-item i {
    color: var(--lux-primary);
    transition: color .18s ease;
  }

  .dropdown-item:hover {
    background: #f5e6fb;
    transform: translateX(2px);
  }

  .dropdown-item:hover i {
    color: var(--lux-primary-dark);
  }

  .dropdown-item.text-danger i {
    color: #dc3545;
  }

  .dropdown-item:active,
  .dropdown-item.active {
    background-color: var(--lux-primary) !important;
    color: #fff !important;
  }

  .dropdown-item.active i,
  .dropdown-item:active i {
    color: #fff !important;
  }

  .dropdown-divider {
    border-color: rgba(156, 39, 176, .14);
  }

  /* ===== Butonlar (pill violeta) ===== */
  .btn-primary {
    background-color: var(--lux-primary);
    border-color: var(--lux-primary);
    border-radius: 36px;
    font-weight: 700;
  }

  .btn-primary:hover,
  .btn-primary:focus {
    background-color: var(--lux-primary-dark);
    border-color: var(--lux-primary-dark);
  }

  @media (max-width: 991.98px) {
    .navbar-collapse {
      background: linear-gradient(180deg, var(--lux-primary-dark), var(--lux-primary));
      padding: 0.85rem 1rem 1.1rem;
      border-radius: 0 0 18px 18px;
      box-shadow: 0 12px 26px rgba(0, 0, 0, .28);
      margin-top: 4px;

      /* Navbar position:fixed olduğu için açılan panel viewport'un altına
         taşıyordu ve sayfa scroll'u panele ulaşmıyordu: giriş yapmış
         kullanıcıda en alttaki "Çıkış Yap" tıklanamıyordu. Panel artık kendi
         içinde kayıyor. dvh, mobil tarayıcı çubuğu açılıp kapandığında da
         doğru yüksekliği verir; vh satırı desteklemeyenler için fallback. */
      max-height: calc(100vh - 88px);
      max-height: calc(100dvh - 88px);
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
    }

    .navbar-collapse::-webkit-scrollbar {
      width: 6px;
    }

    .navbar-collapse::-webkit-scrollbar-thumb {
      background: rgba(255, 255, 255, .35);
      border-radius: 3px;
    }

    /* Genel bağlantılar ile hesap menüsü mobilde tek panelde birleşiyor;
       ikisinin arasına görünür bir sınır koy. */
    #user-profile {
      border-top: 1px solid rgba(255, 255, 255, .25);
      margin-top: .5rem;
      padding-top: .75rem;
    }

    /* Profil satırı (foto + ad) hesap menüsünün başlığı gibi dursun. */
    #user-profile .nav-link.dropdown-toggle {
      opacity: .85;
      font-size: .85rem;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
  }

  .kredi-foto-wrapper {
    position: relative;
    display: inline-block;
  }

  #kredi-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background-color: #7b2d8b;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    border-radius: 50px;
    padding: 1px 5px;
    min-width: 18px;
    text-align: center;
    line-height: 1.5;
    border: 1.5px solid #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
    pointer-events: none;
  }

  .mesaj-icon-wrapper {
    position: relative;
    display: inline-block;
    margin-right: 0.25rem;
  }
  #mesaj-badge,
  .randevu-badge {
    position: absolute;
    top: -8px;
    right: -10px;
    background-color: #d9534f;
    color: #fff;
    font-size: 0.6rem;
    font-weight: 700;
    border-radius: 50px;
    padding: 1px 5px;
    min-width: 18px;
    text-align: center;
    line-height: 1.4;
    border: 1.5px solid #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
    pointer-events: none;
  }
  .randevu-badge {
    background-color: #198754;
  }
  .randevu-icon-wrapper {
    position: relative;
    display: inline-block;
    margin-right: 0.25rem;
  }