/* 移动端适配样式 */

/* 手机版：导航栏左侧 logo+系统名，右侧菜单按钮 */
@media (max-width: 768px) {
    .mobile-navbar {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 0.5rem 0.75rem;
        min-height: 52px;
        background: #fff;
        border-bottom: 1px solid #e2e8f0;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    }
    .mobile-navbar-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }
    .mobile-navbar-left {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        text-decoration: none;
        color: #1e293b;
        min-width: 0;
    }
    .mobile-navbar-logo-img {
        max-height: 32px;
        max-width: 80px;
        object-fit: contain;
    }
    .mobile-navbar-brand {
        font-size: 1rem;
        font-weight: 600;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .mobile-navbar-toggler {
        border: 1px solid #e2e8f0;
        padding: 0.35rem 0.5rem;
        border-radius: 8px;
    }
    .mobile-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%2830, 41, 59, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    }
    /* 左侧抽屉背罩 */
    .mobile-menu-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.35);
        z-index: 1028;
        transition: opacity 0.25s ease;
    }
    .mobile-menu-backdrop.show {
        display: block;
    }
    /* 左侧功能菜单抽屉 */
    .mobile-menu-drawer {
        position: fixed;
        top: 0;
        left: 0;
        width: min(85vw, 300px);
        max-width: 300px;
        height: 100vh;
        background: #fff;
        box-shadow: 4px 0 20px rgba(0,0,0,0.12);
        z-index: 1030;
        display: flex;
        flex-direction: column;
        transform: translateX(-100%);
        transition: transform 0.28s ease;
        overflow: hidden;
    }
    .mobile-menu-drawer.show {
        transform: translateX(0);
    }
    .mobile-menu-header {
        flex-shrink: 0;
        padding: 1rem 1rem 0.75rem;
        border-bottom: 1px solid #e2e8f0;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        position: relative;
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    }
    .mobile-menu-close {
        position: absolute;
        top: 0.75rem;
        right: 0.75rem;
        opacity: 0.7;
        padding: 0.25rem;
    }
    .mobile-menu-logo-img {
        max-width: 72px;
        max-height: 36px;
        object-fit: contain;
        margin-bottom: 0.5rem;
    }
    .mobile-menu-title {
        margin: 0;
        font-size: 0.9375rem;
        font-weight: 600;
        color: #1e293b;
        line-height: 1.3;
    }
    .mobile-menu-body {
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0.5rem 0;
    }
    .mobile-menu-body .nav {
        padding: 0 0.5rem;
    }
    .mobile-menu-drawer .nav-link {
        color: #475569;
        padding: 0.65rem 0.75rem;
        border-radius: 8px;
        margin-bottom: 2px;
        font-size: 0.9375rem;
        display: flex;
        align-items: center;
        border: none;
    }
    .mobile-menu-drawer .nav-link:hover,
    .mobile-menu-drawer .nav-link.active {
        color: #1e40af;
        background: #eff6ff;
    }
    .mobile-menu-drawer .nav-link i {
        margin-right: 0.6rem;
        width: 1.25rem;
        text-align: center;
        font-size: 1.1em;
    }
}

/* 超小屏幕设备 (≤480px) */
@media (max-width: 480px) {
    /* 隐藏侧边栏，使用顶部导航 */
    .sidebar {
        display: none !important;
    }
    
    /* 主内容区域全宽 */
    .main-content {
        margin-left: 0 !important;
        padding: 5px !important;
        padding-top: 40px !important;
    }
    
    /* 确保内容区域在移动端可见 */
    .content-section {
        display: block !important;
        padding: 15px !important;
        margin-top: 10px !important;
    }
    
    .content-section.d-none {
        display: none !important;
    }
    
    .mobile-menu-drawer {
        width: min(90vw, 280px);
    }
    
    .mobile-navbar-brand {
        font-size: 0.9375rem;
    }
    
    /* 主内容区域调整 - 无顶部padding */
    body {
        padding-top: 0 !important;
    }
    
    .container-fluid {
        padding: 0 !important;
    }
}

/* 小屏幕设备 (481px-768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .sidebar {
        display: none !important;
    }
    .main-content {
        margin-left: 0 !important;
        padding: 10px !important;
        padding-top: 50px !important;
    }
    .content-section {
        display: block !important;
        padding: 15px !important;
        margin-top: 15px !important;
    }
    .content-section.d-none {
        display: none !important;
    }
    body {
        padding-top: 0 !important;
    }
    .container-fluid {
        padding: 0 !important;
    }
}

/* 通用移动端样式 */
@media (max-width: 768px) {
    /* 卡片样式调整 */
    .card {
        margin-bottom: 15px;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    .card-header {
        padding: 15px;
        font-size: 16px;
        font-weight: bold;
    }
    
    .card-body {
        padding: 15px;
    }
    
    /* 按钮样式调整 */
    .btn {
        padding: 8px 16px;
        font-size: 14px;
        border-radius: 6px;
    }
    
    .btn-sm {
        padding: 6px 12px;
        font-size: 12px;
    }
    
    /* 表格响应式 */
    .table-responsive {
        border-radius: 8px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .table {
        font-size: 14px;
        margin-bottom: 0;
    }
    
    .table th,
    .table td {
        padding: 8px 6px;
        white-space: nowrap;
    }
    
    .table th {
        font-size: 12px;
        font-weight: bold;
        background: #f8f9fa;
    }
    
    /* 表格列隐藏（在小屏幕上隐藏次要列） */
    .table .d-none-mobile {
        display: none !important;
    }
    
    /* 移动端操作按钮优化 */
    .table td:last-child {
        padding: 4px 6px !important;
    }
    
    /* 操作按钮容器 - 另起一行并与第一行垂直对齐 */
    .mobile-actions {
        display: flex !important;
        flex-direction: row !important;
        gap: 2px;
        align-items: center;
        justify-content: flex-start !important;
        width: auto;
        max-width: 100%;
        margin: 4px 0 0 0;
        padding: 0;
        flex-wrap: wrap;
        position: relative;
        text-align: left !important;
    }
    
    /* 确保手机版操作按钮从左开始排列 */
    .table td:last-child .mobile-actions {
        justify-content: flex-start !important;
        align-items: flex-start !important;
    }
    
    /* 手机版操作按钮强制左对齐 */
    @media (max-width: 768px) {
        .mobile-actions {
            justify-content: flex-start !important;
            text-align: left !important;
        }
        
        .mobile-actions .btn {
            margin-right: 2px;
            margin-left: 0;
        }
    }
    
    /* 移动端操作按钮样式 - 紧凑设计 */
    .table .btn-sm {
        padding: 4px 6px;
        font-size: 10px;
        min-width: 28px;
        min-height: 28px;
        border-radius: 3px;
        margin: 0;
        flex-shrink: 1;
        white-space: nowrap;
    }
    
    /* 操作按钮图标 - 紧凑图标 */
    .table .btn-sm i {
        font-size: 10px;
    }
    
    /* 移动端操作按钮另起一行排列 */
    .table td:last-child {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 4px 6px !important;
        vertical-align: top;
    }
    
    .table td:last-child .btn {
        display: inline-block;
        width: auto;
        margin-right: 2px;
        margin-bottom: 0;
        flex: 0 0 auto;
    }
    
    .table td:last-child .btn:last-child {
        margin-right: 0;
    }
    
    /* 超小屏幕进一步优化 */
    @media (max-width: 480px) {
        .mobile-actions {
            gap: 1px;
        }
        
        .table .btn-sm {
            padding: 3px 5px;
            font-size: 9px;
            min-width: 24px;
            min-height: 24px;
        }
        
        .table .btn-sm i {
            font-size: 9px;
        }
        
        .table td:last-child .btn {
            margin-right: 1px;
        }
    }
    
    /* 桌面端保持水平排列 */
    @media (min-width: 769px) {
        .mobile-actions {
            display: flex;
            flex-direction: row;
            gap: 8px;
            align-items: center;
        }
        
        .table td:last-child .btn {
            display: inline-block;
            width: auto;
            margin-bottom: 0;
        }
    }
    
    /* 超小屏幕进一步优化 */
    @media (max-width: 480px) {
        .table td:last-child {
            padding: 2px 4px !important;
        }
        
        .table .btn-sm {
            padding: 4px 6px;
            font-size: 10px;
            min-width: 28px;
            min-height: 28px;
        }
        
        .table .btn-sm i {
            font-size: 10px;
        }
    }
    
    /* 附件操作按钮移动端优化 */
    .mobile-actions-container {
        margin-top: 8px;
    }
    
    .mobile-actions-container .btn {
        min-width: 36px;
        min-height: 36px;
        font-size: 14px;
        padding: 8px 12px;
    }
    
    .mobile-actions-container .btn i {
        font-size: 14px;
    }
    
    /* 模态框调整 */
    .modal-dialog {
        margin: 10px;
        max-width: calc(100% - 20px);
    }
    
    .modal-content {
        border-radius: 8px;
    }
    
    .modal-header {
        padding: 15px;
        border-bottom: 1px solid #dee2e6;
    }
    
    .modal-body {
        padding: 15px;
        max-height: calc(100vh - 200px);
        overflow-y: auto;
    }
    
    .modal-footer {
        padding: 15px;
        border-top: 1px solid #dee2e6;
    }
    
    /* 表单样式调整 */
    .form-group {
        margin-bottom: 15px;
    }
    
    .form-control {
        font-size: 16px; /* 防止iOS缩放 */
        padding: 10px 12px;
        border-radius: 6px;
    }
    
    .form-label {
        font-weight: bold;
        margin-bottom: 5px;
    }
    
    /* 搜索和筛选区域 */
    .search-filters {
        background: #f8f9fa;
        padding: 15px;
        margin-bottom: 15px;
        border-radius: 8px;
    }
    
    .search-filters .form-control {
        margin-bottom: 10px;
    }
    
    /* 分页在下方 @media (max-width: 768px) 中统一处理 */
    
    /* 状态标签调整 */
    .badge {
        font-size: 11px;
        padding: 4px 8px;
    }
    
    /* 操作按钮组 */
    .btn-group-mobile {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }
    
    .btn-group-mobile .btn {
        width: 100%;
        margin-bottom: 5px;
    }
    
    /* 图片查看器调整 */
    .image-viewer .modal-dialog {
        max-width: 95%;
        margin: 10px auto;
    }
    
    .image-viewer .modal-body {
        padding: 0;
        text-align: center;
    }
    
    .image-viewer img {
        max-width: 100%;
        height: auto;
    }
    
    /* 附件显示调整 */
    .attachment-item {
        display: flex;
        align-items: center;
        padding: 10px;
        border: 1px solid #dee2e6;
        border-radius: 6px;
        margin-bottom: 10px;
        background: #f8f9fa;
    }
    
    .attachment-item .attachment-icon {
        margin-right: 10px;
        font-size: 20px;
    }
    
    .attachment-item .attachment-info {
        flex: 1;
    }
    
    .attachment-item .attachment-name {
        font-weight: bold;
        margin-bottom: 2px;
    }
    
    .attachment-item .attachment-size {
        font-size: 12px;
        color: #6c757d;
    }
    
    /* 统计卡片调整 */
    .stats-card {
        text-align: center;
        padding: 20px;
        background: white;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        margin-bottom: 15px;
    }
    
    .stats-card .stats-number {
        font-size: 24px;
        font-weight: bold;
        color: #007bff;
        margin-bottom: 5px;
    }
    
    .stats-card .stats-label {
        font-size: 14px;
        color: #6c757d;
    }
    
    /* 隐藏桌面端元素 */
    .d-desktop {
        display: none !important;
    }
    
    /* 显示移动端元素 */
    .d-mobile {
        display: block !important;
    }
    
}

/* 大屏隐藏手机版菜单与背罩 */
@media (min-width: 769px) {
    .mobile-menu-backdrop,
    .mobile-menu.mobile-menu-drawer {
        display: none !important;
    }
}

/* 平板端适配 (769px-1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .sidebar {
        width: 200px;
    }
    
    .main-content {
        margin-left: 200px;
    }
    
    .table th,
    .table td {
        padding: 10px 8px;
        font-size: 13px;
    }
    
    .modal-dialog {
        max-width: 80%;
    }
}

/* 横屏适配 */
@media (max-width: 768px) and (orientation: landscape) {
    .mobile-menu {
        height: calc(100vh - 50px);
    }
    
    .modal-dialog {
        max-width: 90%;
    }
    
    .modal-body {
        max-height: calc(100vh - 150px);
    }
}

/* 触摸优化 */
@media (max-width: 768px) {
    /* 增加触摸目标大小 */
    .btn,
    .nav-link,
    .page-link {
        min-height: 44px;
        min-width: 44px;
    }
    
    /* 模态框内下拉框：保证可点击、能弹出原生选择器（覆盖 * touch-action） */
    .modal .form-select {
        min-height: 44px;
        font-size: 16px;
        touch-action: auto !important;
        cursor: pointer;
        -webkit-appearance: menulist;
        appearance: menulist;
        pointer-events: auto;
    }
    #deviceRepairModal .form-select#repair-type,
    #deviceRepairModal .form-select#repair-department {
        min-height: 44px;
        touch-action: auto !important;
    }
    
    /* 优化滚动 */
    .table-responsive,
    .modal-body {
        -webkit-overflow-scrolling: touch;
    }
    
    /* 禁用双击缩放 */
    * {
        touch-action: manipulation;
    }
}

/* 强制移动端显示 */
@media (max-width: 768px) {
    .mobile-navbar {
        display: flex !important;
    }
    
    .mobile-menu.mobile-menu-drawer {
        display: flex !important;
    }
    
    .sidebar {
        display: none !important;
    }
    
    .main-content {
        margin-left: 0 !important;
        padding: 10px !important;
        padding-top: 40px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
    }
    
    .content-section {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .content-section.d-none {
        display: none !important;
    }
}

/* 手机版分页排版（≤768px 统一） */
@media (max-width: 768px) {
    nav[aria-label*="分页"],
    nav .pagination {
        margin-left: -4px;
        margin-right: -4px;
    }
    
    .pagination {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 6px;
        margin: 12px 0;
        padding: 0 4px;
    }
    
    .pagination .page-item {
        margin: 0;
    }
    
    .pagination .page-link {
        padding: 10px 12px;
        font-size: 14px;
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        white-space: nowrap;
    }
    
    .pagination .page-item.disabled:last-child {
        flex-basis: 100%;
        text-align: center;
        margin-top: 8px;
        padding-top: 4px;
        border-top: 1px solid #dee2e6;
    }
    
    .pagination .page-item.disabled:last-child .page-link {
        width: 100%;
        min-width: unset;
        background: transparent;
        border: none;
        color: #6c757d;
        font-size: 13px;
    }
    
    .pagination .page-item.active .page-link {
        font-weight: 600;
    }

    /* ========== 手机版维护记录列表：单 TR 单 TD 内表头条+内容 ========== */
    #maintenance .maintenance-content-cell .maintenance-record-header-cell {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        border-radius: 8px 8px 0 0 !important;
    }
    #maintenance .maintenance-content-cell .maintenance-header-inner {
        display: block !important;
        width: 100% !important;
        min-height: 10px !important;
        padding: 0 !important;
        background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%) !important;
        border-radius: 8px 8px 0 0 !important;
        box-sizing: border-box;
    }

    /* ========== 手机版列表占满视口宽度，避免只显示 1/4 或一半 ========== */
    #maintenance,
    #device-repairs {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
    }
    #maintenance .content-section-inner,
    #maintenance .card-body,
    #device-repairs .content-section-inner,
    #device-repairs .card-body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        box-sizing: border-box;
    }
    #device-repairs .table-responsive,
    #maintenance .table-responsive {
        overflow-x: visible !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
    }
    #device-repairs .table,
    #maintenance .table {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    #device-repairs .table td,
    #maintenance .table td {
        display: block !important;
        width: 100% !important;
        white-space: normal !important;
        max-width: 100% !important;
        min-width: 0;
        box-sizing: border-box;
    }
    #device-repairs .device-repair-content-cell,
    #maintenance .maintenance-content-cell {
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    #device-repairs .device-repair-content-inner,
    #maintenance .maintenance-content-inner {
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* ========== 手机版设备报修列表：单 TR 单 TD，表头与明细合并，无外边框 ========== */
    #device-repairs .device-repair-content-cell .device-repair-record-header-cell {
        display: block !important;
        width: 100% !important;
        padding: 0.25rem 0 0.5rem !important;
        border: none !important;
        background: transparent !important;
    }
    #device-repairs .device-repair-content-cell .device-repair-header-inner {
        display: block !important;
        width: 100% !important;
        padding: 0.4rem 0.75rem !important;
        border: none !important;
        border-radius: 6px !important;
        background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%) !important;
    }
    #device-repairs .device-repair-content-inner {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        padding: 0.5rem 0.75rem 0.75rem !important;
        background: #fafbfc;
        border-radius: 0 0 8px 8px;
        border: 1px solid #e2e8f0;
        border-top: none;
        gap: 0 0.75rem;
    }
    /* 第一行：图片左侧，故障描述右侧 */
    #device-repairs .device-repair-content-inner > .device-repair-cell-photo {
        grid-column: 1;
        grid-row: 1;
        align-self: start;
        border-bottom: 1px solid #f1f5f9;
        padding-bottom: 0.5rem !important;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-fault {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        border-bottom: 1px solid #f1f5f9;
        padding-bottom: 0.5rem !important;
    }
    /* 其余行占满整行（设备名称在报修类型前） */
    #device-repairs .device-repair-content-inner > .device-repair-cell-device {
        grid-column: 1 / -1;
        grid-row: 2;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-type {
        grid-column: 1 / -1;
        grid-row: 3;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-dept {
        grid-column: 1 / -1;
        grid-row: 4;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-reporter {
        grid-column: 1 / -1;
        grid-row: 5;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-type,
    #device-repairs .device-repair-content-inner > .device-repair-cell-device,
    #device-repairs .device-repair-content-inner > .device-repair-cell-dept,
    #device-repairs .device-repair-content-inner > .device-repair-cell-reporter {
        border-bottom: 1px solid #f1f5f9;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-actions {
        grid-column: 1 / -1;
        grid-row: 6;
        border-bottom: none;
        padding-bottom: 0 !important;
    }
    /* 明细行：标签 + "：" + 值，标签与取值保留间距（去掉图片、操作文字） */
    #device-repairs .device-repair-content-inner > .device-repair-cell-photo,
    #device-repairs .device-repair-content-inner > .device-repair-cell-type,
    #device-repairs .device-repair-content-inner > .device-repair-cell-device,
    #device-repairs .device-repair-content-inner > .device-repair-cell-fault,
    #device-repairs .device-repair-content-inner > .device-repair-cell-dept,
    #device-repairs .device-repair-content-inner > .device-repair-cell-reporter,
    #device-repairs .device-repair-content-inner > .device-repair-cell-actions {
        display: flex !important;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 0.25rem 0.5rem;
        width: 100% !important;
        min-width: 0;
        max-width: 100%;
        padding: 0.5rem 0 !important;
        font-size: 0.9rem;
        word-break: break-word;
        box-sizing: border-box;
    }
    /* 故障描述在右侧时也显示 "故障描述：" */
    #device-repairs .device-repair-content-inner > .device-repair-cell-type::before,
    #device-repairs .device-repair-content-inner > .device-repair-cell-device::before,
    #device-repairs .device-repair-content-inner > .device-repair-cell-fault::before,
    #device-repairs .device-repair-content-inner > .device-repair-cell-dept::before,
    #device-repairs .device-repair-content-inner > .device-repair-cell-reporter::before {
        content: attr(data-label) "：";
        flex: 0 0 auto;
        min-width: 4.2em;
        margin-right: 0.35em;
        font-size: 0.8rem;
        font-weight: 600;
        color: #64748b;
        letter-spacing: 0.02em;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-photo::before,
    #device-repairs .device-repair-content-inner > .device-repair-cell-actions::before {
        content: none !important;
        display: none !important;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-photo .repair-list-photos {
        width: 100%;
    }
    #device-repairs .device-repair-content-inner > .device-repair-cell-photo .repair-list-photo-thumb {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 420px !important;
        object-fit: contain !important;
    }

    /* ========== 手机版维护记录列表：布局参照设备报修，单 TR 单 TD，表头+明细一块卡 ========== */
    #maintenance .maintenance-content-cell .maintenance-record-header-cell {
        display: block !important;
        width: 100% !important;
        padding: 0.25rem 0 0.5rem !important;
        border: none !important;
        background: transparent !important;
    }
    #maintenance .maintenance-content-cell .maintenance-header-inner {
        display: block !important;
        width: 100% !important;
        padding: 0.4rem 0.75rem !important;
        border: none !important;
        border-radius: 8px 8px 0 0 !important;
        background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%) !important;
    }
    #maintenance .maintenance-header-text {
        display: block !important;
    }
    #maintenance .maintenance-content-inner {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        padding: 0.5rem 0.75rem 0.75rem !important;
        background: #fafbfc;
        border-radius: 0 0 8px 8px;
        border: 1px solid #e2e8f0;
        border-top: none;
        gap: 0 0.75rem;
    }
    /* 第一行：图片左侧，维护内容右侧 */
    #maintenance .maintenance-content-inner > .maintenance-cell-photo {
        grid-column: 1;
        grid-row: 1;
        align-self: start;
        padding: 0.5rem 0 !important;
        border-bottom: 1px solid #f1f5f9;
        padding-bottom: 0.5rem !important;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-right {
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        border-bottom: 1px solid #f1f5f9;
        padding-bottom: 0.5rem !important;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-category {
        grid-column: 1 / -1;
        grid-row: 2;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-device {
        grid-column: 1 / -1;
        grid-row: 3;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-performer {
        grid-column: 1 / -1;
        grid-row: 4;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-category,
    #maintenance .maintenance-content-inner > .maintenance-cell-device,
    #maintenance .maintenance-content-inner > .maintenance-cell-performer {
        border-bottom: 1px solid #f1f5f9;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-actions {
        grid-column: 1 / -1;
        grid-row: 5;
        border-bottom: none;
        padding-bottom: 0 !important;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-photo,
    #maintenance .maintenance-content-inner > .maintenance-cell-category,
    #maintenance .maintenance-content-inner > .maintenance-cell-device,
    #maintenance .maintenance-content-inner > .maintenance-cell-right,
    #maintenance .maintenance-content-inner > .maintenance-cell-performer,
    #maintenance .maintenance-content-inner > .maintenance-cell-actions {
        min-width: 0;
        max-width: 100%;
        padding: 0.5rem 0 !important;
        font-size: 0.9rem;
        word-break: break-word;
        box-sizing: border-box;
    }
    /* 标签与值之间加 "：" 并保留间距；不显示「图片」「操作」标签文字 */
    #maintenance .maintenance-content-inner .maintenance-label {
        display: inline !important;
        font-size: 0.8rem;
        font-weight: 600;
        color: #64748b;
        margin-right: 0.35em;
    }
    #maintenance .maintenance-content-inner .maintenance-label::after {
        content: "：";
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-photo .maintenance-label,
    #maintenance .maintenance-content-inner > .maintenance-cell-actions .maintenance-label {
        display: none !important;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-photo .maintenance-list-photos {
        width: 100%;
        overflow: visible !important;
        min-height: 60px;
    }
    #maintenance .maintenance-content-inner > .maintenance-cell-photo .maintenance-list-photo-thumb,
    #maintenance .maintenance-content-inner > .maintenance-cell-photo img.maintenance-list-photo-thumb {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 80px !important;
        max-height: 420px !important;
        object-fit: contain !important;
    }
}