/* ========================================
   1カラムレイアウト（メインコンテンツのみ表示）
======================================== */

.layout-single-column .main-content {
    grid-template-columns: 1fr;
    max-width: none;
    /* 制限解除、外側のcontainerで制御 */
    margin: 0;
    width: 100%;
    /* 幅は100%で使用 */
    background-color: var(--background-color);
}

/* 1カラム時、サイドバーは非表示（ウィジェット編集用にvisibility: hiddenで対応） */
.layout-single-column .sidebar-1,
.layout-single-column .sidebar-2 {
    visibility: hidden;
    position: absolute;
    left: -9999px;
    /* ウィジェット編集時は表示されるように、display: noneではなくvisibility: hiddenを使用 */
}

/* 1カラム時、サイドバーを確実に非表示（ウィジェット編集用にvisibility: hiddenで対応） */
body.layout-single-column .sidebar-1,
body.layout-single-column .sidebar-2,
body.layout-single-column .sidebar {
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* 1カラム時、コンテンツエリアの幅制限を解除 */
.layout-single-column .content-area {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 1カラム時、エントリーコンテンツの幅制限を解除 */
.layout-single-column .entry-content,
.layout-single-column .entry-header {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 1カラム時、コンテナの幅制限を解除 */
.layout-single-column .container {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 1カラム時、サイト全体の幅制限を解除 */
.layout-single-column .site-wrapper,
.layout-single-column .site {
    width: 100% !important;
    max-width: none !important;
    overflow: visible !important;
}

/* 1カラム時、メインコンテンツの基本調整（JavaScriptで動的に上書きされる） */
.layout-single-column main {
    margin-top: 0 !important;
    /* JavaScriptで動的に設定される */
    padding-top: 0 !important;
}

/* 1カラム時、ヘッダーの高さに応じてスペースを確保 */
/* 上記の最高優先度設定で統一されているため、個別設定は削除 */

/* 1カラム時、コンテンツエリアの上部スペース調整は削除（完全に0にする） */

/* JavaScriptが無効の場合のフォールバック */
.no-js.layout-single-column main {
    margin-top: 30px;
}

.no-js body.admin-bar.layout-single-column main {
    margin-top: 62px;
}

@media screen and (max-width: 782px) {
    .no-js body.admin-bar.layout-single-column main {
        margin-top: 76px;
    }
}

