/* =============================================
   Dicca Project: Final Design Fix (No Omissions)
   Target: カート色・オレンジ背景排除・明朝体・ボタン配置修正
   ============================================= */

/* 1. サイト全体の基底：明朝体 & 生成り */
html, body, .ecommerce, .ecommerce .header {
    background-color: #fffdf5 !important;
    color: #5d4a37 !important;
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", serif !important;
}

/* 全テキスト要素を明朝体に強制（アイコン用フォント以外） */
h1, h2, h3, h4, h5, h6, a, span:not(.fa), p, div, li, strong, em, input, button, label {
    font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "MS PMincho", serif !important;
}

/* 2. ヘッダー：上下中央揃え & 強制背景 */
.header {
    background-color: #f2ede0 !important;
    border-bottom: 2px solid #dcd5c0 !important;
    padding: 10px 0 !important;
    min-height: 90px;
}

    /* 3. ショッピングカート周りの完全上書き（色：ローストブラウン） */
    .header .top-cart-block .fa-shopping-cart,
    .header .top-cart-block .cart,
    .header .top-cart-block a.cart,
    .header .top-cart-block i.cart {
        display: inline-block !important;
        font-family: FontAwesome !important;
        color: #8b6d4d !important;
        font-size: 32px !important;
        visibility: visible !important;
        text-decoration: none !important;
        background: transparent !important;
    }

    /* カートの個数バッジ */
    .header .top-cart-block .top-cart-info-count {
        background: #8b6d4d !important;
        color: #f2ede0 !important;
        font-size: 16px !important;
        font-weight: bold !important;
        padding: 2px 10px !important;
        border-radius: 20px !important;
        border: none !important;
        animation: bounce 2s infinite;
    }

/* ★カート展開後のドロップダウン内ボタンのズレ修正 */
.top-cart-content {
    background: #fffdf5 !important;
    border: 1px solid #d2b48c !important;
}

    .top-cart-content .text-right {
        display: flex !important;
        flex-wrap: nowrap !important; /* 折り返し禁止 */
        justify-content: space-between !important;
        gap: 4px !important; /* ボタン同士の隙間 */
        padding: 10px !important;
    }

    .top-cart-content .btn {
        flex: 1 !important; /* 均等に幅を取る */
        padding: 8px 4px !important; /* パディングを絞って1行に収める */
        font-size: 11px !important;
        margin: 0 !important;
        min-width: 0 !important; /* 幅の制限を解除 */
        white-space: nowrap !important;
    }

/* 4. カルーセル：オレンジ背景を「根絶」する */
.carousel-inner .carousel-title-v1,
.carousel-inner .carousel-title-v2,
.carousel-inner .carousel-title-v3,
.carousel-inner .carousel-subtitle-v1,
.carousel-inner .carousel-subtitle-v2,
.carousel-inner .carousel-subtitle-v3,
.carousel-inner .carousel-subtitle-v4,
.carousel-inner h2,
.carousel-inner p,
.carousel-inner span,
.carousel-inner .title_orign,
.title-wrapper {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 5. ボタンデザイン：共通ブラウンに統一 */
.ai-entry-large,
.btn-primary,
.add2cart,
.product-item .btn-default:hover,
.shopping-cart-data .btn-primary,
.my-btn,
.btn-danger,
.btn-info {
    display: inline-block !important;
    padding: 10px 22px !important;
    background: linear-gradient(135deg, #b08d6d, #8b6d4d) !important;
    color: #fffdf5 !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    font-size: 14px !important;
    border: 1px solid #7a5f45 !important;
    text-align: center;
}

/* 6. AIのひとこと（bg-primary） */
.bg-primary {
    background-color: #fdfaf2 !important;
    color: #5d4a37 !important;
    border: 1px solid #e0dbca !important;
    padding: 12px !important;
}

/* 7. レイアウト：上下中央揃えの再強化 */
.header .container > .row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* 8. アニメーション */
@keyframes pulse-ai {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.03);
    }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-4px);
    }

    60% {
        transform: translateY(-2px);
    }
}

/* スマホ対応 */
@media (max-width: 767px) {
    .header .container > .row {
        flex-wrap: wrap !important;
    }

    .header-ai-btn-area {
        width: 100%;
        text-align: center;
        margin: 10px 0;
    }

    .top-cart-block {
        width: 100%;
        justify-content: center !important;
    }
}