/* カスタマイズ用CSS */

/* ANDSALE カスタムカラースキーム - エレガントグレー */

/* CSS変数のオーバーライド */
:root {
    --button-bg: #6B7280 !important;     /* メインのグレー */
    --button-hover: #4B5563 !important;  /* ホバー時の濃いグレー */
}

/* EC-CUBEのメインカラー（$clrRed）を完全にオーバーライド */

/* ボタン - カートに入れる、購入へ進む など */
body .ec-blockBtn--primary,
body .ec-blockBtn--action,
body .ec-regular .ec-blockBtn--primary,
body .ec-regular .ec-blockBtn--action,
body .ec-cartRole__actions .ec-blockBtn--action,
body .ec-orderRole__actions .ec-blockBtn--action,
body .ec-off1Grid .ec-blockBtn--action {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

body .ec-blockBtn--primary:hover,
body .ec-blockBtn--action:hover,
body .ec-blockBtn--primary:focus,
body .ec-blockBtn--action:focus {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

/* リンクの色 */
a,
.ec-itemNav__nav li a,
.ec-footerNavi__link a,
.ec-headerNav__item a {
    color: #6B7280 !important;
}

a:hover,
.ec-itemNav__nav li a:hover,
.ec-footerNavi__link a:hover,
.ec-headerNav__item a:hover {
    color: #4B5563 !important;
}

/* 価格表示 */
.ec-price__price,
.ec-productRole__price,
.ec-cartRow__unitPrice,
.ec-orderDelivery__price,
.ec-cartRole__totalText {
    color: #374151 !important;
}

/* カートアイコンのバッジ */
.ec-cartNaviWrap .ec-cartNavi__badge,
.ec-cartNavi__badge {
    background-color: #374151 !important;
}

/* 商品詳細の選択ボタン */
.ec-select select:focus,
.ec-input input:focus,
.ec-numberInput input:focus {
    border-color: #6B7280 !important;
}

/* チェックボックス、ラジオボタン */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    accent-color: #6B7280 !important;
}

/* ページネーション */
.ec-pagerRole .active span,
.ec-pagerRole__item.active a,
.page-item.active .page-link {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

/* お気に入りアイコン */
.ec-favoriteRole input:checked ~ .ec-favoriteRole__icon,
.ec-favoriteRole__icon.is-active {
    color: #6B7280 !important;
}

/* アラートメッセージ */
.ec-alert--success,
.alert-success {
    background-color: #F3F4F6 !important;
    border-color: #E5E7EB !important;
    color: #374151 !important;
}

/* ヘッダーメニューのアクティブ状態 */
.ec-headerNav__item.active a,
.ec-headerNav__item a:hover {
    color: #4B5563 !important;
    border-bottom-color: #6B7280 !important;
}

/* 商品タグ（セール、新着など） */
.ec-productRole__tags .ec-tag,
.product-tag,
.ec-newItemRole__listItemTitle {
    background-color: #374151 !important;
    color: #FFFFFF !important;
}

/* フォームのフォーカス状態 */
.form-control:focus {
    border-color: #6B7280 !important;
    box-shadow: 0 0 0 0.2rem rgba(107, 114, 128, 0.25) !important;
}

/* 全てのオレンジ色要素を包括的にオーバーライド */

/* ヘッダー関連のオレンジ色 */
.ec-headerTop__link:hover,
.ec-headerLogo a,
.ec-headerActions__link:hover,
.ec-headerNav__categoryList a:hover,
.ec-headerNav__link:hover {
    color: #6B7280 !important;
}

.ec-headerMain {
    border-bottom-color: #6B7280 !important;
}

.ec-headerSearchForm__btn,
.ec-headerSearch__btn,
.ec-headerNav__categoryBtn,
.ec-headerNav__menuItem--buy .ec-headerNav__menuLink {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

.ec-headerSearchForm__btn:hover,
.ec-headerSearch__btn:hover,
.ec-headerNav__categoryBtn:hover,
.ec-headerNav__menuItem--buy .ec-headerNav__menuLink:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
}

/* 商品一覧・商品詳細のオレンジ色 */
.ec-shelfGrid__item:hover {
    border-color: #6B7280 !important;
}

.ec-shelfGrid__stock--few {
    color: #6B7280 !important;
}

.ec-productRole__title {
    border-left-color: #6B7280 !important;
    border-bottom-color: #6B7280 !important;
}

.ec-productRole__btn:hover {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

/* 購入ボタン・アクションボタン */
.ec-blockBtn--buy,
.ec-blockBtn--action,
.ec-cartRow__action .ec-blockBtn,
.ec-shelfRole .ec-blockBtn--action {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

.ec-blockBtn--buy:hover,
.ec-blockBtn--action:hover,
.ec-cartRow__action .ec-blockBtn:hover,
.ec-shelfRole .ec-blockBtn--action:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
}

/* カート関連のボタンと要素 */
.ec-cartTable__action .ec-blockBtn,
.ec-cartRole__actions .ec-blockBtn,
.ec-cartRole__totalText,
.ec-cartNavi__badge,
.ec-cartNavi__price,
.ec-cartRow__action button,
.ec-cartRow__action .ec-blockBtn,
.ec-orderRole__actions .ec-blockBtn,
.ec-orderConfirm__actions .ec-blockBtn,
.ec-orderComplete__actions .ec-blockBtn,
.cart-flow-area .ec-blockBtn,
.ec-cartRole .ec-blockBtn--action,
.ec-cartRole .ec-blockBtn--cancel,
.ec-shoppingRole .ec-blockBtn,
.ec-shoppingRole .ec-blockBtn--action,
.ec-off1Grid .ec-blockBtn,
.ec-off4Grid .ec-blockBtn,
.add-cart,
.add-cart-btn,
button[name="add-cart"],
button.add-cart,
a.add-cart,
.item-detail__add-cart-btn {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

.ec-cartTable__action .ec-blockBtn:hover,
.ec-cartRole__actions .ec-blockBtn:hover,
.ec-cartRow__action button:hover,
.ec-cartRow__action .ec-blockBtn:hover,
.ec-orderRole__actions .ec-blockBtn:hover,
.ec-orderConfirm__actions .ec-blockBtn:hover,
.ec-orderComplete__actions .ec-blockBtn:hover,
.cart-flow-area .ec-blockBtn:hover,
.ec-cartRole .ec-blockBtn--action:hover,
.ec-cartRole .ec-blockBtn--cancel:hover,
.ec-shoppingRole .ec-blockBtn:hover,
.ec-shoppingRole .ec-blockBtn--action:hover,
.ec-off1Grid .ec-blockBtn:hover,
.ec-off4Grid .ec-blockBtn:hover,
.add-cart:hover,
.add-cart-btn:hover,
button[name="add-cart"]:hover,
button.add-cart:hover,
a.add-cart:hover,
.item-detail__add-cart-btn:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

/* カート内の削除ボタン */
.ec-cartRow__action .ec-blockBtn--cancel,
.ec-cartTable__action .ec-blockBtn--cancel {
    background-color: #9CA3AF !important;
    border-color: #9CA3AF !important;
}

.ec-cartRow__action .ec-blockBtn--cancel:hover,
.ec-cartTable__action .ec-blockBtn--cancel:hover {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

/* アラートバナー */
.ec-alertBanner {
    background-color: #6B7280 !important;
}

/* サイドナビゲーション */
.ec-sideNav__list a:hover {
    color: #6B7280 !important;
}

.ec-sideRanking__title,
.ec-sideRanking__list .rank {
    background-color: #6B7280 !important;
}

/* タブ */
.ec-tab {
    border-bottom-color: #6B7280 !important;
}

.ec-tab__item.active {
    color: #6B7280 !important;
    border-bottom-color: #6B7280 !important;
}

/* ページネーション */
.ec-pagerRole__list li.active a,
.ec-pagerRole__list li a:hover {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

/* パンくずリスト */
.ec-topicpath__item:not(:last-child)::after {
    border-color: #6B7280 !important;
}

/* バナー関連 */
.banner-icon-text {
    color: #6B7280 !important;
}

.main_visual_item {
    background: linear-gradient(135deg, #6B7280 0%, #4B5563 100%) !important;
}

.ec-sideBanner__item {
    border-color: #6B7280 !important;
}

.ec-sideBanner__item i,
.ec-bottomBanner__item i {
    color: #6B7280 !important;
}

.ec-sideBanner__link,
.ec-bottomBanner__btn {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
}

.ec-sideBanner__link:hover,
.ec-bottomBanner__btn:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
}

.ec-bottomBanner__item:hover {
    border-color: #6B7280 !important;
}

/* インラインスタイルのオレンジ色も強制的に変更 */
[style*="#ff6600" i],
[style*="#ff4400" i],
[style*="#ff6633" i],
[style*="#ff9900" i],
[style*="#ffa500" i],
[style*="orange" i],
[style*="#DE5D50" i] {
    color: #6B7280 !important;
}

*[style*="background-color: #ff6600" i],
*[style*="background: #ff6600" i],
*[style*="background-color: #ff4400" i],
*[style*="background: #ff4400" i],
*[style*="background-color: #DE5D50" i],
*[style*="background: #DE5D50" i] {
    background-color: #6B7280 !important;
}

*[style*="border-color: #ff6600" i],
*[style*="border: 2px solid #ff6600" i],
*[style*="border-left: 4px solid #ff6600" i],
*[style*="border-bottom: 2px solid #ff6600" i],
*[style*="border-color: #DE5D50" i] {
    border-color: #6B7280 !important;
}

/* EC-CUBEデフォルトのメインカラー（#DE5D50）のオーバーライド */
body .ec-blockBtn--action,
body .ec-blockBtn--primary {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

body .ec-blockBtn--action:hover,
body .ec-blockBtn--action:focus,
body .ec-blockBtn--primary:hover,
body .ec-blockBtn--primary:focus {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

/* すべてのボタンタイプを網羅 */
body [class*="ec-blockBtn"],
body [class*="ec-inlineBtn"],
body .btn-ec-regular,
body .btn-ec-conversion,
body .btn-primary {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

body [class*="ec-blockBtn"]:hover,
body [class*="ec-inlineBtn"]:hover,
body .btn-ec-regular:hover,
body .btn-ec-conversion:hover,
body .btn-primary:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

/* gamekaitori_fix.cssの!importantオーバーライド */
.ec-shelfRole .ec-blockBtn--action {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

.ec-shelfRole .ec-blockBtn--action:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
}

/* カートに追加ボタンの詳細なオーバーライド */
.ec-productRole__btn button,
.ec-productRole .ec-blockBtn,
.ec-shelfGrid .ec-blockBtn,
.ec-shelfGrid__item .ec-blockBtn,
.ec-shelfGrid__item .ec-blockBtn--action,
.ec-shelfGrid__item form button,
.ec-shelfGrid__item form .ec-blockBtn--action,
button.add-cart,
button.ec-blockBtn.ec-blockBtn--action {
    background-color: #6B7280 !important;
    border-color: #6B7280 !important;
    color: #FFFFFF !important;
}

.ec-productRole__btn button:hover,
.ec-productRole .ec-blockBtn:hover,
.ec-shelfGrid .ec-blockBtn:hover,
.ec-shelfGrid__item .ec-blockBtn:hover,
.ec-shelfGrid__item .ec-blockBtn--action:hover,
.ec-shelfGrid__item form button:hover,
.ec-shelfGrid__item form .ec-blockBtn--action:hover,
button.add-cart:hover,
button.ec-blockBtn.ec-blockBtn--action:hover {
    background-color: #4B5563 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

/* モバイル用2列表示 */
@media screen and (max-width: 767px) {
    .ec-shelfGrid .ec-shelfGrid__item {
        width: 50% !important;
        padding: 0 8px;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item:nth-child(odd) {
        padding-right: 8px;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item:nth-child(even) {
        padding-left: 8px;
    }
    
    /* 商品画像のサイズ調整 */
    .ec-shelfGrid .ec-shelfGrid__item-image img {
        width: 100%;
        height: auto;
        max-height: 200px;
        object-fit: contain;
    }
    
    /* テキストサイズの調整 */
    .ec-shelfGrid .ec-shelfGrid__item p {
        font-size: 14px;
        line-height: 1.4;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item .price02-default {
        font-size: 16px;
        font-weight: bold;
    }
}
