/* Babel Order Form - Original Styling Enhancement */

/* Fix for grayed-out upload button */
#startJob,
.btn-primary {
    background-color: #2563eb !important;
    color: white !important;
    border: none !important;
    padding: 10px 20px !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    transition: background-color 0.2s ease !important;
}

#startJob:hover,
.btn-primary:hover {
    background-color: #1d4ed8 !important;
}

#startJob:active,
.btn-primary:active {
    background-color: #1e40af !important;
}

/* Ensure buttons look active */
#addDocBtn,
#removeDocBtn {
    background-color: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
    color: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

#addDocBtn:hover {
    background-color: #2563eb !important;
    color: #8cff96 !important;
    border-color: #8cff96 !important;
}

#removeDocBtn:hover {
    background-color: #ef4444 !important;
    color: #ffa78c !important;
    border-color: #ef4444 !important;
}

/* Card styling */
.card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Hide duplicate title if present */
.babel-order-page .entry-header {
    display: none;
}

/* Proper spacing for form */
#babel-order-form {
    margin: 2rem auto;
}

/* Language switcher positioning */
.neve-language-switcher {
    margin-left: auto;
    position: relative;
    z-index: 9999;
}

/* Ensure language switcher dropdown is visible */
.babel-language-switcher {
    min-width: 180px;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: white;
    cursor: pointer;
    appearance: auto;
}

.babel-language-switcher:hover {
    border-color: #2563eb;
}

/* Fixed position language switcher fallback */
body.admin-bar .neve-language-switcher {
    top: 64px !important;
}

.neve-language-switcher select {
    background: white !important;
    color: #374151 !important;
}

/* Ensure select dropdowns are styled */
select {
    appearance: auto !important;
    -webkit-appearance: auto !important;
    -moz-appearance: auto !important;
}

/* Active tab styling */
.docTab {
    cursor: pointer;
    padding: 8px 16px;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 6px 6px 0 0;
    transition: all 0.2s;
}

.docTab.active {
    background: white;
    border-bottom-color: white;
    font-weight: 600;
}

.docTab:hover {
    background: #e5e7eb;
}

/* ============================================
 * PREMIUM UI - Glassmorphism Animations
 * ============================================ */

/* FadeIn animation for glassmorphism overlays */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ============================================
 * PREMIUM UI - File Upload & Details Buttons
 * ============================================ */

/* File Upload Button ("Datei auswählen") - Premium UI Hover */
.babel-file-btn {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.babel-file-btn:hover {
    background: linear-gradient(135deg, #0066cc 0%, #00a8e8 100%) !important;
    color: #ffffff !important;
    border-color: #0066cc !important;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3) !important;
    transform: translateY(-2px) !important;
}

.babel-file-btn:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 6px rgba(0, 102, 204, 0.2) !important;
}

/* Details Toggle Button ("Details anzeigen/verbergen") - Premium UI Hover */
button[type="button"] {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Only target details toggle buttons (have border and background) */
button[type="button"]:not(#startJob):not(#addDocBtn):not(#removeDocBtn):not(.babel-file-btn) {
    position: relative;
}

button[type="button"]:not(#startJob):not(#addDocBtn):not(#removeDocBtn):not(.babel-file-btn):hover {
    background: linear-gradient(135deg, #0066cc 0%, #00a8e8 100%) !important;
    color: #ffffff !important;
    border-color: #0066cc !important;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3) !important;
    transform: translateY(-2px);
}

button[type="button"]:not(#startJob):not(#addDocBtn):not(#removeDocBtn):not(.babel-file-btn):active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(0, 102, 204, 0.2) !important;
}