/*
 * 轻提示条（前端 / 后台共用）
 * ---------------------------------------------------------------------------
 * 服务 assets/js/shared/ui.js 的 toast()。两端都会调用（前台点赞、后台上传封面
 * / 布样导入），所以样式必须放在两端都加载的位置。
 *
 * 之前这份样式写在 shared/base.css 里，而前台布局只引 frontend/base.css、
 * 不引 shared/base.css —— 结果前台 toast 没有任何定位，退化成一段占满整行的
 * 裸文本贴在页面最底部。所以这里单独成文件，两端布局各自显式引入。
 *
 * 配色只用共享令牌（--brand / --success / ...），前台深色主题下也能跟着变；
 * 不引用 --ui-* 或 --admin-*，避免和任何一边的语义层耦合。
 */

/* 默认状态：固定在右上角（后台固定页头更高，靠上面的变量覆盖） */
.ui-toast {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 100;
    max-width: 320px;
    padding: 10px 14px;
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--brand);
    border-radius: var(--radius-sm);
    background: var(--bg-panel);
    color: var(--text-primary);
    font-family: var(--font-sans);
    font-size: 13px;
    line-height: 1.6;
    /* 浮层不该拦截下面的点击 */
    pointer-events: none;
}

.ui-toast[data-type='success'] {
    border-left-color: var(--success);
}

.ui-toast[data-type='warning'] {
    border-left-color: var(--warning);
}

.ui-toast[data-type='danger'] {
    border-left-color: var(--danger);
}

/* 后台有固定顶栏（--admin-topbar-h），提示条要从它下面开始，
   否则会压住面包屑；前台没有顶栏，沿用上面的 16px。
   --admin-topbar-h 定义在 shared/tokens.css，两端都加载得到。 */
.admin-body .ui-toast {
    top: calc(var(--admin-topbar-h) + 16px);
}

/* 深色主题：共享令牌（--bg-panel 等）只有浅色一套，不会跟着前台主题切换，
   不覆盖的话前台的提示条在深色页面里是一块刺眼的白。
   这里写死一组与前台深色面板一致的颜色，保持本文件不依赖 --ui-*。
   注意边框要逐边写：用 border-color 简写会盖掉上面按类型区分的左边框，
   四种类型的提示会变成同一条灰边。
   后台没有深色主题，这段对它不生效。 */
html[data-theme='dark'] .ui-toast {
    border-top-color: #1e2c45;
    border-right-color: #1e2c45;
    border-bottom-color: #1e2c45;
    background: #101a2b;
    color: #e6ecf6;
}
