/* 响应式设计增强 - 特别针对手机端 */

/* 基础响应式设置 */
@media (max-width: 768px) {
    /* 侧边栏调整 */
    .sidebar {
        width: 60px;
        padding-top: 60px;
        z-index: 999;
        transition: all 0.3s ease;
    }
    
    .sidebar-menu a {
        padding: 12px 5px;
        text-align: center;
    }
    
    .sidebar-menu a span {
        display: none;
    }
    
    .main-content {
        margin-left: 60px;
        padding: 70px 10px 10px;
    }
    
    /* 表单调整 */
    .form-col {
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    /* 头部调整 */
    .header {
        padding: 10px 0;
    }
    
    .logo {
        font-size: 16px;
    }
    
    .user-info span {
        display: none;
    }
}

/* 手机端表格响应式处理 */
@media (max-width: 576px) {
    /* 滚动表格方式 */
    .table-responsive {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    /* 表格内容调整 */
    .table {
        min-width: 800px; /* 确保表格有足够宽度显示所有内容 */
    }
    
    .table th, .table td {
        white-space: nowrap;
        padding: 10px 8px;
    }
    
    /* 密码显示调整 */
    .toggle-password, .copy-password {
        padding: 3px 6px;
        font-size: 12px;
    }
    
    /* 操作按钮调整 */
    .action-btn {
        margin: 2px;
        padding: 3px 6px;
        font-size: 12px;
        height: 24px;
    }
    
    
    /* 操作按钮调整 */
    .action-btn {
        margin: 3px;
        padding: 6px 10px;
        height: 30px;
    }
    
    /* 密码显示调整 */
    .password-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .password-container button {
        margin-top: 5px;
    }
    
    /* 搜索区域调整 */
    .search-area {
        padding: 15px 10px;
    }
    
    .search-area .btn {
        width: 100%;
        margin-top: 10px;
        margin-right: 0;
    }
    
    /* 统计卡片调整 */
    .stat-card {
        min-width: 100%;
        margin: 0 0 10px 0;
    }
    
    /* 详情页表格调整 */
    .detail-table th, .detail-table td {
        display: block;
        width: 100%;
    }
    
    .detail-table th {
        padding: 10px;
        border-bottom: none;
    }
    
    .detail-table td {
        padding: 10px;
        border-bottom: 1px solid #e8e8e8;
    }
}

/* 超小屏幕设备 */
@media (max-width: 375px) {
    .card-body {
        padding: 15px 10px;
    }
    
    .page-title {
        font-size: 18px;
    }
    
    .btn {
        padding: 6px 12px;
        font-size: 13px;
    }
}
