/* assets/picking.css - Warehouse Display Optimizations */

/* Full-screen mode overrides */
.picking-fullscreen {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 9999 !important;
    background-color: var(--mantine-color-body) !important;
    overflow: auto !important;
    padding: 1rem !important;
}

/* Hide sidebar and topbar in fullscreen */
.picking-fullscreen ~ #sidebar,
.picking-fullscreen ~ #topbar {
    display: none !important;
}

/* Larger touch targets for warehouse environment */
.picking-station button {
    min-height: 48px;
    min-width: 48px;
    font-size: 1.1rem;
}

/* Enhanced slot cards for better visibility from distance */
.staging-slot-card {
    min-height: 200px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.staging-slot-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

/* Pulse animation for active scanner */
@keyframes scanner-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.scanner-active {
    animation: scanner-pulse 2s ease-in-out infinite;
}

/* High contrast mode for bright warehouse environments */
@media (prefers-contrast: high) {
    .staging-slot-card {
        border-width: 3px !important;
    }

    .mantine-Badge-root {
        border: 2px solid currentColor !important;
    }
}

/* Large screen optimizations (warehouse monitors) */
@media (min-width: 1920px) {
    .staging-grid {
        font-size: 1.2rem;
    }

    .staging-slot-card {
        min-height: 250px;
    }
}

/* Print styles for picklists */
@media print {
    #fullscreen-toggle-btn,
    #picking-refresh-btn,
    .no-print {
    display: none !important;
    }
}

/* Progress card hover effect */
.progress-card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

.progress-card-hover:active {
    transform: translateY(0);
}