/* ================================================================================ POPRAWIONY PLIK rekrutacja-style.css Zmiany zostały wprowadzone w celu zapewnienia, że stopka zawsze pozostaje na dole strony, nawet przy małej ilości treści. ================================================================================ */ /* * --- USTAWIENIA BODY DLA LEPKIEJ STOPKI --- * Poniższe style zostały dodane, aby strona rekrutacji miała poprawnie * pozycjonowaną stopkę. Ponieważ plik style.css nie mógł zostać * zmodyfikowany, style dla zostały nadpisane tutaj. */ body { /* Style skopiowane z style.css dla zachowania spójności wyglądu */ font-family: 'Arial', sans-serif; background: var(--primary-black); color: var(--primary-white); overflow-x: hidden; line-height: 1.6; /* Style dodane, aby stopka była zawsze na dole */ display: flex; flex-direction: column; min-height: 100vh; } /* --- Główny kontener i jego margines od góry --- */ main.recruitment-main { padding-top: 80px; /* Ta właściwość sprawia, że główna treść strony rozciąga się, wypełniając wolną przestrzeń i spychając stopkę na dół. */ flex: 1; } .text-center { text-align: center; } /* --- Sekcja startowa z przyciskiem "Złóż Aplikację" --- */ #recruitment-start h1 { font-size: 3.5rem; color: #fff; text-shadow: 0 0 15px rgba(255, 255, 255, 0.7); margin-bottom: 1rem; } #recruitment-start p { font-size: 1.2rem; color: #ccc; margin-bottom: 2rem; line-height: 1.6; } .btn-large { padding: 1rem 2.5rem; font-size: 1.2rem; } /* --- Formularz Rekrutacyjny --- */ .rec-form { background: var(--gray-medium); /* Używa zmiennej z głównego style.css */ padding: 2.5rem; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.1); animation: fadeIn 0.5s ease; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; } .form-group.full-width { grid-column: 1 / -1; } .form-group { display: flex; flex-direction: column; } .form-group label { margin-bottom: 0.5rem; color: var(--gray-light); /* Używa zmiennej z głównego style.css */ font-weight: 500; } .form-group input, .form-group textarea, .form-group select { width: 100%; padding: 0.8rem; background: var(--gray-dark); /* Używa zmiennej z głównego style.css */ border: 1px solid #444; border-radius: 8px; color: var(--primary-white); /* Używa zmiennej z głównego style.css */ font-size: 1rem; transition: border-color 0.3s, box-shadow 0.3s; } .form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: none; border-color: var(--primary-white); /* Używa zmiennej z głównego style.css */ box-shadow: 0 0 10px rgba(255, 255, 255, 0.3); } .form-group input[type="file"] { padding: 0.5rem; } .conditional-fields { display: none; margin-top: 2rem; padding-top: 2rem; border-top: 1px solid #444; } .conditional-fields h3 { text-align: center; margin-bottom: 1.5rem; font-size: 1.5rem; color: #fff; } .submit-btn { display: block; margin: 2rem auto 0; width: 50%; max-width: 300px; text-align: center; } /* --- Siatka i Kafelki Zgłoszeń --- */ .applications-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 1.5rem; } .application-card { background: linear-gradient(145deg, #1a1a1a, #111111); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 12px; padding: 1.5rem; transition: transform 0.3s, box-shadow 0.3s; position: relative; overflow: hidden; } .application-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); } .app-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; border-bottom: 1px solid #444; padding-bottom: 1rem; } .app-header h3 { margin: 0; font-size: 1.4rem; } .app-status { padding: 0.3rem 0.8rem; border-radius: 20px; font-size: 0.8rem; font-weight: bold; text-transform: uppercase; } .app-status.pending { background-color: #f39c12; color: #fff; } .app-status.accepted { background-color: #2ecc71; color: #fff; } .app-status.rejected { background-color: #e74c3c; color: #fff; } .app-body p { margin: 0.5rem 0; color: #ccc; } .app-body strong { color: #fff; min-width: 120px; display: inline-block; } .app-actions { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #444; display: flex; gap: 1rem; justify-content: flex-end; } /* Style dla przycisków akcji w kartach zgłoszeń */ .btn-action { padding: 0.5rem 1rem; border: 1px solid; border-radius: 8px; background: transparent; color: white; cursor: pointer; transition: all 0.3s; font-size: 0.9rem; } .btn-action.accept { border-color: #2ecc71; color: #2ecc71; } .btn-action.accept:hover { background: #2ecc71; color: black; } .btn-action.reject { border-color: #e74c3c; color: #e74c3c; } .btn-action.reject:hover { background: #e74c3c; color: black; } .btn-action.restore { border-color: #3498db; color: #3498db; } .btn-action.restore:hover { background: #3498db; color: black; } .btn-action.delete { border-color: #c0392b; color: #c0392b; } .btn-action.delete:hover { background: #c0392b; color: white; } .no-applications { text-align: center; color: #888; font-size: 1.2rem; padding: 3rem; background: rgba(0,0,0,0.2); border-radius: 12px; } .rejection-reason { margin-top: 1rem; padding: 0.8rem; background: rgba(231, 76, 60, 0.1); border: 1px solid #e74c3c; border-radius: 8px; color: #f2a69d; } /* --- Responsywność dla elementów strony rekrutacji --- */ @media (max-width: 768px) { .form-grid { grid-template-columns: 1fr; } .form-group.full-width { grid-column: auto; } #recruitment-start h1 { font-size: 2.5rem; } .rec-form { padding: 1.5rem; } }