/* Webinar 特殊页面 - 滚动文本域组件 */
/* 外层定位包装盒 */
.textarea-wrapper {
    position: relative;
    margin-bottom: 20px;
    width: 100%;
}

/* 伪装成 textarea 的富文本输入外壳 */
.rich-inquiry-editor {
    width: 100%;
    height: 160px;              /* 保持固定的卡片总高度 */
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #ffffff;
    box-sizing: border-box;
    position: relative;         /* 为内部的滚动投影建立核心锚点 */
    transition: border-color 0.15s, box-shadow 0.15s;
    cursor: text;
    overflow: hidden;
}

/* 激活聚焦时，外壳变蓝 */
.rich-inquiry-editor.focused {
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.25);
}

/* 核心修改：第一行固定标题（转化为输入框内部的滚动同步背景层） */
.rich-inquiry-editor .fixed-header-line {
    position: absolute;
    top: 12px;                  /* 初始顶距，与 textarea 的 padding 对齐 */
    left: 12px;
    font-size: 18px !important;
    line-height: 1.6 !important;
    font-family: 'Malgun Gothic', '맑은 고딕', sans-serif;
    color: #999999 !important;  /* 初始状态：浅灰色 */
    font-weight: normal;
    user-select: none;
    -webkit-user-select: none;
    z-index: 1;                 /* 垫在底层，作为背景文字 */
    pointer-events: none;       /* 允许鼠标穿透点击到上方的 textarea */
    display: block !important;
    transition: color 0.15s ease-in-out;
}

/* 当聚焦激活时，第一行标题立刻变黑 */
.rich-inquiry-editor.focused .fixed-header-line {
    color: #333333 !important;
}

/* 只要用户输入了内容，锁定第一行为绝对纯黑色 */
.rich-inquiry-editor .fixed-header-line.locked-black {
    color: #333333 !important;
}

/*  2. 中间核心原生文本域：压在灰色投影上方 */
.rich-inquiry-editor .user-real-textarea {
    width: 100%;
    height: 100%;
    border: none !important;
    outline: none !important;
    resize: none !important;
    box-sizing: border-box;

    /* 核心修复：内边距顶部留出 35px，绝妙地把首行输入起点强行推到第二行！ */
    padding: 35px 12px 12px 12px !important;

    font-size: 18px !important;
    line-height: 1.6 !important;
    font-family: 'Malgun Gothic', '맑은 고딕', sans-serif;
    color: #333333 !important;

    /*  关键：背景设为透明，让地下的固定标题浮现出来，并提升层级保证滚动条优先响应 */
    background: transparent !important;
    position: relative;
    z-index: 2;
    overflow-y: auto;           /* 超出边界时浮现最完美的垂直滚动条 */
}

/*  红色警告字符样式（已完美集成错误图标） */
.warning-message {
    color: #dc3545 !important;
    font-size: 14px !important;
    margin-top: 6px !important;
    display: none;

    /* 核心修复：为左侧的图标腾出绝对安全的物理间距 */
    padding-left: 22px !important;

    /* 核心修复：引入您的静态图片资源作为背景图 */
    background: url('/static/assets-new/common/icon-error.png') no-repeat left center !important;

    /* 确保图标大小完美适配 18px 左右的高清视网膜屏幕 */
    background-size: 16px 16px !important;

    /* 开启 flex 对齐，确保图标和韩文提示语在垂直方向上绝对居中对齐 */
    align-items: center;
    min-height: 16px;
}