/* Credential vault list — matches ev-public dashboard */

/* List grows with the page — no inner scroll box (was crushing many cards) */
.ev-dashboard #credentialsList {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
}

.ev-dashboard #credentialsList > .ev-cred-card.accordion-item {
    flex: 0 0 auto;
    flex-shrink: 0;
    margin-bottom: 0 !important;
}

/* Override legacy site.css accordion chrome on the dashboard */
.ev-dashboard #credentialsList .ev-cred-card .ev-cred-header.accordion-button {
    margin-bottom: 0 !important;
}

.ev-dashboard #credentialsList .ev-cred-card .accordion-body.ev-cred-body {
    background: var(--ev-bg, #0b0c0f) !important;
    border: none !important;
    border-top: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08)) !important;
    border-radius: 0 0 var(--ev-radius-lg, 8px) var(--ev-radius-lg, 8px) !important;
    margin-top: 0 !important;
    padding: 0.75rem 1rem 1rem !important;
}

.ev-dashboard #credentialsList .ev-cred-card .accordion-collapse {
    border: none !important;
}

.ev-dashboard #credentialsList .ev-cred-card .accordion-collapse.show {
    display: block !important;
    visibility: visible !important;
}

.ev-dashboard #credentialsList .ev-cred-card .accordion-body.ev-cred-body {
    overflow: visible;
}

.ev-dashboard #credentialsList .accordion {
    --bs-accordion-bg: transparent;
    --bs-accordion-border-color: transparent;
}

.ev-cred-card {
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius-lg, 8px);
    overflow: hidden;
    background: var(--ev-bg, #0b0c0f);
}

.ev-cred-card .accordion-header {
    border-radius: var(--ev-radius-lg, 8px);
    overflow: hidden;
}

.ev-cred-card .accordion-collapse {
    overflow: hidden;
}

.ev-cred-card .accordion-collapse.collapsing {
    overflow: hidden !important;
    transition: height 0.35s ease;
}

.ev-cred-card .accordion-item {
    background: transparent !important;
    border: none !important;
}

.ev-cred-header.accordion-button {
    background: var(--ev-surface, #14161b) !important;
    color: var(--ev-text, #e8eaed) !important;
    border: none !important;
    border-radius: var(--ev-radius-lg, 8px) !important;
    min-height: 3.5rem;
    padding: 0.875rem 1rem !important;
    box-shadow: none !important;
    gap: 0.75rem;
}

.ev-cred-header.accordion-button:not(.collapsed) {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    background: var(--ev-surface-hover, #1a1d23) !important;
    color: var(--ev-text, #e8eaed) !important;
}

.ev-cred-header.accordion-button::after {
    margin-left: auto !important;
    filter: brightness(0.7);
    flex-shrink: 0;
}

.ev-cred-header.accordion-button:focus {
    box-shadow: none !important;
    border-color: transparent !important;
}

.ev-cred-icon {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ev-radius, 6px);
    background: var(--ev-accent-muted, rgba(255, 255, 255, 0.06));
    color: var(--ev-text-muted, #8b919a);
    font-size: 0.9375rem;
}

.ev-cred-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    flex: 1;
}

.ev-cred-name {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--ev-text, #e8eaed);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.ev-cred-type {
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-cred-body {
    padding: 0.75rem 1rem 1rem;
    border-top: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    background: var(--ev-bg, #0b0c0f);
}

.ev-cred-fields {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ev-cred-field-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ev-text-muted, #8b919a);
    margin-bottom: 0.35rem;
    text-transform: capitalize;
}

.ev-cred-field-row {
    display: flex;
    align-items: stretch;
    gap: 0;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius, 6px);
    overflow: hidden;
    background: var(--ev-bg-elevated, #101216);
}

.ev-cred-field-row:focus-within {
    border-color: var(--ev-border-strong, rgba(255, 255, 255, 0.14));
}

.ev-cred-value {
    flex: 1;
    min-width: 0;
    border: none !important;
    background: transparent !important;
    color: var(--ev-text, #e8eaed) !important;
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    outline: none;
    box-shadow: none !important;
    cursor: text;
}

.ev-cred-field-actions {
    display: flex;
    align-items: stretch;
    flex-shrink: 0;
    border-left: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
}

.ev-cred-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--ev-text-muted, #8b919a);
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.ev-cred-action-btn:hover {
    background: var(--ev-surface-hover, #1a1d23);
    color: var(--ev-text, #e8eaed);
}

.ev-cred-action-btn.is-copied {
    color: #6bcf7f;
}

/* Live 2FA */
.ev-cred-otp {
    padding: 0.75rem;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius, 6px);
    background: var(--ev-surface, #14161b);
}

.ev-cred-otp-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ev-text-muted, #8b919a);
    margin-bottom: 0.5rem;
}

.ev-cred-otp-row {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius, 6px);
    overflow: hidden;
    background: var(--ev-bg, #0b0c0f);
}

.ev-cred-otp-value {
    flex: 1;
    border: none !important;
    background: transparent !important;
    color: var(--ev-text, #e8eaed) !important;
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-align: center;
    padding: 0.5rem;
}

.ev-cred-otp-progress {
    height: 2px;
    background: var(--ev-border, rgba(255, 255, 255, 0.08));
    margin-top: 0.5rem;
    border-radius: 1px;
    overflow: hidden;
}

.ev-cred-otp-progress .progress-bar {
    background-color: var(--ev-text-muted, #8b919a) !important;
}

.ev-cred-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
}

.ev-cred-edit {
    border: none;
    background: transparent;
    color: var(--ev-text-muted, #8b919a);
    font-size: 0.8125rem;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    border-radius: var(--ev-radius, 6px);
    transition: background-color 0.12s ease, color 0.12s ease;
}

.ev-cred-edit:hover {
    background: var(--ev-surface-hover, #1a1d23);
    color: var(--ev-text, #e8eaed);
}

.ev-cred-delete {
    border: none;
    background: transparent;
    color: var(--ev-danger, #c45c5c);
    font-size: 0.8125rem;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    border-radius: var(--ev-radius, 6px);
    transition: background-color 0.12s ease;
}

.ev-cred-delete:hover {
    background: rgba(196, 92, 92, 0.12);
}

.ev-cred-empty {
    padding: 2rem 1rem;
    text-align: center;
    font-size: 0.875rem;
    color: var(--ev-text-muted, #8b919a);
    border: 1px dashed var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius-lg, 8px);
}

/* New credential modal fields */
.ev-cred-form-row {
    margin-bottom: 0.75rem;
}

.ev-cred-form-row label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--ev-text-muted, #8b919a);
    margin-bottom: 0.35rem;
}

.ev-cred-form-row .form-control {
    width: 100%;
}

.ev-cred-form-row-inner {
    display: flex;
    gap: 0.5rem;
}

.ev-cred-form-row-inner .form-control {
    flex: 1;
}

/* —— New credential modal —— */
.ev-new-cred-modal .modal-header {
    align-items: flex-start;
    gap: 1rem;
}

.ev-new-cred-subtitle {
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    margin-top: 0.25rem;
}

.ev-new-cred-body {
    padding-top: 0.25rem;
    max-height: min(78vh, 40rem);
    overflow-y: auto;
}

.ev-new-cred-section {
    margin-bottom: 1.25rem;
}

.ev-new-cred-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.ev-new-cred-label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
    margin-bottom: 0.5rem;
}

.ev-new-cred-optional {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ev-text-muted, #8b919a);
}

.ev-new-cred-name-input {
    font-size: 1rem;
}

.ev-new-cred-fields {
    padding-top: 0.25rem;
    border-top: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    margin-top: 0.25rem;
    padding-top: 1rem;
}

.ev-new-cred-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.ev-new-cred-footer .btn-ev-primary:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.ev-add-field-btn {
    margin-top: 0.5rem;
}

/* Keeper-style type picker */
.ev-type-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

@media (min-width: 520px) {
    .ev-type-picker {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.ev-type-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.35rem;
    padding: 0.85rem 0.5rem;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius-lg, 8px);
    background: linear-gradient(180deg, var(--ev-surface, #14161b) 0%, var(--ev-bg, #0b0c0f) 100%);
    color: var(--ev-text, #e8eaed);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease, background 0.15s ease;
}

.ev-type-option:hover {
    border-color: var(--ev-border-strong, rgba(255, 255, 255, 0.18));
    transform: translateY(-1px);
}

.ev-type-option.is-selected {
    border-color: var(--ev-text, #e8eaed);
    box-shadow: 0 0 0 1px var(--ev-text, #e8eaed), 0 4px 20px rgba(0, 0, 0, 0.35);
    background: var(--ev-surface-hover, #1a1d23);
}

.ev-type-option:focus-visible {
    outline: 2px solid var(--ev-text-muted, #8b919a);
    outline-offset: 2px;
}

.ev-type-option-icon {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1rem;
    background: var(--ev-accent-muted, rgba(255, 255, 255, 0.06));
    color: var(--ev-text, #e8eaed);
    transition: transform 0.15s ease;
}

.ev-type-option.is-selected .ev-type-option-icon {
    transform: scale(1.06);
}

.ev-type-option[data-type="Login"] .ev-type-option-icon { color: #7eb8ff; background: rgba(126, 184, 255, 0.12); }
.ev-type-option[data-type="PaymentCard"] .ev-type-option-icon { color: #f0b35c; background: rgba(240, 179, 92, 0.12); }
.ev-type-option[data-type="Contact"] .ev-type-option-icon { color: #8fd4a8; background: rgba(143, 212, 168, 0.12); }
.ev-type-option[data-type="Database"] .ev-type-option-icon { color: #c9a0ff; background: rgba(201, 160, 255, 0.12); }
.ev-type-option[data-type="Server"] .ev-type-option-icon { color: #7ee0d6; background: rgba(126, 224, 214, 0.12); }
.ev-type-option[data-type="Software"] .ev-type-option-icon { color: #ff9ec8; background: rgba(255, 158, 200, 0.12); }
.ev-type-option[data-type="SecureNote"] .ev-type-option-icon { color: #e8d47a; background: rgba(232, 212, 122, 0.12); }
.ev-type-option[data-type="Other"] .ev-type-option-icon { color: #b0b6c0; background: rgba(176, 182, 192, 0.12); }

.ev-type-option-title {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
}

.ev-type-option-desc {
    font-size: 0.6875rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.2;
}

/* 2FA setup block */
.ev-2fa-block {
    margin-bottom: 1.25rem;
    padding: 1rem;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius-lg, 8px);
    background: var(--ev-surface, #14161b);
}

.ev-2fa-hint {
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    margin: 0 0 0.75rem;
}

.ev-2fa-tabs {
    display: flex;
    gap: 0.25rem;
    padding: 0.25rem;
    background: var(--ev-bg, #0b0c0f);
    border-radius: var(--ev-radius, 6px);
    margin-bottom: 0.75rem;
}

.ev-2fa-tab {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    border: none;
    border-radius: calc(var(--ev-radius, 6px) - 2px);
    background: transparent;
    color: var(--ev-text-muted, #8b919a);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.ev-2fa-tab:hover {
    color: var(--ev-text, #e8eaed);
}

.ev-2fa-tab.is-active {
    background: var(--ev-surface-hover, #1a1d23);
    color: var(--ev-text, #e8eaed);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.ev-2fa-panel {
    display: none;
}

.ev-2fa-panel.is-active {
    display: block;
}

.ev-2fa-camera-region {
    min-height: 220px;
    border-radius: var(--ev-radius, 6px);
    overflow: hidden;
    background: #000;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
}

.ev-2fa-camera-region video {
    border-radius: var(--ev-radius, 6px);
}

.ev-2fa-camera-actions {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.75rem;
    justify-content: center;
}

.ev-2fa-upload-zone,
.ev-2fa-paste-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 160px;
    padding: 1.25rem;
    border: 1px dashed var(--ev-border-strong, rgba(255, 255, 255, 0.14));
    border-radius: var(--ev-radius, 6px);
    background: var(--ev-bg, #0b0c0f);
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
    text-align: center;
}

.ev-2fa-upload-zone:hover,
.ev-2fa-paste-zone:hover,
.ev-2fa-upload-zone.is-dragover,
.ev-2fa-paste-zone.is-focused,
.ev-2fa-paste-zone.has-preview {
    border-color: var(--ev-text-muted, #8b919a);
    background: var(--ev-bg-elevated, #101216);
}

.ev-2fa-upload-icon,
.ev-2fa-paste-icon {
    font-size: 1.5rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-2fa-upload-title,
.ev-2fa-paste-title {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ev-text, #e8eaed);
}

.ev-2fa-upload-sub,
.ev-2fa-paste-sub {
    font-size: 0.75rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-2fa-scan-host {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.ev-2fa-status {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.5rem 0.65rem;
    border-radius: var(--ev-radius, 6px);
    font-size: 0.8125rem;
    background: var(--ev-bg, #0b0c0f);
    color: var(--ev-text-muted, #8b919a);
}

.ev-2fa-status[data-state="linked"] {
    color: #6bcf7f;
    background: rgba(107, 207, 127, 0.08);
}

.ev-2fa-status[data-state="scanning"] {
    color: var(--ev-text, #e8eaed);
}

.ev-2fa-status[data-state="error"] {
    color: #e8a0a0;
    background: rgba(196, 92, 92, 0.1);
}

.ev-2fa-manual {
    margin-top: 0.75rem;
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-2fa-manual summary {
    cursor: pointer;
    user-select: none;
}

.ev-2fa-manual summary:hover {
    color: var(--ev-text, #e8eaed);
}

/* —— Upload file & new folder modals —— */
.ev-upload-modal .modal-header,
.ev-folder-modal .modal-header {
    padding: 1.35rem 1.5rem 1.15rem;
    gap: 1.25rem;
}

.ev-upload-modal .modal-title,
.ev-folder-modal .modal-title {
    line-height: 1.35;
}

.ev-upload-modal .ev-new-cred-subtitle,
.ev-folder-modal .ev-new-cred-subtitle {
    margin-top: 0.5rem;
    line-height: 1.55;
    max-width: 26rem;
}

.ev-upload-modal .modal-footer,
.ev-folder-modal .modal-footer {
    padding: 1.1rem 1.5rem 1.35rem;
    gap: 0.75rem;
}

.ev-simple-modal-body {
    padding: 0.25rem 1.5rem 1.5rem !important;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ev-simple-modal-section {
    padding: 0;
}

.ev-simple-modal-section + .ev-simple-modal-section {
    margin-top: 1.5rem;
}

.ev-upload-modal .ev-simple-modal-section:first-child {
    margin-top: 0;
}

.ev-simple-modal-section-title {
    margin: 0 0 0.85rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
    letter-spacing: 0.01em;
}

.ev-modal-field {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.ev-modal-field-label {
    display: block;
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
    line-height: 1.35;
}

.ev-modal-field .form-control {
    margin: 0;
}

.ev-modal-field .ev-cred-form-row-inner {
    gap: 0.625rem;
}

.ev-modal-field-hint {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.55;
}

.ev-modal-legal {
    margin: 1.75rem 0 0;
    padding: 0;
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.55;
}

.ev-modal-legal a {
    color: var(--ev-text, #e8eaed);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ev-upload-modal #dropZone.ev-file-drop-zone,
.ev-file-drop-zone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 168px;
    padding: 1.75rem 1.5rem;
    border: 1px dashed var(--ev-border-strong, rgba(255, 255, 255, 0.14)) !important;
    border-radius: var(--ev-radius-lg, 8px);
    background: var(--ev-bg, #0b0c0f) !important;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
    text-align: center;
}

.ev-upload-modal #dropZone.ev-file-drop-zone:hover,
.ev-upload-modal #dropZone.ev-file-drop-zone.is-dragover,
.ev-file-drop-zone:hover,
.ev-file-drop-zone.is-dragover {
    border-color: var(--ev-text-muted, #8b919a) !important;
    background: var(--ev-bg-elevated, #101216) !important;
}

.ev-upload-modal #dropZone.ev-file-drop-zone.has-file,
.ev-file-drop-zone.has-file {
    min-height: 120px;
    opacity: 0.65;
}

.ev-upload-modal #dropZone.ev-file-drop-zone.has-file:hover,
.ev-file-drop-zone.has-file:hover {
    opacity: 1;
}

.ev-file-drop-icon {
    font-size: 1.75rem;
    color: var(--ev-text-muted, #8b919a);
    margin-bottom: 0.15rem;
}

.ev-file-drop-title {
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--ev-text, #e8eaed);
    line-height: 1.4;
}

.ev-file-drop-sub {
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.45;
    margin-top: 0.1rem;
}

.ev-file-chip {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.75rem 0.875rem;
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    border-radius: var(--ev-radius, 6px);
    background: var(--ev-surface, #14161b);
}

.ev-file-chip-icon {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ev-radius, 6px);
    background: rgba(126, 184, 255, 0.12);
    color: #7eb8ff;
    font-size: 1rem;
}

.ev-file-chip-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ev-file-chip-name {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ev-text, #e8eaed);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ev-file-chip-size {
    font-size: 0.75rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-file-chip-clear {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--ev-radius, 6px);
    background: transparent;
    color: var(--ev-text-muted, #8b919a);
    cursor: pointer;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.ev-file-chip-clear:hover {
    background: rgba(196, 92, 92, 0.12);
    color: #e8a0a0;
}

.ev-folder-modal-hero {
    display: flex;
    justify-content: center;
    padding: 0.75rem 0 0.25rem;
    margin-bottom: 0.25rem;
}

.ev-folder-modal .ev-simple-modal-section {
    margin-top: 1rem;
}

.ev-folder-modal-icon {
    width: 4rem;
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.5rem;
    color: #f0b35c;
    background: rgba(240, 179, 92, 0.12);
    border: 1px solid rgba(240, 179, 92, 0.2);
}

.ev-upload-modal .ev-new-cred-body,
.ev-folder-modal .ev-new-cred-body {
    max-height: none;
}

/* Keep dashboard generic paragraph spacing from crowding hints */
.ev-upload-modal .modal-body p.ev-modal-field-hint,
.ev-upload-modal .modal-body p.ev-modal-legal,
.ev-folder-modal .modal-body p.ev-modal-field-hint {
    margin-bottom: 0;
}

/* —— Upgrade / limit reached modal —— */
.ev-upgrade-modal {
    position: relative;
    border-color: rgba(240, 179, 92, 0.25);
    background: linear-gradient(165deg, var(--ev-surface, #14161b) 0%, var(--ev-bg, #0b0c0f) 55%);
    overflow: hidden;
}

.ev-upgrade-modal::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 50% at 50% -10%, rgba(240, 179, 92, 0.12), transparent 60%);
    pointer-events: none;
}

.ev-upgrade-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
}

.ev-upgrade-body {
    position: relative;
    padding: 2rem 1.75rem 1.25rem;
    text-align: center;
}

.ev-upgrade-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.ev-upgrade-icon {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.35rem;
    color: #f0b35c;
    background: rgba(240, 179, 92, 0.14);
    border: 1px solid rgba(240, 179, 92, 0.28);
    box-shadow: 0 0 32px rgba(240, 179, 92, 0.15);
}

.ev-upgrade-badge {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #f0b35c;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    border: 1px solid rgba(240, 179, 92, 0.35);
    background: rgba(240, 179, 92, 0.08);
}

.ev-upgrade-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--ev-text, #e8eaed);
    margin: 0 0 0.65rem;
    line-height: 1.25;
}

.ev-upgrade-lead {
    font-size: 0.9375rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.55;
    margin: 0 auto 1.5rem;
    max-width: 22rem;
}

.ev-upgrade-meter {
    text-align: left;
    margin-bottom: 1.5rem;
    padding: 0.875rem 1rem;
    border-radius: var(--ev-radius-lg, 8px);
    background: var(--ev-bg, #0b0c0f);
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
}

.ev-upgrade-meter-head {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    color: var(--ev-text-muted, #8b919a);
    margin-bottom: 0.5rem;
}

.ev-upgrade-meter-head span:last-child {
    font-weight: 600;
    color: #e8a0a0;
}

.ev-upgrade-meter-track {
    height: 6px;
    border-radius: 3px;
    background: var(--ev-border, rgba(255, 255, 255, 0.08));
    overflow: hidden;
}

.ev-upgrade-meter-fill {
    height: 100%;
    width: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #c45c5c, #e8a0a0);
    transition: width 0.35s ease;
}

.ev-upgrade-compare {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.ev-upgrade-plan {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    padding: 0.875rem 0.5rem;
    border-radius: var(--ev-radius-lg, 8px);
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    background: var(--ev-bg, #0b0c0f);
}

.ev-upgrade-plan--current {
    opacity: 0.75;
}

.ev-upgrade-plan--up {
    border-color: rgba(240, 179, 92, 0.35);
    background: rgba(240, 179, 92, 0.06);
}

.ev-upgrade-plan-tag {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #f0b35c;
}

.ev-upgrade-plan-tier {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
}

.ev-upgrade-plan-detail {
    font-size: 0.6875rem;
    color: var(--ev-text-muted, #8b919a);
    text-align: center;
    line-height: 1.35;
}

.ev-upgrade-arrow {
    display: flex;
    align-items: center;
    color: var(--ev-text-muted, #8b919a);
    font-size: 0.75rem;
    flex-shrink: 0;
}

.ev-upgrade-perks {
    text-align: left;
    padding: 0.875rem 1rem;
    border-radius: var(--ev-radius-lg, 8px);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
}

.ev-upgrade-perks li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: var(--ev-text, #e8eaed);
    padding: 0.35rem 0;
}

.ev-upgrade-perks li i {
    color: #6bcf7f;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.ev-upgrade-footer {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1.75rem 1.5rem !important;
}

.ev-upgrade-cta {
    text-decoration: none;
    white-space: nowrap;
}

@media (max-width: 400px) {
    .ev-upgrade-compare {
        flex-direction: column;
    }

    .ev-upgrade-arrow {
        transform: rotate(90deg);
        justify-content: center;
    }

    .ev-upgrade-footer {
        flex-direction: column-reverse;
    }

    .ev-upgrade-cta {
        width: 100%;
        text-align: center;
    }
}

/* —— Delete credential modal —— */
.ev-delete-cred-modal {
    position: relative;
    border-color: rgba(196, 92, 92, 0.22);
    background: linear-gradient(165deg, var(--ev-surface, #14161b) 0%, var(--ev-bg, #0b0c0f) 55%);
    overflow: hidden;
}

.ev-delete-cred-modal::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 45% at 50% -5%, rgba(196, 92, 92, 0.14), transparent 55%);
    pointer-events: none;
}

.ev-delete-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
}

.ev-delete-body {
    position: relative;
    padding: 2rem 1.75rem 1rem;
    text-align: center;
}

.ev-delete-hero {
    margin-bottom: 1.15rem;
}

.ev-delete-icon {
    width: 3.25rem;
    height: 3.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.2rem;
    color: #e8a0a0;
    background: rgba(196, 92, 92, 0.12);
    border: 1px solid rgba(196, 92, 92, 0.28);
}

.ev-delete-title {
    margin: 0 0 0.5rem;
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--ev-text, #e8eaed);
    line-height: 1.3;
}

.ev-delete-lead {
    margin: 0 auto 1.35rem;
    max-width: 20rem;
    font-size: 0.875rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.55;
}

.ev-delete-target {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
    padding: 0.75rem 0.875rem;
    border-radius: var(--ev-radius-lg, 8px);
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    background: var(--ev-bg, #0b0c0f);
}

.ev-delete-target-icon {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ev-radius, 6px);
    background: rgba(255, 255, 255, 0.06);
    color: var(--ev-text-muted, #8b919a);
    font-size: 0.9375rem;
}

.ev-delete-target-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ev-delete-target-name {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ev-delete-target-type {
    font-size: 0.75rem;
    color: var(--ev-text-muted, #8b919a);
}

.ev-delete-confirm-field {
    margin-top: 1.25rem;
    text-align: left;
}

.ev-delete-confirm-label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--ev-text-muted, #8b919a);
}

.ev-delete-confirm-word {
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
}

.ev-delete-confirm-hint {
    margin: 0.4rem 0 0;
    font-size: 0.75rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.45;
}

.ev-delete-footer {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1.75rem 1.5rem !important;
}

.ev-delete-confirm-btn {
    border: none;
    border-radius: var(--ev-radius, 6px);
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #fff;
    background: #a84848;
    cursor: pointer;
    transition: background-color 0.15s ease, transform 0.12s ease;
}

.ev-delete-confirm-btn:hover:not(:disabled) {
    background: #c45c5c;
}

.ev-delete-confirm-btn:active:not(:disabled) {
    transform: scale(0.98);
}

.ev-delete-confirm-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* —— Share file modal —— */
.ev-share-modal {
    position: relative;
    border-color: rgba(126, 184, 255, 0.28);
    background: linear-gradient(165deg, var(--ev-surface, #14161b) 0%, var(--ev-bg, #0b0c0f) 55%);
    overflow: hidden;
}

.ev-share-modal::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 50% at 50% -10%, rgba(126, 184, 255, 0.14), transparent 60%);
    pointer-events: none;
}

.ev-share-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 2;
}

.ev-share-body {
    position: relative;
    padding: 2rem 1.75rem 1.25rem;
    text-align: center;
}

.ev-share-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.ev-share-icon {
    width: 3.5rem;
    height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.35rem;
    color: #9ec5ff;
    background: rgba(126, 184, 255, 0.14);
    border: 1px solid rgba(126, 184, 255, 0.28);
    box-shadow: 0 0 32px rgba(126, 184, 255, 0.15);
}

.ev-share-badge {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ec5ff;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    border: 1px solid rgba(126, 184, 255, 0.35);
    background: rgba(126, 184, 255, 0.08);
}

.ev-share-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--ev-text, #e8eaed);
    margin: 0 0 0.65rem;
    line-height: 1.25;
}

.ev-share-lead {
    font-size: 0.9375rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.55;
    margin: 0 auto 1.35rem;
    max-width: 22rem;
}

.ev-share-target {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
    padding: 0.75rem 0.875rem;
    margin-bottom: 1.25rem;
    border-radius: var(--ev-radius-lg, 8px);
    border: 1px solid var(--ev-border, rgba(255, 255, 255, 0.08));
    background: var(--ev-bg, #0b0c0f);
}

.ev-share-target-icon {
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ev-radius, 6px);
    background: rgba(126, 184, 255, 0.1);
    border: 1px solid rgba(126, 184, 255, 0.18);
    color: #9ec5ff;
    font-size: 0.95rem;
}

.ev-share-target-meta {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.ev-share-target-name {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ev-share-target-type {
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ev-text-subtle, #5c6370);
}

.ev-share-link-field {
    text-align: left;
    margin-bottom: 1rem;
}

.ev-share-link-label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ev-text, #e8eaed);
}

.ev-share-link-copy {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
}

.ev-share-link-input {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a) !important;
    background: var(--ev-bg, #0b0c0f) !important;
    border: 1px solid var(--ev-border-strong, rgba(255, 255, 255, 0.14)) !important;
    border-radius: var(--ev-radius, 6px) !important;
}

.ev-share-link-input:focus {
    border-color: rgba(126, 184, 255, 0.45) !important;
    box-shadow: 0 0 0 1px rgba(126, 184, 255, 0.2) !important;
}

.ev-share-copy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    flex: 0 0 auto;
    padding: 0.5rem 0.875rem;
    border: 1px solid rgba(126, 184, 255, 0.35);
    border-radius: var(--ev-radius, 6px);
    background: rgba(126, 184, 255, 0.1);
    color: #c5dcff;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.12s ease;
}

.ev-share-copy-btn:hover {
    background: rgba(126, 184, 255, 0.18);
    border-color: rgba(126, 184, 255, 0.5);
    color: #e8f1ff;
}

.ev-share-copy-btn.is-copied {
    background: rgba(92, 196, 140, 0.14);
    border-color: rgba(92, 196, 140, 0.4);
    color: #b8e8cc;
}

.ev-share-copy-feedback {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: #9ed4b4;
}

.ev-share-reminder {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    text-align: left;
    padding: 0.875rem 1rem;
    border-radius: var(--ev-radius-lg, 8px);
    border: 1px solid rgba(126, 184, 255, 0.16);
    background: rgba(126, 184, 255, 0.05);
}

.ev-share-reminder-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: var(--ev-radius, 6px);
    background: rgba(126, 184, 255, 0.1);
    color: #9ec5ff;
    font-size: 0.8rem;
}

.ev-share-reminder p {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--ev-text-muted, #8b919a);
    line-height: 1.5;
}

.ev-share-footer {
    justify-content: center;
    padding: 0 1.75rem 1.5rem;
}

.ev-share-done-btn {
    min-width: 8rem;
}

@media (max-width: 400px) {
    .ev-share-link-copy {
        flex-direction: column;
    }

    .ev-share-copy-btn,
    .ev-share-done-btn {
        width: 100%;
    }

    .ev-delete-footer {
        flex-direction: column-reverse;
    }

    .ev-delete-confirm-btn {
        width: 100%;
    }
}
