/*
Theme Name: Sunday Flower Child
Template: sunday_flower
*/

/* WooCommerceページの固定ヘッダー対応 */
.content-area {
    margin-top: 65px;

    padding: 2rem;
    /* ヘッダーの高さに合わせる */
}

@media screen and (min-width:768px) {

    .content-area {

        margin-top: 150px;
    }
}

/*==============min-width:768px==============*/

.products {
    padding-left: 0;
}

.woocommerce-products-header {

    text-align: center;
}

.page-title {
    display: inline-block;
    font-size: var(--text_large);
    font-weight: 400;
    line-height: 1.2;
    /* ← より綺麗に詰まる */
    position: relative;
    margin-bottom: 2.5rem;
    padding-bottom: 0.2rem;
    /* ← 少し余裕を作る */

    background: repeating-linear-gradient(135deg,
            #E0FF7A,
            #E0FF7A 8px,
            #ffffff 8px,
            #ffffff 16px);
    background-repeat: no-repeat;
    /* 横のサイズ 縦のサイズ */
    background-size: 100% 0.7rem;
    background-position: bottom;

}

/* 商品グリッドの簡単なスタイル（Storefront風） */
.products-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.products-grid li.product {
    width: 23%;
    list-style: none;
}


/* 追加CSS*/

.custom-product-container {
    display: flex;
    gap: 40px;
}

.product-left {
    flex: 1;
}

.product-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* モバイル対応 */
@media screen and (max-width: 768px) {
    .custom-product-container {
        flex-direction: column;
    }
}