/* =============================================================================================
   Empresas / Unidades (VB6 firmas.frm) — the menu options of each company/unit. One bar with
   company, unit and buttons; every VB6 menu entry is a single line (tick box, title, one-letter marks;
   the VB6 screen in the tooltip), one block per menu category, flowing in columns. The panel fills the
   window down to the status bar (user's request: use the whole screen, not a compact block).
   ============================================================================================= */
main > .content:has(.unidades-menu) {
    display: flex;
    flex-direction: column;
}

.unidades-menu {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: .6rem;
    color: var(--cr-text);
}

    .unidades-menu .painel {
        padding: 1rem 1.25rem 1.1rem;
        background: rgba(255, 255, 255, 0.97);
        border-color: var(--cr-line);
    }

    .unidades-menu .unidades-opcoes {
        flex: 1;
    }

/* ---- Bar ---- */
.opcoes-barra {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1.5rem;
}

.opcoes-campo {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
}

    .opcoes-campo > span {
        font-size: .9rem;
        font-weight: 600;
        color: var(--cr-text-2);
    }

    .opcoes-campo .form-select-sm {
        width: auto;
        min-width: 16rem;
        max-width: 26rem;
        font-size: .95rem;
        padding-top: .3rem;
        padding-bottom: .3rem;
        color: var(--cr-text);
        border-color: rgba(15, 36, 64, 0.35);
    }

.opcoes-modo {
    display: flex;
    gap: 1.1rem;
    font-size: .95rem;
}

    .opcoes-modo label {
        display: flex;
        align-items: center;
        gap: .3rem;
        margin: 0;
        cursor: pointer;
    }

.opcoes-botoes {
    display: flex;
    gap: .4rem;
    margin-left: auto;
}

    .opcoes-botoes .btn-sm {
        font-size: .92rem;
        padding: .35rem .9rem;
    }

.opcoes-estado {
    margin: .7rem 0 0;
    font-size: .92rem;
    color: var(--cr-text-2);
}

/* ---- Legend and marks ---- */
.opcoes-legenda {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem 1.4rem;
    margin: .5rem 0 .9rem;
    font-size: .86rem;
    color: var(--cr-text-2);
}

.opcoes-legenda-dica {
    color: var(--cr-text-3);
}

.unidades-menu .marca {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 4px;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
    vertical-align: middle;
}

.unidades-menu .marca-web { background: rgba(19, 138, 90, 0.14); color: var(--cr-success); }
.unidades-menu .marca-oculta { background: var(--cr-blue-100); color: var(--cr-blue-600); }
.unidades-menu .marca-empresa { background: rgba(109, 40, 217, 0.12); color: #5b21b6; }
.unidades-menu .marca-sem { background: rgba(184, 110, 0, 0.14); color: var(--cr-warning); }
.unidades-menu .marca-retirada { background: rgba(200, 40, 60, 0.12); color: var(--cr-danger); }

/* ---- Option blocks, in columns ---- */
.opcoes-grupos {
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    margin: 0;
    min-width: 0;
}

    .opcoes-grupos:disabled {
        opacity: .55;
    }

.opcoes-colunas {
    column-width: 21rem;
    column-gap: .9rem;
}

/* A long category (Movimentos e listagens) may continue in the next column, so the columns come out even. */
.opcoes-grupo {
    break-inside: auto;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    margin: 0 0 .9rem;
    padding: .45rem .6rem .55rem;
    border: 1px solid var(--cr-line-strong);
    border-radius: 8px;
    background: #fff;
}

    .opcoes-grupo header {
        break-after: avoid;
        display: flex;
        align-items: baseline;
        gap: .4rem;
        margin: 0 0 .3rem;
        padding: .1rem .2rem .35rem;
        border-bottom: 1px solid var(--cr-line);
    }

    .opcoes-grupo h3 {
        margin: 0 auto 0 0;
        font-size: .98rem;
        font-weight: 700;
        color: var(--cr-ink-900);
    }

.opcoes-marcar {
    padding: 0;
    border: 0;
    background: none;
    color: var(--cr-blue-600);
    font-size: .8rem;
    cursor: pointer;
}

    .opcoes-marcar:hover {
        text-decoration: underline;
    }

.opcoes-submenu {
    break-after: avoid;
    margin: .3rem 0 .05rem .3rem;
    font-size: .84rem;
    font-weight: 600;
    color: var(--cr-text-3);
}

.opcao {
    break-inside: avoid;
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    padding: .2rem .3rem;
    border-radius: 5px;
    font-size: .93rem;
    line-height: 1.35;
    cursor: pointer;
}

    .opcao:hover {
        background: rgba(42, 91, 234, 0.06);
    }

    .opcao.no-submenu {
        padding-left: 1.3rem;
    }

    .opcao input {
        flex: none;
        align-self: flex-start;
        width: 1.05rem;
        height: 1.05rem;
        margin: .15rem 0 0;  /* on the first line when the title wraps */
        accent-color: var(--cr-blue-600);
        cursor: pointer;
    }

    /* Entries that no longer open anything in VB6, in a lighter colour. */
    .opcao.sem-ecra .opcao-titulo {
        color: var(--cr-text-3);
    }

/* A title that does not fit breaks onto the next line (never cut with "…"). */
.opcao-titulo {
    min-width: 0;
    margin-right: auto;
    overflow-wrap: anywhere;
}