/* neogrid Kundenportal – nutzt die Farbvariablen des neogrid-Themes, mit Ersatzwerten */
.entry:has(.ngp) { max-width: 60rem; }
.ngp { --ngp-ink: var(--ink, #13233A); --ngp-muted: var(--muted, #4A5B6E); --ngp-line: var(--line, #C3CED8); --ngp-surface: var(--surface, #fff); --ngp-paper: var(--paper, #F1F4F6); --ngp-signal: var(--signal, #F2B705); --ngp-link: var(--link, #0B6E6D); }
.ngp h2 { font-size: 1.5rem; margin: 0 0 1rem; }
.ngp-small { font-size: .9rem; color: var(--ngp-muted); }

.ngp-bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; padding: .7rem 1rem; margin-bottom: 1.5rem; border: 1px solid var(--ngp-line); background: var(--ngp-surface); font-size: .92rem; }
.ngp-bar a + a { margin-left: 1rem; }

.ngp-note { padding: .9rem 1.1rem; border-left: 4px solid var(--ngp-link); background: var(--ngp-surface); }
.ngp-note.ngp-err { border-color: #C0392B; }

.ngp-box { background: var(--ngp-surface); border: 1px solid var(--ngp-line); padding: 1.5rem; margin-bottom: 1.25rem; }
.ngp-login { max-width: 26rem; }

.ngp label { display: block; font-weight: 600; font-size: .92rem; margin-bottom: .3rem; }
.ngp input[type="text"], .ngp input[type="password"], .ngp input[type="email"], .ngp select, .ngp textarea {
	width: 100%; font: inherit; color: var(--ngp-ink); background: var(--ngp-paper);
	border: 1px solid var(--ngp-line); border-radius: 4px; padding: .65rem .8rem;
}
.ngp input:focus, .ngp select:focus, .ngp textarea:focus { border-color: var(--ngp-ink); outline: 2px solid var(--ngp-signal); outline-offset: 0; }
.ngp .login-remember label { display: flex; align-items: center; gap: .5rem; font-weight: 400; }
.ngp .login-remember input { width: auto; }
.ngp #wp-submit { background: var(--ngp-signal); color: #13233A; border: 0; border-radius: 4px; padding: .8rem 1.4rem; font: 600 1rem inherit; cursor: pointer; }
.ngp-form p { margin: 0 0 1rem; max-width: none; }
.ngp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 560px) { .ngp-row { grid-template-columns: 1fr; } }
.ngp-warn { border-left: 3px solid var(--ngp-signal); padding-left: .7rem; }

.ngp-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.ngp-head h2 { margin: 0; }
.ngp-empty { border: 2px dashed var(--ngp-line); padding: 2rem; }

.ngp-scroll { overflow-x: auto; }
.ngp-table { width: 100%; border-collapse: collapse; background: var(--ngp-surface); border: 1px solid var(--ngp-line); font-size: .95rem; min-width: 34rem; }
.ngp-table th, .ngp-table td { text-align: left; padding: .75rem 1rem; border-bottom: 1px solid var(--ngp-line); vertical-align: top; }
.ngp-table thead th { background: var(--ngp-paper); border-bottom: 2px solid var(--ngp-ink); font-weight: 600; }
.ngp-table td:first-child { white-space: nowrap; color: var(--ngp-muted); font-variant-numeric: tabular-nums; }

.ngp-badge { display: inline-block; padding: .15rem .55rem; border-radius: 3px; font-size: .82rem; font-weight: 600; white-space: nowrap; border: 1.5px solid var(--ngp-ink); }
.ngp-offen { background: var(--ngp-signal); color: #13233A; border-color: var(--ngp-signal); }
.ngp-bearbeitung { background: var(--ngp-link); color: #fff; border-color: var(--ngp-link); }
.ngp-rueckfrage { background: transparent; color: var(--ngp-ink); border-color: var(--ngp-signal); border-width: 2px; }
.ngp-erledigt { background: transparent; color: var(--ngp-muted); border-color: var(--ngp-line); }

.ngp-ticket-head { display: flex; align-items: center; gap: .75rem; margin-bottom: .4rem; }
.ngp-num { color: var(--ngp-muted); font-variant-numeric: tabular-nums; }
.ngp-meta { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin: 0 0 1.75rem; font-size: .92rem; }
.ngp-meta dt { color: var(--ngp-muted); }
.ngp-meta dd { margin: 0; font-weight: 600; }

.ngp-thread { list-style: none; margin: 0 0 1.5rem; padding: 0; border-left: 2px solid var(--ngp-line); }
.ngp-msg { position: relative; margin: 0 0 1.1rem 1.25rem; padding: 1rem 1.2rem; background: var(--ngp-surface); border: 1px solid var(--ngp-line); }
.ngp-msg::before { content: ""; position: absolute; left: calc(-1.25rem - 6px); top: 1.2rem; width: 10px; height: 10px; border-radius: 50%; background: var(--ngp-paper); border: 2px solid var(--ngp-ink); }
.ngp-staff { border-left: 4px solid var(--ngp-link); }
.ngp-staff::before { background: var(--ngp-link); border-color: var(--ngp-link); }
.ngp-msg-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; font-size: .9rem; margin-bottom: .4rem; }
.ngp-msg-head span { color: var(--ngp-muted); }
.ngp-close { margin-bottom: 2rem; }