/* 
 * ============================================================================
 * FIXES.CSS - Poprawki do oryginalnych stylów
 * ============================================================================
 * Ładuj OSTATNI, po wszystkich innych CSS!
 * Zawiera tylko niezbędne poprawki bez zmiany oryginalnych plików
 * ============================================================================
 */

/* ========================================================================== */
/* 1. NAPRAWA: Header zakrywa górę strony */
/* ========================================================================== */

body {
    padding-top: 80px !important; /* Desktop - miejsce na fixed header */
}

@media (max-width: 768px) {
    body {
        padding-top: 70px !important; /* Mobile - mniejszy header */
    }
}

/* ========================================================================== */
/* 2. NAPRAWA: Modal nie przewija się */
/* ========================================================================== */

.modal {
    overflow-y: auto !important; /* Modal przewija się */
    -webkit-overflow-scrolling: touch !important; /* Smooth scroll iOS */
    align-items: flex-start !important; /* Wyrównaj do góry */
    padding: 20px !important;
}

.modal-content {
    max-height: calc(100vh - 40px) !important; /* Maks. wysokość */
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    margin: auto !important;
}

.modal-body {
    overflow-y: auto !important; /* Body przewija się */
    overflow-x: hidden !important;
    max-height: calc(100vh - 200px) !important; /* Miejsce na header/footer */
    -webkit-overflow-scrolling: touch !important;
}

/* Custom scrollbar dla modal-body */
.modal-body::-webkit-scrollbar {
    width: 8px;
}

.modal-body::-webkit-scrollbar-track {
    background: rgba(0, 184, 255, 0.1);
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #00b8ff 0%, #9d4edd 100%);
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #66e0ff 0%, #9d4edd 100%);
}

/* Modal header i footer - sticky (zawsze widoczne) */
.modal-header {
    flex-shrink: 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    backdrop-filter: blur(10px) !important;
}

.modal-footer {
    flex-shrink: 0 !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 10 !important;
    backdrop-filter: blur(10px) !important;
}

/* ========================================================================== */
/* 3. RESPONSIVE: Mobile adjustments */
/* ========================================================================== */

@media (max-width: 768px) {
    .modal {
        padding: 10px !important;
    }
    
    .modal-content {
        max-height: calc(100vh - 20px) !important;
    }
    
    .modal-body {
        max-height: calc(100vh - 180px) !important;
        padding: 20px !important;
    }
}

@media (max-width: 480px) {
    .modal-body {
        max-height: calc(100vh - 160px) !important;
        padding: 15px !important;
    }
}

/* ========================================================================== */
/* 4. BONUS: Zapobiegnij ucięciu dropdownów w modalu */
/* ========================================================================== */

.modal-body select {
    position: relative !important;
    z-index: 5 !important;
}

.modal-body .form-grid {
    max-height: none !important; /* Pozwól formom rosnąć */
}

/* ========================================================================== */
/* END OF FIXES */
/* ========================================================================== */
/* 
 * ============================================================================
 * FIXES.CSS - Poprawki do oryginalnych stylów
 * ============================================================================
 * Ładuj OSTATNI, po wszystkich innych CSS!
 * Zawiera tylko niezbędne poprawki bez zmiany oryginalnych plików
 * ============================================================================
 */

/* ========================================================================== */
/* 1. NAPRAWA: Header zakrywa górę strony */
/* ========================================================================== */

body {
    padding-top: 80px !important; /* Desktop - miejsce na fixed header */
}

@media (max-width: 768px) {
    body {
        padding-top: 70px !important; /* Mobile - mniejszy header */
    }
}

/* ========================================================================== */
/* 2. NAPRAWA: Modal nie przewija się */
/* ========================================================================== */

.modal {
    overflow-y: auto !important; /* Modal przewija się */
    -webkit-overflow-scrolling: touch !important; /* Smooth scroll iOS */
    align-items: flex-start !important; /* Wyrównaj do góry */
    padding: 20px !important;
}

.modal-content {
    max-height: calc(100vh - 40px) !important; /* Maks. wysokość */
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    margin: auto !important;
}

.modal-body {
    overflow-y: auto !important; /* Body przewija się */
    overflow-x: hidden !important;
    max-height: calc(100vh - 200px) !important; /* Miejsce na header/footer */
    -webkit-overflow-scrolling: touch !important;
}

/* Custom scrollbar dla modal-body */
.modal-body::-webkit-scrollbar {
    width: 8px;
}

.modal-body::-webkit-scrollbar-track {
    background: rgba(0, 184, 255, 0.1);
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #00b8ff 0%, #9d4edd 100%);
    border-radius: 4px;
}

.modal-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #66e0ff 0%, #9d4edd 100%);
}

/* Modal header i footer - sticky (zawsze widoczne) */
.modal-header {
    flex-shrink: 0 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    backdrop-filter: blur(10px) !important;
}

.modal-footer {
    flex-shrink: 0 !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 10 !important;
    backdrop-filter: blur(10px) !important;
}

/* ========================================================================== */
/* 3. RESPONSIVE: Mobile adjustments */
/* ========================================================================== */

@media (max-width: 768px) {
    .modal {
        padding: 10px !important;
    }
    
    .modal-content {
        max-height: calc(100vh - 20px) !important;
    }
    
    .modal-body {
        max-height: calc(100vh - 180px) !important;
        padding: 20px !important;
    }
}

@media (max-width: 480px) {
    .modal-body {
        max-height: calc(100vh - 160px) !important;
        padding: 15px !important;
    }
}

/* ========================================================================== */
/* 4. BONUS: Zapobiegnij ucięciu dropdownów w modalu */
/* ========================================================================== */

.modal-body select {
    position: relative !important;
    z-index: 5 !important;
}

.modal-body .form-grid {
    max-height: none !important; /* Pozwól formom rosnąć */
}

/* ========================================================================== */
/* END OF FIXES */
/* ========================================================================== */

/* ========================================================================== */
/* 5. NAPRAWA: Modalne mają białe tło (inventory) */
/* ========================================================================== */

/* Dashboard-styles.css nadpisuje tło modali przez var(--bg-color) które nie jest zdefiniowane */
/* Ta poprawka przywraca ciemne sci-fi tło */

.modal-content {
    background: linear-gradient(135deg, 
        rgba(26, 26, 46, 0.98) 0%, 
        rgba(22, 33, 62, 0.98) 100%) !important;
    border: 2px solid rgba(0, 184, 255, 0.4) !important;
    box-shadow: 0 20px 80px rgba(0, 184, 255, 0.4) !important;
}

/* Modal header - ciemne tło z gradientem */
.modal-header {
    background: linear-gradient(135deg, 
        rgba(0, 184, 255, 0.15) 0%,
        rgba(157, 78, 221, 0.15) 100%) !important;
    border-bottom: 2px solid rgba(0, 184, 255, 0.3) !important;
}

/* Modal body - ciemne tło */
.modal-body {
    background: transparent !important;
    color: #c0c0c0 !important;
}

/* Modal footer - ciemne tło */
.modal-footer {
    background: linear-gradient(135deg, 
        rgba(0, 184, 255, 0.05) 0%,
        rgba(157, 78, 221, 0.05) 100%) !important;
    border-top: 2px solid rgba(0, 184, 255, 0.3) !important;
}

/* Modal title - złoty kolor */
.modal-title {
    color: #ffd700 !important;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5) !important;
}

/* ========================================================================== */
/* END OF FIXES */
/* ========================================================================== */