/* 下拉控件样式 */
.dropdown-container {
	float: right;
    position: relative;
    margin: -150px 0px 0px 0px;
    padding: 10px 0px;
}

/* 触发按钮样式 */
.dropdown-trigger {
    background-color: #FD9B6A;
    color: white;
    padding: 18px 38px;
    width: 2.2rem;
  	height: 0.64rem;
    border: none;
    border-radius: 18px;
    cursor: pointer;
    font-size: 18px;
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    transition: background-color 0.2s ease;
}

.dropdown-trigger:hover {
    background-color: #FDA775;
}

.dropdown-trigger .icon {
    margin-right: 8px;
}

.dropdown-trigger .arrow {
	margin-left: 6px;
    font-size: 14px;
    transition: transform 0.3s ease;
}

.dropdown-container:hover .arrow {
    transform: rotate(180deg);
}
        
/* 下拉列表样式 */
.dropdown-content {
    position: absolute;
    left: 0;
    top: 100%;
    padding: 4px 0px;
    min-width: 160px;
    background-color: white;
    border-radius: 16px;
    overflow: hidden;
    z-index: 100;
    
    /* 默认隐藏 */
    visibility: hidden;
}

/* 鼠标悬停时显示下拉列表 */
.dropdown-container:hover .dropdown-content {
    visibility: visible;
}

/* 下拉列表项样式 */
.dropdown-item {
    display: block;
    padding: 12px 22px;
    color: #515154;
    text-decoration: none;
    font-size: 14px;
    display: flex;
    align-items: center;
    
    margin: 4px 8px;
    border-radius: 8px;
}

.dropdown-item .item-icon {
    margin-right: 10px;
    width: 16px;
    text-align: center;
}

.dropdown-item:hover {
	color: #515154;
    background-color: #F5F5F6;
}



section .banner .content .button2 {
  width: 2.2rem;
  height: 0.66rem;
  box-shadow: 0rem 0.12rem 0.16rem 0 rgba(255, 136, 68, 0.5);
  border-radius: 0.2rem;
  margin-top: 0.75rem;
  background: linear-gradient(90deg, #FD8D5E 0%, #ffa56f 100%);
  position: relative;
  overflow: hidden;
  color: #fff;
}

section .banner .content .button2:hover {
  color: #ffffff;
  background: linear-gradient(90deg, #FD8D5E 0%, #ffa56f 100%);
}


/* 联系我们 菜单的文字样式 ---------------------------------------*/
.menu-trigger {
    color: #2c3e50;
    font-size: 0.15rem;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 4px; /* 下划线与文字的距离 */
    position: relative;
    margin-top: 20px;
	float: right;
}

/* 主下拉菜单容器 */
.main-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 8px;
    min-width: 1.2rem;
    background-color: white;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(5px);
    transition: all 0.3s ease;
    z-index: 10;
}

/* 显示主下拉菜单 */
.menu-trigger:hover .main-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 菜单项样式 */
.menu-item {
    padding: 10px 10px;
    margin: 5px;
    border-radius: 6px;
    font-size: 14px;
    color: #34495e;
    cursor: pointer;
    transition: background-color 0.2s;
    position: relative; /* 用于定位二维码 */
}

.menu-item:hover {
    background-color: #f5f5f5;
}

/* 二维码容器 */
.qrcode-container {
    position: absolute;
    right: 100%; /* 定位到菜单左侧 */
    top: 50%;
    transform: translateY(-50%);
    margin-right: 10px; /* 与菜单的间距 */
    width: 136px;
    height: 136px;
    background-color: white;
    border: 1px solid #e0e0e0;
    border-radius: 4px 4px 0px 0px;
    padding: 5px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 9; /* 确保在主菜单下方 */
}

/* 二维码图片样式 */
.qrcode-container img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* 二维码描述文字 */
.qrcode-desc {
    position: absolute;
    background-color: white;
    left: 0;
    width: 100%;
    padding: 0px 0px 6px 0px;
    text-align: center;
    font-size: 12px;
    border-radius: 0px 0px 4px 4px;
}

/* 鼠标悬停菜单项时显示二维码 */
.menu-item:hover .qrcode-container {
    opacity: 1;
    visibility: visible;
}


/* 左侧信息面板 - 左右布局 */
.info-panel {
    position: absolute;
    right: 100%; /* 定位到菜单左侧 */
    top: 50%;
    transform: translateY(-50%);
    margin-right: 10px; /* 与菜单的间距 */
    width: 180px;
    background-color: white;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    padding: 12px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 9; /* 确保在主菜单下方 */
    display: flex; /* 启用flex布局 */
    align-items: center; /* 垂直居中对齐 */
    gap: 8px; /* logo与文字之间的间距 */
}

/* 鼠标悬停菜单项时显示信息面板 */
.menu-item:hover .info-panel {
    opacity: 1;
    visibility: visible;
}

/* Logo样式 - 居左 */
.panel-logo {
    width: 18px;
    height: 18px;
    object-fit: contain;
    flex-shrink: 0; /* 防止logo被压缩 */
}

/* 文字信息容器 - 居右 */
.panel-text {
    flex-grow: 1; /* 占据剩余空间 */
    font-size: 15px;
    color: #1e293b;
}