:root {
    --pm-font-family: "Segoe UI Variable", "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif;

    --pm-color-bg: #f3f5f7;
    --pm-color-surface: #ffffff;
    --pm-color-surface-soft: #f8fafc;
    --pm-color-surface-hover: #edf3f8;

    --pm-color-text: #1f2328;
    --pm-color-text-secondary: #5d6670;
    --pm-color-text-muted: #89929c;

    --pm-color-border: #dce2e8;
    --pm-color-border-soft: #e9edf1;

    --pm-color-primary: #0f6cbd;
    --pm-color-primary-hover: #115ea3;
    --pm-color-primary-pressed: #0c3b5e;
    --pm-color-primary-soft: #e8f3fd;
    --pm-color-primary-soft-hover: #d9ebfb;

    --pm-color-danger: #c42b1c;
    --pm-color-danger-soft: #fde8e7;
    --pm-color-warning: #986f0b;
    --pm-color-warning-soft: #fff3cd;
    --pm-color-success: #107c10;
    --pm-color-success-soft: #e0f4de;
    --pm-color-neutral-accent: #747d86;

    --pm-radius-xs: 4px;
    --pm-radius-sm: 6px;
    --pm-radius-md: 8px;
    --pm-radius-lg: 10px;

    --pm-shadow-xs: 0 1px 2px rgba(17, 24, 39, .035);
    --pm-shadow-sm: 0 3px 10px rgba(17, 24, 39, .05);
    --pm-shadow-md: 0 14px 36px rgba(17, 24, 39, .12);

    --pm-sidebar-width: 252px;
    --pm-header-height: 66px;
    --pm-sidebar-header-height: 66px;

    --pm-transition: 160ms ease;
}

* { box-sizing: border-box; }

html,
body {
    margin: 0;
    min-height: 100%;
    font-family: var(--pm-font-family);
    background: var(--pm-color-bg);
    color: var(--pm-color-text);
    -webkit-font-smoothing: antialiased;
}

body {
    min-width: 320px;
    font-size: 16px;
}

a { color: inherit; }

button,
input,
select,
textarea {
    font: inherit;
}

button {
    -webkit-tap-highlight-color: transparent;
}

.pm-button {
    min-height: 40px;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: var(--pm-radius-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: transparent;
    color: var(--pm-color-text);
    font-size: 14px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        background-color var(--pm-transition),
        border-color var(--pm-transition),
        color var(--pm-transition),
        box-shadow var(--pm-transition),
        transform var(--pm-transition);
}

.pm-button img {
    width: 16px;
    height: 16px;
}

.pm-button-primary {
    background: var(--pm-color-primary);
    color: #fff;
    box-shadow: 0 3px 10px rgba(15, 108, 189, .16);
}

.pm-button-primary:hover { background: var(--pm-color-primary-hover); }

.pm-button-primary:active {
    background: var(--pm-color-primary-pressed);
    transform: translateY(1px);
}

.pm-button-icon {
    width: 38px;
    min-width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    cursor: pointer;
}

.pm-button-icon:hover {
    background: rgba(15, 108, 189, .075);
}

.pm-button-icon img {
    width: 18px;
    height: 18px;
}

.pm-card {
    background: var(--pm-color-surface);
    border: 1px solid var(--pm-color-border);
    border-radius: var(--pm-radius-lg);
    box-shadow: var(--pm-shadow-xs);
}

.pm-status {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 650;
    white-space: nowrap;
}

.pm-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.pm-status-info { background: var(--pm-color-primary-soft); color: var(--pm-color-primary); }
.pm-status-warning { background: var(--pm-color-warning-soft); color: var(--pm-color-warning); }
.pm-status-danger { background: var(--pm-color-danger-soft); color: var(--pm-color-danger); }
.pm-status-success { background: var(--pm-color-success-soft); color: var(--pm-color-success); }

#blazor-error-ui {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    padding: 12px 20px;
    background: #fff4ce;
    border-top: 1px solid #f0c36d;
    color: #3b3a39;
}

#blazor-error-ui .dismiss {
    position: absolute;
    right: 14px;
    cursor: pointer;
}


/* p-Manager 0.1.4 – gemeinsame Grundseiten */
.base-page { width: 100%; }
.base-heading { margin-bottom: 22px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.base-eyebrow { display:block; margin-bottom:6px; color:var(--pm-color-primary); font-size:12px; font-weight:750; letter-spacing:.02em; }
.base-heading h1 { margin:0; font-size:clamp(27px,2vw,34px); font-weight:720; letter-spacing:-.035em; }
.base-heading p { margin:7px 0 0; color:var(--pm-color-text-secondary); font-size:14px; line-height:1.5; }
.base-panel { padding:20px; }
.base-panel h2 { margin:0 0 6px; font-size:16px; font-weight:720; }
.base-panel p { margin:0; color:var(--pm-color-text-secondary); font-size:13px; line-height:1.55; }
.project-selection-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,420px)); gap:16px; }
.project-selection-card { min-height:180px; padding:20px; border-radius:10px; text-align:left; cursor:pointer; transition:border-color var(--pm-transition), box-shadow var(--pm-transition), transform var(--pm-transition); }
.project-selection-card:hover { border-color:#c6d6e4; box-shadow:var(--pm-shadow-sm); transform:translateY(-1px); }
.project-selection-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.project-selection-card .project-customer { color:var(--pm-color-primary); font-size:12px; font-weight:750; }
.project-selection-card > strong { display:block; margin-top:22px; font-size:18px; font-weight:720; }
.project-selection-card > span { display:block; margin-top:6px; color:var(--pm-color-text-muted); font-size:12px; }
.project-selection-card-action { margin-top:22px; color:var(--pm-color-primary); font-size:12.5px; font-weight:700; }
@media (max-width:720px) { .project-selection-grid { grid-template-columns:1fr; } }


.settings-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.settings-grid-two { grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.settings-card { padding:20px; }
.settings-card-link { text-decoration:none; transition:border-color var(--pm-transition), box-shadow var(--pm-transition), transform var(--pm-transition); }
.settings-card-link:hover { border-color:#c6d6e4; box-shadow:var(--pm-shadow-sm); transform:translateY(-1px); }
.settings-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.settings-card-kicker { color:var(--pm-color-primary); font-size:12px; font-weight:750; letter-spacing:.02em; }
.settings-card h2 { margin:18px 0 8px; font-size:18px; font-weight:720; letter-spacing:-.02em; }
.settings-card p { margin:0; color:var(--pm-color-text-secondary); font-size:13px; line-height:1.6; }
.settings-card p + p { margin-top:8px; }
.support-form-grid { margin-top:18px; display:grid; gap:14px; }
.support-field label { display:block; margin-bottom:7px; color:#47505a; font-size:12px; font-weight:700; }
.support-field input,
.support-field textarea {
    width:100%;
    padding:12px 13px;
    border:1px solid #cfd7df;
    border-radius:8px;
    background:#fff;
    color:var(--pm-color-text);
    font-size:13px;
    resize:vertical;
}
.support-field input:focus,
.support-field textarea:focus {
    outline:0;
    border-color:var(--pm-color-primary);
    box-shadow:0 0 0 3px rgba(15,108,189,.10);
}
.support-note { margin:14px 0 16px; color:var(--pm-color-text-muted); font-size:11.5px; line-height:1.5; }
.pm-button:disabled,
.pm-button[disabled] { opacity:.55; cursor:not-allowed; box-shadow:none; }
.access-panel { border-color:#e4e7eb; background:#fbfcfd; }
@media (max-width:720px) {
    .settings-grid,
    .settings-grid-two { grid-template-columns:1fr; }
}

/* Fokus nur bei echter Tastatur-Navigation sichtbar; verhindert blaue Rahmen nach Seitenwechsel. */
:focus:not(:focus-visible) {
    outline: none !important;
}

h1[tabindex="-1"]:focus,
h1:focus {
    outline: none !important;
}

.settings-card-disabled {
    background: #fafbfc;
    opacity: .72;
}

.user-admin-layout {
    display: grid;
    grid-template-columns: minmax(300px, 430px) minmax(360px, 1fr);
    gap: 16px;
    align-items: start;
}

.user-create-form {
    margin-top: 18px;
    display: grid;
    gap: 16px;
}

.user-admin-input {
    width: 100%;
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid #cfd7df;
    border-radius: 8px;
    background: #fff;
    color: var(--pm-color-text);
    font-size: 13px;
}

.user-admin-input:focus {
    outline: 0;
    border-color: var(--pm-color-primary);
    box-shadow: 0 0 0 3px rgba(15, 108, 189, .10);
}

.validation-message {
    display: block;
    margin-top: 6px;
    color: var(--pm-color-danger);
    font-size: 11px;
}

.user-admin-message {
    padding: 10px 12px;
    border-radius: 7px;
    font-size: 12px;
    line-height: 1.45;
}

.user-admin-message.success {
    border: 1px solid #cfe8d1;
    background: #f1fbf1;
    color: #256b25;
}

.user-admin-message.error {
    border: 1px solid #f0bbb5;
    background: var(--pm-color-danger-soft);
    color: #9f2419;
}

.user-list {
    margin-top: 14px;
    border-top: 1px solid var(--pm-color-border-soft);
}

.user-list-row {
    min-height: 62px;
    padding: 11px 0;
    border-bottom: 1px solid var(--pm-color-border-soft);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.user-list-row > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.user-list-row strong {
    overflow: hidden;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-list-row > div > span {
    color: var(--pm-color-text-muted);
    font-size: 11px;
}

@media (max-width: 900px) {
    .user-admin-layout {
        grid-template-columns: 1fr;
    }
}


/* p-Manager 0.1.4 – Einstellungen, Projektgrundlage und Rollenmatrix */
.settings-section + .settings-section { margin-top: 34px; }
.settings-section-heading { margin-bottom: 14px; }
.settings-section-heading h2 { margin: 0; font-size: 16px; font-weight: 730; letter-spacing: -.015em; }
.settings-section-heading p { margin: 5px 0 0; color: var(--pm-color-text-muted); font-size: 12px; line-height: 1.45; }

.settings-breadcrumb { margin: -4px 0 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.settings-back-link { color: var(--pm-color-primary); font-size: 12px; font-weight: 700; text-decoration: none; }
.settings-back-link:hover { text-decoration: underline; }
.settings-breadcrumb-path { min-width: 0; display: flex; align-items: center; gap: 7px; color: var(--pm-color-text-muted); font-size: 11.5px; }
.settings-breadcrumb-path a { color: var(--pm-color-text-secondary); text-decoration: none; }
.settings-breadcrumb-path a:hover { color: var(--pm-color-primary); }
.settings-breadcrumb-path strong { overflow: hidden; color: var(--pm-color-text); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.settings-card-actions { margin-top: 18px; }
.settings-inline-link { color: var(--pm-color-primary); font-size: 12.5px; font-weight: 700; text-decoration: none; }
.settings-inline-link:hover { text-decoration: underline; }

.user-name-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.field-optional { color: var(--pm-color-text-muted); font-weight: 500; }
.field-help { margin-top: 7px; color: var(--pm-color-text-muted); font-size: 11px; }
.field-help a { color: var(--pm-color-primary); text-decoration: none; }
.field-help a:hover { text-decoration: underline; }
.password-field-header { margin-bottom: -9px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.password-field-header label { color: #47505a; font-size: 12px; font-weight: 700; }
.password-generate-button { padding: 3px 0; border: 0; background: transparent; color: var(--pm-color-primary); font-size: 11.5px; font-weight: 700; cursor: pointer; }
.password-generate-button:hover { text-decoration: underline; }
.password-field-no-label { margin-top: 0; }
.user-admin-message.info { border: 1px solid #d7e5f2; background: #f4f9fd; color: #536575; }
.user-admin-message.info a { color: var(--pm-color-primary); font-weight: 700; text-decoration: none; }

.project-form-card { max-width: 760px; padding: 22px; }
.project-form { display: grid; gap: 20px; }
.project-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.project-form-wide { grid-column: 1 / -1; }
.project-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 4px; }
.project-secondary-button { border-color: var(--pm-color-border); background: #fff; color: var(--pm-color-text-secondary); }
.project-secondary-button:hover { background: var(--pm-color-surface-hover); }

.assignment-list { margin-top: 16px; border-top: 1px solid var(--pm-color-border-soft); }
.assignment-row { min-height: 68px; padding: 11px 0; border-bottom: 1px solid var(--pm-color-border-soft); display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.assignment-user { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.assignment-user strong { font-size: 13px; font-weight: 700; }
.assignment-user span { overflow: hidden; color: var(--pm-color-text-muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }

.role-description-grid { margin-bottom: 16px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.role-description-card { padding: 16px; }
.role-description-card strong { font-size: 13px; font-weight: 750; }
.role-description-card p { margin: 7px 0 0; color: var(--pm-color-text-secondary); font-size: 11.5px; line-height: 1.5; }
.role-matrix-card { overflow: hidden; }
.role-matrix-scroll { overflow-x: auto; }
.role-matrix { width: 100%; border-collapse: collapse; font-size: 12px; }
.role-matrix th { padding: 12px 14px; border-bottom: 1px solid var(--pm-color-border); background: #f8fafc; color: var(--pm-color-text-secondary); font-size: 11px; font-weight: 750; text-align: left; white-space: nowrap; }
.role-matrix td { padding: 12px 14px; border-bottom: 1px solid var(--pm-color-border-soft); vertical-align: top; }
.role-matrix td:nth-child(n+3) { text-align: center; }
.role-matrix td strong { display: block; font-size: 12px; }
.role-matrix td span:not(.role-access) { display: block; margin-top: 4px; color: var(--pm-color-text-muted); font-size: 10.5px; line-height: 1.4; }
.role-access { min-width: 30px; display: inline-flex; justify-content: center; font-size: 11px; font-weight: 750; }
.role-access.yes { color: var(--pm-color-success); }
.role-access.no { color: #b1b7bd; }

@media (max-width: 1100px) {
    .role-description-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
    .settings-breadcrumb { align-items: flex-start; flex-direction: column; gap: 8px; }
    .settings-breadcrumb-path { max-width: 100%; }
    .user-name-grid,
    .project-form-grid { grid-template-columns: 1fr; }
    .project-form-wide { grid-column: auto; }
    .project-form-actions { align-items: stretch; flex-direction: column-reverse; }
    .project-form-actions .pm-button { width: 100%; }
    .assignment-row { align-items: flex-start; flex-direction: column; }
    .assignment-row .pm-button { width: 100%; }
    .role-description-grid { grid-template-columns: 1fr; }
}

/* p-Manager 0.1.5 – konsistente Einstellungsraster, Stammdaten und Tabellen */
.settings-grid-fixed {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.settings-grid-fixed > .settings-card,
.settings-grid-fixed > .settings-card-link {
    min-height: 156px;
    height: 100%;
}

.settings-page-heading {
    margin-top: 0;
}

.settings-breadcrumb-compact {
    margin: 0 0 14px;
    justify-content: flex-end;
}

.settings-breadcrumb-compact .settings-breadcrumb-path {
    margin-left: auto;
}

.role-access {
    min-width: 28px;
    align-items: center;
    font-size: 17px;
    line-height: 1;
}

.role-access.yes {
    color: var(--pm-color-success);
}

.role-access.no {
    color: #b3bac2;
    font-size: 18px;
    font-weight: 500;
}

.admin-table-card,
.admin-form-card {
    padding: 20px;
}

.admin-form-card {
    margin-top: 18px;
}

.admin-table-toolbar,
.admin-form-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.admin-table-toolbar h2,
.admin-form-heading h2 {
    margin: 7px 0 0;
    font-size: 18px;
    font-weight: 720;
    letter-spacing: -.02em;
}

.admin-table-filter {
    min-width: 310px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.admin-table-filter .user-admin-input {
    min-height: 38px;
}

.admin-table-scroll {
    margin-top: 16px;
    overflow-x: auto;
    border-top: 1px solid var(--pm-color-border-soft);
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.admin-table th {
    padding: 11px 12px;
    border-bottom: 1px solid var(--pm-color-border);
    background: #f8fafc;
    color: var(--pm-color-text-secondary);
    font-size: 10.5px;
    font-weight: 750;
    text-align: left;
    white-space: nowrap;
}

.admin-table td {
    padding: 12px;
    border-bottom: 1px solid var(--pm-color-border-soft);
    color: var(--pm-color-text-secondary);
    vertical-align: middle;
}

.admin-table tbody tr:hover {
    background: #fbfcfd;
}

.admin-empty-state {
    margin-top: 16px;
    padding: 22px 0 4px;
    border-top: 1px solid var(--pm-color-border-soft);
    color: var(--pm-color-text-muted);
    font-size: 12px;
}

.table-stack,
.entity-cell > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.table-stack strong,
.entity-cell strong {
    color: var(--pm-color-text);
    font-size: 12px;
    font-weight: 720;
}

.table-stack span,
.entity-cell span:not(.entity-logo) {
    color: var(--pm-color-text-muted);
    font-size: 10.5px;
}

.entity-cell {
    min-width: 210px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.entity-logo,
.project-card-logo,
.logo-upload-preview {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border: 1px solid var(--pm-color-border);
    border-radius: 9px;
    object-fit: cover;
    background: #fff;
}

.entity-logo-placeholder,
.project-card-logo-placeholder,
.logo-upload-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--pm-color-primary-soft);
    color: var(--pm-color-primary);
    font-size: 12px;
    font-weight: 800;
}

.admin-detail-form {
    margin-top: 18px;
    display: grid;
    gap: 18px;
}

.admin-form-grid {
    display: grid;
    gap: 15px;
}

.admin-form-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-span-2 {
    grid-column: span 2;
}

.admin-form-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 2px;
}

.logo-upload-row {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.logo-upload-row input[type="file"] {
    min-width: 0;
    max-width: 100%;
    color: var(--pm-color-text-secondary);
    font-size: 11px;
}

.project-selection-identity,
.project-settings-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.project-selection-card .project-card-logo {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
}

.project-form-card-wide {
    max-width: 920px;
}

.project-form-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-form-wide-2 {
    grid-column: span 2;
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (max-width: 1180px) {
    .settings-grid-fixed {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-form-grid-3,
    .project-form-grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .settings-grid-fixed {
        grid-template-columns: 1fr;
    }

    .settings-grid-fixed > .settings-card,
    .settings-grid-fixed > .settings-card-link {
        min-height: 0;
    }

    .settings-breadcrumb-compact {
        align-items: flex-start;
        margin-bottom: 12px;
    }

    .settings-breadcrumb-compact .settings-breadcrumb-path {
        margin-left: 0;
    }

    .admin-table-toolbar,
    .admin-form-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-table-filter {
        width: 100%;
        min-width: 0;
    }

    .admin-form-grid-3,
    .project-form-grid-3 {
        grid-template-columns: 1fr;
    }

    .admin-span-2,
    .project-form-wide-2 {
        grid-column: auto;
    }

    .admin-form-actions .pm-button {
        width: 100%;
    }
}

/* p-Manager 0.1.7 – Projektbearbeitung und UI-Verfeinerungen */
.settings-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.settings-inline-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--pm-color-primary);
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.settings-inline-button:hover {
    text-decoration: underline;
}

.project-active-toggle {
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid var(--pm-color-border);
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    color: var(--pm-color-text-secondary);
    font-size: 12px;
    cursor: pointer;
}

.project-active-toggle input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--pm-color-primary);
}

/* p-Manager 0.1.7 – UI-/UX-Verfeinerungen */
.pm-status-neutral {
    background: #eef1f4;
    color: #68717b;
}

.pm-button-secondary {
    border-color: var(--pm-color-border);
    background: #fff;
    color: var(--pm-color-text-secondary);
    box-shadow: none;
}

.pm-button-secondary:hover {
    border-color: #c8d1da;
    background: var(--pm-color-surface-hover);
    color: var(--pm-color-text);
}

.pm-button-compact {
    min-height: 34px;
    padding: 0 12px;
    font-size: 12px;
}

.settings-card-button-row,
.field-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.field-action-row {
    margin-top: 9px;
}

.settings-breadcrumb-compact {
    align-items: center;
    justify-content: space-between;
}

.settings-back-button {
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid var(--pm-color-border);
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    background: #fff;
    color: var(--pm-color-primary);
    font-size: 11.5px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: var(--pm-shadow-xs);
}

.settings-back-button:hover {
    border-color: #c8d1da;
    background: var(--pm-color-surface-hover);
}

.project-selection-heading {
    align-items: flex-end;
}

.project-selection-summary {
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid var(--pm-color-border);
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    color: var(--pm-color-text-muted);
    font-size: 11.5px;
    box-shadow: var(--pm-shadow-xs);
}

.project-selection-summary strong {
    color: var(--pm-color-text);
    font-weight: 750;
}

.summary-divider {
    width: 1px;
    height: 18px;
    background: var(--pm-color-border-soft);
}

.project-selection-toolbar {
    margin-bottom: 16px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.project-search-field {
    width: min(420px, 100%);
    min-height: 38px;
    padding: 0 11px;
    border: 1px solid var(--pm-color-border);
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 9px;
    background: #fff;
}

.project-search-field:focus-within {
    border-color: #bfcbd7;
    box-shadow: 0 0 0 2px rgba(15, 108, 189, .06);
}

.project-search-field img {
    width: 15px;
    height: 15px;
    opacity: .62;
}

.project-search-field input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--pm-color-text);
    font-size: 12.5px;
}

.project-search-field input::placeholder {
    color: var(--pm-color-text-muted);
}

.project-filter-pills {
    display: flex;
    align-items: center;
    gap: 6px;
}

.project-filter-pill {
    min-height: 34px;
    padding: 0 11px;
    border: 1px solid var(--pm-color-border);
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    color: var(--pm-color-text-secondary);
    font-size: 11.5px;
    font-weight: 650;
    cursor: pointer;
}

.project-filter-pill span {
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f4f7;
    color: var(--pm-color-text-muted);
    font-size: 10px;
}

.project-filter-pill:hover {
    background: var(--pm-color-surface-hover);
}

.project-filter-pill.active {
    border-color: #c9dff2;
    background: var(--pm-color-primary-soft);
    color: var(--pm-color-primary);
}

.project-filter-pill.active span {
    background: #fff;
    color: var(--pm-color-primary);
}

.project-selection-grid-enhanced {
    grid-template-columns: repeat(auto-fit, minmax(330px, 430px));
    align-items: stretch;
}

.project-selection-card-enhanced {
    min-height: 245px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    cursor: default;
}

.project-selection-card-enhanced:hover {
    transform: none;
}

.project-selection-customer-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.project-short-name {
    overflow: hidden;
    color: var(--pm-color-text-muted);
    font-size: 10.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.project-logo-frame {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    padding: 5px;
    border: 1px solid var(--pm-color-border);
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #fff;
}

.project-logo-frame-small {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    padding: 4px;
    border-radius: 9px;
}

.project-logo-frame .project-card-logo {
    width: 100%;
    height: 100%;
    flex-basis: auto;
    padding: 0;
    border: 0;
    border-radius: 6px;
    object-fit: contain;
    background: transparent;
}

.project-logo-frame .project-card-logo-placeholder {
    background: var(--pm-color-primary-soft);
}

.project-selection-main {
    margin-top: 20px;
    flex: 1;
}

.project-selection-main h2 {
    margin: 0;
    color: var(--pm-color-text);
    font-size: 19px;
    font-weight: 730;
    letter-spacing: -.02em;
}

.project-selection-meta {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.project-selection-meta span {
    min-width: 110px;
    padding: 8px 10px;
    border-radius: 7px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #f7f9fb;
    color: var(--pm-color-text-secondary);
    font-size: 11px;
}

.project-selection-meta strong {
    color: var(--pm-color-text-muted);
    font-size: 9.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.project-selection-actions {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid var(--pm-color-border-soft);
    display: flex;
    justify-content: flex-start;
}

.project-empty-filter {
    padding: 28px 22px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.project-empty-filter strong {
    font-size: 14px;
}

.project-empty-filter span {
    color: var(--pm-color-text-muted);
    font-size: 12px;
}

.project-settings-card {
    display: flex;
    flex-direction: column;
}

.project-settings-card .settings-card-actions {
    margin-top: auto;
    padding-top: 18px;
}

.entity-logo,
.project-card-logo,
.logo-upload-preview {
    object-fit: contain;
    padding: 4px;
}

.logo-upload-preview {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    border-radius: 10px;
}

.logo-upload-placeholder-empty {
    background: #f7f9fb;
}

.pm-switch-row {
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid var(--pm-color-border);
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    cursor: pointer;
}

.pm-switch-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pm-switch-track {
    position: relative;
    width: 38px;
    height: 22px;
    flex: 0 0 38px;
    border-radius: 999px;
    background: #c9cfd6;
    transition: background-color var(--pm-transition);
}

.pm-switch-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
    transition: transform var(--pm-transition);
}

.pm-switch-input:checked + .pm-switch-track {
    background: var(--pm-color-primary);
}

.pm-switch-input:checked + .pm-switch-track .pm-switch-thumb {
    transform: translateX(16px);
}

.pm-switch-copy {
    color: var(--pm-color-text-secondary);
    font-size: 12px;
    font-weight: 650;
}

.user-admin-prerequisite {
    margin-top: 18px;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.user-admin-prerequisite .user-admin-message {
    flex: 1 1 360px;
}

.password-field-header {
    margin-bottom: 7px;
}

.password-field-header label {
    margin: 0;
}

.profile-overview-grid {
    margin-bottom: 18px;
    display: grid;
    grid-template-columns: minmax(320px, 1.15fr) minmax(300px, .85fr);
    gap: 16px;
}

.profile-summary-card,
.profile-account-card,
.profile-edit-card {
    padding: 20px;
}

.profile-summary-card {
    display: flex;
    align-items: center;
    gap: 16px;
}

.profile-avatar-large {
    width: 62px;
    height: 62px;
    flex: 0 0 62px;
    border: 1px solid #c7dff3;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pm-color-primary-soft);
    color: var(--pm-color-primary);
    font-size: 18px;
    font-weight: 800;
}

.profile-summary-card h2,
.profile-account-card h2 {
    margin: 7px 0 4px;
    font-size: 18px;
    font-weight: 730;
}

.profile-summary-card p,
.profile-account-card p {
    margin: 0;
    color: var(--pm-color-text-secondary);
    font-size: 12px;
    line-height: 1.5;
}

.profile-summary-pills {
    margin-top: 11px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.profile-account-card .settings-card-button-row {
    margin-top: 16px;
}

.profile-edit-card .admin-detail-form {
    margin-top: 18px;
}

.general-setting-card {
    display: flex;
    flex-direction: column;
}

.general-setting-control {
    margin-top: auto;
    padding-top: 18px;
}

.general-setting-control > label,
.general-setting-control-grid label {
    display: block;
    margin-bottom: 6px;
    color: var(--pm-color-text-secondary);
    font-size: 11px;
    font-weight: 700;
}

.general-setting-control-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.general-setting-wide {
    grid-column: 1 / -1;
}

.general-setting-control .user-admin-input:disabled {
    background: #f7f9fb;
    color: #69737d;
    opacity: 1;
}

.settings-preparation-note {
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid var(--pm-color-border-soft);
    border-radius: 8px;
    background: rgba(255,255,255,.55);
    color: var(--pm-color-text-muted);
    font-size: 11.5px;
    line-height: 1.5;
}

@media (max-width: 900px) {
    .project-selection-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .project-search-field {
        width: 100%;
    }

    .project-filter-pills {
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .profile-overview-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .settings-breadcrumb-compact {
        flex-direction: row;
        align-items: center;
        gap: 10px;
    }

    .settings-breadcrumb-compact .settings-breadcrumb-path {
        margin-left: auto;
        justify-content: flex-end;
        overflow: hidden;
    }

    .settings-breadcrumb-path a,
    .settings-breadcrumb-path span {
        display: none;
    }

    .settings-breadcrumb-path strong {
        display: block;
    }

    .project-selection-heading {
        align-items: flex-start;
    }

    .project-selection-summary {
        display: none;
    }

    .project-selection-grid-enhanced {
        grid-template-columns: 1fr;
    }

    .project-selection-card-enhanced {
        min-height: 0;
    }

    .project-filter-pills {
        width: 100%;
    }

    .project-filter-pill {
        flex: 0 0 auto;
    }

    .project-selection-actions .pm-button {
        width: 100%;
    }

    .general-setting-control-grid {
        grid-template-columns: 1fr;
    }

    .general-setting-wide {
        grid-column: auto;
    }
}
