.reorder_button a {
    background-color: #bf0000;
    border: 1px solid #bf0000;
}


.order_cancel_button  {
    background-color: #0048aa;
    border: 1px solid #0048aa;
}

/* --- マイページ 注文履歴 --- */

.order_history_buttons {
    display: flex;
    gap: 8px;
}

.order_contact{
    width: 100%; 
    overflow-wrap: anywhere;
}

/* モバイル版の設定 (767px以下) 
*/
@media only screen and (max-width: 767px) {
    
    /* 注文情報＋ボタン群をFlexで横並び */
    .ec-historyListHeader {
        display: flex;
        justify-content: space-between; /* 左に情報・右にボタン群 */
        align-items: flex-start;
    }

     /* 注文情報は縦並び（PCと同じ） */
    .ec-historyListHeader__info {
        display: flex;
        flex-direction: column;
        gap: 4px; /* 情報間の縦間隔 */
    }

    /*  モバイル (767px以下) 
        .ec-historyRole__header-actions (ボタン群) を縦並び (column) にする
    */
    .order_history_buttons {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    /**
        \html\template\dtJEIA4010\assets\scss\project\_16.1.history.scss
        の .ec-historyListHeader__action に対するスタイルをリセット
    */
    .custom-mobile-fix .ec-historyListHeader__action {
        position: static;
        margin-top: 0;
    }

}


/** 商品区分ラベル 
    注文履歴詳細画面
*/
.product-kbn-label {
    display: inline-block; 
    border-radius: 999px;
    padding: 0 16px;
    color: #fff;
    
    background-color: #aaaaaa;
    
    font-size: 12px;
    line-height: 1.5;
}

/* ロイヤルカナンの場合の色 */
.product-kbn-label.is-royal {
    background-color: #d41d17;
}

