@charset "UTF-8";
/* =============================================================================
 * 主题名：加勒比海 · 明亮海岛（Caribbean · Bright Island）
 * -----------------------------------------------------------------------------
 * 作用：整体覆盖 RuoYi 4.8.3 + INSPINIA(style.min.css) + skins.css + ry-ui.css
 *       以及 bootstrap-table / select2 / datetimepicker / laydate / ztree /
 *       summernote / layer / blockUI 等第三方控件的默认配色。
 *
 * 视觉基调：
 *   侧边栏 = 深海蓝 → 海水蓝 纵向渐变（浅色文字）
 *   顶栏   = 沙滩白 + 绿松石下边线（深色文字）
 *   主按钮 = 珊瑚色；强调 / 链接 / 焦点 = 绿松石
 *   内容区 = 海沫色底 + 白卡片 + 柔和阴影，圆角 8px（控件 6px）
 *
 * ！！！警告 ！！！
 *   本文件只包含「配色与观感」。禁止在此改动任何布局尺寸：
 *   width / height / min-height / max-height / padding / margin /
 *   border-width / position / display / float / box-sizing / line-height /
 *   影响行高的 font-size / font-family —— RuoYi 的 ry-ui.js、index.js、
 *   common.js 对 50px 顶栏高、39px 页签高、outerWidth(true) 有硬编码依赖，
 *   一旦改动会导致页签滚动与 iframe 高度计算错乱。
 *
 * 本文件必须是模板中最后加载的样式表（include.html / index.html /
 * index-topnav.html / login.html / register.html 均已满足）。
 * 与 skins.css / ry-ui.css / 运行时注入的 layer.css / laydate.css 冲突处
 * 一律使用 !important。
 * ========================================================================== */


/* ==========================================================================
   1. 调色板变量（唯一权威色值来源，改色只改这里）
   ========================================================================== */
:root {
    --carib-deep:        #0b4f6c;  /* 深海蓝：侧边栏渐变起点、主标题 */
    --carib-ocean:       #0a7d8c;  /* 海水蓝：侧边栏渐变终点 */
    --carib-turq:        #06b6b0;  /* 绿松石：主强调色 / 链接 / 焦点 */
    --carib-turq-dk:     #048b87;  /* 绿松石深：hover */
    --carib-turq-lt:     #d9f2f0;  /* 绿松石浅：表头底、hover 行 */
    --carib-turq-md:     #b8ebe6;  /* 绿松石中：选中行 */
    --carib-coral:       #ff6b5b;  /* 珊瑚：主按钮 */
    --carib-coral-dk:    #e8543f;  /* 珊瑚深：主按钮 hover */
    --carib-sand:        #f7f0e3;  /* 沙滩白：顶栏、页签栏底 */
    --carib-sand-lt:     #fdfaf3;  /* 沙滩浅：次级底 */
    --carib-gold:        #f4b942;  /* 落日金：warning */
    --carib-gold-dk:     #d99a1f;  /* 落日金深 */
    --carib-palm:        #2fa36b;  /* 棕榈绿：success */
    --carib-palm-dk:     #238555;  /* 棕榈绿深 */
    --carib-hibiscus:    #e0453a;  /* 木槿红：danger */
    --carib-hibiscus-dk: #b83026;  /* 木槿红深 */
    --carib-foam:        #eef7f7;  /* 海沫底：内容区页面底色 */
    --carib-border:      #d7e8e8;  /* 边框 */
    --carib-text:        #0f3a49;  /* 正文字 */
    --carib-muted:       #5d7c88;  /* 次要字 */

    /* 组合值 */
    --carib-shadow:      0 2px 10px rgba(11, 79, 108, .08);
    --carib-shadow-lg:   0 8px 28px rgba(11, 79, 108, .18);
    --carib-sidebar-bg:  linear-gradient(180deg, #0b4f6c 0%, #0a7d8c 100%);
    --carib-radius:      8px;
    --carib-radius-sm:   6px;

    /* 侧边栏文字层级 */
    --carib-menu-1:      rgba(255, 255, 255, .82);
    /* .78 而非 .62：侧边栏渐变下半段是 #0a7d8c，.62 白字在其上仅 2.85:1，长菜单下半屏读不清 */
    --carib-menu-2:      rgba(255, 255, 255, .78);
    --carib-menu-hover:  #d9f2f0;
    --carib-menu-active-bg: rgba(255, 255, 255, .12);
}


/* ==========================================================================
   2. 全局：底色 / 链接 / 文字 / 选区 / 滚动条
   ========================================================================== */
body,
body.gray-bg,
.gray-bg,
#page-wrapper,
#page-wrapper.gray-bg,
body.fixed-sidebar #page-wrapper {
    background-color: var(--carib-foam, #eef7f7) !important;
    color: var(--carib-text, #0f3a49);
}

.white-bg,
.wrapper-content.white-bg {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

a {
    color: var(--carib-turq, #06b6b0);
    transition: color .15s ease-in-out;
}

a:hover,
a:focus {
    color: var(--carib-turq-dk, #048b87);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--carib-deep, #0b4f6c);
}

.text-muted {
    color: var(--carib-muted, #5d7c88) !important;
}

hr {
    border-top-color: var(--carib-border, #d7e8e8);
}

::selection {
    background: var(--carib-turq-md, #b8ebe6);
    color: var(--carib-deep, #0b4f6c);
}

::-moz-selection {
    background: var(--carib-turq-md, #b8ebe6);
    color: var(--carib-deep, #0b4f6c);
}

/* 滚动条：绿松石 */
::-webkit-scrollbar {
    background-color: var(--carib-foam, #eef7f7);
}

::-webkit-scrollbar-track {
    background-color: var(--carib-turq-lt, #d9f2f0);
    border-radius: var(--carib-radius, 8px);
}

::-webkit-scrollbar-thumb {
    background-color: var(--carib-turq, #06b6b0);
    border-radius: var(--carib-radius, 8px);
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--carib-turq-dk, #048b87);
}

::-webkit-scrollbar-corner {
    background-color: var(--carib-foam, #eef7f7);
}

html {
    scrollbar-color: var(--carib-turq, #06b6b0) var(--carib-turq-lt, #d9f2f0);
}


/* ==========================================================================
   3. 左侧边栏（深海蓝 → 海水蓝 纵向渐变）
   ========================================================================== */

/* ---- 3.1 侧栏容器底色：覆盖 style.css / skins.css 全部 theme-* 变体 ---- */
.navbar-static-side,
nav.navbar-static-side,
body.canvas-menu nav.navbar-static-side,
body.canvas-menu.mini-navbar nav.navbar-static-side,
.theme-dark .navbar-static-side,
.theme-light .navbar-static-side,
.theme-blue .navbar-static-side,
.skin-blue .navbar-static-side,
.skin-green .navbar-static-side,
.skin-purple .navbar-static-side,
.skin-red .navbar-static-side,
.skin-yellow .navbar-static-side,
.skin-blue .wrapper, .skin-blue .main-sidebar, .skin-blue .left-side,
.skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side,
.skin-purple .wrapper, .skin-purple .main-sidebar, .skin-purple .left-side,
.skin-red .wrapper, .skin-red .main-sidebar, .skin-red .left-side,
.skin-yellow .wrapper, .skin-yellow .main-sidebar, .skin-yellow .left-side {
    background: var(--carib-sidebar-bg, linear-gradient(180deg, #0b4f6c 0%, #0a7d8c 100%)) !important;
    background-color: var(--carib-deep, #0b4f6c) !important;
    box-shadow: 2px 0 12px rgba(11, 79, 108, .18) !important;
}

/* 侧栏底部极轻量波浪装饰（inline SVG data-uri，无任何外链） */
.navbar-static-side,
nav.navbar-static-side {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 120' preserveAspectRatio='none'%3E%3Cpath fill='%2306b6b0' fill-opacity='.22' d='M0 46c40 22 80-22 120 0s80 22 120 0v74H0z'/%3E%3Cpath fill='%23d9f2f0' fill-opacity='.14' d='M0 78c50 18 90-18 140 2s60 12 100-4v44H0z'/%3E%3C/svg%3E"),
        var(--carib-sidebar-bg, linear-gradient(180deg, #0b4f6c 0%, #0a7d8c 100%)) !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: center bottom, center center !important;
    background-size: 100% 120px, cover !important;
    background-attachment: scroll, scroll !important;
}

.navbar-default {
    background: transparent !important;
    border-color: rgba(255, 255, 255, .10) !important;
}

/* ---- 3.2 一级菜单文字 ---- */
.navbar-static-side .nav > li > a,
.navbar-default .nav > li > a,
#side-menu > li > a,
.theme-dark .navbar-default .nav > li > a,
.theme-light .navbar-default .nav > li > a,
.theme-blue .navbar-default .nav > li > a,
.skin-blue .sidebar a,
.skin-green .sidebar a,
.skin-purple .sidebar a,
.skin-red .sidebar a,
.skin-yellow .sidebar a {
    color: var(--carib-menu-1, rgba(255, 255, 255, .82)) !important;
    background-color: transparent;
    text-shadow: 0 1px 1px rgba(11, 79, 108, .35);
    transition: color .15s ease, background-color .15s ease;
}

/* 一级菜单图标 */
.navbar-static-side .nav > li > a > i,
.navbar-default .nav > li > a > i,
#side-menu > li > a > i,
.navbar-static-side .nav > li > a .fa,
.navbar-default .nav > li > a .fa.arrow {
    color: rgba(255, 255, 255, .70) !important;
}

/* ---- 3.3 二 / 三 / 四级菜单 ---- */
.navbar-static-side .nav-second-level,
.navbar-static-side .nav-third-level,
.navbar-static-side .nav-four-level,
.navbar-default .nav-second-level,
.navbar-default .nav-third-level,
.navbar-default .nav-four-level,
.canvas-menu.mini-navbar .nav-second-level {
    background-color: rgba(0, 0, 0, .16) !important;
}

.navbar-static-side .nav-second-level li a,
.navbar-static-side .nav-third-level li a,
.navbar-static-side .nav-four-level li a,
.navbar-default .nav-second-level li a,
.navbar-default .nav-third-level li a,
.navbar-default .nav-four-level li a,
#side-menu .nav-second-level li a,
#side-menu .nav-third-level li a {
    color: var(--carib-menu-2, rgba(255, 255, 255, .62)) !important;
    background-color: transparent;
}

.navbar-static-side .nav-second-level li a > i,
.navbar-static-side .nav-third-level li a > i,
.navbar-default .nav-second-level li a > i,
.navbar-default .nav-third-level li a > i {
    /* .66 而非 .48：.48 白在渐变下半段 #0a7d8c 上只有 2.27:1，图标几乎不可见 */
    color: rgba(255, 255, 255, .66) !important;
}

/* ---- 3.4 菜单 hover / focus（含全部 theme-* 变体） ---- */
.navbar-static-side .nav > li > a:hover,
.navbar-static-side .nav > li > a:focus,
.navbar-default .nav > li > a:hover,
.navbar-default .nav > li > a:focus,
.theme-dark .navbar-default .nav > li > a:hover,
.theme-dark .navbar-default .nav > li > a:focus,
.theme-light .navbar-default .nav > li > a:hover,
.theme-light .navbar-default .nav > li > a:focus,
.theme-blue .navbar-default .nav > li > a:hover,
.theme-blue .navbar-default .nav > li > a:focus,
.navbar-static-side .nav-second-level li a:hover,
.navbar-static-side .nav-third-level li a:hover,
.navbar-static-side .nav-four-level li a:hover,
.navbar-default .nav-second-level li a:hover,
.navbar-default .nav-third-level li a:hover,
.skin-blue .sidebar a:hover,
.skin-green .sidebar a:hover,
.skin-purple .sidebar a:hover,
.skin-red .sidebar a:hover,
.skin-yellow .sidebar a:hover {
    background-color: rgba(6, 182, 176, .22) !important;
    color: var(--carib-menu-hover, #d9f2f0) !important;
    box-shadow: none !important;
}

.navbar-static-side .nav > li > a:hover > i,
.navbar-default .nav > li > a:hover > i,
.navbar-static-side .nav-second-level li a:hover > i {
    color: var(--carib-turq-lt, #d9f2f0) !important;
}

/* 折叠箭头 <span class="fa arrow">（不是 <i>，上面的 > i 规则够不到它）：
   hover / active 时必须跟着提亮，否则文字亮、箭头暗，像是没响应。 */
.navbar-static-side .nav > li > a:hover .fa.arrow,
.navbar-static-side .nav > li > a:focus .fa.arrow,
.navbar-default .nav > li > a:hover .fa.arrow,
.navbar-default .nav > li > a:focus .fa.arrow,
.navbar-static-side .nav > li.active > a .fa.arrow,
.navbar-default .nav > li.active > a .fa.arrow {
    color: var(--carib-menu-hover, #d9f2f0) !important;
}

/* §3.2 的 `.navbar-static-side .nav>li>a .fa` 是后代选择器，会把二/三级箭头
   也刷到 70% 白，比二级文字（62%）还亮，层级反了，压回 48%。 */
.navbar-static-side .nav-second-level li a .fa.arrow,
.navbar-static-side .nav-third-level li a .fa.arrow,
.navbar-default .nav-second-level li a .fa.arrow,
.navbar-default .nav-third-level li a .fa.arrow {
    /* 同上，.48 → .66 */
    color: rgba(255, 255, 255, .66) !important;
}

.navbar-static-side .nav-second-level li a:hover .fa.arrow,
.navbar-static-side .nav-third-level li a:hover .fa.arrow,
.navbar-default .nav-second-level li a:hover .fa.arrow,
.navbar-default .nav-third-level li a:hover .fa.arrow {
    color: var(--carib-menu-hover, #d9f2f0) !important;
}

/* 防御性：style.css:334 `.navbar-default .special_link a{background:#1ab394}`
   无皮肤前缀，一旦菜单配置里出现该 class，深海蓝侧栏上会炸出一块荧光绿。 */
.navbar-default .special_link a,
.navbar-default .special_link a:hover,
.navbar-default .special_link a:focus {
    background: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

/* ---- 3.5 展开 / 选中项（active）：珊瑚色左竖条 + 半透明白底 ---- */
.navbar-static-side .nav > li.active,
.navbar-static-side .nav:not(.navbar-toolbar) > li.active,
.navbar-default .nav:not(.navbar-toolbar) > li.active,
#side-menu > li.active,
.sidebar-collapse .nav:not(.navbar-toolbar) > li.active,
.theme-dark .nav:not(.navbar-toolbar) > li.active,
.theme-light .nav:not(.navbar-toolbar) > li.active,
.theme-blue .nav:not(.navbar-toolbar) > li.active,
.skin-blue .nav:not(.navbar-toolbar) > li.active,
.skin-green .nav:not(.navbar-toolbar) > li.active,
.skin-purple .nav:not(.navbar-toolbar) > li.active,
.skin-red .nav:not(.navbar-toolbar) > li.active,
.skin-yellow .nav:not(.navbar-toolbar) > li.active {
    background-color: var(--carib-menu-active-bg, rgba(255, 255, 255, .12)) !important;
    border-left-color: var(--carib-coral, #ff6b5b) !important;
    border-left-style: solid !important;
    border-radius: 0 var(--carib-radius, 8px) var(--carib-radius, 8px) 0 !important;
}

/* 横向菜单模式下 index-topnav.html 内联 style 强制 border-left:0，需更高特异性拿回来 */
body.fixed-sidebar nav.navbar-static-side .nav:not(.navbar-toolbar) > li.active,
body.fixed-sidebar #side-menu.nav:not(.navbar-toolbar) > li.active {
    border-left: 3px solid var(--carib-coral, #ff6b5b) !important;
}

/* 上面那条 (0,5,3) 的后代选择器同时命中二/三/四级子菜单（子菜单 <ul> 的 class
   正是 `nav nav-second-level collapse`，:not(.navbar-toolbar) 对它成立），
   会把「二/三级不加竖条」和 mini-navbar 归零规则一起压掉，导致子菜单整列右移
   3px、收起态 70px 窄轨里选中图标错位。用 #side-menu 的 id 权重把它们归零，
   只把 border-left-width 恢复成 style.css 原状，不引入新的盒模型改动。 */
#side-menu .nav-second-level > li.active,
#side-menu .nav-third-level > li.active,
#side-menu .nav-four-level > li.active,
#side-menu .nav.nav-second-level > li.active,
#side-menu .nav.nav-third-level > li.active,
#side-menu .nav.nav-four-level > li.active {
    border-left-width: 0 !important;
    border-left-color: transparent !important;
}

/* 收起态：恢复 style.css 的 border-left-width:0，避免 70px 窄轨里图标错位 */
body.mini-navbar #side-menu li.active,
body.fixed-sidebar.mini-navbar #side-menu li.active {
    border-left-width: 0 !important;
}

/* 二 / 三级展开项不加竖条 */
.navbar-static-side .nav.nav-second-level > li.active,
.navbar-static-side .nav.nav-third-level > li.active,
.navbar-default .nav-second-level > li.active,
.navbar-default .nav-third-level > li.active,
.skin-blue .nav > li.active > ul li.active,
.skin-green .nav > li.active > ul li.active,
.skin-purple .nav > li.active > ul li.active,
.skin-red .nav > li.active > ul li.active,
.skin-yellow .nav > li.active > ul li.active {
    border-left-color: transparent !important;
    background-color: rgba(6, 182, 176, .18) !important;
}

/* active 项文字 */
.navbar-static-side .nav > li.active > a,
.navbar-default .nav > li.active > a,
#side-menu > li.active > a,
.navbar-static-side .nav-second-level > li.active > a,
.navbar-static-side .nav-third-level > li.active > a,
.navbar-default .nav > li.active > ul li.active > a {
    color: #ffffff !important;
    font-weight: 600 !important;
    background-color: transparent !important;
}

.navbar-static-side .nav > li.active > a > i,
.navbar-default .nav > li.active > a > i {
    color: var(--carib-turq-lt, #d9f2f0) !important;
}

/* selected（当前页所在菜单项）：绿松石高亮 */
.navbar-static-side .nav > li.selected > a,
.navbar-default .nav > li.selected > a,
.navbar-default .nav > li.selected > a:focus,
.navbar-default .nav > li.selected > a:hover,
.navbar-static-side .nav > li.selected {
    background-color: rgba(6, 182, 176, .28) !important;
    color: #ffffff !important;
}

/* ---- 3.6 LOGO 区（尺寸禁改，只换配色） ---- */
nav .logo,
.logo,
.skin-blue .logo,
.skin-green .logo,
.skin-purple .logo,
.skin-red .logo,
.skin-yellow .logo {
    background-color: rgba(11, 79, 108, .55) !important;
    background-image: linear-gradient(135deg, rgba(6, 182, 176, .40) 0%, rgba(11, 79, 108, .10) 100%) !important;
    color: #ffffff !important;
    /* .logo 在红线清单内，只能改 border-color 不能改 border-width
       （style.css:6979 原值是 `border-bottom:0 solid transparent`），
       所以分隔线改用 inset box-shadow 画，视觉等效、零布局影响。 */
    border-bottom-width: 0 !important;
    border-bottom-style: solid !important;
    border-bottom-color: transparent !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .14) !important;
    text-shadow: 0 1px 2px rgba(11, 79, 108, .55);
}

/* LOGO 外层 <a>（index.html:28 `<a th:href="@{/index}"><li class="logo">`）
   会被 bootstrap 的 a:hover{text-decoration:underline} 命中，冒出白色下划线。 */
nav.navbar-static-side > a,
nav.navbar-static-side > a:hover,
nav.navbar-static-side > a:focus {
    text-decoration: none !important;
}

.logo:hover,
nav .logo:hover,
.skin-blue .logo:hover,
.skin-green .logo:hover,
.skin-purple .logo:hover,
.skin-red .logo:hover,
.skin-yellow .logo:hover {
    background-color: rgba(6, 182, 176, .38) !important;
    color: #ffffff !important;
}

.logo-lg,
.logo-mini,
.logo-element {
    color: #ffffff !important;
    font-weight: 700;
    letter-spacing: 2px;
}

/* ---- 3.7 用户面板：保留原功能性隐藏规则 ---- */
.user-panel {
    display: none !important;
}

.skin-blue .user-panel > .info, .skin-blue .user-panel > .info > a,
.skin-green .user-panel > .info, .skin-green .user-panel > .info > a,
.skin-purple .user-panel > .info, .skin-purple .user-panel > .info > a,
.skin-red .user-panel > .info, .skin-red .user-panel > .info > a,
.skin-yellow .user-panel > .info, .skin-yellow .user-panel > .info > a,
.theme-dark .user-panel, .theme-light .user-panel, .theme-blue .user-panel {
    background-color: transparent !important;
    color: #ffffff !important;
}

/* ---- 3.8 ≤350px 的关闭叉：侧栏是深色，改沙滩白 ---- */
.nav-close,
.nav-close i {
    color: var(--carib-sand, #f7f0e3) !important;
    opacity: .85;
}

.nav-close:hover,
.nav-close:hover i {
    color: var(--carib-coral, #ff6b5b) !important;
    opacity: 1;
}

/* ---- 3.9 slimScroll（inline style，必须 !important；width 禁改） ---- */
.slimScrollBar {
    background: var(--carib-turq, #06b6b0) !important;
    opacity: .55 !important;
    border-radius: var(--carib-radius, 8px) !important;
}

.slimScrollBar:hover {
    opacity: .85 !important;
}

.slimScrollRail {
    background: rgba(11, 79, 108, .35) !important;
    border-radius: var(--carib-radius, 8px) !important;
}

/* ---- 3.10 收起态 mini-navbar：悬浮标题气泡 + 悬浮二级面板 ---- */
.fixed-sidebar.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.theme-dark.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.theme-light.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.theme-blue.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.skin-blue.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.skin-green.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.skin-purple.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.skin-red.mini-navbar .nav li:hover > a > span.nav-label,
.fixed-sidebar.skin-yellow.mini-navbar .nav li:hover > a > span.nav-label {
    background-color: var(--carib-ocean, #0a7d8c) !important;
    color: #ffffff !important;
    border-radius: 0 var(--carib-radius-sm, 6px) 0 0 !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.fixed-sidebar.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.theme-dark.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.theme-light.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.theme-blue.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.skin-blue.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.skin-green.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.skin-purple.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.skin-red.mini-navbar .nav li:hover > .nav-second-level,
.fixed-sidebar.skin-yellow.mini-navbar .nav li:hover > .nav-second-level {
    background-color: var(--carib-deep, #0b4f6c) !important;
    border-radius: 0 var(--carib-radius-sm, 6px) var(--carib-radius-sm, 6px) 0 !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    scrollbar-color: var(--carib-turq, #06b6b0) var(--carib-deep, #0b4f6c) !important;
}

.fixed-sidebar.mini-navbar .nav li:hover > .nav-second-level::-webkit-scrollbar {
    background: transparent !important;
}

.fixed-sidebar.mini-navbar .nav li:hover > .nav-second-level::-webkit-scrollbar-thumb {
    background: var(--carib-turq, #06b6b0) !important;
    border-radius: 4px !important;
}

body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav li:hover > .nav-second-level,
.mini-navbar .nav li:focus > .nav-second-level {
    background-color: var(--carib-deep, #0b4f6c) !important;
    border-radius: 0 var(--carib-radius-sm, 6px) var(--carib-radius-sm, 6px) 0 !important;
}

body.mini-navbar .navbar-default .nav > li > .nav-second-level li a,
body.fixed-sidebar.mini-navbar .navbar-default .nav > li > .nav-second-level li a {
    border-radius: 0 var(--carib-radius-sm, 6px) var(--carib-radius-sm, 6px) 0 !important;
    color: var(--carib-menu-2, rgba(255, 255, 255, .62)) !important;
}

body.fixed-sidebar.mini-navbar .navbar-default .nav > li > .nav-second-level li a:hover {
    color: var(--carib-menu-hover, #d9f2f0) !important;
    background-color: rgba(6, 182, 176, .22) !important;
}

.fixed-sidebar.mini-navbar .nav li.active {
    border-left-color: transparent !important;
}


/* ==========================================================================
   4. 顶部导航栏（沙滩白 + 绿松石下边线，深色文字）
   ========================================================================== */

/* ---- 4.1 顶栏底色：必须覆盖裸 .navbar 与全部 skin-* ---- */
.navbar,
.navbar-static-top,
.navbar-fixed-top,
.row.border-bottom .navbar-static-top,
#page-wrapper .navbar-static-top,
.white-bg .navbar-fixed-top,
.white-bg .navbar-static-top,
.skin-blue .navbar,
.skin-green .navbar,
.skin-purple .navbar,
.skin-red .navbar,
.skin-yellow .navbar {
    background: var(--carib-sand, #f7f0e3) !important;
    background-color: var(--carib-sand, #f7f0e3) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* 顶栏下边线：1px 边框颜色 + 2px 绿松石视觉线。
   注意不能画在 .row.border-bottom 上——它不是定位元素，而紧随其后的
   .content-tabs 是 position:relative（style.css:3267）且已被刷成不透明沙滩浅，
   按绘制顺序会把这条外投影完整盖掉；页签栏隐藏时则被 mainContent 的 iframe 盖掉。
   改画在顶栏 .navbar 自身的 inset 阴影上：不占布局、不会被兄弟元素遮挡。 */
.row.border-bottom,
.border-bottom {
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: none !important;
}

.row.border-bottom > .navbar.navbar-static-top,
.row.border-bottom .navbar-static-top,
#page-wrapper .navbar.navbar-static-top {
    box-shadow: inset 0 -2px 0 var(--carib-turq, #06b6b0) !important;
}

/* ---- 4.2 顶栏链接文字：从白色改回深海蓝 ---- */
.navbar-top-links li a,
.nav.navbar-top-links li a,
.nav.navbar-top-links > li > a,
.nav.navbar-right > li > a,
.nav.navbar-left > li > a,
.navbar .nav > li > a,
.skin-blue .navbar .nav > li > a,
.skin-green .navbar .nav > li > a,
.skin-purple .navbar .nav > li > a,
.skin-red .navbar .nav > li > a,
.skin-yellow .navbar .nav > li > a {
    color: var(--carib-deep, #0b4f6c) !important;
    background-color: transparent !important;
    text-shadow: none !important;
}

.navbar-top-links .fa,
.navbar-top-links .glyphicon,
.navbar-top-links i,
.navbar .nav > li > a > i,
.welcome-message i {
    color: var(--carib-ocean, #0a7d8c) !important;
}

.welcome-message .dropdown-toggle span,
.navbar-top-links .user-menu > a > span,
.welcome-message span {
    color: var(--carib-deep, #0b4f6c) !important;
}

/* ---- 4.3 顶栏 hover / active / open：绿松石浅底，不要 INSPINIA 蓝与黑纱 ---- */
.navbar-top-links li a:hover,
.nav.navbar-top-links li a:hover,
.nav.navbar-right > li > a:hover,
.nav.navbar-left > li > a:hover,
.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus,
.navbar .nav > li > a:active,
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus,
.skin-blue .navbar .nav > li > a:hover, .skin-blue .navbar .nav > li > a:active, .skin-blue .navbar .nav > li > a:focus,
.skin-blue .navbar .nav .open > a, .skin-blue .navbar .nav .open > a:hover, .skin-blue .navbar .nav .open > a:focus, .skin-blue .navbar .nav > .active > a,
.skin-green .navbar .nav > li > a:hover, .skin-green .navbar .nav > li > a:active, .skin-green .navbar .nav > li > a:focus,
.skin-green .navbar .nav .open > a, .skin-green .navbar .nav .open > a:hover, .skin-green .navbar .nav .open > a:focus, .skin-green .navbar .nav > .active > a,
.skin-purple .navbar .nav > li > a:hover, .skin-purple .navbar .nav > li > a:active, .skin-purple .navbar .nav > li > a:focus,
.skin-purple .navbar .nav .open > a, .skin-purple .navbar .nav .open > a:hover, .skin-purple .navbar .nav .open > a:focus, .skin-purple .navbar .nav > .active > a,
.skin-red .navbar .nav > li > a:hover, .skin-red .navbar .nav > li > a:active, .skin-red .navbar .nav > li > a:focus,
.skin-red .navbar .nav .open > a, .skin-red .navbar .nav .open > a:hover, .skin-red .navbar .nav .open > a:focus, .skin-red .navbar .nav > .active > a,
.skin-yellow .navbar .nav > li > a:hover, .skin-yellow .navbar .nav > li > a:active, .skin-yellow .navbar .nav > li > a:focus,
.skin-yellow .navbar .nav .open > a, .skin-yellow .navbar .nav .open > a:hover, .skin-yellow .navbar .nav .open > a:focus, .skin-yellow .navbar .nav > .active > a {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    background: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.navbar-top-links li a:hover i,
.navbar .nav > li > a:hover i {
    color: var(--carib-turq-dk, #048b87) !important;
}

/* ---- 4.4 收起按钮（index.html 第 82 行带 inline color:#FFF，必须 !important） ---- */
a.navbar-minimalize,
a.navbar-minimalize i,
.minimalize-styl-2,
.minimalize-styl-2 i,
.navbar-header a {
    color: var(--carib-deep, #0b4f6c) !important;
}

a.navbar-minimalize,
.minimalize-styl-2 {
    background-color: var(--carib-coral, #ff6b5b) !important;
    border-color: var(--carib-coral, #ff6b5b) !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    box-shadow: 0 2px 8px rgba(255, 107, 91, .30) !important;
}

a.navbar-minimalize i,
.minimalize-styl-2 i {
    color: #ffffff !important;
}

a.navbar-minimalize:hover,
a.navbar-minimalize:focus,
.minimalize-styl-2:hover,
.minimalize-styl-2:focus {
    background-color: var(--carib-coral-dk, #e8543f) !important;
    border-color: var(--carib-coral-dk, #e8543f) !important;
    color: #ffffff !important;
}

/* ---- 4.5 用户头像与下拉 ---- */
.navbar-right > .user-menu .user-image {
    border: 2px solid var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 2px rgba(6, 182, 176, .18) !important;
}

.navbar-right > .user-menu > .dropdown-menu {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    border-bottom-left-radius: var(--carib-radius, 8px) !important;
    border-bottom-right-radius: var(--carib-radius, 8px) !important;
}

.navbar-top-links .dropdown-menu,
.navbar .dropdown-menu {
    background-color: #ffffff !important;
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    border-radius: var(--carib-radius, 8px) !important;
}

.navbar-top-links .dropdown-menu li a,
.navbar-top-links .dropdown-menu li a i {
    color: var(--carib-text, #0f3a49) !important;
}

.navbar-top-links .dropdown-menu li a:hover,
.navbar-top-links .dropdown-menu li a:focus,
.navbar-top-links .dropdown-menu li a:hover i {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}

/* 移动端（≤767px）皮肤专属下拉漏色点 */
@media (max-width: 767px) {
    .skin-blue .navbar .dropdown-menu li a,
    .skin-green .navbar .dropdown-menu li a,
    .skin-purple .navbar .dropdown-menu li a,
    .skin-red .navbar .dropdown-menu li a,
    .skin-yellow .navbar .dropdown-menu li a {
        color: var(--carib-text, #0f3a49) !important;
    }

    .skin-blue .navbar .dropdown-menu li a:hover,
    .skin-green .navbar .dropdown-menu li a:hover,
    .skin-purple .navbar .dropdown-menu li a:hover,
    .skin-red .navbar .dropdown-menu li a:hover,
    .skin-yellow .navbar .dropdown-menu li a:hover {
        background: var(--carib-turq-lt, #d9f2f0) !important;
        color: var(--carib-turq-dk, #048b87) !important;
    }
}

/* 折叠按钮（DOM 少用，兜底） */
.navbar-toggle,
.skin-blue .navbar .sidebar-toggle,
.skin-green .navbar .sidebar-toggle,
.skin-purple .navbar .sidebar-toggle,
.skin-red .navbar .sidebar-toggle,
.skin-yellow .navbar .sidebar-toggle {
    background-color: transparent !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

.navbar-toggle:hover,
.skin-blue .navbar .sidebar-toggle:hover,
.skin-green .navbar .sidebar-toggle:hover,
.skin-purple .navbar .sidebar-toggle:hover,
.skin-red .navbar .sidebar-toggle:hover,
.skin-yellow .navbar .sidebar-toggle:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}


/* ==========================================================================
   5. 页签栏 content-tabs（高度 39px / padding / margin 一律禁改）
   ========================================================================== */
.content-tabs,
.skin-blue .content-tabs,
.skin-green .content-tabs,
.skin-purple .content-tabs,
.skin-red .content-tabs,
.skin-yellow .content-tabs {
    background: var(--carib-sand-lt, #fdfaf3) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.content-tabs .roll-nav,
.content-tabs .page-tabs-list {
    color: var(--carib-muted, #5d7c88) !important;
}

.content-tabs .roll-left {
    border-right-color: var(--carib-border, #d7e8e8) !important;
}

.content-tabs .roll-right {
    border-left-color: var(--carib-border, #d7e8e8) !important;
}

.content-tabs button,
.roll-right.tabReload {
    background: var(--carib-sand-lt, #fdfaf3) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    color: var(--carib-ocean, #0a7d8c) !important;
}

.content-tabs button:hover,
.content-tabs .roll-nav:hover,
.roll-right.tabReload:hover {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

/* 页签本体：只改 color / background / border-color / border-radius */
.page-tabs a,
nav.page-tabs .page-tabs-content a {
    color: var(--carib-text, #0f3a49) !important;
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    transition: background-color .15s ease, color .15s ease;
}

.page-tabs a:hover {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.page-tabs a i {
    color: var(--carib-muted, #5d7c88) !important;
}

.page-tabs a i:hover {
    color: var(--carib-hibiscus, #e0453a) !important;
}

/* 选中页签：绿松石实心（需压过 skins.css 的五套 !important） */
.page-tabs a.active,
.content-tabs .page-tabs-content .active,
.skin-blue .page-tabs a.active,
.skin-green .page-tabs a.active,
.skin-purple .page-tabs a.active,
.skin-red .page-tabs a.active,
.skin-yellow .page-tabs a.active {
    color: #ffffff !important;
    background: var(--carib-turq, #06b6b0) !important;
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    box-shadow: 0 2px 6px rgba(6, 182, 176, .30) !important;
}

.page-tabs a.active:hover,
.skin-blue .page-tabs a.active:hover,
.skin-green .page-tabs a.active:hover,
.skin-purple .page-tabs a.active:hover,
.skin-red .page-tabs a.active:hover,
.skin-yellow .page-tabs a.active:hover {
    color: #ffffff !important;
    background: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-dk, #048b87) !important;
    border-color: var(--carib-turq-dk, #048b87) !important;
}

.page-tabs a.active i,
.page-tabs a.active:hover i {
    color: rgba(255, 255, 255, .85) !important;
}

.page-tabs a.active i:hover {
    color: #ffffff !important;
    background-color: transparent !important;
}

.ax_close_max {
    color: var(--carib-muted, #5d7c88) !important;
}

.ax_close_max:hover {
    color: var(--carib-hibiscus, #e0453a) !important;
}

.content-tabs .btn-group a {
    color: var(--carib-muted, #5d7c88) !important;
}

.content-tabs .btn-group a:hover {
    color: var(--carib-turq-dk, #048b87) !important;
}

/* ---- 5.1 页签右键菜单 jquery.contextMenu ----
   index.js:585 `$.contextMenu({selector:".menuTab", trigger:'right'})`，
   .menuTab 就是 .page-tabs a。jquery.contextMenu.min.css 在本文件之前加载，
   原厂配色是 #2980b9 宝蓝 hover 条 + #bebebe 灰边 + rgba(0,0,0,.5) 浓黑投影。
   只改 color / background / border-color / border-radius / box-shadow。 */
.context-menu-list {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.context-menu-item {
    color: var(--carib-text, #0f3a49) !important;
    background-color: transparent !important;
}

.context-menu-item.context-menu-hover,
.context-menu-item.context-menu-visible {
    color: #ffffff !important;
    background-color: var(--carib-turq, #06b6b0) !important;
}

.context-menu-item.context-menu-disabled,
.context-menu-input.context-menu-hover {
    color: var(--carib-muted, #5d7c88) !important;
    background-color: transparent !important;
}

.context-menu-separator {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.context-menu-icon::before,
.context-menu-icon.context-menu-icon--fa::before,
.context-menu-icon.context-menu-icon--fa5 i,
.context-menu-icon.context-menu-icon--fa5 svg {
    color: var(--carib-turq-dk, #048b87) !important;
}

.context-menu-icon.context-menu-hover:before,
.context-menu-icon.context-menu-icon--fa.context-menu-hover:before,
.context-menu-icon.context-menu-icon--fa5.context-menu-hover > i,
.context-menu-icon.context-menu-icon--fa5.context-menu-hover > svg {
    color: #ffffff !important;
}

.context-menu-icon.context-menu-disabled::before,
.context-menu-icon.context-menu-icon--fa.context-menu-disabled::before,
.context-menu-icon.context-menu-icon--fa5.context-menu-disabled i,
.context-menu-icon.context-menu-icon--fa5.context-menu-disabled svg {
    color: #a8bcc4 !important;
}

.context-menu-submenu:after {
    border-left-color: var(--carib-deep, #0b4f6c) !important;
}

.context-menu-item.context-menu-hover.context-menu-submenu:after {
    border-left-color: #ffffff !important;
}


/* ==========================================================================
   6. 横向菜单模式（index-topnav.html）独有部分
   ========================================================================== */
.navbar .navbar-toolbar > li > a,
.nav-tabs > li > a,
#navMenu .nav-tabs > li > a,
#navMenu .navbar-toolbar > li > a {
    color: var(--carib-deep, #0b4f6c) !important;
    background-color: transparent !important;
}

.navbar .navbar-toolbar > li > a:hover,
.navbar .navbar-toolbar > li > a:focus,
#navMenu .nav-tabs > li > a:hover,
#navMenu .nav-tabs > li > a:focus {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

/* 顶栏横向菜单选中项：绿松石底纹 + 珊瑚下边指示（border 用 !important 压 skins.css:11） */
.navbar .navbar-toolbar > li.active,
.navbar .nav.navbar-toolbar > li.active,
#navMenu .navbar-toolbar > li.active {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-left: 0 !important;
    border-radius: var(--carib-radius-sm, 6px) var(--carib-radius-sm, 6px) 0 0 !important;
    box-shadow: inset 0 -3px 0 var(--carib-coral, #ff6b5b) !important;
}

.navbar .navbar-toolbar > li.active > a,
.navbar .nav > .active > a,
#navMenu .navbar-toolbar > li.active > a {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: transparent !important;
    font-weight: 600;
}

/* 溢出「≡」下拉（resize-tabs.js 动态生成） */
.navbar-toolbar > li.dropdown > a.dropdown-toggle,
.navbar-toolbar > li.dropdown > a.dropdown-toggle i,
.navbar-toolbar > li.dropdown > a.dropdown-toggle b.caret {
    color: var(--carib-deep, #0b4f6c) !important;
}

.navbar-toolbar .dropdown-menu {
    background-color: #ffffff !important;
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.navbar-toolbar .dropdown-menu > li > a {
    color: var(--carib-text, #0f3a49) !important;
}

.navbar-toolbar .dropdown-menu > li > a:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

/* 溢出下拉里的「当前所在菜单」高亮：上一条 (0,2,2) 会压过通用的
   `.dropdown-menu>.active>a` (0,2,1)，而 skin-* 兜底 (0,3,1) 依赖 body 上的
   skin 类（index.html:177 由 JS 加），skinName 为空或首屏 JS 未执行时没有高亮。 */
.navbar-toolbar .dropdown-menu > li.active > a,
.navbar-toolbar .dropdown-menu > li.active > a:hover,
.navbar-toolbar .dropdown-menu > li.active > a:focus,
#navMenu .dropdown-menu > li.active > a {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.navbar-toolbar .dropdown-menu > li.active > a > i,
#navMenu .dropdown-menu > li.active > a > i {
    color: #ffffff !important;
}

/* 侧栏一级链接（topnav 模式独有 class） */
.navbar-static-side .menu-content,
.navbar-static-side a.menu-content {
    color: var(--carib-menu-1, rgba(255, 255, 255, .82)) !important;
}

.navbar-static-side a.menu-content:hover {
    color: var(--carib-menu-hover, #d9f2f0) !important;
}


/* ==========================================================================
   7. 按钮全套（7 变体 × 常态 / hover / focus / active / disabled）
   ========================================================================== */
.btn {
    border-radius: var(--carib-radius-sm, 6px) !important;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

/* ---- primary = 珊瑚 ---- */
.btn-primary,
.btn-primary.active,
.open .dropdown-toggle.btn-primary,
.ibox-tools a.btn-primary {
    background-color: var(--carib-coral, #ff6b5b) !important;
    border-color: var(--carib-coral, #ff6b5b) !important;
    color: #ffffff !important;
    background-image: none !important;
    box-shadow: 0 2px 6px rgba(255, 107, 91, .28);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active:hover {
    background-color: var(--carib-coral-dk, #e8543f) !important;
    border-color: var(--carib-coral-dk, #e8543f) !important;
    color: #ffffff !important;
}

.btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus,
.btn-primary.disabled:active, .btn-primary.disabled.active,
.btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:focus,
.btn-primary[disabled]:active, .btn-primary[disabled].active,
fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary.active {
    background-color: #ffb0a6 !important;
    border-color: #ffb0a6 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* ---- success = 棕榈绿 ---- */
.btn-success,
.btn-success.active,
.open .dropdown-toggle.btn-success {
    background-color: var(--carib-palm, #2fa36b) !important;
    border-color: var(--carib-palm, #2fa36b) !important;
    color: #ffffff !important;
    background-image: none !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background-color: var(--carib-palm-dk, #238555) !important;
    border-color: var(--carib-palm-dk, #238555) !important;
    color: #ffffff !important;
}

.btn-success.disabled, .btn-success.disabled:hover, .btn-success.disabled:focus,
.btn-success[disabled], .btn-success[disabled]:hover, .btn-success[disabled]:focus,
fieldset[disabled] .btn-success, fieldset[disabled] .btn-success:hover {
    background-color: #94d3b3 !important;
    border-color: #94d3b3 !important;
    color: #ffffff !important;
}

/* ---- info = 绿松石 ---- */
.btn-info,
.btn-info.active,
.open .dropdown-toggle.btn-info {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
    background-image: none !important;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active {
    background-color: var(--carib-turq-dk, #048b87) !important;
    border-color: var(--carib-turq-dk, #048b87) !important;
    color: #ffffff !important;
}

.btn-info.disabled, .btn-info.disabled:hover,
.btn-info[disabled], .btn-info[disabled]:hover,
fieldset[disabled] .btn-info, fieldset[disabled] .btn-info:hover {
    background-color: #8fdcd9 !important;
    border-color: #8fdcd9 !important;
    color: #ffffff !important;
}

/* ---- warning = 落日金 ---- */
.btn-warning,
.btn-warning.active,
.open .dropdown-toggle.btn-warning {
    background-color: var(--carib-gold, #f4b942) !important;
    border-color: var(--carib-gold, #f4b942) !important;
    color: #5a3d05 !important;
    background-image: none !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: var(--carib-gold-dk, #d99a1f) !important;
    border-color: var(--carib-gold-dk, #d99a1f) !important;
    color: #ffffff !important;
}

.btn-warning.disabled, .btn-warning.disabled:hover,
.btn-warning[disabled], .btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning, fieldset[disabled] .btn-warning:hover {
    background-color: #fadfa5 !important;
    border-color: #fadfa5 !important;
    color: #9c8146 !important;
}

/* ---- danger = 木槿红 ---- */
.btn-danger,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
    background-color: var(--carib-hibiscus, #e0453a) !important;
    border-color: var(--carib-hibiscus, #e0453a) !important;
    color: #ffffff !important;
    background-image: none !important;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background-color: var(--carib-hibiscus-dk, #b83026) !important;
    border-color: var(--carib-hibiscus-dk, #b83026) !important;
    color: #ffffff !important;
}

.btn-danger.disabled, .btn-danger.disabled:hover,
.btn-danger[disabled], .btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger, fieldset[disabled] .btn-danger:hover {
    background-color: #efa9a3 !important;
    border-color: #efa9a3 !important;
    color: #ffffff !important;
}

/* ---- default / white ---- */
.btn-default,
.btn-default.active {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.btn-default.disabled, .btn-default.disabled:hover,
.btn-default[disabled], .btn-default[disabled]:hover,
fieldset[disabled] .btn-default, fieldset[disabled] .btn-default:hover {
    background-color: #f2f6f6 !important;
    border-color: #e3eeee !important;
    color: #a8bcc4 !important;
}

.btn-white {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.btn-white:hover,
.btn-white:focus,
.btn-white:active,
.btn-white.active,
.open .dropdown-toggle.btn-white {
    border-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.btn-white:active,
.btn-white.active {
    box-shadow: 0 2px 5px rgba(11, 79, 108, .12) inset !important;
}

/* ---- link ---- */
.btn-link {
    color: var(--carib-turq, #06b6b0) !important;
}

.btn-link:hover,
.btn-link:focus,
.btn-link:active,
.btn-link.active,
.open .dropdown-toggle.btn-link {
    color: var(--carib-turq-dk, #048b87) !important;
}

.btn-link.disabled, .btn-link[disabled],
fieldset[disabled] .btn-link {
    color: #a8bcc4 !important;
}

/* ---- outline ---- */
.btn-outline {
    background: transparent !important;
}

.btn-primary.btn-outline { color: var(--carib-coral, #ff6b5b) !important; }
.btn-success.btn-outline { color: var(--carib-palm, #2fa36b) !important; }
.btn-info.btn-outline    { color: var(--carib-turq, #06b6b0) !important; }
.btn-warning.btn-outline { color: var(--carib-gold-dk, #d99a1f) !important; }
.btn-danger.btn-outline  { color: var(--carib-hibiscus, #e0453a) !important; }

.btn-primary.btn-outline:hover { color: #ffffff !important; background-color: var(--carib-coral, #ff6b5b) !important; }
.btn-success.btn-outline:hover { color: #ffffff !important; background-color: var(--carib-palm, #2fa36b) !important; }
.btn-info.btn-outline:hover    { color: #ffffff !important; background-color: var(--carib-turq, #06b6b0) !important; }
.btn-warning.btn-outline:hover { color: #ffffff !important; background-color: var(--carib-gold-dk, #d99a1f) !important; }
.btn-danger.btn-outline:hover  { color: #ffffff !important; background-color: var(--carib-hibiscus, #e0453a) !important; }

/* ry-ui 搜索按钮（原 INSPINIA 绿 #1ab394） */
.search-btn,
.search-btn:hover,
.search-btn:focus {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.search-btn:hover {
    background-color: var(--carib-turq-dk, #048b87) !important;
    border-color: var(--carib-turq-dk, #048b87) !important;
}


/* ==========================================================================
   8. 表格全套（bootstrap-table / 树表 / 冻结列 / 分页 / 工具栏）
   ========================================================================== */

/* ---- 8.1 容器与外框 ---- */
.select-table,
.search-collapse,
.bootstrap-table {
    background: #ffffff !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

/* 真实 DOM 是 <div class="select-table"><div class="bootstrap-table">，
   内层卡片完全嵌在外层卡片里，两层阴影叠加会在外卡片内缘出现一圈光晕。
   只撤内层的阴影，保留 .bootstrap-table 独立使用时的白底与阴影。 */
.select-table > .bootstrap-table,
.search-collapse .bootstrap-table {
    box-shadow: none !important;
}

.fixed-table-container,
.bootstrap-table .fixed-table-container {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
}

.bootstrap-table .fixed-table-container.fixed-height:not(.has-footer) {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.bootstrap-table .fixed-table-container.fixed-height .fixed-table-border {
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
}

.bootstrap-table.fullscreen {
    background: var(--carib-foam, #eef7f7) !important;
}

.fixed-table-footer,
.bootstrap-table .fixed-table-footer {
    border-top-color: var(--carib-border, #d7e8e8) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

.table-bordered,
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > tfoot > tr > td {
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* 加载遮罩 */
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading {
    background: rgba(255, 255, 255, .92) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot,
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after,
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::before {
    background: var(--carib-turq, #06b6b0) !important;
}

/* .loading-wrap / .loading-text 是独立元素，bt.min.css 给了 font-size 没给
   color，显式落色以防继承链被 td 的 !important 打断 */
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap,
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-text {
    color: var(--carib-deep, #0b4f6c) !important;
}

/* ---- 8.2 表头 ---- */
.table-striped table thead,
.table-striped .table > thead > tr > th,
.table-striped table > thead > tr > th,
.table > thead > tr > th,
.table-bordered > thead > tr > th,
.table-bordered table > thead > tr > th,
.bootstrap-table .fixed-table-container .table thead th,
.bootstrap-table .fixed-table-container .table thead th .th-inner,
.bootstrap-table .fixed-table-container.fixed-height .table thead th {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    font-weight: 600 !important;
    border-top-color: var(--carib-border, #d7e8e8) !important;
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
    text-shadow: none !important;
}

.bootstrap-table .fixed-table-container .table thead th .th-inner {
    background-color: transparent !important;
}

/* style.css:3388 的选择器是 `>thead>tr>th, >thead>tr>td` 两条分支，
   手写表格里用 <thead><tr><td>（合并/分组表头）会漏掉，仍是灰 #F5F5F6 */
.table-bordered > thead > tr > td,
.table-striped table > thead > tr > td,
.table > thead > tr > td {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* 表尾（showFooter:true，ry-ui.js:100 支持）：与表头成体系，避免裸行断层 */
.table > tfoot > tr > th,
.table-bordered > tfoot > tr > th,
.bootstrap-table .fixed-table-container .table tfoot th,
.bootstrap-table .fixed-table-container .table tfoot th .th-inner {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-top-color: var(--carib-turq, #06b6b0) !important;
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
}

/* th-inner 自身要透明，否则在 th 的沙滩底上再压一层同色块、边缘出现色阶 */
.bootstrap-table .fixed-table-container .table tfoot th .th-inner {
    background-color: transparent !important;
}

/* 排序表头的可点击反馈（bt.min.css 只给了 cursor:pointer，无任何视觉） */
.bootstrap-table .fixed-table-container .table thead th .th-inner.sortable:hover {
    background-color: var(--carib-turq-md, #b8ebe6) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

/* ---- 8.3 单元格与行 ---- */
.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table-striped table > tbody > tr > td,
.table-bordered table > tbody > tr > td,
.bootstrap-table .fixed-table-container .table tbody td {
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.table > tbody > tr {
    background-color: #ffffff;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--carib-sand-lt, #fdfaf3);
}

/* hover 行：CSS :hover 与 bootstrap-table 的 .hover class 两条路径都要盖 */
.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:hover > td,
.table > tbody > tr:hover > td,
.bootstrap-table .table-hover > tbody > tr.hover > td,
.bootstrap-table .fixed-table-container .table-hover > tbody > tr:hover > td {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

/* 选中行：覆盖 ry-ui.css:1113 残留的 AntD 蓝 */
.bootstrap-table .fixed-table-container .table tbody tr.selected td,
.bootstrap-table .fixed-table-container .table tbody tr.selected:hover td,
.table > tbody > tr.selected > td {
    background-color: var(--carib-turq-md, #b8ebe6) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

/* 语义行 */
.table > tbody > tr.active > td, .table > tbody > tr > td.active,
.table-hover > tbody > tr.active:hover > td {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}
.table > tbody > tr.success > td, .table > tbody > tr > td.success,
.table-hover > tbody > tr.success:hover > td {
    background-color: #ddf1e7 !important;
}
.table > tbody > tr.info > td, .table > tbody > tr > td.info,
.table-hover > tbody > tr.info:hover > td {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}
.table > tbody > tr.warning > td, .table > tbody > tr > td.warning,
.table-hover > tbody > tr.warning:hover > td {
    background-color: #fdf1d8 !important;
}
.table > tbody > tr.danger > td, .table > tbody > tr > td.danger,
.table-hover > tbody > tr.danger:hover > td {
    background-color: #fbe0de !important;
}

/* 空数据 / 详情展开行 */
.bootstrap-table .fixed-table-container .table tbody tr.no-records-found td {
    color: var(--carib-muted, #5d7c88) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

.bootstrap-table .fixed-table-container .table tbody tr.detail-view > td,
.table tbody tr.detail-view > td {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

.detail-icon {
    color: var(--carib-turq, #06b6b0) !important;
}

/* 拖拽排序态（ry-ui.css:1069 / 1097 还带 #111 / #333 / #C6C6C6 的 inset 阴影，
   压在海水蓝与绿松石浅底上会发脏，一并换成深海蓝 / 绿松石半透明） */
.reorder-rows-on-drag-class td {
    color: #ffffff !important;
    background: var(--carib-ocean, #0a7d8c) !important;
    text-shadow: none !important;
    box-shadow: 0 12px 14px -12px rgba(11, 79, 108, .55) inset,
                0 -2px 2px -1px rgba(11, 79, 108, .35) inset !important;
}

.ui-sortable-placeholder {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    border-top-color: var(--carib-turq, #06b6b0) !important;
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
    -moz-box-shadow: 4px 5px 4px rgba(6, 182, 176, .28) inset !important;
    -webkit-box-shadow: 4px 5px 4px rgba(6, 182, 176, .28) inset !important;
    box-shadow: 4px 5px 4px rgba(6, 182, 176, .28) inset !important;
}

/* 卡片视图（cardView / mobileResponsive，ry-ui.js:120 支持）：
   bt.min.css 只给 .card-view-title 一个 font-weight，无任何颜色 */
.bootstrap-table .fixed-table-container .table .card-views {
    color: var(--carib-text, #0f3a49) !important;
}

.bootstrap-table .fixed-table-container .table .card-view-title {
    color: var(--carib-deep, #0b4f6c) !important;
}

.bootstrap-table .fixed-table-container .table .card-view-value {
    color: var(--carib-text, #0f3a49) !important;
}

.bootstrap-table .fixed-table-container .table .card-view {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.bootstrap-table .fixed-table-container.fixed-height.has-card-view {
    border-top-color: var(--carib-border, #d7e8e8) !important;
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.dragtable-sortable li {
    background: #ffffff !important;
}

.dragtable-sortable li:first-child th,
.dragtable-sortable li:first-child td {
    border-left-color: var(--carib-border, #d7e8e8) !important;
}

.rc-handle {
    background-color: var(--carib-turq, #06b6b0) !important;
}

/* ---- 8.4 排序箭头（重写 inline SVG data-uri，原为灰 #dcdcdc / 紫蓝 #7B83DB）
       bt.min.css:26-28 是 `tfoot th, thead th` 逗号分组，thead / tfoot 两个分支
       都要重写，否则 showFooter 的表尾箭头仍是紫蓝 %237B83DB。
       .both 的 background-position 保持 bt 原值 `center right 2px`，
       写成 `right` 会把箭头顶到单元格最右缘、与右边框贴死。 ---- */
.bootstrap-table .fixed-table-container .table thead th .both,
.bootstrap-table .fixed-table-container .table tfoot th .both {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%235d7c88' fill-opacity='.55' d='M8 2l4 5H4z'/%3E%3Cpath fill='%235d7c88' fill-opacity='.55' d='M8 14l4-5H4z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center right 2px !important;
    background-size: 16px 16px !important;
}

.bootstrap-table .fixed-table-container .table tfoot th .asc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2306b6b0' d='M8 3l5 6H3z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right !important;
    background-size: 16px 16px !important;
}

.bootstrap-table .fixed-table-container .table tfoot th .desc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2306b6b0' d='M8 13l5-6H3z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right !important;
    background-size: 16px 16px !important;
}

.bootstrap-table .fixed-table-container .table thead th .asc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2306b6b0' d='M8 3l5 6H3z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right !important;
    background-size: 16px 16px !important;
}

.bootstrap-table .fixed-table-container .table thead th .desc {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2306b6b0' d='M8 13l5-6H3z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right !important;
    background-size: 16px 16px !important;
}

/* ---- 8.5 冻结列（必须与表体同底色，否则横向滚动撞色） ---- */
.fixed-columns,
.fixed-columns-right {
    background-color: #ffffff !important;
    box-shadow: 0 0 10px rgba(11, 79, 108, .12) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* ---- 8.6 工具栏 ---- */
.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group > .btn {
    border-radius: 0 !important;
}

.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:first-child > .btn {
    border-top-left-radius: var(--carib-radius-sm, 6px) !important;
    border-bottom-left-radius: var(--carib-radius-sm, 6px) !important;
}

.bootstrap-table .fixed-table-toolbar .columns .btn-group > .btn-group:last-child > .btn {
    border-top-right-radius: var(--carib-radius-sm, 6px) !important;
    border-bottom-right-radius: var(--carib-radius-sm, 6px) !important;
}

.bootstrap-table .fixed-table-toolbar .columns .dropdown-menu {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.bootstrap-table .fixed-table-toolbar .columns label {
    color: var(--carib-text, #0f3a49) !important;
}

.bootstrap-table .fixed-table-toolbar .columns label:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}

/* ---- 8.7 分页 ---- */
.pagination > li > a,
.pagination > li > span {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.pagination > li > a:hover,
.pagination > li > a:focus,
.pagination > li > span:hover,
.pagination > li > span:focus {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus,
.pagination > .disabled > span,
.pagination > .disabled > span:hover {
    background-color: var(--carib-foam, #eef7f7) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: #a8bcc4 !important;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
    border-top-left-radius: var(--carib-radius-sm, 6px) !important;
    border-bottom-left-radius: var(--carib-radius-sm, 6px) !important;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
    border-top-right-radius: var(--carib-radius-sm, 6px) !important;
    border-bottom-right-radius: var(--carib-radius-sm, 6px) !important;
}

.bootstrap-table .fixed-table-pagination > .pagination-detail .pagination-info,
.bootstrap-table .fixed-table-pagination > .pagination-detail .page-list {
    color: var(--carib-muted, #5d7c88) !important;
}

.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a {
    color: var(--carib-muted, #5d7c88) !important;
}

.pageGo input {
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.pageGo button {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.pageGo button:hover,
.pageGo button:focus {
    background-color: var(--carib-turq-dk, #048b87) !important;
    border-color: var(--carib-turq-dk, #048b87) !important;
    color: #ffffff !important;
}

.bootstrap-table .fixed-table-pagination > .pagination ul.pagination li.page-intermediate a:hover {
    color: var(--carib-turq-dk, #048b87) !important;
}

/* ---- 8.8 树形表格（ry-ui.css 9 条 !important 边框） ---- */
.bootstrap-tree-table .treetable-thead th {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
}

/* ry-ui.css:955 `.bootstrap-tree-table .table-bordered .treetable-thead th`
   是 (0,3,1)+!important，会压过上面那条 (0,2,1)，冷灰 #e7eaec 竖线仍在 */
.bootstrap-tree-table .table-bordered .treetable-thead th {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
}

/* ry-ui.css:953 的 :first-child 左边框分支 */
.bootstrap-tree-table .treetable-thead tr :first-child,
.bootstrap-tree-table .treetable-tbody tr :first-child {
    border-left-color: var(--carib-border, #d7e8e8) !important;
}

.bootstrap-tree-table .treetable-tbody td,
.bootstrap-tree-table .table-bordered .treetable-tbody td {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.bootstrap-tree-table .table {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.bootstrap-tree-table .treetable-selected,
.bootstrap-tree-table .treetable-selected td {
    background: var(--carib-turq-md, #b8ebe6) !important;
    background-color: var(--carib-turq-md, #b8ebe6) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.bootstrap-tree-table .treetable-tbody tr:hover td {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}


/* ==========================================================================
   9. 若依搜索条件区 .select-list / .select-time / 操作按钮组
   ========================================================================== */
.select-list {
    border-radius: var(--carib-radius, 8px);
}

.select-list li {
    color: var(--carib-text, #0f3a49) !important;
}

.select-list li p,
.select-list li label:not(.radio-box),
.select-title,
.search-collapse .col-sm-6 .control-label {
    color: var(--carib-deep, #0b4f6c) !important;
}

.select-list li input,
.select-list li select,
.select-time input,
.select-time .time-input {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    background: #ffffff !important;
    color: var(--carib-text, #0f3a49) !important;
}

.select-list li input:focus,
.select-list li select:focus {
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .16) !important;
    outline: none !important;
}

.select-list .btn-default {
    color: var(--carib-text, #0f3a49) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    background: #ffffff !important;
}

.select-list .btn-default:hover,
.select-list .btn-default:focus,
.select-list .btn-default:active,
.select-list .btn-default.active {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.select-list li .submit-btn {
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

/* ry-ui.css:755 逗号分组污染了全站 .dropdown-menu li>a:focus（#12889a），必须盖 */
.select-list .dropdown-menu li > a:hover,
.dropdown-menu li > a:focus,
.dropdown-submenu:hover > a,
.bootstrap-select.form-control .dropdown-menu li > a:hover {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
}

.select-list .select2-container--bootstrap .select2-selection {
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.file-input .btn-default {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}


/* ==========================================================================
   10. 卡片：ibox / box / panel / well / detail-card
   ========================================================================== */
.ibox,
.ibox.float-e-margins {
    background-color: #ffffff !important;
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
    -webkit-box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

.ibox-title {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) var(--carib-radius, 8px) 0 0 !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.ibox-title h5 {
    color: var(--carib-deep, #0b4f6c) !important;
    font-weight: 600;
}

.ibox-content {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: 0 0 var(--carib-radius, 8px) var(--carib-radius, 8px) !important;
    color: var(--carib-text, #0f3a49);
}

.ibox-heading {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-bottom: none !important;
}

.ibox-tools a {
    color: var(--carib-muted, #5d7c88) !important;
}

.ibox-tools a:hover {
    color: var(--carib-turq, #06b6b0) !important;
}

.ibox-title-gray {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) var(--carib-radius, 8px) 0 0 !important;
}

.box {
    background: #ffffff !important;
    border-top-color: var(--carib-turq, #06b6b0) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

.box-main > .box-header {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.box-main form > .box-footer {
    background: var(--carib-sand-lt, #fdfaf3) !important;
    border-top-color: var(--carib-border, #d7e8e8) !important;
}

.btn-box-tool {
    background: transparent !important;
    color: var(--carib-muted, #5d7c88) !important;
}

.open .btn-box-tool,
.btn-box-tool:hover {
    color: var(--carib-turq, #06b6b0) !important;
}

.main-content {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* panel */
.panel {
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

.panel-default {
    border-color: var(--carib-border, #d7e8e8) !important;
}

.panel-default > .panel-heading {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.panel-primary,
.panel-primary > .panel-heading {
    background-color: var(--carib-coral, #ff6b5b) !important;
    border-color: var(--carib-coral, #ff6b5b) !important;
    color: #ffffff !important;
}

.panel-success,
.panel-success > .panel-heading {
    background-color: var(--carib-palm, #2fa36b) !important;
    border-color: var(--carib-palm, #2fa36b) !important;
    color: #ffffff !important;
}

.panel-info,
.panel-info > .panel-heading {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.panel-warning,
.panel-warning > .panel-heading {
    background-color: var(--carib-gold, #f4b942) !important;
    border-color: var(--carib-gold, #f4b942) !important;
    color: #5a3d05 !important;
}

.panel-danger,
.panel-danger > .panel-heading {
    background-color: var(--carib-hibiscus, #e0453a) !important;
    border-color: var(--carib-hibiscus, #e0453a) !important;
    color: #ffffff !important;
}

.panel-body {
    background-color: #ffffff !important;
    color: var(--carib-text, #0f3a49);
}

.tabs-container .panel-body {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: 0 var(--carib-radius, 8px) var(--carib-radius, 8px) var(--carib-radius, 8px) !important;
}

.well {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: inset 0 1px 1px rgba(11, 79, 108, .05) !important;
}

/* 详情卡片（ry-ui.css:1195-1257） */
.detail-card {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

.detail-card-title {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* ry-ui.css:1210 `.detail-card-title i{color:#888}` 是 (0,1,1)，压过上面的
   (0,1,0)，标题图标仍是冷灰，一行里两种色调 */
.detail-card-title i {
    color: var(--carib-turq, #06b6b0) !important;
}

/* ry-ui.css:1220 / 1242 的行分隔线与 td+th 竖线是冷灰 #f0f2f5 */
.detail-table tr {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.detail-table tr td + th {
    border-left-color: var(--carib-border, #d7e8e8) !important;
}

.detail-table th {
    background: var(--carib-sand-lt, #fdfaf3) !important;
    color: var(--carib-muted, #5d7c88) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

.detail-table td {
    color: var(--carib-text, #0f3a49) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

.detail-table tr:hover td {
    background: var(--carib-turq-lt, #d9f2f0) !important;
}

.tag-ok {
    background: #ddf1e7 !important;
    color: var(--carib-palm-dk, #238555) !important;
    border-color: #a9dcc3 !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.tag-err {
    background: #fbe0de !important;
    color: var(--carib-hibiscus-dk, #b83026) !important;
    border-color: #f0b6b1 !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.layer-disabled {
    border-color: var(--carib-border, #d7e8e8) !important;
    background: var(--carib-foam, #eef7f7) !important;
    color: var(--carib-muted, #5d7c88) !important;
}

.form-header {
    color: var(--carib-deep, #0b4f6c) !important;
    border-bottom-color: var(--carib-turq, #06b6b0) !important;
}


/* ==========================================================================
   11. 表单与第三方控件
   ========================================================================== */

/* ---- 11.1 原生表单 ---- */
.form-control,
.single-line {
    background: #ffffff none !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.form-control:focus,
.single-line:focus {
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .16) !important;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: var(--carib-foam, #eef7f7) !important;
    color: var(--carib-muted, #5d7c88) !important;
}

.form-control::-webkit-input-placeholder { color: #9db4bd !important; }
.form-control::-moz-placeholder { color: #9db4bd !important; }
.form-control:-ms-input-placeholder { color: #9db4bd !important; }
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { color: #9db4bd !important; }
input:-moz-placeholder,
textarea:-moz-placeholder { color: #9db4bd !important; }
input::-moz-placeholder,
textarea::-moz-placeholder { color: #9db4bd !important; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { color: #9db4bd !important; }

.input-group-addon {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.control-label {
    color: var(--carib-text, #0f3a49);
}

.control-label.is-required:before {
    color: var(--carib-hibiscus, #e0453a) !important;
}

.help-block {
    color: var(--carib-muted, #5d7c88) !important;
}

.has-success .form-control { border-color: var(--carib-palm, #2fa36b) !important; }
.has-warning .form-control { border-color: var(--carib-gold, #f4b942) !important; }
.has-error   .form-control { border-color: var(--carib-hibiscus, #e0453a) !important; }
.has-success .control-label { color: var(--carib-palm, #2fa36b) !important; }
.has-warning .control-label { color: var(--carib-gold-dk, #d99a1f) !important; }
.has-error   .control-label { color: var(--carib-hibiscus, #e0453a) !important; }

label.error {
    color: var(--carib-hibiscus, #e0453a) !important;
}

.Validform_error,
input.error,
textarea.error,
select.error,
select.error + label.error + .select2-container--bootstrap .select2-selection--single {
    background-color: #fbe0de !important;
    border-color: var(--carib-hibiscus, #e0453a) !important;
    color: var(--carib-hibiscus-dk, #b83026) !important;
}

.input-group input.error + label.error + .input-group-addon > i {
    color: var(--carib-hibiscus, #e0453a) !important;
}

/* ---- 11.2 iCheck（ry-ui.css 的 .icheckbox-blue / .iradio-blue 精灵图） ---- */
/* 用滤镜把蓝色精灵图转成绿松石，sprite 坐标逻辑与尺寸完全不动 */
.icheckbox-blue,
.iradio-blue,
.icheckbox,
.iradio {
    -webkit-filter: hue-rotate(-32deg) saturate(1.45);
    filter: hue-rotate(-32deg) saturate(1.45);
}

/* 原生 checkbox / radio：bootstrap-table 的全选列 .bs-checkbox 与列选择下拉
   都是原生 input（ry-ui.js 只对表单区做了 iCheck 化），默认强调色是系统蓝。
   accent-color 是纯颜色属性，不影响任何尺寸；旧内核不支持时降级为系统蓝。 */
input[type="checkbox"],
input[type="radio"],
.bs-checkbox input[type="checkbox"],
.bootstrap-table .fixed-table-toolbar .columns label input[type="checkbox"],
.bootstrap-tree-table .treetable-bars .columns li label input[type="checkbox"] {
    accent-color: var(--carib-turq, #06b6b0);
}

/* ---- 11.3 开关 toggle-switch（原 #33cabb） ---- */
.toggle-switch span {
    background-color: #dfeaea !important;
    border-color: #dfeaea !important;
}

.toggle-switch span:after {
    background-color: #ffffff !important;
    color: var(--carib-muted, #5d7c88) !important;
}

.toggle-switch input:checked ~ span:after {
    background-color: var(--carib-turq, #06b6b0) !important;
}

.switch-solid input:checked ~ span {
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.switch-solid input:checked ~ span:after {
    background-color: #ffffff !important;
    color: var(--carib-turq, #06b6b0) !important;
}

/* ---- 11.4 select2（只覆盖 --bootstrap 主题；插件 CSS 后加载，全部 !important） ---- */
.select2-container--bootstrap .select2-selection {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
    box-shadow: none !important;
}

.select2-container--bootstrap.select2-container--focus .select2-selection,
.select2-container--bootstrap.select2-container--open .select2-selection {
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .16) !important;
}

.select2-container--bootstrap .select2-dropdown {
    border-color: var(--carib-turq, #06b6b0) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    background-color: #ffffff !important;
}

.select2-container--bootstrap .select2-selection--single .select2-selection__rendered {
    color: var(--carib-text, #0f3a49) !important;
}

.select2-container--bootstrap .select2-selection--single .select2-selection__placeholder,
.select2-container--bootstrap .select2-selection--multiple .select2-selection__placeholder {
    color: #9db4bd !important;
}

.select2-container--bootstrap .select2-selection--single .select2-selection__arrow b {
    border-top-color: var(--carib-ocean, #0a7d8c) !important;
}

.select2-container--bootstrap.select2-container--open .select2-selection .select2-selection__arrow b {
    border-bottom-color: var(--carib-ocean, #0a7d8c) !important;
}

.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice,
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    color: #ffffff !important;
    background: var(--carib-turq, #06b6b0) !important;
    background-color: var(--carib-turq, #06b6b0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove {
    color: rgba(255, 255, 255, .85) !important;
}

.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #ffffff !important;
}

.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.select2-container--bootstrap .select2-results__option[aria-selected=true] {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.select2-container--bootstrap .select2-results__option[aria-disabled=true],
.select2-container--bootstrap .select2-results__group {
    color: var(--carib-muted, #5d7c88) !important;
}

.select2-container--bootstrap .select2-search--dropdown .select2-search__field {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.select2-container--bootstrap .select2-selection__clear {
    color: var(--carib-muted, #5d7c88) !important;
}

.select2-container--bootstrap .select2-selection__clear:hover {
    color: var(--carib-hibiscus, #e0453a) !important;
}

.select2-container--bootstrap.select2-container--disabled .select2-selection {
    border-color: var(--carib-border, #d7e8e8) !important;
    background-color: var(--carib-foam, #eef7f7) !important;
}

.has-error .select2-dropdown, .has-error .select2-selection { border-color: var(--carib-hibiscus, #e0453a) !important; }
.has-success .select2-dropdown, .has-success .select2-selection { border-color: var(--carib-palm, #2fa36b) !important; }
.has-warning .select2-dropdown, .has-warning .select2-selection { border-color: var(--carib-gold, #f4b942) !important; }

/* ---- 11.5 bootstrap-datetimepicker ---- */
.datetimepicker {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.datetimepicker table tr td,
.datetimepicker table tr th {
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.datetimepicker table tr td.day:hover,
.datetimepicker table tr td.hour:hover,
.datetimepicker table tr td.minute:hover,
.datetimepicker table tr td span:hover,
.datetimepicker thead tr:first-child th:hover,
.datetimepicker tfoot th:hover {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.datetimepicker table tr td.old,
.datetimepicker table tr td.new,
.datetimepicker table tr td span.old,
.datetimepicker table tr td span.new,
.datetimepicker table tr td.disabled,
.datetimepicker table tr td.disabled:hover,
.datetimepicker table tr td span.disabled {
    color: #a8bcc4 !important;
}

.datetimepicker table tr td.today,
.datetimepicker table tr td.today:hover,
.datetimepicker table tr td.today.disabled,
.datetimepicker table tr td.today.disabled:hover {
    background-color: var(--carib-gold, #f4b942) !important;
    background-image: none !important;
    border-color: var(--carib-gold-dk, #d99a1f) !important;
    color: #5a3d05 !important;
}

.datetimepicker table tr td.today.active,
.datetimepicker table tr td.today:active {
    background-color: var(--carib-gold-dk, #d99a1f) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.datetimepicker table tr td.active,
.datetimepicker table tr td.active:hover,
.datetimepicker table tr td.active.disabled,
.datetimepicker table tr td.active.disabled:hover,
.datetimepicker table tr td span.active,
.datetimepicker table tr td span.active:hover {
    background-color: var(--carib-turq, #06b6b0) !important;
    background-image: none !important;
    color: #ffffff !important;
    text-shadow: none !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.datetimepicker table tr td.active.active,
.datetimepicker table tr td.active:active,
.datetimepicker table tr td span.active.active {
    background-color: var(--carib-turq-dk, #048b87) !important;
    background-image: none !important;
    color: #ffffff !important;
}

[class*=" datetimepicker-dropdown"]:before { border-bottom-color: var(--carib-border, #d7e8e8) !important; }
[class*=" datetimepicker-dropdown"]:after  { border-bottom-color: #ffffff !important; }
[class*=" datetimepicker-dropdown-top"]:before { border-top-color: var(--carib-border, #d7e8e8) !important; }
[class*=" datetimepicker-dropdown-top"]:after  { border-top-color: #ffffff !important; }

/* ---- 11.6 laydate（layui.min.js 运行时注入，特异性需 > 源，一律加 body 前缀） ---- */
body .layui-laydate,
body .layui-laydate-hint {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    color: var(--carib-text, #0f3a49) !important;
}

body .layui-laydate .layui-this,
body .layui-laydate .layui-laydate-content td.layui-this,
body .layui-laydate .layui-laydate-list li.layui-this {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

body .layui-laydate-header {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

body .layui-laydate-header i,
body .layui-laydate-header span {
    color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-laydate-header i:hover,
body .layui-laydate-header span:hover {
    color: var(--carib-turq, #06b6b0) !important;
}

body .layui-laydate-content th { color: var(--carib-deep, #0b4f6c) !important; }
body .layui-laydate-content td { color: var(--carib-text, #0f3a49) !important; }

body .layui-laydate-content td:hover,
body .layui-laydate-list li:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

body .layui-laydate-content td.laydate-selected {
    background-color: var(--carib-turq-md, #b8ebe6) !important;
}

body .laydate-selected:hover {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

body .layui-laydate-content .laydate-day-prev,
body .layui-laydate-content .laydate-day-next {
    color: #a8bcc4 !important;
}

body .laydate-selected.laydate-day-prev,
body .laydate-selected.laydate-day-next {
    background-color: var(--carib-foam, #eef7f7) !important;
}

body .layui-laydate-footer {
    border-top-color: var(--carib-border, #d7e8e8) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
}

body .layui-laydate-footer span {
    border-color: var(--carib-border, #d7e8e8) !important;
    background-color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

body .layui-laydate-footer span:hover,
body .layui-laydate-footer span[lay-type="date"] {
    color: var(--carib-turq, #06b6b0) !important;
}

body .layui-laydate-footer span.layui-laydate-preview:hover {
    color: var(--carib-muted, #5d7c88) !important;
}

body .layui-laydate .laydate-disabled,
body .layui-laydate .laydate-disabled:hover {
    color: #c6d6da !important;
}

body .laydate-day-mark::after {
    background-color: var(--carib-turq, #06b6b0) !important;
}

body .layui-laydate-hint { color: var(--carib-hibiscus, #e0453a) !important; }
body .layui-laydate-list { background-color: #ffffff !important; }

body .layui-laydate-range .laydate-main-list-1 .layui-laydate-header,
body .layui-laydate-range .laydate-main-list-1 .layui-laydate-content {
    border-left-color: var(--carib-border, #d7e8e8) !important;
}

/* ---- 11.7 bootstrap-select ---- */
.bootstrap-select.form-control .btn-default {
    border-color: var(--carib-border, #d7e8e8) !important;
    background: #ffffff none !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover,
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active {
    color: #9db4bd !important;
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .16) !important;
}

.bootstrap-select.is-invalid .dropdown-toggle,
.has-error .bootstrap-select .dropdown-toggle {
    border-color: var(--carib-hibiscus, #e0453a) !important;
}

.bootstrap-select.is-valid .dropdown-toggle {
    border-color: var(--carib-palm, #2fa36b) !important;
}

.bootstrap-select .dropdown-menu li.active small {
    color: rgba(255, 255, 255, .7) !important;
}

.bootstrap-select .dropdown-menu .notify,
.bootstrap-select .no-results {
    background: var(--carib-foam, #eef7f7) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-muted, #5d7c88) !important;
}

/* ---- 11.8 ztree ---- */
div.ztree-border {
    border-color: var(--carib-border, #d7e8e8) !important;
    background: #ffffff none !important;
    border-radius: var(--carib-radius, 8px) !important;
}

.ztree,
.ztree li a {
    color: var(--carib-text, #0f3a49) !important;
    background-color: transparent !important;
}

.ztree li a:hover {
    color: var(--carib-turq-dk, #048b87) !important;
}

.ztree li a.curSelectedNode {
    background-color: var(--carib-turq-md, #b8ebe6) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.ztree li a.curSelectedNode_Edit {
    background-color: var(--carib-turq-md, #b8ebe6) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.ztree li a.tmpTargetNode_inner {
    background-color: var(--carib-ocean, #0a7d8c) !important;
    color: #ffffff !important;
    border-color: var(--carib-deep, #0b4f6c) !important;
}

.ztree li a input.rename {
    border-color: var(--carib-turq, #06b6b0) !important;
    border-radius: 4px !important;
}

ul.tmpTargetzTree { background-color: var(--carib-gold, #f4b942) !important; }

ul.ztree.zTreeDragUL {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.treeSearchInput input {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.treeSearchInput button {
    border-color: var(--carib-border, #d7e8e8) !important;
    background: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.treeShowHideButton,
.treeExpandCollapse,
.treeExpandCollapse a {
    color: var(--carib-deep, #0b4f6c) !important;
}

.treeExpandCollapse {
    background: var(--carib-sand-lt, #fdfaf3) !important;
}

/* ---- 11.9 summernote ---- */
.note-editor.note-frame,
.note-editor.note-airframe {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
}

.note-editor .note-toolbar,
.note-editor.note-frame .note-toolbar {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-bottom: 1px solid var(--carib-border, #d7e8e8) !important;
}

.note-editor.note-frame .note-statusbar {
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    border-top-color: var(--carib-border, #d7e8e8) !important;
}

.note-editor.note-frame .note-statusbar .note-resizebar .note-icon-bar {
    border-top-color: var(--carib-border, #d7e8e8) !important;
}

.note-editor.note-frame .note-status-output {
    color: var(--carib-text, #0f3a49) !important;
    border-top-color: var(--carib-border, #d7e8e8) !important;
}

.note-btn.active,
.note-btn:hover,
.note-toolbar .note-btn:hover {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: var(--carib-turq, #06b6b0) !important;
}

.note-editor .note-editing-area .note-codable {
    color: var(--carib-turq-lt, #d9f2f0) !important;
    background-color: var(--carib-deep, #0b4f6c) !important;
}

.note-editor .note-dropzone {
    color: var(--carib-turq, #06b6b0) !important;
    background-color: rgba(255, 255, 255, .9) !important;
}

.note-editor .note-dropzone.hover {
    color: var(--carib-turq-dk, #048b87) !important;
}

.note-editor.note-frame .note-editing-area .note-editable[contenteditable=false] {
    background-color: var(--carib-foam, #eef7f7) !important;
}

.note-dropdown-menu.note-check a i {
    color: var(--carib-turq, #06b6b0) !important;
}

.note-hint-popover .popover-content .note-hint-group .note-hint-item.active,
.note-hint-popover .popover-content .note-hint-group .note-hint-item:hover {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.note-palette .note-color-reset:hover,
.note-palette .note-color-select:hover {
    background: var(--carib-turq-lt, #d9f2f0) !important;
}

.note-modal .note-image-dialog .note-dropzone {
    color: var(--carib-muted, #5d7c88) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* ---- 11.10 通用 dropdown / nav-tabs / nav-pills / tooltip / popover ---- */
.dropdown-menu {
    background-color: #ffffff !important;
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.dropdown-menu > li > a {
    color: var(--carib-text, #0f3a49) !important;
    border-radius: var(--carib-radius-sm, 6px);
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus,
.skin-blue .dropdown-menu > .active > a, .skin-blue .dropdown-menu > .active > a:hover, .skin-blue .dropdown-menu > .active > a:focus,
.skin-green .dropdown-menu > .active > a, .skin-green .dropdown-menu > .active > a:hover, .skin-green .dropdown-menu > .active > a:focus,
.skin-purple .dropdown-menu > .active > a, .skin-purple .dropdown-menu > .active > a:hover, .skin-purple .dropdown-menu > .active > a:focus,
.skin-red .dropdown-menu > .active > a, .skin-red .dropdown-menu > .active > a:hover, .skin-red .dropdown-menu > .active > a:focus,
.skin-yellow .dropdown-menu > .active > a, .skin-yellow .dropdown-menu > .active > a:hover, .skin-yellow .dropdown-menu > .active > a:focus {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.dropdown-menu > .divider,
.dropdown-menu .divider {
    background-color: var(--carib-border, #d7e8e8) !important;
}

.dropdown-header {
    color: var(--carib-muted, #5d7c88) !important;
}

.nav-tabs {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.nav-tabs > li > a {
    color: var(--carib-muted, #5d7c88) !important;
    border-radius: var(--carib-radius-sm, 6px) var(--carib-radius-sm, 6px) 0 0 !important;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
    border-color: transparent !important;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background: #ffffff !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-color: var(--carib-border, #d7e8e8) var(--carib-border, #d7e8e8) transparent !important;
    font-weight: 600;
}

.tabs-container .nav-tabs {
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
}

.tabs-container .nav-tabs > li.active > a,
.tabs-container .nav-tabs > li.active > a:hover,
.tabs-container .nav-tabs > li.active > a:focus {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-bottom-color: transparent !important;
    background-color: #ffffff !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.tabs-container .nav-tabs > li a:hover {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: transparent !important;
}

.nav-tabs-custom > .nav-tabs > li.active > a,
.nav-tabs-custom > .nav-tabs > li.active {
    border-top-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

.nav-pills > li > a {
    color: var(--carib-text, #0f3a49) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.nav-pills > li > a:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    background-color: var(--carib-turq, #06b6b0) !important;
    color: #ffffff !important;
}

.tooltip-inner {
    background-color: var(--carib-deep, #0b4f6c) !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

.tooltip.top .tooltip-arrow    { border-top-color: var(--carib-deep, #0b4f6c) !important; }
.tooltip.right .tooltip-arrow  { border-right-color: var(--carib-deep, #0b4f6c) !important; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: var(--carib-deep, #0b4f6c) !important; }
.tooltip.left .tooltip-arrow   { border-left-color: var(--carib-deep, #0b4f6c) !important; }

/* bootstrap 还有 top-left / top-right / bottom-left / bottom-right 四个变体
   （border-*-color:#000），命中时会出现「深海蓝气泡 + 黑箭头」 */
.tooltip.top-left .tooltip-arrow,
.tooltip.top-right .tooltip-arrow {
    border-top-color: var(--carib-deep, #0b4f6c) !important;
}

.tooltip.bottom-left .tooltip-arrow,
.tooltip.bottom-right .tooltip-arrow {
    border-bottom-color: var(--carib-deep, #0b4f6c) !important;
}

.popover {
    background: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
    color: var(--carib-text, #0f3a49) !important;
}

.popover-title {
    background: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-bottom-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius, 8px) var(--carib-radius, 8px) 0 0 !important;
}

.popover.top > .arrow    { border-top-color: var(--carib-border, #d7e8e8) !important; }
.popover.right > .arrow  { border-right-color: var(--carib-border, #d7e8e8) !important; }
.popover.bottom > .arrow { border-bottom-color: var(--carib-border, #d7e8e8) !important; }
.popover.left > .arrow   { border-left-color: var(--carib-border, #d7e8e8) !important; }

/* .popover.bottom>.arrow:after 原本是 #f7f7f7，用来贴合 bootstrap 的
   .popover-title 底色；title 已改成绿松石浅，内箭头必须同步，否则露灰白三角。
   （top / right / left 的内箭头本来就是 #fff，与白色 popover 底一致，不动；
     这三个 :after 的其余三边必须保持 transparent 才能构成三角形。） */
.popover.bottom > .arrow:after {
    border-bottom-color: var(--carib-turq-lt, #d9f2f0) !important;
}


/* ==========================================================================
   12. layer 弹窗 + blockUI 遮罩
   （layer.css / moon/style.css / laydate.css 都是运行时 head.appendChild，
     文档顺序在本文件之后 → 一律 body 前缀 + !important）
   ========================================================================== */
body .layui-layer {
    background-color: #ffffff !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: 0 18px 45px rgba(11, 79, 108, .28) !important;
}

/* 上面那条 (0,1,1)+!important 会压过 layer.css 里【没有 !important】的
   .layui-layer-tips / -photos / -nobg / -loading 的 background:none，
   导致 tips 气泡外面套一圈白色圆角块 + 45px 巨投影、图片预览层出现白框。 */
body .layui-layer.layui-layer-tips,
body .layui-layer.layui-layer-photos,
body .layui-layer.layui-layer-nobg,
body .layui-layer.layui-layer-loading {
    background: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

body .layui-layer-border {
    border-color: var(--carib-border, #d7e8e8) !important;
}

body .layui-layer-shade {
    background-color: rgba(11, 79, 108, .55) !important;
}

body .layui-layer-title,
body .layer-ext-moon .layui-layer-title {
    background: var(--carib-sand, #f7f0e3) !important;
    background-color: var(--carib-sand, #f7f0e3) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    /* moon/style.css:21 原本是 border:none；加 1px 会让标题栏 42px→43px，
       layer.min.js 用 outerHeight() 实测算 iframe 高度，故改用 inset 阴影画线 */
    border: none !important;
    box-shadow: inset 0 -2px 0 var(--carib-turq, #06b6b0) !important;
    border-radius: var(--carib-radius, 8px) var(--carib-radius, 8px) 0 0 !important;
    font-weight: 600 !important;
}

body .layui-layer-content {
    color: var(--carib-text, #0f3a49) !important;
    background-color: #ffffff !important;
}

body .layui-layer-btn,
body .layer-ext-moon .layui-layer-btn {
    background: var(--carib-sand-lt, #fdfaf3) !important;
    border-top-color: var(--carib-border, #d7e8e8) !important;
}

body .layui-layer-btn a,
body .layer-ext-moon .layui-layer-btn a {
    background-color: #ffffff !important;
    border-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-text, #0f3a49) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
}

body .layui-layer-btn a:hover {
    border-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

body .layui-layer-btn .layui-layer-btn0,
body .layer-ext-moon .layui-layer-btn .layui-layer-btn0 {
    background-color: var(--carib-coral, #ff6b5b) !important;
    border-color: var(--carib-coral, #ff6b5b) !important;
    color: #ffffff !important;
}

body .layui-layer-btn .layui-layer-btn0:hover,
body .layer-ext-moon .layui-layer-btn .layui-layer-btn0:hover {
    background-color: var(--carib-coral-dk, #e8543f) !important;
    border-color: var(--carib-coral-dk, #e8543f) !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

body .layui-layer-btn .layui-layer-btn1,
body .layui-layer-btn .layui-layer-btn2,
body .layer-ext-moon .layui-layer-btn .layui-layer-btn1,
body .layer-ext-moon .layui-layer-btn .layui-layer-btn2 {
    background-color: #ffffff !important;
    border-color: var(--carib-turq, #06b6b0) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-layer-btn .layui-layer-btn1:hover,
body .layui-layer-btn .layui-layer-btn2:hover {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    color: var(--carib-turq-dk, #048b87) !important;
}

body .layui-layer-btn .layui-layer-btn3,
body .layer-ext-moon .layui-layer-btn .layui-layer-btn3 {
    background-color: var(--carib-hibiscus, #e0453a) !important;
    border-color: var(--carib-hibiscus, #e0453a) !important;
    color: #ffffff !important;
}

/* btn3 若不写 hover 会命中通用的 `.layui-layer-btn a:hover{color:#048b87}`，
   变成木槿红底 + 绿松石深字，对比度约 1.6:1 */
body .layui-layer-btn .layui-layer-btn3:hover,
body .layui-layer.layer-ext-moon .layui-layer-btn .layui-layer-btn3:hover {
    background-color: var(--carib-hibiscus-dk, #b83026) !important;
    border-color: var(--carib-hibiscus-dk, #b83026) !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

body .layui-layer-setwin span {
    color: var(--carib-muted, #5d7c88) !important;
}

/* moon 皮肤的关闭钮是 default.png 雪碧图，必须整条换成 inline SVG 才能变色。
   close1 在标题栏内（沙滩白底）→ 透明底 + 深海蓝 ✕ */
body .layer-ext-moon .layui-layer-setwin .layui-layer-close1 {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath stroke='%230b4f6c' stroke-width='1.7' stroke-linecap='round' d='M4 4l8 8M12 4l-8 8'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
    background-color: transparent !important;
}

body .layer-ext-moon .layui-layer-setwin .layui-layer-close1:hover {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath stroke='%23ff6b5b' stroke-width='1.9' stroke-linecap='round' d='M4 4l8 8M12 4l-8 8'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
    background-color: transparent !important;
}

/* close2（layer.css:130）是弹窗【外侧】的圆形关闭钮，压在已改成
   rgba(11,79,108,.55) 深海蓝的遮罩上 —— 深蓝 ✕ 会看不见，
   必须保留深海蓝圆底 + 白色 ✕，hover 珊瑚 */
body .layui-layer .layui-layer-setwin .layui-layer-close2,
body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-close2,
body .layui-layer.layui-layer-tab .layui-layer-setwin .layui-layer-close2 {
    background: var(--carib-deep, #0b4f6c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' d='M4.5 4.5l7 7M11.5 4.5l-7 7'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 10px 10px !important;
    color: transparent !important;
}

body .layui-layer .layui-layer-setwin .layui-layer-close2:hover,
body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-close2:hover,
body .layui-layer.layui-layer-tab .layui-layer-setwin .layui-layer-close2:hover {
    background-color: var(--carib-coral, #ff6b5b) !important;
    opacity: 1 !important;
}

/* 最小化 / 最大化 / 还原钮：ry-ui.js 的 $.modal.open 全部 maxmin:true，
   标题栏一定会出现它们；moon 的旧雪碧图与 #2D93CA 蓝会与新 SVG ✕ 并排穿帮。
   只改 background / border-*-color，不动 16×16 尺寸。 */
body .layui-layer-setwin .layui-layer-min:before {
    border-bottom-color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-layer-setwin .layui-layer-min:hover:before {
    background-color: var(--carib-coral, #ff6b5b) !important;
    border-bottom-color: var(--carib-coral, #ff6b5b) !important;
}

body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-min cite:hover {
    background-color: var(--carib-coral, #ff6b5b) !important;
}

body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-max {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='3.2' y='3.2' width='9.6' height='9.6' rx='1.4' fill='none' stroke='%230b4f6c' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
}

body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-max:hover {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='3.2' y='3.2' width='9.6' height='9.6' rx='1.4' fill='none' stroke='%23ff6b5b' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
}

body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-maxmin {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%230b4f6c' stroke-width='1.5' d='M5.8 5.8h6.4v6.4H5.8z'/%3E%3Cpath fill='none' stroke='%230b4f6c' stroke-width='1.5' d='M3.6 10.2V3.8h6.4'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
}

body .layui-layer.layer-ext-moon .layui-layer-setwin .layui-layer-maxmin:hover {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ff6b5b' stroke-width='1.7' d='M5.8 5.8h6.4v6.4H5.8z'/%3E%3Cpath fill='none' stroke='%23ff6b5b' stroke-width='1.7' d='M3.6 10.2V3.8h6.4'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 12px 12px !important;
}

/* dialog 图标（$.modal.alert / confirm / msgSuccess / msgError）
   ！！！不能只写 background-image:none ！！！
   图标 DOM 是 <i class="layui-layer-face layui-icon layui-icon-tips">，而全仓库
   没有任何 CSS 给 .layui-icon-tips/-success/-error/-question/-lock/-face-cry
   定义 :before content —— 它们【只有】moon 的 default.png 雪碧图一种呈现方式。
   抹掉 background-image 后 color 无处着色，只会剩下一块 32×32 空白。
   所以整套用同尺寸 inline SVG 重画，配色取自权威调色板；不动 width/height/top。 */

/* 提示 / 询问 —— 落日金 */
body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-tips,
body .layui-layer .layui-layer-content .layui-icon-tips {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23f4b942'/%3E%3Cpath fill='%23fff' d='M14.5 7h3l-.6 12.5h-1.8z'/%3E%3Ccircle cx='16' cy='24' r='2.1' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-question,
body .layui-layer .layui-layer-content .layui-icon-question {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23f4b942'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' d='M11.9 12.4a4.3 4.3 0 1 1 4.5 4.8v2.4'/%3E%3Ccircle cx='16.4' cy='23.4' r='2' fill='%23fff'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

/* 成功 —— 棕榈绿 */
body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-success,
body .layui-layer .layui-layer-content .layui-icon-success {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%232fa36b'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M9.5 16.5l4.6 4.6L22.5 12'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

/* 错误 —— 木槿红 */
body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-error,
body .layui-layer .layui-layer-content .layui-icon-error {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23e0453a'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' d='M11 11l10 10M21 11L11 21'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

/* 哭脸 / 笑脸 */
body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-face-cry,
body .layui-layer .layui-layer-content .layui-icon-face-cry {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%23e0453a'/%3E%3Ccircle cx='11.5' cy='13' r='1.9' fill='%23fff'/%3E%3Ccircle cx='20.5' cy='13' r='1.9' fill='%23fff'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' d='M10.8 22.5c1.6-3 8.8-3 10.4 0'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-face-smile,
body .layui-layer .layui-layer-content .layui-icon-face-smile {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%232fa36b'/%3E%3Ccircle cx='11.5' cy='13' r='1.9' fill='%23fff'/%3E%3Ccircle cx='20.5' cy='13' r='1.9' fill='%23fff'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' d='M10.8 19.5c1.6 3 8.8 3 10.4 0'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

/* 锁 —— 深海蓝 */
body .layui-layer.layer-ext-moon .layui-layer-content .layui-icon-lock,
body .layui-layer .layui-layer-content .layui-icon-lock {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='%230b4f6c'/%3E%3Crect x='10' y='15' width='12' height='9.5' rx='1.6' fill='%23fff'/%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' d='M12.6 15v-2.8a3.4 3.4 0 0 1 6.8 0V15'/%3E%3C/svg%3E") no-repeat center center !important;
    background-size: 32px 32px !important;
}

/* msg 轻提示（后台 .layui-layer-hui，登录页 .layer-ext-moon-msg） */
body .layui-layer-msg,
body .layui-layer-hui,
body .layer-ext-moon-msg,
body .layer-ext-moon-msg .layui-layer-content {
    background-color: rgba(11, 79, 108, .92) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius, 8px) !important;
}

body .layui-layer-hui .layui-layer-content,
body .layui-layer-msg .layui-layer-content {
    color: #ffffff !important;
    background-color: transparent !important;
}

/* loading（.layui-layer-loading 的透明底已在本节开头与 tips/photos/nobg 一起处理） */
body .layui-layer-loading .layui-layer-content {
    background-color: transparent !important;
}

body .layui-layer-loading-icon {
    color: var(--carib-turq, #06b6b0) !important;
}

body .layui-layer-loading-2:after,
body .layui-layer-loading-0:after {
    border-left-color: var(--carib-turq, #06b6b0) !important;
}

/* 转圈底下那圈静止轨道（layer.css:171 原为 #d2d2d2 灰）。
   只改 border-color，不动 3px border-width（动画依赖）。 */
body .layui-layer-loading-2:before {
    border-color: var(--carib-turq-lt, #d9f2f0) !important;
}

/* tips 气泡 */
body .layui-layer-tips .layui-layer-content {
    background-color: var(--carib-deep, #0b4f6c) !important;
    color: #ffffff !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    box-shadow: var(--carib-shadow, 0 2px 10px rgba(11, 79, 108, .08)) !important;
}

body .layui-layer-tips i.layui-layer-TipsT,
body .layui-layer-tips i.layui-layer-TipsB {
    border-right-color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-layer-tips i.layui-layer-TipsR,
body .layui-layer-tips i.layui-layer-TipsL {
    border-bottom-color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-layer-tips i.layui-layer-TipsG {
    border-color: var(--carib-deep, #0b4f6c) !important;
}

/* prompt / tab / photos */
body .layui-layer-prompt .layui-layer-input {
    border-color: var(--carib-border, #d7e8e8) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    color: var(--carib-text, #0f3a49) !important;
}

body .layui-layer-prompt .layui-layer-input:focus {
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .16) !important;
}

body .layui-layer-tab .layui-layer-title span.layui-this {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-left-color: var(--carib-border, #d7e8e8) !important;
    border-right-color: var(--carib-border, #d7e8e8) !important;
    color: var(--carib-deep, #0b4f6c) !important;
}

body .layui-layer-photos-toolbar {
    background-color: rgba(11, 79, 108, .55) !important;
}

/* 图片预览左右翻页箭头（layer.css:240 原为 #717171 灰） */
body .layui-layer-photos-prev,
body .layui-layer-photos-next {
    color: var(--carib-turq-lt, #d9f2f0) !important;
}

body .layui-layer-photos-prev:hover,
body .layui-layer-photos-next:hover {
    color: #ffffff !important;
}

/* ---- blockUI（元素 inline style，必须 !important；禁改 width/top/left/opacity） ---- */
.blockUI.blockOverlay,
.blockOverlay {
    background-color: rgba(11, 79, 108, .55) !important;
}

.blockUI.blockMsg,
.blockUI.blockMsg.blockPage,
.blockUI.blockMsg.blockElement {
    color: var(--carib-deep, #0b4f6c) !important;
    background-color: transparent !important;
    border: 0 !important;
}

.loaderbox {
    border-color: var(--carib-turq, #06b6b0) !important;
    background-color: var(--carib-sand-lt, #fdfaf3) !important;
    color: var(--carib-deep, #0b4f6c) !important;
    border-radius: var(--carib-radius, 8px) !important;
    box-shadow: var(--carib-shadow-lg, 0 8px 28px rgba(11, 79, 108, .18)) !important;
}

.loaderbox .loading-activity {
    border-top-color: var(--carib-turq, #06b6b0) !important;
    border-left-color: var(--carib-turq, #06b6b0) !important;
}


/* ==========================================================================
   13. 状态色元件：label / badge / progress / alert / text-*
   ========================================================================== */
.label,
.badge {
    background-color: var(--carib-turq-lt, #d9f2f0);
    color: var(--carib-deep, #0b4f6c);
    border-radius: var(--carib-radius-sm, 6px);
}

.label-default, .badge-default { background-color: #c9dcdd !important; color: var(--carib-deep, #0b4f6c) !important; }
.label-primary, .badge-primary { background-color: var(--carib-coral, #ff6b5b) !important; color: #ffffff !important; }
.label-success, .badge-success { background-color: var(--carib-palm, #2fa36b) !important; color: #ffffff !important; }
.label-info,    .badge-info    { background-color: var(--carib-turq, #06b6b0) !important; color: #ffffff !important; }
.label-warning, .badge-warning { background-color: var(--carib-gold, #f4b942) !important; color: #5a3d05 !important; }
.label-warning-light, .badge-warning-light { background-color: #fbe3ab !important; color: #5a3d05 !important; }
.label-danger,  .badge-danger  { background-color: var(--carib-hibiscus, #e0453a) !important; color: #ffffff !important; }
.label-inverse, .badge-inverse { background-color: var(--carib-deep, #0b4f6c) !important; color: #ffffff !important; }
.label-white,   .badge-white   { background-color: #ffffff !important; color: var(--carib-deep, #0b4f6c) !important; }
.badge-disable { background-color: #c9dcdd !important; color: var(--carib-muted, #5d7c88) !important; }

/* progress */
.progress {
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-radius: var(--carib-radius-sm, 6px) !important;
    box-shadow: none !important;
}

.progress-bar { background-color: var(--carib-turq, #06b6b0) !important; }
.progress-bar-navy-light { background-color: #4fd3ce !important; }
.progress-bar-success { background-color: var(--carib-palm, #2fa36b) !important; }
.progress-bar-info    { background-color: var(--carib-turq, #06b6b0) !important; }
.progress-bar-warning { background-color: var(--carib-gold, #f4b942) !important; }
.progress-bar-danger  { background-color: var(--carib-hibiscus, #e0453a) !important; }

/* alert（style.css 未覆盖，只有 bootstrap 默认） */
.alert {
    border-radius: var(--carib-radius, 8px) !important;
}

.alert-success {
    color: var(--carib-palm-dk, #238555) !important;
    background-color: #ddf1e7 !important;
    border-color: #a9dcc3 !important;
}

.alert-info {
    color: var(--carib-turq-dk, #048b87) !important;
    background-color: var(--carib-turq-lt, #d9f2f0) !important;
    border-color: #a5e2df !important;
}

.alert-warning {
    /* 用深棕而非 gold-dk：#d99a1f 压 #fdf1d8 只有 2.18:1，浅金字压浅金底 */
    color: #5a3d05 !important;
    background-color: #fdf1d8 !important;
    border-color: #f7dda0 !important;
}

.alert-danger {
    color: var(--carib-hibiscus-dk, #b83026) !important;
    background-color: #fbe0de !important;
    border-color: #f0b6b1 !important;
}

.alert a,
.alert .alert-link {
    color: inherit !important;
    text-decoration: underline;
}

/* text-* */
.text-navy    { color: var(--carib-turq, #06b6b0) !important; }
.text-primary { color: var(--carib-coral, #ff6b5b) !important; }
.text-success { color: var(--carib-palm, #2fa36b) !important; }
.text-info    { color: var(--carib-turq, #06b6b0) !important; }
.text-warning { color: var(--carib-gold-dk, #d99a1f) !important; }
.text-danger  { color: var(--carib-hibiscus, #e0453a) !important; }


/* ==========================================================================
   14. 登录页 / 注册页
   （锁屏 lock.html、错误页 error/*.html、首页 main.html 均未引入本文件，
     纯 CSS 不可主题化，此处不为其写规则）
   ========================================================================== */
/* 底色：深海蓝 → 海水蓝 → 绿松石 纵向渐变。
   浪花不能写在 body 的 background-image 里：login.css 给了 `body.signin{height:auto}`，
   body 盒高只有内容那么高，`background-position:center bottom` 会把浪花定位到内容底部
   （屏幕中段）而不是视口底部，实测完全看不见。改用 ::after + position:fixed。 */
body.signin {
    background: var(--carib-deep, #0b4f6c) linear-gradient(180deg, #0b4f6c 0%, #0a7d8c 55%, #06b6b0 100%) fixed !important;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 15px;
}

/* 视口底部的浪花，三层叠浪 */
body.signin::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 190px;
    z-index: 0;
    pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 200' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='.14' d='M0 80c180 60 360-60 540 0s360 60 540 0 300-20 360 20v100H0z'/%3E%3Cpath fill='%23ffffff' fill-opacity='.22' d='M0 120c240 40 400-40 640 10s400 50 640-10 160 0 160 0v80H0z'/%3E%3Cpath fill='%23ffffff' fill-opacity='.30' d='M0 160c200 30 420-30 620 10s420 40 620-10 200 0 200 0v40H0z'/%3E%3C/svg%3E") no-repeat center bottom;
    background-size: 100% 190px;
}

/* 右上角的日光晕 */
body.signin::before {
    content: "";
    position: fixed;
    top: -140px;
    right: -120px;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(circle, rgba(244, 185, 66, .30) 0%, rgba(244, 185, 66, .10) 45%, rgba(244, 185, 66, 0) 70%);
}

.signinpanel {
    color: #eaf7f6 !important;
    position: relative;
    z-index: 2;
    /* margin:auto 而非 align-items 居中：内容比视口高时（注册页）不会把顶部裁掉 */
    margin: auto !important;
    max-width: 100%;
}

/* 单栏登录页（login.html 是 .col-sm-12）：把 750px 的整宽收成一张 400px 的卡片。
   注册页是 .col-sm-7 + .col-sm-5 两栏，选择器刻意不匹配，保持原有宽度不受影响。 */
.signinpanel .col-sm-12 > form,
.signinpanel .col-sm-12 > h2 {
    max-width: 400px;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* customer / agent 两站在 form 外有 <h2 style="color:#333">站名</h2>，
   深灰压深海蓝 = 看不见，必须用 !important 压过 inline style */
.signinpanel .col-sm-12 > h2 {
    color: #ffffff !important;
    letter-spacing: 3px;
    text-shadow: 0 2px 10px rgba(11, 79, 108, .5);
}

.signinpanel h4,
.signinpanel h4.no-margins,
.signinpanel .logopanel h1 {
    color: #ffffff !important;
    text-shadow: 0 2px 6px rgba(11, 79, 108, .45);
}

.signinpanel p.m-t-md,
.signinpanel .signin-info,
.signinpanel .signin-info ul li {
    color: rgba(255, 255, 255, .88) !important;
}

.signinpanel .signin-info ul li i.fa {
    color: var(--carib-turq-lt, #d9f2f0) !important;
}

.signinpanel .signin-info strong a,
.signinpanel a {
    color: var(--carib-turq-lt, #d9f2f0) !important;
}

.signinpanel a:hover {
    color: #ffffff !important;
}

/* 表单卡片。原来用 rgba(...,.94) 半透明，底下的青绿渗上来让卡片发灰发脏，
   改成不透明沙滩白；顶部压一条「日落→海水」渐变条当装饰。 */
.signinpanel form,
.signinpanel #signupForm,
.signinpanel #registerForm {
    background: #fdfaf3 linear-gradient(90deg, #ff6b5b 0%, #f4b942 38%, #06b6b0 100%) no-repeat top center !important;
    background-size: 100% 5px !important;
    border: 1px solid rgba(255, 255, 255, .75) !important;
    border-radius: 14px !important;
    box-shadow: 0 22px 55px rgba(4, 32, 44, .35), 0 2px 6px rgba(4, 32, 44, .18) !important;
    padding: 38px 34px 34px !important;
}

/* 卡片顶部的「日出海面」徽标（纯装饰，不注入任何文字） */
.signinpanel #signupForm::before {
    content: "";
    display: block;
    width: 46px;
    height: 46px;
    margin: 0 auto 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Ccircle cx='24' cy='17' r='8.5' fill='%23f4b942'/%3E%3Cpath d='M4 31c5 0 5 3.6 10 3.6S19 31 24 31s5 3.6 10 3.6S39 31 44 31' stroke='%2306b6b0' stroke-width='3.2' fill='none' stroke-linecap='round'/%3E%3Cpath d='M4 40c5 0 5 3.6 10 3.6S19 40 24 40s5 3.6 10 3.6S39 40 44 40' stroke='%230b4f6c' stroke-width='3.2' fill='none' stroke-linecap='round' opacity='.45'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* 登录卡片的头部居中（注册页 #registerForm 保持左对齐，不匹配此选择器） */
.signinpanel #signupForm > h1,
.signinpanel #signupForm > h4,
.signinpanel #signupForm > p.m-t-md {
    text-align: center !important;
}

/* cp 站的 <h1 style="color:#fff">QN</h1> 在卡片【内】，白字压沙滩白 = 消失 */
.signinpanel form h1,
.signinpanel #signupForm h1 {
    color: var(--carib-deep, #0b4f6c) !important;
    letter-spacing: 4px;
    text-shadow: none !important;
}

/* 卡片【内部】的文字必须用深色。login.html:29 / register.html:42 的标题是
   <h4 class="no-margins">，若只写 `.signinpanel form h4`(0,1,2) 会输给上面的
   `.signinpanel h4.no-margins`(0,2,1)，白字压沙滩白卡片 = 标题消失。 */
.signinpanel form h4,
.signinpanel form .h4,
.signinpanel form h4.no-margins,
.signinpanel #signupForm h4,
.signinpanel #signupForm h4.no-margins,
.signinpanel #registerForm h4,
.signinpanel #registerForm h4.no-margins {
    color: var(--carib-deep, #0b4f6c) !important;
    text-shadow: none !important;
    font-size: 21px !important;
    font-weight: 700 !important;
    letter-spacing: 2px;
}

/* 标题下的绿松石短横线 */
.signinpanel #signupForm > h4::after {
    content: "";
    display: block;
    width: 46px;
    height: 3px;
    margin: 12px auto 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--carib-turq, #06b6b0), var(--carib-coral, #ff6b5b));
}

/* register.html:43 的 <p class="m-t-md"> 也在卡片内，同理需要压过
   `.signinpanel p.m-t-md`(0,2,1) */
.signinpanel form p,
.signinpanel form label,
.signinpanel form p.m-t-md,
.signinpanel #registerForm p.m-t-md {
    color: var(--carib-muted, #5d7c88) !important;
}

/* login.html:37 的「注册账号」链接在卡片内，绿松石浅压沙滩白约 1.2:1 = 隐形 */
.signinpanel form a,
.signinpanel form p a,
.signinpanel form p.text-center a,
.signinpanel form .checkbox-custom a {
    color: var(--carib-turq-dk, #048b87) !important;
}

.signinpanel form a:hover,
.signinpanel form p.text-center a:hover,
.signinpanel form .checkbox-custom a:hover {
    color: var(--carib-coral-dk, #e8543f) !important;
}

/* 输入框。login.css 把 .form-control 钉死在 height:34px!important，登录页太局促；
   这一页没有任何 JS 量高度（login.js / register.js 里无 height/outerHeight 调用），
   所以只在 .signinpanel 作用域内放宽到 46px，不影响后台其它页面。 */
.signinpanel .form-control {
    height: 46px !important;
    padding: 11px 42px 11px 15px !important;
    font-size: 14px !important;
    background-color: #ffffff !important;
    border: 1px solid var(--carib-border, #d7e8e8) !important;
    border-radius: 10px !important;
    color: var(--carib-text, #0f3a49) !important;
    box-shadow: inset 0 1px 2px rgba(11, 79, 108, .05) !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.signinpanel .form-control::-webkit-input-placeholder { color: #9db4bd; }
.signinpanel .form-control::placeholder { color: #9db4bd; }

.signinpanel .form-control:focus {
    border-color: var(--carib-turq, #06b6b0) !important;
    box-shadow: 0 0 0 3px rgba(6, 182, 176, .18) !important;
}

/* Chrome 自动填充会把输入框刷成 rgb(232,240,254) 淡蓝紫，且 background-color 带
   UA !important 无法直接覆盖。标准解法：用超大 inset box-shadow 顶掉，
   文字色用 -webkit-text-fill-color。 */
.signinpanel .form-control:-webkit-autofill,
.signinpanel .form-control:-webkit-autofill:hover,
.signinpanel .form-control:-webkit-autofill:focus,
.signinpanel .form-control:-webkit-autofill:active {
    -webkit-text-fill-color: var(--carib-text, #0f3a49) !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    caret-color: var(--carib-text, #0f3a49);
    /* 拖住 Chrome 的背景色过渡，让 inset 阴影稳定生效 */
    transition: background-color 100000s ease-in-out 0s;
}

.signinpanel .form-control:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset, 0 0 0 3px rgba(6, 182, 176, .18) !important;
    box-shadow: 0 0 0 1000px #ffffff inset, 0 0 0 3px rgba(6, 182, 176, .18) !important;
}

/* 用户名 / 密码图标：换成绿松石 inline SVG，靠右 15px */
.signinpanel .uname {
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306b6b0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-7 8-7s8 2.6 8 7'/%3E%3C/svg%3E") no-repeat right 15px center !important;
    background-size: 17px 17px !important;
    color: var(--carib-text, #0f3a49) !important;
}

.signinpanel .pword {
    background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306b6b0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='10' width='16' height='11' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") no-repeat right 15px center !important;
    background-size: 17px 17px !important;
    color: var(--carib-text, #0f3a49) !important;
}

/* 验证码（cp / customer / agent 三站有，cms 无；四份文件保持字节一致故都写） */
.signinpanel .code {
    padding-right: 15px !important;
    background: #ffffff !important;
    color: var(--carib-text, #0f3a49) !important;
    border-color: var(--carib-border, #d7e8e8) !important;
}

/* 验证码图片与输入框同高对齐（原 HTML 属性 width="85%" 会让高度随宽度漂移） */
img.imgcode {
    width: auto !important;
    height: 46px !important;
    margin-top: 15px;
    border: 1px solid var(--carib-border, #d7e8e8);
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
}

/* 登录按钮：珊瑚 → 日落金 渐变，hover 上浮 */
.signinpanel .btn-success,
.signinpanel #btnSubmit,
.signinpanel .btn-primary {
    height: 46px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 4px;
    background: linear-gradient(135deg, #ff7d5b 0%, #ff6b5b 55%, #f4593f 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 20px rgba(255, 107, 91, .38) !important;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.signinpanel .btn-success:hover,
.signinpanel .btn-success:focus,
.signinpanel #btnSubmit:hover,
.signinpanel #btnSubmit:focus,
.signinpanel .btn-primary:hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(255, 107, 91, .48) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

.signinpanel .btn-success:active,
.signinpanel #btnSubmit:active {
    transform: translateY(1px);
    box-shadow: 0 4px 12px rgba(255, 107, 91, .35) !important;
}

/* 记住我复选框 */
.checkbox-custom label:before {
    border-color: var(--carib-turq, #06b6b0) !important;
    background: #ffffff !important;
    border-radius: 4px !important;
}

.checkbox-custom input:checked + label:after {
    color: var(--carib-turq, #06b6b0) !important;
}

.checkbox-custom label,
.checkbox-custom a {
    color: var(--carib-muted, #5d7c88) !important;
}

.checkbox-custom a:hover {
    color: var(--carib-turq, #06b6b0) !important;
}

/* register.html:55 的 .signup-footer 是 .signinpanel 的直接子元素，位于
   玻璃卡片【外】、直接压在深海蓝→海水蓝渐变上，灰蓝对比度不足 2:1，必须改白 */
.signup-footer,
.signinpanel .signup-footer,
.signinpanel .signup-footer .pull-left,
.signinpanel .signup-footer .pull-right {
    color: rgba(255, 255, 255, .92) !important;
    /* body.signin 底部 220px 是浪花图，最下面一层是不透明的 #d9f2f0；页脚若落在那条
       浅色带上，白字会彻底消失。加深色描边保证在深蓝渐变和浅色浪花上都读得出来。 */
    text-shadow: 0 1px 3px rgba(11, 79, 108, .9), 0 0 1px rgba(11, 79, 108, .8) !important;
}

.signup-footer,
.signinpanel .signup-footer {
    border-top-color: rgba(255, 255, 255, .35) !important;
}

.signinpanel label.error,
body.signin label.error {
    color: var(--carib-hibiscus, #e0453a) !important;
}


/* ==========================================================================
   15. 皮肤兼容层：3 个 theme-* × 5 个 skin-* = 15 种组合全部拉回加勒比海配色
   （用户在「主题皮肤」里随便切，视觉必须完全一致）
   ========================================================================== */

/* ---- 15.1 selected（当前页菜单项）：5 skin + theme-light×5 + theme-blue×5 ---- */
.skin-blue   .navbar-default .nav > li.selected > a, .skin-blue   .navbar-default .nav > li.selected > a:focus,
.skin-green  .navbar-default .nav > li.selected > a, .skin-green  .navbar-default .nav > li.selected > a:focus,
.skin-purple .navbar-default .nav > li.selected > a, .skin-purple .navbar-default .nav > li.selected > a:focus,
.skin-red    .navbar-default .nav > li.selected > a, .skin-red    .navbar-default .nav > li.selected > a:focus,
.skin-yellow .navbar-default .nav > li.selected > a, .skin-yellow .navbar-default .nav > li.selected > a:focus,
.theme-light.skin-blue   .navbar-default .nav > li.selected > a, .theme-light.skin-blue   .navbar-default .nav > li.selected > a:focus,
.theme-light.skin-green  .navbar-default .nav > li.selected > a, .theme-light.skin-green  .navbar-default .nav > li.selected > a:focus,
.theme-light.skin-purple .navbar-default .nav > li.selected > a, .theme-light.skin-purple .navbar-default .nav > li.selected > a:focus,
.theme-light.skin-red    .navbar-default .nav > li.selected > a, .theme-light.skin-red    .navbar-default .nav > li.selected > a:focus,
.theme-light.skin-yellow .navbar-default .nav > li.selected > a, .theme-light.skin-yellow .navbar-default .nav > li.selected > a:focus,
.theme-blue.skin-blue    .navbar-default .nav > li.selected > a, .theme-blue.skin-blue    .navbar-default .nav > li.selected > a:focus,
.theme-blue.skin-green   .navbar-default .nav > li.selected > a, .theme-blue.skin-green   .navbar-default .nav > li.selected > a:focus,
.theme-blue.skin-purple  .navbar-default .nav > li.selected > a, .theme-blue.skin-purple  .navbar-default .nav > li.selected > a:focus,
.theme-blue.skin-red     .navbar-default .nav > li.selected > a, .theme-blue.skin-red     .navbar-default .nav > li.selected > a:focus,
.theme-blue.skin-yellow  .navbar-default .nav > li.selected > a, .theme-blue.skin-yellow  .navbar-default .nav > li.selected > a:focus,
.theme-dark.skin-blue    .navbar-default .nav > li.selected > a, .theme-dark.skin-blue    .navbar-default .nav > li.selected > a:focus,
.theme-dark.skin-green   .navbar-default .nav > li.selected > a, .theme-dark.skin-green   .navbar-default .nav > li.selected > a:focus,
.theme-dark.skin-purple  .navbar-default .nav > li.selected > a, .theme-dark.skin-purple  .navbar-default .nav > li.selected > a:focus,
.theme-dark.skin-red     .navbar-default .nav > li.selected > a, .theme-dark.skin-red     .navbar-default .nav > li.selected > a:focus,
.theme-dark.skin-yellow  .navbar-default .nav > li.selected > a, .theme-dark.skin-yellow  .navbar-default .nav > li.selected > a:focus {
    background-color: rgba(6, 182, 176, .28) !important;
    color: #ffffff !important;
}

/* ---- 15.2 active 文字色：theme-light / theme-blue / theme-dark × 5 skin ---- */
.theme-light.skin-blue   .navbar-default .nav > li.active > a,
.theme-light.skin-green  .navbar-default .nav > li.active > a,
.theme-light.skin-purple .navbar-default .nav > li.active > a,
.theme-light.skin-red    .navbar-default .nav > li.active > a,
.theme-light.skin-yellow .navbar-default .nav > li.active > a,
.theme-blue.skin-blue    .navbar-default .nav > li.active > a,
.theme-blue.skin-green   .navbar-default .nav > li.active > a,
.theme-blue.skin-purple  .navbar-default .nav > li.active > a,
.theme-blue.skin-red     .navbar-default .nav > li.active > a,
.theme-blue.skin-yellow  .navbar-default .nav > li.active > a,
.theme-dark.skin-blue    .navbar-default .nav > li.active > a,
.theme-dark.skin-green   .navbar-default .nav > li.active > a,
.theme-dark.skin-purple  .navbar-default .nav > li.active > a,
.theme-dark.skin-red     .navbar-default .nav > li.active > a,
.theme-dark.skin-yellow  .navbar-default .nav > li.active > a {
    color: #ffffff !important;
    background-color: transparent !important;
}

/* ---- 15.3 theme-light 的 selected 右侧竖条（只改 border-color，不动 margin） ---- */
.theme-light.skin-blue   .nav:not(.navbar-toolbar) > li.selected,
.theme-light.skin-green  .nav:not(.navbar-toolbar) > li.selected,
.theme-light.skin-purple .nav:not(.navbar-toolbar) > li.selected,
.theme-light.skin-red    .nav:not(.navbar-toolbar) > li.selected,
.theme-light.skin-yellow .nav:not(.navbar-toolbar) > li.selected {
    border-right-color: var(--carib-turq, #06b6b0) !important;
    background-color: rgba(6, 182, 176, .28) !important;
}

/* ---- 15.4 侧栏 box-shadow：theme-light / theme-blue 自带灰投影，必须盖 ---- */
.theme-light .navbar-static-side,
.theme-blue .navbar-static-side {
    box-shadow: 2px 0 12px rgba(11, 79, 108, .18) !important;
}

/* ---- 15.5 AdminLTE 残留（DOM 未必用到，兜底防漏 #222d32 / #b8c7ce） ---- */
.skin-blue .nav > li.header, .skin-green .nav > li.header,
.skin-purple .nav > li.header, .skin-red .nav > li.header,
.skin-yellow .nav > li.header {
    background: transparent !important;
    color: var(--carib-menu-2, rgba(255, 255, 255, .62)) !important;
}

.skin-blue .sidebar-menu > li.active > a,
.skin-green .sidebar-menu > li.active > a,
.skin-purple .sidebar-menu > li.active > a,
.skin-red .sidebar-menu > li.active > a,
.skin-yellow .sidebar-menu > li.active > a {
    background: rgba(255, 255, 255, .12) !important;
    color: #ffffff !important;
    border-left-color: var(--carib-coral, #ff6b5b) !important;
}

/* ---- 15.6 LOGO / 顶栏 / 页签 / 下拉 的皮肤兜底已在 §3.6 / §4 / §5 / §11.10
       用逗号并列的方式一次性覆盖，此处不再重复 ---- */


/* ==========================================================================
   16. 页脚 .footer（height:36px / padding / margin 一律禁改）
   ========================================================================== */
.footer,
.footer.fixed,
.footer.fixed_full {
    background: var(--carib-sand, #f7f0e3) !important;
    background-color: var(--carib-sand, #f7f0e3) !important;
    border-top-color: var(--carib-turq, #06b6b0) !important;
    /* 沙滩白底上 --carib-muted 只有 3.95:1，低于 AA，提到 --carib-text ≈10.5:1 */
    color: var(--carib-text, #0f3a49) !important;
}

.footer .pull-right {
    color: var(--carib-text, #0f3a49) !important;
}

.footer a,
.footer .pull-right a {
    color: var(--carib-turq-dk, #048b87) !important;
}

.footer a:hover {
    color: var(--carib-coral, #ff6b5b) !important;
}

/* ========================= 加勒比海主题 结束 ========================= */
