/* Partnerbereich-Login (Site harzpartner). Alles unter .pl-* gescoped. */

.pl-shell, .pl-hub {
    --pl-green: #5f7d1e;
    --pl-green-dark: #2b3910;
    --pl-green-soft: #eef3e2;
    --pl-ink: #1f2a10;
    --pl-muted: #667085;
    --pl-line: #dfe5d3;
    font-family: inherit;
    color: var(--pl-ink);
}

/* ---------- Zwei-Spalten-Karte ---------- */
.pl-shell {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    margin: 2.5rem auto 3.5rem;
    max-width: 1080px;
    border-radius: 24px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 14px 34px rgba(31, 42, 16, .18), 0 2px 6px rgba(31, 42, 16, .08);
}
.pl-shell-narrow { grid-template-columns: 1fr; max-width: 520px; }

/* ---------- Linke Marken-Spalte ---------- */
.pl-brand {
    position: relative;
    padding: 3rem 2.75rem;
    color: #fff;
    background:
        radial-gradient(120% 80% at 100% 0%, rgba(255, 255, 255, .14), transparent 55%),
        linear-gradient(155deg, var(--pl-green) 0%, var(--pl-green-dark) 100%);
}
.pl-eyebrow {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: .35rem .8rem;
    border-radius: 99px;
    background: rgba(255, 255, 255, .16);
}
.pl-shell .pl-brand h1 {
    text-shadow: none !important;
    color: #fff !important;
    margin: 1.1rem 0 .8rem;
    font-size: clamp(1.7rem, 2.6vw, 2.35rem);
    line-height: 1.15;
    font-weight: 800;
    color: #fff;
}
.pl-lead { margin: 0 0 1.4rem; font-size: 1.05rem; line-height: 1.55; opacity: .92; }

.pl-checks { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; gap: .65rem; }
.pl-checks li { position: relative; padding-left: 1.9rem; line-height: 1.45; }
.pl-checks li::before {
    content: "";
    position: absolute; left: 0; top: .15rem;
    width: 1.2rem; height: 1.2rem; border-radius: 50%;
    background: rgba(255, 255, 255, .22)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat;
}

.pl-portals { display: grid; gap: .8rem; }
.pl-portal {
    display: flex; align-items: center; gap: .9rem;
    padding: .95rem 1.1rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .22);
    color: #fff; text-decoration: none;
    transition: background .18s, transform .18s;
}
.pl-portal:hover { background: rgba(255, 255, 255, .22); transform: translateY(-2px); color: #fff; }
.pl-portal-icon {
    flex: none; display: grid; place-items: center;
    width: 2.7rem; height: 2.7rem; border-radius: 12px;
    background: #fff; color: var(--pl-green);
}
.pl-portal-text { flex: 1; display: grid; gap: .15rem; }
.pl-portal-text strong { font-size: 1.02rem; }
.pl-portal-text small { font-size: .84rem; opacity: .85; line-height: 1.35; }
.pl-portal-arrow { font-size: 1.3rem; transition: transform .18s; }
.pl-portal:hover .pl-portal-arrow { transform: translateX(4px); }

/* ---------- Rechte Formular-Spalte ---------- */
.pl-panel { padding: 3rem 2.75rem; display: flex; flex-direction: column; justify-content: center; background: #919395; }
.pl-shell .pl-panel h2 { margin: 0 0 .4rem; font-size: 1.75rem; font-weight: 800; color: #fff !important; text-shadow: none !important; }
.pl-sub { margin: 0 0 1.6rem; color: #fff; line-height: 1.5; }

.pl-field { margin-bottom: 1.1rem; }
.pl-field label, .pl-check label { display: block; margin-bottom: .4rem; font-size: .9rem; font-weight: 600; color: #fff; }
.pl-field input {
    width: 100%; height: 3rem; padding: 0 1rem;
    border: 1px solid var(--pl-line); border-radius: 12px;
    background: #fff; font-size: 1rem; color: var(--pl-ink);
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.pl-field input:focus {
    outline: none; background: #fff;
    border-color: var(--pl-green);
    box-shadow: 0 0 0 4px rgba(95, 125, 30, .18);
}
.pl-check { display: flex; align-items: center; gap: .55rem; margin-bottom: 1.2rem; }
.pl-check label { margin: 0; font-weight: 500; }
.pl-check input { width: 1.05rem; height: 1.05rem; accent-color: var(--pl-green); }

.pl-submit {
    display: block; width: 100%; margin-top: .4rem; padding: .6rem .75rem;
    font-size: 1rem; line-height: 1.5; font-weight: 400; color: #fff; cursor: pointer;
    background-color: #3a3f44;
    background-image: linear-gradient(#52565a, #3a3f44 60%, #353a3f);
    border: 1px solid #3a3f44; border-radius: .25rem;
}
.pl-submit:hover, .pl-submit:focus { background-color: #31363a; border-color: #2e3236; }
.pl-submit:focus { outline: none; box-shadow: 0 0 0 .25rem rgba(88, 92, 96, .5); }
.pl-submit-ghost { background: transparent; background-image: none; color: #eef0f4; border-color: rgba(255, 255, 255, .35); }
.pl-submit-ghost:hover, .pl-submit-ghost:focus { background: rgba(255, 255, 255, .08); border-color: #fff; }

.pl-forgot { margin: 1rem 0 0; text-align: center; }
.pl-bottom { margin: 1.6rem 0 0; padding-top: 1.3rem; border-top: 1px solid rgba(255, 255, 255, .35); text-align: center; color: #000; }
.pl-shell a:not(.pl-portal) { color: #4f671d; font-weight: 600; text-decoration: none; }
.pl-shell a:not(.pl-portal):hover, .pl-hub a.pl-link:hover { text-decoration: underline; }
.pl-hub a.pl-link { color: #cfe3a0; font-weight: 600; text-decoration: none; }

.pl-alert {
    margin-bottom: 1.2rem; padding: .8rem 1rem; border-radius: 12px;
    background: #fdeceb; color: #9b1c14; border: 1px solid #f6c9c5; font-size: .93rem;
}

/* ---------- Angemeldet (Übersicht) ---------- */
.pl-hub { max-width: 1000px; margin: 2.5rem auto 3.5rem; text-align: center; }
.pl-hub .pl-eyebrow { color: #cfe3a0; background: rgba(255, 255, 255, .1); }
.pl-hub h1 { text-shadow: none !important; color: #ccc !important; margin: 1rem 0 .5rem; font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 800; }
.pl-hub .pl-lead { color: #aab0ba; opacity: 1; }
.pl-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 290px)); justify-content: center; align-items: start; gap: 1rem; margin: 1.8rem 0 1.4rem; }
.pl-tile {
    display: grid; gap: .8rem; padding: 1.5rem 1.4rem; text-align: left;
    background: #919395; border: 1px solid rgba(255, 255, 255, .25); border-radius: 18px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
    transition: transform .18s, box-shadow .18s, border-color .18s;
}
.pl-tile:hover { transform: translateY(-3px); border-color: #fff; box-shadow: 0 14px 30px rgba(0, 0, 0, .4); }
.pl-hub a.pl-tile-title { font-size: 1.2rem; font-weight: 800; color: #fff; text-decoration: none; }
.pl-hub a.pl-tile-title:hover { text-decoration: underline; }
.pl-tile-sub { list-style: none; margin: 0; padding: .8rem 0 0; display: grid; gap: .45rem; border-top: 1px solid rgba(255, 255, 255, .35); }
.pl-tile-sub a { position: relative; padding-left: 1.1rem; color: #000; text-decoration: none; }
.pl-tile-sub a::before { content: "\203A"; position: absolute; left: 0; top: -.05rem; font-weight: 700; }
.pl-tile-sub a:hover { color: #fff; }
.pl-portals-inline { display: flex; justify-content: center; gap: 1.6rem; flex-wrap: wrap; }
.pl-logout { max-width: 220px; margin: 1.8rem auto 0; }

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
    .pl-shell { grid-template-columns: 1fr; margin: 1rem 0 2rem; border-radius: 18px; }
    .pl-panel { order: -1; padding: 2rem 1.4rem; }
    .pl-brand { padding: 2rem 1.4rem; }
    .pl-tiles { grid-template-columns: 1fr; }
}