/* Customer card diagnostics stay available by route/code, but are not part of the operational card UI. */
.api-customer-readonly,
.api-customer-mapping-link {
    display: none !important;
}

/* Global browser-history Back belongs in the shell top actions, not inside the scrollable
   workspace-tab rail. The old global save slot stays hidden; section-level save actions
   remain inside their own editors. */
.workspace-save-button {
    display: none !important;
}

.shell-back-button {
    flex: 0 0 36px !important;
    font-size:var(--nw-font-title) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Keep the open-tab rail scrollable when many tabs exist, but do not show a permanent
   browser-like horizontal scrollbar. Leave a small visual breath before page content. */
.workspace-tabs {
    margin-bottom: var(--nw-space-2) !important;
    scrollbar-width: none !important;
}

.workspace-tabs::-webkit-scrollbar {
    display: none !important;
}

.workspace-tab-tools:empty {
    display: none !important;
}

/* The browser-history Back control supersedes the customer-only “← Πελάτες” link. */
.customer-header .back-link {
    display: none !important;
}

/* Desktop customer header: identity + phone/email stay together; appointment state and
   notes use the free action rail on the right side of the customer tabs. */
@media (min-width: 1200px) {
    .customer-header:not(.nw-record-info) {
        position: relative !important;
        overflow: visible !important;
    }

    .header-title-row {
        display: flex !important;
        align-items: center !important;
        min-height: 32px !important;
        padding-right: 0 !important;
    }

    .customer-commands {
        display: flex !important;
        align-items: center !important;
        gap: var(--nw-space-2) !important;
        flex-wrap: nowrap !important;
    }

    .customer-commands > .contact-command,
    .customer-commands > .email-command {
        position: static !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        transform: none !important;
        z-index: auto !important;
    }

    .customer-commands > .contact-command:first-of-type {
        min-width: 130px !important;
    }

    .customer-commands > .email-command {
        min-width: 200px !important;
    }

    .customer-commands > .appointment-command,
    .customer-commands > .notes-command {
        position: absolute !important;
        top: calc(100% + 9px) !important;
        z-index: 35 !important;
    }

    .customer-commands > .appointment-command {
        right: 112px !important;
    }

    .customer-commands > .notes-command {
        right: 0 !important;
    }

    .customer-main > .tabs:not(.nw-record-nav--customer) {
        box-sizing: border-box !important;
        min-height: 32px !important;
        padding-right: 228px !important;
    }
}

.summary-card > .summary-heading,
.customer-proclamations-card > .proclamation-history-head {
    display: none !important;
}

/* Qualification save belongs on the same action row as the qualification categories. */
.qualifications-card {
    position: relative !important;
}

.qualifications-card > .section-head > h3 {
    display: none !important;
}

@media (min-width: 1000px) {
    .qualifications-card > .section-head {
        position: absolute !important;
        top: 12px !important;
        right: 12px !important;
        z-index: 6 !important;
        margin: 0 !important;
    }

    .qualifications-card > .qualification-tabs {
        box-sizing: border-box !important;
        min-height: 34px !important;
        padding-right: 185px !important;
    }
}

@media (max-width: 999px) {
    .qualifications-card > .section-head {
        justify-content: flex-end !important;
    }
}

/* Customer proclamation filters: label and selected value share one compact field. */
.customer-applications-toolbar > label {
    position: relative !important;
    display: block !important;
}

.customer-applications-toolbar > label > span {
    position: absolute !important;
    top: 50% !important;
    left: 10px !important;
    z-index: 2 !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
    color: var(--nw-ui-text-muted) !important;
    font-size:var(--nw-font-xs) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    pointer-events: none !important;
}

.customer-applications-toolbar > label > select {
    width: 100% !important;
    padding-left: 82px !important;
}

/* Keep useful section controls/counters, remove explanatory copy that only repeats the
   active tab or internal source-of-truth implementation. */
.customer-email-head p {
    display: none !important;
}

.customer-transactions-card > .transactions-heading > div:first-child {
    display: none !important;
}

.customer-transactions-card > .transactions-heading {
    justify-content: flex-end !important;
}

.customer-transactions-card > .transactions-heading:has(> div:first-child:last-child) {
    display: none !important;
}

.communication-card > .communication-heading > div:first-child {
    display: none !important;
}

.communication-card > .communication-heading {
    justify-content: flex-end !important;
}

@media (max-width: 1199px) {
    .customer-commands > .appointment-command,
    .customer-commands > .notes-command,
    .customer-commands > .contact-command,
    .customer-commands > .email-command {
        position: static !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        transform: none !important;
    }

    .customer-main > .tabs:not(.nw-record-nav--customer) {
        padding-right: 0 !important;
    }
}

/* Final operational polish: use the real tab label once, make Back match the topbar
   action sizing/brand treatment, and keep appointment details inside the viewport. */
.customer-main > .tabs:not(.nw-record-nav--customer) > button:nth-child(4) {
    font-size:var(--nw-font-sm) !important;
}

.customer-main > .tabs:not(.nw-record-nav--customer) > button:nth-child(4)::after {
    content: none !important;
}

.shell-back-button {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    border: 1px solid var(--nw-ui-accent) !important;
    border-radius: var(--nw-radius-lg) !important;
    background: var(--nw-ui-accent) !important;
    color: var(--nw-ui-on-accent) !important;
}

.shell-back-button:hover {
    border-color: var(--nw-ui-accent) !important;
    background: var(--nw-ui-accent) !important;
    color: var(--nw-ui-text-strong) !important;
}

@media (min-width: 1200px) {
    .customer-commands > .appointment-command .appointment-popover {
        left: auto !important;
        right: 0 !important;
        box-sizing: border-box !important;
        max-width: calc(100vw - 32px) !important;
    }
}

/* Identity documents are one compact action group: upload and preview belong side by side,
   while file state/removal feedback sits on the next row instead of forming a vertical stack. */
.identity-file-control {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: var(--nw-space-2) !important;
}

.identity-upload-button,
.identity-document-button {
    box-sizing: border-box !important;
    min-width: 104px !important;
    min-height: 31px !important;
    height: 31px !important;
    margin: 0 !important;
    padding: 0 var(--nw-space-3) !important;
    justify-content: center !important;
}

.identity-file-control > .education-file-delete {
    flex: 0 1 auto !important;
    min-height: 28px !important;
    margin: 0 !important;
    padding: 0 var(--nw-space-2) !important;
    border-radius: var(--nw-radius-md) !important;
}

.identity-file-control > small,
.identity-file-control > .identity-upload-status {
    flex: 1 0 100% !important;
    margin-top: var(--nw-space-0) !important;
}

/* The same status element carries both success and backend rejection text today; keep it
   neutral/attention-colored so a failed delete is never presented as a green success. */
.identity-upload-status {
    color: var(--nw-ui-warn-text-soft) !important;
}

/* Give previews a predictable work area. Image links are wrapped by ExternalCustomerDocumentLink
   in a fit-to-window document; PDFs and other browser-supported files keep using the iframe. */
.document-preview-popup {
    width: min(1180px, 94vw) !important;
    height: min(820px, 90vh) !important;
}

.document-preview-popup iframe {
    display: block !important;
    min-width: 0 !important;
    min-height: 0 !important;
    background: var(--nw-ui-surface-inset) !important;
}

@media (max-width: 700px) {
    .identity-upload-button,
    .identity-document-button {
        min-width: 0 !important;
        flex: 1 1 calc(50% - 3px) !important;
    }

    .document-preview-popup {
        width: 96vw !important;
        height: 88vh !important;
    }
}


/* Only visible when the customer has at least one completed, closed and unpaid application. */
.customer-debt-alert-button {
    border: 1px solid #ef4444 !important;
    border-radius: var(--nw-radius-md) !important;
    background: #b91c1c !important;
    color: var(--nw-ui-on-accent) !important;
    padding: var(--nw-space-2) var(--nw-space-3) !important;
    font-size:var(--nw-font-sm) !important;
    font-weight: 900 !important;
    letter-spacing: .02em !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

.customer-debt-alert-button:hover {
    background: #dc2626 !important;
    border-color: #f87171 !important;
}

@media (max-width: 1199px) {
    .customer-debt-alert-button {
        width: 100% !important;
    }
}


/* One customer communication area: Email is the default view, while legacy/system
   messages remain available as a secondary mode instead of a separate top-level tab. */
.customer-communication-workspace {
    display: grid !important;
    gap: var(--nw-space-3) !important;
}

.customer-communication-mode-tabs {
    display: flex !important;
    align-items: center !important;
    gap: var(--nw-space-2) !important;
    min-height: 34px !important;
    padding: 0 0 var(--nw-space-2) !important;
    border-bottom: 1px solid var(--nw-ui-border) !important;
}

.customer-communication-mode-tabs > button {
    position: relative !important;
    min-height: 30px !important;
    padding: 0 var(--nw-space-3) !important;
    border: 1px solid var(--nw-ui-border-strong) !important;
    border-radius: var(--nw-radius-md) !important;
    background: var(--nw-ui-surface) !important;
    color: var(--nw-ui-text-soft) !important;
    font: inherit !important;
    font-size:var(--nw-font-sm) !important;
    font-weight: 800 !important;
    cursor: pointer !important;
}

.customer-communication-mode-tabs > button.active {
    border-color: var(--nw-ui-accent) !important;
    background: var(--nw-ui-accent) !important;
    color: var(--nw-ui-on-accent) !important;
}

.customer-communication-mode-tabs .customer-email-tab-unread {
    margin-left: var(--nw-space-2) !important;
}


/* Customer document controls: one technical frame, one line on desktop.
   The file name is informational; preview/download/remove are explicit actions. */
.identity-document-field-wide {
    grid-column: 1 / -1 !important;
}

.identity-document-frame {
    display: grid !important;
    grid-template-columns: minmax(260px, 1fr) auto !important;
    align-items: center !important;
    gap: var(--nw-space-2) var(--nw-space-3) !important;
    min-height: 46px !important;
    padding: var(--nw-space-2) var(--nw-space-2) !important;
    border: 1px solid var(--nw-ui-border-strong) !important;
    border-radius: var(--nw-radius-md) !important;
    background: var(--nw-ui-surface-inset) !important;
}

.identity-file-name {
    min-width: 0 !important;
    overflow: hidden !important;
    color: var(--nw-ui-text) !important;
    font-size:var(--nw-font-sm) !important;
    font-weight: 800 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.identity-file-name.empty {
    color: var(--nw-ui-text-faint) !important;
    font-weight: 600 !important;
}

.identity-document-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--nw-space-1) !important;
    flex-wrap: nowrap !important;
}

.identity-document-frame .identity-upload-button,
.identity-document-frame .identity-document-button,
.identity-download-button,
.identity-document-frame .education-file-delete {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    height: 29px !important;
    min-height: 29px !important;
    margin: 0 !important;
    padding: 0 var(--nw-space-2) !important;
    border-radius: var(--nw-radius-md) !important;
    white-space: nowrap !important;
    font-size:var(--nw-font-xs) !important;
    font-weight: 800 !important;
}

.identity-download-button,
.file-download-action,
.document-preview-download {
    border: 1px solid var(--nw-ui-accent) !important;
    background: var(--nw-ui-accent) !important;
    color: var(--nw-ui-on-accent) !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

.identity-download-button:hover,
.file-download-action:hover,
.document-preview-download:hover {
    border-color: var(--nw-ui-accent) !important;
    background: var(--nw-ui-accent) !important;
    color: var(--nw-ui-text-strong) !important;
}

.identity-document-frame > .identity-upload-status {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
    padding-top: var(--nw-space-0) !important;
}

.file-download-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 54px !important;
    min-height: 27px !important;
    padding: 0 var(--nw-space-2) !important;
    border-radius: var(--nw-radius-md) !important;
    font-size:var(--nw-font-xs) !important;
    font-weight: 800 !important;
}

.education-file-actions .file-download-action {
    flex: 0 0 auto !important;
}

.qualification-summary-file > .file-download-action {
    align-self: center !important;
}

.document-preview-download {
    height: 30px !important;
    padding: 0 var(--nw-space-3) !important;
    border-radius: var(--nw-radius-md) !important;
    font-size:var(--nw-font-sm) !important;
    font-weight: 800 !important;
}

.summary-identity-actions {
    display: flex !important;
    align-items: center !important;
    gap: var(--nw-space-1) !important;
    flex-wrap: nowrap !important;
}

.summary-identity-actions .identity-document-button,
.summary-identity-actions .identity-download-button {
    width: auto !important;
    min-width: 0 !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 var(--nw-space-2) !important;
    font-size:var(--nw-font-xs) !important;
}

@media (max-width: 900px) {
    .identity-document-frame {
        grid-template-columns: 1fr !important;
    }

    .identity-document-actions {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}


.copy-confirmation.download-error {
    border: 1px solid var(--nw-ui-danger-border) !important;
    background: var(--nw-ui-danger-bg) !important;
    color: var(--nw-ui-danger-text) !important;
}

/* Customer profile on narrow phones: flow actions in document order instead of letting
   the title, contact fields and action buttons compete for horizontal space. */
@media (max-width: 700px) {
    .customer-header:not(.nw-record-info) {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: var(--nw-space-3) !important;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .customer-header .header-identity,
    .customer-header .header-title-row,
    .customer-header .customer-title,
    .customer-header .customer-name-line,
    .customer-header .customer-commands {
        width: 100% !important;
        max-width: 100%;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .customer-header .header-title-row {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: var(--nw-space-3) !important;
    }

    .customer-header .customer-title {
        display: block !important;
    }

    .customer-header .customer-name-line {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: var(--nw-space-2);
    }

    .customer-header .customer-name-line h1 {
        max-width: 100%;
        font-size: clamp(18px, 5vw, 23px);
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .customer-header .customer-commands {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch !important;
        gap: var(--nw-space-2) !important;
    }

    .customer-header .customer-commands > .contact-command,
    .customer-header .customer-commands > .email-command {
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px;
        height: auto;
        flex: none !important;
        box-sizing: border-box;
        overflow: hidden;
    }

    .customer-header .contact-command strong {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: clamp(9px, 2.7vw, 12px);
    }

    .customer-header .customer-commands > .appointment-command,
    .customer-header .customer-commands > .notes-command {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .customer-header .appointed-command,
    .customer-header .notes-toggle {
        display: flex;
        width: 100%;
        min-width: 0;
        min-height: 42px;
        box-sizing: border-box;
        justify-content: center;
    }

    .customer-header .header-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch !important;
        align-self: stretch !important;
        gap: var(--nw-space-2) !important;
        width: 100%;
        min-width: 0;
    }

    .customer-header .header-actions > .customer-debt-alert-button,
    .customer-header .header-actions > .customer-delete-confirm {
        grid-column: 1 / -1;
    }

    .customer-header .header-actions > .customer-debt-alert-button {
        width: 100% !important;
        min-height: 42px;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .customer-header .header-actions .global-customer-proclamation-button,
    .customer-header .header-actions .customer-delete-button {
        width: 100% !important;
        min-width: 0;
        min-height: 44px;
        height: auto;
        padding: var(--nw-space-2) var(--nw-space-2) !important;
        line-height: 1.25;
        text-align: center;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .customer-layout,
    .customer-main {
        min-width: 0;
    }
}

/* Preview dialog header: the download action previously inherited the 29px
   square close-button width, truncating its label and overlapping the X. */
.document-preview-popup .document-preview-head > div:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--nw-space-2) !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
}
.document-preview-popup .document-preview-head .document-preview-download {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 76px !important;
    height: 32px !important;
    padding: 0 var(--nw-space-3) !important;
    white-space: nowrap !important;
    font-size: var(--nw-font-sm) !important;
}
.document-preview-popup .document-preview-head > div:last-child > button:last-child:not(.document-preview-download) {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 32px !important;
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}
.document-preview-popup .document-preview-head > div:first-child {
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
}
@media(max-width:560px) {
    .document-preview-popup .document-preview-head {
        flex-wrap: wrap !important;
    }
}

/* Summary outer wrappers are redundant: keep borders only on the individual cards. */
.customer-main > .content-card.summary-card {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
.customer-main > .summary-card .qualification-summary-panel {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}
.customer-main > .summary-card .qualification-summary-sections {
    padding: 0 !important;
}