| |
|
|
| |
| .geist-table { |
| width: 100%; |
| border-collapse: separate; |
| border-spacing: 0; |
| font-size: 13px; |
| |
| } |
|
|
| .geist-table th { |
| text-align: center; |
| |
| padding: 0 16px; |
| border-bottom: 1px solid var(--accents-1); |
| color: var(--accents-5); |
| font-weight: 500; |
| height: 40px; |
| |
| background: #fff; |
| } |
|
|
| .geist-table th.text-left { |
| text-align: left; |
| } |
|
|
| .geist-table th.text-right { |
| text-align: right; |
| } |
|
|
| .geist-table td { |
| padding: 8px 14px; |
| border-bottom: 1px solid #fafafa; |
| background: #fff; |
| vertical-align: middle; |
| height: 44px; |
| color: var(--accents-6); |
| text-align: center; |
| |
| transition: background 0.15s; |
| font-size: 12px; |
| } |
|
|
| .geist-table td.text-left { |
| text-align: left; |
| } |
|
|
| .geist-table td.text-right { |
| text-align: right; |
| } |
|
|
| .geist-table tr:last-child td { |
| border-bottom: none; |
| } |
|
|
| .geist-table tr:hover td { |
| background: #fafafa; |
| } |
|
|
| .geist-table tr.row-selected td { |
| background: #f6f7f9; |
| } |
|
|
| .geist-table tr.row-selected:hover td { |
| background: #f0f2f5; |
| } |
|
|
| .pagination-bar { |
| display: flex; |
| align-items: center; |
| justify-content: space-between; |
| gap: 12px; |
| padding: 8px 4px; |
| } |
|
|
| |
| .badge { |
| display: inline-flex; |
| align-items: center; |
| padding: 0 8px; |
| height: 20px; |
| border-radius: 9999px; |
| font-size: 12px; |
| font-weight: 500; |
| line-height: 20px; |
| white-space: nowrap; |
| } |
|
|
| .badge-gray { |
| background: #f3f4f6; |
| color: #4b5563; |
| } |
|
|
| .badge-green { |
| background: #ecfdf5; |
| color: #059669; |
| } |
|
|
| .badge-orange { |
| background: #fff7ed; |
| color: #d97706; |
| } |
|
|
| .badge-red { |
| background: #fef2f2; |
| color: #dc2626; |
| } |
|
|
| .badge-purple { |
| background: #f3e8ff; |
| color: #9333ea; |
| } |
|
|
| .checkbox { |
| width: 12px; |
| height: 12px; |
| border-radius: 4px; |
| border: 1px solid var(--accents-3); |
| appearance: none; |
| cursor: pointer; |
| position: relative; |
| background: #fff; |
| transition: all 0.2s; |
| margin: 0 auto; |
| |
| display: block; |
| } |
|
|
| .checkbox:checked { |
| background-color: #000; |
| border-color: #000; |
| } |
|
|
| .checkbox:checked::after { |
| content: ''; |
| position: absolute; |
| top: 45%; |
| left: 50%; |
| width: 3px; |
| height: 6px; |
| border: solid white; |
| border-width: 0 2px 2px 0; |
| transform: translate(-50%, -60%) rotate(45deg); |
| } |
|
|
| .checkbox:focus-visible { |
| outline: none; |
| box-shadow: 0 0 0 2px #000; |
| border-color: #000; |
| } |
|
|
| |
| .table-wrapper { |
| border-radius: 8px; |
| overflow: hidden; |
| } |
|
|
| .batch-link { |
| font-size: 12px; |
| color: var(--accents-5); |
| text-decoration: underline; |
| background: transparent; |
| border: none; |
| } |
|
|
| .batch-link:hover { |
| color: #000; |
| } |
|
|
| .toolbar-sep { |
| width: 1px; |
| height: 14px; |
| background: var(--border); |
| display: inline-block; |
| } |
|
|
| #batch-actions { |
| background: rgba(255, 255, 255, 0.92); |
| border: 1px solid var(--border); |
| backdrop-filter: blur(10px); |
| box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); |
| } |
|
|
| #batch-actions .geist-button-outline:hover { |
| background: #f3f4f6; |
| } |
|
|
| .modal-overlay { |
| position: fixed; |
| inset: 0; |
| z-index: 50; |
| display: flex; |
| align-items: center; |
| justify-content: center; |
| background: rgba(0, 0, 0, 0.35); |
| backdrop-filter: blur(4px); |
| opacity: 0; |
| pointer-events: none; |
| transition: opacity 0.2s ease; |
| } |
|
|
| .modal-overlay.hidden { |
| display: none; |
| } |
|
|
| .modal-overlay.is-open { |
| opacity: 1; |
| pointer-events: auto; |
| } |
|
|
| .modal-content { |
| background: #fff; |
| border-radius: 12px; |
| padding: 16px; |
| box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2); |
| width: 100%; |
| transform: scale(0.96); |
| transition: transform 0.2s ease; |
| font-size: 13px; |
| color: var(--accents-6); |
| } |
|
|
| .modal-overlay.is-open .modal-content { |
| transform: scale(1); |
| } |
|
|
| .modal-lg { |
| max-width: 520px; |
| } |
|
|
| .modal-md { |
| max-width: 420px; |
| } |
|
|
| .modal-header { |
| display: flex; |
| align-items: center; |
| justify-content: space-between; |
| margin-bottom: 10px; |
| } |
|
|
| .modal-title { |
| font-size: 14px; |
| font-weight: 600; |
| color: var(--accents-7); |
| } |
|
|
| .modal-label { |
| font-size: 13px; |
| font-weight: 500; |
| color: var(--accents-7); |
| } |
|
|
| .modal-close { |
| color: var(--accents-4); |
| transition: color 0.15s; |
| } |
|
|
| .modal-close:hover { |
| color: #000; |
| } |
|
|
| .confirm-dialog-body { |
| padding: 16px; |
| display: flex; |
| flex-direction: column; |
| gap: 10px; |
| } |
|
|
| .confirm-dialog-title { |
| font-size: 14px; |
| font-weight: 600; |
| color: var(--accents-7); |
| } |
|
|
| .confirm-dialog-message { |
| font-size: 13px; |
| color: var(--accents-5); |
| line-height: 1.5; |
| } |
|
|
| .confirm-dialog-actions { |
| display: flex; |
| justify-content: flex-end; |
| gap: 8px; |
| padding-top: 8px; |
| border-top: 1px solid var(--border); |
| } |
|
|
| .confirm-dialog .modal-content { |
| padding: 0; |
| } |
|
|
| |
| #status-tabs { |
| border: none; |
| background: #f6f6f6; |
| padding: 6px; |
| gap: 6px; |
| border-radius: 999px; |
| } |
|
|
| .tab-item { |
| position: relative; |
| padding: 6px 12px; |
| margin-right: 0; |
| font-size: 12.5px; |
| font-weight: 500; |
| color: var(--accents-5); |
| background: transparent; |
| border: none; |
| border-radius: 999px; |
| cursor: pointer; |
| transition: color 0.15s ease, background 0.15s ease; |
| white-space: nowrap; |
| display: inline-flex; |
| align-items: center; |
| gap: 8px; |
| } |
|
|
| .tab-item:hover { |
| color: var(--geist-foreground, #000); |
| background: rgba(0, 0, 0, 0.05); |
| } |
|
|
| .tab-item.active { |
| color: var(--geist-foreground, #000); |
| background: #fff; |
| } |
|
|
| #status-tabs .badge { |
| height: 20px; |
| line-height: 20px; |
| font-size: 11px; |
| padding: 0 8px; |
| } |
|
|
| .tab-item:disabled { |
| cursor: not-allowed; |
| opacity: 0.5; |
| } |
|
|
| |
| .hide-scrollbar { |
| -ms-overflow-style: none; |
| scrollbar-width: none; |
| } |
| .hide-scrollbar::-webkit-scrollbar { |
| display: none; |
| } |
|
|
| .tab-sep { |
| width: 1px; |
| height: 16px; |
| background: #e5e5e5; |
| margin: 0 4px; |
| } |
|
|