
.input-label-container {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding-right: 120px;
}

/* 输入框基础样式 */
.hint--input-label {
    width: 0;
    height: 0;
    padding: 0;
    border: none;
    outline: none;
    opacity: 0;
    overflow: hidden;
    transition: width 0.3s ease, height 0.3s ease, padding 0.3s ease, opacity 0.3s ease;
}

/* 隐藏所有浏览器的占位符文字 */
.hint--input-label::-webkit-input-placeholder,
.hint--input-label::-moz-placeholder,
.hint--input-label:-ms-input-placeholder,
.hint--input-label::placeholder {
    opacity: 0;
}

/* 展开/折叠按钮样式 */
.expand-btn-label {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 120px 0 5px;
}

.expand-btn-label .icon {
    fill: currentColor;
    width: 16px;
    height: 16px;
    opacity: 0.5;
    transition: transform 0.3s ease;
}

/* 展开后的输入框样式，包括边框 */
.hint--input-label.expanded {
    width: 200px;
    height: 30px;
    padding: 5px;
    opacity: 1;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* 输入框展开时，可选的图标变换效果 */
.expand-btn-label.expanded .icon {
    transform: rotate(180deg);
}