

body {
    margin: 0;
    padding: 0;
    background-image: url('../img/background.jpg');
    background-repeat: repeat;
    background-size: auto;
    height: 100vh;
    font-family: Arial, sans-serif;
    font-size: 25px;
    color: #000;
}
/* Force 25px on all content elements (not headings, not buttons) */
table, td, th, p, span, label, input, select, textarea, div, li, dt, dd, a {
    font-size: 25px !important;
}
h1 { font-size: 32px !important; }
h2 { font-size: 28px !important; }
h3 { font-size: 26px !important; }
.btn, .btn-sm, .btn-crop, .btn-print { font-size: 20px !important; }

.headerclass {
    display: flex;
    align-items: center;
    padding: 5px 0;
}

h1 {
    text-align: center;
}
h2 {
    text-align: center;
}

/* .btn, .status{
    padding: 8px 16px;
    color: #fff;
    border-radius: 4px
} */



.content {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}
.container {
    display: flex;
}
.column {
    flex: 1;
    padding: 10px;
}

/* Header-Bereich */
.centered-image { /* Zentriertes Be Marilyn Logo */
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 80px;
}
.btn {
    margin: 10px 0;
    padding: 8px 16px;
    color: #fff;
    border-radius: 7px;
    background: #2f4ad0;
    box-shadow: 4px 5px 6px 0px #555;
    transition: all .4s ease;
    font-size: inherit;
    &:hover{
        /* letter-spacing: 2px; */
        background-color: rgb(5, 15, 128);
    }
}
.marilyn-button {
    background: none;
    border: none;
    margin: 0 4px;
}
.button-img {
    width: 30px;
    height: 30px;
}

.top-buttons {
    position: absolute;
    display: flex;
    align-items: center;
    top: 10px;
}
.top-buttons.left {
    left: 15px;
}
.top-buttons.right {
    right: 15px;
}

.menu-bar {
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: rgba(0, 100, 100, 0.2);
    padding: 4px 0;
    width: 400px;
    margin: 0 auto;
    flex-wrap: wrap;
}
@media (max-width: 500px) {
    .menu-bar { width: 100%; gap: 4px; padding: 6px 8px; }
    .headerclass { flex-wrap: wrap; justify-content: center; gap: 4px; }
    .top-buttons { position: static; }
    .centered-image { height: 50px; }
}

.menu-item {
    flex: 1;
    text-align: center;
}

.menu-item img {
    width: 28px;
    height: 28px;
    cursor: pointer;
    transition: transform 0.3s;
}

.menu-item img:hover {
    transform: scale(1.08);
}
.action-icons {
    position: absolute;
    display: flex;
    top: 46px;
    right: 30px;
    background: none;
    border: none;
}

/* Tabellen */
table {
    width: 100%;
    border-collapse: collapse;
}
table, th, td {
    border: 3px solid black;
}
th, td {
    padding: 8px;
    text-align: center;
}

th {
    background-color: #f2f2f2;
}

/* Tabellenelemente */
.button {
    background:    #0b5394;
    border-radius: 8px;
    /* padding:       8px 23px; */
    color:         #ffffff;
    display:       inline-block;
    font:          normal normal 23px/1 "Open Sans", sans-serif;
    text-align:    center;
    text-shadow:   1px 1px #000000;
}
.img_status {
    height: 39px;
    width: 39px;
}

/* Konfigurationsseite */
.config_form {
    margin: 0 68px;
}
.inputfield {
    font-size: 26px;
    height: 20px;
    height: 37px;
}
.config_inputfield {
    /* font-size: 26px; */
    width: 600px;
    /* height: 20px; */
}
.chpwd_inputfield {
    /* font-size: 26px; */
    width: 200px;
    /* height: 20px; */
}
.qr_update_inputfield {
    width: 105px;
    text-align: center;
}
#config_savebutton {
    height: 57px;
  font-size: 40px;
  width: 1000px;
  margin: 36px 0;
  background-color: #2c1793;
  color: white;
}
.modal_wrapper {
    visibility: hidden;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
  }

#modal_qr_background {
    position: absolute;
    /* top: 0%;
    left: 0%; */
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: .75;
    z-index: 1;
}

#modal_qr {
    text-align: center;
    position: absolute;
    background-color: rgb(255, 255, 255);;
    padding: 20px;
    border: 8px solid rgb(98, 104, 206);
    border-radius: 10px;
    width: 95%;
    max-width: 1000px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

  