@tailwind base;
@tailwind components;
@tailwind utilities;

/* Disable all clicks when spinner is visible (doesn't have ng-hide) */
body:has(#qa_spinner:not(.ng-hide)) {
    pointer-events: none;
    cursor: wait;
  }
  
.dragging {
    cursor: grabbing;
}

.drop-before {
    border-top: 2px solid #3b82f6 !important;
    padding-top: 0px !important;
}

.drop-after {
    border-bottom: 2px solid #3b82f6 !important;
    padding-bottom: 0px !important;
}

/* Optional animation for smooth reordering */
.feedback-item {
    transition: transform 0.2s ease;
}

/* These classes will be added during drag operations */
.language-mapping-item.dragging {
background-color: rgba(240, 240, 250, 0.5) !important;
}

.language-mapping-item.drop-before {
border-top: 2px solid #4f46e5 !important;
}

.language-mapping-item.drop-after {
border-bottom: 2px solid #4f46e5 !important;
}

/* --- Enterprise Agents unified list --- */
/* Hide the 'Add …' button inside the two auto-synced object-lists  */
#enterprise-merged [ng-click="addModel()"] {
display: none !important;
}

/* Make chips truncate nicely on small widths */
#enterprise-merged .chip .label {
max-width: 320px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.input-container {
border: 1px solid transparent;
transition: border-color 0.2s ease;
}

.input-container:focus-within {
border: 1px solid #3b82f6; /* Blue border */
}

.input-container input {
border: none !important;
outline: none !important;
}

/* Hide default number input spinner */
.number-input-no-spinner::-webkit-outer-spin-button,
.number-input-no-spinner::-webkit-inner-spin-button {
-webkit-appearance: none !important;
margin: 0 !important;
}

.number-input-no-spinner[type=number] {
-moz-appearance: textfield !important;
}


.tooltip-arrow,
.tooltip-arrow::before {
position: absolute;
width: 8px;
height: 8px;
background: inherit; /* Inherits the dark background from the tooltip */
}

.tooltip-arrow {
visibility: hidden;
}

.tooltip-arrow::before {
visibility: visible;
content: '';
transform: rotate(45deg);
}

/* Positions the arrow at the bottom-center of the tooltip */
.group:hover .tooltip-arrow {
bottom: -4px;
left: 50%;
transform: translateX(-50%);
}

/* Custom styles for better carousel behavior */
.carousel-container {
scroll-behavior: smooth;
}

.carousel-item {
scroll-snap-align: center;
flex-shrink: 0;
}

/* Custom scrollbar styling */
.carousel-container::-webkit-scrollbar {
height: 4px;
}

.carousel-container::-webkit-scrollbar-track {
background: #f1f5f9;
border-radius: 2px;
}

.carousel-container::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 2px;
}

.carousel-container::-webkit-scrollbar-thumb:hover {
background: #94a3b8;
}

/* Smooth scroll for carousel navigation */
.carousel-scroll {
scroll-snap-type: x mandatory;
}

/* Loading animation */
@keyframes spin {
to {
    transform: rotate(360deg);
}
}

.animate-spin {
animation: spin 1s linear infinite;
}
/* ---------- Enterprise Agents only ---------- */
#enterprise-merged .ea-ol-card{
    border:1px solid #e5e7eb;
    border-radius:.5rem;
    overflow:hidden;
    background:#fafafa; /* bg-zinc-50 */
}
#enterprise-merged .ea-ol-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    white-space:nowrap; 
    cursor:pointer;
    color: #18181B; /* Dark text */
}

/* Remove the dark background overrides */
#enterprise-merged .ea-list--agent .ea-ol-header{
    color: #18181B;
    border-bottom-color:#e5e7eb;
}

#enterprise-merged .ea-list--rag .ea-ol-header{
    color: #18181B;
    border-bottom-color:#e5e7eb;
}

#enterprise-merged .ea-ol-title{
    /* Font styles from Figma */
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    color: #18181B;
}

#enterprise-merged .ea-ol-actions{
    display:flex;
    align-items:center;
    gap:.25rem;
    white-space:nowrap;
    /* Font styles for icons */
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
}

#enterprise-merged .ea-ol-actions .btn{
    padding:.125rem .25rem;
    color: #18181B; /* Dark icons */
}

#enterprise-merged .ea-ol-body{
    padding: 0 0 .75rem 0;
}

#enterprise-merged .ea-ol-body--collapsed{
    display:none
}  
  
  