﻿@import url(Pokladna.css);
.kniha {
  position: relative;
  transform: rotateZ(352deg);
  box-shadow: 0 0 15px var(--clr-sekundarni-200), inset 0 0 2px;
  height: max-content;
  min-height: 28px;
  transition: all .3s linear;
  margin: 1rem 1.5rem;
  border-bottom-right-radius: 5px;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 6px; }

.kniha-img {
  position: relative;
  width: 115px;
  filter: drop-shadow(0 0 5px var(--clr-sekundarni-200));
  filter: grayscale(1); }

.kniha:hover {
  transform: rotateZ(360deg);
  box-shadow: 0 0 7px var(--clr-primarni-200);
  cursor: pointer; }
  .kniha:hover .kniha-img {
    filter: grayscale(0); }
  .kniha:hover .typ-auta {
    color: var(--clr-primarni-500); }
  .kniha:hover .kniha-smazat {
    transform: translate(28px, -28px);
    box-shadow: 1px -1px 2px var(--clr-primarni-200);
    opacity: 1;
    color: var(--clr-sekundarni-200); }

.typ-auta, .spz, .rok {
  position: absolute;
  text-transform: uppercase;
  width: 100px; }

.typ-auta {
  top: 38px;
  left: 10px;
  color: var(--clr-sekundarni-200);
  font-weight: 900;
  transition: all .4s linear;
  text-align: center; }

.spz {
  top: 88px;
  left: 10px;
  color: var(--clr-primarni-200);
  font-weight: bold; }

.rok {
  top: 13px;
  left: 10px;
  color: var(--clr-modra);
  font-weight: bold; }

.autopark {
  position: relative;
  margin: auto;
  height: 75.4vh;
  display: flex; }
  .autopark .autopark-tabulka {
    width: 50%;
    overflow-y: scroll; }
    .autopark .autopark-tabulka tr:hover {
      filter: brightness(1.4); }
    .autopark .autopark-tabulka .table-sm td, .autopark .autopark-tabulka .table-sm th {
      font-size: .9rem;
      padding: .2rem; }
    .autopark .autopark-tabulka .table tr {
      /*margin-right: .3rem;*/ }
    .autopark .autopark-tabulka .table tr:hover {
      filter: brightness(200%); }
    .autopark .autopark-tabulka .bunka-benzimka {
      font-weight: 600;
      color: var(--clr-primarni-200); }
    .autopark .autopark-tabulka .bunka-datum {
      font-weight: 400;
      font-style: italic;
      color: var(--clr-sekundarni-500); }
    .autopark .autopark-tabulka .bunka-mnozstvi {
      font-weight: 600;
      color: var(--clr-primarni-200); }
    .autopark .autopark-tabulka .bunka-kmCelkem {
      font-weight: 500;
      color: var(--clr-sekundarni-500); }
    .autopark .autopark-tabulka .bunka-smazat {
      cursor: pointer; }
      .autopark .autopark-tabulka .bunka-smazat a {
        text-decoration: none;
        font-weight: 500;
        color: var(--clr-sekundarni-500);
        padding: 0 .5rem;
        float: right;
        border-left: 1px dotted var(--clr-primarni-500); }
    .autopark .autopark-tabulka .bunka-smazat:hover a {
      color: var(--clr-primarni-500); }
    .autopark .autopark-tabulka p {
      margin: 0; }
  .autopark .autopark-info {
    width: 30%;
    border: 1px solid silver;
    margin-left: 5rem;
    padding: 2rem 1rem;
    border-radius: 1rem;
    text-align: center; }
    .autopark .autopark-info p {
      margin-bottom: .1rem; }
  .autopark .autopark-tabulka::-webkit-scrollbar {
    width: 11px; }
  .autopark .autopark-tabulka::-webkit-scrollbar-track {
    background: none;
    border: none; }
  .autopark .autopark-tabulka::-webkit-scrollbar-thumb {
    background-color: var(--clr-primarni-500);
    border-radius: 6px; }

.kniha-datum {
  width: 10%; }

.kniha-adresy {
  width: 33%; }

.kniha-cas, .kniha-tachometr, .kniha-kilometry {
  width: 18%; }

.kniha-header {
  position: absolute;
  width: 75%;
  top: 52px;
  left: 49%;
  transform: translateX(-50%);
  text-align: center; }
  .kniha-header .datum, .kniha-header .adresy {
    display: flex;
    justify-content: center; }
  .kniha-header .td {
    border-right: 2px solid var(--clr-primarni-200);
    border-top: 2px solid var(--clr-primarni-200);
    border-bottom: 2px solid var(--clr-primarni-200); }
    .kniha-header .td .nadpis {
      padding: .2rem 0;
      color: var(--clr-primarni-500);
      align-self: center; }
  .kniha-header .sub-td {
    width: 100%;
    margin: 0 auto;
    border-top: 1px solid var(--clr-primarni-200);
    font-size: .8rem;
    padding: .3rem 0; }
  .kniha-header .td:nth-child(1) {
    border-left: 2px solid var(--clr-primarni-200); }
  .kniha-header .sub-td:nth-child(1) {
    border-right: 1px solid var(--clr-primarni-200); }
  .kniha-header .prazdno2rem {
    min-width: 3rem; }

.stranka {
  width: 80%;
  border: 1px solid;
  margin: 0 2rem;
  text-align: center;
  transform: rotateX(10deg);
  height: 590px;
  overflow-x: hidden; }
  .stranka .radek {
    border-bottom: 1px solid var(--clr-primarni-200);
    border-bottom-left-radius: 35px;
    box-shadow: 0 2px 3px var(--clr-primarni-500);
    padding: 0; }
  .stranka .radek:hover {
    background: var(--bg-modalni); }
  .stranka .td {
    border-right: 1px solid var(--clr-primarni-200);
    margin: auto; }
  .stranka .sub-td {
    width: 100%;
    margin: 0 auto;
    border-top: 1 px solid var(--clr-primarni-200); }
  .stranka .datum {
    font-size: 1rem; }
  .stranka .adresy {
    text-align: left;
    padding-left: 1.3rem; }
    .stranka .adresy p {
      font-size: .85rem; }
    .stranka .adresy .kam {
      color: var(--clr-modra); }
  .stranka .casy p {
    font-size: 1.02rem; }
  .stranka .tachometry p {
    font-size: 1rem; }
  .stranka .kilometry {
    text-align: right;
    margin-right: 1rem; }
    .stranka .kilometry p {
      font-size: 1.2rem;
      color: var(--clr-primarni-500); }
  .stranka .smazat {
    font-size: 2rem;
    padding: 0.5rem;
    color: var(--clr-spatna);
    cursor: pointer; }
  .stranka .smazat:hover {
    color: var(--clr-cervena); }

.kniha-info {
  position: relative;
  margin: auto;
  align-items: center;
  width: 78%; }
  .kniha-info .kniha-nazev {
    color: var(--clr-primarni-500);
    padding-right: 2rem;
    text-transform: uppercase; }
  .kniha-info .tachometr {
    color: var(--clr-primarni-200);
    padding-left: 1rem;
    padding-right: 2rem; }
  .kniha-info .info-spz {
    position: absolute;
    transform: rotateZ(270deg);
    color: var(--clr-modra);
    top: 100px;
    left: -95px;
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: 900; }

.cesta-panel {
  display: flex;
  width: 60%;
  height: 30px;
  padding-top: 25px; }
  .cesta-panel .cesta-km, .cesta-panel .cesta-cas {
    width: 20px;
    height: 50px; }
  .cesta-panel .cesta-cas {
    background: url("../podklady/time-picker-orange.png");
    background-size: contain;
    background-repeat: no-repeat; }
  .cesta-panel .cesta-km {
    background: url("../podklady/vzdalenost.png");
    background-size: contain;
    background-repeat: no-repeat; }
  .cesta-panel .nadpis {
    line-height: 19px; }

.box-zpravy-jizda {
  height: 40px; }
