/**
 * WordPress Admin Bar Fix
 * 管理バーを表示しつつ、ページレイアウトには一切影響を与えない
 */

/* WordPressが自動追加するmarginをリセット（これが被る原因）*/
html {
    margin-top: 0 !important;
}

body.admin-bar {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 管理バーをページ下部に表示 */
#wpadminbar {
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    z-index: 99999 !important;
}

/* ページ要素には一切影響を与えない */
body.admin-bar #wrapper,
body.admin-bar #header,
body.admin-bar .wrapper {
    top: 0 !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 管理バーを半透明にする（重要：すべての子要素にも適用） */
#wpadminbar,
#wpadminbar .ab-sub-wrapper,
#wpadminbar .menupop .ab-sub-wrapper,
#wpadminbar .quicklinks .ab-sub-wrapper,
#wpadminbar > * {
    background: rgba(35, 40, 45, 0.15) !important;
}

/* サブメニューも半透明（下部表示なので上向きに開く） */
#wpadminbar .ab-submenu {
    background: rgba(40, 45, 50, 0.9) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    bottom: 100% !important;
    top: auto !important;
}

/* ホバー時の背景も調整 */
#wpadminbar .ab-item:hover,
#wpadminbar .menupop .ab-item:hover {
    background: rgba(55, 60, 65, 0.9) !important;
}

/* 管理バーのテキストを見やすく */
#wpadminbar,
#wpadminbar * {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}