/*
 * SPDX-FileCopyrightText: Copyright (c) 2025 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
 * SPDX-License-Identifier: Apache-2.0
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/* RTX Remix Button Styles */

.rtx-remix-btn {
  padding: 10px 24px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  outline: none;
  border: 2px solid;
}

.rtx-remix-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.rtx-remix-btn-cancel {
  background: transparent;
  border-color: var(--border-light);
  color: var(--text-muted);
}

.rtx-remix-btn-cancel:hover:not(:disabled) {
  background: var(--bg-hover);
  border-color: var(--border-lighter);
  color: var(--text-primary);
}

.rtx-remix-btn-primary {
  padding: 10px 28px;
  background: var(--remix-color);
  border-color: var(--remix-color);
  color: var(--text-black);
  font-weight: 600;
}

.rtx-remix-btn-primary:hover:not(:disabled) {
  background: var(--remix-color-hover);
  border-color: var(--remix-color-hover);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px var(--remix-color-shadow-hover);
}

.rtx-remix-btn-danger {
  padding: 8px 20px;
  background: var(--status-danger);
  border: 2px solid var(--status-danger);
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.rtx-remix-btn-danger:hover {
  background: var(--status-danger-hover);
  border-color: var(--status-danger-hover);
}

/* Details Button */
.rtx-remix-details-btn {
  background: transparent;
  border: 1px solid var(--border-base);
  color: var(--text-subtle);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 14px;
  transition: all 0.2s ease;
  outline: none;
}

.rtx-remix-details-btn:hover {
  background: var(--bg-base);
  border-color: var(--border-light);
  color: var(--remix-color);
}

.rtx-remix-details-btn.expanded {
  transform: rotate(180deg);
  color: var(--remix-color);
  border-color: var(--remix-color);
}