/*
 * MYINSURIA
 * MYI-023-012 — Human Dashboard UX Standard V1
 * Phase C — Component & State Standardization V1
 *
 * Visual / interaction standardization only.
 * No business semantics are calculated here.
 */

/* -------------------------------------------------------------------------- */
/* Standardized workspace attachment                                          */
/* -------------------------------------------------------------------------- */

[data-myi-standardized-workspace="true"] {
    min-width: 0;
}

[data-myi-standardized-workspace="true"] main,
[data-myi-standardized-workspace="true"] .main,
[data-myi-standardized-workspace="true"] .main-content,
[data-myi-standardized-workspace="true"] .content {
    min-width: 0;
}


/* -------------------------------------------------------------------------- */
/* Human-first headers                                                        */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-heading {
    min-width: 0;
}

.myi-ux-standardized-heading h1,
.myi-ux-standardized-heading h2,
.myi-ux-standardized-heading h3 {
    text-wrap: balance;
}


/* -------------------------------------------------------------------------- */
/* Existing card normalization                                                */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-card {
    min-width: 0;
}

.myi-ux-standardized-card > :first-child {
    margin-top: 0;
}

.myi-ux-standardized-card > :last-child {
    margin-bottom: 0;
}


/* -------------------------------------------------------------------------- */
/* Existing KPI normalization                                                 */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-kpi {
    position: relative;
    min-width: 0;
}

.myi-ux-standardized-kpi[role="button"] {
    cursor: pointer;
}


/* -------------------------------------------------------------------------- */
/* Filter/control normalization                                               */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-filter {
    min-width: 0;
}

.myi-ux-standardized-filter input,
.myi-ux-standardized-filter select,
.myi-ux-standardized-filter textarea,
.myi-ux-standardized-filter button {
    max-width: 100%;
}


/* -------------------------------------------------------------------------- */
/* Status semantics                                                           */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-status {
    display: inline-flex;
    align-items: center;
    gap: var(--myi-ux-space-2, 8px);
}


/* -------------------------------------------------------------------------- */
/* Table containment                                                         */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.myi-ux-standardized-table-wrap > table {
    width: 100%;
}


/* -------------------------------------------------------------------------- */
/* Explicit state surface                                                    */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-state {
    min-width: 0;
}

.myi-ux-standardized-state[aria-busy="true"] {
    cursor: progress;
}


/* -------------------------------------------------------------------------- */
/* Controls / pagination                                                      */
/* -------------------------------------------------------------------------- */

.myi-ux-standardized-pagination {
    min-width: 0;
}

.myi-ux-standardized-control:focus-visible {
    outline: 3px solid var(--myi-ux-focus, rgba(96, 165, 250, 0.88));
    outline-offset: 2px;
}


/* -------------------------------------------------------------------------- */
/* Dynamic organizational presentation                                       */
/* -------------------------------------------------------------------------- */

[data-myi-org-node-id] {
    min-width: 0;
}

[data-myi-org-node-type]::after {
    content: attr(data-myi-org-node-type);
    margin-inline-start: 0.45rem;
    opacity: 0.66;
    font-size: 0.72em;
}


/* -------------------------------------------------------------------------- */
/* Responsive information preservation                                       */
/* -------------------------------------------------------------------------- */

@media (max-width: 760px) {

    .myi-ux-standardized-filter {
        width: 100%;
    }

    .myi-ux-standardized-table-wrap {
        overscroll-behavior-inline: contain;
    }
}
