* {
  padding: 0;
  margin: 0;
  text-decoration: none;
  box-sizing: border-box;
}

body {
    font-family: Lato;
    margin-top: 20px;
}

.section {
    margin-bottom: 40px;
}

.results-box {
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #ccc;
}

.result-row {
    padding: 4px 0;
}

.tresc {
    overflow-x: auto;
    margin: 95px 12% 10px 12%;
}

/*Pasek nawigacyjny*/


nav {
  background-color: rgb(255, 130, 130);
  list-style: none;
  height: 80px;
  width: 100%;
  position: fixed; /* ZAMIANA z relative na fixed */
  top: 0;
  left: 0;
  z-index: 1000; /* Żeby był nad innymi elementami */
}


label.logo {
  color: white;
  font-size: 35px;
  line-height: 80px;
  padding: 0 60px;
  font-weight: bold;
}

label.logo img {
  margin-top: 5px;
  height: 85%;
}

nav ul {
  float: right;
  margin-right: 30px;
}

nav ul li {
  display: inline-block;
  line-height: 80px;
  margin: 0 3px;
}

nav ul li a {
  color: rgb(255, 255, 255);
  font-size: 20px;
  padding: 7px 10px;
  transition-duration: 0.3s;
}

a.pasek:hover {
  background-color: rgb(255, 205, 205);
  transition-duration: 0.3s;
  border-radius: 8px;
  color: rgb(48, 48, 48);
}

/* Hamburger button */
.hamburger {
  display: none;
  font-size: 30px;
  cursor: pointer;
  color: white;
  line-height: 80px;
  padding-right: 20px;
  float: right;
}

/* Responsive styles */
@media (max-width: 768px) {
  .hamburger {
    display: block;
  }

  nav ul {
    flex-direction: column;
    background-color: rgb(255, 130, 130);
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;

    max-height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: max-height 0.4s ease, opacity 0.3s ease;
  }

  nav ul li {
    display: block;
    text-align: center;
    margin: 10px 0;
  }

  nav ul.show {
    max-height: 500px; /* Wystarczające dla kilku opcji */
    opacity: 1;
    pointer-events: auto;
  }
}

/*Scrolltopbtn*/
#scrollTopBtn {
  position: fixed;
  bottom: 30px;
  right: 0; /* Przycisk dotyka prawej krawędzi */
  z-index: 999;
  border: none;
  outline: none;
  background-color: #ff8282;
  color: white;
  cursor: pointer;
  width: 35px;
  height: 50px;
  font-size: 24px;

  /* Zaokrąglenia tylko po lewej stronie */
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;

  box-shadow: -4px 4px 8px rgba(0, 0, 0, 0.2);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}

#scrollTopBtn.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#scrollTopBtn:hover {
  background-color: #ff5a5a;
  transform: translateY(-2px);
}

@media (max-width: 700px) {
  #scrollTopBtn {
    display: none !important;
  }
}

/*Reszta*/

#vehicle-table {
	margin: 15px auto;
    border-collapse: collapse;
    width: 500px;
    text-align: center;
    background-color: #fff;
    border: 2px solid #000000;
}

#vehicles-table {
	margin: 15px auto;
    border-collapse: collapse;
    width: 90%;
    text-align: center;
    background-color: #fff;
    border: 2px solid #000000;
}

#line-table {
    margin: 15px auto;
    border-collapse: collapse;
    width: 600px;
    text-align: center;
    background-color: #fff;
    border: 2px solid #000000;
}

@media (max-width: 850px) {   
    #line-table {
        width: 90%;
    }
}

#lines-table { /*styl chyba tymczasowy, nawiązanie do strony MPK z około 2003 roku*/
	margin: 15px auto;
    border-collapse: collapse;
    width: 90%;
    text-align: center;
    background-color: #dddddd;
    font-size: 20px;
    font-family: Verdana;
    font-weight: bold;
}

#lines-table a {
    all: revert;
}

#date-table {
    margin: 15px 20px;
    border-collapse: collapse;
    width: 600px;
    text-align: center;
    background-color: #fff;
    border: 2px solid #000000;
}

@media (max-width: 850px) {   
    #date-table {
        width: 90%;
    }
}


#vehicle-table th , #vehicles-table th , #date-table th, #line-table th{
	border: 1px solid black;
    background-color: #ff8282;
    padding-top: 3px;
    padding-bottom: 3px;
	padding: 10px;
	font-size: 20px;
}

#vehicle-table tr , #vehicles-table tr, #date-table tr, #line-table tr{
	display: table-row;
    vertical-align: inherit;
    unicode-bidi: isolate;
    border-color: inherit;
}


#vehicle-table td , #vehicles-table td , #date-table td, #line-table td{
	width: 180px;
	border: 1px solid black;
    background-color: white;
    padding: 7px;
}

#vehicle-title {
    padding: 0;
    margin: 0;
}

hr {
	border-style: solid;
    border-color: #ff8282;
	padding: 0;
    margin: 0;
}

a {
    color: #ff8282;
    transition-duration: 0.5s;
    text-decoration: none;
}

a:hover{
  color:#303030;
  transition-duration: 0.5s;
}

#date-picker {
    scale: 120%;
    margin-left: 30px; 
    background-color: #ffd7d7; 
    border-radius: 8px; 
    border: 2px solid #ff6d6d; 
    color: #000000;
}