/*main color #e1001e
gray #eaeaea*/

html {
}

body {
    min-height: 100vh;
    /* Header photo is the backdrop for the whole page so the glass nav + content
       panel float over it (image moved here from .backGroundImage). */
    background-image: url('/images/kt-sz_headerbild.jpg');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    background-attachment: fixed;
}


/* .backGroundImage: photo moved to body; class kept on #page-content for layout. */


.nav-link{
    font-size:20px;
    font-weight:500;
    color:black !important;
}

    .nav-link:hover {
        color: #e1001e !important;
    }



.legendTable td {
    width: 80px;
}

.legendTable .btn {
    text-transform: none;
    padding: 0px;
    cursor: default;
}

    .legendTable .btn:focus {
        color: inherit !important;
    }

    .legendTable .btn:hover {
        color: inherit !important;
    }



div.slots{
    padding-top:16px
}

.slots td{
    padding:2px;
}

.slots tr td {
    border-style: none;
    border-top-style: none !important;
}

.slots .btn:hover {
    filter: brightness(85%);
}



.Accepted {
    background-color: #e1001e;
    color: white;
    height: 28px;
}

.Locked {
    background-color: #8542a7;
    color: white;
    height: 28px;
}

.Free {
    background-color: #3FB618;
    color: white;
    height: 28px;
}

.ReadyForBill {
    background-color: skyblue;
    color: white;
    height: 28px;
}

.Billed {
    background-color: royalblue;
    color: white;
    height: 28px;
}

.slotTooltip td:nth-child(1) {
    padding-right: 10px;
    text-align: right;
}

.field-validation-valid {
    display: none;
}

.validation-summary-valid {
    display: none;
}

.tooltip-inner {
    max-width: 500px !important;
}
/* Larger nav-bar account/login/logout icons (dx-icon glyphs) */
.nav-link .nav-icon[class*="dx-icon-"] {
    font-size: 1.6rem;
    line-height: 1;
    vertical-align: middle;
}

/* Content panel: stays solid white for readability, but floats over the header
   photo (#page-content.backGroundImage) with a glassy border + soft shadow. */
#page-content main.bg-white {
    background: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Top nav: solid white bar spanning the full page width, floating over the
   header photo with a soft drop shadow. Inner .container keeps the brand/links
   aligned to the page content. */
header .navbar {
    background: #fff;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.18);
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

/* Glass dropdowns (Verwaltung/Stammdaten menus). */
.dropdown-menu {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}