@media (max-width: 575.98px) { 
    
    
     body {
     line-height: 1.2;
    } 
    
    .table th {
    padding: .3rem; 
    padding-right: 14px !important;
    font-size: .775rem; 
    }
    
     .table td {
    padding: .1rem; 
    padding-right: 14px !important;
    font-size: .775rem;    
    }
    
    .btn-group-sm>.btn, .btn-sm {
   }
    
    .navbar-nav .nav-item .nav-link{
        padding: 10px 10px;
    }
    

    
    .nav {
            display: inline;
    }
}




.navbar-nav .nav-item {
    background-color: white;
    color: black !important;
    margin: 5px 5px;  

}

.navbar-nav .nav-link {
    color: black !important;
}



 /* Hover efekt pro navigační tlačítka */
            .navbar-nav .nav-link {
                transition: background-color 0.3s ease, color 0.3s ease;
                /*border-radius: 5px;*/
            }
        
            .navbar-nav .nav-link:hover {
                background-color: #007bff; /* modré pozadí při hoveru */
                color: #ffffff !important;
            }
        
            /* Styl pro aktivní tlačítko */
            .navbar-nav .nav-link.active {
                background-color: #0056b3; /* tmavší modré pozadí pro aktivní tlačítko */
                color: #ffffff !important;
            }


.info-box .info-box-text, .info-box .progress-description {
    display: block;
    white-space: normal !important;
    font-size: 14px ;
}



.bg-warning-light {
    background-color: #FFD75F !important ;
}


/* Tmavší odstíny pro modální okna */
.bg-success-dark {
  background-color: #155724; /* Jemně tmavší zelená */
}

.bg-danger-dark {
  background-color: #721c24; /* Jemně tmavší červená */
}

.bg-warning-dark {
  background-color: #856404; /* Jemně tmavší žlutá */
}


.tooltip-inner {
  max-width: 600px;
  white-space: normal;
}


@media (max-width: 575.98px) { 
    
 .tooltip-inner {
  max-width: 200px;
  white-space: normal;
}   
    
}


.info-cell {
  cursor: help;
}

/* Pro zajištění kontrastu */
.modal-content.bg-success,
.modal-content.bg-danger,
.modal-content.bg-warning {
  color: #fff;
}


.collapsible-link p{
    margin-bottom: 0 !important;
}

.sablona{
    font-size: 12px;
    cursor: pointer;
    color: gray;
}


.sablona:hover{
    color: #007BFF;
}




.table td, .table th {
    vertical-align: middle;
}




.nav-sidebar .nav-link>.right, .nav-sidebar .nav-link>p>.right {
    position: absolute;
    right: 0rem;
    top: .7rem;
}
.text_shadow{
    text-shadow: #02458c 0.1em 0.1em 0.1em;
}




.upload-area {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: 2px dashed #ccc;
    border-radius: 10px;
    padding: 20px;
    background-color: #f9f9f9;
    text-align: center;
    transition: background-color 0.3s, border-color 0.3s;
}

.btn-upload {
    color: #000000;
    background-color: #ffffff;
    border-color: #dc3545;
    box-shadow: none;
}
   






.table td {
  position:relative;
  padding-right:20px;
}

.table:not(.table-custom) td:after {
  content:'';
  height:40px;
  width:1px;
  background-color:#dee2e6;
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  right:10px;
}


tr td:last-child::after {
  height:0px !important;
}

thead tr:nth-child(2) {
    background-color: #1976D2 !important
}

thead tr:nth-child(3) th {
    font-weight: bold !important;
    padding: 20px 10px !important;
    color: #BDBDBD !important
}

tbody tr td {
    /*padding: 10px !important*/
}

tfoot tr:nth-child(2) th {
    padding: 10px !important;
    border-top: 1px solid #CFD8DC !important
}




/*LOADER SPINNER*/
.LockOn {
    display: block;
    visibility: visible;
    position: absolute;
    z-index: 999;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color:white;
    vertical-align:bottom;
    padding-top: 20%; 
    filter: alpha(opacity=75); 
    opacity: 0.75; 
    font-size:large;
    color:blue;
    font-style:italic;
    font-weight:400;
    background-image: url("../img/loading.gif");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
}



.btn-pay {
    background: #ebebeb;
    background-image: -webkit-linear-gradient(top, #fff, #d9d9d9); 
    background-image: -moz-linear-gradient(top, #fff, #d9d9d9);
    background-image: -ms-linear-gradient(top, #fff, #d9d9d9);
    background-image: -o-linear-gradient(top, #fff, #d9d9d9);
    background-image: linear-gradient(to bottom, #fff, #d9d9d9);
    color: #444;
    font-size: 16px;
    font-weight: bold;
    border: solid #ccc 1px;
    width: 100%;
}

.btn-pay2 {
    background: #ebebeb;
    background-image: -webkit-linear-gradient(top, #fff, #d9d9d9); 
    background-image: -moz-linear-gradient(top, #fff, #d9d9d9);
    background-image: -ms-linear-gradient(top, #fff, #d9d9d9);
    background-image: -o-linear-gradient(top, #fff, #d9d9d9);
    background-image: linear-gradient(to bottom, #fff, #d9d9d9);
    color: #444;
    font-size: 16px;
    font-weight: bold;
    border: solid #ccc 1px;
}

.btn-pay:hover, .btn-pay2:hover {
    background: #ffffff;
    background-image: -webkit-linear-gradient(top, #fff, #ebebeb); 
    background-image: -moz-linear-gradient(top, #fff, #ebebeb);
    background-image: -ms-linear-gradient(top, #fff, #ebebeb);
    background-image: -o-linear-gradient(top, #fff, #ebebeb);
    background-image: linear-gradient(to top, #fff, #ebebeb);
    border: solid #aaa 1px;

}




/*DATEPICKER*/
.input-daterange > input {
    padding: 22px 15px !important;
    border: 1px solid #CFD8DC !important;
    border-radius: 4px !important;
    box-sizing: border-box;
    background-color: #fff !important;
    color: #000 !important;
    font-size: 16px !important;
    letter-spacing: 1px;
    position: relative
}

input:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 1px solid #1976D2 !important;
    outline-width: 0
}



.custom-file-label::after {
    content: "Vyber soubor" !important;
}


.fa-calendar {
    position: absolute;
    top: 13px;
    font-size: 20px;
    color: #1976D2;
    z-index: 1000
}

#fa-1 {
    left: calc(50% - 40px)
}

#fa-2 {
    left: calc(100% - 34px)
}

.form-control-placeholder {
    position: absolute;
    top: 2px !important;
    padding: 12px 2px 0 2px;
    opacity: 0.5;
    font-weight: normal !important;
}

.select2-selection {
    height: calc(2.25rem + 2px) !important;
    /*padding: .275rem .75rem !important;*/
}

.select2-container .select2-search--inline .select2-search__field {
    font-size: 0.9rem !important;
    color: black !important;
    display: block;
    height: auto;
}

.select2-container--default .select2-dropdown .select2-search__field:focus, .select2-container--default .select2-search--inline .select2-search__field:focus {
    outline: 0;
    border: 0px solid #80bdff;
}

.select2-container--default .select2-dropdown {
    border: 1px solid #000;
}



#filtr_do-p {
    left: calc(50% + 10px);
}

.form-control:focus+.form-control-placeholder,
.form-control:valid+.form-control-placeholder {
    font-size: 95%;
    top: 10px;
    transform: translate3d(0, -100%, 0);
    opacity: 1
}

::placeholder {
    color: #939ba2;
    opacity: 1
}


    
::-webkit-input-placeholder {
    padding-top: 4px;
    padding-left: 4px;
}

:-ms-input-placeholder {
    color: #939ba2
}

::-ms-input-placeholder {
    color: #939ba2
}

button:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    outline-width: 0
}

.datepicker {
    background-color: #fff;
    border-radius: 0 !important;
    align-content: center !important;
    padding: 0 !important
}

.datepicker-dropdown {
    /*top: 180px !important;*/
    /*left: calc(50% - 173.5px) !important;*/
    border-right: #1976D2;
    border-left: #1976D2
}

.datepicker-dropdown.datepicker-orient-left:before {
    /*left: 20px !important*/
}

.datepicker-dropdown.datepicker-orient-left:after {
    /*left: calc(50% - 5px) !important;*/
    border-bottom-color: #1976D2
}

.datepicker-dropdown.datepicker-orient-right:after {
    border-bottom-color: #1976D2
}

.datepicker table tr td.today,
span.focused {
    border-radius: 50% !important;
    background-image: linear-gradient(#FFF3E0, #FFE0B2)
}



.cw {
    font-size: 14px !important;
    background-color: #E8EAF6 !important;
    border-radius: 0px !important;
    padding: 0px 20px !important;
    margin-right: 10px solid #fff !important
}

.old,
.day,
.new {
    width: 40px !important;
    height: 40px !important;
    border-radius: 0px !important
}

.day.old,
.day.new {
    color: #E0E0E0 !important
}

.day.old:hover,
.day.new:hover {
    border-radius: 50% !important
}

.old-day:hover,
.day:hover,
.new-day:hover,
.month:hover,
.year:hover,
.decade:hover,
.century:hover {
    border-radius: 50% !important;
    background-color: #eee
}

.aactive {
    border-radius: 50% !important;
    background-image: linear-gradient(#1976D2, #1976D2) !important;
    color: #fff !important
}

.range-start,
.range-end {
    border-radius: 50% !important;
    background-image: linear-gradient(#1976D2, #1976D2) !important
}

.range {
    background-color: #E3F2FD !important
}

.datepicker-days .prev,
.datepicker-days .next,
.datepicker-switch {
    border-radius: 0 !important;
    padding: 10px 10px 10px 10px !important;
    font-size: 18px;
    opacity: 0.7;
    color: #fff
}

.prev:hover,
.next:hover,
.datepicker-switch:hover {
    background-color: inherit !important;
    opacity: 1
}

@media screen and (max-width: 726px) {
    .datepicker-dropdown.datepicker-orient-right:before {
        right: calc(50% - 6px)
    }

    .datepicker-dropdown.datepicker-orient-right:after {
        right: calc(50% - 5px)
    }
}

.login-box {
    background-color:rgba(255, 255, 255, 0.3);
    padding: 30px;
    width: inherit;
}


/*rotace ikony pri detailu odpadu*/
.rotate-icon {
  transition: transform 0.3s ease;
}
.rotate-icon.rotated {
  transform: rotate(180deg);
}


/* TR řádek s detailem – sám nemá žádný spacing ani výšku */
.detail-row {
  padding: 0 !important;
  border: none;
}

/* TD buňky ve skrytém řádku */
.detail-row td {
  padding: 0 !important;
  border: none;
}

/* Vnitřní div s obsahem, který se animuje */
.detail-content {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height 0.6s ease, opacity 0.4s ease;
  margin: 0;
  padding: 0;
}

/* Otevřený stav */
.detail-row.open .detail-content {
  max-height: 1000px; /* větší než největší možný obsah */
  opacity: 1;
}


input[required],
select[required],
textarea[required] {
  background-color: #fff0f0; /* velmi světlá červená */
}


.big-checkbox .custom-control-label::before,
.big-checkbox .custom-control-label::after {
  top: 0.1rem;
  width: 1.5rem;
  height: 1.5rem;
}

/* větší zaškrtnutí a styl */
.custom-control-input {
  background-color: #007bff !important;
  border-color: #007bff;
}

/* větší zaškrtnutí a styl */
.big-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #007bff;
  border-color: #007bff;
}

/* zluty okraj vždy */
.custom-checkbox .custom-control-label::before {
  border: 2px solid #FFC107; /* Bootstrap alert */
  background-color: #fff;
}

/* zarovnání textu s větším boxem */
.big-checkbox .custom-control-label {
  padding-left: 0.4rem;
  font-size: 1.1rem;
  font-weight: normal !important;
}

/*naklápění ikony*/
 .tilt {
    display: inline-block;
    animation: tilt 2s infinite ease-in-out;
    transform-origin: top center;
  }
  @keyframes tilt {
    0%   { transform: rotate(8deg); }
    50%  { transform: rotate(-8deg); }
    100% { transform: rotate(8deg); }
  }

.svg_background {

background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1920' height='1080' preserveAspectRatio='none' viewBox='0 0 1920 1080'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1191%26quot%3b)' fill='none'%3e%3cpath d='M1429.975%2c1209.365C1522.754%2c1210.941%2c1613.118%2c1170.099%2c1660.952%2c1090.586C1710.223%2c1008.684%2c1710.128%2c905.852%2c1662.37%2c823.059C1614.58%2c740.211%2c1525.6%2c688.325%2c1429.975%2c690.168C1337.313%2c691.954%2c1257.53%2c750.671%2c1212.592%2c831.726C1169.07%2c910.226%2c1167.423%2c1005.173%2c1212.202%2c1082.963C1257.081%2c1160.928%2c1340.029%2c1207.837%2c1429.975%2c1209.365' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M201.69165513459774 871.6246821107926L-70.63128124985789 876.1184922508191 48.411461756204844 1082.3065714096842z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M87.43 655.64 a224.52 224.52 0 1 0 449.04 0 a224.52 224.52 0 1 0 -449.04 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M108.721%2c923.508C200.403%2c926.903%2c285.24%2c873.705%2c330.372%2c793.829C374.797%2c715.204%2c372.515%2c617.778%2c324.781%2c541.117C279.56%2c468.492%2c194.252%2c435.923%2c108.721%2c437.859C26.806%2c439.713%2c-50.333%2c479.419%2c-91.037%2c550.529C-131.49%2c621.2%2c-124.654%2c706.619%2c-86.209%2c778.402C-45.22%2c854.936%2c21.961%2c920.295%2c108.721%2c923.508' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M659.23 882.98 a338.31 338.31 0 1 0 676.62 0 a338.31 338.31 0 1 0 -676.62 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M73.693%2c1109.956C119.211%2c1107.699%2c155.353%2c1074.803%2c176.497%2c1034.431C196.026%2c997.141%2c195.132%2c953.557%2c174.948%2c916.617C153.829%2c877.964%2c117.631%2c849.365%2c73.693%2c846.281C23.739%2c842.775%2c-29.428%2c857.736%2c-55.591%2c900.435C-82.717%2c944.705%2c-75.692%2c1001.398%2c-48.428%2c1045.583C-22.529%2c1087.556%2c24.434%2c1112.398%2c73.693%2c1109.956' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1270.986%2c1086.516C1306.388%2c1086.551%2c1344.617%2c1083.924%2c1364.902%2c1054.91C1387.936%2c1021.965%2c1393.92%2c976.033%2c1371.61%2c942.593C1350.876%2c911.516%2c1308.344%2c913.896%2c1270.986%2c914.143C1234.277%2c914.385%2c1192.982%2c913.35%2c1172.638%2c943.907C1150.677%2c976.893%2c1154.893%2c1022.102%2c1177.391%2c1054.725C1197.44%2c1083.797%2c1235.671%2c1086.481%2c1270.986%2c1086.516' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M130.79915431492816 566.5156130214724L295.4748477467566 743.1086739593825 472.06790868466663 578.432980527554 307.39221525283824 401.83991958964396z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M296.34 256.48 a293.48 293.48 0 1 0 586.96 0 a293.48 293.48 0 1 0 -586.96 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M122.52741366197245 619.78495233703L432.3433930426796 554.2400718222532 250.73155913863482 345.31955572157085z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M495.644%2c646.208C574.833%2c642.101%2c618.547%2c563.434%2c657.551%2c494.395C695.628%2c426.996%2c735.077%2c351.836%2c701.301%2c282.182C664.052%2c205.366%2c581.015%2c160.214%2c495.644%2c160.505C410.758%2c160.794%2c333.323%2c209.205%2c292.402%2c283.576C252.882%2c355.401%2c261.693%2c441.335%2c301.774%2c512.849C342.876%2c586.184%2c411.689%2c650.563%2c495.644%2c646.208' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M400.4658419596269 391.47461641216717L535.9611978435191 246.1736364086224 255.16486195608215 255.97926052827498z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1962.7833348227275 205.11582342782293L1786.6098099362553 229.87539766783033 1811.3693841762627 406.04892255430264 1987.542909062735 381.28934831429524z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M449.28 1016.26 a347.61 347.61 0 1 0 695.22 0 a347.61 347.61 0 1 0 -695.22 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M-24.99 250.81 a221.93 221.93 0 1 0 443.86 0 a221.93 221.93 0 1 0 -443.86 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1700.1110238633837 680.1386024169185L1589.7064136761421 406.87760318592603 1316.4454144451497 517.2822133731677 1426.8500246323913 790.5432126041601z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M795.97 824.88 a320.13 320.13 0 1 0 640.26 0 a320.13 320.13 0 1 0 -640.26 0z' fill='rgba(34%2c 86%2c 139%2c 0.05)' class='triangle-float2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1191'%3e%3crect width='1920' height='1080' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 3s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 2s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 4s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");}