/* ServiceMile – wspólny arkusz stylów dla menu bocznego (sidebar).
   Wcześniej te same reguły były wklejone osobno w każdej z 6 stron i z czasem
   się rozjechały (np. tylko upowaznienia.php miał wersję mobilną). Teraz jest
   jedno źródło prawdy - zmiana koloru/rozmiaru menu tutaj działa wszędzie naraz. */

.sidebar {
    width: 250px;
    background-color: #080808;
    border-right: 1px solid #1f1f1f;
    padding: 20px 0;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}
.logo-container { text-align: center; margin-bottom: 40px; padding: 0 20px; }
.logo-container img { max-width: 100%; height: auto; }
.menu-item {
    padding: 15px 20px;
    color: #888;
    text-decoration: none;
    display: flex;
    align-items: center;
    font-size: 14px;
    transition: 0.3s;
}
.menu-item svg { width: 18px; height: 18px; margin-right: 12px; fill: currentColor; flex-shrink: 0; }
.menu-item:hover, .menu-item.active { color: #993031; background-color: #141414; border-left: 3px solid #993031; }

/* Wersja mobilna/wąski ekran: sidebar jako pozioma belka u góry zamiast kolumny po lewej
   (wcześniej mieliśmy to tylko na stronie Upoważnienia - teraz działa wszędzie). */
@media (max-width: 900px) {
    .sidebar { width: 100%; flex-direction: row; overflow-x: auto; padding: 0; border-right: none; border-bottom: 1px solid #1f1f1f; }
    .logo-container { display: none; }
    .menu-item { white-space: nowrap; padding: 14px 16px; font-size: 13px; }
    .menu-item:hover, .menu-item.active { border-left: none; border-bottom: 3px solid #993031; }
    .sidebar > div[style] { display: none; }
}
