/* menuup.css — PiyerSoft paneli üst yatay menü (yeniden oluşturuldu)
   Not: Sadece DÜZEN değiştirilir; renkler stylesheet.css'ten korunur.
   stylesheet.css'teki sol-sidebar (#column-left position:absolute; width:50px) kuralları override edilir. */

/* 1) Sol sütunu tam genişlikte üst yatay bara çevir */
#column-left,
#column-left.active {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    padding-top: 0 !important;
    overflow: visible !important;
}

/* 2) İçerik ve footer tam genişlik — sol boşluğu sıfırla */
#column-left + #content,
#column-left + #content + #footer,
#column-left.active + #content,
#column-left.active + #content + #footer {
    margin-left: 0 !important;
    left: auto !important;
    position: static !important;
}

/* 3) Menü öğelerini yatay diz */
#menu {
    margin-bottom: 0 !important;
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
}
#menu > li {
    position: relative;
}
#menu > li > a {
    border-bottom: none !important;
    white-space: nowrap;
    padding: 15px 14px !important;
}
/* Üst seviyede etiketleri (yazıları) görünür yap */
#menu > li > a > span,
#column-left.active #menu > li > a > span {
    display: inline !important;
    margin-left: 6px;
}

/* 4) 1. seviye alt menüler öğenin ALTINA açılsın */
#menu > li > ul {
    position: absolute !important;
    left: 0 !important;
    top: 100% !important;
    width: 230px !important;
    overflow: visible !important;
    visibility: hidden;
    z-index: 1000;
}
#menu > li:hover > ul {
    visibility: visible !important;
}
#menu li ul {
    overflow: visible !important;
}

/* 5) 2./3. seviye alt menüler yana açılsın */
#menu li li {
    position: relative;
}
#menu li li > ul {
    position: absolute !important;
    left: 100% !important;
    top: 0 !important;
    width: 220px !important;
    visibility: hidden;
    z-index: 1001;
}
#menu li li:hover > ul {
    visibility: visible !important;
}

/* 6) Sağdaki öğelerin açılır menüsü ekrandan taşmasın */
#menu > li:last-child > ul,
#menu > li:nth-last-child(2) > ul {
    left: auto !important;
    right: 0 !important;
}
#menu > li:last-child li > ul,
#menu > li:nth-last-child(2) li > ul {
    left: auto !important;
    right: 100% !important;
}