.demo-container{width:100%;height:100%;flex-direction:column;overflow:hidden;position:relative}.demo-container,.grid-header{display:flex;background:var(--surface-primary,#ffffff)}.grid-header{justify-content:space-between;align-items:center;padding:0 16px 12px;flex-shrink:0;min-width:0;gap:16px;border-bottom:none}.grid-header .header-left{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-top:var(--spacing-6,6px);min-width:0;flex:1 1 auto}.grid-title,h2.grid-title{margin:0;font-size:var(--font-size-16);font-weight:var(--font-weight-600);font-style:normal;color:var(--neutral-800)}.view-count{overflow:hidden;color:var(--neutral-400);text-overflow:ellipsis;font-size:12px;font-weight:500;line-height:140%}.count-badge{background-color:var(--primary-50,#eff6ff);color:var(--primary-600,#2563eb);padding:4px 12px;border-radius:12px;font-size:13px;font-weight:500;font-family:Inter,sans-serif;white-space:nowrap}.breadcrumb-section{padding:12px 16px;font-size:13px;color:var(--text-secondary,#9ca3af);border-bottom:1px solid var(--border-color,#f9fafb);background:var(--surface-primary,#ffffff)}.breadcrumb-section .breadcrumb-text{font-family:Inter,sans-serif;font-weight:400}.border-radius{border-radius:var(--border-radius-radius-4)}.grid-header .header-right{display:flex;align-items:center;gap:16px;flex-shrink:0}.action-header-center .ag-header-cell-label{justify-content:center}.demo-container .action-buttons,.grid-header .action-buttons{display:flex;gap:12px;align-items:center;flex-shrink:0}.demo-container .action-buttons .btn,.grid-header .action-buttons .btn{white-space:nowrap;overflow:visible;text-overflow:clip;flex-shrink:0}.demo-container .action-buttons .btn .material-icons,.demo-container .action-buttons .btn i,.grid-header .action-buttons .btn .material-icons,.grid-header .action-buttons .btn i{flex-shrink:0}.tab-panel{padding:0 16px;justify-content:space-between;gap:12px;min-height:40px;padding:var(--space-200) var(--spacing-12);background:var(--surface-primary,#ffffff);border-bottom:1px solid var(--border-color,#f9fafb)}.tab-left,.tab-panel{display:flex;align-items:center}.tab-left{gap:16px}.tab-right{display:flex;align-items:center;gap:8px}.field-width{width:220px;min-width:0}.filter-multiselect-state{min-width:0}.more-filters{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.tab-list{display:flex;gap:0;align-items:center}.control-buttons{display:flex;gap:8px}.tab-item:hover{color:var(--text-primary,#1a1a1a);background:var(--surface-secondary,#fafafa)}.tab-item.active{color:var(--primary-500,#3b82f6);background:var(--surface-secondary,rgba(59,130,246,.08));border-bottom:2px solid var(--primary-500,#3b82f6)}.header-search-container{position:relative;display:flex;align-items:center;background:var(--surface-secondary,#fafafa);border-radius:6px;border:1px solid var(--border-color,#f9fafb);overflow:hidden;width:100%}.header-search-input{padding:8px 12px;border:none;background:var(--surface-primary,#ffffff);font-size:14px;width:224px;outline:none;color:var(--text-primary,#1a1a1a);height:36px;border-radius:var(--border-radius-radius-4);font-family:Inter,sans-serif}.header-search-input::-moz-placeholder{color:var(--text-secondary,#9ca3af)}.header-search-input::placeholder{color:var(--text-secondary,#9ca3af)}.header-search-btn{padding:8px 12px;border:none;background:var(--primary-500);color:white;cursor:pointer;border-radius:0 4px 4px 0;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease;height:36px;width:36px}.header-search-btn:hover{background:var(--primary-600)}.header-search-btn i{font-size:18px}.control-btn{padding:6px;border:none;background:none;cursor:pointer;border-radius:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;width:32px;height:32px}.control-btn,.control-btn i{color:var(--text-secondary,#9ca3af)}.grid-container{margin:0;background:var(--surface-primary,#ffffff);width:100%;max-width:100%;overflow:hidden;display:flex;flex-direction:column}.icon-size{font-size:16px!important;width:16px;height:16px}.material-icons.size-bg,.material-symbols-outlined.size-bg{font-size:16px;width:16px;height:16px}.btn-group{display:flex;justify-content:center;align-items:center;gap:2px;border-radius:var(--border-radius-radius-4);background:var(--surface-primary,#ffffff)}.btn-group,.swap-btn-border{border:.5px solid var(--border-color,#f9fafb)}.swap-btn-border{height:36px}.btn-background{background:var(--surface-primary,#ffffff)}.vertical-line{width:1px;background:linear-gradient(to bottom,var(--utility-bg-2,rgba(148,163,184,.2)) 0,var(--border-color,#d1d5db) 50%,var(--border-color,#d1d5db) 50%,var(--utility-bg-2,rgba(148,163,184,.2)) 100%);flex-shrink:0;align-self:stretch;gap:10px}.d-flex{display:flex}.align-items-center{align-items:center}.text-color{color:var(--text-secondary,#9ca3af)}.web-url-link{color:var(--primary-500);text-decoration:none}.web-url-link:hover{text-decoration:underline}.count{background-color:var(--primary-50);padding:var(--spacing-4) var(--spacing-12);border-radius:var(--radius-full);font-size:var(--font-size-14);color:var(--primary-600);font-family:Inter,sans-serif;font-weight:500}.loading{padding:20px;text-align:center;color:var(--text-secondary,#9ca3af)}.swap-size,.table-size{font-size:20px}.grid-icon{display:inline-flex;align-items:center}@media (max-width:768px){.grid-header,.tab-panel{flex-direction:column;gap:16px;align-items:flex-start}.search-container,.search-input{width:100%}.grid-container{height:calc(100vh - 250px)}}@media (max-width:480px){.grid-title{font-size:18px}.demo-container .action-buttons,.grid-header .action-buttons{flex-direction:column;gap:8px}.control-buttons{flex-wrap:wrap}}.file-upload-container{width:100%}.upload-category{margin-bottom:1rem}.form-label{font-weight:var(--font-weight-500);color:var(--neutral-700);margin-bottom:.5rem;display:block}.form-control{width:100%;padding:8px 12px;border:1px solid var(--p-color-border-secondary);border-radius:var(--radius-8);background:var(--neutral-0);font-size:var(--font-size-14)}.upload-area{border:2px dashed var(--neutral-200);border-radius:var(--radius-4);text-align:center;cursor:pointer;transition:all .2s ease;background:var(--neutral-25)}.upload-area.drag-over,.upload-area:hover{border-color:var(--primary-500);background:var(--primary-50)}.upload-area.drag-over{transform:scale(1.02)}.upload-content{display:flex;flex-direction:column;padding:var(--spacing-16) var(--spacing-20);align-items:center;gap:var(--spacing-8)}.upload-icon-wrapper{display:flex;align-items:center;justify-content:center}.upload-icon-svg{font-size:24px;color:var(--primary-500-base,#3862C5)}.upload-text-wrapper{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-6)}.upload-text{color:var(--neutral-600,#404246);text-align:center;font-family:Inter,sans-serif;font-size:var(--font-size-14,16px);font-style:normal;font-weight:500;line-height:160%;margin:0}.drag-drop-text{color:var(--primary-500-base,#3862C5);font-weight:500}.accepted-types-text{color:var(--neutral-400,#9ca3af);text-align:center;font-family:Inter,sans-serif;font-size:var(--font-size-14,14px);font-weight:400;margin:0}.upload-button-wrapper{display:flex;justify-content:center;margin-top:var(--spacing-8,8px)}.uploaded-files{margin-top:var(--spacing-20)}.files-table{width:100%;border-collapse:collapse;border-radius:var(--radius-8,8px);overflow:hidden;border:1px solid var(--neutral-100,#f3f4f6)}.files-table,.files-table thead th{background:var(--neutral-0,#ffffff)}.files-table thead th{color:var(--neutral-600,#404246);font-weight:var(--font-weight-500);font-size:var(--font-size-14,14px);padding:var(--spacing-12,12px) var(--spacing-16,16px);text-align:left;border-bottom:1px solid var(--neutral-100,#f3f4f6);font-family:Inter,sans-serif}.checkbox-col{width:40px;padding:var(--spacing-12,12px) var(--spacing-8,8px)!important}.file-checkbox{width:16px;height:16px;cursor:pointer;accent-color:var(--primary-500-base,#3862C5)}.files-table tbody tr{border-bottom:1px solid var(--neutral-100,#f3f4f6);transition:background-color .2s ease}.files-table tbody tr:hover{background-color:var(--neutral-25,#fafafa)}.files-table tbody tr.selected{background-color:var(--primary-50,#e8f0fe)}.files-table tbody tr:last-child{border-bottom:none}.files-table tbody td{padding:var(--spacing-12,12px) var(--spacing-16,16px);vertical-align:middle}.file-name-cell{min-width:200px}.file-name-wrapper{display:flex;align-items:center;gap:var(--spacing-8,8px)}.file-icon{font-size:20px;color:#B22B09;flex-shrink:0;display:inline-flex;align-items:center}.file-name-details{display:flex;flex-direction:column;gap:2px;min-width:0}.file-name-text{color:var(--neutral-900,#111827);font-size:var(--font-size-14,14px);font-weight:var(--font-weight-500);font-family:Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-name-text--editable{display:inline-flex;align-items:center;gap:var(--spacing-6,6px);background:transparent;border:1px solid transparent;padding:var(--spacing-4,4px) var(--spacing-6,6px);border-radius:var(--radius-4,4px);cursor:text;text-align:left;transition:all .15s ease;max-width:100%}.file-name-text--editable:hover{background:var(--neutral-50,#f9fafb);border-color:var(--neutral-200,#e5e7eb)}.file-name-text--editable .file-name-label{color:var(--neutral-900,#111827);font-size:var(--font-size-14,14px);font-weight:var(--font-weight-500);font-family:Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.file-name-text--editable .file-name-edit-icon{font-size:16px;color:var(--neutral-500,#6b7280);opacity:0;transition:opacity .15s ease;flex-shrink:0}.file-name-text--editable:hover .file-name-edit-icon{opacity:1}.file-name-input-wrapper{display:inline-flex;align-items:center;gap:var(--spacing-4,4px);max-width:100%}.file-name-input{flex:1;min-width:0;padding:var(--spacing-4,4px) var(--spacing-6,6px);border:1px solid var(--primary-500-base,#3862c5);border-radius:var(--radius-4,4px);background:var(--neutral-0,#ffffff);color:var(--neutral-900,#111827);font-size:var(--font-size-14,14px);font-weight:var(--font-weight-500);font-family:Inter,sans-serif;outline:none}.file-name-input:focus{box-shadow:0 0 0 2px var(--primary-50,#e8f0fe)}.file-name-ext{color:var(--neutral-500,#6b7280);font-size:var(--font-size-14,14px);font-weight:var(--font-weight-500);font-family:Inter,sans-serif;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0}.file-subtext{color:var(--neutral-400,#9ca3af);font-size:var(--font-size-12,12px);font-weight:var(--font-weight-400);font-family:Inter,sans-serif}.file-date,.file-size{color:var(--neutral-600,#404246);font-size:var(--font-size-14,14px);font-family:Inter,sans-serif;white-space:nowrap}.files-table .status-cell{min-width:150px;display:unset!important;height:auto!important}.status-uploading-wrapper{display:flex;flex-direction:column;gap:var(--spacing-4,4px)}.progress-bar-container{display:flex;align-items:center;gap:var(--spacing-8,8px)}.progress-bar{flex:1;height:6px;background:var(--neutral-100,#f3f4f6);border-radius:3px;overflow:hidden;min-width:80px}.progress-fill{height:100%;background:var(--primary-500-base,#3862C5);transition:width .3s ease;border-radius:3px}.progress-percentage{color:var(--neutral-500,#6b7280);font-size:var(--font-size-12,12px);font-family:Inter,sans-serif;white-space:nowrap;min-width:35px}.status-cancelled,.status-error-wrapper,.status-successful{display:flex;align-items:center;gap:var(--spacing-6,6px)}.status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.cancelled-dot{background:var(--error-500,#ef4444)}.successful-dot{background:var(--success-500,#10b981)}.error-dot{background:var(--error-500,#ef4444)}.status-text{font-size:var(--font-size-14,14px);font-family:Inter,sans-serif;font-weight:var(--font-weight-400)}.cancelled-text{color:var(--error-500,#ef4444)}.successful-text{color:var(--success-500,#10b981)}.error-text{color:var(--error-500,#ef4444)}.actions-cell{text-align:right;width:100px}.action-buttons{display:flex;align-items:center;justify-content:flex-end;gap:var(--spacing-4,4px)}.action-icon-btn{width:24px;height:24px;border:none;background:transparent;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;color:var(--neutral-600,#6b7280);padding:0}.action-icon-btn:hover{background:var(--neutral-100,#f3f4f6)}.action-icon-btn span{font-size:18px}.cancel-btn{color:var(--error-500,#ef4444)}.cancel-btn:hover{background:var(--error-50,#fef2f2);color:var(--error-600,#dc2626)}.retry-btn{color:var(--primary-500-base,#3862C5)}.retry-btn:hover{background:var(--primary-50,#e8f0fe);color:var(--primary-600,#2951b5)}.edit-btn{color:var(--primary-500-base,#3862C5)}.edit-btn:hover{background:var(--primary-50,#e8f0fe);color:var(--primary-600,#2951b5)}.delete-btn{color:var(--error-500,#ef4444)}.delete-btn:hover{background:var(--error-50,#fef2f2);color:var(--error-600,#dc2626)}.theme-dark .upload-area,[data-theme=dark] .upload-area{border-color:var(--dark-neutral-300)!important;background:var(--dark-neutral-450)!important}.theme-dark .upload-area.drag-over,.theme-dark .upload-area:hover,[data-theme=dark] .upload-area.drag-over,[data-theme=dark] .upload-area:hover{border-color:var(--primary-400)!important;background:var(--primary-900)!important}.theme-dark .upload-area.drag-over svg path,.theme-dark .upload-area:hover svg path,[data-theme=dark] .upload-area.drag-over svg path,[data-theme=dark] .upload-area:hover svg path{fill:var(--primary-200)!important}.theme-dark svg path,[data-theme=dark] svg path{fill:var(--primary-400)!important}.document-view-toggle{display:inline-flex;border-radius:var(--border-radius-radius-4);padding:var(--spacing-2);border:1px solid var(--neutral-100);gap:0;background:var(--neutral-0)}.document-view-toggle .toggle-option{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-6);padding:var(--spacing-6) var(--spacing-8);border:none;background:transparent;border-radius:var(--border-radius-radius-4);cursor:pointer;transition:all var(--transition-duration-200) ease;font-family:Inter,sans-serif;font-size:var(--font-size-14);font-weight:var(--font-weight-500);color:var(--neutral-600);white-space:nowrap}.document-view-toggle .toggle-option i.material-symbols-outlined{font-size:var(--font-size-24);color:var(--neutral-400)}.document-view-toggle .toggle-option span{color:inherit}.document-view-toggle .toggle-option.active{background:var(--utility-stroke-light);color:var(--primary-700)}.document-view-toggle .toggle-option.active i.material-symbols-outlined{color:var(--primary-600)}.theme-dark .document-view-toggle .toggle-option.active,[data-theme=dark] .document-view-toggle .toggle-option.active{background-color:var(--dark-neutral-450)!important}.theme-dark .document-view-toggle .toggle-option.active i.material-symbols-outlined,.theme-dark .document-view-toggle .toggle-option.active span,[data-theme=dark] .document-view-toggle .toggle-option.active i.material-symbols-outlined,[data-theme=dark] .document-view-toggle .toggle-option.active span{color:var(--dark-neutral-0)!important}