/* 全ページ共通の背景設定 */
body {
    background: linear-gradient(135deg, #E3F2FD 0%, #FFFFFF 50%, #E0F7FA 100%);
    min-height: 100vh;
}

/* ダークモード対応 - 全ページ統一 */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #0a0e27 !important;
        color: #e0e0e0 !important;
    }

    /* 全ての白い背景要素を強制的にダーク化 */
    *,
    *::before,
    *::after,
    body,
    html,
    .main-navigation,
    .main-navigation ul,
    .main-navigation li,
    .site-header,
    .navbar,
    .navigation,
    .nav-wrap,
    .header-wrapper,
    .container,
    .container-fluid,
    .row,
    .col,
    .site,
    .wrap,
    .wrapper,
    .page,
    .post,
    div,
    section,
    header,
    footer {
        background: transparent !important;
        background-color: transparent !important;
        backdrop-filter: none !important;
        border: none !important;
        border-top: none !important;
        border-bottom: none !important;
        border-left: none !important;
        border-right: none !important;
        box-shadow: none !important;
    }

    /* ただしコンテンツエリアは適切な背景を維持 */
    .card,
    .card-content,
    .event-card,
    .work-card,
    .diary-card,
    .bbs-post,
    .profile-section,
    .content-box,
    .schedule-item,
    .hero-content {
        background: rgba(20, 30, 50, 0.95) !important;
        border: 1px solid rgba(176, 224, 230, 0.2) !important;
    }

    .main-navigation a {
        color: #B0E0E6 !important;
    }

    .main-navigation a:hover {
        background-color: rgba(176, 224, 230, 0.15) !important;
        color: #E0FFFF !important;
    }

    .main-navigation .current-menu-item a,
    .main-navigation .current_page_item a {
        color: #E0FFFF !important;
        background-color: rgba(176, 224, 230, 0.15) !important;
    }

    /* メインコンテンツ - 全ページ共通 */
    .site-main,
    #primary,
    main#primary,
    .event-single,
    .works-archive,
    .kohama-diary,
    .bbs-page,
    .profile-page,
    .page-content,
    main,
    article,
    .content,
    .wrap,
    .container {
        background: linear-gradient(135deg, #0a0e27 0%, #151b3d 50%, #0a0e27 100%) !important;
        background-color: #0a0e27 !important;
        color: #e0e0e0 !important;
    }

    /* 白背景を強制的に上書き */
    .site-main.homepage,
    main.site-main,
    main#primary.site-main,
    .single main,
    .archive main,
    .page main {
        background: linear-gradient(135deg, #0a0e27 0%, #151b3d 50%, #0a0e27 100%) !important;
        background-color: #0a0e27 !important;
    }

    /* カード・セクション共通 */
    .card-content,
    .event-card,
    .work-card,
    .diary-card,
    .bbs-post,
    .profile-section,
    .content-box,
    .schedule-item,
    .hero-content {
        background: rgba(20, 30, 50, 0.95) !important;
        border: 1px solid rgba(176, 224, 230, 0.2) !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
        color: #e0e0e0 !important;
    }

    /* タイトル・見出し */
    h1, h2, h3, h4, h5, h6,
    .page-title,
    .section-title,
    .card-title,
    .entry-title,
    .event-title,
    .work-title {
        color: #B0E0E6 !important;
    }

    /* リンク */
    a {
        color: #48CAE4 !important;
    }

    a:hover {
        color: #8eeee7 !important;
    }

    /* ボタン・リンクボタン */
    .btn,
    .button,
    .card-link,
    .read-more,
    .view-more-link,
    .btn-primary {
        background: rgba(72, 202, 228, 0.1) !important;
        color: #B0E0E6 !important;
        border: 1px solid rgba(176, 224, 230, 0.3) !important;
    }

    .btn:hover,
    .button:hover,
    .card-link:hover,
    .read-more:hover,
    .view-more-link:hover {
        background: rgba(176, 224, 230, 0.2) !important;
        color: #E0FFFF !important;
    }

    /* 日付・メタ情報 */
    .date,
    .meta,
    .card-date,
    .entry-meta,
    time {
        color: #8dd4e0 !important;
    }

    /* テキストコンテンツ */
    p,
    .card-excerpt,
    .entry-content,
    .description {
        color: #c0c0c0 !important;
    }

    /* プレースホルダー画像 */
    .card-image.no-image,
    .placeholder-image {
        background: linear-gradient(135deg, #1a2547, #0f1837) !important;
    }

    /* イベントスケジュール特有のスタイル */
    .event-header {
        background: rgba(0, 0, 0, 0.3) !important;
    }

    .event-details {
        background: rgba(20, 30, 50, 0.8) !important;
        border-color: rgba(176, 224, 230, 0.2) !important;
    }

    .schedule-grid {
        background: rgba(0, 0, 0, 0.2) !important;
    }

    /* 作品一覧特有のスタイル */
    .works-grid {
        background: transparent !important;
    }

    .work-item {
        background: rgba(20, 30, 50, 0.9) !important;
        border-color: rgba(176, 224, 230, 0.2) !important;
    }

    /* 小浜島日記特有のスタイル */
    .diary-entry {
        background: rgba(20, 30, 50, 0.9) !important;
        border-color: rgba(176, 224, 230, 0.2) !important;
    }

    /* 掲示板特有のスタイル */
    .bbs-form {
        background: rgba(20, 30, 50, 0.8) !important;
        border-color: rgba(176, 224, 230, 0.2) !important;
    }

    .bbs-message {
        background: rgba(0, 0, 0, 0.3) !important;
        border-color: rgba(176, 224, 230, 0.1) !important;
    }

    /* フォーム要素 */
    input[type="text"],
    input[type="email"],
    input[type="url"],
    textarea,
    select {
        background: rgba(0, 0, 0, 0.4) !important;
        border: 1px solid rgba(176, 224, 230, 0.3) !important;
        color: #e0e0e0 !important;
    }

    input[type="text"]:focus,
    input[type="email"]:focus,
    input[type="url"]:focus,
    textarea:focus,
    select:focus {
        border-color: #48CAE4 !important;
        outline: none !important;
    }

    /* テーブル */
    table {
        background: rgba(0, 0, 0, 0.2) !important;
    }

    th {
        background: rgba(20, 30, 50, 0.6) !important;
        color: #B0E0E6 !important;
    }

    td {
        border-color: rgba(176, 224, 230, 0.1) !important;
        color: #c0c0c0 !important;
    }

    /* パンくずリスト */
    .breadcrumb {
        background: rgba(0, 0, 0, 0.3) !important;
    }

    .breadcrumb a {
        color: #48CAE4 !important;
    }

    /* ページネーション */
    .pagination a,
    .page-numbers {
        background: rgba(20, 30, 50, 0.8) !important;
        color: #B0E0E6 !important;
        border-color: rgba(176, 224, 230, 0.3) !important;
    }

    .pagination .current,
    .page-numbers.current {
        background: rgba(72, 202, 228, 0.2) !important;
        color: #E0FFFF !important;
    }

    /* フッター */
    .site-footer {
        background: linear-gradient(135deg, #0a0e27 0%, #151b3d 30%, #0f1837 60%, #0a0e27 100%) !important;
        border-top: 1px solid rgba(176, 224, 230, 0.2) !important;
        color: #e0e0e0 !important;
    }
}

/* モバイルデバイス用の強制スタイル - header.phpから移動 */
.is-mobile-device .mobile-menu-toggle {
    display: block !important;
}

/* ダークモードでもハンバーガーメニューを表示 */
@media (max-width: 768px) {
    .mobile-menu-toggle {
        display: block !important;
    }
}

/* ダークモード時のハンバーガーメニュースタイル */
@media (prefers-color-scheme: dark) {
    body.dark-mode .mobile-menu-toggle {
        background: rgba(60, 70, 90, 0.95) !important;
        border: 1px solid rgba(176, 224, 230, 0.4) !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
    }

    body.dark-mode .mobile-menu-toggle span {
        background: #E0FFFF !important;
        height: 3px !important;
    }
}