/* -------------------- nyroModal 模态框基础样式 -------------------- */
/* 模态框整体容器：设置全局层级、字体大小和颜色 */
div#nyroModalFull {
    z-index: 99;              /* 层级优先级（确保显示在页面其他内容之上） */
    font-size: 12px;          /* 基础字体大小 */
    color: #777;              /* 基础文字颜色（深灰色） */
}

/* 模态框加载状态容器：设置加载时的边框、尺寸和背景 */
div#nyroModalLoading {
    border: 4px solid #777;   /* 深灰色边框（4px 实线） */
    width: 150px;             /* 宽度（150px） */
    height: 150px;            /* 高度（150px） */
    text-indent: -9999em;     /* 文本缩进（隐藏文字内容） */
    background: #fff url(../images/ajaxLoader.gif) no-repeat;  /* 白色背景 + 加载动画 */
    background-position: center;  /* 背景图居中显示 */
}

/* 加载错误状态：修改加载失败时的样式 */
div#nyroModalLoading.error {
    border: 4px solid #f66;   /* 红色边框（加载失败提示） */
    line-height: 20px;        /* 行高（20px，文字垂直间距） */
    padding: 20px;            /* 内边距（上下左右 20px） */
    width: 300px;             /* 宽度（300px，比常规加载框更宽） */
    height: 100px;            /* 高度（100px，适应文字内容） */
    text-indent: 0;           /* 取消文本缩进（显示错误文字） */
    background: #fff;         /* 纯白色背景（覆盖原加载动画） */
}

/* 模态框内容包装器：设置模态框主体的背景、边框和圆角 */
div#nyroModalWrapper {
    background: #fff;         /* 白色背景（模态框主体颜色） */
    border: 2px solid #e3e3e3;  /* 浅灰色边框（2px 实线） */
    border-radius: 5px;       /* 圆角（5px，柔和边角） */
}

/* 模态框关闭按钮：绝对定位的关闭图标 */
a#closeBut {
    position: absolute;       /* 绝对定位（相对于模态框包装器） */
    display: block;           /* 块级元素（可设置宽高） */
    top: -13px;               /* 顶部偏移（-13px，部分超出模态框） */
    right: -13px;             /* 右侧偏移（-13px，部分超出模态框） */
    width: 12px;              /* 宽度（12px，图标尺寸） */
    height: 12px;             /* 高度（12px，图标尺寸） */
    text-indent: -9999em;     /* 隐藏文字（仅显示背景图） */
    background: url(../images/close.gif) no-repeat;  /* 关闭图标背景 */
    outline: 0;               /* 去除聚焦时的外边框 */
}

/* 模态框标题：定位在模态框顶部的标题文字 */
h1#nyroModalTitle {
    margin: 0;                /* 重置默认外边距 */
    padding: 0;               /* 重置默认内边距 */
    position: absolute;       /* 绝对定位（相对于模态框包装器） */
    top: -22px;               /* 顶部偏移（-22px，位于模态框上方） */
    left: 5px;                /* 左侧偏移（5px，左对齐） */
    font-size: 12px;          /* 字体大小（12px） */
    color: #ddd;              /* 文字颜色（浅灰色，不显眼） */
}

/* 模态框内容区域：设置内容的溢出处理 */
div#nyroModalContent {
    overflow: auto;           /* 内容溢出时显示滚动条 */
}

/* 普通内容包装器的内容区域：为普通内容添加内边距 */
div.wrapper div#nyroModalContent {
    padding: 5px;             /* 内边距（上下左右 5px） */
}

/* 图片内容包装器的内容区域：设置图片内容的布局 */
div.wrapperImg div#nyroModalContent {
    position: relative;       /* 相对定位（用于子元素绝对定位） */
    overflow: hidden;         /* 内容溢出时隐藏（避免滚动条） */
    text-align: center;       /* 内容水平居中（图片居中显示） */
}

/* 图片内容中的图片：设置图片垂直对齐方式 */
div.wrapperImg img {
    vertical-align: baseline; /* 垂直对齐（基线对齐，避免底部间隙） */
}

/* 图片内容的描述框：绝对定位在图片底部的说明文字框 */
div.wrapperImg div#nyroModalContent div {
    position: absolute;       /* 绝对定位（相对于图片内容区域） */
    bottom: 0;                /* 底部对齐 */
    left: 0;                  /* 左侧对齐 */
    background: black;        /* 黑色背景 */
    padding: 10px;            /* 内边距（上下左右 10px） */
    margin: 10px;             /* 外边距（上下左右 10px） */
    border: 1px white dotted; /* 白色虚线边框 */
    overflow: hidden;         /* 内容溢出时隐藏 */
    opacity: 0.2;             /* 初始透明度（20%，半透明） */
    filter: alpha(opacity=20); /* IE 透明度兼容 */
}

/* 图片描述框悬停效果：鼠标悬停时增加透明度 */
div.wrapperImg div#nyroModalContent div:hover {
    opacity: 0.5;             /* 透明度提升至 50% */
    filter: alpha(opacity=50); /* IE 透明度兼容 */
    cursor: help;             /* 鼠标指针变为帮助图标（提示可查看说明） */
}

/* 模态框前后导航按钮：覆盖在内容上的导航按钮 */
a.nyroModalPrev, a.nyroModalNext {
    z-index: 105;             /* 层级（高于模态框内容） */
    outline: none;            /* 去除聚焦外边框 */
    position: absolute;       /* 绝对定位（相对于模态框内容区域） */
    top: 0;                   /* 顶部对齐 */
    height: 100%;             /* 高度占满内容区域 */
    width: 40%;               /* 宽度占内容区域的 40%（覆盖左右两侧） */
    cursor: pointer;          /* 鼠标指针变为手型 */
    text-indent: -9999em;     /* 隐藏文字（仅显示背景图） */
    background: left 20% no-repeat;  /* 背景图靠左 20% 位置 */
    background-image: url(data:image/gif;base64,AAAA); /* 空 GIF（兼容 IE6） */
}

/* SWF 或普通内容的导航按钮：调整按钮尺寸 */
div.wrapperSwf a.nyroModalPrev, div.wrapperSwf a.nyroModalNext, 
div.wrapper a.nyroModalPrev, div.wrapper a.nyroModalNext {
    height: 60%;              /* 高度占内容区域的 60% */
    width: 20%;               /* 宽度占内容区域的 20% */
}

/* 上一个导航按钮：定位在左侧 */
a.nyroModalPrev {
    left: 0;                  /* 左侧对齐 */
}

/* 上一个按钮悬停效果：显示上一页箭头背景图 */
a.nyroModalPrev:hover {
    background-image: url(../images/prev.gif);  /* 上一页箭头背景 */
}

/* 下一个导航按钮：定位在右侧，背景图靠右 */
a.nyroModalNext {
    right: 0;                 /* 右侧对齐 */
    background-position: right 20%;  /* 背景图靠右 20% 位置 */
}

/* 下一个按钮悬停效果：显示下一页箭头背景图 */
a.nyroModalNext:hover {
    background-image: url(../images/next.gif);  /* 下一页箭头背景 */
}


/* -------------------- layui-layer 模态框扩展样式（lauyi 自定义） -------------------- */
/* 模态框标题栏：覆盖 layui 默认样式，设置自定义标题 */
.layui-layer-title{
    font-weight: 700 !important;  /* 字体加粗（重要，覆盖默认样式） */
    color: #68728c !important;    /* 标题颜色（深灰蓝） */
    font-size: 16px !important;   /* 字体大小（16px，更醒目） */
    height: 50px !important;      /* 标题栏高度（50px） */
    line-height: 50px !important; /* 行高（50px，文字垂直居中） */
    border-radius: 5px 5px 0 0 !important;  /* 顶部圆角（与模态框整体一致） */
    background-color: #F2F4F4 !important;   /* 标题栏背景色（浅灰） */
}

/* 模态框关闭按钮位置：调整关闭按钮的定位 */
.layui-layer-setwin{
    top: 18px !important;       /* 顶部偏移（18px，垂直居中） */
    right: 18px !important;     /* 右侧偏移（18px，远离边缘） */
}

/* 模态框整体与 iframe 内容：统一圆角样式 */
.layui-layer,.layui-layer-iframe iframe{
    border-radius: 5px !important;  /* 圆角（5px，柔和边角） */
}

/* 加载动画（类型1）：自定义加载旋转效果 */
.layui-layer-loading .layui-layer-loading1 {
    border: 3px solid #eeeeee;     /* 浅灰色边框（底部、左、右） */
    border-radius: 50%;            /* 圆角（50%，圆形） */
    border-top: 3px solid #3498db;  /* 顶部边框颜色（蓝色，旋转部分） */
    background: none !important;   /* 无背景（覆盖默认加载图） */
    -webkit-animation: spin 0.6s linear infinite;  /* 旋转动画（iOS 兼容） */
    animation: spin 0.6s linear infinite;  /* 标准旋转动画（0.6秒/圈，无限循环） */
}

/* 模态框按钮（主按钮）：自定义确认按钮样式 */
.layui-layer-btn .layui-layer-btn0{
    background: linear-gradient(0deg,#2a62ff,#4e7dff);  /* 渐变背景（深蓝到浅蓝） */
    box-shadow: 0 5px 6px 0 rgba(73,105,230,.22);  /* 蓝色投影（柔和阴影） */
    border: none;             /* 无边框（覆盖默认边框） */
}

/* 模态框页面内容区域：设置内容区域的内边距和文字样式 */
.layui-layer-page .layui-layer-content{
    position: relative;       /* 相对定位（用于子元素绝对定位） */
    padding: 20px;            /* 内边距（上下左右 20px） */
    line-height: 24px;        /* 行高（24px，文字垂直间距） */
    word-break: break-all;    /* 文字换行（任意位置换行） */
    overflow: hidden;         /* 内容溢出时隐藏 */
    font-size: 14px;          /* 字体大小（14px，正文适用） */
    overflow-x: hidden;       /* 水平溢出时隐藏（不显示横向滚动条） */
    overflow-y: auto;         /* 垂直溢出时显示滚动条 */
}