/* Arcetec Document Processor - Styles */

/* Font */
body {
    font-family: 'Inter', sans-serif !important;
}

/* Brand Colors */
.bg-brand-dark { background-color: #080E32 !important; }
.text-brand-dark { color: #080E32 !important; }
.bg-brand-accent { background-color: #FF7F00 !important; }
.text-brand-accent { color: #FF7F00 !important; }
.border-brand-accent { border-color: #FF7F00 !important; }
.ring-brand-accent:focus { ring-color: #FF7F00 !important; }

/* Buttons */
.btn-primary {
    background-color: #080E32 !important;
    color: white !important;
    font-weight: 600 !important;
    border-radius: 0.375rem !important;
    transition: background-color 0.2s, opacity 0.2s !important;
    padding: 0.5rem 1rem !important;
}

.btn-primary:hover {
    background-color: #1a224d !important;
}

.btn-primary:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.btn-accent {
    background-color: #FF7F00 !important;
    color: white !important;
    font-weight: 600 !important;
    border-radius: 0.375rem !important;
    transition: opacity 0.2s !important;
    padding: 0.5rem 1rem !important;
}

.btn-accent:hover {
    opacity: 0.9 !important;
}

/* Modals */
.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 40;
}

.modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 50;
}

/* Toast Notifications */
#toast-container {
    position: fixed;
    top: 1.5rem;
    right: 1.5rem;
    z-index: 100;
}

/* Navigation */
.nav-link.active {
    background-color: #FF7F00 !important;
    color: white !important;
}

.nav-link:hover:not(.active) {
    background-color: #FFF5E6 !important;
}

/* File Type Selection */
.file-type-label {
    transition: all 0.2s;
}

.file-type-label:hover {
    background-color: #f0f9ff !important;
}

/* Tables */
.sortable:hover {
    background-color: #f9fafb;
    cursor: pointer;
}

/* Drag & Drop */
.dragging {
    opacity: 0.5;
    background: #f0f9ff;
}

.drag-over {
    border-top: 2px solid #080E32;
}

/* Action Buttons with Tooltips */
.action-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.action-btn .action-tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-4px);
    padding: 4px 8px;
    background-color: #1f2937;
    color: white;
    font-size: 11px;
    font-weight: 500;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s, transform 0.2s;
    pointer-events: none;
    z-index: 50;
}

.action-btn .action-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 4px;
    border-style: solid;
    border-color: #1f2937 transparent transparent transparent;
}

.action-btn:hover .action-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-8px);
}

/* Action button hover effects */
.action-btn:active {
    transform: scale(0.95);
}