/* ==========================================================================
   速科主题 · 导航标签样式统一调节文件（tag-style.css）
   --------------------------------------------------------------------------
   本文件是「标签样式」的唯一调节入口：改下面的数值即可，不需要动其它文件。
   默认值 = 修改前线上实际效果（视觉零变化），可直接覆盖为你想设置的值。
   生效范围：
     1) 手机端菜单（menuB，当前生效）的标签  —— 截图红框位置
     1b) 手机端菜单（menuA，切换布局后生效）的标签
     2) 桌面端「产品与服务」下拉·精选推荐标签
     3) 桌面端「产品与服务」下拉·普通推荐标签
     4) 桌面端「产品与服务」下拉·商品子项标签
     5) 桌面端二级/三级菜单标签
     6) 顶栏导航标签（实心色块）
   --------------------------------------------------------------------------
   颜色叠加规则：
     后台「菜单编辑 → 精选产品」里给某条目设了「标签颜色」时，
     该条目的边框色 + 文字颜色以内联样式优先（覆盖本文件里的默认色）。
     未设置时使用本文件里的 --hm-xxx-border-color / --hm-xxx-color。
   --------------------------------------------------------------------------
   排序说明：
     标签/条目的出现顺序由后台「菜单编辑 → 精选产品」表格的「排序」决定，
     属于数据顺序，CSS 无法重排（如需调整请在该表格里拖动排序）。
   ========================================================================== */

:root {
    /* ---------- 1. 手机端菜单（menuB）标签 ---------- */
    --hm-mtag-radius: 20px;              /* 边框圆角 */
    --hm-mtag-border-width: 1px;         /* 边框粗细 */
    --hm-mtag-border-color: #eb262d;     /* 边框颜色 */
    --hm-mtag-color: #eb262d;            /* 文字颜色 */
    --hm-mtag-font-size: 12px;           /* 文字大小 */
    --hm-mtag-font-weight: 700;          /* 文字粗细（400/500/700） */
    --hm-mtag-letter-spacing: normal;    /* 文字间距（如 0.5px / 1px） */
    --hm-mtag-padding-top: 0px;          /* 内边距-上 */
    --hm-mtag-padding-right: 6px;        /* 内边距-右 */
    --hm-mtag-padding-bottom: 0px;       /* 内边距-下 */
    --hm-mtag-padding-left: 6px;         /* 内边距-左 */
    --hm-mtag-margin-left: 12px;         /* 与产品名称的间隔 */
    --hm-mtag-line-height: 14px;         /* 行高 */
    --hm-mtag-bg: transparent;           /* 标签背景色（默认透明） */
    --hm-mtag-right-gap: 12px;          /* 移动端标签「统一靠右对齐」时的右边距（后台开关开启后生效） */

    /* 手机端菜单（menuA）标签：仅在后台切换为 A 布局时生效 */
    --hm-mtag-a-radius: 0px;
    --hm-mtag-a-font-weight: inherit;
    --hm-mtag-a-padding-top: 2px;
    --hm-mtag-a-padding-right: 2px;
    --hm-mtag-a-padding-bottom: 2px;
    --hm-mtag-a-padding-left: 2px;

    /* ---------- 2. 桌面端下拉 · 精选推荐标签 ---------- */
    --hm-dtag-hot-radius: 0px;
    --hm-dtag-hot-border-width: 1px;
    --hm-dtag-hot-border-color: #FF9800;
    --hm-dtag-hot-color: #FF9800;
    --hm-dtag-hot-font-size: 12px;
    --hm-dtag-hot-font-weight: 500;
    --hm-dtag-hot-letter-spacing: normal;
    --hm-dtag-hot-padding-top: 0px;
    --hm-dtag-hot-padding-right: 6px;
    --hm-dtag-hot-padding-bottom: 0px;
    --hm-dtag-hot-padding-left: 6px;
    --hm-dtag-hot-margin-left: 8px;
    --hm-dtag-hot-bg: transparent;       /* 标签背景色（默认透明） */

    /* ---------- 3. 桌面端 · 普通推荐标签 ---------- */
    --hm-dtag-radius: 0px;
    --hm-dtag-border-width: 1px;
    --hm-dtag-border-color: #ff2626;
    --hm-dtag-color: #ff2626;
    --hm-dtag-font-size: 12px;
    --hm-dtag-font-weight: inherit;      /* 默认继承父级（与改版前一致） */
    --hm-dtag-letter-spacing: normal;
    --hm-dtag-padding-top: 1px;
    --hm-dtag-padding-right: 4px;
    --hm-dtag-padding-bottom: 1px;
    --hm-dtag-padding-left: 4px;
    --hm-dtag-margin-left: 8px;
    --hm-dtag-bg: transparent;           /* 标签背景色（默认透明） */

    /* ---------- 5. 桌面端二级/三级菜单标签 ---------- */
    --hm-stag-radius: 20px;
    --hm-stag-border-width: 1px;
    --hm-stag-border-color: #ff2626;
    --hm-stag-color: #ff2626;
    --hm-stag-font-size: 12px;
    --hm-stag-font-weight: bold;
    --hm-stag-letter-spacing: normal;
    --hm-stag-padding-top: 0px;
    --hm-stag-padding-right: 6px;
    --hm-stag-padding-bottom: 0px;
    --hm-stag-padding-left: 6px;
    --hm-stag-margin-left: 8px;
    --hm-stag-bg: transparent;           /* 标签背景色（默认透明） */

    /* ---------- 4. 桌面端下拉 · 商品子项标签（tagline） ---------- */
    --hm-ptag-radius: 20px;
    --hm-ptag-font-weight: bold;
    --hm-ptag-padding-top: 0px;
    --hm-ptag-padding-right: 6px;
    --hm-ptag-padding-bottom: 0px;
    --hm-ptag-padding-left: 6px;

    /* ---------- 6. 顶栏导航标签（实心色块） ---------- */
    --hm-ntag-bg: #ff2626;               /* 底色（条目自带标签颜色时以内联为准） */
    --hm-ntag-color: #fff;               /* 文字颜色 */
    --hm-ntag-radius: 6px;
    --hm-ntag-bottom-left-radius: 0;
    --hm-ntag-font-size: 10px;
    --hm-ntag-font-weight: bold;
    --hm-ntag-letter-spacing: normal;
    --hm-ntag-padding-top: 2px;
    --hm-ntag-padding-right: 5px;
    --hm-ntag-padding-bottom: 2px;
    --hm-ntag-padding-left: 5px;
    --hm-ntag-border-width: 0px;
    --hm-ntag-border-color: #ff2626;
    --hm-ntag-font-family: "Bodrum";
    --hm-ntag-line-height: 10px;
}

/* ==========================================================================
   1) 手机端菜单（menuB）标签
   ========================================================================== */
.nav-head-m .nav-list.menuB .label-tag {
    margin-left: var(--hm-mtag-margin-left);
    border: var(--hm-mtag-border-width) solid var(--hm-mtag-border-color);
    color: var(--hm-mtag-color);
    font-size: var(--hm-mtag-font-size);
    font-weight: var(--hm-mtag-font-weight);
    letter-spacing: var(--hm-mtag-letter-spacing);
    line-height: var(--hm-mtag-line-height);
    padding: var(--hm-mtag-padding-top) var(--hm-mtag-padding-right) var(--hm-mtag-padding-bottom) var(--hm-mtag-padding-left);
    border-radius: var(--hm-mtag-radius);
    background-color: var(--hm-mtag-bg, transparent);
    font-family: "codeB";
}

/* 标签内文字被 <strong> 包裹，需让字重跟随变量（否则永远加粗） */
.nav-head-m .nav-list.menuB .label-tag strong {
    font-weight: var(--hm-mtag-font-weight);
}

/* 手机端菜单（menuA）标签：后台切换为 A 布局时生效，默认值保持原样 */
.nav-head-m .nav-list.menuA .label-tag {
    margin-left: var(--hm-mtag-margin-left);
    border: var(--hm-mtag-border-width) solid var(--hm-mtag-border-color);
    color: var(--hm-mtag-color);
    font-size: var(--hm-mtag-font-size);
    font-weight: var(--hm-mtag-a-font-weight);
    letter-spacing: var(--hm-mtag-letter-spacing);
    line-height: var(--hm-mtag-line-height);
    padding: var(--hm-mtag-a-padding-top) var(--hm-mtag-a-padding-right) var(--hm-mtag-a-padding-bottom) var(--hm-mtag-a-padding-left);
    border-radius: var(--hm-mtag-a-radius);
    background-color: var(--hm-mtag-bg, transparent);
    font-family: "codeB";
}

/* ==========================================================================
   2) 桌面端下拉 · 精选推荐标签
   ========================================================================== */
.Submenu-container.product_services .recommend-product .recommend-product-hot .recommend-hot-content .recommend-hot-product-title .recommend-hot-product-label {
    color: var(--hm-dtag-hot-color);
    font-size: var(--hm-dtag-hot-font-size);
    font-weight: var(--hm-dtag-hot-font-weight);
    letter-spacing: var(--hm-dtag-hot-letter-spacing);
    border: var(--hm-dtag-hot-border-width) solid var(--hm-dtag-hot-border-color);
    margin-left: var(--hm-dtag-hot-margin-left);
    padding: var(--hm-dtag-hot-padding-top) var(--hm-dtag-hot-padding-right) var(--hm-dtag-hot-padding-bottom) var(--hm-dtag-hot-padding-left);
    border-radius: var(--hm-dtag-hot-radius);
    background-color: var(--hm-dtag-hot-bg, transparent);
}

/* ==========================================================================
   3) 桌面端下拉 · 普通推荐标签
   ========================================================================== */
.Submenu-container.product_services .recommend-product .recommend-product-ordinary .recommend-product-content .recommend-product-label {
    white-space: nowrap;
    color: var(--hm-dtag-color);
    font-size: var(--hm-dtag-font-size);
    font-weight: var(--hm-dtag-font-weight);
    letter-spacing: var(--hm-dtag-letter-spacing);
    border: var(--hm-dtag-border-width) solid var(--hm-dtag-border-color);
    margin-left: var(--hm-dtag-margin-left);
    padding: var(--hm-dtag-padding-top) var(--hm-dtag-padding-right) var(--hm-dtag-padding-bottom) var(--hm-dtag-padding-left);
    border-radius: var(--hm-dtag-radius);
    background-color: var(--hm-dtag-bg, transparent);
}

/* ==========================================================================
   4) 桌面端下拉 · 商品子项标签（tagline）
   ========================================================================== */
.Submenu-container.product_services .menu-product-content .Submenu-middle-product .Submenu-product-content-list .list-product-content .list-product-title .list-product-hot {
    color: var(--hm-dtag-color);
    font-size: var(--hm-dtag-font-size);
    font-weight: var(--hm-ptag-font-weight);
    letter-spacing: var(--hm-dtag-letter-spacing);
    border: var(--hm-dtag-border-width) solid var(--hm-dtag-border-color);
    margin-left: var(--hm-dtag-margin-left);
    padding: var(--hm-ptag-padding-top) var(--hm-ptag-padding-right) var(--hm-ptag-padding-bottom) var(--hm-ptag-padding-left);
    border-radius: var(--hm-ptag-radius);
    background-color: var(--hm-dtag-bg, transparent);
}

/* ==========================================================================
   5) 桌面端 · 二级/三级菜单标签
   ========================================================================== */
.Submenu-container .Submenu-middle-content .Submenu-item .Submenu-item-title .Submenu-tag {
    color: var(--hm-stag-color);
    font-size: var(--hm-stag-font-size);
    font-weight: var(--hm-stag-font-weight);
    letter-spacing: var(--hm-stag-letter-spacing);
    border: var(--hm-stag-border-width) solid var(--hm-stag-border-color);
    margin-left: var(--hm-stag-margin-left);
    padding: var(--hm-stag-padding-top) var(--hm-stag-padding-right) var(--hm-stag-padding-bottom) var(--hm-stag-padding-left);
    border-radius: var(--hm-stag-radius);
    background-color: var(--hm-stag-bg, transparent);
}

/* ==========================================================================
   6) 顶栏导航标签（实心色块）
   ========================================================================== */
.horizontal-menu-navbar .horizontal-menu-navbar-container .horizontal-container-navbar .horizontal-menu-navbar-menu-container .horizontal-menu-navbar-menu li a .navbar-menu-tag i {
    padding: var(--hm-ntag-padding-top) var(--hm-ntag-padding-right) var(--hm-ntag-padding-bottom) var(--hm-ntag-padding-left);
    box-shadow: 2px 2px 4px 0 rgba(55, 99, 170, 0.31);
    background: var(--hm-ntag-bg);
    border: var(--hm-ntag-border-width) solid var(--hm-ntag-border-color);
    border-radius: var(--hm-ntag-radius);
    border-bottom-left-radius: var(--hm-ntag-bottom-left-radius);
    color: var(--hm-ntag-color);
    font-weight: var(--hm-ntag-font-weight);
    letter-spacing: var(--hm-ntag-letter-spacing);
    font-family: var(--hm-ntag-font-family);
    font-style: normal;
    font-size: var(--hm-ntag-font-size);
    line-height: var(--hm-ntag-line-height);
}
/* ==========================================================================
   7) 移动端商品组 / 商品名称前的国旗（后台开关：菜单设置 → 移动端商品组国旗）
      由 static/script/mobile-flag.js 依据后台「系统产品 → 产品地区」配置注入
      <img class="hm-flag">（图片用后台同一套 /upload/common/country/{CODE}.png），
      仅出现在移动端右侧商品组列表内，一级分组与 PC 端均不显示。
   ========================================================================== */
.hm-flag {
    display: inline-block;
    height: 14px;
    width: auto;
    max-width: 26px;
    margin-right: 6px;
    border-radius: 2px;
    object-fit: contain;
    vertical-align: -2px;
    align-self: center;
    flex: 0 0 auto;
    box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.12);
}