:root {
   --primary: #3a86ff;
   --primary-light: #4d96ff;
   --secondary: #ff006e;
   --accent: #ffbe0b;
   --dark: #14213d;
   --gray: #8d99ae;
   --light: #edf2f4;
   --card-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
   --card-hover-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
   --transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
   --success: #06d6a0;
   --error: #ef476f;
   --warning: #ffd166;
   --info: #118ab2;
 }

 [v-cloak],
 .v-cloak-hidden {
   display: none !important;
 }

 body {
   font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI",
     Roboto, sans-serif;
   background-color: #f5f7fa;
   color: #333;
   line-height: 1.6;
 }

 .app-container {
   max-width: 1600px;
   margin: 0 auto;
 }

 .navbar,
 .navbar a,
 .navbar span,
 .navbar i {
   color: white !important;
 }

 .navbar a:hover,
 .navbar-brand:hover {
   opacity: 0.9;
   transform: translateY(-1px);
   transition: all 0.2s ease;
 }

 .badge {
   color: white !important;
 }

 .navbar-nav .nav-link {
   position: relative;
   padding-bottom: 5px;
 }

 .navbar-nav .nav-link::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 50%;
   width: 0;
   height: 2px;
   background: white;
   transition: all 0.3s ease;
   transform: translateX(-50%);
 }

 .navbar-nav .nav-link:hover::after {
   width: 60%;
 }

 .navbar {
   background: #4285f4;
   padding: 10px 20px;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
 }

 .navbar-brand {
   font-weight: 600;
   letter-spacing: 0.5px;
   font-size: 1.2rem;
 }

 .navbar-brand i {
   font-size: 1.4rem;
   margin-right: 8px;
   vertical-align: middle;
 }

 .navbar-toggler {
   border-color: rgba(255, 255, 255, 0.5);
 }

 .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%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
 }

 .auth-status {
   font-size: 0.9rem;
   font-weight: 500;
 }

 .auth-status .authenticated {
   color: var(--success);
 }

 .auth-status .unauthenticated {
   color: var(--gray);
 }

 .auth-container {
   display: flex;
   justify-content: center;
   align-items: center;
   min-height: calc(100vh - 70px);
 }

 .auth-form-container {
   max-width: 480px;
   width: 100%;
   padding: 1.5rem;
 }

 .auth-card {
   border-radius: 12px;
   overflow: hidden;
   box-shadow: var(--card-shadow);
   transform: translateY(0);
   transition: var(--transition);
   border: none;
 }

 .auth-card:hover {
   box-shadow: var(--card-hover-shadow);
   transform: translateY(-4px);
 }

 .auth-card-header {
   background: linear-gradient(135deg, var(--primary) 0%, #2667ff 100%);
   color: white;
   padding: 1.5rem;
   text-align: center;
   font-weight: 700;
 }

 .auth-card-body {
   padding: 2rem;
 }

 .auth-card .form-control {
   border-radius: 8px;
   padding: 0.75rem 1.25rem;
   border: 1px solid #e0e4eb;
   transition: var(--transition);
   background-color: #fafbfd;
 }

 .auth-card .form-control:focus {
   border-color: var(--primary);
   box-shadow: 0 0 0 3px rgba(58, 134, 255, 0.2);
 }

 /* 主要内容区域 */
 .main-content {
   padding: 2rem 1.5rem 3rem;
 }

 /* 卡片样式 */
 .dashboard-card {
   min-height: 300px;
   border: none;
   border-radius: 12px;
   overflow: hidden;
   box-shadow: var(--card-shadow);
   transition: var(--transition);
   background: white;
   margin-bottom: 1.5rem;
 }

 .dashboard-card:hover {
   box-shadow: var(--card-hover-shadow);
 }

 .card-header {
   background: linear-gradient(135deg, white 0%, 100%);
   padding: 1rem 1.5rem;
   font-weight: 700;
   font-size: 1.1rem;
   border-bottom: 1px solid #e9ecef;
   color: var(--dark);
 }

 .card-body {
   padding: 1.5rem;
 }

 /* 状态卡片样式 */
 .status-card {
   height: 310px;
   border-left: 4px solid var(--primary);
 }

 .action-card {
   height: 310px;
 }

 .status-highlight {
   font-weight: 700;
   color: var(--primary);
 }

 .scan-interval-input {
   font-size: 1.1rem;
   padding: 0.75rem 1rem;
   text-align: center;
 }

 .scan-interval-preview {
   font-size: 0.9rem;
   color: #6c757d;
   margin-top: 0.5rem;
 }

 /* 按钮样式 */
 .btn {
   border-radius: 8px;
   padding: 0.65rem 1.5rem;
   font-weight: 600;
   letter-spacing: 0.4px;
   transition: var(--transition);
   border: none;
 }

 .btn-primary {
   background: linear-gradient(135deg, var(--primary) 0%, #2667ff 100%);
 }

 .btn-primary:hover,
 .btn-primary:focus {
   background: linear-gradient(135deg,
       var(--primary-light) 0%,
       #3a7cff 100%);
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(58, 134, 255, 0.3);
 }

 .btn-success {
   background: linear-gradient(135deg, var(--success) 0%, #05c793 100%);
 }

 .btn-info {
   background: linear-gradient(135deg, var(--info) 0%, #0c7ca5 100%);
 }

 .btn-outline-primary {
   border: 1px solid var(--primary);
   color: var(--primary);
 }

 .btn-outline-primary:hover {
   background-color: rgba(58, 134, 255, 0.1);
 }

 /* 标签页导航 */
 .nav-tabs {
   border-bottom: 1px solid #e9ecef;
   margin-bottom: 1.5rem;
 }

 .nav-tabs .nav-link {
   font-weight: 600;
   border: none;
   padding: 0.8rem 1.5rem;
   color: var(--gray);
   border-radius: 8px 8px 0 0;
   background-color: transparent;
 }

 .nav-tabs .nav-link.active {
   color: var(--primary);
   background-color: transparent;
   border-bottom: 3px solid var(--primary);
 }

 /* 日志内容 */
 .log-content {
   background-color: #1e1e2d;
   border-radius: 8px;
   color: #e2e8f0;
   font-family: "Fira Code", "Courier New", monospace;
   font-size: 13px;
   max-height: 400px;
   overflow-y: auto;
   padding: 1.25rem;
   line-height: 1.6;
 }

 .log-content pre {
   margin: 0;
 }

 .record-item {
   border-left: 3px solid var(--success);
   padding-left: 15px;
   margin-bottom: 15px;
   transition: var(--transition);
   background-color: white;
   border-radius: 8px;
   padding: 15px;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
 }

 .record-item.failed {
   border-left-color: var(--error);
 }

 .record-item:hover {
   transform: translateX(5px);
   box-shadow: 0 5px 12px rgba(0, 0, 0, 0.08);
 }

 /* 节目列表样式 */
 .show-item {
   border: 1px solid #e9ecef;
   border-radius: 8px;
   padding: 15px;
   background-color: white;
   cursor: pointer;
   transition: all 0.3s ease;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
 }

 .show-item:hover {
   transform: translateY(-2px);
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   border-color: var(--primary);
 }

 .copy-title {
   cursor: pointer;
   transition: color 0.2s ease;
   position: relative;
 }

 .copy-title:hover {
   color: #0d6efd;
 }


 .copy-title:hover .copy-icon {
   opacity: 1;
 }

 .type-badges .badge {
   font-size: 0.75em;
 }

 .gap-2 {
   gap: 0.5rem;
 }

 .gap-3 {
   gap: 1rem;
 }

 .statistics-section {
   background-color: #f8f9fa;
   border-radius: 8px;
   padding: 20px;
 }

 .stat-card {
   background: white;
   border-radius: 8px;
   padding: 15px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
   transition: all 0.3s ease;
 }

 .stat-card:hover {
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
 }

 .stat-icon {
   font-size: 1.5rem;
   color: var(--primary);
   margin-bottom: 8px;
 }

 .stat-number {
   font-size: 1.8rem;
   font-weight: bold;
   color: var(--primary);
   margin-bottom: 4px;
 }

 .stat-label {
   font-size: 0.85rem;
   color: #6c757d;
 }

 .grouping-section {
   background: #f8f9fa;
   padding: 15px;
   border-radius: 8px;
   border: 1px solid #dee2e6;
 }

 .grouping-section .fw-medium {
   color: #495057;
   font-size: 0.9rem;
 }

 .grouping-section .btn-group .btn {
   font-size: 0.875rem;
   padding: 6px 12px;
   border-radius: 4px;
 }

 .grouping-section .btn-group .btn:first-child {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
 }

 .grouping-section .btn-group .btn:last-child {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }

 .filter-section {
   background: #ffffff;
   padding: 15px;
   border-radius: 8px;
   border: 1px solid #e9ecef;
 }

 .filter-section .btn-group {
   flex-wrap: wrap;
   gap: 4px;
 }

 .filter-section .btn-group .btn {
   margin-bottom: 4px;
 }

 /* 记录项样式微调 */
 .record-item h6 {
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .record-item h6 span {
   font-size: 0.9rem;
 }

 .type-group {
   border: 1px solid #e9ecef;
   border-radius: 8px;
   overflow: hidden;
 }

 .type-group-header {
   background: #f8f9fa;
   padding: 10px 15px;
   border-radius: 6px;
   margin-bottom: 15px;
   /* color: white; */
 }

 .type-group-header h6 {
   margin: 0;
   font-weight: 600;
   display: flex;
   align-items: center;
 }

 .type-group-header .badge {
   background: rgba(255, 255, 255, 0.2) !important;
   color: grey !important;
   font-size: 0.75rem;
 }

 /* 季度分组特殊样式 */
 .type-group-header.season-group {
   background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
 }

 @media (max-width: 768px) {

   .grouping-section,
   .filter-section {
     padding: 10px;
   }

   .grouping-section .d-flex,
   .filter-section .d-flex {
     flex-direction: column;
     align-items: flex-start !important;
     gap: 10px !important;
   }

   .btn-group {
     width: 100%;
   }

   .btn-group .btn {
     flex: 1;
   }
 }

 .type-group-content {
   padding: 16px;
 }

 .file-info {
   background-color: #f8f9fa;
   border-radius: 4px;
   padding: 8px;
   margin-top: 8px;
 }

 .filename {
   padding: 2px 6px;
   border-radius: 4px;
   font-size: 0.9em;
   word-break: break-all;
 }

 .type-group-content .record-item {
   box-shadow: none;
   border: 1px solid #e9ecef;
 }

 .type-group-content .record-item:hover {
   transform: none;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
 }

 .success-border {
   border-left: 4px solid var(--success);
 }

 .error-border {
   border-left: 4px solid var(--error);
 }

 /* 系统状态 */
 .status-value {
   font-weight: 600;
   color: var(--dark);
 }

 .status-icon {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   background: rgba(58, 134, 255, 0.1);
   color: var(--primary);
   font-size: 1.2rem;
 }

 @media (max-width: 768px) {
   .main-content {
     padding: 1rem 1rem 2rem;
   }

   .log-files-list {
     margin-bottom: 1rem;
   }

   .auth-card-body {
     padding: 1.5rem;
   }
 }

 /* 动画效果 */
 @keyframes fadeIn {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .animated {
   animation: fadeIn 0.5s ease-out forwards;
 }

 .card-animated {
   animation: fadeIn 0.4s ease-out forwards;
 }

 .delay-1 {
   animation-delay: 0.1s;
 }

 .delay-2 {
   animation-delay: 0.2s;
 }

 .delay-3 {
   animation-delay: 0.3s;
 }

 /* 滚动条样式 */
 ::-webkit-scrollbar {
   width: 8px;
   height: 8px;
 }

 ::-webkit-scrollbar-track {
   background: #f1f1f1;
   border-radius: 4px;
 }

 ::-webkit-scrollbar-thumb {
   background: var(--primary);
   border-radius: 4px;
 }

 ::-webkit-scrollbar-thumb:hover {
   background: var(--primary-light);
 }

 /* 状态徽章 */
 .status-badge {
   padding: 0.35rem 0.7rem;
   border-radius: 20px;
   font-size: 0.85rem;
   font-weight: 600;
 }

 /* 工具提示 */
 .tooltip-icon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 18px;
   height: 18px;
   border-radius: 50%;
   background-color: rgba(0, 0, 0, 0.07);
   color: var(--gray);
   font-size: 0.7rem;
   margin-left: 5px;
   cursor: help;
   vertical-align: middle;
 }

 .modal-overlay {
   position: fixed;
   inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   background: rgba(0, 0, 0, 0.45);
   z-index: 1050;
 }

 .modal-content-custom {
   width: 100%;
   max-width: 700px;
   background: #fff;
   border-radius: 12px;
   box-shadow: var(--card-hover-shadow);
   overflow: hidden;
 }

 .modal-header,
 .modal-footer {
   padding: 1rem 1.5rem;
   background: #f8f9fa;
   border-bottom: 1px solid #e9ecef;
 }

 .modal-footer {
   border-top: 1px solid #e9ecef;
   border-bottom: none;
 }

 .modal-body {
   padding: 1.5rem;
 }

 .fade-enter-active,
 .fade-leave-active {
   transition: opacity 0.25s ease;
 }

 .fade-enter-from,
 .fade-leave-to {
   opacity: 0;
 }

 .unrenamed-modal {
   max-width: 900px;
   max-height: 80vh;
   display: flex;
   flex-direction: column;
 }

 .unrenamed-modal .modal-body {
   flex: 1;
   overflow-y: auto;
   max-height: 60vh;
   padding: 1.5rem;
 }

 .unrenamed-modal .modal-footer {
   flex-shrink: 0;
 }

 .unrenamed-files-list {
   max-height: 400px;
   overflow-y: auto;
   border: 1px solid #e9ecef;
   border-radius: 8px;
   padding: 0.5rem;
 }

 .unrenamed-file-item {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 0.75rem;
   margin-bottom: 0.5rem;
   background: #f8f9fa;
   border-radius: 6px;
   border-left: 3px solid var(--warning);
   transition: var(--transition);
 }

 .unrenamed-file-item:hover {
   background: #e9ecef;
   transform: translateX(2px);
 }

 .unrenamed-file-item:last-child {
   margin-bottom: 0;
 }

 .file-actions {
   display: flex;
   gap: 0.5rem;
   flex-shrink: 0;
 }

 .rename-container {
   flex: 1;
   margin-right: 1rem;
 }

 .rename-input-group {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   margin-top: 0.5rem;
 }

 .rename-input {
   flex: 1;
   padding: 0.5rem;
   border: 2px solid #007bff;
   border-radius: 6px;
   font-size: 0.875rem;
   transition: var(--transition);
 }

 .rename-input:focus {
   outline: none;
   border-color: #0056b3;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }

 .rename-input.is-invalid {
   border-color: #dc3545;
 }

 .rename-actions {
   display: flex;
   gap: 0.25rem;
 }

 .rename-btn {
   padding: 0.375rem 0.5rem;
   border: none;
   border-radius: 4px;
   cursor: pointer;
   transition: var(--transition);
   font-size: 0.75rem;
   min-width: 32px;
   height: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .btn-rename-action:hover {
   color: #3a86ff;
 }



 .rename-btn-confirm {
   background: #28a745;
   color: white;
 }

 .rename-btn-confirm:hover {
   background: #218838;
 }

 .rename-btn-cancel {
   background: #6c757d;
   color: white;
 }

 .rename-btn-cancel:hover {
   background: #5a6268;
 }

 .rename-btn:disabled {
   opacity: 0.6;
   cursor: not-allowed;
 }

 .file-item-editing {
   background: #fff3cd !important;
   border-left-color: #ffc107 !important;
 }

 .file-item-editing:hover {
   background: #fff3cd !important;
   transform: none;
 }

 .rename-error {
   color: #dc3545;
   font-size: 0.75rem;
   margin-top: 0.25rem;
 }

 .fade-enter-active,
 .fade-leave-active {
   transition: opacity 0.3s ease;
 }

 .fade-enter-from,
 .fade-leave-to {
   opacity: 0;
 }

 .whitelist-add-section {
   background: #f8f9fa;
   border-radius: 8px;
   padding: 1rem;
   margin-bottom: 1rem;
   border: 1px solid #e9ecef;
 }

 .section-title {
   font-size: 1rem;
   font-weight: 600;
   color: var(--dark);
   margin-bottom: 0.75rem;
 }

 .whitelist-files-list {
   max-height: 400px;
   overflow-y: auto;
   border: 1px solid #e9ecef;
   border-radius: 8px;
   padding: 0.5rem;
 }

 .modal-content-custom.unrenamed-modal {
   max-width: 900px;
   max-height: 90vh;
   display: flex;
   flex-direction: column;
 }

 .modal-content-custom.unrenamed-modal .modal-body {
   flex: 1;
   overflow-y: auto;
   max-height: 80vh;
   padding: 1.5rem;
 }

 .modal-content-custom.unrenamed-modal .modal-footer {
   flex-shrink: 0;
   padding: 1rem 1.5rem;
 }

 .whitelist-file-item {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 0.75rem;
   margin-bottom: 0.5rem;
   background: #f8f9fa;
   border-radius: 6px;
   border-left: 3px solid var(--info);
   transition: var(--transition);
 }

 .whitelist-file-item.file-type {
   border-left-color: #118AB2;
 }

 .whitelist-file-item.directory-type {
   border-left-color: #7E57C2;
 }

 .whitelist-file-item:hover {
   background: #e9ecef;
   transform: translateX(2px);
 }

 .whitelist-file-item:last-child {
   margin-bottom: 0;
 }

 /* 新增项目样式 */
 .whitelist-file-item.new-item {
   border-left-color: var(--success);
   background: #f0f9f0;
   border: 1px solid #d4edda;
 }

 .whitelist-file-item.new-item:hover {
   background: #e7f4e7;
 }

 .file-info {
   flex: 1;
   margin-right: 1rem;
 }

 .file-name {
   font-size: 0.9rem;
   color: var(--dark);
   margin-bottom: 0.25rem;
 }

 .file-path {
   font-size: 0.8rem;
   word-break: break-all;
   line-height: 1.3;
 }

 /* 类型选择按钮组 */
 .btn-group .btn-check:checked+.btn {
   background-color: var(--primary);
   border-color: var(--primary);
   color: white;
 }

 .btn-group .btn-outline-primary {
   font-size: 0.8rem;
   padding: 0.375rem 0.75rem;
 }

 @media (max-width: 768px) {
   .whitelist-file-item {
     flex-direction: column;
     align-items: flex-start;
   }

   .file-info {
     margin-right: 0;
     margin-bottom: 0.5rem;
     width: 100%;
   }

   .btn-group {
     flex-direction: column;
   }

   .btn-group .btn {
     border-radius: 0.375rem !important;
     margin-bottom: 0.25rem;
   }
 }

 .badge.bg-warning {
   background-color: var(--warning) !important;
   color: var(--dark) !important;
   font-weight: 600;
 }


 @media (max-width: 768px) {
   .unrenamed-modal {
     max-width: 95vw;
     margin: 1rem;
   }

   .unrenamed-file-item {
     flex-direction: column;
     align-items: flex-start;
   }

   .file-info {
     margin-right: 0;
     margin-bottom: 0.5rem;
     width: 100%;
   }
 }

 .regex-input-group {
   display: flex;
   margin-bottom: 0.75rem;
 }

 .regex-upload-btn:hover {
   color: #488fff;
   transform: translateY(-1px);
 }


 .regex-input-group .form-control {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
   border-right: none;
 }

 .regex-input-group .btn {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
   padding: 0.5rem 0.75rem;
 }

 /* 空状态提示 */
 .regex-empty-state {
   background-color: #f8f9fa;
   border-radius: 6px;
   padding: 1rem;
   text-align: center;
   color: #6c757d;
 }

 .debug-results {
   max-height: 60vh;
   overflow-y: auto;
   padding-right: 8px;
 }

 /* 手风琴样式调整 */
 .accordion-button {
   padding: 0.75rem 1.25rem;
   font-size: 0.95rem;
 }

 .accordion-button:not(.collapsed) {
   background-color: #f8f9fa;
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
 }

 .accordion-body {
   padding: 1.25rem;
 }

 /* 代码块样式 */
 code {
   font-family: 'Fira Code', 'Courier New', monospace;
   font-size: 0.9em;
   color: #d63384;
 }

 .debug-group-item {
   background-color: #f8f9fa;
   border-radius: 4px;
   padding: 0.5rem;
 }


 /* 表单文本提示 */
 .form-text {
   margin-left: 5px;
   font-size: 0.85rem;
   color: #6c757d;
 }

 .regex-modal .modal-content-custom {
   max-width: 1000px;
   max-height: 85vh;
   display: flex;
   flex-direction: column;
 }

 .regex-modal .modal-body {
   flex: 1;
   overflow-y: auto;
   padding: 1.5rem;
 }

 .regex-section {
   background: #f8f9fa;
   border-radius: 8px;
   padding: 1.25rem;
   margin-bottom: 0;
   border: 1px solid #e9ecef;
   height: 100%;
 }

 .regex-section-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 1rem;
 }

 .regex-section-title {
   font-size: 1.1rem;
   font-weight: 600;
   color: var(--dark);
   margin: 0;
 }

 .regex-list {
   max-height: 500px;
   overflow-y: auto;
   padding-right: 5px;
 }

 .regex-item {
   display: flex;
   gap: 10px;
   margin-bottom: 10px;
   align-items: center;
 }

 .regex-input {
   flex: 1;
   padding: 0.75rem 1rem;
   border-radius: 6px;
   border: 1px solid #ced4da;
   font-family: 'Courier New', monospace;
   font-size: 14px;
   background-color: #fff;
 }

 .regex-input:focus {
   border-color: var(--primary);
   box-shadow: 0 0 0 3px rgba(58, 134, 255, 0.2);
   outline: none;
 }

 .regex-actions {
   display: flex;
   gap: 5px;
 }

 .regex-add-btn {
   width: 100%;
   margin-top: 10px;
 }

 .regex-empty {
   text-align: center;
   padding: 1.5rem;
   color: #6c757d;
   background: #f1f3f5;
   border-radius: 6px;
 }

 .regex-empty i {
   font-size: 2rem;
   margin-bottom: 0.5rem;
   display: block;
   color: #adb5bd;
 }

 @media (max-width: 768px) {
   .regex-modal .modal-content-custom {
     max-width: 95vw;
     margin: 1rem;
   }

   /* 在小屏幕上恢复上下布局 */
   .regex-modal .row>.col-md-6 {
     margin-bottom: 1rem;
   }

   .regex-section {
     margin-bottom: 1rem;
   }
 }

 .custom-modal-overlay {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.45);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 9999;
   transition: opacity 0.25s ease;
 }

 .custom-modal-overlay {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 0, 0, 0.45);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 9999;
   transition: opacity 0.25s ease;
 }

 .custom-modal {
   background: white;
   border-radius: 12px;
   box-shadow: var(--card-hover-shadow);
   width: 100%;
   max-width: 700px;
   overflow: hidden;
   transform: translateY(20px);
   opacity: 0;
   transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
 }

 .custom-modal.active {
   transform: translateY(0);
   opacity: 1;
 }

 .custom-modal-header {
   padding: 1.25rem 1.5rem;
   display: flex;
   align-items: center;
   border-bottom: 1px solid #e9ecef;
   background: #f8f9fa;
 }

 .modal-icon {
   margin-right: 12px;
   font-size: 1.4rem;
 }

 .modal-success .modal-icon {
   color: var(--success);
 }

 .modal-error .modal-icon {
   color: var(--error);
 }

 .modal-warning .modal-icon {
   color: var(--warning);
 }

 .modal-info .modal-icon {
   color: var(--info);
 }

 .modal-title {
   font-weight: 700;
   font-size: 1.25rem;
   margin: 0;
   color: var(--dark);
 }

 /* 重点优化的modal-body样式 */
 .custom-modal-body {
   padding: 1.75rem;
   color: #495057;
   line-height: 1.7;
   max-height: 60vh;
   overflow-y: auto;
 }

 .modal-body-content {
   font-size: 1.05rem;
   margin-bottom: 1.5rem;
   color: #495057;
 }

 .modal-body-content p {
   margin-bottom: 1rem;
 }

 .modal-body-content strong {
   color: var(--dark);
   font-weight: 600;
 }

 .modal-list {
   list-style-type: none;
   padding: 0;
   margin: 1.5rem 0;
 }

 .modal-list li {
   padding: 0.75rem 1rem;
   background: #f8f9fa;
   border-radius: 6px;
   margin-bottom: 0.5rem;
   display: flex;
   align-items: center;
   border-left: 3px solid var(--primary-light);
 }

 .modal-list li i {
   margin-right: 10px;
   color: var(--primary);
 }

 .modal-code-block {
   background: #f8f9fa;
   border-radius: 6px;
   padding: 1rem;
   font-family: 'Fira Code', 'Courier New', monospace;
   font-size: 0.9rem;
   margin: 1rem 0;
   border-left: 3px solid var(--info);
 }

 .modal-alert {
   padding: 1rem;
   border-radius: 8px;
   margin: 1.5rem 0;
   display: flex;
   align-items: flex-start;
 }

 .modal-alert i {
   font-size: 1.25rem;
   margin-right: 0.75rem;
   margin-top: 0.25rem;
 }

 .alert-success {
   background: rgba(6, 214, 160, 0.1);
   border-left: 3px solid var(--success);
 }

 .alert-error {
   background: rgba(239, 71, 111, 0.1);
   border-left: 3px solid var(--error);
 }

 .alert-warning {
   background: rgba(255, 209, 102, 0.1);
   border-left: 3px solid var(--warning);
 }

 .alert-info {
   background: rgba(17, 138, 178, 0.1);
   border-left: 3px solid var(--info);
 }

 .custom-modal-footer {
   padding: 1.25rem 1.5rem;
   display: flex;
   justify-content: flex-end;
   border-top: 1px solid #e9ecef;
   background: #f8f9fa;
 }

 .modal-btn {
   border-radius: 8px;
   padding: 0.65rem 1.75rem;
   font-weight: 600;
   letter-spacing: 0.4px;
   transition: var(--transition);
   border: none;
   cursor: pointer;
   font-size: 1rem;
 }

 .modal-btn-primary {
   background: linear-gradient(135deg, var(--primary) 0%, #2667ff 100%);
   color: white;
 }

 .modal-btn-primary:hover {
   background: linear-gradient(135deg, #4d96ff 0%, #3a7cff 100%);
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(58, 134, 255, 0.3);
 }

 .modal-btn-secondary {
   background-color: #f8f9fa;
   color: #495057;
   border: 1px solid #e9ecef;
   margin-right: 10px;
 }

 .modal-btn-secondary:hover {
   background-color: #e9ecef;
 }

 /* 弹窗动画 */
 @keyframes fadeIn {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .fade-enter-active,
 .fade-leave-active {
   transition: opacity 0.25s ease;
 }

 .fade-enter,
 .fade-leave-to {
   opacity: 0;
 }

 /* 响应式调整 */
 @media (max-width: 768px) {
   .custom-modal {
     max-width: 90vw;
   }

   .custom-modal-body {
     padding: 1.25rem;
   }

   .modal-btn {
     padding: 0.6rem 1.25rem;
   }
 }

 .toast-container {
   position: fixed;
   top: 20px;
   right: 20px;
   z-index: 9999;
   pointer-events: none;
 }

 /* Toast 项目 */
 .toast-item {
   background: white;
   border-radius: 8px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   margin-bottom: 10px;
   min-width: 300px;
   max-width: 400px;
   opacity: 0;
   transform: translateX(100%);
   transition: all 0.3s ease;
   pointer-events: auto;
   cursor: pointer;
   position: relative;
   overflow: hidden;
 }

 .toast-item.toast-show {
   opacity: 1;
   transform: translateX(0);
 }

 /* Toast 内容 */
 .toast-content {
   display: flex;
   align-items: flex-start;
   padding: 16px;
   gap: 12px;
 }

 .toast-icon {
   font-size: 20px;
   margin-top: 2px;
   flex-shrink: 0;
 }

 .toast-text {
   flex: 1;
   min-width: 0;
 }

 .toast-title {
   font-weight: 600;
   font-size: 14px;
   margin-bottom: 4px;
   color: #333;
 }

 .toast-message {
   font-size: 13px;
   color: #666;
   line-height: 1.4;
   word-wrap: break-word;
 }

 .toast-close {
   background: none;
   border: none;
   font-size: 16px;
   color: #999;
   cursor: pointer;
   padding: 0;
   width: 20px;
   height: 20px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
   transition: color 0.2s ease;
 }

 .toast-close:hover {
   color: #666;
 }

 /* 进度条 */
 .toast-progress {
   position: absolute;
   bottom: 0;
   left: 0;
   height: 3px;
   background: rgba(255, 255, 255, 0.8);
   animation: toast-progress linear;
   animation-fill-mode: forwards;
 }

 @keyframes toast-progress {
   from {
     width: 100%;
   }

   to {
     width: 0%;
   }
 }

 /* 不同类型的样式 */
 .toast-success {
   border-left: 4px solid #06D6A0;
 }

 .toast-success .toast-icon {
   color: #06D6A0;
 }

 .toast-success .toast-progress {
   background: #06D6A0;
 }

 .toast-error {
   border-left: 4px solid #dc3545;
 }

 .toast-error .toast-icon {
   color: #dc3545;
 }

 .toast-error .toast-progress {
   background: #dc3545;
 }

 .toast-warning {
   border-left: 4px solid #ffc107;
 }

 .toast-warning .toast-icon {
   color: #ffc107;
 }

 .toast-warning .toast-progress {
   background: #ffc107;
 }

 .toast-info {
   border-left: 4px solid #17a2b8;
 }

 .toast-info .toast-icon {
   color: #17a2b8;
 }

 .toast-info .toast-progress {
   background: #17a2b8;
 }

 /* 悬停效果 */
 .toast-item:hover {
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
 }

 .toast-item:hover .toast-progress {
   animation-play-state: paused;
 }

 /* 响应式设计 */
 @media (max-width: 480px) {
   .toast-container {
     left: 10px;
     right: 10px;
     top: 10px;
   }

   .toast-item {
     min-width: auto;
     max-width: none;
   }
 }

 /* 统计框样式 */
 .stat-box {
   text-align: center;
   padding: 8px;
   background: #f8f9fa;
   border-radius: 6px;
   border: 1px solid #e9ecef;
 }

 .stat-number {
   font-size: 1.5rem;
   font-weight: bold;
   color: #495057;
 }

 .stat-label {
   font-size: 0.9rem;
   color: #6c757d;
   margin-top: 2px;
 }

 .rename-stats {
   margin-top: 12px;
   padding-top: 12px;
   border-top: 1px solid #e9ecef;
 }

 .stat-item {
   display: flex;
   align-items: center;
   font-size: 0.9rem;
   padding: 4px 0;
 }

 .stat-item i {
   font-size: 0.9rem;
 }

 /* .card-header .badge {
   font-size: 0.7rem;
   padding: 0.25rem 0.5rem;
 } */

 /* 响应式调整 */
 @media (max-width: 768px) {
   .d-flex.gap-2 {
     flex-direction: column;
     gap: 0.5rem;
   }

   .btn-sm {
     font-size: 0.875rem;
   }
 }

 .history-card {
   border: 1px solid #e0e0e0;
   border-radius: 12px;
   background: #ffffff;
   overflow: hidden;
   transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
 }

 .history-card:hover {
   transform: translateY(-2px);
   box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
 }

 .success-card:hover {
   border-color: var(--success);
 }

 .error-card:hover {
   border-color: var(--error);
 }

 .history-card .card-header {
   border-bottom: 1px solid #f0f0f0;
   background: #fafafa;
   padding: 16px 20px;
   font-weight: 500;
 }

 .success-header {
   background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
   color: #1a73e8;
 }

 .error-header {
   background: linear-gradient(135deg, #fff5f5 0%, #ffe8e8 100%);
   color: #dc3545;
 }

 .status-icon {
   font-size: 1.1em;
   margin-right: 8px;
 }

 .history-card .card-body {
   padding: 20px;
 }

 .timestamp-section {
   margin-bottom: 16px;
 }

 .timestamp {
   color: #6c757d;
   font-size: 0.875rem;
 }

 .target-section {
   margin-bottom: 16px;
 }

 .section-label {
   color: #6c757d;
   font-size: 0.875rem;
   display: block;
   margin-bottom: 4px;
 }

 .target-path {
   color: #495057;
   font-size: 0.9rem;
   word-break: break-all;
   background: #f8f9fa;
   padding: 8px 12px;
   border-radius: 6px;
   border-left: 3px solid #007bff;
 }

 .stats-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 12px;
   margin-bottom: 16px;
 }

 .stat-box.main-stat {
   background: #f8f9ff;
   border: 1px solid #e3ebf7;
   border-radius: 8px;
   padding: 16px;
   text-align: center;
   transition: all 0.2s ease;
 }

 .stat-box.main-stat:hover {
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(0, 123, 255, 0.15);
 }

 .stat-number {
   font-size: 1.5rem;
   font-weight: 600;
   color: #1a73e8;
   margin-bottom: 4px;
 }

 .stat-label {
   font-size: 0.875rem;
   color: #6c757d;
   font-weight: 500;
 }

 .detail-stats {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 12px;
   margin-bottom: 16px;
 }

 .detail-stat {
   display: flex;
   align-items: center;
   padding: 8px 12px;
   background: #f8f9fa;
   border-radius: 6px;
   font-size: 0.875rem;
   color: #495057;
 }

 .history-stat-icon {
   font-size: 1rem;
   margin-right: 8px;
   color: #6c757d;
 }

 /* 未重命名文件部分 */
 .unrenamed-section {
   margin-top: 16px;
   padding-top: 16px;
   border-top: 1px solid #f0f0f0;
 }

 .unrenamed-content {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 12px;
 }

 .unrenamed-badge {
   background: #fff3cd;
   color: #856404;
   border: 1px solid #ffeaa7;
   border-radius: 20px;
   padding: 6px 12px;
   font-size: 0.875rem;
   font-weight: 500;
 }

 .unrenamed-btn {
   border-radius: 6px;
   font-size: 0.875rem;
   padding: 6px 12px;
   transition: all 0.2s ease;
 }

 .unrenamed-btn:hover {
   transform: translateY(-1px);
   box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3);
 }

 .error-content {
   padding: 16px;
   background: #fff5f5;
   border: 1px solid #fecaca;
   border-radius: 8px;
 }

 .error-message {
   color: #dc3545;
   font-size: 0.9rem;
   display: flex;
   align-items: flex-start;
   line-height: 1.5;
 }

 .error-message i {
   margin-top: 2px;
   flex-shrink: 0;
 }

 /* 响应式设计 */
 @media (max-width: 768px) {
   .history-card .card-body {
     padding: 16px;
   }

   .stats-grid {
     grid-template-columns: 1fr;
   }

   .detail-stats {
     grid-template-columns: 1fr;
   }

   .unrenamed-content {
     flex-direction: column;
     align-items: stretch;
   }
 }

 /* 卡片动画效果 */
 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(20px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .history-card {
   animation: fadeInUp 0.5s ease-out;
 }

 .history-card:nth-child(even) {
   animation-delay: 0.1s;
 }
 .show-search-container {
  margin-bottom: 1rem;
}

.show-search-container .input-group-text {
  background-color: #f8f9fa;
  border-color: #e9ecef;
}

.show-search-container .form-control {
  border-left: none;
}

.show-search-container .form-control:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.2rem rgba(58, 134, 255, 0.25);
}

.show-search-container .btn-outline-secondary {
  border-color: #e9ecef;
}

.show-search-container .btn-outline-secondary:hover {
  background-color: #e9ecef;
}