.dias-portal {
    --dias-ink: #191b1f;
    --dias-muted: #60646c;
    --dias-line: #dedfe2;
    --dias-soft: #f5f5f6;
    --dias-accent: #b51f2a;
    --dias-accent-dark: #8f1720;
    --dias-white: #ffffff;
    --dias-radius: 14px;
    --dias-shadow: 0 8px 28px rgba(20, 22, 25, .09);
    width: min(1180px, calc(100% - 24px));
    margin: 34px auto 64px;
    color: var(--dias-ink);
    font: 16px/1.55 Arial, Helvetica, sans-serif;
}

.dias-portal *, .dias-portal *::before, .dias-portal *::after { box-sizing: border-box; }
.dias-portal h2, .dias-portal h3, .dias-portal p { color: inherit; }

.dias-login-card, .dias-portal-card {
    overflow: hidden;
    border: 1px solid var(--dias-line);
    border-radius: var(--dias-radius);
    background: var(--dias-white);
    box-shadow: var(--dias-shadow);
}

.dias-login-card { max-width: 680px; margin: 0 auto; }
.dias-login-head, .dias-portal-header { background: linear-gradient(135deg, #17191d 0%, #292c31 100%); color: var(--dias-white); }
.dias-login-head { padding: 34px 36px 30px; }
.dias-login-body { padding: 30px 36px 36px; }

.dias-kicker {
    display: block;
    margin-bottom: 8px;
    color: #f1b2b7;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.dias-login-head h2, .dias-portal-header h2 {
    margin: 0;
    color: var(--dias-white);
    font-size: clamp(1.7rem, 4vw, 2.5rem);
    line-height: 1.12;
}

.dias-login-intro { margin: 0 0 24px; color: #45484e; font-size: 1.03rem; }
.dias-login-card label { display: block; margin-top: 17px; color: var(--dias-ink); font-weight: 700; }
.dias-login-card input {
    display: block;
    width: 100%;
    min-height: 50px;
    margin-top: 7px;
    padding: 0 14px;
    border: 1px solid #bfc2c7;
    border-radius: 9px;
    background: var(--dias-white);
    color: var(--dias-ink);
    font: inherit;
}
.dias-login-card input:focus { outline: 3px solid rgba(181, 31, 42, .16); border-color: var(--dias-accent); }

.dias-login-card button, .dias-preference-form button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 11px 19px;
    border: 1px solid var(--dias-accent);
    border-radius: 9px;
    background: var(--dias-accent);
    color: var(--dias-white);
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}
.dias-login-card button { width: 100%; margin-top: 22px; }
.dias-login-card button:hover, .dias-preference-form button:hover { background: var(--dias-accent-dark); border-color: var(--dias-accent-dark); }
.dias-login-help { margin: 20px 0 0; text-align: center; font-size: .9rem; }
.dias-login-help a { color: var(--dias-accent); font-weight: 700; }

.dias-portal-error, .dias-portal-notice {
    max-width: 680px;
    margin: 0 auto 16px;
    padding: 14px 17px;
    border-radius: 10px;
    font-weight: 700;
}
.dias-portal-error { border: 1px solid #e8afb4; background: #fff5f5; color: #7d1820; }
.dias-portal-notice { border: 1px solid #b9d8c1; background: #f3fbf5; color: #245b31; }

.dias-portal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 32px;
}
.dias-status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    min-height: 38px;
    padding: 7px 13px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: var(--dias-accent);
    color: var(--dias-white);
    font-weight: 800;
}

.dias-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 22px 32px;
    border-bottom: 1px solid var(--dias-line);
    background: var(--dias-soft);
}
.dias-info-grid > div { min-width: 0; padding: 5px 18px; border-right: 1px solid var(--dias-line); }
.dias-info-grid > div:first-child { padding-left: 0; }
.dias-info-grid > div:last-child { padding-right: 0; border-right: 0; }
.dias-info-grid span { display: block; margin-bottom: 4px; color: var(--dias-muted); font-size: .75rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.dias-info-grid strong { display: block; overflow-wrap: anywhere; color: var(--dias-ink); font-size: 1.02rem; }

.dias-current, .dias-notifications, .dias-shipping, .dias-timeline { margin: 24px 32px 0; }
.dias-current {
    padding: 21px 23px;
    border-left: 4px solid var(--dias-accent);
    border-radius: 0 10px 10px 0;
    background: #fff6f6;
}
.dias-current h3, .dias-notifications h3, .dias-shipping h3, .dias-timeline h3 { margin: 0 0 9px; color: var(--dias-ink); font-size: 1.12rem; }
.dias-current p { margin: 0 0 8px; color: #35383d; }
.dias-current span { color: var(--dias-muted); font-size: .85rem; }

.dias-notifications {
    padding: 20px 22px;
    border: 1px solid var(--dias-line);
    border-radius: 10px;
    background: var(--dias-soft);
}
.dias-notifications p { margin: 0 0 14px; color: var(--dias-muted); }
.dias-preference-form { margin: 0; }
.dias-preference-form button { min-height: 43px; padding: 8px 14px; }
.dias-notification-consent { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0 10px; color: #2d3035; font-weight: 600; }
.dias-notification-consent input { width: 20px; height: 20px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--dias-accent); }
.dias-privacy-link { margin: 0 0 14px !important; }
.dias-privacy-link a { color: #9f1722 !important; font-weight: 700; text-decoration: underline; }
.dias-notification-pending { padding: 13px 15px; border-left: 4px solid #b98900; border-radius: 0 8px 8px 0; background: #fff8df; color: #4d3a00 !important; }
.dias-shipping { padding: 18px 21px; border: 1px solid #bedde0; border-radius: 10px; background: #f2fbfc; }
.dias-shipping p { margin: 0; }
.dias-shipping p + p { margin-top: 9px; }
.dias-dhl-status { color: var(--dias-ink); }
.dias-dhl-time { color: var(--dias-muted); font-size: .85rem; }
.dias-dhl-link { display: inline-flex; padding: 9px 13px; border-radius: 8px; background: #ffcc00; color: #191b1f; font-weight: 800; text-decoration: none; }
.dias-dhl-link:hover { background: #eab900; color: #191b1f; }
.dias-timeline { padding-bottom: 32px; }

.dias-event {
    position: relative;
    display: grid;
    grid-template-columns: 24px 1fr;
    gap: 12px;
    padding: 2px 0 24px;
}
.dias-event::before { content: ""; position: absolute; top: 18px; bottom: -2px; left: 8px; width: 2px; background: var(--dias-line); }
.dias-event:last-child::before { display: none; }
.dias-event-dot { z-index: 1; width: 17px; height: 17px; margin-top: 3px; border: 4px solid #f6dadd; border-radius: 50%; background: var(--dias-accent); }
.dias-event strong { color: var(--dias-ink); font-size: 1rem; }
.dias-event span { display: block; margin-top: 2px; color: var(--dias-muted); font-size: .82rem; }
.dias-event p { margin: 7px 0 0; color: #404349; }

.dias-approval { margin: 22px 34px 0; padding: 24px; border: 1px solid #e1e3e6; border-radius: 14px; background: #fff; }
.dias-approval h3 { margin: 0 0 16px; color: var(--dias-ink); }
.dias-approval-item { padding: 18px; border: 1px solid #e1e3e6; border-left: 5px solid #b98900; border-radius: 10px; background: #fafafa; }
.dias-approval-item + .dias-approval-item { margin-top: 14px; }
.dias-approval-approved { border-left-color: #168347; }
.dias-approval-rejected { border-left-color: #b51f2a; }
.dias-approval-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.dias-approval-head strong { color: var(--dias-ink); font-size: 1.15rem; }
.dias-approval-head span { padding: 5px 9px; border-radius: 999px; background: #f1e6c3; color: #654d00; font-size: .82rem; font-weight: 800; }
.dias-approval-approved .dias-approval-head span { background: #dff2e7; color: #075c2d; }
.dias-approval-rejected .dias-approval-head span { background: #f8dfe1; color: #8f1720; }
.dias-approval-shipping, .dias-approval-time { color: var(--dias-muted); font-size: .9rem; }
.dias-approval-confirm { display: flex; align-items: flex-start; gap: 9px; margin: 16px 0; color: #25282d; font-weight: 600; }
.dias-approval-confirm input { width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; }
.dias-approval-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.dias-approval-actions button { min-height: 46px; padding: 10px 16px; border-radius: 9px; font-weight: 800; cursor: pointer; }
.dias-approve-button { border: 1px solid #168347; background: #168347; color: #fff; }
.dias-reject-button { border: 1px solid #b51f2a; background: #fff; color: #b51f2a; }

@media (max-width: 860px) {
    .dias-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .dias-info-grid > div, .dias-info-grid > div:first-child, .dias-info-grid > div:last-child { padding: 0; border: 0; }
}

@media (max-width: 620px) {
    .dias-portal { width: min(100% - 16px, 1180px); margin-top: 18px; }
    .dias-login-head, .dias-login-body, .dias-portal-header, .dias-info-grid { padding-left: 21px; padding-right: 21px; }
    .dias-portal-header { flex-direction: column; }
    .dias-info-grid { grid-template-columns: 1fr; }
    .dias-current, .dias-approval, .dias-notifications, .dias-shipping, .dias-timeline { margin-left: 21px; margin-right: 21px; }
    .dias-approval-head { align-items: flex-start; flex-direction: column; }
}

/* Schutz vor Farb- und Button-Überschreibungen durch das aktive WordPress-Theme. */
.dias-portal .dias-portal-card,
.dias-portal .dias-login-card {
    background: #ffffff !important;
    color: #191b1f !important;
}

.dias-portal .dias-login-head,
.dias-portal .dias-portal-header {
    background: linear-gradient(135deg, #17191d 0%, #292c31 100%) !important;
    color: #ffffff !important;
}

.dias-portal .dias-login-head h2,
.dias-portal .dias-portal-header h2,
.dias-portal .dias-login-head .dias-kicker,
.dias-portal .dias-portal-header .dias-kicker {
    color: #ffffff !important;
    opacity: 1 !important;
}

.dias-portal .dias-login-head .dias-kicker,
.dias-portal .dias-portal-header .dias-kicker {
    color: #f1b2b7 !important;
}

.dias-portal .dias-info-grid,
.dias-portal .dias-current,
.dias-portal .dias-approval,
.dias-portal .dias-notifications,
.dias-portal .dias-shipping,
.dias-portal .dias-timeline,
.dias-portal .dias-login-body {
    color: #191b1f !important;
}

.dias-portal .dias-current h3,
.dias-portal .dias-approval h3,
.dias-portal .dias-notifications h3,
.dias-portal .dias-shipping h3,
.dias-portal .dias-timeline h3,
.dias-portal .dias-event strong,
.dias-portal .dias-info-grid strong,
.dias-portal .dias-login-body label {
    color: #191b1f !important;
    opacity: 1 !important;
}

.dias-portal .dias-current h3,
.dias-portal .dias-approval h3,
.dias-portal .dias-notifications h3,
.dias-portal .dias-shipping h3,
.dias-portal .dias-timeline h3 {
    font-size: 1.18rem !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}

.dias-portal .dias-current p,
.dias-portal .dias-notifications p,
.dias-portal .dias-shipping p,
.dias-portal .dias-event p,
.dias-portal .dias-login-intro {
    color: #35383d !important;
    opacity: 1 !important;
}

.dias-portal .dias-current span,
.dias-portal .dias-event span,
.dias-portal .dias-info-grid span,
.dias-portal .dias-dhl-time {
    color: #5c6068 !important;
    opacity: 1 !important;
}

.dias-portal .dias-login-card button,
.dias-portal .dias-preference-form button {
    min-height: 46px !important;
    border: 1px solid #b51f2a !important;
    border-radius: 9px !important;
    background: #b51f2a !important;
    color: #ffffff !important;
    box-shadow: none !important;
    font-weight: 800 !important;
    opacity: 1 !important;
}

.dias-portal .dias-login-card button:hover,
.dias-portal .dias-preference-form button:hover {
    border-color: #8f1720 !important;
    background: #8f1720 !important;
    color: #ffffff !important;
}

.dias-portal .dias-status {
    border-color: #d6313d !important;
    background: #b51f2a !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

.dias-portal .dias-dhl-link {
    background: #ffcc00 !important;
    color: #191b1f !important;
}

.dias-portal .dias-approval-actions .dias-approve-button {
    border: 1px solid #168347 !important;
    background: #168347 !important;
    color: #ffffff !important;
}

.dias-portal .dias-approval-actions .dias-reject-button {
    border: 1px solid #b51f2a !important;
    background: #ffffff !important;
    color: #b51f2a !important;
}

/* Eingabefelder unabhängig von Dark-Mode- und Theme-Vorgaben gut lesbar halten. */
.dias-portal .dias-login-card input[type="text"],
.dias-portal .dias-login-card input[type="email"],
.dias-portal .dias-login-card input[type="search"] {
    border: 2px solid #747981 !important;
    background: #ffffff !important;
    color: #111317 !important;
    caret-color: #111317 !important;
    -webkit-text-fill-color: #111317 !important;
    opacity: 1 !important;
    color-scheme: light !important;
}

.dias-portal .dias-login-card input::placeholder {
    color: #686d75 !important;
    -webkit-text-fill-color: #686d75 !important;
    opacity: 1 !important;
}

.dias-portal .dias-login-card input:focus {
    border-color: #b51f2a !important;
    outline: 3px solid rgba(181, 31, 42, .22) !important;
    box-shadow: none !important;
}

.dias-portal .dias-login-help a {
    color: #9f1722 !important;
    text-decoration: underline !important;
    opacity: 1 !important;
}

/* Einwilligungstext gegen aggressive Dark-Mode-Regeln des Themes absichern. */
.dias-portal .dias-notifications {
    background: #f5f5f6 !important;
    color: #191b1f !important;
    opacity: 1 !important;
}

.dias-portal .dias-notifications .dias-notification-consent,
.dias-portal .dias-notifications .dias-notification-consent span {
    color: #191b1f !important;
    -webkit-text-fill-color: #191b1f !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
}

.dias-portal .dias-notifications .dias-notification-consent input[type="checkbox"] {
    border: 1px solid #5c6068 !important;
    background-color: #ffffff !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
}

.dias-portal .dias-notifications .dias-privacy-link,
.dias-portal .dias-notifications .dias-privacy-link a {
    color: #8f1720 !important;
    -webkit-text-fill-color: #8f1720 !important;
    opacity: 1 !important;
}

.dias-portal .dias-notifications .dias-notification-pending,
.dias-portal .dias-notifications .dias-notification-pending strong {
    color: #4d3a00 !important;
    -webkit-text-fill-color: #4d3a00 !important;
    opacity: 1 !important;
}