/* ==========================================================================
   ALTUNAKARDESK ÜRÜN SİTESİ — ÜST MENÜ (2026-10-30)
   --------------------------------------------------------------------------
   NE: _ortak.php uds_ust() başlığı (.udsb): logo | Özellikler ▾ · Fiyatlandırma ▾ ·
   İşletmeler ▾ · Destek ▾ | Oturum aç · [İndir] · tema. Her başlık açılır panel
   ($UDS_UST_MENU): simgeli ya da fotoğraflı öğeler, isteğe bağlı koyu vitrin kartı,
   alt bağlantılar, 7/24 hat. Davranış js/ud-site.js sonunda (tıkla / üzerine gel,
   Esc, dışarı tık, ok tuşu). 1100 px altında hamburger içinde akordeon.
   NEDEN: Tuna "daha profesyonel, kullanışlı" → "diğerlerinde de alt başlıklar
   açılsın, tasarımları çok üst düzey premium olsun".
   Seçiciler ud-site.css/ud-tasarim.css'teki .uds-menu ul a kurallarını yenmek için
   body.uds ile güçlendirildi.
   GERİ ALMA: ~/Desktop/Yedekler/uzak-destek-sade-ve-menu-oncesi-20261030/
   ========================================================================== */

/* -- Çubuk ------------------------------------------------------------------ */
.udsb .uds-bas-ic { gap: 8px; }
.udsb .uds-logo { margin-right: 22px; }
.udsb .uds-menu { gap: 18px; }
.udsb .udsb-liste { flex: 1; gap: 2px; }
.udsb .udsb-acilir { position: relative; }
.udsb .udsb-ac {
    position: relative; display: inline-flex; align-items: center; gap: 7px; padding: 10px 11px; border: 0; background: none;
    color: var(--kt-murekkep); font: inherit; font-size: 14px; font-weight: 500; letter-spacing: -.005em; cursor: pointer; border-radius: 9px;
    transition: color .15s ease, background .15s ease;
}
.udsb .udsb-ac i { font-size: 9.5px; opacity: .55; transition: transform .22s cubic-bezier(.2, .8, .2, 1), opacity .15s ease; }
.udsb .udsb-ac:hover, .udsb .udsb-acilir.acik .udsb-ac { color: var(--kt-aksan-600); }
.udsb .udsb-ac:hover i, .udsb .udsb-acilir.acik .udsb-ac i { opacity: 1; }
.udsb .udsb-acilir.acik .udsb-ac i { transform: rotate(180deg); }
.udsb .udsb-ac:focus-visible { outline: 2px solid var(--kt-aksan-600); outline-offset: 2px; }
.udsb .udsb-ac[data-gecerli]::after {          /* bulunulan sayfanın grubu: alt çizgi */
    content: ""; position: absolute; left: 11px; right: 24px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--kt-aksan-600);
}
.udsb .udsb-ac[data-gecerli] { color: var(--kt-aksan-600); }

/* -- Panel ------------------------------------------------------------------ */
.udsb .udsb-panel {
    position: absolute; top: calc(100% + 12px); left: -14px; z-index: 60;
    display: grid; grid-template-columns: minmax(0, 1fr); width: 372px;
    border-radius: 18px; overflow: hidden;
    background: var(--kt-yuzey-1);
    border: 1px solid color-mix(in srgb, var(--kt-murekkep) 9%, transparent);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, .6) inset,
        0 2px 6px rgba(9, 20, 46, .05),
        0 18px 40px -14px rgba(9, 20, 46, .22),
        0 40px 90px -30px rgba(9, 20, 46, .28);
    opacity: 0; visibility: hidden; transform: translateY(8px) scale(.985); transform-origin: 30px 0;
    transition: opacity .18s ease, transform .22s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .22s;
}
.udsb .udsb-panel::before {                    /* tetikleyiciyle panel arasındaki boşlukta fare kopmasın */
    content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px;
}
.udsb .udsb-acilir.acik .udsb-panel { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.udsb .udsb-panel.vitrinli { grid-template-columns: minmax(0, 1fr) 262px; width: 680px; }
.udsb .udsb-acilir:has(.udsb-ogeler.iki) .udsb-panel { width: 820px; grid-template-columns: minmax(0, 1fr) 248px; }
.udsb .udsb-govde { padding: 10px; display: grid; align-content: start; gap: 4px; }
.udsb .udsb-ogeler { display: grid; gap: 2px; }
.udsb .udsb-ogeler.iki { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 4px; }

/* Öğe */
body.uds .udsb .udsb-panel a { position: static; border-radius: 12px; background: none !important; text-decoration: none; white-space: normal; }
body.uds .udsb .udsb-panel a::after { display: none !important; }
body.uds .udsb .udsb-oge {
    display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 13px; align-items: center; padding: 11px 12px;
    color: var(--kt-murekkep); transition: background .15s ease;
}
body.uds .udsb .udsb-oge:hover, body.uds .udsb .udsb-oge:focus-visible { background: var(--kt-yuzey-2) !important; }
body.uds .udsb .udsb-oge:focus-visible { outline: 2px solid var(--kt-aksan-600); outline-offset: -2px; }
.udsb .udsb-ikon {
    display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px;
    background: linear-gradient(160deg, var(--kt-aksan-50), color-mix(in srgb, var(--kt-aksan-50) 40%, var(--kt-yuzey-1)));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--kt-aksan-600) 12%, transparent) inset;
    color: var(--kt-aksan-600); font-size: 15px;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}
body.uds .udsb .udsb-oge:hover .udsb-ikon, body.uds .udsb .udsb-oge:focus-visible .udsb-ikon {
    background: var(--kt-aksan-600); color: #fff; box-shadow: 0 6px 14px -6px color-mix(in srgb, var(--kt-aksan-600) 70%, transparent);
}
.udsb .udsb-resim { display: block; width: 40px; height: 40px; border-radius: 11px; overflow: hidden; box-shadow: 0 0 0 1px rgba(9, 20, 46, .08); }
.udsb .udsb-resim img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
body.uds .udsb .udsb-oge:hover .udsb-resim img { transform: scale(1.08); }
.udsb .udsb-yazi b { display: block; font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; line-height: 1.3; color: var(--kt-murekkep); transition: color .15s ease; }
.udsb .udsb-yazi small { display: block; margin-top: 2px; font-size: 12.8px; line-height: 1.38; color: var(--kt-murekkep-2, var(--kt-soluk, #64748b)); }
body.uds .udsb .udsb-oge:hover .udsb-yazi b { color: var(--kt-aksan-600); }

/* Alt bağlantılar (Fiyatlandırma) */
.udsb .udsb-acilir:has(.udsb-alt) .udsb-panel { width: 440px; }
.udsb .udsb-alt { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--udt-cizgi, var(--kt-cizgi)); }
body.uds .udsb .udsb-alt a {
    display: flex; align-items: center; gap: 8px; padding: 10px 12px; font-size: 13.3px; font-weight: 600; color: var(--kt-murekkep);
    background: var(--kt-yuzey-2) !important; border-radius: 10px; white-space: nowrap; transition: color .15s ease, background .15s ease;
}
body.uds .udsb .udsb-alt a i:first-child { color: var(--kt-aksan-600); font-size: 13px; }
body.uds .udsb .udsb-alt a .udsb-ok { margin-left: auto; font-size: 10px; opacity: .45; transition: transform .18s ease, opacity .18s ease; }
body.uds .udsb .udsb-alt a:hover { color: var(--kt-aksan-600); background: color-mix(in srgb, var(--kt-aksan-50) 80%, var(--kt-yuzey-2)) !important; }
body.uds .udsb .udsb-alt a:hover .udsb-ok { transform: translateX(3px); opacity: 1; }

/* 7/24 hat (Destek) */
.udsb .udsb-hat {
    display: flex; align-items: center; gap: 9px; margin-top: 6px; padding: 12px 12px 4px; border-top: 1px solid var(--udt-cizgi, var(--kt-cizgi));
    font-size: 13px; color: var(--kt-murekkep-2, var(--kt-soluk, #64748b));
}
.udsb .udsb-hat i { color: var(--kt-aksan-600); }
.udsb .udsb-hat span { white-space: nowrap; }
body.uds .udsb .udsb-hat a { margin-left: auto; padding: 0; border: 0 !important; display: inline; white-space: nowrap; font-size: 14px; font-weight: 700; color: var(--kt-murekkep); font-variant-numeric: tabular-nums; }
body.uds .udsb .udsb-hat a:hover { color: var(--kt-aksan-600); }

/* Vitrin kartı: koyu gece mavisi, görsel + kısa çağrı */
body.uds .udsb .udsb-panel a.udsb-vitrin {
    position: relative; display: flex; flex-direction: column; margin: 8px; border-radius: 14px !important; overflow: hidden; color: #fff;
    background: linear-gradient(165deg, var(--udt-gece, #0a1428) 0%, color-mix(in srgb, var(--kt-aksan-600) 42%, var(--udt-gece, #0a1428)) 100%) !important;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .06) inset;
}
.udsb .udsb-vitrin-gorsel { display: block; height: 128px; overflow: hidden; padding: 14px 14px 0; }
.udsb .udsb-vitrin-gorsel img {
    display: block; width: 100%; height: 100%; object-fit: cover; object-position: left top; border-radius: 9px 9px 0 0;
    box-shadow: 0 -6px 30px -8px rgba(0, 0, 0, .5); transition: transform .4s cubic-bezier(.2, .8, .2, 1);
}
body.uds .udsb .udsb-panel a.udsb-vitrin:hover .udsb-vitrin-gorsel img { transform: translateY(-3px) scale(1.02); }
.udsb .udsb-vitrin-yazi { display: grid; gap: 6px; padding: 14px 16px 16px; }
.udsb .udsb-vitrin-yazi b { font-size: 15px; font-weight: 650; letter-spacing: -.015em; line-height: 1.25; }
.udsb .udsb-vitrin-yazi small { font-size: 12.8px; line-height: 1.45; color: rgba(255, 255, 255, .72); }
.udsb .udsb-vitrin-yazi em { margin-top: 4px; white-space: nowrap; font-style: normal; font-size: 13px; font-weight: 600; color: var(--kt-aksan-300, #9cc2f5); }
.udsb .udsb-vitrin-yazi em i { font-size: 10px; margin-left: 4px; transition: transform .18s ease; }
body.uds .udsb .udsb-panel a.udsb-vitrin:hover em i { transform: translateX(3px); }
body.uds .udsb .udsb-panel a.udsb-vitrin:focus-visible { outline: 2px solid var(--kt-aksan-300, #9cc2f5); outline-offset: 2px; }

/* -- Sağ eylemler ------------------------------------------------------------ */
.udsb .uds-menu-eylem { gap: 14px; }
.udsb .udsb-oturum { display: inline-flex; align-items: center; gap: 7px; color: var(--kt-murekkep); text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 2px; white-space: nowrap; }
.udsb .udsb-oturum i { font-size: 16px; opacity: .75; }
.udsb .udsb-oturum:hover, .udsb .udsb-oturum[aria-current="page"] { color: var(--kt-aksan-600); }
.udsb .udsb-indir { padding-inline: 18px; }
.udsb .uds-tema { border: 0; background: none; width: 38px; }
.udsb .uds-tema:hover { background: var(--kt-yuzey-2); }

/* -- Koyu tema ---------------------------------------------------------------- */
html[data-theme="dark"] .udsb .udsb-panel {
    border-color: rgba(255, 255, 255, .08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .05) inset, 0 24px 70px -20px rgba(0, 0, 0, .75);
}
html[data-theme="dark"] .udsb .udsb-ikon { background: color-mix(in srgb, var(--kt-aksan-600) 20%, transparent); color: var(--kt-aksan-300); box-shadow: none; }
html[data-theme="dark"] body.uds .udsb .udsb-oge:hover .udsb-ikon { background: var(--kt-aksan-600); color: #fff; }
html[data-theme="dark"] body.uds .udsb .udsb-oge:hover .udsb-yazi b,
html[data-theme="dark"] .udsb .udsb-ac:hover, html[data-theme="dark"] .udsb .udsb-acilir.acik .udsb-ac,
html[data-theme="dark"] .udsb .udsb-ac[data-gecerli] { color: var(--kt-aksan-300); }

/* -- Telefon / dar ekran: hamburger içinde akordeon --------------------------- */
@media (max-width: 1100px) {
    .udsb .uds-logo { margin-right: 0; }
    .udsb .udsb-liste { flex: none; gap: 0; }
    .udsb .udsb-acilir { border-bottom: 1px solid var(--kt-cizgi); }
    .udsb .udsb-ac { width: 100%; justify-content: space-between; padding: 15px 4px; font-size: 16.5px; font-weight: 600; border-radius: 0; }
    .udsb .udsb-ac i { font-size: 12px; opacity: .6; }
    .udsb .udsb-ac[data-gecerli]::after { display: none; }
    .udsb .udsb-panel, .udsb .udsb-panel.vitrinli, .udsb .udsb-acilir:has(.udsb-ogeler.iki) .udsb-panel, .udsb .udsb-acilir:has(.udsb-alt) .udsb-panel {
        position: static; width: auto; grid-template-columns: minmax(0, 1fr); border: 0; border-radius: 0; box-shadow: none; background: none;
        opacity: 1; visibility: visible; transform: none; transition: none;
    }
    /* Ayrı ve sade seçiciler: yukarıdaki :has() kurallarının özgüllüğü açık paneli gizlemesin. */
    .udsb .udsb-panel { display: none; }
    .udsb .udsb-liste .udsb-acilir.acik > .udsb-panel { display: grid; }
    .udsb .udsb-panel::before { display: none; }
    .udsb .udsb-govde { padding: 0 0 12px; }
    .udsb .udsb-ogeler.iki { grid-template-columns: minmax(0, 1fr); }
    body.uds .udsb .udsb-panel a { border-bottom: 0 !important; }
    body.uds .udsb .udsb-oge { padding: 10px 4px; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; }
    .udsb .udsb-ikon, .udsb .udsb-resim { width: 36px; height: 36px; border-radius: 10px; font-size: 14px; }
    body.uds .udsb .udsb-panel a.udsb-vitrin { display: none; }
    .udsb .udsb-alt { grid-template-columns: minmax(0, 1fr); }
    .udsb .udsb-hat { padding: 12px 4px 0; }
    .udsb .uds-menu-eylem { gap: 10px; margin-top: 6px; }
    .udsb .udsb-oturum { flex: 1 1 100%; justify-content: center; padding: 12px; border: 1px solid var(--kt-cizgi); border-radius: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .udsb .udsb-panel, .udsb .udsb-ac i, .udsb .udsb-ikon, .udsb .udsb-resim img, .udsb .udsb-vitrin-gorsel img { transition: none; }
}