* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: #f5f6f8;
    color: #20242a;
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.topbar {
    height: 72px;
    padding: 0 32px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    background: #111820;
    color: #fff;
}

.brand {
    font-size: 21px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.subtitle {
    margin-top: 2px;
    color: #aeb7c2;
    font-size: 12px;
}

.mode {
    padding: 7px 11px;

    border: 1px solid #3b4653;
    border-radius: 7px;

    color: #adb8c5;
    font-size: 11px;
    font-weight: 700;
}

.container {
    max-width: 1600px;
    margin: auto;
    padding: 32px;
}

.page-header {
    margin-bottom: 25px;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

.page-header h1 {
    margin: 0;
    font-size: 29px;
}

.page-header p {
    margin: 6px 0 0;
    color: #777f89;
}

.stats {
    display: grid;
    grid-template-columns:
        repeat(auto-fit, minmax(150px, 1fr));

    gap: 14px;
    margin-bottom: 24px;
}

.stat-card {
    padding: 19px;

    background: white;
    border: 1px solid #e5e8ec;
    border-radius: 10px;
}

.stat-card span {
    color: #707985;
    font-size: 12px;
}

.stat-card strong {
    display: block;
    margin-top: 8px;

    font-size: 27px;
}

.stat-card.success strong {
    color: #138a54;
}

.stat-card.suspended strong {
    color: #bf4141;
}

.stat-card.warning strong {
    color: #bf7d18;
}

.panel {
    background: white;
    border: 1px solid #e3e6ea;
    border-radius: 10px;
    overflow: hidden;
}

.filters {
    padding: 17px;

    display: grid;
    grid-template-columns:
        minmax(260px, 2fr)
        repeat(3, minmax(160px, 1fr));

    gap: 10px;

    border-bottom: 1px solid #e9ebee;
}

input,
select,
textarea {
    width: 100%;
    padding: 10px 12px;

    border: 1px solid #d7dce2;
    border-radius: 7px;

    background: #fff;
    color: #222;

    font: inherit;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: #78899b;
}

.table-info {
    padding: 10px 17px;

    background: #fafbfc;
    border-bottom: 1px solid #eceef1;

    color: #68717c;
    font-size: 12px;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th {
    padding: 11px 13px;

    text-align: left;

    background: #f7f8fa;
    border-bottom: 1px solid #e1e5e9;

    color: #65707c;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

td {
    padding: 12px 13px;

    border-bottom: 1px solid #edf0f2;

    vertical-align: middle;
    font-size: 13px;
}

tr:hover td {
    background: #fafbfc;
}

.customer-name {
    max-width: 360px;
    font-weight: 600;
}

.code {
    margin-top: 3px;
    color: #7c8490;
    font-size: 11px;
}

.mono {
    font-family:
        "SFMono-Regular",
        Consolas,
        monospace;

    font-size: 12px;
}

.secondary-text {
    margin-top: 4px;
    color: #8a929c;
    font-size: 11px;
}

.badge {
    display: inline-block;

    padding: 5px 8px;

    border-radius: 999px;

    background: #eef1f4;

    font-size: 10px;
    font-weight: 700;
}

.badge.active {
    background: #e6f5ed;
    color: #147449;
}

.badge.suspended {
    background: #faeaea;
    color: #a73434;
}

.badge.review {
    background: #fff3db;
    color: #986516;
}

.badge.unclassified {
    background: #fff0ce;
    color: #8d641c;
}

.badge.paid {
    background: #e8f1ff;
    color: #2c61a6;
}

.badge.free {
    background: #eee9ff;
    color: #6746ad;
}

.link-button {
    padding: 0;

    border: none;
    background: transparent;

    color: #315f99;
    cursor: pointer;

    font: inherit;
    font-weight: 600;
}

.button {
    padding: 10px 15px;

    border: none;
    border-radius: 7px;

    background: #ee7619;
    color: white;

    cursor: pointer;
    font-weight: 700;
}

.button:disabled {
    opacity: .55;
    cursor: wait;
}

.button.secondary {
    background: #e8ebef;
    color: #3e4650;
}
/* ---------------------------------------------------------
 * CUSTOMER SERVICE ACTIONS
 * --------------------------------------------------------- */

.button.danger-button {
    background: #c93c3c;
    border-color: #c93c3c;
    color: #ffffff;
}

.button.danger-button:hover:not(:disabled) {
    background: #ad3030;
    border-color: #ad3030;
    color: #ffffff;
}


.button.success-button {
    background: #138a5b;
    border-color: #138a5b;
    color: #ffffff;
}

.button.success-button:hover:not(:disabled) {
    background: #0f704a;
    border-color: #0f704a;
    color: #ffffff;
}


.button.danger-button:disabled,
.button.success-button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.modal {
    position: fixed;
    inset: 0;
    z-index: 100;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    background: rgba(12, 16, 21, .58);
}

.modal.hidden {
    display: none;
}

.modal-card {
    width: min(520px, 100%);

    padding: 24px;

    background: white;
    border-radius: 12px;

    box-shadow: 0 20px 60px rgba(0,0,0,.2);
}

.modal-header {
    margin-bottom: 22px;

    display: flex;
    justify-content: space-between;
}

.modal-header h2 {
    margin: 0 0 4px;
}

.modal-header span {
    color: #79828d;
    font-size: 13px;
}

.close {
    border: none;
    background: transparent;

    color: #747d87;

    cursor: pointer;
    font-size: 25px;
}

form label {
    display: block;

    margin: 15px 0 7px;

    color: #525b65;

    font-size: 12px;
    font-weight: 700;
}

.modal-actions {
    margin-top: 22px;

    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

@media (max-width: 900px) {
    .container {
        padding: 18px;
    }

    .filters {
        grid-template-columns: 1fr;
    }

    .page-header {
        align-items: flex-start;
        gap: 16px;
        flex-direction: column;
    }
}

.info-button {
    width: 20px;
    height: 20px;
    margin-left: 5px;
    padding: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #cbd2da;
    border-radius: 50%;

    background: #fff;
    color: #66727f;

    font-size: 12px;
    font-weight: 800;
    font-style: normal;
    line-height: 1;

    cursor: pointer;
}

.info-button:hover {
    border-color: #ee7619;
    color: #ee7619;
    background: #fff8f2;
}

.help-modal-text {
    margin-top: 12px;

    color: #434b55;
    font-size: 14px;
    line-height: 1.6;
}

.help-title-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

.help-modal-icon {
    width: 28px;
    height: 28px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #fff3e9;
    color: #ee7619;

    font-weight: 800;
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: 18px;
}

.language-switcher {
    display: flex;
    align-items: center;
    gap: 5px;
}

.language-link {
    padding: 2px 4px;

    border: none;
    background: transparent;

    color: #8f9aa6;

    cursor: pointer;

    font-size: 12px;
    font-weight: 700;
}

.language-link.active {
    color: #ee7619;
}

.language-link:hover {
    color: #fff;
}

.user-block {
    display: flex;
    flex-direction: column;

    text-align: right;
}

.user-block strong {
    color: #fff;

    font-size: 12px;
}

.user-block span {
    margin-top: 2px;

    color: #949faa;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: .5px;
}

.logout-button {
    padding: 7px 9px;

    border: 1px solid #3d4752;
    border-radius: 6px;

    background: transparent;
    color: #c5ccd4;

    cursor: pointer;

    font-size: 11px;
}

.logout-button:hover {
    border-color: #ee7619;
    color: #fff;
}

.action-with-info {
    display: flex;
    align-items: center;
    gap: 6px;
}


/* LOGIN */

.login-page {
    min-height: 100vh;

    background:
        linear-gradient(
            135deg,
            #10171f 0%,
            #18232e 100%
        );
}

.login-wrapper {
    min-height: 100vh;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 25px;
}

.login-card {
    width: min(420px, 100%);

    padding: 38px;

    background: #fff;

    border-radius: 14px;

    box-shadow:
        0 25px 70px
        rgba(0, 0, 0, .3);
}

.login-brand {
    margin-bottom: 27px;

    color: #ee7619;

    font-size: 22px;
    font-weight: 800;

    letter-spacing: 1.5px;
}

.login-card h1 {
    margin: 0;

    font-size: 27px;
}

.login-subtitle {
    margin: 7px 0 24px;

    color: #7a838d;

    font-size: 13px;
}

.login-card label {
    display: block;

    margin: 17px 0 7px;

    color: #555e68;

    font-size: 12px;
    font-weight: 700;
}

.login-button {
    width: 100%;

    margin-top: 24px;

    padding: 12px;
}

.login-error {
    padding: 11px 13px;

    margin-bottom: 17px;

    border-radius: 7px;

    background: #fbeaea;
    color: #9e3434;

    font-size: 12px;
}

.login-language {
    position: fixed;
    top: 20px;
    right: 25px;

    z-index: 10;

    color: #798692;
}

.login-language .language-link.active {
    color: #ee7619;
}

.login-language .language-link:hover {
    color: white;
}


@media (max-width: 850px) {

    .topbar {
        height: auto;

        padding: 16px 18px;

        align-items: flex-start;
    }

    .topbar-right {
        flex-wrap: wrap;

        justify-content: flex-end;

        gap: 10px;
    }

    .mode {
        display: none;
    }

    .user-block {
        display: none;
    }
}

.nav-link {
    color: #c4ccd4;

    text-decoration: none;

    font-size: 12px;
    font-weight: 700;
}

.nav-link:hover {
    color: #ee7619;
}

.reset-password-section {
    margin-top: 24px;
}

.reset-password-section hr {
    margin: 20px 0;

    border: none;
    border-top: 1px solid #e6e9ec;
}

.reset-password-section h3 {
    margin: 0 0 12px;

    font-size: 15px;
}

.reset-password-section .button {
    margin-top: 10px;
}

.hidden {
    display: none !important;
}

.audit-value {
    margin-top: 10px;
}

.audit-value strong {
    display: block;

    margin-bottom: 4px;

    color: #747e89;

    font-size: 10px;
}

.audit-value pre {
    max-width: 600px;
    max-height: 250px;

    margin: 0;
    padding: 10px;

    overflow: auto;

    border-radius: 6px;

    background: #f4f6f8;

    font-size: 11px;
}

details summary {
    color: #315f99;

    cursor: pointer;

    font-size: 12px;
    font-weight: 600;
}
.timezone-label {
    margin-left: 8px;
    color: #89929c;
    font-size: 11px;
    font-weight: 500;
}
.button.danger {
    background: #b63e3e;
}

.success-button {
    background: #16865a;
}

.small-button {
    padding: 7px 10px;
    font-size: 11px;
}

.service-warning {
    margin-bottom: 18px;
    padding: 12px 14px;

    border-radius: 7px;

    background: #fff4df;
    color: #76531a;

    font-size: 13px;
    line-height: 1.5;
}

.bandwidth-input {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bandwidth-input input {
    flex: 1;
}

.bandwidth-input span {
    color: #65707c;
    font-size: 13px;
    font-weight: 700;
}
.migration-card {
    width: min(900px, 94vw);
    max-width: 900px;
}

.migration-section {
    margin-top: 18px;
}

.migration-section h3 {
    margin: 0 0 12px;

    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.migration-contract {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    padding: 14px;

    border: 1px solid #e3e7eb;
    border-radius: 8px;
}

.migration-comparison {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.migration-row {
    display: flex;
    justify-content: space-between;
    gap: 20px;

    padding: 9px 0;

    border-bottom: 1px solid #edf0f2;

    font-size: 12px;
}

.migration-row span {
    color: #687382;
}

.migration-row strong {
    text-align: right;
}

.migration-finding {
    margin-bottom: 8px;
    padding: 10px 12px;

    border-radius: 7px;

    font-size: 12px;
}

.migration-warning {
    background: #fff4df;
    color: #795414;
}

.migration-error {
    background: #fdeaea;
    color: #a73333;
}

.migration-success {
    background: #e8f6ef;
    color: #167248;
}

.migration-info {
    background: #edf4fb;
    color: #315f99;
}

.migration-automatic {
    margin-top: 20px;
}

.migration-muted {
    padding: 15px;

    color: #7c8793;
    background: #f5f6f7;

    border-radius: 7px;

    font-size: 12px;
}

@media (max-width: 760px) {
    .migration-comparison {
        grid-template-columns: 1fr;
    }
}

.migration-approval-section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #e7eaee;
}

.migration-approval-section h3 {
    display: flex;
    align-items: center;
    gap: 7px;

    margin: 0 0 12px;

    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

#migrationApprovalDetails {
    margin-top: 12px;
}

#migrationApprovalNoteContainer {
    margin-top: 15px;
}
.form-group {
    margin-bottom: 18px;
}

.form-group label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 700;
}

.field-help {
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.45;
    color: #6b7280;
}
.readiness-filter-card {
    cursor: pointer;
}

.readiness-filter-card:hover {
    transform: translateY(-1px);
}
.noc-review-card {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow-y: auto;
}

.noc-review-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.noc-review-field {
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 10px;
    padding: 12px 14px;
    min-width: 0;
}

.noc-review-field span {
    display: block;
    font-size: 12px;
    opacity: 0.7;
    margin-bottom: 5px;
}

.noc-review-field strong {
    display: block;
    overflow-wrap: anywhere;
}

.noc-review-warning {
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid
        rgba(220, 38, 38, 0.35);
    border-radius: 10px;
    background:
        rgba(220, 38, 38, 0.08);
}

.noc-review-warning strong {
    display: block;
    margin-bottom: 6px;
}

.noc-findings-section {
    margin-top: 20px;
}

.noc-findings-section h3 {
    margin: 0 0 10px;
    font-size: 15px;
}

@media (max-width: 700px) {
    .noc-review-grid {
        grid-template-columns: 1fr;
    }
}
.noc-queue-matches-section {
    margin-top: 22px;
}

.noc-queue-matches-section > h3 {
    margin: 0 0 12px;
    font-size: 15px;
}

.noc-queue-match {
    margin-top: 14px;
    padding: 16px;
    border: 1px solid
        rgba(148, 163, 184, 0.3);
    border-radius: 12px;
}

.noc-queue-match:first-child {
    margin-top: 0;
}

.noc-queue-match-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.noc-difference-summary {
    margin-bottom: 16px;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid
        rgba(245, 158, 11, 0.35);
    background:
        rgba(245, 158, 11, 0.08);
}

.noc-difference-summary strong {
    display: block;
    margin-bottom: 10px;
}

.noc-difference-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.noc-difference-tag {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background:
        rgba(245, 158, 11, 0.14);
}

.noc-field-different {
    border-color:
        rgba(245, 158, 11, 0.55);
    background:
        rgba(245, 158, 11, 0.06);
}
.readiness-bulk-toolbar {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin: 14px 0;
}

.bulk-select-visible {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.selection-column {
    width: 42px;
    text-align: center;
}

.bulk-review-box {
    margin-top: 18px;
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 10px;
    padding: 12px;
}

.bulk-client-item {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 8px 0;
    border-bottom: 1px solid
        rgba(148, 163, 184, 0.15);
}

.bulk-client-item:last-child {
    border-bottom: 0;
}
.prospect-modal-card {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow-y: auto;
}

.prospect-assessment-card {
    width: min(900px, calc(100vw - 32px));
    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

.prospect-form-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.prospect-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}

.assessment-section {
    margin-top: 10px;
}

.assessment-section h3 {
    margin: 0 0 16px;
}

.assessment-options {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}

.assessment-options label {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 8px;
}

.advisor-action {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
}

.recommendation-panel {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid
        rgba(148, 163, 184, 0.25);
}

.recommendation-heading {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 14px;
}

.recommendation-heading > div {
    padding: 12px 14px;
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 9px;
}

.recommendation-heading span,
.advisor-recommendation span {
    display: block;
    font-size: 12px;
    opacity: 0.7;
    margin-bottom: 4px;
}

.recommendation-heading strong,
.advisor-recommendation strong {
    display: block;
    font-size: 18px;
}

.advisor-recommendation {
    padding: 16px;
    margin-bottom: 18px;
    border: 1px solid
        rgba(34, 197, 94, 0.35);
    border-radius: 10px;
    background:
        rgba(34, 197, 94, 0.07);
}

#recommendationReasons {
    margin: 10px 0 20px;
    padding-left: 22px;
}

#recommendationReasons li {
    margin: 6px 0;
}

@media (max-width: 720px) {
    .prospect-form-grid,
    .assessment-options,
    .recommendation-heading {
        grid-template-columns: 1fr;
    }
}
/* Service Advisor option cards */

.assessment-options {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    margin-top: 16px;
}

.assessment-options label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;

    min-height: 44px;
    padding: 10px 12px;

    border: 1px solid
        rgba(148, 163, 184, 0.28);

    border-radius: 8px;

    cursor: pointer;
}

.assessment-options input[type="checkbox"] {
    width: 17px;
    height: 17px;

    margin: 0;

    flex: 0 0 auto;
}

.assessment-options label:hover {
    background:
        rgba(148, 163, 184, 0.06);
}


/* Keep the last odd option aligned nicely */

.assessment-options label:last-child:nth-child(odd) {
    grid-column: 1 / 2;
}


/* Slightly tighter form spacing */

.assessment-section
.prospect-form-grid {
    gap: 12px 16px;
}

.assessment-section
.form-group {
    margin-bottom: 4px;
}

.assessment-section
.form-group label {
    display: block;
    margin-bottom: 6px;
}


/* Better modal width and spacing */

.prospect-assessment-card {
    width: min(
        860px,
        calc(100vw - 32px)
    );

    max-height:
        calc(100vh - 36px);

    overflow-y: auto;
}

.advisor-action {
    display: flex;
    justify-content: flex-end;

    margin-top: 16px;
}


/* On smaller screens */

@media (max-width: 720px) {

    .assessment-options {
        grid-template-columns: 1fr;
    }

    .assessment-options
    label:last-child:nth-child(odd) {
        grid-column: auto;
    }
}
.finance-modal-card {
    width: min(
        1050px,
        calc(100vw - 32px)
    );

    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

.finance-status-grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 22px;
}

.finance-summary-card {
    padding: 14px;
    border: 1px solid
        rgba(148, 163, 184, 0.28);
    border-radius: 9px;
}

.finance-summary-card span {
    display: block;
    font-size: 12px;
    opacity: 0.7;
    margin-bottom: 5px;
}

.finance-summary-card strong {
    font-size: 17px;
}
.finance-lifecycle-panel {
    margin: 18px 0;
    padding: 18px;
    border: 1px solid #dfe5ec;
    border-radius: 12px;
    background: #f8fafc;
}

.finance-lifecycle-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.finance-lifecycle-header h3 {
    margin: 0 0 4px;
}

.finance-lifecycle-header > div > span {
    color: #64748b;
    font-size: 13px;
}

.finance-lifecycle-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #e2e8f0;
    font-size: 12px;
    font-weight: 700;
}

.finance-lifecycle-status[data-status="ACTIVE"] {
    background: #dcfce7;
    color: #166534;
}

.finance-lifecycle-status[data-status="SUSPENDED"] {
    background: #fee2e2;
    color: #991b1b;
}

.finance-lifecycle-grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.finance-lifecycle-item {
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
}

.finance-lifecycle-item > span {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: 12px;
}

.finance-lifecycle-item > strong {
    display: block;
    overflow-wrap: anywhere;
}

.finance-suspension-details {
    margin-top: 14px;
    padding: 14px;
    border-left: 4px solid #94a3b8;
    border-radius: 8px;
    background: #ffffff;
}

.finance-suspension-details.current-suspension {
    border-left-color: #dc2626;
    background: #fff7f7;
}

.finance-suspension-heading {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.finance-suspension-heading > span {
    color: #64748b;
    font-size: 12px;
}

.finance-suspension-details p {
    margin: 0 0 10px;
    line-height: 1.5;
}

.finance-suspension-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    color: #64748b;
    font-size: 12px;
}

.finance-suspension-meta strong {
    color: #334155;
}

@media (max-width: 900px) {
    .finance-lifecycle-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .finance-lifecycle-grid {
        grid-template-columns: 1fr;
    }

    .finance-lifecycle-header,
    .finance-suspension-heading {
        flex-direction: column;
    }
}
.finance-columns {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.finance-columns > section {
    padding: 16px;
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 10px;
}

.finance-checkbox {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 12px 0;
}

.finance-history {
    margin-top: 22px;
}

@media (max-width: 800px) {
    .finance-status-grid,
    .finance-columns {
        grid-template-columns: 1fr;
    }
}
.finance-toggle {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    margin: 12px 0;
    padding: 12px 14px;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 9px;

    cursor: pointer;
}

.finance-toggle:hover {
    background:
        rgba(148, 163, 184, 0.05);
}

.finance-toggle input[type="checkbox"] {
    width: 18px;
    height: 18px;

    margin: 2px 0 0;

    flex: 0 0 auto;
}

.finance-toggle > div {
    min-width: 0;
}

.finance-toggle strong {
    display: block;

    font-size: 14px;
    line-height: 1.35;
}

.finance-toggle span {
    display: block;

    margin-top: 3px;

    font-size: 12px;
    line-height: 1.4;

    opacity: 0.7;
}
.badge.finance-active {
    font-weight: 700;
}

.badge.finance-grace {
    font-weight: 700;
}

.badge.finance-overdue,
.badge.finance-suspension-due {
    font-weight: 700;
}

.badge.finance-not-configured {
    opacity: 0.75;
}
.network-candidate-results {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.network-candidate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 12px 14px;

    border: 1px solid
        rgba(148, 163, 184, 0.28);

    border-radius: 9px;
}

.network-candidate:hover {
    background:
        rgba(148, 163, 184, 0.05);
}
.provisioning-modal-card {
    width: min(
        900px,
        calc(100vw - 32px)
    );

    max-height: calc(100vh - 40px);
    overflow-y: auto;
}

.provisioning-contract {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.provisioning-contract > div {
    padding: 14px;
    border: 1px solid
        rgba(148, 163, 184, 0.25);
    border-radius: 9px;
}

.provisioning-contract span {
    display: block;
    font-size: 12px;
    opacity: 0.7;
    margin-bottom: 5px;
}

.provisioning-contract strong {
    display: block;
    font-size: 16px;
}

@media (max-width: 700px) {
    .provisioning-contract {
        grid-template-columns: 1fr;
    }
}
.provisioning-preview-state {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.provisioning-findings-section,
.provisioning-command-section {
    margin-top: 18px;
}

.provisioning-findings-section h4,
.provisioning-command-section h4 {
    margin: 0 0 10px;
}

.provisioning-finding-list {
    display: grid;
    gap: 8px;
}

.provisioning-finding {
    display: flex;
    flex-direction: column;
    gap: 3px;

    padding: 11px 13px;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 8px;
}

.provisioning-finding strong {
    font-size: 13px;
}

.provisioning-finding span {
    font-size: 12px;
    line-height: 1.45;
}

.provisioning-finding-success {
    border-color:
        rgba(34, 197, 94, 0.35);

    background:
        rgba(34, 197, 94, 0.06);
}

.provisioning-finding-warning {
    border-color:
        rgba(245, 158, 11, 0.4);

    background:
        rgba(245, 158, 11, 0.07);
}

.provisioning-finding-error {
    border-color:
        rgba(239, 68, 68, 0.42);

    background:
        rgba(239, 68, 68, 0.07);
}
.provisioning-preview {
    margin-top: 22px;
    padding-top: 20px;

    border-top: 1px solid
        rgba(148, 163, 184, 0.28);
}

.provisioning-preview-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 14px;
}

.provisioning-preview-header h3 {
    margin: 0 0 4px;
}

.provisioning-preview-header p {
    margin: 0;
    opacity: 0.7;
}

.provisioning-preview-state {
    display: flex;
    align-items: center;

    gap: 8px;

    flex-wrap: wrap;
}

.provisioning-preview-summary {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 10px;

    margin-bottom: 16px;
}

.provisioning-preview-summary > div {
    padding: 12px;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 8px;
}

.provisioning-preview-summary span {
    display: block;

    margin-bottom: 4px;

    font-size: 12px;

    opacity: 0.7;
}

.provisioning-findings-section,
.provisioning-command-section {
    margin-top: 18px;
}

.provisioning-findings-section h4,
.provisioning-command-section h4 {
    margin: 0 0 10px;
}

.provisioning-finding-list {
    display: grid;
    gap: 8px;
}

.provisioning-finding {
    display: flex;
    flex-direction: column;

    gap: 3px;

    padding: 11px 13px;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 8px;
}

.provisioning-finding strong {
    font-size: 13px;
}

.provisioning-finding span {
    font-size: 12px;
    line-height: 1.45;
}

.provisioning-finding-success {
    border-color:
        rgba(34, 197, 94, 0.35);

    background:
        rgba(34, 197, 94, 0.06);
}

.provisioning-finding-warning {
    border-color:
        rgba(245, 158, 11, 0.4);

    background:
        rgba(245, 158, 11, 0.07);
}

.provisioning-finding-error {
    border-color:
        rgba(239, 68, 68, 0.42);

    background:
        rgba(239, 68, 68, 0.07);
}

.provisioning-command-list {
    display: grid;
    gap: 12px;
}

.provisioning-command {
    overflow: hidden;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 9px;
}

.provisioning-command-title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;

    padding: 10px 12px;
}

.provisioning-command pre {
    margin: 0;

    padding: 14px;

    overflow-x: auto;

    background:
        rgba(15, 23, 42, 0.06);

    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 800px) {
    .provisioning-preview-summary {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .provisioning-preview-summary {
        grid-template-columns: 1fr;
    }
}
.provisioning-live-section {
    margin-top: 18px;
    padding-top: 18px;

    border-top: 1px solid
        rgba(148, 163, 184, 0.22);
}

.provisioning-live-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 12px;
}

.provisioning-live-header h4 {
    margin: 0 0 3px;
}

.provisioning-live-header p {
    margin: 0;

    font-size: 12px;
    opacity: 0.7;
}

.provisioning-live-summary {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 8px;

    margin-bottom: 12px;
}

.provisioning-live-summary > div {
    padding: 10px 12px;

    border: 1px solid
        rgba(148, 163, 184, 0.22);

    border-radius: 8px;
}

.provisioning-live-summary span {
    display: block;

    margin-bottom: 3px;

    font-size: 11px;
    opacity: 0.68;
}

.provisioning-live-summary strong {
    display: block;

    font-size: 16px;
}

.provisioning-live-checks {
    display: grid;
    gap: 7px;
}

.provisioning-live-check {
    display: grid;

    grid-template-columns:
        28px 1fr;

    gap: 8px;

    align-items: flex-start;

    padding: 10px 12px;

    border: 1px solid
        rgba(148, 163, 184, 0.22);

    border-radius: 8px;
}

.provisioning-live-check strong {
    display: block;

    margin-bottom: 2px;

    font-size: 13px;
}

.provisioning-live-check span {
    display: block;

    font-size: 12px;

    line-height: 1.4;
}

.provisioning-live-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 24px;
    height: 24px;

    border-radius: 50%;

    font-weight: 800;
}

.provisioning-live-pass {
    border-color:
        rgba(34, 197, 94, 0.28);
}

.provisioning-live-pass
.provisioning-live-icon {
    background:
        rgba(34, 197, 94, 0.12);
}

.provisioning-live-warning {
    border-color:
        rgba(245, 158, 11, 0.34);
}

.provisioning-live-warning
.provisioning-live-icon {
    background:
        rgba(245, 158, 11, 0.12);
}

.provisioning-live-block {
    border-color:
        rgba(239, 68, 68, 0.36);
}

.provisioning-live-block
.provisioning-live-icon {
    background:
        rgba(239, 68, 68, 0.12);
}

@media (max-width: 650px) {
    .provisioning-live-summary {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}
.provisioning-confirm-card {
    max-width: 720px;
}

.provisioning-execute-warning {
    margin: 16px 0;

    padding: 14px 16px;

    border: 1px solid
        rgba(239, 68, 68, 0.32);

    border-radius: 10px;

    background:
        rgba(239, 68, 68, 0.05);
}

.provisioning-execute-warning strong {
    display: block;
    margin-bottom: 6px;
}

.provisioning-execute-warning p {
    margin: 5px 0;
    line-height: 1.45;
}

.provisioning-confirm-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 10px;

    margin: 16px 0;
}

.provisioning-confirm-grid > div {
    padding: 11px 12px;

    border: 1px solid
        rgba(148, 163, 184, 0.25);

    border-radius: 8px;
}

.provisioning-confirm-grid span {
    display: block;

    margin-bottom: 3px;

    font-size: 12px;
    opacity: 0.68;
}

@media (max-width: 600px) {
    .provisioning-confirm-grid {
        grid-template-columns: 1fr;
    }
}
.customer-service-card {
    max-width: 620px;
}

.customer-service-warning {
    margin: 14px 0 18px;

    padding: 13px 15px;

    border: 1px solid
        rgba(245, 158, 11, 0.35);

    border-radius: 9px;

    background:
        rgba(245, 158, 11, 0.07);

    line-height: 1.45;
}

.danger-button {
    border-color:
        rgba(220, 38, 38, 0.45);

    background:
        rgba(220, 38, 38, 0.08);
}

.danger-button:hover {
    background:
        rgba(220, 38, 38, 0.14);
}

.success-button {
    border-color:
        rgba(22, 163, 74, 0.45);

    background:
        rgba(22, 163, 74, 0.08);
}

.success-button:hover {
    background:
        rgba(22, 163, 74, 0.14);
}
.finance-network-primary {
    display: block;
    font-weight: 700;
}

.finance-network-secondary {
    display: block;
    margin-top: 4px;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
}

.finance-arp-state {
    display: inline-flex;
    margin-top: 7px;
    padding: 3px 7px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .03em;
}

.finance-arp-state.enabled {
    background: #dcfce7;
    color: #166534;
}

.finance-arp-state.disabled {
    background: #fee2e2;
    color: #991b1b;
}
.finance-dashboard-section {
    margin: 28px 0;
}

.finance-dashboard-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
}

.finance-dashboard-header h2,
.finance-dashboard-panel h3 {
    margin: 0;
}

.finance-dashboard-header p {
    margin: 5px 0 0;
    color: #667085;
}

.finance-dashboard-stats,
.finance-dashboard-status-stats {
    margin-bottom: 14px;
}

.finance-dashboard-columns {
    display: grid;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(280px, 1fr);
    gap: 16px;
    margin-top: 16px;
}

.finance-dashboard-panel {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 18px;
    margin-top: 16px;
}

.finance-dashboard-columns
.finance-dashboard-panel {
    margin-top: 0;
}

.finance-dashboard-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.finance-attention-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.finance-attention-grid > div {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
}

.finance-attention-grid span {
    display: block;
    color: #667085;
    font-size: 0.85rem;
    margin-bottom: 8px;
}

.finance-attention-grid strong {
    font-size: 1.6rem;
}

@media (
    max-width: 900px
) {
    .finance-dashboard-columns {
        grid-template-columns: 1fr;
    }
}

@media (
    max-width: 640px
) {
    .finance-dashboard-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .finance-attention-grid {
        grid-template-columns: 1fr;
    }
}
.dashboard-stat-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.dashboard-stat-link:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.finance-attention-link {
    display: block;
    color: inherit;
    text-decoration: none;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
}

.finance-attention-link:hover {
    text-decoration: none;
    transform: translateY(-1px);
}
/* Billing Settings */

.billing-settings-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.billing-settings-section-header h2 {
    margin: 0 0 4px;
}

.billing-settings-section-header p {
    margin: 0;
}

.billing-settings-grid {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );
    gap: 18px 22px;
}

.billing-settings-full-width {
    grid-column: 1 / -1;
}

.billing-settings-grid input,
.billing-settings-grid textarea,
.billing-settings-grid select {
    width: 100%;
}

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

    .billing-settings-full-width {
        grid-column: auto;
    }

    .billing-settings-section-header {
        flex-direction: column;
    }
}
.badge.invoice-issued {
    background: #fef3c7;
    color: #92400e;
}
.workspace-nav{display:flex;flex-wrap:wrap;gap:.75rem;margin:1rem 0}.operator-form{display:flex;flex-wrap:wrap;gap:.65rem;align-items:end}.operator-form label{display:grid;gap:.25rem}.record-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.7rem;margin:1rem 0}.record-card{display:grid;gap:.35rem;border:1px solid #e6d5c8;border-radius:8px;padding:.8rem;background:#fff}.record-card small{color:#665}.warning{padding:.7rem;border-left:4px solid #c34b20;background:#fff3ee}
.operations-nav{position:sticky;top:0;z-index:90;background:#38251d;color:#fff;box-shadow:0 2px 8px #0003}.operations-nav-head{display:none}.operations-menu{display:flex;align-items:stretch;gap:2px;max-width:1500px;margin:auto;padding:0 16px}.operations-link,.operations-group summary{display:flex;align-items:center;min-height:44px;padding:0 11px;color:#fff;text-decoration:none;cursor:pointer;white-space:nowrap}.operations-link:hover,.operations-link.active,.operations-group[open]>summary{background:#f58220}.operations-group{position:relative}.operations-group summary{list-style:none}.operations-group summary::-webkit-details-marker{display:none}.operations-group summary::after{content:"▾";font-size:.7em;margin-left:6px}.operations-group>a{display:block;padding:10px 14px;color:#38251d;text-decoration:none;background:#fff;white-space:nowrap}.operations-group>a:hover{background:#fff3e8}.operations-group[open]{background:#f58220}.operations-group[open]>a{position:relative;z-index:2}.operations-group[open]>a:first-of-type{border-radius:0 6px 0 0}.operations-group[open]>a:last-of-type{border-radius:0 0 6px 6px}.operations-brand{color:#f58220;font-weight:800;text-decoration:none;letter-spacing:.06em}.operations-menu-toggle{background:#f58220;color:#fff;border:0;border-radius:5px;padding:8px 14px}
@media(min-width:901px){.operations-group[open]>a{position:absolute;left:0;min-width:100%;top:44px}.operations-group[open]>a:nth-of-type(2){top:84px}.operations-group[open]>a:nth-of-type(3){top:124px}}
@media(max-width:900px){.operations-nav-head{display:flex;align-items:center;justify-content:space-between;padding:9px 16px}.operations-menu{display:none;flex-direction:column;padding:4px 12px 12px;max-height:75vh;overflow:auto}.operations-menu.open{display:flex}.operations-link,.operations-group summary{min-height:40px}.operations-group>a{margin-left:12px;border-left:3px solid #f58220}.topbar{position:static}}
.operations-shortcuts{margin:22px 0}.operations-shortcut-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.operations-shortcut-grid a{display:grid;gap:6px;padding:17px;border:1px solid #ead8ca;border-radius:10px;background:#fff;color:#38251d;text-decoration:none;box-shadow:0 2px 7px #38251d12}.operations-shortcut-grid a:hover{border-color:#f58220;transform:translateY(-1px)}.operations-shortcut-grid span{font-size:.88rem;color:#715f54}
.operations-nav{background:#18232e;border-bottom:2px solid #2d3944;box-shadow:0 2px 8px #0002}.operations-link:hover,.operations-link.active,.operations-group[open]>summary{background:transparent;box-shadow:inset 0 -3px #f58220;color:#fff}.operations-group[open]{background:#222e39}.operator-workspace{padding-top:24px}.workspace-stats{margin-bottom:20px}.workspace-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 18px 8px}.workspace-section-head h2,.workspace-section-head p,.panel>h2,.panel>p{margin-top:0}.panel>h2,.panel>p{padding-left:18px;padding-right:18px}.table-wrap{overflow-x:auto}.workspace-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px;padding:18px}.workspace-form .button,.workspace-form .checkbox-label{align-self:end}.checkbox-label{display:flex!important;align-items:center;gap:8px}.checkbox-label input{width:auto}.button-small{padding:6px 9px;border:0;border-radius:6px;background:#ee7619;color:#fff;cursor:pointer}.button-small.secondary{background:#e9edf1;color:#34404c}.workspace-empty{padding:28px!important;text-align:center;color:#727d88}.operator-workspace td small{display:block;margin-top:4px;color:#7c8792}.progress-cell{font-size:12px;color:#596673}.workspace-modal-card{max-width:620px}.queue-filters{display:flex;gap:7px;flex-wrap:wrap;padding:0 18px 15px}
@media(max-width:700px){.workspace-form{grid-template-columns:1fr}.workspace-section-head{flex-direction:column}.operator-workspace{padding:16px}.workspace-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.preference-list{padding:0 18px}.preference-row{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:18px;align-items:center;padding:11px 0;border-bottom:1px solid #e7eaed}.preference-row label{margin:0}.preference-row input{width:auto}.timeline-event{display:grid;grid-template-columns:1fr auto;gap:4px;padding:12px 0;border-bottom:1px solid #e7eaed}.timeline-event small{grid-column:1/-1;color:#737e89}.button.danger,.button-small.danger{background:#b63a34;color:#fff}html,body{max-width:100%;overflow-x:hidden}.table-wrap{max-width:100%;-webkit-overflow-scrolling:touch}.modal-card{max-width:min(680px,calc(100vw - 28px));max-height:calc(100vh - 28px);overflow:auto}
@media(max-width:600px){.preference-row{grid-template-columns:1fr}.topbar{flex-wrap:wrap;gap:10px}.topbar-right{width:100%;justify-content:space-between;flex-wrap:wrap}.user-block{text-align:left}.mode{font-size:9px}}
.prospect-kpi{cursor:pointer}.prospect-kpi.selected{outline:3px solid #f58220;outline-offset:-3px;background:#fff1e5!important}

/* Request 12B.3 — Field Operations */
.workspace-modal-card {
    width: min(1040px, calc(100vw - 28px));
    max-width: 1040px;
}

.field-job {
    display: grid;
    gap: 16px;
    padding: 0 18px 20px;
}

.field-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
    border: 1px solid #e3e7eb;
    border-radius: 10px;
    background: #f8fafb;
}

.field-summary > div,
.field-metric-grid > div {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.field-summary span,
.field-metric-grid span {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #71808e;
}

.field-summary strong,
.field-metric-grid strong {
    overflow-wrap: anywhere;
}

.field-section {
    border: 1px solid #e3e7eb;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.field-section > h3 {
    margin: 0;
    padding: 16px 18px 8px;
}

.field-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 16px 18px 8px;
}

.field-section-head h3,
.field-section-head p {
    margin: 0;
}

.field-section-head p {
    margin-top: 5px;
    color: #687580;
    font-size: 13px;
}

.field-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 10px 18px 16px;
}

.field-metric-grid > div {
    padding: 11px;
    border-radius: 8px;
    background: #f6f8fa;
}

.field-checklist {
    display: grid;
    gap: 0;
    padding: 8px 18px 16px;
}

.field-check-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    margin: 0;
    border-bottom: 1px solid #edf0f2;
}

.field-check-item:last-child {
    border-bottom: 0;
}

.field-check-item input {
    width: auto;
    margin-top: 3px;
}

.field-check-item span {
    display: grid;
    gap: 3px;
}

.field-check-item small {
    color: #6e7a85;
}

.field-history {
    display: grid;
    gap: 0;
    padding: 8px 18px 16px;
}

.field-history-row {
    display: grid;
    grid-template-columns:
        minmax(120px, 1fr)
        repeat(3, minmax(90px, auto));
    gap: 10px;
    align-items: center;
    padding: 9px 0;
    border-bottom: 1px solid #edf0f2;
}

.field-history-row:last-child {
    border-bottom: 0;
}

.field-history-row small {
    grid-column: 1 / -1;
    color: #78848e;
}

.field-evidence-grid {
    display: grid;
    grid-template-columns: repeat(
        auto-fit,
        minmax(190px, 1fr)
    );
    gap: 10px;
    padding: 8px 18px 18px;
}

.field-evidence-card {
    display: grid;
    gap: 5px;
    min-width: 0;
    padding: 12px;
    border: 1px solid #e2e7eb;
    border-radius: 8px;
    color: #283744;
    text-decoration: none;
    background: #f9fafb;
}

.field-evidence-card:hover {
    border-color: #f58220;
}

.field-evidence-card span,
.field-evidence-card small {
    overflow-wrap: anywhere;
}

.field-evidence-card small {
    color: #6e7a85;
}

.field-actions .workspace-actions {
    padding: 8px 18px 12px;
}
.field-blocker{margin:0 18px 14px;border-top:1px solid #edf0f2;padding-top:10px}.field-blocker summary{cursor:pointer;font-weight:700;color:#8d2823;padding:7px 0}.field-blocker .workspace-form{padding-left:0;padding-right:0}

@media (max-width: 600px) {
  /* Lifecycle handoffs become cards: keeping the desktop table at this width
     clipped approval, handoff state and actions inside the panel. */
  #contractRows { display: block; }
  #contractRows tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    padding: 16px;
    border: 1px solid #dce4eb;
    border-radius: 10px;
  }
  #contractRows td {
    display: block;
    min-width: 0;
    padding: 0;
    border: 0;
    overflow-wrap: anywhere;
  }
  #contractRows td::before {
    display: block;
    margin-bottom: 4px;
    color: #728095;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
  }
  #contractRows td:nth-child(1)::before { content: "Contract / customer"; }
  #contractRows td:nth-child(2)::before { content: "Service"; }
  #contractRows td:nth-child(3)::before { content: "Bandwidth"; }
  #contractRows td:nth-child(4)::before { content: "Fee"; }
  #contractRows td:nth-child(5)::before { content: "Approval"; }
  #contractRows td:nth-child(6)::before { content: "Technical handoff"; }
  #contractRows td:nth-child(7)::before { content: "Actions"; }
  #contractRows td:nth-child(7) { grid-column: 1 / -1; }
  #contractRows:empty { display: table-row-group; }
  #contractRows:empty + * { display: initial; }
  #contractRows ~ * { max-width: 100%; }
  table:has(> thead + #contractRows) > thead { display: none; }
}

.field-compact-form {
    padding-top: 10px;
}

.field-span-2 {
    grid-column: 1 / -1;
}

.field-error {
    border-color: #b63a34 !important;
    background: #fff1f0 !important;
    color: #8d2823 !important;
}

.field-readiness ul {
    display: grid;
    gap: 8px;
    margin: 4px 18px 18px;
    padding: 0;
    list-style: none;
}

.field-readiness li { padding: 9px 11px; border-radius: 7px; background: #f3f6f8; }
.field-readiness .ready { color: #176b3a; background: #edf8f1; }
.field-readiness .not-ready { color: #96342f; background: #fff1f0; }
.field-check-item input:disabled { cursor: not-allowed; }

@media (max-width: 760px) {
    .workspace-modal-card {
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
        max-height: calc(100vh - 16px);
    }

    .field-job {
        padding: 0 10px 14px;
    }

    .field-summary,
    .field-metric-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .field-section-head {
        flex-direction: column;
    }

    .field-history-row {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .field-span-2 {
        grid-column: auto;
    }
}

@media (max-width: 430px) {
    .field-summary,
    .field-metric-grid,
    .field-history-row {
        grid-template-columns: 1fr;
    }

    .field-evidence-grid {
        grid-template-columns: 1fr;
    }

    .field-section-head,
    .field-history,
    .field-checklist,
    .field-evidence-grid {
        padding-left: 12px;
        padding-right: 12px;
    }
}
.prospect-notes {
    max-width: 18rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.onboarding-stepper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: .65rem;
    margin: 1rem 0;
}
.onboarding-stepper article { display:flex; gap:.6rem; padding:.75rem; border:1px solid var(--border, #d7dee8); border-radius:.65rem; }
.onboarding-stepper article > span { display:grid; place-items:center; width:1.7rem; height:1.7rem; border-radius:50%; background:#e6ebf2; flex:none; }
.onboarding-stepper article.complete { border-color:#77b99a; background:#f1faf5; }
.onboarding-stepper article.complete > span { color:white; background:#18794e; }
.onboarding-stepper small,.lifecycle-record-actions small,.lifecycle-record-actions span { display:block; }
.lifecycle-record-actions { display:flex; justify-content:space-between; align-items:end; gap:1rem; padding-top:.75rem; border-top:1px solid var(--border, #d7dee8); }
.lifecycle-record-actions > div:last-child { display:grid; justify-items:end; gap:.5rem; }
@media (max-width: 600px) { .lifecycle-record-actions { align-items:stretch; flex-direction:column; } .lifecycle-record-actions > div:last-child { justify-items:stretch; } }
.network-console{width:min(1100px,96vw);max-height:92vh;overflow:auto}.network-console>section{padding:1rem 0;border-top:1px solid var(--border,#d7dee8)}.network-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.network-summary article,.network-checks article{display:grid;gap:.25rem;padding:.8rem;border:1px solid var(--border,#d7dee8);border-radius:.65rem}.network-summary small,.network-summary span{color:var(--muted,#657184)}.network-form{grid-template-columns:repeat(3,1fr)}.network-qos dl{display:grid;grid-template-columns:repeat(4,1fr);gap:.75rem}.network-qos dl div{padding:.75rem;background:#f5f7fa;border-radius:.5rem}.network-qos dt{font-size:.8rem;color:#657184}.network-qos dd{margin:.25rem 0 0;font-weight:700}.network-checks{display:grid;gap:.5rem}.network-checks article{grid-template-columns:12rem 5rem 1fr}.network-checks article p{margin:0}.check-pass{border-left:4px solid #18794e!important}.check-fail{border-left:4px solid #b42318!important}.network-console pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#101828;color:#eef4ff;padding:1rem;border-radius:.6rem}.error-reference{font-family:monospace}.danger{background:#b42318!important}
@media(max-width:600px){.network-summary,.network-form,.network-qos dl{grid-template-columns:1fr}.network-checks article{grid-template-columns:1fr}.network-console{width:100vw;max-height:100vh;border-radius:0}.network-console .modal-header{position:sticky;top:0;background:white;z-index:2}.network-console input,.network-console select,.network-console button{max-width:100%}}