/* ============================================================================
   Petdata Editor — design layer over the Radzen "standard" theme.

   The palette comes from the printed care sheets themselves: the deep sea
   blue of the fish sheets (#00628D) is the working accent, the plum of the
   dog sheets (#6C2C83) is reserved for the brand mark. The recurring motif
   is the "spine": every printed sheet carries a colored edge band, and the
   UI repeats it as a short colored left edge on navigation, section cards
   and status stamps.
   ========================================================================== */

:root {
    /* Petdata tokens */
    --pd-sea: #00628d;
    --pd-sea-dark: #00506f;
    --pd-sea-deep: #0d2b3a;      /* sea blue almost at night — shadow ink */
    --pd-plum: #6c2c83;
    --pd-paper: #eef1f4;
    --pd-surface: #ffffff;
    --pd-ink: #1e2a32;
    --pd-muted: #5b6673;
    --pd-line: #dde3e8;

    /* status hues (print-stamp style chips) */
    --pd-status-edit: #5b6673;
    --pd-status-review: #b45309;
    --pd-status-reviewed: #0e7490;
    --pd-status-published: #1b7f4b;

    /* retheme Radzen */
    --rz-primary: var(--pd-sea);
    --rz-primary-light: #2b83ad;
    --rz-primary-lighter: rgba(0, 98, 141, 0.13);
    --rz-primary-dark: var(--pd-sea-dark);
    --rz-primary-darker: #00415a;
    --rz-secondary: var(--pd-plum);
    --rz-secondary-light: #8a4ba1;
    --rz-secondary-lighter: rgba(108, 44, 131, 0.13);
    --rz-secondary-dark: #5a2470;
    --rz-secondary-darker: #4b1e5d;

    --rz-body-background-color: var(--pd-paper);
    --rz-text-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --rz-text-color: var(--pd-ink);

    --rz-border-radius: 8px;
    --rz-button-border-radius: 7px;
    --rz-input-border-radius: 7px;
    --rz-card-border-radius: 10px;
    --rz-panel-border-radius: 10px;
    --rz-card-shadow: 0 1px 2px rgba(13, 43, 58, 0.06), 0 4px 14px rgba(13, 43, 58, 0.05);

    /* header */
    --rz-header-background-color: var(--pd-surface);
    --rz-header-shadow: inset 0 -1px 0 var(--pd-line);

    /* sidebar: paper-white like the sheets themselves, so the logo sits on its
       native ground; the active item carries the sea-blue spine */
    --rz-sidebar-width: 232px;
    --rz-sidebar-background-color: var(--pd-surface);
    --rz-sidebar-border-inline-end: 1px solid var(--pd-line);
    --rz-panel-menu-item-background-color: transparent;
    --rz-panel-menu-item-border: none;
    --rz-panel-menu-item-color: #46545f;
    --rz-panel-menu-item-hover-background-color: rgba(0, 98, 141, 0.06);
    --rz-panel-menu-item-hover-color: var(--pd-sea-dark);
    --rz-panel-menu-item-active-background-color: var(--rz-primary-lighter);
    --rz-panel-menu-item-active-color: var(--pd-sea-dark);
    --rz-panel-menu-item-active-indicator: var(--pd-sea);   /* the spine */
    --rz-panel-menu-item-2nd-level-background-color: transparent;
    --rz-panel-menu-item-2nd-level-hover-background-color: rgba(0, 98, 141, 0.06);
    --rz-panel-menu-item-2nd-level-active-background-color: var(--rz-primary-lighter);
    --rz-panel-menu-icon-color: #8aa0ad;
    --rz-panel-menu-font-weight: 500;
}

html, body {
    font-variant-numeric: tabular-nums;
}

/* ---------------------------------------------------------------------------
   Shell
   ------------------------------------------------------------------------- */

.pd-brand {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 64px;
    padding: 0 1.1rem;
    border-bottom: 1px solid var(--pd-line);
    margin-bottom: 0.5rem;
    text-decoration: none;
}

.pd-brand:hover { text-decoration: none; }

.pd-brand-logo {
    height: 32px;
    width: auto;
    object-fit: cover;
    object-position: left center;
    transition: width 0.18s ease;
}

.pd-nav-caption {
    padding: 0.9rem 1rem 0.3rem;
    font-size: 0.64rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #93a5b1;
    white-space: nowrap;
    overflow: hidden;
}

/* ---- collapsed icon rail ------------------------------------------------ */

.rz-sidebar.pd-nav-rail {
    --rz-sidebar-width: 64px;
    overflow-x: hidden;
}

/* the square "pet" tile is the left, height-tall part of the wordmark —
   cropping to a square turns it into the compact mark */
.pd-nav-rail .pd-brand {
    justify-content: center;
    padding: 0;
}

.pd-nav-rail .pd-brand-logo {
    width: 34px;
}

.pd-nav-rail .rz-navigation-item-text {
    display: none;
}

.pd-nav-rail .rz-navigation-item-link {
    justify-content: center;
}

.pd-nav-rail .rz-navigation-item-icon {
    margin-inline: 0;
}

/* captions become quiet dividers in the rail */
.pd-nav-rail .pd-nav-caption {
    padding: 0;
    margin: 0.65rem 1rem 0.65rem;
    border-top: 1px solid var(--pd-line);
}

.pd-nav-rail .pd-nav-caption span {
    display: none;
}

.pd-header-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--pd-muted);
}

.pd-user-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.25rem 0.7rem 0.25rem 0.3rem;
    border: 1px solid var(--pd-line);
    border-radius: 999px;
    color: var(--pd-ink);
    font-size: 0.82rem;
    font-weight: 550;
    text-decoration: none;
    transition: border-color 0.12s ease, background 0.12s ease;
}

.pd-user-chip:hover {
    border-color: var(--pd-sea);
    background: var(--rz-primary-lighter);
    text-decoration: none;
}

.pd-user-chip .pd-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--pd-sea);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 650;
    text-transform: uppercase;
}

/* ---------------------------------------------------------------------------
   Page scaffolding: title row, toolbar, section cards with spine
   ------------------------------------------------------------------------- */

.pd-page {
    padding: 1.4rem 1.6rem 3rem;
}

.pd-page-head {
    display: flex;
    align-items: baseline;
    gap: 0.9rem;
    flex-wrap: wrap;
    margin: 0 0 1.1rem;
}

.pd-page-title {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 680;
    letter-spacing: -0.015em;
    color: var(--pd-ink);
}

.pd-page-sub {
    color: var(--pd-muted);
    font-size: 0.85rem;
}

.pd-toolbar {
    display: flex;
    align-items: flex-end;
    gap: 0.8rem;
    flex-wrap: wrap;
    padding: 0.9rem 1rem;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: 12px;
    box-shadow: var(--rz-card-shadow);
    margin-bottom: 1rem;
}

.pd-toolbar .rz-form-field {
    background: transparent;
}

/* section card: white card with the sheet spine and an eyebrow title */
.pd-section {
    position: relative;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: 12px;
    box-shadow: var(--rz-card-shadow);
    padding: 1.1rem 1.25rem 1.25rem;
    margin-bottom: 1.1rem;
}

.pd-section::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 14px;
    bottom: 14px;
    width: 4px;
    border-radius: 0 3px 3px 0;
    background: var(--pd-sea);
    opacity: 0.85;
}

.pd-section > .pd-section-title {
    display: block;
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--pd-muted);
    margin: 0 0 0.9rem;
}

.pd-section.pd-section-plum::before { background: var(--pd-plum); }

/* ---------------------------------------------------------------------------
   Status stamps
   ------------------------------------------------------------------------- */

.pd-stamp {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.18rem 0.6rem 0.18rem 0.5rem;
    border-radius: 5px;
    font-size: 0.68rem;
    font-weight: 680;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    white-space: nowrap;
    border-left: 3px solid currentColor;
}

.pd-stamp-edit      { color: var(--pd-status-edit);      background: rgba(91, 102, 115, 0.10); }
.pd-stamp-review    { color: var(--pd-status-review);    background: rgba(180, 83, 9, 0.10); }
.pd-stamp-reviewed  { color: var(--pd-status-reviewed);  background: rgba(14, 116, 144, 0.10); }
.pd-stamp-published { color: var(--pd-status-published); background: rgba(27, 127, 75, 0.10); }
.pd-stamp-kandidat  { color: #7c3aed; background: rgba(124, 58, 237, 0.10); }

/* ---------------------------------------------------------------------------
   Data grid polish
   ------------------------------------------------------------------------- */

.pd-grid .rz-data-grid-data > table > thead th .rz-column-title {
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pd-muted);
}

.pd-grid .rz-data-grid-data tr.rz-data-row {
    transition: background 0.1s ease;
}

.pd-grid .rz-data-grid-data tr.rz-data-row:hover {
    background: var(--rz-primary-lighter);
}

/* The latin name is the identity an editor works from, so it leads every list, form and
   dialog; the German name follows as the secondary line. Pet ids are never shown. */
.pd-cell-latin-primary {
    font-weight: 600;
    font-style: italic;
    color: var(--pd-ink);
}

.pd-cell-name { color: var(--pd-muted); }

.pd-cell-state {
    font-size: 0.82rem;
    color: var(--pd-muted);
}

.pd-stamp-retracted {
    color: #9a3412;
    background: rgba(154, 52, 18, 0.10);
    margin-left: 0.4rem;
}

/* ---------------------------------------------------------------------------
   Editor: sticky action bar, text-block cards
   ------------------------------------------------------------------------- */

.pd-actionbar {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 0.9rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 1.1rem;
    background: color-mix(in srgb, var(--pd-surface) 88%, transparent);
    backdrop-filter: blur(8px);
    border: 1px solid var(--pd-line);
    border-radius: 12px;
    box-shadow: var(--rz-card-shadow);
}

.pd-actionbar h1 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 680;
    letter-spacing: -0.01em;
}

.pd-actionbar .pd-crumbs {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--pd-muted);
    font-size: 0.78rem;
    font-weight: 500;
    margin-bottom: 0.35rem;
}

.pd-crumb-sep { color: var(--pd-line); }

.pd-pet-latin {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 680;
    font-style: italic;
    letter-spacing: -0.01em;
}

.pd-pet-name {
    font-size: 0.95rem;
    color: var(--pd-muted);
}

.pd-pet-state {
    margin-top: 0.15rem;
    font-size: 0.76rem;
    color: var(--pd-muted);
}

/* ---------------------------------------------------------------------------
   Scope: which label and which pet type you are in

   The same species exists in every label, and acting in the wrong one is the
   mistake that costs the most — so the scope reads as one solid chip rather
   than two dropdown values you have to go looking for.
   ------------------------------------------------------------------------- */

.pd-scope {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.12rem 0.5rem;
    border-radius: 6px;
    background: var(--rz-primary-lighter);
    color: var(--pd-sea-dark);
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}

.pd-scope-lg {
    padding: 0.2rem 0.65rem;
    font-size: 0.82rem;
}

/* a factual note, not a warning: this label simply has no info sheets */
.pd-scope-muted {
    background: rgba(91, 102, 115, 0.10);
    color: var(--pd-muted);
}

.pd-scope-label { font-weight: 700; }
.pd-scope-sep { opacity: 0.5; }
.pd-scope-type { font-weight: 550; }

/* the label/pet-type picker leads the pet list instead of hiding in the toolbar */
.pd-scopebar {
    display: flex;
    align-items: flex-end;
    gap: 1.1rem;
    flex-wrap: wrap;
    padding: 0.9rem 1.1rem;
    margin-bottom: 1rem;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-left: 4px solid var(--pd-sea);
    border-radius: 12px;
    box-shadow: var(--rz-card-shadow);
}

.pd-scopebar-picker {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.pd-scopebar-info {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    padding-bottom: 0.55rem;
}

.pd-create-target {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
    font-size: 0.85rem;
    color: var(--pd-muted);
}

/* ---------------------------------------------------------------------------
   Publication chain
   ------------------------------------------------------------------------- */

.pd-section.pd-section-chain::before { background: var(--pd-status-reviewed); }

.pd-chain-row {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
    font-size: 0.86rem;
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--pd-line);
}

.pd-chain-row:last-child { border-bottom: none; }

.pd-diff-key {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.pd-ref-table {
    width: 100%;
    font-size: 0.85rem;
    border-collapse: collapse;
}

.pd-ref-table tr { border-bottom: 1px solid var(--rz-base-200); }

.pd-ref-field {
    color: var(--rz-text-secondary-color);
    padding: 2px 6px 2px 2px;
    white-space: nowrap;
    vertical-align: top;
}

.pd-ref-mine {
    color: var(--rz-text-disabled-color);
    font-style: italic;
}

.pd-ref-latin {
    font-weight: 650;
    font-style: italic;
}

.pd-ref-name {
    font-size: 0.85rem;
    color: var(--pd-muted);
}

/* ---------------------------------------------------------------------------
   Fact check
   ------------------------------------------------------------------------- */

.pd-fc { font-size: 0.85rem; }

.pd-fc-summary {
    padding: 0.6rem 0.8rem;
    margin-bottom: 0.8rem;
    background: var(--rz-primary-lighter);
    border-radius: 8px;
    line-height: 1.45;
}

.pd-fc-head {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    margin: 1rem 0 0.4rem;
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--pd-muted);
}

.pd-fc-count {
    letter-spacing: 0;
    text-transform: none;
    font-weight: 500;
}

.pd-fc-table {
    width: 100%;
    border-collapse: collapse;
}

.pd-fc-table th {
    text-align: left;
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pd-muted);
    padding: 0.3rem 0.5rem;
    border-bottom: 1px solid var(--pd-line);
}

.pd-fc-table td {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid var(--pd-line);
    vertical-align: top;
}

.pd-fc-name { font-weight: 600; white-space: nowrap; }
.pd-fc-current { color: var(--pd-muted); }
.pd-fc-value { font-weight: 550; }
.pd-fc-comment { color: var(--pd-muted); line-height: 1.4; }

/* the verdict rides on a left edge, like the status stamps: readable at a glance,
   still legible for anyone who cannot separate the hues */
.pd-fc-table tr.pd-fc-ok td:first-child   { box-shadow: inset 3px 0 0 var(--pd-status-published); }
.pd-fc-table tr.pd-fc-bad td:first-child  { box-shadow: inset 3px 0 0 #dc2626; }
.pd-fc-table tr.pd-fc-weak td:first-child { box-shadow: inset 3px 0 0 var(--pd-status-review); }
.pd-fc-table tr.pd-fc-bad { background: rgba(220, 38, 38, 0.05); }

.pd-fc-verdict {
    display: inline-block;
    margin-left: 0.4rem;
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pd-muted);
}

.pd-fc-conf {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    border-radius: 5px;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
}

.pd-fc-conf-high { color: var(--pd-status-published); background: rgba(27, 127, 75, 0.10); }
.pd-fc-conf-mid  { color: var(--pd-status-reviewed);  background: rgba(14, 116, 144, 0.10); }
.pd-fc-conf-low  { color: var(--pd-status-review);    background: rgba(180, 83, 9, 0.10); }

.pd-fc-blocks {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pd-fc-block {
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--pd-line);
    border-radius: 8px;
}

.pd-fc-block.pd-fc-bad { border-left: 3px solid #dc2626; }
.pd-fc-block.pd-fc-ok { border-left: 3px solid var(--pd-status-published); }
.pd-fc-block.pd-fc-weak { border-left: 3px solid var(--pd-status-review); }

.pd-fc-block-head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

.pd-fc-issues {
    margin: 0.3rem 0 0;
    padding-left: 1.1rem;
    color: var(--pd-ink);
    line-height: 1.45;
}

.pd-fc-warn {
    padding: 0.35rem 0.6rem;
    margin-bottom: 0.3rem;
    border-radius: 6px;
    background: rgba(180, 83, 9, 0.09);
    color: #92400e;
}

.pd-fc-open {
    padding: 0.35rem 0.6rem;
    margin-bottom: 0.3rem;
    border-radius: 6px;
    background: rgba(14, 116, 144, 0.08);
    color: #0e5566;
}

.pd-fc-sources {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
    font-size: 0.72rem;
}

.pd-fc-allsources {
    margin-top: 0.9rem;
    color: var(--pd-muted);
}

/* name-resolution chips (reference layer: COL/WFO/Species+) */
.pd-ref-chips {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
    align-items: center;
    font-size: 0.78rem;
}

.pd-ref-chip {
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.05);
    color: var(--pd-muted);
    white-space: nowrap;
}

.pd-ref-chip-ok {
    background: rgba(22, 128, 61, 0.10);
    color: #14532d;
}

.pd-ref-chip-warn {
    background: rgba(180, 120, 10, 0.12);
    color: #7a5a1e;
}

.pd-ref-chip-legal {
    background: rgba(153, 27, 27, 0.10);
    color: #7f1d1d;
    font-weight: 600;
}

/* citation of an uploaded reference document (no URL to link to) */
.pd-fc-doc {
    padding: 0 0.35rem;
    border-radius: 6px;
    background: rgba(120, 85, 20, 0.10);
    color: #7a5a1e;
    white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   Side panels
   ------------------------------------------------------------------------- */

.pd-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}

/* the header sits on white: the icon-only text button was nearly invisible there */
.pd-logout {
    color: var(--pd-sea-dark);
    border-color: var(--pd-line);
    font-weight: 600;
}

.pd-logout:hover {
    color: #fff;
    background: var(--pd-sea);
    border-color: var(--pd-sea);
}

.pd-block {
    border: 1px solid var(--pd-line);
    border-radius: 10px;
    padding: 0.8rem 0.9rem 0.9rem;
    background: var(--pd-surface);
    transition: border-color 0.12s ease;
}

.pd-block:focus-within {
    border-color: var(--pd-sea);
}

.pd-block-head {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-bottom: 0.55rem;
}

/* AI assistant panel: plum-tinted, clearly marked as generated content territory */
.pd-ai-panel {
    margin-top: 0.7rem;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(108, 44, 131, 0.35);
    border-left: 3px solid var(--pd-plum);
    border-radius: 10px;
    background: rgba(108, 44, 131, 0.04);
}

.pd-ai-panel .pd-ai-title {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pd-plum);
    margin-bottom: 0.6rem;
}

.pd-ai-result {
    border: 1px dashed rgba(108, 44, 131, 0.4);
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    background: var(--pd-surface);
    max-height: 260px;
    overflow: auto;
    font-size: 0.9rem;
}

/* busy indicator: spine-edged banner with three swimming dots, shown while
   a KI-Anfrage or a Download is running (the API reports no real progress,
   so there is deliberately no percentage) */
.pd-busy {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.9rem;
    background: var(--rz-primary-lighter);
    border-left: 3px solid var(--pd-sea);
    border-radius: 0 8px 8px 0;
    color: var(--pd-sea-dark);
    font-size: 0.9rem;
}

.pd-busy-dots {
    display: inline-flex;
    gap: 0.32rem;
    flex: none;
}

.pd-busy-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--pd-sea);
    animation: pd-busy-swim 1.2s infinite ease-in-out;
}

.pd-busy-dots span:nth-child(2) { animation-delay: 0.15s; }
.pd-busy-dots span:nth-child(3) { animation-delay: 0.3s; }

@keyframes pd-busy-swim {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
    30% { transform: translateY(-5px); opacity: 1; }
}

/* the reference pane sticks alongside while scrolling the editor */
.pd-refpane {
    position: sticky;
    top: 86px;
    max-height: calc(100vh - 100px);
    overflow: auto;
}

/* ---------------------------------------------------------------------------
   Login
   ------------------------------------------------------------------------- */

.pd-login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(1100px 500px at 85% -10%, rgba(0, 98, 141, 0.16), transparent 60%),
        radial-gradient(900px 460px at -10% 110%, rgba(108, 44, 131, 0.10), transparent 55%),
        var(--pd-paper);
    padding: 1rem;
}

.pd-login-card {
    width: 370px;
    background: var(--pd-surface);
    border: 1px solid var(--pd-line);
    border-radius: 14px;
    box-shadow: 0 2px 6px rgba(13, 43, 58, 0.07), 0 18px 48px rgba(13, 43, 58, 0.12);
    padding: 2.1rem 2.2rem 2.2rem;
}

.pd-login-card h1 {
    margin: 0.9rem 0 0.15rem;
    font-size: 1.25rem;
    font-weight: 680;
    letter-spacing: -0.01em;
    color: var(--pd-ink);
}

.pd-login-card .pd-login-sub {
    color: var(--pd-muted);
    font-size: 0.85rem;
    margin: 0 0 1.4rem;
}

.pd-login-card label {
    display: block;
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pd-muted);
    margin-bottom: 0.3rem;
}

.pd-login-card input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.6rem 0.75rem;
    font-size: 0.95rem;
    color: var(--pd-ink);
    border: 1px solid var(--pd-line);
    border-radius: 8px;
    background: var(--pd-surface);
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.pd-login-card input:focus {
    outline: none;
    border-color: var(--pd-sea);
    box-shadow: 0 0 0 3px rgba(0, 98, 141, 0.18);
}

.pd-login-card button {
    width: 100%;
    padding: 0.65rem;
    margin-top: 1.5rem;
    background: var(--pd-sea);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease;
}

.pd-login-card button:hover { background: var(--pd-sea-dark); }

.pd-login-error {
    color: #b3261e;
    background: rgba(179, 38, 30, 0.08);
    border: 1px solid rgba(179, 38, 30, 0.25);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    margin: 0 0 1rem;
}

/* ---------------------------------------------------------------------------
   Motion discipline
   ------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; }
}

/* ---------------------------------------------------------------------------
   Blazor plumbing (unchanged)
   ------------------------------------------------------------------------- */

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* pulsing dots while a source's upstream version lookup is still running */
.pd-loading-dots { display: inline-flex; gap: 5px; align-items: center; min-height: 2.2rem; }
.pd-loading-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--pd-sea);
    animation: pd-dot-pulse 1.2s infinite ease-in-out;
}
.pd-loading-dots span:nth-child(2) { animation-delay: 0.2s; }
.pd-loading-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes pd-dot-pulse {
    0%, 80%, 100% { opacity: 0.25; transform: scale(0.75); }
    40% { opacity: 1; transform: scale(1); }
}

/* inline Label × Tierart scope editing (ScopeSelect, Faktenquellen) */
.pd-scope-select { display: inline-flex; gap: 0.4rem; align-items: center; }
.pd-scope-list { display: flex; flex-direction: column; gap: 0.35rem; align-items: flex-start; }
.pd-scope-row { display: flex; gap: 0.35rem; align-items: center; }
.pd-scope-auto { color: var(--pd-muted); font-size: 0.8rem; font-style: italic; }
.pd-field-caption { font-size: 0.7rem; color: var(--pd-muted); margin-bottom: 0.25rem; }

/* deep-research output (pet creation, admin fact sources) */
.pd-research-log {
    padding: 0.5rem 0.7rem;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.04);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.75rem;
    color: var(--pd-muted);
    max-height: 140px;
    overflow-y: auto;
}

.pd-research-facts {
    font-size: 0.85rem;
    line-height: 1.45;
    max-height: 260px;
    overflow-y: auto;
}

.pd-research-facts > div { margin-bottom: 0.2rem; }

.pd-research-warn { color: #a15c00; }

.pd-upload {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* workflow history + merge dialog */
.pd-history-row { display: flex; gap: 0.6rem; align-items: baseline; font-size: 0.85rem; flex-wrap: wrap; }
.pd-history-date { color: var(--pd-muted); font-variant-numeric: tabular-nums; min-width: 128px; }
.pd-history-step { font-weight: 600; }
.pd-merge-table { border-collapse: collapse; width: 100%; }
.pd-merge-table th, .pd-merge-table td { border: 1px solid var(--pd-line); padding: 0.45rem 0.6rem; text-align: left; vertical-align: top; }
.pd-merge-table th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--pd-muted); }
.pd-merge-field { font-weight: 600; white-space: nowrap; }
.pd-merge-chosen { background: rgba(27, 127, 75, 0.08); }

/* Listenansicht: dense SharePoint-style grid */
.pd-liste .rz-data-grid-data > table > tbody > tr > td { padding: 0.22rem 0.5rem; font-size: 0.8rem; }
.pd-liste .rz-data-grid-data > table > thead th { padding: 0.3rem 0.5rem; }
.pd-liste .pd-stamp { font-size: 0.62rem; padding: 0.06rem 0.4rem; }

/* Column titles must never be ellipsized — a header the editor cannot read is a
   column they cannot find. The columns carry MinWidths sized for their titles;
   this keeps the title itself from being clipped a few pixels early by the
   sort-icon flexbox. */
.pd-liste .rz-data-grid-data > table > thead th .rz-column-title span {
    overflow: visible;
    text-overflow: clip;
}

/* Redaktion tab: derived metadata */
.pd-section-derived { background: #f6f8fa; }
.pd-derived-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0.55rem 1.2rem; font-size: 0.86rem; }
.pd-derived-label { display: block; font-size: 0.64rem; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pd-muted); }