/* =======================================
   Grunddesign – linkes PLESK-/Retro-Panel
======================================= */

html, body {
  margin:0;
  padding:0;
  background:#353535;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:11px;
  color:#000;
  height:100%;
}

/* HEADER */
#header {
  width:100%;
  height:40px;
 
  color:#fff;
  line-height:40px;
  padding:0 10px;
  box-sizing:border-box;
}
#header_title {
  float:left;
  font-weight:bold;
}
#header_date {
  float:right;
  font-size:10px;
  color:#ccc;
}

/* HAUPTTEIL */
#main {
  display:flex;
  flex-direction:row;
  height:calc(100vh - 60px);
}

/* SIDEBAR */
#sidebar {
  width:200px;
 
  border-right:1px solid #666;
  color:#fff;
  padding-top:10px;
  box-sizing:border-box;
}

.nav {
  list-style:none;
  padding:0;
  margin:0;
}
.nav li {
  margin:2px 0;
}
.nav hr {
  border:0;
  border-top:1px solid #555;
  margin:6px 10px;
}
.nav a {
  display:flex;
  align-items:center;
  color:#fff;
  text-decoration:none;
  padding:4px 8px;
  font-size:11px;
}
.nav a img {
  width:14px;
  height:14px;
  margin-right:6px;
  filter:brightness(0) invert(1);
}
.nav a:hover {
  background:#ec6707;
  color:#fff;
}

/* CONTENT */
#content {
  flex:1;
  background:#edecea  ;
  padding:15px;
  overflow:auto;
  box-sizing:border-box;
}

/* FOOTER */
#footer {
  width:100%;
  height:30px;
 
  color:#fff;
  text-align:center;
  line-height:30px;
  font-size:10px;
  border-top:1px solid #666;
}

/* =============================
   BOX-STIL (wie restliches Panel)
============================= */
.box {
  background:#fff;
  border:1px solid #ccc;
  border-radius:6px;
  padding:15px 20px;
  margin-bottom:25px;
  box-shadow:2px 2px 6px rgba(0,0,0,0.15);
}
.box h2 {
  color:#ec6707;
  font-size:14px;
  margin:0 0 10px 0;
  border-bottom:1px solid #eee;
  padding-bottom:4px;
}

/* =============================
   TABELLEN
============================= */
table {
  border-collapse:collapse;
  width:100%;
  font-size:11px;
}
th, td {
  padding:6px 8px;
  border-bottom:1px solid #ddd;
}
th {
  background:#f2f2f2;
  text-align:left;
}
tr:hover { background:#f9f9f9; }
.btn {
  background:#ec6707;
  color:#fff;
  border:none;
  border-radius:3px;
  padding:3px 8px;
  cursor:pointer;
  font-size:11px;
}
.btn:hover { background:#ff7a1a; }

/* =============================
   FEHLERBOX
============================= */
.error-box {
  background:#ffe5e5;
  border:1px solid #d33;
  color:#a00;
  padding:15px 20px;
  border-radius:6px;
  margin-bottom:20px;
  box-shadow:2px 2px 6px rgba(0,0,0,0.1);
}
.error-box h3 {
  margin-top:0;
  color:#d00;
}