/* ============================================================
   呼伦贝尔学院 - 教育学院 导航栏红色主题样式
   使用方式：将此 CSS 放到服务器端对应导航组件的样式位置
   ============================================================ */

/* ========== 以下样式不用修改 开始 ========== */

/* 默认ul 无需修改 */
.nav_menustyle_1_1 ul
{
    list-style-type:none;
    padding:0px; 
    margin:0px;}

/* 默认li */
.nav_menustyle_1_1 li
{
    float:left;
    text-align:center;
    position:relative;}

/* 2级以上li = 恢复为 display:block + float:none，保证下拉正常，不会被"一级ul居中"覆盖 */
.nav_menustyle_1_1 ul li ul li
{
    display:block;
    float:none;
    z-index:100;}


/* 3级以上默认ul 无需修改 */
.nav_menustyle_1_1 ul li ul li ul
{
    left:100%;
    top:0px;}

/* IE6下的table样式 无需修改 */
.nav_menustyle_1_1 table 
{
    position:absolute; 
    left:0px;
    border-collapse:collapse; 
    border-spacing:0; 
    z-index:100;}   

.nav_menustyle_1_1 table table
{
    top:0px;}

.nav_menustyle_1_1 td 
{
    padding: 0;}

/* 共6级导航子菜单打开关闭控制 无需修改 */
.nav_menustyle_1_1 li ul,
.nav_menustyle_1_1 li:hover ul li ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul li ul
{
    display:none;}

.nav_menustyle_1_1 li a:hover ul li ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul li ul
{
    visibility:hidden;}

.nav_menustyle_1_1 li a:hover ul,
.nav_menustyle_1_1 li:hover ul,
.nav_menustyle_1_1 li:hover ul li:hover ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul,
.nav_menustyle_1_1 li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul    
{
    display:block;
    position:absolute;}

.nav_menustyle_1_1 li a:hover ul li a:hover ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul,
.nav_menustyle_1_1 li a:hover ul li a:hover ul li a:hover ul li a:hover ul li a:hover ul
{
    visibility:visible;}

/* 默认a属性 无需修改 */
.nav_menustyle_1_1 a
{
    display:block;
    text-decoration:none;
    white-space:nowrap;}

/* ========== 以上样式不用修改 结束 ========== */


/* ========== 以下为红色主题可修改样式 ========== */

/* 全局字体 */
.nav_menustyle_1_1 {
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif;}

/* ---------- 一级菜单 ul 居中 ---------- */
.nav_menustyle_1_1 > ul
{
    text-align:center;}

/* ---------- 一级菜单 li（覆盖 float，改用 inline-block 实现居中） ---------- */
.nav_menustyle_1_1 > ul > li
{
    float:none;                 /* 取消左浮动 */
    display:inline-block;       /* 行内块，配合父级 text-align:center 居中 */
    vertical-align:top;}

/* ---------- 一级菜单链接 ---------- */
.nav_menustyle_1_1 > ul > li > a
{
    width:auto;                 /* 自适应宽度 */
    min-width:80px;             /* 最小宽度 */
    height:44px;                /* 菜单高度 */
    line-height:44px;           /* 行高=高度，文字垂直居中 */
    font-size:15px;             /* 字体大小 */
    color:#ffffff;              /* 字体颜色：白色 */
    background:transparent;     /* 背景透明，由外层 header 红色渐变控制 */
    border:none;                /* 无边框 */
    padding:0 18px;             /* 左右内边距 */
    border-radius:4px;          /* 圆角 */
    transition: all 0.3s ease;  /* 过渡动画 */
    margin:0 3px;}

/* ---------- 一级菜单 hover 效果 ---------- */
.nav_menustyle_1_1 > ul > li > a:hover
{
    color:#ffffff;                               /* 白色文字 */
    background:rgba(255, 255, 255, 0.2);}

/* ---------- 一级菜单当前激活状态（给 li 加 class="active"） ---------- */
.nav_menustyle_1_1 > ul > li.active > a
{
    background:rgba(255, 255, 255, 0.25);}

/* ---------- 一级菜单下划线动画 ---------- */
.nav_menustyle_1_1 > ul > li > a::after
{
    content:'';
    position:absolute;
    bottom:4px;
    left:50%;
    width:0;
    height:2px;
    background:#ffffff;
    transition:all 0.3s ease;
    transform:translateX(-50%);}
.nav_menustyle_1_1 > ul > li > a:hover::after
{
    width:60%;}
.nav_menustyle_1_1 > ul > li.active > a::after
{
    width:60%;}

/* ---------- IE6 下拉菜单位置（菜单高度+1） ---------- */
.nav_menustyle_1_1 table 
{
    top:45px;}   
.nav_menustyle_1_1 table table
{
    left:auto;
    top:0px;}

/* ---------- 二级下拉菜单容器 ---------- */
.nav_menustyle_1_1 ul li ul
{
    background:#8B0000;                      /* 深红色 (secondary) */
    border-radius:0 0 6px 6px;               /* 底部圆角 */
    box-shadow:0 8px 20px rgba(0,0,0,0.3);   /* 阴影 */
    padding:6px 0;                           /* 上下内边距 */
    min-width:100%;                          /* 宽度跟随一级菜单 li */
    width:auto;                              /* 自适应内容 */
    white-space:nowrap;                      /* 不换行 */
    left:0;}

/* ---------- 二级菜单链接 ---------- */
.nav_menustyle_1_1 ul li ul li a
{
    width:auto;
    min-width:100%;                          /* 撑满 ul 宽度 */
    height:38px;
    line-height:38px;
    font-size:14px;
    color:#ffffff;
    background:transparent;
    border:none;
    padding:0 20px;
    text-align:left;
    transition:all 0.2s ease;
    box-sizing:border-box;}

/* ---------- 二级菜单 hover ---------- */
.nav_menustyle_1_1 ul li ul li a:hover
{
    color:#ffffff;
    background:rgba(255, 255, 255, 0.15);}

/* ---------- 二级菜单分隔线 ---------- */
.nav_menustyle_1_1 ul li ul li
{
    border-bottom:1px solid rgba(255, 255, 255, 0.1);}
.nav_menustyle_1_1 ul li ul li:last-child
{
    border-bottom:none;}

/* ---------- 三级菜单容器 ---------- */
.nav_menustyle_1_1 ul li ul li ul
{
    background:#8B0000;
    border-radius:0 6px 6px 6px;
    box-shadow:0 8px 20px rgba(0,0,0,0.3);
    padding:6px 0;
    min-width:100%;                          /* 宽度跟随上级菜单 */
    width:auto;
    white-space:nowrap;}

/* ---------- 三级菜单链接 ---------- */
.nav_menustyle_1_1 ul li ul li ul li a
{
    width:auto;
    min-width:100%;
    height:38px;
    line-height:38px;
    font-size:14px;
    color:#ffffff;
    background:transparent;
    border:none;
    padding:0 20px;
    text-align:left;
    transition:all 0.2s ease;
    box-sizing:border-box;}

/* ---------- 三级菜单 hover ---------- */
.nav_menustyle_1_1 ul li ul li ul li a:hover
{
    color:#ffffff;
    background:rgba(255, 255, 255, 0.15);}

/* ---------- 三级菜单分隔线 ---------- */
.nav_menustyle_1_1 ul li ul li ul li
{
    border-bottom:1px solid rgba(255, 255, 255, 0.1);}
.nav_menustyle_1_1 ul li ul li ul li:last-child
{
    border-bottom:none;}

/* ---------- 有子菜单的项显示小箭头 ---------- */
.nav_menustyle_1_1 ul li ul li:has(ul) > a::after
{
    content:' ?';
    float:right;
    font-size:10px;
    line-height:38px;
    opacity:0.7;}

/* ========== 红色主题样式结束 ========== */
/* 工作动态 — 4图轮播卡片 */
.work-carousel-card { background: #fff; border-radius: 12px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1); overflow: hidden; transition: all 0.3s ease; margin-bottom: 16px;}
.work-carousel-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);}
.work-carousel-card .slide-wrap { position: relative; width: 100%; height: 240px; overflow: hidden;}
.work-carousel-card .slide-wrap img { width: 100%; height: 100%; object-fit: cover; display: block;}
.work-carousel-card .slide-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.6s ease;}
.work-carousel-card .slide-item.active { opacity: 1; z-index: 2;}
.work-carousel-card .slide-dots { position: absolute; bottom: 10px; right: 12px; z-index: 5; display: flex; gap: 6px;}
.work-carousel-card .slide-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.5); cursor: pointer; transition: all 0.3s ease;}
.work-carousel-card .slide-dot.active { background: #B82601; width: 20px; border-radius: 4px;}
.work-carousel-card .slide-info { padding: 16px;}
.work-carousel-card .slide-info h3 { font-weight: 700; color: #1f2937; margin-bottom: 8px; font-size: 15px; cursor: pointer;}
.work-carousel-card .slide-info h3:hover { color: #B82601;}
.work-carousel-card .slide-info p { color: #6b7280; font-size: 13px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.work-carousel-card .slide-info .slide-date { color: #9ca3af; font-size: 12px; margin-top: 8px;}

/* 工作动态 — 文字列表 */
.work-news-item { display: flex; align-items: center; justify-content: space-between; padding: 10px 8px; border-bottom: 1px solid #f3f4f6; cursor: pointer; border-radius: 4px; transition: all 0.2s ease; text-decoration: none; color: inherit;}
.work-news-item:hover { background: #f9fafb;}
.work-news-item .work-news-title { font-size: 14px; color: #374151; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 12px;}
.work-news-item:hover .work-news-title { color: #B82601;}
.work-news-item .work-news-date { font-size: 12px; color: #9ca3af; white-space: nowrap;}
.notice-item { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 8px; border-left: 3px solid transparent; cursor: pointer; transition: all 0.3s ease; text-decoration: none; color: inherit;}
.notice-item:hover { background: #fef2f2; border-left-color: #B82601; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.05);}
.notice-tag { display: inline-block; font-size: 13px; color: #fff; padding: 4px 12px; border-radius: 4px; white-space: nowrap; flex-shrink: 0; line-height: 1.6;}
.notice-tag.tag-color-0 { background: #B82601;}
.notice-tag.tag-color-1 { background: #3b82f6;}
.notice-tag.tag-color-2 { background: #22c55e;}
.notice-tag.tag-color-3 { background: #f97316;}
.notice-tag.tag-color-4 { background: #a855f7;}
.notice-tag.tag-color-5 { background: #ef4444;}
.notice-info { flex: 1; min-width: 0;}
.notice-title { font-size: 14px; font-weight: 500; color: #1f2937; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notice-item:hover .notice-title { color: #B82601;}
.notice-meta { font-size: 12px; color: #9ca3af; margin-top: 4px;}
.notice-meta span { margin-right: 10px;}
.notice-new { color: #dc2626; font-weight: bold;}
