﻿header { padding-block: 1.4rem; }
header h1 { font-size: 1.55rem; }
.auth-error { color: #8b1d1d; }
main { flex: 1 0 auto; width: min(1100px, 100%); margin: auto; padding: 1.5rem clamp(1rem, 3vw, 2rem) 3rem; }
.panel { margin-bottom: 1.25rem; padding: 1.25rem; background: white; border: 1px solid #cddbeb; border-radius: .6rem; box-shadow: 0 2px 8px rgb(0 56 131 / 8%); }
.panel h2 { margin: 0 0 .5rem; font-size: 1.12rem; }
.warning { color: #7a4100; background: #fff4d6; border-color: #e7c76f; }
form { display: grid; gap: .9rem; }
.fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .85rem; }
label { display: grid; gap: .32rem; font-size: .87rem; font-weight: 650; }
label.wide { grid-column: 1 / -1; }
input, textarea, button { width: 100%; min-height: 2.5rem; padding: .55rem .7rem; font: inherit; border: 1px solid #aeb9c8; border-radius: .35rem; background: white; }
textarea { min-height: 4.5rem; resize: vertical; }
button { width: auto; cursor: pointer; font-weight: 700; }
input:focus, textarea:focus, button:focus { outline: 3px solid rgb(0 56 131 / 20%); border-color: var(--eurofins-blue); }
button.primary { color: white; background: var(--eurofins-orange); border-color: var(--eurofins-orange); }
button:disabled { cursor: wait; opacity: .65; }
.actions { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.muted { color: #5a687c; font-size: .9rem; }
.status.error { color: #a32121; font-weight: 650; }
#applications { display: grid; gap: 1rem; }
.application { padding: 1rem; border: 1px solid #cddbeb; border-left: 3px solid var(--eurofins-blue); border-radius: .45rem; }
.application h3 { margin: 0 0 .8rem; font-size: 1rem; }
.sync-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .55rem; margin-top: .8rem; }
.sync-tenant { padding: .7rem; border: 1px solid #d7e0eb; border-radius: .4rem; font-size: .82rem; }
.sync-tenant strong { color: var(--eurofins-blue); }
.sync-tenant.degraded { border-left: 4px solid #a32121; background: #fff5f5; }
.sync-tenant.healthy { border-left: 4px solid #2f7d32; }
.sync-tenant.initializing { border-left: 4px solid var(--eurofins-orange); }
@media (max-width: 700px) { .header-content { align-items: flex-start; } }
