/* ============================================================
 * FiBu-Connect Admin Light Theme v2.3
 * Einheitliches Layout + Eingabefeld-Optimierung (inkl. Password Fix)
 * ============================================================ */

:root {
  --bg:#f9fafb;
  --card:#ffffff;
  --muted:#f8fafc;
  --border:#e5e7eb;
  --text:#111827;
  --sub:#6b7280;
  --brand:#2563eb;
  --focus:#94a3b8;
  --shadow:0 8px 24px rgba(16,24,40,.06);
}

/* === Global Reset === */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);
  color:var(--text);
  font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial;
}

/* === Layout === */
.fc-main{
  display:block;
  width:100%;
  margin:0;
  padding:40px 0 60px;
  min-height:calc(100vh - 180px);
}
.wrap{
  max-width:1120px;
  margin:0 auto;
  padding:0 16px;
}
.center{max-width:980px;margin:0 auto;}

/* === Typography === */
h1{margin:0 0 6px;font-size:24px;font-weight:700;}
h2{margin:18px 0 10px;font-size:18px;font-weight:700;}
.sub{color:var(--sub);margin:0 0 18px;font-size:14px;}

/* === Card === */
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:22px;
  box-shadow:var(--shadow);
  margin-top:20px;
}

/* === Fieldsets === */
fieldset{
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 12px;
  margin:14px 0;
  background:var(--muted);
}
legend{padding:0 8px;color:var(--sub);font-size:13px;}

/* === Labels === */
label{display:block;margin:8px 0 6px;font-size:13px;color:var(--sub);}
.req::after{content:" *";color:#b91c1c}

/* === Inputs, Selects, Textareas – Einheitliches Styling (inkl. Password-Fix) === */
input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=date],
input[type=file],
select,
textarea {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  padding:10px 12px;
  height:42px;
  font-size:14px;
  font-family:inherit;
  line-height:1.45;
  color:var(--text);
  background-color:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  box-shadow:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}

input[type=file]{
  padding:6px 8px;
  font-size:13px;
  cursor:pointer;
  height:42px;
}

select{
  background-image:url("data:image/svg+xml,%3Csvg fill='none' stroke='%236b7280' stroke-width='1.5' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:1em;
  padding-right:34px;
  cursor:pointer;
}

input:focus,
select:focus,
textarea:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 2px rgba(37,99,235,.25);
}

input[readonly],
input[disabled],
select[disabled],
textarea[disabled]{
  background-color:#f9fafb;
  color:#9ca3af;
  cursor:not-allowed;
}

/* Einheitliche Date-Picker-Icon-Darstellung */
input[type=date]::-webkit-calendar-picker-indicator{
  color:transparent;
  background:url("data:image/svg+xml,%3Csvg fill='none' stroke='%236b7280' stroke-width='1.5' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 7V3m8 4V3m-9 8h10m-11 8h12a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z'/%3E%3C/svg%3E") center/16px no-repeat;
  opacity:.6;
  cursor:pointer;
}

/* === Layout Grids === */
.grid-2{display:grid;gap:10px;}
@media(min-width:640px){.grid-2{grid-template-columns:1fr 1fr}}
.grid-3{display:grid;gap:10px;}
@media(min-width:900px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.grid-addr{display:grid;gap:10px;}
@media(min-width:640px){.grid-addr{grid-template-columns:repeat(5,1fr)}}

/* === Hints & Messages === */
.hint{font-size:12px;color:#64748b;margin-top:4px}
.msg{
  margin:12px 0;
  color:#7c5b00;
  font-size:13px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  border-radius:8px;
  padding:8px 10px;
}
.err{font-size:12px;color:#b91c1c;margin-top:4px;min-height:1em}

/* === Actions & Buttons === */
.actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}

a.btn,
button.btn,
input[type=submit].btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text);
  font-size:14px;
  font-family:inherit;
  text-decoration:none;
  cursor:pointer;
  transition:background .15s ease;
  line-height:1.2;
}

a.btn:hover,
button.btn:hover,
input[type=submit].btn:hover{background:#f3f4f6;}

a.btn.primary,
button.btn.primary,
input[type=submit].btn.primary{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}
a.btn.primary:hover,
button.btn.primary:hover,
input[type=submit].btn.primary:hover{background:#1d4ed8;}

a.btn.secondary,
button.btn.secondary{
  background:#6b7280;
  border-color:#6b7280;
  color:#fff;
}
a.btn.secondary:hover,
button.btn.secondary:hover{background:#4b5563;}

/* === Utility === */
.is-hidden{display:none !important}
.small{font-size:13px;color:var(--sub)}
.right{text-align:right}
.mono{font-family:monospace}

/* === Tables === */
.table{width:100%;border-collapse:collapse;}
.table th,.table td{padding:10px 12px;border-bottom:1px solid var(--border);}
.table th{text-align:left;color:var(--sub);font-size:13px;text-transform:uppercase;}
.table .small{font-size:13px;color:#4b5563;}
.table .right{text-align:right;}
.table .table-zebra tr:nth-child(even){background:var(--muted)}

/* === Pager === */
.pager{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:30px;}
.pager .small{font-size:13px;color:var(--sub)}

/* === Footer === */
footer,.footer{
  font-size:13px;
  color:var(--sub);
  text-align:center;
  margin-top:40px;
  padding:20px 0;
  border-top:1px solid var(--border);
}

/* === Responsive Adjustments === */
@media(max-width:768px){
  .fc-main{padding:24px 0 80px;}
  .actions{flex-direction:column;align-items:stretch;}
  .btn{width:100%;justify-content:center;}
}