/* ==========================================================================
   LOCAL PC VIDEO WORKSPACE — MULTI-VIDEO SELECTION & 2-COLUMN DIRECT RENDER
   Studio Dark Mode (#09090B, #F59E0B)
   ========================================================================== */

.local-library-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.local-library-batch-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-left: auto;
  padding: 5px 10px;
  border-radius: 9px;
  background: #09090B;
  border: 1px solid rgba(245, 158, 11, 0.28);
}

.local-selected-counter {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 6px;
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.38);
  color: #F59E0B;
  font-family: var(--font-mono, monospace);
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}

.local-batch-btn {
  height: 30px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #16161C;
  color: #F4F4F6;
  font-size: 11.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s ease;
}

.local-batch-btn:hover:not(:disabled) {
  border-color: #F59E0B;
  background: rgba(245, 158, 11, 0.16);
  color: #FFD700;
}

.local-batch-btn.danger {
  border-color: rgba(239, 68, 68, 0.42);
  background: rgba(239, 68, 68, 0.12);
  color: #FCA5A5;
}

.local-batch-btn.danger:hover:not(:disabled) {
  border-color: #EF4444;
  background: rgba(239, 68, 68, 0.24);
  color: #FFFFFF;
}

.local-batch-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* 2-Column Direct Layout: Left Video Grid + Right Sticky Step 3 Setup Panel */
.local-workspace-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  margin-top: 12px;
  transition: grid-template-columns 0.18s cubic-bezier(0.16, 1, 0.3, 1);
}

.local-workspace-layout.has-step3-open {
  grid-template-columns: minmax(0, 1fr) minmax(410px, var(--f4-prod-inspector-width, 450px));
}

@media (max-width: 1180px) {
  .local-workspace-layout.has-step3-open {
    grid-template-columns: 1fr;
  }
}

.local-library-left-col {
  min-width: 0;
}

.local-step3-right-col {
  position: sticky;
  top: 52px;
  max-height: calc(100vh - 64px);
  overflow-y: auto;
  scrollbar-width: thin;
}

.local-step3-right-col.hidden {
  display: none !important;
}

.local-step3-right-col .f4-step3-inspector-panel .two-fields.f4-profile-engine-fields {
  grid-template-columns: minmax(0, 0.74fr) minmax(0, 1.26fr) !important;
  gap: 8px !important;
}

/* Selected Video Card Highlight (#F59E0B) & Bottom Toggle Button */
#localLibraryGrid .discovery-card {
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

#localLibraryGrid .discovery-card.is-selected {
  border: 1.5px solid #F59E0B !important;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.52), 0 12px 28px rgba(245, 158, 11, 0.24) !important;
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.1) 0%, #121217 100%) !important;
}

#localLibraryGrid .discovery-card.is-selected .f4-card-check {
  background: linear-gradient(135deg, #F59E0B, #FFD700) !important;
  border-color: #FFD700 !important;
  color: #09090B !important;
  opacity: 1 !important;
  transform: scale(1);
}

#localLibraryGrid .discovery-card .f4-card-open-btn[data-local-toggle-select] {
  width: 100%;
  min-height: 28px;
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 6px;
  border: 1px solid rgba(245, 158, 11, 0.45);
  background: rgba(245, 158, 11, 0.12);
  color: #FFD700;
  cursor: pointer;
  transition: all 0.15s ease;
}

#localLibraryGrid .discovery-card .f4-card-open-btn[data-local-toggle-select]:hover {
  border-color: #F59E0B;
  background: rgba(245, 158, 11, 0.24);
  color: #FFFBEB;
}

#localLibraryGrid .discovery-card.is-selected .f4-card-open-btn[data-local-toggle-select],
#localLibraryGrid .discovery-card .f4-card-open-btn[data-local-toggle-select].is-selected {
  background: linear-gradient(135deg, #F59E0B 0%, #FFD700 100%) !important;
  border-color: #FFD700 !important;
  color: #09090B !important;
  font-weight: 800 !important;
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.38);
}