html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  /*margin-bottom: 60px;*/
    /* 全局字体设置 */
    font-family: 'Microsoft YaHei', '微软雅黑', sans-serif;

}

/* 确保所有文本元素继承 body 的字体 */
* {
    font-family: inherit;
}

/* my css */

/* 导航栏渐变背景 - 紫色到粉红色 */
.navbar {
    background: linear-gradient(135deg, #512bd4 0%, #d600aa 100%);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 0 1rem; /* 减少内边距以适应小屏幕 */
}

/* 导航链接样式 */
.nav-link {
    color: #ffffff !important;
    padding: 0.75rem 1rem; /* 减少内边距 */
    margin: 0 0.75rem; /* 减少外边距 */
    border-radius: 4px; /* 减小圆角 */
    transition: all 0.3s ease;
    position: relative;
    font-size: 1rem; /* 减小字体大小 */
    font-weight: 500;
    background: transparent;
}

    /* 鼠标悬停效果 */
    .nav-link:hover, .nav-link:focus {
        background: rgba(255, 255, 255, 0.2);
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5); /* 减小阴影 */
    }

/* 下拉菜单样式 */
.dropdown-menu {
    background: linear-gradient(135deg, #d8bfd8 0%, #ffc0cb 100%);
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* 减小阴影 */
    min-width: 180px; /* 减小宽度 */
    padding: 0.3rem 0; /* 减少内边距 */
}

.dropdown-item {
    color: #4b2e83 !important;
    padding: 0.5rem 1rem; /* 减少内边距 */
    transition: all 0.2s ease;
    font-size: 0.9rem; /* 减小字体大小 */
    background: transparent;
}

    .dropdown-item:hover {
        background: rgba(255, 255, 255, 0.3);
        box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5); /* 减小阴影 */
    }

.dropdown-divider {
    border-color: rgba(75, 46, 131, 0.1);
    margin: 0.3rem 0; /* 减少外边距 */
}

/* 确保内容不被固定导航栏遮挡 */
body {
    padding-top: 70px; /* 减少顶部内边距 */
}

/* 导航栏高度 */
.navbar {
    min-height: 70px; /* 减小高度 */
}


/* 覆盖折叠按钮样式 - 完全白色无边框 */
.navbar-toggler {
    color: white !important; /* 图标颜色 */
    border: none !important; /* 移除默认边框 */
    background-color: transparent !important; /* 背景透明 */
    padding: 0.25rem 0.75rem; /* 保持适当内边距 */
}

    /* 汉堡菜单图标颜色强制白色 */
    .navbar-toggler .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    }

    /* 悬停效果 - 仅背景变化（保持无边框） */
    .navbar-toggler:hover,
    .navbar-toggler:focus {
        background-color: rgba(255, 255, 255, 0.2) !important; /* 半透明白色背景 */
        box-shadow: none !important; /* 移除阴影 */
        border: none !important; /* 确保悬停也无边框 */
    }

    /* 确保点击状态也无边框 */
    .navbar-toggler:active {
        border: none !important;
    }


/* 关键修改：重新添加媒体查询控制不同屏幕尺寸下的行为 */
@media (min-width: 768px) { /* 与navbar-expand-md匹配的断点 */
    /* 大屏幕下鼠标悬停展开下拉菜单 */
    .dropdown:hover .dropdown-menu {
        display: block;
        margin-top: 0;
    }
}

@media (max-width: 767.98px) { /* 小屏幕下的样式调整 */
    /* 确保在小屏幕下dropdown-menu有正确的显示方式 */
    .dropdown-menu {
        display: block !important; /* 强制显示 */
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
        padding-left: 1rem; /* 增加左侧内边距，使菜单项缩进 */
    }
    /* 隐藏下拉箭头 */
    .dropdown-toggle::after {
        display: none;
    }
    /* 调整下拉菜单项样式 */
    .dropdown-menu .dropdown-item {
        padding: 0.5rem 1rem;
        color: #4b2e83 !important;
    }

    .dropdown-menu .dropdown-divider {
        margin: 0.3rem 0;
    }
}

/****************************************** 登录区域控制 ********************************************/

/* 全局样式 - 可放到site.css */
.form-control:focus,
.btn:focus {
    border-width: 1px !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

/* 登录容器 */
.login-container {
    max-width: 900px;
    margin: 30px auto;
    padding: 15px;
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

/* 左右布局 - 关键修改：确保两边高度一致 */
.login-left, .login-right {
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between; /* 关键修改：使用space-between */
    min-height: 450px; /* 增加最小高度 */
}

/* 微信登录 - 关键修改：增加容器高度 */
.wechat-login {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 380px; /* 关键修改：高度100% */
    width: 320px; /* 关键修改：宽度100% */
     /*background-color: #07C160;*/ 
    /*background-color: #7ed15f;*/
    background-color:#e8f5e9;
    border-radius: 8px;
}

    .wechat-login h4 {
        margin-bottom: 10px;
        color: #333;
    }

.qrcode-container {
    text-align: center;
    padding: 15px;
    background: white;
    border-radius: 4px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    width: 100%; /* 关键修改：宽度100% */
}

    .qrcode-container img {
        max-width: 200px;
    }

/* 登录选项卡 */
#loginTab .nav-link {
    color: #333 !important;
}

    #loginTab .nav-link.active {
        color: #512bd4 !important;
        background-color: rgba(255, 255, 255, 0.5) !important;
    }

/* 账号密码登录表单 */
.account-options {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
}

    .account-options a {
        color: #333 !important;
        text-decoration: none !important;
    }

        .account-options a:hover {
            color: #512bd4 !important;
        }

/* 短信登录验证码 */
.sms-code-row {
    display: flex;
    align-items: center;
}

    .sms-code-row .form-control {
        flex-grow: 1;
        margin-right: 10px;
    }

/* 第三方登录 */

/* 微软四色logo调整 */
.microsoft-logo-svg {
    vertical-align: middle;
    margin-right: 5px;
    width: 24px;
    height: 24px;
}

/* 自定义外部登录按钮样式 */
.custom-external-login-btn {
    background-color: transparent !important;
    border: 0px solid #dee2e6 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

/* 按钮容器样式 */
.external-login-buttons {
    display: flex;
    gap: 10px; /* 按钮之间的间隔 */
}

/* 响应式 */
@media (max-width: 768px) {
    .login-container {
        margin: 20px;
        padding: 10px;
    }

    .login-left, .login-right {
        padding: 15px;
        min-height: auto; /* 移动端不需要固定高度 */
    }

    .vertical-divider {
        width: 100%;
        height: 1px;
        margin: 15px 0;
    }

    .sms-code-row {
        flex-direction: column;
    }

        .sms-code-row .form-control {
            margin-right: 0;
            margin-bottom: 10px;
        }
}