.portable-detail-modal {
    max-width: 95vw !important;
    margin: 1rem auto !important;
}

@media (min-width: 576px) {
    .portable-detail-modal {
        max-width: 90vw !important;
    }
}

@media (min-width: 768px) {
    .portable-detail-modal {
        max-width: 85vw !important;
    }
}

@media (min-width: 992px) {
    .portable-detail-modal {
        max-width: 80vw !important;
    }
}

@media (max-width: 575px) {
    .portable-detail-modal {
        max-width: 98vw !important;
        margin: 0.5rem auto !important;
    }
    
    .portable-detail-modal .modal-content {
        margin: 0 !important;
    }
}

/* Vylepšení pro malé obrazovky */
@media (max-width: 768px) {
    .portable-detail-modal .table-responsive {
        font-size: 0.85rem;
    }
    
    .portable-detail-modal th,
    .portable-detail-modal td {
        padding: 0.25rem !important;
    }
}

/* === NOVÉ STYLY PRO PŘETAŽITELNÁ MODÁLNÍ OKNA === */

/* Modální okna, která lze přetahovat */
.modal.draggable .modal-dialog {
    margin: 0;
    position: absolute;
    pointer-events: none;
    transition: none !important;
}

.modal.draggable .modal-content {
    pointer-events: auto;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.25);
    border-radius: 0.5rem;
}

/* Přetažitelný header */
.modal.draggable .modal-header {
    cursor: move;
    user-select: none;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    color: white;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    position: relative;
}

.modal.draggable .modal-header::before {
    content: "⋮⋮";
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
    letter-spacing: -2px;
}

.modal.draggable .modal-header:hover {
    background: linear-gradient(135deg, #0056b3 0%, #004085 100%);
}

/* Aktivní přetahování */
.modal.draggable.dragging .modal-header {
    cursor: grabbing;
    background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%);
}

.modal.draggable.dragging .modal-content {
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.4);
    transform: scale(1.02);
}

/* Zpřístupnění tlačítka zavření */
.modal.draggable .modal-header .btn-close {
    pointer-events: auto;
    cursor: pointer;
    z-index: 10;
    position: relative;
}

/* Indikátor přetažitelnosti */
.modal.draggable .modal-header .modal-title::after {
    content: " ↕";
    font-size: 0.8em;
    opacity: 0.7;
    margin-left: 0.5rem;
}

/* Responsive úpravy */
@media (max-width: 768px) {
    .modal.draggable .modal-dialog {
        position: static !important;
        margin: 1rem auto !important;
    }
    
    .modal.draggable .modal-header {
        cursor: default;
    }
    
    .modal.draggable .modal-header .modal-title::after {
        display: none;
    }
}

/* Překrytí modalů */
.modal.draggable {
    z-index: 1055 !important;
}

.modal.draggable.active-modal {
    z-index: 1060 !important;
}

/* Animace při otevření */
.modal.draggable .modal-dialog {
    animation: modalSlideIn 0.3s ease-out;
}

@keyframes modalSlideIn {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Zvýraznění aktivního modálu */
.modal.draggable.active-modal .modal-content {
    border: 2px solid #007bff;
}