/* 1. Podstawy - Czytelna czcionka i lekko szara baza */
body {
    font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    background-color: #f9f9f9;
    color: #333;
}

/* 2. Nagłówek - Ciemny granat */
#header {
    background-color: #2c3e50 !important; /* Jaśniejszy granat, mniej "ciężki" niż czarny */
    border-bottom: 2px solid #ff8c00;      /* Dodałem pomarańczową linię na dole dla efektu 3D */
}

#header a {
    color: #fff !important;
}

/* 3. Stopka - Ciemny granat, pasuje do nagłówka */
#footer {
    background-color: #1a2a3a;
    color: #e0e0e0;
    padding: 40px 0 20px 0;
    margin-top: 50px;
}

#footer h5 {
    color: #ff8c00; /* Pomarańczowy akcent dla nagłówków w stopce */
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 1px;
}

#footer a {
    color: #ffffff;
    text-decoration: none;
}

#footer a:hover {
    color: #ff8c00;
}

/* 4. Przycisk "Awaria" - jeśli masz taki link w nawigacji */
.button, .button.button-primary {
    background-color: #ff8c00;
    border-color: #ff8c00;
    color: #fff;
    font-weight: bold;
}

.button:hover {
    background-color: #e07b00;
    border-color: #e07b00;
}

/* 5. Kontener treści - żeby tekst nie rozjeżdżał się na monitorach 4K */
.container {
    max-width: 1200px;
}


/* Wymuszenie rozmiaru logo niezależnie od tego, co myśli przeglądarka */
.navbar-brand img {
    height: 140px !important;    /* Zwiększaj tę liczbę (np. 70px, 80px), aż logo będzie idealne */
    max-height: 200px !important; 
    width: auto !important;
    padding: 15px 0 !important;  /* Daje trochę "oddechu" od krawędzi menu */
}

/* Jeśli nagłówek menu jest za niski, żeby pomieścić większe logo, powiększ go */
.navbar {
    min-height: 70px !important; 
}