/* Responsive Design for Full-Screen Layout */
@media (max-width: 1400px) {
    .container {
        grid-template-columns: 350px 1fr;
        gap: 0;
    }

    body.labeling-mode .container {
        grid-template-columns: 350px 1fr 350px;
    }

    .metrics-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .right-sidebar {
        width: 350px;
    }

    .labeling-canvas-area-fullwidth {
        height: calc(100vh - 170px);
    }

    .image-container {
        height: 100%;
        padding: 30px;
    }

    .image-container img {
        max-height: calc(100vh - 260px);
        max-width: calc(100% - 60px);
        margin-bottom: 30px;
    }
}

@media (max-width: 1200px) {
    .container {
        grid-template-columns: 320px 1fr;
        gap: 0;
    }

    body.labeling-mode .container {
        grid-template-columns: 320px 1fr 320px;
    }

    .right-sidebar {
        width: 320px;
    }

    .image-container {
        height: 100%;
        padding: 30px;
    }

    .image-container img {
        max-height: calc(100vh - 260px);
        max-width: calc(100% - 60px);
        margin-bottom: 30px;
    }
}

/* Print styles for reports */
@media print {
    .header,
    .control-panel,
    .notification,
    .system-status-indicator,
    .fullscreen-modal {
        display: none !important;
    }

    .container {
        grid-template-columns: 1fr;
        max-width: none;
        padding: 0;
    }

    .main-content {
        box-shadow: none;
        border: none;
    }

    .tab-content {
        padding: 1rem;
    }

    .image-container img {
        max-height: 400px;
    }

    .btn {
        display: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .btn {
        border: 2px solid currentColor;
    }

    .status-indicator {
        border-width: 2px;
    }

    .image-container {
        border-width: 3px;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .loading {
        animation: none;
        border-top-color: transparent;
    }
}