/* =========================================
   ダークモード用スタイル
   [data-theme="dark"] が付与された場合のみ適用
========================================= */

html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="dark"] body {
    background-color: #23282F !important;
    color: #E6E6E6 !important;
}

html[data-theme="dark"] a {
    color: #719DDC !important;
}

html[data-theme="dark"] #balloon-stage,
html[data-theme="dark"] .log-frame,
html[data-theme="dark"] .post {
    background-color: transparent !important;
    color: currentColor !important;
}

html[data-theme="dark"] hr {
    border: 0 !important;
    border-top: 1px solid #777777 !important;
    background: none !important;
    height: 0 !important;
    color: transparent !important;
}

html[data-theme="dark"] .log-frame b:first-of-type font,
html[data-theme="dark"] .log-frame h1:first-of-type {
    color: currentColor !important;
}

html[data-theme="dark"] .post__user-name {
    color: #719DDC !important;
}
html[data-theme="dark"] .post__action-btn {
    color: #696969 !important;
}
html[data-theme="dark"] .header-button a,
html[data-theme="dark"] .footer-button a,
html[data-theme="dark"] .pagination a {
    color: #111111 !important;
}

html[data-theme="dark"] a.tag-like,
html[data-theme="dark"] a.page-jump-button-on,
html[data-theme="dark"] #copyright a {
    color: #ffffff !important;
}
html[data-theme="dark"] .global-nav a {
    color: currentColor !important;
}

html[data-theme="dark"] .footer a,
html[data-theme="dark"] .page-title {
    background-color: #1a1a1a !important;
    color: currentColor !important;
}

html[data-theme="dark"] .related-sites-item a {
    color: currentColor !important;
}

html[data-theme="dark"] font[color="#000000"] {
    color: currentColor !important;
}

html[data-theme="dark"] a.back-button {
    color: #3d3b3d !important;
}

/* リンク */
/* html[data-theme="dark"] a,
html[data-theme="dark"] a:link,
html[data-theme="dark"] a:visited {
    color: #7cc7ff !important; 
} */

/* 既存の<font color="#000000">を無効化 */
/* html[data-theme="dark"] font[color="#000000"] {
    color: inherit !important;
} */




/* html[data-theme="dark"] #balloon-stage,
html[data-theme="dark"] .log-frame {
    background: transparent !important;
    color: var(--dm-text) !important;
} */


/* 各種コンポーネントの背景色調整 */
/* html[data-theme="dark"] .post,
html[data-theme="dark"] .header-button,
html[data-theme="dark"] .footer-button,
html[data-theme="dark"] .pagination-wrap,
html[data-theme="dark"] .footer {
    background-color: #1e1e1e !important;
    border-color: #333333 !important;
    color: #e0e0e0 !important;
} */

/* 投稿ブロック内の境界線など */
/* html[data-theme="dark"] hr {
    border-color: #333333 !important;
    background-color: #333333 !important;
    color: #333333 !important;
} */

/* 必要に応じて、白背景を前提とした画像が眩しくないように少し暗くする（任意） */
/* html[data-theme="dark"] img {
    opacity: 0.9;
} */
