/* 本站对后台样式的少量覆写（不改动原站 style.min.css，保持原文件 1:1） */

/*
 * 页头那一行：
 * 原站左边是「数据看板 / 订单管理 / 页面管理 / 系统设置」标题，右边是「🏠 Dashboard || 页名」面包屑。
 * 按要求把左边的标题整块去掉，只留面包屑，并让它落在原来标题的位置（左对齐）。
 * 原站宽屏下是 .breadcrumb-list{text-align:right}（靠右），这里改成左对齐。
 *
 * ⚠️ 这里故意多写一层 .page-title-wrapper 提高优先级，不是啰嗦，是必须的：
 * 后台换肤用的是 <link id="theme-change">，而"默认配色"指向的就是 style.min.css 本体，
 * 也就是它会在运行时把整个 style.min.css 再加载一遍。若只写 .breadcrumb-list（与主题同权重），
 * 谁赢就取决于两个 <link> 的先后 —— 踩过一次：order.html 左对齐、其余三页还是靠右。
 * 提高一级权重后与加载顺序无关。四个页面同时也把本文件挪到了 theme-change 之后。
 */
.page-title-wrapper .breadcrumb-list {
    text-align: left;
}

/*
 * 登录页：文案和账号输入框之间原本空出一行，那行空白整 32px 全部来自 .ad-auth-form 的 margin-top
 * （实测 <p> 自己的下边距是 0，不是 Bootstrap 默认的 16px）。
 * 这里把那 32px 去掉，两个输入框整体上移一行；
 * 但没有归零 —— 归零后文案会紧贴输入框上边框、显得很挤，所以留 8px 呼吸位。
 */
.ad-auth-form {
    margin-top: 8px;
}

/*
 * 登录页右侧那一整块（乞讨小人 gif + 文案 + 账号 / 密码输入框）整体往上提两行。
 *
 * 为什么是这个写法：
 *   那一块的最上面就是 gif，而 gif 紧贴卡片的上内边距（.ad-auth-content 的 padding-top:50px），
 *   也就是说它在卡片里已经没有可压缩的空白了 —— 想让它相对屏幕往上走，只能让整张卡片一起上移。
 *   卡片是靠外层 .ad-auth-wrapper（display:flex + align-items:center）垂直居中的，
 *   给卡片加一个底部外边距，flex 就会把"卡片 + 外边距"这个整体居中，卡片因此上移一半的距离。
 *   文案实测行高 26.4px，两行约 53px，所以底部留 106px（106 / 2 = 53）。
 *
 * 只在宽屏（≥992px，左右分栏那一版）生效：窄屏是上下堆叠、外层用 30vh 顶开的，不需要也不该上移。
 */
@media (min-width: 992px) {
    .ad-auth-box {
        margin-bottom: 106px;
    }
}

/*
 * 后台输入框的边框看不清：
 * 原站把边框色定义成 --border-color:#efefef（几乎和白底同色），而登录页用的是
 * 它自己那套 --main-border-color:#e4e4e4，所以"登录页看得见、后台看不见"。
 * 这里只给表单控件把该变量改深一档（Bootstrap 标准灰 #ced4da）。
 *
 * 做法说明：改的是元素自己的 --border-color，而不是直接写 border-color。
 * 这样 .form-control:focus{border-color:var(--primary)} 的蓝色聚焦效果完全不受影响，
 * 也不会连带改深表格 / 卡片 / 分页那些同样引用 --border-color 的地方。
 * （给元素自身赋值 = 覆盖从 :root 继承来的值，因此与主题样式表的加载顺序无关。）
 */
.form-control,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
select,
textarea {
    --border-color: #ced4da;
}

/*
 * 内容区（iframe 里的这四个页面）永远不显示自己的滚动条 —— 就是那根会压在右下角齿轮上的蓝线。
 *
 * 为什么光靠 frame-height.js 还不够（这是用户前后报了三次的那个"还是有呢"）：
 *   ① 双击/刷新的一瞬间，外框 index.html 里的 <iframe id="content"> 还是写死的高度，
 *      内容高的页面（页面管理 / 系统设置）在这零点几秒里**必然**长出自己的滚动条 ——
 *      实测切到页面管理后 1 秒时：滚动条占宽 6px、内部溢出 935px，2 秒后自适应脚本才把它收掉。
 *      用户"刷新的时候它就出现了"，抓到的就是这一瞬间。
 *   ② 高度自适应是按整数算的，真实内容高往往差零点几像素，浏览器照样画一条 6px 滚动条。
 *
 * 用 scrollbar-width:none 而不是 overflow:hidden：
 *   滚动条**隐形但仍然能滚**（实测：滚动条占宽由 6px 变 0，而 scrollTop 依旧能滚到 120）。
 *   万一自适应脚本因为任何原因没跑起来，内容也不会被切成"点不到"的死区。
 *   （Chrome 121+ 支持该标准属性，且它优先于 ::-webkit-scrollbar 皮肤 —— 已实测。）
 *
 * 只写 html / body：登录页（login.html）这一层本来就不滚动（滚动的是 .ad-auth-wrapper，
 * 它有自己的滚动条皮肤，不受影响），所以本文件被登录页引用也没有副作用。
 */
html,
body {
    scrollbar-width: none;
}
.user-info {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
}

.user-info img.user-img {
    width: 38px !important;
    height: 38px !important;
    object-fit: contain !important;
    border-radius: 50% !important;
    display: block !important;
}

.blink-animation {
    position: absolute !important;
    top: 2px !important;
    right: 2px !important;
    width: 12px !important;
    height: 12px !important;
    bottom: auto !important;
    left: auto !important;
    pointer-events: none !important;
}

.main-circle {
    position: absolute !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background-color: var(--primary, #11a1fd) !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 2 !important;
}

.blink-circle {
    position: absolute !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    border: 2px solid var(--primary, #11a1fd) !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 1 !important;
    -webkit-animation: blinking 1.5s ease-out infinite !important;
    animation: blinking 1.5s ease-out infinite !important;
}