CIS mobile allows administrators to customize the layout, design, and visibility of user interface elements using CSS stylesheets. This enables not only visual changes but also dynamic control over which fields or columns are shown or hidden, and in what order.

The system includes various base stylesheets:

• mystyle.default.css: Default system styling
• mystyle.bw.css, mystyle.rd.css, etc.: Variations for color schemes and layout preferences
• custom.style.css: This is key for customer-specific modifications or overrides to the standard look and feel

Example:

.tabcontainer {
    margin: 10px 8px 1px 8px;
    border-radius: 5px;
    background: linear-gradient(rgb(248, 248, 248), rgb(240, 240, 240));
}
.colhead01 {
    font-weight: bold;
    color: white;
    padding: 2px 2px 0px 9px;
}

These settings control the general appearance of components like table headers or section containers.

A powerful feature of CIS mobile is assigning a dedicated stylesheet to each user group. These files are named accordingly, for example: config.v01.style.css for the sales group V01.

These group-specific stylesheets allow precise control over what each user sees:

• Fields can be hidden or shown individually
• The display order of fields can be defined
• Special fields like icons or action buttons can be toggled based on roles

Example for detail fields in a contact view:

[class*="config-contact-"] { display: none; }
.config-contact-lastname { order: 1; display: inline-block; }
.config-contact-firstname { order: 2; display: inline-block; }
.config-contact-email { order: 3; display: inline-block; }

Example for table columns in an offers list:

[class*="config-table-newoffers-"] { display: none; }

.config-table-newoffers-name1 { order: 1; display: inline; }
.config-table-newoffers-netwr { order: 2; display: inline; }
.config-table-newoffers-addontext { order: 3; display: inline; width: 250px !important; }

:lang(de) .config-table-newoffers-coltitle-addontext:before {
    content: "Sales note";
}

This concept ensures that each user or user group only sees the information relevant to their role. It improves clarity, usability, and productivity, especially in organizations with varying user requirements.