/* ============================================================
   HERBAL PALACE — ÜST KISIM (header) modern görünüm · yalnız CSS
   ------------------------------------------------------------
   Kapsam: SADECE üst bar (.topheader-*) + ana header (logo / arama /
   hesap-sepet). Kategori menü çubuğu (.top-level-menu-main-div) KLASİK
   kalır — "önce üst taraf".
   Veri/HTML değişmez: tüm linkler, logo, dil, kur admin panelinden gelir;
   bu dosya yalnızca görünümü biçimlendirir.
   Geri almak: header_libs.php'den bu dosyanın <link>'ini sil.
   Sadece masaüstü header'ı hedefler (.*-desktop-*) → mobil etkilenmez.
   ============================================================ */

/* ---------- 1) ÜST BAR — koyu, ince, premium ---------- */
.topheader-desktop-main-div {
    background-color: #16201b !important;   /* deep green-black */
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.topheader-desktop-main-div-in {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 8px 24px !important;
    box-sizing: border-box;
}
.topheader-desktop-main-left a,
.topheader-desktop-main-right a,
.topheader-lang-currency-box a {
    color: #c9d2cc !important;
    font-size: 12.5px !important;
    letter-spacing: .2px;
    font-weight: 500;
}
.topheader-desktop-main-left a:hover,
.topheader-desktop-main-right a:hover,
.topheader-lang-currency-box a:hover { color: #ffffff !important; }
.topheader-desktop-main-left a i,
.topheader-desktop-main-right a i { color: #7fc4a0 !important; }
.topheader-lang-currency-box { border-left: 1px solid rgba(255,255,255,.14) !important; }
.topheader-lang-currency-box > a { color: #c9d2cc !important; }

/* ---------- 2) ANA HEADER — ferah, beyaz, 1280 ortalı ---------- */
.header-desktop-main-div {
    background-color: #ffffff !important;
    padding: 0 !important;
}
.header-desktop-main-div-in {
    max-width: 1280px !important;
    margin: 0 auto !important;
    padding: 20px 24px !important;
    gap: 10px;
}
.header-desktop-logo-div { flex: 0 0 auto; }
.header-desktop-right-area { flex: 1 1 auto !important; gap: 16px; }

/* ---------- 3) ARAMA → pill kutu + yeşil yuvarlak buton ---------- */
.header-desktop-search1 {
    flex: 1 1 0% !important;
    max-width: none !important;
    margin-left: 0 !important;
    width: auto !important;
}
.header-desktop-search1 form { position: relative !important; display: block !important; width: 100%; }
.header-desktop-search1 form input {
    width: 100% !important;
    background: #f4f6f4 !important;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    height: 50px !important;
    padding: 0 58px 0 24px !important;
    font-size: 14.5px !important;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.header-desktop-search1 form input:focus {
    background: #ffffff !important;
    border-color: #2f7d57 !important;
    box-shadow: 0 0 0 3px #eef4f0 !important;
}
.header-desktop-search1 form input::placeholder { color: #9aa39c !important; }
.header-desktop-search1 form button {
    position: absolute !important;
    top: 50% !important;
    right: 6px !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #2f7d57 !important;
    border: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}
.header-desktop-search1 form button:hover { background: #25624a !important; }
.header-desktop-search1 form button i {
    color: #ffffff !important;
    font-size: 18px !important;
    line-height: 1 !important;
    margin: 0 !important;
    display: block !important;
}

/* ---------- 4) HESAP / SEPET — ikon + etiket ---------- */
.header-desktop-navbutton-box > a { color: #1a1a1a !important; }
.header-desktop-navbutton-box > a:hover { color: #2f7d57 !important; }
.header-desktop-navbutton-box i { font-size: 22px; }
.header-desktop-navbutton-box-t {
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: .2px;
}
/* Sepet sayaç rozeti — <a> referanslı konumlama; ikonu kaplar, "Sepetiniz" metnini örtmez */
.header-desktop-navbutton-box.carting > a {
    position: relative !important;   /* rozet artık <a>'ya göre konumlanır, parent box'a değil */
}
.header-desktop-navbutton-box-count-cart {
    top: -6px !important;
    left: 14px !important;           /* ikon ~22px wide; 14px = ikonun sağ üstü, metin (27px'ten başlar) örtülmez */
    font-size: 11px !important;
    font-weight: 700 !important;
}
/* Bildirim rozeti de aynı düzeltme */
.header-desktop-navbutton-box-count {
    font-size: 11px !important;
    font-weight: 700 !important;
}

/* ============================================================
   5) MEGA MENÜ — Zühre Ana tarzı
      Sol: alt kategoriler TEK SÜTUN, alt alta, ">" oklu, hover vurgulu
      Sağ: o kategorinin ürünleri — çerçevesiz, ORTALI, ferah kartlar
   ============================================================ */
/* Panel kabı — yeşil üst şerit, yumuşak gölge, alt yuvarlak köşe
   left:0 + right:0 → .top-level-menu'ye göre EN SOLDAN başlar, nav genişliğini kaplar (taşma yok) */
.sablon2-level-menu {
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    width: auto !important;
    white-space: normal !important;   /* dropdown içeriği normal şekilde satır kırsın */
    border-top: 2px solid #2f7d57 !important;
    border-radius: 0 0 14px 14px !important;
    box-shadow: 0 26px 50px rgba(16, 24, 20, .15) !important;
    overflow: hidden;
    align-items: stretch !important;
}

/* SOL — alt kategoriler: dar, tek sütun, alt alta */
.sablon2-level-menu-left {
    flex: 0 0 290px !important;
    width: 290px !important;
    padding: 14px 0 !important;
    display: block !important;
    background: #fff !important;
}
.sablon2-level-menu-left-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
.sablon2-level-menu-left-item-h {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1f2a24 !important;
    margin: 0 !important;
    padding: 12px 26px !important;
    border: 0 !important;
    transition: background .14s ease, color .14s ease, padding-left .14s ease;
}
.sablon2-level-menu-left-item-h::after {
    content: "\203A";
    font-size: 19px;
    line-height: 1;
    color: #c2ccc6;
    transition: color .14s ease, transform .14s ease;
}
.sablon2-level-menu-left-item-h:hover {
    background: #f4f7f5 !important;
    color: #2f7d57 !important;
    padding-left: 32px !important;
}
.sablon2-level-menu-left-item-h:hover::after { color: #2f7d57; transform: translateX(3px); }
.sablon2-level-menu-left-item-s {
    display: block;
    font-size: 12.5px !important;
    color: #6b756f !important;
    padding: 6px 26px !important;
    transition: color .14s ease, padding-left .14s ease;
}
.sablon2-level-menu-left-item-s:hover { color: #2f7d57 !important; padding-left: 32px !important; }

/* SAĞ — ürün kartları: çerçevesiz, ortalı, geniş alan */
.sablon2-level-menu-right.hb-mega-auto {
    flex: 1 1 auto !important;
    width: auto !important;
    background: #fff !important;
    border-left: 1px solid #eef1ee !important;
    display: flex !important;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start !important;   /* kartlar eşit yüksekliğe ESNEMESİN → fiyat başlığın hemen altında */
    padding: 20px 24px 6px !important;
}
.hb-mega-auto-head {
    width: 100%;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .6px;
    color: #2f7d57;
    margin: 0 0 14px;
}
.sablon2-level-menu-right.hb-mega-auto .sablon2-level-menu-right-product-box {
    width: calc(25% - 18px) !important;
    margin: 0 9px 22px !important;
    padding: 6px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: transparent;
    border: 0;
    border-radius: 10px;
    text-decoration: none;
    transition: transform .18s ease;
}
.sablon2-level-menu-right.hb-mega-auto .sablon2-level-menu-right-product-box:hover {
    transform: translateY(-2px);
}
.hb-mega-auto .hb-mega-prod-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 215px;
    background: #fff;
    overflow: hidden;
    margin-bottom: 4px;
}
.hb-mega-auto .hb-mega-prod-img img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    max-height: 100%;
    margin: 0 !important;
    object-fit: contain;
    transition: transform .2s ease;
}
.hb-mega-auto .sablon2-level-menu-right-product-box:hover .hb-mega-prod-img img { transform: scale(1.05); }
.hb-mega-auto .hb-mega-prod-name {
    display: block;
    overflow: hidden;
    max-height: calc(12.5px * 1.25 * 2);  /* 2 satır sınırı; line-clamp gibi 2-satır yüksekliği REZERVE ETMEDİĞİ için
                                               tek satırlı başlıklar sadece ~16px alır → fiyat hemen altına gelir */
    font-size: 12.5px;
    line-height: 1.25;
    font-weight: 500;
    margin: 0 0 2px !important;
    color: #2a322c !important;
}
.hb-mega-auto .hb-mega-prod-price { margin-top: 0 !important; line-height: 1.1; }
.hb-mega-auto .hb-mega-prod-price s {
    color: #e23b3b;
    font-size: 12px;
    margin-right: 6px;
}
.hb-mega-auto .hb-mega-prod-price b {
    color: #1a1a1a;
    font-size: 15px;
    font-weight: 700;
}
.hb-mega-auto .sablon2-level-menu-right-product-box:hover .hb-mega-prod-name { color: #2f7d57 !important; }

/* ============================================================
   6) ÜST KATEGORİ MENÜ ÇUBUĞU — ortalı + modern
   ============================================================ */
.top-level-menu-main-div {
    background: #ffffff !important;
    border-top: 1px solid #f1f3f1 !important;
    border-bottom: 1px solid #ececec !important;
    box-shadow: 0 3px 12px rgba(16, 24, 20, .045) !important;
}
.top-level-menu-main-div-in {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
}
.head-new-area-left { width: 100% !important; flex: 1 1 auto !important; }

/* Menü öğeleri ortalı + TEK SATIR */
.top-level-menu {
    justify-content: center !important;
    flex-wrap: nowrap !important;
}
.top-level-menu > li {
    background: transparent !important;   /* eski gri aktif kutuyu kaldır */
    /* DİKKAT: position:relative YOK → mega menü .top-level-menu'ye göre konumlanır (en soldan başlar). Standart dropdown'lar inline position:relative kullanır.
       white-space buraya KONULMAZ → kalıtımla mega içeriğine (ürün/kategori adları) sızar, satır kırmayı bozar. */
}
.top-level-menu > li > a {
    display: block !important;
    padding: 14px 15px !important;
    position: relative;
    white-space: nowrap;   /* nav etiketi tek satır (sadece link, dropdown içeriğine sızmaz) */
}
.top-level-menu > li > a span {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .5px;
    text-transform: uppercase;
    color: #2f7d57 !important;
    transition: color .15s ease;
}
/* açılır menü oku */
.top-level-menu > li > a span i {
    font-size: 12px !important;
    color: #aebfb5 !important;
    transition: transform .2s ease, color .2s ease;
}
/* animasyonlu yeşil alt çizgi */
.top-level-menu > li > a::after {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 8px;
    height: 2px;
    background: #2f7d57;
    border-radius: 2px;
    transform: scaleX(0);
    transition: transform .22s ease;
}
.top-level-menu > li:hover > a::after { transform: scaleX(1); }
.top-level-menu > li:hover > a span { color: #25624a !important; }
.top-level-menu > li:hover > a span i { transform: rotate(180deg); color: #2f7d57 !important; }
/* hover'da öğenin altına hafif yeşil zemin */
.top-level-menu > li:hover { background: #f4f8f5 !important; border-radius: 8px 8px 0 0; }

/* ============================================================
   7) ANA SLIDER — tam genişlik + KIRPMASIZ + modern
   Kapsam: .slider-main-div. (.main-body zaten width:100% → 100vw breakout GEREKMEZ,
   o yüzden fazladan dikey scrollbar oluşmaz.)
   Masaüstünde yükseklik görsel oranına (1600x480) kilitlenir → cover kırpmaz.
   ============================================================ */
.slider-main-div {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    background: #f4f6f4 !important;
}
/* Masaüstü: görsel oranına kilitli yükseklik → kırpma yok */
@media screen and (min-width: 768px) {
    .slider-main-div .swiper-container {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1600 / 480 !important;   /* slider görsel oranı (1600x480) → kırpma yok */
        margin: 0 !important;
    }
    .slider-main-div .swiper-container .swiper-wrapper,
    .slider-main-div .swiper-container .swiper-slide {
        height: 100% !important;
    }
}
/* Modern oklar — yuvarlak beyaz daire + YEŞİL ok (SVG), hover'da yeşil daire + beyaz ok */
.slider-main-div .swiper-button-next,
.slider-main-div .swiper-button-prev {
    width: 48px !important;
    height: 48px !important;
    margin-top: -24px !important;
    background-color: rgba(255, 255, 255, .95) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px 16px !important;
    border-radius: 50% !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16) !important;
    transition: background-color .18s ease, transform .18s ease;
}
.slider-main-div .swiper-button-prev {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f7d57' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E") !important;
}
.slider-main-div .swiper-button-next {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232f7d57' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
}
.slider-main-div .swiper-button-prev:hover {
    background-color: #2f7d57 !important;
    transform: scale(1.07);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='15 18 9 12 15 6'/%3E%3C/svg%3E") !important;
}
.slider-main-div .swiper-button-next:hover {
    background-color: #2f7d57 !important;
    transform: scale(1.07);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'/%3E%3C/svg%3E") !important;
}
.slider-main-div .swiper-button-next::after,
.slider-main-div .swiper-button-prev::after { content: "" !important; }
/* Modern sayfa noktaları — aktif uzun yeşil pill */
.slider-main-div .swiper-pagination-bullet {
    width: 9px;
    height: 9px;
    background: #ffffff;
    opacity: .75;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
    transition: width .22s ease, background .22s ease, opacity .22s ease;
}
.slider-main-div .swiper-pagination-bullet-active {
    width: 28px;
    border-radius: 5px;
    background: #2f7d57;
    opacity: 1;
}

/* ===== HERBAL PALACE — Hesap/Giriş Dropdown · modern (CSS-only) ===== */
/* ============================================================
   Kapsam: SADECE header hesap/giriş açılır paneli (.user-drop).
   Üç durum aynı paneli paylaşır:
     • Guest  : .dropdown-user-area-header (GİRİŞ + HEMEN ÜYE OL) + linkler
     • Üye     : .dropdown-userarea-header (başlık) + link listesi
     • Onaysız : uyarı kutusu (.p-2) + tek "Çıkış" linki
   GÜVENLİK: .button-blue / .button-green / .dropdown-user-area-* sınıfları
   sitenin başka yerlerinde de kullanılır (sepet "Sepete Git" butonu vb.).
   Bu yüzden HER seçici ".user-drop" altında scope'lanmıştır — global hiçbir
   kurala dokunulmaz. CTA'lar ekstra "...header a.button-blue" derinliğinde
   hedeflenir → cep sepeti butonuna ulaşma ihtimali sıfır.
   Yalnızca CSS · HTML değişmez · style.css tabanını !important ile ezer.
   Marka token'ları: #2f7d57 / #25624a / #16201b / #7fc4a0 · soft #f4f7f5 /
   #eef4f0 · hairline #eef1ee · pill 999px · panel gölgesi mega-menü ile aynı.
   ============================================================ */

/* ---------- 1) PANEL — geniş, yuvarlak, sistemle aynı gölge ---------- */
.dropdown-menu.user-drop {
    width: 312px !important;
    padding: 18px 18px 16px !important;
    margin-top: 12px !important;
    background: #ffffff !important;
    border: 1px solid #eef1ee !important;
    border-radius: 16px !important;
    /* mega-menü ile aynı token → tek tasarım sistemi */
    box-shadow: 0 26px 50px rgba(16, 24, 20, .15) !important;
    color: #16201b !important;
    overflow: visible !important;
}

/* Giriş animasyonu — Bootstrap 4 .show ekleyince, sağ-üstten açılır.
   Yalnız açılış anında çalışsın (re-render'de tekrar tetiklenmesin). */
.dropdown-menu.user-drop.show,
.open > .dropdown-menu.user-drop {
    -webkit-animation: userDropIn .19s cubic-bezier(.16, 1, .3, 1) both;
    animation: userDropIn .19s cubic-bezier(.16, 1, .3, 1) both;
    -webkit-transform-origin: top right;
    transform-origin: top right;
}
@-webkit-keyframes userDropIn {
    from { opacity: 0; -webkit-transform: translateY(-7px) scale(.985); }
    to   { opacity: 1; -webkit-transform: translateY(0) scale(1); }
}
@keyframes userDropIn {
    from { opacity: 0; transform: translateY(-7px) scale(.985); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .dropdown-menu.user-drop.show,
    .open > .dropdown-menu.user-drop {
        -webkit-animation: none !important;
        animation: none !important;
    }
}

/* Temiz tek caret — sağ üstte, panelle aynı çerçeve.
   Tabandan gelebilecek ikinci ok'u (::after) nötrle. */
.dropdown-menu.user-drop::before {
    content: "";
    position: absolute;
    top: -7px;
    right: 24px;
    width: 13px;
    height: 13px;
    background: #ffffff;
    border-left: 1px solid #eef1ee;
    border-top: 1px solid #eef1ee;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border-radius: 3px 0 0 0;
    pointer-events: none;
}
.dropdown-menu.user-drop::after { display: none !important; content: none !important; }

.user-drop .dropdown-user-area { width: 100% !important; }

/* ---------- 2) CTA ALANI — birincil (dolu yeşil) + ikincil (ghost) ---------- */
.user-drop .dropdown-user-area-header { width: 100% !important; }

/* Ortak buton tabanı (her iki link de) */
.user-drop .dropdown-user-area-header a.button-blue,
.user-drop .dropdown-user-area-header a.button-green {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;         /* marka pill dili */
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .3px !important;
    line-height: 1 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: none !important;             /* tabanın 0 0 15px gölgesini sıfırla */
    transition: background-color .18s ease, background .18s ease, color .18s ease,
                border-color .18s ease, box-shadow .2s ease, transform .18s ease;
}

/* BİRİNCİL — GİRİŞ (.button-blue): mavi öl, ince yeşil gradyan pill */
.user-drop .dropdown-user-area-header a.button-blue {
    background: linear-gradient(180deg, #34885f 0%, #2f7d57 100%) !important;
    border: 1px solid #2f7d57 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(47, 125, 87, .26) !important;
}
.user-drop .dropdown-user-area-header a.button-blue:hover {
    background: linear-gradient(180deg, #2f7d57 0%, #25624a 100%) !important;
    border-color: #25624a !important;
    color: #ffffff !important;
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(47, 125, 87, .34) !important;
}
.user-drop .dropdown-user-area-header a.button-blue:active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    box-shadow: 0 5px 12px rgba(47, 125, 87, .26) !important;
}

/* İKİNCİL — HEMEN ÜYE OL (.button-green): ghost / outline yeşil pill
   (tabanın color:#FFF!important ve gölgesi ezilir) */
.user-drop .dropdown-user-area-header a.button-green {
    background: #ffffff !important;
    border: 1.5px solid #cfe3d7 !important;
    color: #2f7d57 !important;
    margin-bottom: 0 !important;
}
.user-drop .dropdown-user-area-header a.button-green:hover {
    background: #2f7d57 !important;
    border-color: #2f7d57 !important;
    color: #ffffff !important;
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(47, 125, 87, .22) !important;
}
.user-drop .dropdown-user-area-header a.button-green:active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/* Klavye erişilebilirliği — arama alanı focus token'ı ile uyumlu halka */
.user-drop .dropdown-user-area-header a.button-blue:focus-visible,
.user-drop .dropdown-user-area-header a.button-green:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 3px #eef4f0, 0 0 0 4px #2f7d57 !important;
}

/* ---------- 3) "Veya" AYIRICI — kenarları sönen gradyan hairline ---------- */
.user-drop .dropdown-user-area-lineText {
    width: 100% !important;
    height: auto !important;
    border-bottom: 0 !important;
    margin: 14px 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
}
.user-drop .dropdown-user-area-lineText::before,
.user-drop .dropdown-user-area-lineText::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(207, 227, 216, 0), rgba(207, 227, 216, 1));
}
.user-drop .dropdown-user-area-lineText::after {
    background: linear-gradient(90deg, rgba(207, 227, 216, 1), rgba(207, 227, 216, 0));
}
.user-drop .dropdown-user-area-lineText-in {
    background: transparent !important;
    padding: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    color: #9aa39c !important;
}

/* ---------- 4) LİNK SATIRLARI — chip ikon + yuvarlak hover + chevron ---------- */
.user-drop .dropdown-user-area-link-area {
    width: 100% !important;
    border-top: 1px solid #eef1ee !important;
    margin-top: 14px !important;
    padding-top: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}
/* CTA + link birlikteyse (guest) üst boşluk dengesi */
.user-drop .dropdown-user-area-header + .dropdown-user-area-link-area { margin-top: 14px !important; }

.user-drop .dropdown-user-area-link-area a {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    border: 0 !important;                    /* sert tam-genişlik çizgileri kaldır */
    border-bottom: 0 !important;
    margin: 0 !important;
    /* sağda chevron için yer (34px) */
    padding: 8px 34px 8px 8px !important;
    border-radius: 12px !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: #2a322c !important;
    text-decoration: none !important;
    transition: background-color .16s ease, color .16s ease, transform .16s ease;
}
.user-drop .dropdown-user-area-link-area a:hover {
    background: #f4f7f5 !important;          /* header genelindeki soft token */
    color: #2f7d57 !important;               /* tabanın :hover #818181'ini ez */
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
}

/* Dairesel yumuşak-yeşil ikon chip — Line Awesome / FA4 / Ionicons hizalı.
   margin:0!important → giriş yapılmış durumdaki inline icon margin'ini ezer. */
.user-drop .dropdown-user-area-link-area a i {
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 34px !important;
    margin: 0 11px 0 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #eef4f0 !important;
    color: #2f7d57 !important;
    font-size: 15px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    transition: background-color .16s ease, color .16s ease, transform .16s ease;
}
.user-drop .dropdown-user-area-link-area a:hover i {
    background: #2f7d57 !important;
    color: #ffffff !important;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/* Sağda hover'da beliren chevron */
.user-drop .dropdown-user-area-link-area a::after {
    content: "\203A";
    position: absolute;
    right: 13px;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(-4px);
    transform: translateY(-50%) translateX(-4px);
    font-size: 18px;
    line-height: 1;
    color: #c2ccc6;
    opacity: 0;
    transition: opacity .16s ease, transform .16s ease, color .16s ease;
}
.user-drop .dropdown-user-area-link-area a:hover::after {
    opacity: 1;
    -webkit-transform: translateY(-50%) translateX(0);
    transform: translateY(-50%) translateX(0);
    color: #2f7d57;
}

/* ---------- 5) SAYAÇ ROZETİ — beyaz-yazı dolu-yeşil pill "(0)" ---------- */
.user-drop .dropdown-user-area-link-area a strong {
    margin-left: auto !important;            /* sağa yaslı (chevron alanının solunda) */
    margin-right: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
    height: 20px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    background: #2f7d57 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .2px !important;
    transition: background-color .16s ease;
}
.user-drop .dropdown-user-area-link-area a:hover strong {
    background: #25624a !important;
    color: #ffffff !important;
}

/* ---------- 6) GİRİŞ YAPILMIŞ DURUM — sessiz bölüm başlığı ---------- */
.user-drop .dropdown-userarea-header {
    width: 100% !important;
    border-bottom: 1px solid #eef1ee !important;
    margin: 0 0 8px !important;
    padding: 0 2px 10px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .8px !important;
    text-transform: uppercase !important;
    color: #6b756f !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}
/* Üye durumunda link alanı (inline border-top:0 / margin-top:0 ile gelir) →
   chip + hover muamelesini yukarıdaki kuraldan miras alır, sadece ilk satır boşluğu: */
.user-drop .dropdown-userarea-header + .dropdown-user-area-link-area { padding-top: 4px !important; }

/* ---------- 7) ONAYSIZ DURUM — yuvarlak modern uyarı çerçevesi ---------- */
/* Inline pembe/turuncu uyarı paleti KORUNUR; yalnız köşe/ritim modernleşir.
   .dropdown-userarea-header[style] → onaysız kutu inline stil taşır. */
.user-drop .dropdown-userarea-header.p-2,
.user-drop .dropdown-userarea-header[style] {
    display: block !important;
    border-bottom: 0 !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    margin-bottom: 12px !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}
.user-drop .dropdown-userarea-header.p-2 .mt-2 { margin-top: 6px !important; }

/* ---------- 8) güvenlik kalkanı ---------- */
.user-drop .dropdown-user-area-header a.button-blue,
.user-drop .dropdown-user-area-header a.button-green { -webkit-tap-highlight-color: transparent; }