
body{margin:0;background:#0f172a;color:#e5e7eb;font-family:Arial}

/* Globale Akzentfarbe (für .btn-dark etc.) */
:root{ --accent:#facc15; }
.nav{background:#111827;padding:12px 16px;color:#fff}
.container{max-width:1400px;margin:20px auto;padding:10px 12px}
.card{background:#1e293b;padding:16px;border-radius:12px;margin-bottom:16px}
input,textarea{width:100%;padding:10px;margin:6px 0;background:#0f172a;border:1px solid #334155;color:#fff;border-radius:8px}
button,.btn{background:#facc15;color:#000;padding:10px 14px;border:none;border-radius:8px;cursor:pointer;text-decoration:none}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid #334155;padding:8px}


/* --- 2v15: Fix overlap of "Neue Abrechnung" button and status/flash texts --- */
.actions, .toolbar, .top-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin: 10px 0 16px;
}
.flash, .alert, .message, .notice {
  position: relative;
  z-index: 2;
  margin-top: 10px;
}
.btn, a.btn, button.btn {
  position: relative;
  z-index: 1;
}


/* --- 2v16: Nav layout + no highlight box for "Neu" --- */
.nav{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:center;
}
.nav .brand{flex:1 1 auto; min-width: 120px;}
.nav .links{display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center;}
.nav .links a{color:#a78bfa; text-decoration:underline;}
.nav .links a.nav-new{
  color:#a78bfa;
  text-decoration:underline;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
}
/* --- 2v16: Stack bottom action buttons left --- */
.actions.actions-vertical{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}


/* --- 2v17: Header links sollen nicht überlappen --- */
.nav{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.nav .links{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* Buttons unten links untereinander */
.form-actions-vertical{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-top:14px;
}


/* --- 2v18: Eingabefelder bleiben dunkel (auch bei Focus), Buttons unten nebeneinander links --- */
input, textarea, select{
  background:#1f1f1f;
  color:#f2f2f2;
}
input:focus, textarea:focus, select:focus{
  background:#1f1f1f;
  color:#f2f2f2;
  outline: 2px solid rgba(255,255,255,0.25);
  box-shadow:none;
}

.form-actions-row{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  margin-top:14px;
}


/* --- 2v21: Tabelle breiter mit Rand links/rechts --- */
.container, .wrap, .content {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 30px;
}

table {
  width: 100%;
}

@media print {
  body {
    background: white;
  }
}


/* --- Edit page sidebar (2v27) --- */
.edit-layout{
  display:flex;
  gap:18px;
  align-items:flex-start;
}
.edit-sidebar{
  width:280px;
  position:sticky;
  top:18px;
}
.edit-main{
  flex:1;
  min-width:0;
}
.sidebar-card{
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  padding: 12px;
}
.sidebar-title{
  font-weight: 800;
  margin-bottom: 10px;
}
.btn-dark{
  /* Sidebar-Buttons wieder im gelb/orange Design wie der Rest */
  background: var(--accent) !important;
  color:#111 !important;
  border:1px solid rgba(0,0,0,0.12) !important;
}
.btn-dark:hover{
  filter: brightness(0.95);
}
.edit-sidebar .btn{
  width:100%;
  display:block;
  box-sizing:border-box;
  margin: 8px 0;
  text-align:center;
}
.sidebar-email .input{
  width:100%;
  display:block;
  box-sizing:border-box;
  margin-bottom: 8px;
}
.sidebar-email .hint{
  font-size: 12px;
  opacity: .85;
  margin-top: 6px;
}
@media (max-width: 980px){
  .edit-layout{flex-direction:column;}
  .edit-sidebar{width:100%; position:static;}
}

/* --- II. Dienstleistungen: links Ort/Art, rechts Zeiten (2v28) --- */
.dienst-grid{
  display:grid;
  grid-template-columns: 1.25fr 1fr;
  gap:18px;
  align-items:start;
}
.dienst-col{
  min-width:0;
}
.times-table{
  table-layout:fixed;
}
.times-table td input{
  width:100%;
}
@media (max-width: 980px){
  .dienst-grid{grid-template-columns:1fr;}
}

/* Spaltenbreiten in der Zeit-Tabelle */
.times-table col.col-date{width:40%;}
.times-table col.col-from{width:18%;}
.times-table col.col-to{width:18%;}
.times-table col.col-hours{width:24%;}

/* --- v2v31: Excel-Layout (Ort + Zeit in einer Zeile) --- */
.dienst-table{ width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; }
.dienst-table th, .dienst-table td{ border:1px solid rgba(255,255,255,0.08); padding:8px; vertical-align:middle; }
.dienst-table thead th{ background:rgba(255,255,255,0.04); font-weight:700; }
.dienst-table td input{ width:100%; height:42px; padding:10px 12px; margin:0; }
.dienst-table .nr{ width:44px; text-align:center; color:var(--muted); }

/* Spaltenbreiten */
.dienst-table col.col-nr{ width:44px; }
.dienst-table col.col-service{ width:auto; }
.dienst-table col.col-date{ width:170px; }
.dienst-table col.col-from,
.dienst-table col.col-to{ width:88px; }
.dienst-table col.col-hours{ width:120px; }

@media (max-width: 980px){
  /* auf schmalen Screens darf es horizontal scrollen statt Layout zu zerstören */
  .dienst-table{ display:block; overflow-x:auto; }
}


/* --- v2v30: Ort/Art ohne doppelte Zeilennummern + bessere Ausrichtung --- */
.dienst-grid .ort-row{gap:0 !important;}
.dienst-grid .ort-row input[type="text"]{height:42px; padding:10px 12px; margin:0;}
.dienst-grid .times-table input[type="text"]{height:42px; padding:10px 12px; margin:0;}
.dienst-grid .times-table td.nr{width:40px; text-align:center;}

