/* Reset and Base Styles */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  background: #ededf2;
  /*height: 100%;*/
  /*overflow-x: hidden;*/
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  /*height: 100%;*/
  color: #1d1a18;
  overflow-x: hidden;
  max-width: 768px;
}
@media (min-width: 769px) {
  body {
    margin: 0 auto !important;
  }
}

app-container {
  /*position: relative;*/
  /*height: 100vh; !* 保证全屏 *!*/
  /*overflow: hidden; !* 避免外层滚动 *!*/
}

.app-content {
  position: relative;
  height: 100%;
  /*overflow-y: auto; !* 显式设定纵向滚动 *!*/
  /*-webkit-overflow-scrolling: touch; !* 移动端顺滑滚动 *!*/
}

.app-scroll-content {
  /*min-height: 1500px; !* 测试时让内容足够高产生滚动条 *!*/
}

/* Utility Classes */
.u-hidden {
  display: none !important;
}

.u-pointer-events-none * {
  pointer-events: none;
}

.u-scrollbar-hidden::-webkit-scrollbar {
  display: none;
}


.app-container__background {
  width: 100%;
  position: absolute;
  z-index: 1;
  top: 0;
  max-width: 768px;
}

/*.app-content {*/
/*  width: 100%;*/
/*  height: 100%;*/
/*  overflow: auto;*/
/*  z-index: 3;*/
/*  position: relative;*/
/*}*/
.app-content {
  position: relative;
  height: 100%;
  /*overflow-y: auto; !* 显式设定纵向滚动 *!*/
  /*-webkit-overflow-scrolling: touch; !* 移动端顺滑滚动 *!*/
}

.app-scroll-content {
  min-height: 1500px; /* 测试时让内容足够高产生滚动条 */
}

/* Shop Header */
.shop-header {
  display: flex;
  align-items: center;
  position: absolute;
  top: 40px;
  left: 20px;
  z-index: 1;
  padding: 5px;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 6px;
}

.shop-header__logo {
  width: 24px;
  height: 24px;
  margin-right: 5px;
  border-radius: 50%;
}

.shop-header__title {
  font-size: 14px;
  color: #ffffff;
  /*font-weight: bold;*/
}
.feature-section--wifi {
  display: flex;
  align-items: center;
}
/* Feature Sections */
.feature-sections {
  /*padding: 12px;*/
  position: relative;
  top: 200px;
  z-index: 3;
}

.feature-section {
  border-radius: 12px;
  border: 1px solid #ffffff;
  padding: 10px;
  margin-bottom: 15px;
  background: rgba(255, 255, 255, 0.9);
}

.feature-section--reviews {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 0%, #8ACBF0 100%);
}

.feature-section--social {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 0%, #deecfd 100%);
}

.feature-section--wechat {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 0%, #7FC8B4 100%);
}


.feature-section--groupbuy {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 0%, #AA9CF7 100%);
}

.feature-section--accounts {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 40%, #FDA7B2 100%);
}

.feature-section--wifi-info {
  background: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
}

.feature-section--hotdeal {
  background: linear-gradient(180deg, rgba(243, 248, 254, 0.4) 0%, #FBECB4 100%);
  /*background: linear-gradient(180deg, rgba(247, 254, 243, 0.4) 0%, #fdf2de 100%);*/
}

/* Feature Section Components */
.feature-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.feature-section__header-image {
  width: 100%;
  border-radius: 20px;
}

/*.feature-section__header-icon {*/
/*  width: 16%;*/
/*}*/

.feature-section__icon {
  width: 48px;
  margin-right: 10px;
}

.feature-section__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.feature-section__info {
  display: flex;
  flex-direction: column;
}

.feature-section__name {
  font-size: 13px;
  color: #5f7292;
  margin-bottom: 5px;
}

.feature-section__description {
  font-size: 15px;
  color: #1d1a18;
}

.feature-section__action {
  background: #e1edfc;
  border-radius: 20px;
  padding: 5px 10px;
  font-size: 14px;
  color: #000000;
  display: flex;
  align-items: center;
}

.feature-section__action-icon {
  width: 12px;
  height: 12px;
  margin-left: 5px;
}

/* Button Grids */
.feature-section__buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

/* Social Buttons */
.social-button {
  width: 46%;
  position: relative;
  margin-bottom: 10px;
}

.social-button__icon {
  width: 20px;
  position: absolute;
  z-index: 1;
  top: 13px;
  left: 12px;
}

.social-button__label {
  white-space: nowrap;
  position: absolute;
  z-index: 1;
  top: 13px;
  left: 36px;
  font-size: 16px;
  font-weight: bold;
  /*color: #6e6f70;*/
}

.social-button__background {
  width: 100%;
  position: relative;
  z-index: 0;
  top: 0;
  left: 0;
  border-radius: 9px;
}

/* Review Buttons */
.review-button {
  width: 38%;
  display: flex;
  align-items: center;
  margin-top: 10px;
  background: rgba(255, 255, 255, 0.9);
  padding: 15px;
  border-radius: 8px;
  box-sizing: content-box;
  white-space: nowrap;
}

.review-button__icon {
  margin-right: 7px;
  width: 32px;
  height: 32px;
  border-radius: 6px;
}

.review-button__label {
  font-size: 16px;
  color: #1d1a18;
  font-weight: bold;
}

/* WeChat Buttons */
.wechat-button {
  width: 38%;
  display: flex;
  align-items: center;
  margin-top: 10px;
  background: rgba(255, 255, 255, 0.9);
  padding: 15px;
  border-radius: 8px;
  box-sizing: content-box;
  white-space: nowrap;
}

.wechat-button__icon {
  margin-right: 7px;
  width: 32px;
  height: 32px;
}

.wechat-button__label {
  font-size: 16px;
  color: #1d1a18;
  font-weight: bold;
}

/* Group Buy Buttons */
.groupbuy-button {
  width: 33%;
  text-align: center;
}

/*.groupbuy-button__icon {*/
/*  width: 80px;*/
/*}*/

.groupbuy-button__label {
  position: relative;
  z-index: 1;
  background: linear-gradient(90deg, #e79f7e 0%, #410d01 100%);
  border-radius: 20px;
  padding: 4px 12px;
  width: fit-content;
  margin: -20px auto auto auto;
  text-align: center;
  font-size: 14px;
  color: #ffffff;
}

/* Account Buttons */
.account-button {
  width: 30%;
  margin: 1%;
}

/* Hot Deal Section */
.hotdeal-list {
  display: flex;
  width: 100%;
  overflow: auto;
}

.hotdeal-item {
  min-width: calc(100%);
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 12px;
  padding: 10px;
  box-sizing: border-box;
  transform: scale(0.9);
  margin-left: -20px;
}

.hotdeal-item__image {
  width: 90px;
  height: 90px;
  border-radius: 12px;
  margin-right: 10px;
}

.hotdeal-item__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 90px;
  flex: 1;
  align-items: flex-start;
  width: calc(100% - 95px);
}

.hotdeal-item__details {
  width: 90%;
}

.hotdeal-item__title {
  font-size: 14px;
  font-weight: bold;
  color: #000;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
}

.hotdeal-item__meta {
  display: flex;
  justify-content: space-between;
  width: 110%;
  align-items: center;
  margin-top: 5px;
}

.hotdeal-item__tags {
  display: flex;
  align-items: center;
  /*overflow: auto;*/
  /*width: calc(100% - 65px);*/
}

.hotdeal-item__tag {
  padding: 0 5px;
  border: 1px solid #e4e4e4;
  color: #737373;
  font-size: 12px;
  white-space: nowrap;
  margin-right: 10px;
}

.hotdeal-item__sales {
  white-space: nowrap;
}

.hotdeal-item__footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 100%;
}

.hotdeal-item__price {
  font-weight: bold;
  color: #f83055;
  font-size: 14px;
}

.hotdeal-item__original-price {
  font-size: 12px;
  font-weight: 500;
  color: #8e8e8e;
  text-decoration: line-through;
}

.hotdeal-item__discount {
  padding: 0 5px;
  color: #f83055;
  display: flex;
  align-items: center;
  font-size: 12px;
  background-color: #ffece8;
  margin-top: 2px;
}

.hotdeal-item__discount-icon {
  margin-right: 2px;
  width: 12px;
  height: 12px;
}

.hotdeal-item__button {
  width: 80px;
  height: 30px;
  background: linear-gradient(90deg, #fb634b 0%, #fd2b54 100%);
  line-height: 30px;
  text-align: center;
  color: #fff;
  border-radius: 8px;
  cursor: pointer;
}

/* Modal Overlay */
.modal-overlay {
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 40px;
  box-sizing: border-box;
  z-index: 100;
}

.modal-overlay__back-button {
  position: absolute;
  top: 0.625rem;
  left: 20px;
  cursor: pointer;
}

.modal-overlay__back-icon {
  width: 20px;
  height: 20px;
}

.modal-overlay__arrow {
  position: absolute;
  right: 16px;
  top: 16px;
  width: 90px;
  z-index: 105;
}

.modal-overlay__content {
  position: relative;
  width: 100%;
  height: 100%;
}

.modal-overlay__popup {
  position: absolute;
  width: 90%;
  top: 140px;
}

/* 备案信息样式（随内容滚动） */
.footer {
  padding: 12px;
  text-align: center;
  font-size: 12px;
  color: #5f7292; /* 深灰色，与页面次要文字颜色一致 */
  background: #ffffff; /* 白色背景，与内容区统一 */
  border-top: 1px solid #e4e4e4; /* 顶部分割线 */
}

.beianInfo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.beianInfo a {
  color: #5f7292; /* 浅蓝色链接，与页面主色呼应 */
  text-decoration: none;
  transition: color 0.3s;
}

.beianInfo a:hover {
  color: #6ab2e8;
}

.beianInfo span {
  color: #5f7292;
}
.yjbc-file{
  margin: 10px 0;
  border: 1px solid #dcdfe6;
  padding: 5px 8px;
  border-radius: 5px;
  color: #000;
  text-align:center
}

.yjbc-tips{
  margin: 10px 0;
  padding: 5px 8px;
  border-radius: 5px;
  color: red;
  text-align:center
}