body {
  background-color: #eff2f6;
}
.bg-color {
  background: #996699;
  color: #ffffff;
}

.header-box {
  box-shadow: rgba(142, 142, 142, 0.1) 0 6px 15px 0;
  -webkit-box-shadow: rgba(142, 142, 142, 0.1) 0 6px 15px 0;
  border-top-width: 2px;
  border-top-style: solid;
  border-top-color: #996699;
  padding-top: 10px;
  padding-bottom: 10px;
}

.header-box .layui-container {
  display: flex;
  align-items: center; /* 垂直居中 */
  height: 100%;
}

.logo img {
  height: 50px;
}

.MobilemenuBtn {
  display: none;
}

.layui-nav,
.header-box {
  background-color: #fff;
}
.layui-nav .layui-nav-item a {
  color: #222222;
}
.layui-nav .layui-nav-item a:hover,
.layui-tabs-header .layui-this,
.layui-tabs-header li:hover,
.layui-tab-brief > .layui-tab-title .layui-this {
  color: #996699;
}

.layui-nav .layui-this:after,
.layui-nav-bar,
.layui-nav-tree .layui-nav-child dd.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this a,
.layui-nav-tree .layui-this,
.layui-nav-tree .layui-this > a,
.layui-nav-tree .layui-this > a:hover {
  color: #ffffff;
  background-color: #996699;
}

.layui-nav-tree .layui-nav-bar {
  background-color: #c776c7;
}

.nav-avatar img {
  width: 30px;
  border-radius: 50%;
}

/*Tabs 导航滑块颜色*/
.layui-tabs-header .layui-this:after,
.layui-tab-brief > .layui-tab-more li.layui-this:after,
.layui-tab-brief > .layui-tab-title .layui-this:after {
  border-color: #996699;
}

/* 移动端个人中心导航*/
.user-menu-wrapper {
  position: relative;
  z-index: 999;
  display: none;
}

.user-menu-wrapper .layui-nav-child {
  background-color: #fff;
}

.user-menu-float {
  position: absolute;
  right: 0;
  top: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  z-index: 999;
  width: 200px;
  border-radius: 4px;
  overflow: hidden;
}

/* 基础图标样式 */
.custom-icon {
  display: inline-block;
  width: 1.2em; /* 大小与文字一致 */
  height: 1.2em;
  margin-right: 2px;
  background-color: currentColor; /* 跟随文字颜色 */

  mask-repeat: no-repeat;
  mask-size: contain;
  mask-position: center;

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  -webkit-mask-position: center;

  vertical-align: text-bottom; /* 精准对齐文字底部 */
}

/* 每个图标使用自己的 SVG mask */
.icon-info {
  mask-image: url("/images/icons/info.svg");
  -webkit-mask-image: url("/images/icons/info.svg");
}

.icon-shop {
  mask-image: url("/images/icons/shop.svg");
  -webkit-mask-image: url("/images/icons/shop.svg");
}

.icon-publish {
  mask-image: url("/images/icons/publish.svg");
  -webkit-mask-image: url("/images/icons/publish.svg");
}

.icon-vip {
  mask-image: url("/images/icons/vip.svg");
  -webkit-mask-image: url("/images/icons/vip.svg");
}

.icon-area {
  mask-image: url("/images/icons/area.svg");
  -webkit-mask-image: url("/images/icons/area.svg");
}

.icon-bao {
  mask-image: url("/images/icons/bao.svg");
  -webkit-mask-image: url("/images/icons/bao.svg");
}

.icon-user {
  mask-image: url("/images/icons/user.svg");
  -webkit-mask-image: url("/images/icons/user.svg");
}

.icon-time {
  mask-image: url("/images/icons/time.svg");
  -webkit-mask-image: url("/images/icons/time.svg");
}

.icon-eye {
  mask-image: url("/images/icons/eye.svg");
  -webkit-mask-image: url("/images/icons/eye.svg");
}
.icon-notice {
  mask-image: url("/images/icons/notice.svg");
  -webkit-mask-image: url("/images/icons/notice.svg");
}

/* 中间搜索框向右移动（靠近右侧） */
.nav-search-box {
  margin-left: 10px; /* 让它自动挤到最右边 */
  margin-right: 10px; /* 与登录按钮有点间距 */
  display: flex;
  align-items: center;
}

/* 保持搜索输入样式 */
.layui-input-search {
  height: 32px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

/* 搜索按钮 */
.nav-search-box .layui-btn {
  height: 32px;
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  padding: 0 10px;
  line-height: 32px;
}

/* 公告样式 */
.notice-box {
  background-color: rgba(41, 151, 247, 0.1);
  color: #2997f7;
  padding: 8px 12px;
  margin-bottom: 10px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  font-size: 14px;
  max-width: 100%;
  overflow: hidden;
}

.notice-box i {
  margin-right: 8px;
  font-size: 16px;
}

.notice-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.3s;
}

.notice-text.expanded {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

.notice-toggle {
  margin-left: 10px;
  color: #328ad7;
  cursor: pointer;
  flex-shrink: 0;
}

/* 地区选择样式*/
.region-item {
  display: inline-block;
  margin: 4px 6px;
  padding: 4px 10px;
  border-radius: 12px;
  text-decoration: none;
  color: #333;
  background-color: #f5f5f5;
  cursor: pointer;
  transition: all 0.3s;
}

.region-item:hover {
  background-color: #e2e2e2;
}

.region-item.active {
  background-color: #996699;
  color: white;
  border-radius: 16px;
}

/* 列表卡片 */
.card-listbox {
  padding: 0px;
}

.card-listbox .layui-card {
  margin: 5px 0;
}

.custom-card {
  display: flex;
  height: 200px;
  padding: 10px;
  border: 1px solid #eee;
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  background-color: #fff;
  box-sizing: border-box;
}

.card-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

.card-title h3 {
  font-weight: bold;
  font-size: 16px;
  white-space: nowrap; /* 不换行 */
  overflow: hidden; /* 超出隐藏 */
  text-overflow: ellipsis; /* 显示省略号 */
  margin: 0;
}

.card-desc {
  color: #666;
  line-height: 1.6;
  height: 70px; /* 3行 * 1.5 * 13px ≈ 60px */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.card-meta {
  color: #666;
}

.card-location {
  color: #996699;
  margin-top: 3px;
}

.card-image {
  width: 100px;
  margin-left: 10px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}

/* 底部版权*/
.custom-footer {
  text-align: center;
  font-size: 14px;
  color: #d2dbe6;
  margin: 10px auto;
}

/* 详情图片样式*/
#image-container img {
  width: 100%;
  aspect-ratio: 3 / 4; /* 宽:高为 3:4，即竖图 */
  object-fit: cover;
  border-radius: 8px;
  cursor: pointer;
  display: block;
}

/* 详情表单信息*/
.form-row {
  display: flex;
  border: 1px solid #eee;
  border-radius: 2px;
  overflow: hidden;
  font-size: 14px;
  width: 100%;
}

.form-label {
  background-color: #f8f8f8;
  white-space: nowrap;
  width: 80px;
  color: #333;
  border-right: 1px solid #eee;
  flex-shrink: 0;
  text-align: right;
  padding-top: 10px;
  padding-right: 5px;
  padding-bottom: 10px;
}

.form-value {
  padding: 10px 12px;
  color: #000;
  flex: 1;
  word-break: break-all;
}

/* 详情介绍*/
#introduce {
  background-color: #f8f8f8;
  padding: 10px;
  border-radius: 8px;
  max-width: 100%;
}

.detail-text {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.detail-expanded .detail-text {
  -webkit-line-clamp: unset;
  overflow: visible;
}

#detailToggle {
  display: inline-block;
  margin-top: 8px;
  color: #328ad7;
  cursor: pointer;
}

/*收藏、举报*/
.action-bar a {
  color: #996699;
  margin-right: 16px;
  text-decoration: none;
  font-size: 14px;
}

.action-bar a i {
  margin-right: 4px;
  font-weight: bold;
}

/* 举报弹窗 */
#report {
  max-width: 600px;
  padding: 10px;
}
#report p {
  line-height: 30px;
}

/* 批量修改弹窗 */
#batch {
  max-width: 500px;
  padding: 10px;
}

/*订单提交弹窗*/
#pay-popup {
  max-width: 500px;
  padding: 10px;
}

/*提问详情弹窗*/
#feedbackDetail {
  max-width: 600px;
  padding: 15px;
}

#fd-question,
#fd-reply {
  background-color: #f8f8f8;
  padding: 10px;
  border-radius: 4px;
  margin-top: 5px;
}

/* 支付弹窗样式 */
#amountLabel {
  color: red;
  font-weight: bold;
  font-size: 18px;
  position: relative;
  top: 1px;
}

.pay-type-options {
  display: flex;
  gap: 20px;
  margin-top: 10px;
  justify-content: center;
}

.pay-icon {
  width: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f5f5f5;
  border-radius: 8px;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border 0.3s, box-shadow 0.3s;
  padding: 10px 0px;
}

.pay-icon.active {
  border: 2px solid #996699;
  box-shadow: 0 0 6px rgba(153, 102, 153, 0.3);
  background-color: #fff;
}

.pay-icon img {
  width: 28px;
  height: 28px;
  margin-right: 8px;
}

.pay-icon .label {
  font-size: 14px;
  color: #333;
}

/* 发布规范弹窗*/
#rules {
  display: none;
  box-shadow: none;
  padding: 10px;
  color: #555;
}

/*复制文本样式*/
.copy-item {
  cursor: pointer;
  transition: color 0.2s;
}

.copy-item:hover {
  color: #996699;
}

/* 我的发布卡片样式 */
.my-post-card {
  height: 230px;
  display: flex;
  padding: 10px;
  border: 1px solid #eee;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  font-size: 14px;
  overflow: hidden;
  box-sizing: border-box;
}

.my-post-img {
  width: 150px;
  overflow: hidden;
  flex-shrink: 0;
  margin-right: 10px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.my-post-img img {
  height: 100%;
  width: auto;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

/* 右侧内容 */
.my-post-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
}

/* 标题：一行省略号 */
.my-post-title {
  font-weight: bold;
  font-size: 16px;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* 标签（个人 / 商家） */
.my-post-tags {
  font-size: 14px;
  color: #888;
}

/* 描述最多显示两行 */
.my-post-reason {
  font-size: 14px;
  color: #999;
  line-height: 1.5;
  height: 3em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.my-post-meta {
  display: flex;
  flex-direction: column; /* 垂直排列，每个字段一行 */
  overflow: hidden;
}

.my-post-meta div {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 14px;
  color: #555;
}

/* 发布状态 */
.my-post-status {
  font-size: 14px;
  font-weight: bold;
}

.my-post-status.success {
  color: #16b777;
}

.my-post-status.fail {
  color: #ff5722;
}

.my-post-status.wait {
  color: #1e9fff;
}

/* 操作按钮区域 */
.my-post-actions {
  margin-top: 5px;
}

/* 手机模式适配 */
@media screen and (max-width: 768px) {
  .layui-header {
    padding-top: 0;
    padding-bottom: 0;
  }

  #menu-box,
  .nav-search-box,
  #user-nav-pc {
    display: none;
  }

  .header-box .logo {
    margin: auto;
  }

  .MobilemenuBtn {
    display: block;
  }
  .logo img {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 2.4rem;
    margin-left: -35px;
  }

  #report,
  #batch,
  #feedbackDetail,
  #pay-popup {
    max-width: 100%;
    width: 100vw;
  }

  #rules {
    max-height: 80vh;
  }

  .pay-submit-box {
    text-align: center;
  }
}

@media screen and (min-width: 769px) {
  #user-nav-m {
    display: none;
  }
}


.word-wrap {
    word-wrap: break-word;  /* IE兼容，允许单词内换行 */
    overflow-wrap: break-word; /* 标准属性，现代浏览器使用 */
    word-break: normal;     /* 默认换行规则 */
}