/*
 * Storefront skin: China Mall (chinamall)
 * 暖橙 App 风：白色顶部与胶囊搜索框、圆角分类图标格、
 * 橙色价格、底部导航橙色高亮。风格参考移动端商城 App 首页。
 * Scope: body.ui-skin-chinamall
 */

body.ui-skin-chinamall {
    --cm-primary: #ff6a00;
    --cm-primary-dark: #e85c00;
    --cm-primary-soft: #fff1e6;
    --cm-accent: #ff3b30;
    --cm-price: #ff4d1a;
    --cm-radius: 14px;
    --ui-primary: #ff6a00;
    --ui-primary-dark: #e85c00;

    background: #f8f8f9;
}

/* ===== 移动端顶部：白底（logo 自身是白底图，白底头部不会突兀） ===== */
body.ui-skin-chinamall .flex.flex-wrap.gap-4.px-4.pb-4.shadow-sm {
    background: #ffffff;
    border-bottom: none;
    box-shadow: none;
}

/* 移动端的外层 <header> 也带 .sticky.top-0.bg-white.shadow-sm，
   会命中下面的桌面规则；这里用更高特异性换成一条更浅更细的分隔线。 */
@media (max-width: 1023.98px) {
    body.ui-skin-chinamall header.sticky.top-0.bg-white.shadow-sm {
        border-bottom: 1px solid #ffe4d3;
    }
}

body.ui-skin-chinamall .flex.flex-wrap.gap-4.px-4.pb-4.shadow-sm [class*="icon-"] {
    color: var(--cm-primary);
}

body.ui-skin-chinamall form[action*="/search"] input[name="query"] {
    background: var(--cm-primary-soft);
    border: 1px solid #ffe0c8;
    border-radius: 999px;
    box-shadow: none;
    color: #3f3f46;
}

body.ui-skin-chinamall form[action*="/search"] input[name="query"]::placeholder {
    color: #a1a1aa;
}

body.ui-skin-chinamall form[action*="/search"] .icon-search {
    color: var(--cm-primary);
}

/* ===== 桌面头部 ===== */
body.ui-skin-chinamall .sticky.top-0.bg-white.shadow-sm {
    background: #ffffff;
    border-bottom: 2px solid var(--cm-primary);
    box-shadow: none;
}

body.ui-skin-chinamall .icon-search {
    color: var(--cm-primary);
}

body.ui-skin-chinamall .sticky.top-0.bg-white .uppercase:hover {
    color: var(--cm-primary);
}

/* ===== 分类图标网格：移动端 4 列、圆角方块 ===== */
@media (max-width: 767px) {
    body.ui-skin-chinamall .cat-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }
}

body.ui-skin-chinamall .cat-card {
    gap: 8px;
    padding: 6px 2px;
    font-size: 12px;
    font-weight: 600;
    color: #3f3f46;
}

body.ui-skin-chinamall .cat-card__icon {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(255, 106, 0, .20);
}

body.ui-skin-chinamall .cat-card__icon svg {
    width: 26px;
    height: 26px;
}

body.ui-skin-chinamall .cat-card--cooling  .cat-card__icon { background: linear-gradient(160deg, #ff9a3c, #ff6a00); }
body.ui-skin-chinamall .cat-card--kitchen  .cat-card__icon { background: linear-gradient(160deg, #ff7a5c, #ff3b30); }
body.ui-skin-chinamall .cat-card--cleaning .cat-card__icon { background: linear-gradient(160deg, #ffb04d, #ff8a00); }
body.ui-skin-chinamall .cat-card--garment  .cat-card__icon { background: linear-gradient(160deg, #ff6b8a, #ff2d55); }
body.ui-skin-chinamall .cat-card--air      .cat-card__icon { background: linear-gradient(160deg, #ff8a3d, #ff5e00); }
body.ui-skin-chinamall .cat-card--water    .cat-card__icon { background: linear-gradient(160deg, #ffa14d, #ff6a00); }

/* ===== 首页轮播 ===== */
body.ui-skin-chinamall .promo-carousel {
    border-radius: var(--cm-radius);
    overflow: hidden;
}

body.ui-skin-chinamall .promo-slide__btn {
    background: var(--cm-primary);
    border-radius: 999px;
}

body.ui-skin-chinamall .promo-slide:hover .promo-slide__btn {
    background: var(--cm-primary-dark);
}

body.ui-skin-chinamall .promo-dot[aria-current="true"] {
    background: var(--cm-primary);
}

/* ===== 限时特惠条 ===== */
body.ui-skin-chinamall .flash-sale {
    background: linear-gradient(135deg, #fff3e8, #ffe0c7);
    border-color: #ffd0a8;
}

body.ui-skin-chinamall .flash-sale__title,
body.ui-skin-chinamall .flash-card__price {
    color: var(--cm-price);
}

body.ui-skin-chinamall .flash-sale__timer span {
    background: var(--cm-primary);
}

body.ui-skin-chinamall .flash-card {
    box-shadow: 0 2px 8px rgba(255, 106, 0, .10);
}

body.ui-skin-chinamall .flash-card__off {
    background: var(--cm-accent);
}

/* ===== 分类 Tab 条 ===== */
body.ui-skin-chinamall .home-tab.is-active {
    background: var(--cm-primary);
    border-color: var(--cm-primary);
    color: #ffffff;
}

/* ===== 商品卡片与价格 ===== */
body.ui-skin-chinamall main a.rounded-xl.border {
    border-color: #ffffff;
    background: #ffffff;
    border-radius: var(--cm-radius);
    box-shadow: 0 2px 10px rgba(24, 24, 27, .06);
    transition: box-shadow .2s ease, transform .2s ease;
}

body.ui-skin-chinamall main a.rounded-xl.border:hover {
    border-color: #ffe2cc;
    box-shadow: 0 6px 20px rgba(255, 106, 0, .18);
    transform: translateY(-2px);
}

body.ui-skin-chinamall main .text-red-600,
body.ui-skin-chinamall main .mt-1.text-sm.font-semibold.text-zinc-600,
body.ui-skin-chinamall main .text-base.font-semibold.text-navyBlue {
    color: var(--cm-price);
    font-weight: 700;
}

/* 分类页 / 搜索页 / 商品页的价格（原价删除线保持灰色） */
body.ui-skin-chinamall .final-price:not(.line-through) {
    color: var(--cm-price);
    font-weight: 700;
}

/* ===== 按钮 ===== */
body.ui-skin-chinamall .primary-button {
    background-color: var(--cm-primary);
    border-color: var(--cm-primary);
    border-radius: 999px;
}

body.ui-skin-chinamall .primary-button:hover {
    background-color: var(--cm-primary-dark);
    border-color: var(--cm-primary-dark);
    opacity: 1;
}

body.ui-skin-chinamall .secondary-button {
    background-color: #ffffff;
    border-color: var(--cm-primary);
    color: var(--cm-primary);
    border-radius: 999px;
}

body.ui-skin-chinamall .secondary-button:hover {
    background-color: var(--cm-primary-soft);
}

/* ===== services 条 / 页脚 ===== */
body.ui-skin-chinamall .bg-navyBlue {
    background-color: var(--cm-primary-soft);
}

body.ui-skin-chinamall .bg-navyBlue .text-white {
    color: #7a3b00;
}

body.ui-skin-chinamall .icon-truck.border-black,
body.ui-skin-chinamall .icon-product.border-black,
body.ui-skin-chinamall .icon-dollar-sign.border-black,
body.ui-skin-chinamall .icon-support.border-black {
    border-color: var(--cm-primary);
    color: var(--cm-primary);
}

/* 页脚：纯白底（浅橙底在个人中心等空白较多的页面显得发黄），
   版权条与 newsletter 头部原本也是米黄 `#F1EADF`，一并转白。 */
body.ui-skin-chinamall footer.bg-lightOrange {
    background-color: #ffffff;
    border-top: 1px solid #f1f1f3;
}

body.ui-skin-chinamall footer [class*="bg-[#F1EADF]"] {
    background-color: #ffffff;
}

/* ===== 移动端底部导航：白底 + 选中橙色 ===== */
body.ui-skin-chinamall nav.fixed.inset-x-0.bottom-0 {
    background: #ffffff;
    border-top: none;
    box-shadow: 0 -2px 14px rgba(24, 24, 27, .08);
}

body.ui-skin-chinamall nav.fixed.inset-x-0.bottom-0 a.is-current {
    color: var(--cm-primary);
}

body.ui-skin-chinamall nav.fixed.inset-x-0.bottom-0 a.is-current span {
    color: var(--cm-primary);
}