:root {
    --con-red: #cd212a;
    --con-text: #333;
    --con-sidebar-padding-x: 0px; /* individual padding for left and right side*/
    --con-sidebar-border: 1px solid #e4e4e7;
    --con-sidebar-width: 200px; /* for content */
    --con-sidebar-width-effective: 201px; /* 200 + (2 * var(--con-sidebar-padding-x)) + sidebar-border-width  */
    --con-sidebar-bg: #fafafa;
    --con-topbar-height: 45px;
    --con-main-bg: #ebebe9;
    --pf-global--BoxShadow--lg: 0 0.1875rem 0.4375rem 0.1875rem rgba(3, 3, 3, 0.13), 0 0.6875rem 1.5rem 1rem rgba(3, 3, 3, 0.12);
}

html, body{
    height: 100vh;
    padding: 0;
    margin: 0;
}

/* html { overflow-y: scroll; } */

body { margin: 0;
    padding: 0;
    min-height: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing:grayscale;
    background: var(--con-main-bg);
    font-family: "Titillium Web", Arial, sans-serif;
    font-size:16px;
    color: #333;
}

a {
    text-decoration: none;
    color: var(--con-red);
}

input[type="checkbox"] {
    background-color: #2d97c5 !important;
}

.material-icons {
    font-size: 18px;
    color: var(--con-text);
}

.layout-wrapper {
    padding: 0;
    display: flex;
    height:100vh
}

.layout-topbar {
    position: fixed;
    display: none;
    left: var(--con-sidebar-width-effective);
    height: var(--con-topbar-height);
    color: #fff;
    z-index: 999;
    right: 0;
    background: var(--con-sidebar-bg);
    transition: left .2s;
    border-bottom: var(--con-sidebar-border);
}

.layout-sidebar {
    z-index: 999;
    user-select: none;
    position: sticky;
    height: 100vh;
    top: 0;
    left: 0;
}

.layout-main {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--con-main-bg);
}

#layout-header {
    min-width: 800px;
    flex-shrink: 0;
    background: var(--con-sidebar-bg);
    overflow: hidden;
}

#layout-content {
    overflow-y: scroll;
    max-height: 100%;
    scrollbar-width: none;
}

#layout-content.with-navigator {
    padding-left: 40px;
}

.logged-out .layout-wrapper { flex-direction: column;}
.logged-out .layout-main { margin-left: 0; margin-top: var(--con-topbar-height); padding-top: 2rem;}
.logged-out .layout-sidebar { width: 0px; padding: 0;}
.logged-out .layout-topbar { left: 0px; background: var(--con-red); display: none;}
.logged-out #navigation-action { display: none !important; }


.brand h1 {
    display:block;
    vertical-align:top;
    margin:6px 0 3px 0;
    letter-spacing: 1px;
    font-weight: 600;
    font-size: 20px;
    height: 29px;
}

.layout-topbar .brand { display: none; }
.logged-out .layout-topbar .brand { display: inline-block; margin-left: 20px; }

#session-state {
    margin: 0 auto;
    max-width: 500px;
    display: flex;
    flex-direction: column;
}

#session-state svg {
    margin: 0 auto 50px auto;
}

#login-result {
    background: #fff;
    padding: 30px 40px;
    box-shadow: var(--pf-global--BoxShadow--lg);
}

.login-result-loading {
    background: #fff url("../img/loading2.gif") 450px 30px no-repeat !important;
}

#login-result .gwt-ListBox {
    width: 100%;
}

#profile { display: flex; margin-bottom: 20px; align-items: stretch; }

#settings, #logout {
    cursor: pointer;
}

#logout {
    align-self: end;
}

#footer {font-size: 12px; color:#bbb; display: flex; justify-content: center; align-items: center; margin: 10px 0 0 0;}
    #footer-vue {display: inline-flex;align-items: center;}

/* ---- loginbox ---- */

.loginbox, .logoutbox { background: var(--con-red); width:438px; margin: 150px auto 50px auto;
            color: white; padding: 21px 0 10px 0; position: relative; }

    .loginbox h2 { color: var(--con-red); font-size: 25px; margin: -70px 0 40px 0; }
    .loginbox label {display:block; float:left; margin: 0 0 0 20px; padding: 4px 10px 0 0; text-align:right; width:70px; font-size:16px; font-weight: bold;}
    .loginbox .btn-login { width:70px; position:absolute; top:81px; right:30px;
        -webkit-transition: background 0s;
        -moz-transition: background 0s;
        -ms-transition: background 0s;
        -o-transition: background 0s;
        transition: backgroud 0s;}
    .loginbox .btn-login-loading { width:70px; position:absolute; top:81px; right:30px; text-indent: 9999px; overflow:hidden; display: block; background: #f5f5f5 url("../img/loading2.gif") 25px 5px no-repeat; }
    .loginbox .editUserField { background: #fff url(../img/icon_mail.png) 190px 6px no-repeat; }
    .loginbox .editPasswordField { background: #fff url(../img/icon_key.png) 188px 8px no-repeat; }
    .loginbox .logoutSuccess { width: 160px; text-align:left; }
    .loginbox .alert-error {margin: 0 30px 10px 30px;}


/* ----- navigation system tool, navigation top ---- */

#navigation-top { }

    #navigation-top .wrapper { overflow:hidden; }
        #navigation-top .tab { border-radius: 4px; padding:8px 10px 8px 10px; cursor:pointer; }
        #navigation-top .tab:hover { color: var(--con-red) }
        #navigation-top .active { background:#ddd;}
        #navigation-top #logout { color:#fff; background: var(--con-red); float:right; margin-right:0; }
        #navigation-top #settings { float:right; margin-left:5px; margin-right:0px; background: var(--con-red); color: #fff; font-size: 22px; padding: 7px 5px 7px 9px; }
        #navigation-top .settings-active { background: #fff; color: #666;}
        #navigation-top #target-list .tab { float:left; display:block; color:#666; background:#ddd; padding:8px 10px 8px 10px; margin: 10px 0 0 10px;
    font-size: 16px; text-decoration:none; cursor:pointer; }
        #navigation-top #target-list .active {position:relative; z-index:10; background:#fff; border: 1px solid #ddd; border-bottom:none; padding:7px 9px 9px 9px; margin-bottom:-1px; }
        #navigation-top #connectorName { display: none; float:right; color:var(--con-red); font-size:18px; margin: 14px 20px 12px 0;}
        #navigation-top #connectors { display: flex; flex-direction: column; gap: 10px;}

/* ----- notifications ----- */

#notifications { width: 200px; position: fixed; bottom: 0px; right: 10px;}

/* ----- navigation target ----- */

#navigation-target { margin-top: 20px; }

    #navigation-target .wrapper { background: #f4f4f4; height: 46px; border: 1px solid #ddd; border-bottom:none;  }
        #navigation-target .tab { float:left; display:block; color:#666; background:#ddd; padding:8px 10px 8px 10px; margin: 10px 0 0 10px;
            font-size: 16px; text-decoration:none; cursor:pointer; }
        #navigation-target .active {position:relative; z-index:10; background:#fff; border: 1px solid #ddd; border-bottom:none; padding:7px 9px 9px 9px; margin-bottom:-1px; }
        #navigation-target .systemToolName { float:right; color:var(--con-red); font-size:18px; margin: 14px 20px 0 0;}

/* ----- navigation action ----- */

#navigation-action {
    background: #fff;
    border-bottom: var(--con-sidebar-border);
    display: flex;
    min-width: 940px;
    padding: 10px 0 10px 30px;
    position: fixed;
    top: 52px;
    width: 100%;
    z-index: 800;
}
    #navigation-action .wrapper { }
    #navigation-action .action-list { overflow:hidden; }

#navigation-action .tab {
    display: block;
    float: left;
    color: #777;
    font-size: 16px;
    cursor: pointer;
    padding: 3px 10px 3px 10px;
    margin: 0 0 0 5px;
    border-radius: 5px;
}

#navigation-action .tab:hover {
    background: #eee;
    color: #777777
}

#navigation-action .tab-active, #navigation-action .tab-active:hover {
    background: #666;
    color: #fff;
}


    #navigation-action .taskLink { opacity: 0.4; }
    #navigation-action .taskLink:hover { opacity: 0.8; }
    #navigation-action .tab-active .taskLink { opacity: 0.8; }
    #navigation-action .tab-active i.icon-tasks { }

/* ------ content ------- */

#content { }
    .contentWithActionNavigation { margin-top: 30px !important; margin-bottom: 30px !important; }
    #content.contentWithNavigatorIFrame { width: 1400px !important; }

    #content .wrapper {padding: 20px;
        border: 1px solid #e4e4e4;
        margin: 0; background: #fff; overflow: hidden; min-width: 898px; }
    #content h4 {font-weight: normal; font-size: 16px; color:#666; padding-left: 10px;}
    #content h3 {border-bottom: 1px solid #ddd; margin: 20px 10px 30px 10px;}

    .list-panel {}
        #taskList { list-style: none; padding: 0 0 20px 20px; margin: 0 0 10px 0; }
        #taskList li { padding-top: 0.5em; }
        #taskList li input { vertical-align: middle; display: inline-block;}
        #taskList li label {margin: 5px 0 0 5px; display: inline-block; vertical-align: middle; font-size: 16px; }

    .login-panel { padding: 10px 10px 10px 10px; }
        .login-panel p { text-align: left; }
        .login-panel label { width: 150px; text-align: left; display: inline-block; font-size: 16px; cursor: default; }
        .login-panel .gwt-Label, .login-panel input { width: 600px; display: inline-block; font-size: 16px; margin: 0 0 5px 10px; }
        .login-panel .gwt-Label { cursor: default; }
        .login-panel input { width: 200px;  font-family: "Titillium Web", Arial, sans-serif; color: #666;}
        .login-panel input.gwt-FileUpload { width: 480px; }
        .login-panel input[type="checkbox"] { width: 15px; }
        .sales-cloud label { width: 250px; }
        .login-salescloud label { width: 220px; }
        .login-panel .error { display: inline; font-size: 12px; color: var(--con-red); margin-left: 10px;}
        .login-panel .success { color: #3a923a; display: inline; font-size: 12px; margin-left: 10px;}

        .login-panel .targetselection span { display: block; float:left; width: 400px;}
        .login-panel .targetselection span input { width: 30px; }
        .login-panel .targetselection span label { width: 350px; }

    .add-mapping-panel {}
    .add-mapping-panel h4 i {margin: 3px 0 0 4px;}
    .add-mapping-panel select { width: 240px; margin: 5px 0 10px 10px; }
    .add-mapping-panel input { width: 226px; }
    .add-mapping-panel .gwt-CheckBox input { width: 20px;}
    .add-mapping-panel button.inline { display: inline; padding:0; margin: 0 0 4px 5px; }
    .add-mapping-panel .loading { display: inline; width: 30px; height: 30px; margin: 0 0 0 10px; }
    .add-mapping-panel .hide { display: none !important;}

    .source-crmentity { position: relative;}
    .source-crmentity .editLink { position: absolute; top: 0px; right: 0px; margin-right: 0px !important;}
    .source-crmentity .editLink, .cellTreeTopItem .editLink  {display: none;}
    .source-crmentity:hover .editLink, .cellTreeTopItem:hover .editLink {display: block;}

    .icon-red { background-image: url("../img/glyphicons-halflings-red.png") }

    .cellListSelectedItem .icon-pencil, .cellListSelectedItem:hover .icon-pencil {
        background-image: url("../img/glyphicons-halflings-white.png");
    }

    .cellListSelectedItem .editLink, .cellListSelectedItem:hover .editLink {
        opacity: 1.0;
    }


.form-panel { border-top: 1px solid #ddd; padding: 20px 0; overflow: hidden; display: block; margin: 0 10px 0 10px;}
        .form-upload { margin: 0 0 0 10px; }

    .form-upload-import { margin: 0 0 20px 10px; }

    .loading { display: none; width:800px; margin: 0 0 20px 20px; padding: 0 0 0 25px; background: url(../img/loading2.gif) left 2px no-repeat; }

    .loading-visible { display: block; }

    .lastExecutionsTable { width: 880px; margin: 10px 0 20px 10px; border-bottom: 1px solid #ddd;}

    .lastExecutionsTable td { vertical-align: middle; text-align: center; padding: 8px 2px;}

    .lastExecutionsTable tr:first-child {}

    .lastExecutionsTable tr:first-child td { font-weight: bold; color: #111; border-top:none; }

    .lastExecutionsTable tr:first-child td:first-child { width: 35%; text-align: left; word-wrap: break-word; }

    .lastExecutionsTable tr td { word-wrap: break-word;}

    .lastExecutionsTable tr td:first-child { text-align: left; width: 35%; word-wrap: break-word;}
    .lastExecutionsTable tr td:first-child .gwt-Label { width: 300px; overflow: hidden; word-wrap: break-word; display: inline-block; }
    .lastExecutionsTable tr td:first-child .deleted { text-decoration: line-through;  }

    .lastExecutionsTable .statisticsLink,
    .lastExecutionsTable .logLink,
    .lastExecutionsTable .failedLink,
    .lastExecutionsTable .deleteLink,
    .deleteLink,
    .editLink,
    .deleteTask,
    .duplicateLink {
        cursor: pointer;
        margin-top: 3px;

        /* Required for IE 5, 6, 7 */
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
        filter: alpha(opacity=40);
        -moz-opacity:0.4;
        -khtml-opacity: 0.4;
        opacity: 0.4;
    }

    .deleteTask {
        display: inline-block;
        margin: 3px 0 0 10px;
        vertical-align: middle;
    }

    .duplicateLink {
        background: transparent url(../img/icon_clone.png) left top no-repeat;
        width: 16px;
        height: 16px;
    }


    .lastExecutionsTable .failedLinkDisabled {
            /* Required for IE 5, 6, 7 */
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
            filter: alpha(opacity=20);
            -moz-opacity:0.2;
            -khtml-opacity: 0.2;
            opacity: 0.2;
        }

    .lastExecutionsTable .logLink:hover,
    .lastExecutionsTable .logLink.active,
    .lastExecutionsTable .failedLink:hover,
    .lastExecutionsTable .failedLink.active,
    .lastExecutionsTable .deleteLink:hover,
    .lastExecutionsTable .deleteLink.active,
    .lastExecutionsTable .statisticsLink:hover,
    .lastExecutionsTable .statisticsLink.active,
    .deleteLink:hover,
    .editLink:hover,
    .deleteTask:hover,
    .deleteTask:active,
    .duplicateLink:hover,
    .duplicateLink:active {
            /* Required for IE 5, 6, 7 */
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
            filter: alpha(opacity=60);
            -moz-opacity:0.6;
            -khtml-opacity: 0.6;
            opacity: 0.6;
        }

    .lastExecutionsTable .badge {padding-top:3px;}
    .lastExecutionsTable .badge-important {background: #c4001f;}

    #resultTable { margin: 10px 0 10px 20px; }
    #resultTable tr td { text-align: left; padding: 10px; }
    #resultTable tr td:first-child { width: 150px; padding-right: 10px; }
    #resultTable .gwt-Label { display: inline-block; }

    .allTasksTable { width: 880px; margin: 20px 0 0 10px;}
    .allTasksTable td { vertical-align: middle; text-align: right; }
    .allTasksTable tr td:nth-child(1) { width: 15px; }
    .allTasksTable tr td:nth-child(2) { text-align: left; }

    .popup-panel { display: none; }
    .open .popup-panel { display: block; }

/* ----- popup ------ */

.gwt-PopupPanelGlass {
    background: #000;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;

    z-index: 1005;
}

.gwt-DialogBox {
    z-index: 1010;
}

.gwt-DialogBox .dialogTopCenterInner {
    padding: 10px 20px;
    background: #c4001f;
    color: #fff;
    border-radius: 10px 10px 0 0;
}

.gwt-DialogBox .dialogContent {
    padding: 20px 20px 20px 20px;
    background: #fff;
    border-radius: 0 0 10px 10px;
}

.gwt-DialogBox .dialogContent .btn {
    font-size: 14px;
    padding-left: 13px;
    padding-right: 13px;
    margin: 20px 20px 0 0;
    color: #333;
}

.gwt-DialogBox .dialogContent select {
    margin: 15px 0 0 0;
}

/* ----- preview in report tool ----- */

table.multiline-table tbody tr td { overflow: visible !important; }
table.multiline-table div.preview-container { position: relative; }
table.multiline-table div.preview-container div.full-container { display: none; position: absolute !important; z-index: 1150 !important; top:0 !important; left:0 !important; width: 600px; min-height: 100px; overflow-x: scroll; }
table.multiline-table div.preview-container:hover div.full-container,
table.multiline-table div.preview-container div.full-container:hover { display: block !important; background: #ffffff !important; border: 1px solid black  !important; }

.panel-logfileviewer { padding: 2px; margin-bottom: 10px; overflow-y: auto; overflow-x: hidden; height: 350px; max-height: 350px; }


/* ----- mapping ----- */

.mapping-header button { margin: 7px 10px; }

.mapping-panel { margin: 10px 10px 0 10px; border: 1px solid #ddd; overflow: hidden; border-collapse: separate; clear:both; }

    .mapping-entity-panel { vertical-align: top; width: 200px; border-right: 1px solid #ddd; }

      .mapping-source-objects {display: flex; flex-direction: column; justify-content: space-between;}

        .mapping-entity-list-header { padding: 10px; font-weight: bold; border-bottom: 1px solid #ddd; }
            .mapping-header-entity { }

        .mapping-source-object-list { overflow: scroll; }

        /*.mapping-entity-list .loading3 { background: #646161 url(../img/loading3.gif) right 2px no-repeat; }*/

    .mapping-rule-panel { vertical-align: top; width: 675px; }

        .mapping-rule-list-loading { padding: 7px 0 0 45px;
            height: 30px;
            background: url(../img/loading2.gif) 17px 10px no-repeat;
            border-bottom: 1px solid #ddd;
            position: absolute;
            width: 630px;
        }

        .mapping-rule-list-empty {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 0;
            height: 100px;
            background: #fff;
            border-bottom: 1px solid #ddd;
            position: absolute;
            width: 675px;
            z-index: 900;
        }

        .mapping-rule-list-empty-label {
            font-size: 16px;
            color: #666;
        }

        .empty-mapping-button {
            color: #fff;
            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
            background-color: #2d97c5FF;
            background-repeat: repeat-x;
            border-color: #04c #04c #002a80;
            border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
            background-image: linear-gradient(to bottom, #2d97c5FF, #2d97c5FF);
        }

        .empty-mapping-button:hover {
            background-position: 0 0;
            color: #fff;
            background-color: #4eadd7ff;
            background-image: linear-gradient(to bottom, #4eadd7ff, #2d97c5FF);
        }

.mapping-rule-list-header { padding: 10px; font-weight: bold; border-top: 1px solid #ddd; overflow: hidden; }
            .mapping-header-crmod { float:left; padding-left: 0px; }
            .mapping-header-fusioncrm { float:right; padding-right: 7px; }

        .mapping-rule-scrollpanel {  }

            .mapping-rule-group { overflow: hidden; vertical-align: middle; }
                .mapping-rule-group-name { text-align: right; display: block; float:right;}
                .mapping-rule-group-name .repeat {margin:2px 5px 0 0;float:right;height:14px;
                    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
                    filter: alpha(opacity=40);
                    -moz-opacity:0.4;
                    -khtml-opacity: 0.4;
                    opacity: 0.4;}
                .mapping-rule-group-name .editLink {display:none; float:right; margin:2px 5px 0 0; height: 14px;}
                .mapping-rule-group:hover .editLink { display: block;}

            .mapping-rule { overflow: hidden; vertical-align: middle; }

                .mapping-rule-source {display: block; float:left; width: 60%;}
                    .mapping-rule-source select { float:left; margin: 0; padding: 2px 6px; height: 25px; }
                    .mapping-rule-source input { float:left; margin: 0; padding: 2px 6px; height: 20px; }
                    .mapping-rule-source button { float:left; margin: 2px 0 0 5px;}
                    .updating-mapping-rule { display: block; float:left; width:16px; height:16px; margin: 5px 0 0 5px; padding: 0; background: url(../img/loading2.gif) left top no-repeat; }

                .mapping-rule-destination {display: block; float:right; width: 40%; text-align: right; padding: 3px 0 0 0; }

            .mapping-rule .editLink {display: none;float:right;width:14px;height:14px;margin:1px 7px 0 0;}
            .mapping-rule:hover .editLink {display: block;}

            .dropdown-menu { padding: 9px 0; }

            .dropdown-menu .gwt-CheckBox input{
                float:left;
                margin-right: 10px;
            }

            .dropdown-menu li {
                padding: 0 5px 0 10px;width: 310px;
            }

.mapping-rule-show-all { float:left; width: 655px; display:block; margin: 0 0 0 211px; padding: 10px; border: 1px solid #ddd; border-top: none;}
    .mapping-rule-show-all button { float:left; margin: 0 10px 0 0; }
    .mapping-rule-show-all span { float:left; display:block; padding: 2px 0 0 0; font-size: 14px;}
        .mapping-rule-show-all span input { float:left; margin: 3px 4px 0 0; }

.lov-scrollpanel { padding-bottom: 45px;max-height:300px;}

/* ----- task validator ------ */

.evaluator-row {
    margin-bottom: 10px;
}

.evaluator-row .evaluator-form .label-validator {
    min-width: 150px;
}

/* ----- migration wizard ------ */

.migrator-task-list-simple {display: inline-block; width: 680px; margin: 0 0 20px 20px;}
    .migrator-task-list-simple > div > div { background: url(../img/bullet_point_2.png) left 9px no-repeat;}

.migrator-task-list-scrollpanel { display:inline-block; width: 680px; height:250px; vertical-align: top; margin: 0 0 40px 10px; border: 1px solid #ddd; }
    .migrator-task-list {  }



.migrator-credentials { width: 350px; vertical-align: top; display: inline-block; padding: 0 30px 0 50px; margin-bottom: 20px; }
    .migrator-credentials legend { font-size: 16px;font-weight: bold;border-bottom:none; }
    .migrator-credentials .control-label { width: auto;}
    .migrator-credentials .controls { margin-left: 100px;}

.migrator-taskexecution-list {margin: 0 0 20px 0;}

/* ----- task editor ----- */

.cell-cb { width: 20px; max-width: 20px; }

.clmn-thirds { width: 274px; }
.clmn-halfs { width: 425px; }
.clmn-full { width: 850px; }
.clmn-center { margin-left: 14px; margin-right: 14px; }
    div.clmn-thirds input.manage-size { width: 270px; margin: 0; padding: 2px; margin-bottom: 10px; }
    div.clmn-halfs input.manage-size { width: 421px; margin: 0; padding: 2px; margin-bottom: 10px; }
    div.clmn-full input.manage-size { width: 844px; margin: 0; padding: 2px; margin-bottom: 10px; }

.clmn-thirds button,
.clmn-halfs button,
.clmn-full button,
.clmn-center button { margin-bottom: 10px; }

div.table-container { padding: 2px; margin-bottom: 10px; max-height: 250px; overflow-y: auto; }
    div.table-container table { width: 100%; }
    div.table-container table tr.odd-row-selected,
    div.table-container table tr.odd-with-tasks { background-color: #ae000b; color: white; }
    div.table-container table tr.odd-row-selected td,
    div.table-container table tr.odd-with-tasks td { border: 1px #ae000b solid; }
    div.table-container table tr.even-row-selected,
    div.table-container table tr.even-with-tasks { background-color: #c4001f; color: white; }
    div.table-container table tr.even-row-selected td,
    div.table-container table tr.even-with-tasks td { border: 1px #c4001f solid; }

.loading-panel { width: 250px; height: 80px; text-align: center; vertical-align: middle; background-color: white; z-index: 1010; }
.loading-panel-content { display: inline-block; vertical-align: middle; }

.constraintDialogBox .dialogContent input { width: 750px; margin: 2px 0 5px 0 !important; }
.constraintDialogBox .dialogContent select { width: 760px; margin: 2px 0 5px 0 !important; }
.constraintDialogBox .dialogContent .table-container { width: 750px; padding: 2px; margin-bottom: 5px; max-height: 250px; overflow-y: auto; }
.constraintDialogBox .dialogContent table.constraint-table { width: 730px; margin: 0 !important; }

/* ----- siebel-add --- */

    .siebel-add-panel { padding: 10px 10px 10px 10px; }
        .siebel-add-panel p { text-align: left; }
        .siebel-add-panel label { width: 150px; text-align: left; display: inline-block; font-size: 16px; cursor: default; }
        .siebel-add-panel .gwt-Label { width: 600px; display: inline-block; font-size: 16px; margin: 0 0 5px 10px; }
        .siebel-add-panel .gwt-Label { cursor: default; }
        .siebel-add-panel .error { display: inline; font-size: 12px; color: #c4001f; margin-left: 10px;}
        .siebel-add-panel .success { color: #3a923a; display: inline; font-size: 12px; margin-left: 10px;}

        .siebel-add-panel .targetselection span { display: block; float:left; width: 400px;}
        .siebel-add-panel .targetselection span input { width: 30px; }
        .siebel-add-panel .targetselection span label { width: 350px; }

/* ----- statistics ----- */

.details-tool {
    margin-top: 10px;
}

button.hidden {
    display: none;
    visibility: hidden;
}

.wrapper p.description {
    float: left;
    margin: 0 10px 10px 10px;
    color: #666;
    font-size: 16px;
    width: 100%;
}

.wrapper div.hidden {
    display: none !important;
    visibility: hidden;
}

.wrapper .log-statistics-subpanel { margin-left: 30px; }
.wrapper .log-statistics-subpanel select { margin-bottom: 5px; }

.wrapper .subpanel .filter-label { width: 100px; }
.wrapper .subpanel .statistics-label { width: 60px; margin-top: 3px; }
.wrapper .subpanel .statistics-label-wide { width: 130px; margin-top: 3px; }
.wrapper .statistics-list-panel { width: 880px; border: 1px solid #eee; }
.wrapper .user-warning { color: #c4001f; font-weight: bold; }

.wrapper .log-statistics-panel { margin-left: 10px; margin-bottom: 15px; }
.wrapper .execution-panel { max-height: 150px; margin-bottom: 10px; overflow-y: auto; }
.wrapper .statistic-panel,
.wrapper .value-panel { overflow-y: auto; overflow-x: hidden }

.wrapper .statistic-panel { height: 200px; max-height: 200px; }
.wrapper .value-panel { height: 300px; max-height: 300px; }

.wrapper .statistics-list-panel table tr.odd-row-selected,
.wrapper .statistics-list-panel table tr.even-row-selected { background-color: #c4001f; color: white; }
.wrapper .statistics-list-panel table tr td { border: 0; }

.wrapper .filter-list-panel { border: 1px solid #eee; }
.wrapper .filter-details-panel table,
.wrapper .filter-list-panel table { border: 0; min-height: 100px; }
.wrapper .filter-details-panel table tr td { border: 0; }
.wrapper .filter-details-panel table tr td div { min-height: 32px !important; }
.wrapper .filter-details-panel table tr td input { margin: 0; }
.wrapper .filter-list-panel table tr.odd-row-selected,
.wrapper .filter-list-panel table tr.even-row-selected { background-color: #c4001f; color: white; }
.wrapper .filter-list-panel table tr td { border: 0; }


/* ----- entity definition tasks ----- */

.wrapper .subpanel .definition-label { width: 125px; }

div.definition-list-panel { padding: 0; min-width: 865px; margin-bottom: 10px; border: 1px solid #eee; }
div.definition-list-panel table { border: 0; width: 100%; }
div.definition-list-panel table tr { background-color: white; border-bottom: 1px solid #eee; padding: 0; }
div.definition-list-panel table tr td { border: 0; overflow: hidden; text-overflow: ellipsis; margin: 0; padding: 2px 15px; }
div.definition-list-panel table .duplicateLink { width: 15px; height: 22px !important; }


/* ----- analyzer ----- */

.analyzer-pager {
    display: inline-block;
}

.analyzer-pager .pager-button {
    margin-top: 3px;
}

.analyzer-pager .label-ctc-pager {
    display: inline-block;
    margin-top: 5px;
    text-align: center;
}

.analyzer-pager .pager-button i {
    cursor: pointer;
    color: #c4001f;

    /* Required for IE 5, 6, 7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity:1.0;
    -khtml-opacity: 1.0;
    opacity: 1.0;
}

.analyzer-pager .inactive i {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    -moz-opacity:0.4;
    -khtml-opacity: 0.4;
    opacity: 0.4;
}

li.hidden {
    display: none;
    visibility: hidden;
}

.btn-analyzer {
    min-width: 225px;
}

.wrapper .panel-inspection-inner {
    padding: 0;
}

.wrapper .panel-inspection ul.inspection-list-horizontal {
    padding: 0;
    margin: 5px 0 0 10px;
}

.wrapper .panel-inspection ul.inspection-list-horizontal li {
    display: block;
    padding: 0;
    margin: 0 55px 0 0;
    float: left;
}

.wrapper .panel-inspection ul.inspection-list-horizontal li .gwt-CheckBox input,
.wrapper .panel-inspection ul.inspection-list-horizontal li .gwt-CheckBox label {
    float: left;
    margin-right: 10px;
}

.inspection-list-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 30px 30px;
    grid-gap: 0px 10px;
    padding: 10px;
    grid-template-areas: "record_cnt_filter . . ." "empty . . .";
}

.inspection-list-grid div {
    display: flex;
    align-items: center;
}

.inspection-list-grid div .gwt-CheckBox {
    display: flex;
    gap: 5px;
    margin-top: 0;
}

.inspection-list-grid div .gwt-CheckBox input[type="checkbox"] {
    padding: 0;
    margin: 2px 0 0 0;
}

.inspection-list-grid div .gwt-CheckBox label {
    display: inline;
    margin: 0;
}

.wrapper .panel-inspection-table {
    min-height: 250px;
    max-height: 250px;
    overflow: hidden;
}

.wrapper .panel-inspection-table table tr {
    white-space: nowrap;
}

.wrapper .panel-inspection-table-large {
    min-height: auto;
    max-height: none;
}

.wrapper .panel-inspection-border {
    border: 1px solid #eee;
    width: 885px;
    overflow: hidden;
}

.wrapper .panel-inspection-statistics {
    border: 1px solid #eee;
    width: 885px;
    min-height: 350px;
    max-height: 350px;
    overflow: auto;
}

.wrapper .height-maximum {
    min-height: 375px;
    max-height: 375px;
    overflow: auto;
}

.wrapper .panel-inspection-statistics input.inspection-statistic-field {
    width: 125px;
    text-align: right;
}
.wrapper .panel-inspection-statistics input.inspection-statistic-field-wide {
    width: 224px;
    text-align: right;
}

.wrapper .overview-label-inputaligned { margin-top: 5px; }

.wrapper .overview-label { width: 120px; margin-top: 3px; }
.wrapper .overview-label-small { width: 80px; margin-top: 3px; }
.wrapper .overview-label-wide { width: 190px; margin-top: 3px; }

.wrapper .panel-inspection-border { border: 1px solid #eee; }

.wrapper .panel-inspection-table { border: 1px solid #eee; }
.wrapper .panel-inspection-table table { border: 0; cursor: pointer; margin: 0; }
.wrapper .panel-inspection-table table tr td { border: 0; overflow: hidden; text-overflow: ellipsis; margin: 0; padding: 0 10px; }
.wrapper .panel-inspection-table table tr.odd-row-not-selected,
.wrapper .panel-inspection-table table tr.even-row-not-selected { background-color: white; color: black; }
.wrapper .panel-inspection-table table tr.odd-row-selected,
.wrapper .panel-inspection-table table tr.even-row-selected { background-color: #c4001f; color: white; }
.wrapper .panel-inspection-table .disabled table { background-color: #f0f0f0; color: #999999; }
.wrapper .panel-inspection-table .disabled table tr.odd-disabled,
.wrapper .panel-inspection-table .disabled table tr.even-disabled { background-color: #f0f0f0; color: #999999; cursor: auto; }

.wrapper table tr .analyzer-button button { font-weight:bold;  }

.wrapper .panel-inspection-table tr.history { border-bottom: 1px solid #ddd; }
.wrapper .panel-inspection-table tr.history td { padding-top: 8px; padding-bottom: 8px; }

.wrapper .panel-inspection-table td.compact-cell { padding: 0 !important; }
.wrapper .panel-inspection-table div.tableLabel {
    margin-top: 3px;
    cursor: pointer;

    /* Required for IE 5, 6, 7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    -moz-opacity:0.4;
    -khtml-opacity: 0.4;
    opacity: 0.4;
}

.wrapper .panel-inspection-table div.tableLabel:hover,
.wrapper .panel-inspection-table div.tableLabel:active {
    /* Required for IE 5, 6, 7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    -moz-opacity:0.6;
    -khtml-opacity: 0.6;
    opacity: 0.6;
}

/* ----- generic pager ----- */
.ctc-pager {
    float: left;
    min-height: 38px;
}

.ctc-pager .pager-button {
    margin: 0;
    padding: 6px;
    min-height: 29px;
    min-width: 23px;
}

.ctc-pager .button-left {
    border-right: 1px #ddd solid;
}
.ctc-pager .button-right {
    border-left: 1px #ddd solid;
}

.ctc-pager .label-ctc-pager {
    display: inline-block;
    margin-top: 8px;
    text-align: center;
}

.ctc-pager .pager-button i {
    cursor: pointer;
    color: #c4001f;
    margin: 6px 4px;

    /* Required for IE 5, 6, 7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity:1.0;
    -khtml-opacity: 1.0;
    opacity: 1.0;
}

.ctc-pager .inactive i {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    -moz-opacity:0.4;
    -khtml-opacity: 0.4;
    opacity: 0.4;
}

/* ----- generic pager on source object list ----- */
.ctc-pager-source-object {
    display: flex;
    flex-direction: column;
}
.ctc-pager-source-object > div {
    display: flex;
    flex-direction: row;
    justify-content: center;
    padding: 8px 10px;
    border-top: 1px solid #ddd;
}

.ctc-pager-source-object .buttons {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 5px 10px;
    border-top: 1px solid #ddd;
    background: #f7f7f7;
}

.ctc-pager-source-object .buttons div {
    display: flex;
    flex-direction: row;
}

.ctc-pager-source-object .buttons div div {
    cursor: pointer;
    margin: 0;
    padding: 6px 2px;
}

.ctc-pager-source-object .buttons div div.inactive {
    opacity: 0.4;
    cursor: default;
}

/* ----- upload form help text ----- */

.form-upload-message table tr td {
    background-color: #f5f5f5;
    color: #333333;
    border: 1px solid rgba(0,0,0,0.15);
    padding: 2px 6px;
}

form-upload-message-examples {
    margin-top: 10px;
    overflow-x: scroll;
    border: 1px #ddd solid;
    padding: 10px;
}

/* ----- SuggestBox ------ */
.gwt-SuggestBoxPopup {
    background: #fff;
    border: 1px solid #ddd;
    z-index: 99999;
}

.gwt-SuggestBoxPopup td.item { padding: 5px 10px; }

.gwt-SuggestBoxPopup td.item-selected { background: #7ab5d3; }

/* ----- general ----- */
.btn { font-weight:bold; }

.btn[disabled],
.btn.disabled {opacity: 1.0;color: #bbb;}

.btn.sort-disabled {opacity: 0.4 !important;}

.btn-link { color: #c4001f; }

.btn-conemis-red {
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #c4001f;
    background-image: -moz-linear-gradient(top, #ae000b, #c4001f);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#ae000b),to(#c4001f));
    background-image: -webkit-linear-gradient(top,#ae000b,#c4001f);
    background-image: -o-linear-gradient(top,#ae000b,#c4001f);
    background-image: linear-gradient(to bottom,#ae000b,#c4001f);
    background-repeat: repeat-x;
    border-color: #ae000b #ae000b #c4001f;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ae000b',endColorstr='#c4001f',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.btn-conemis-red.active { color: rgba(255, 255, 255, 0.75); }

.btn-conemis-red:hover,
.btn-conemis-red:focus,
.btn-conemis-red:active,
.btn-conemis-red.active,
.btn-conemis-red.disabled,
.btn-conemis-red[disabled] {
    color: #ffffff;
    background-color: #c4001f;
    *background-color: #c4001f;
}

.btn-conemis-red:active,
.btn-conemis-red.active {
    background-color: #c4001f;
}

.underline { text-decoration: underline; }
.inline-block { display: inline-block;}
.bold { font-weight: bold; }
.hide { display: none; }
.margin-bottom-20 { margin-bottom: 20px; }
.margin-bottom-10 { margin-bottom: 10px !important; }
.margin-left-0 { margin-left: 0px; }
.margin-left-5 { margin-left: 5px; }
.margin-left-10 { margin-left: 10px; }
.margin-left-20 { margin-left: 20px; }
.margin-left-30 { margin-left: 30px; }
.margin-right-10 { margin-right: 10px; }

.margin-top-0 { margin-top: 0px !important; }
.margin-top-5 { margin-top: 5px; }
.margin-top-10 { margin-top: 10px; }
.border-top { border-top: 1px solid #ddd; }
.margin-top--3 { margin-top: -3px; }

.margin-all-5 { margin: 5px }
.margin-all-10 { margin: 10px }

div.wrapper div.margin-all-10 input, div.wrapper div.margin-all-10 label {
    float: left;
}
div.wrapper div.margin-all-10 label {
    margin-left: 5px;
}

.lbl-warning {
    width: 430px;
    position: absolute;
    float: left;
    display: inline;
    background: #fcf8e3;
    color: #c09853;
    padding: 5px 10px;
    border: 1px solid #fbeed5;
    margin: -1px 0 0 10px;
}

@font-face {
    font-family: 'conemis-icons';
    src: url('../font/fontello.eot?56496455');
    src: url('../font/fontello.eot?56496455#iefix') format('embedded-opentype'),
        url('../font/fontello.woff?56496455') format('woff'),
        url('../font/fontello.ttf?56496455') format('truetype'),
        url('../font/fontello.svg?56496455#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="conemis-icon-"]:before, [class*=" conemis-icon-"]:before {
    font-family: "conemis-icons";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
}

.conemis-icon-cog-1:before { content: '\e805'; }
.conemis-icon-cog:before { content: '\e800'; }
.conemis-icon-cog-2:before { content: '\e801'; }

.hide { display:none !important; }

.wrapper_navigator {
    position: relative;
    margin-top: 40px;
    overflow: hidden;
    width: 1500px;
    border: none;
}
.wrapper_navigator iframe {
    width: 100%;
    margin-left: -58px;
    margin-top: -108px;
    margin-bottom: -83px;
    border: none;
}

.wrapper_navigator div.navigatorLogin {
    position: absolute;
    top: 50px;
    left: 224px;
    z-index: -999;
}

.inspection_transfer_section {
    display: flex;
    align-items: center;
    padding: 10px 0 10px 10px;
}

.inspection_transfer_section button, .inspection_transfer_section input {
    margin: 0 5px 0 5px;
}

.inspection_transfer_section button {

}

.customizationPrevNextButtons {
    vertical-align: top;
    margin: 2px 0 0 5px;
}

.customization_list_cell, .customization_list_header {
    width:1900px;
    border-bottom:1px solid #eee;
}

.customization_list_header {
    background: #eee;
    font-weight: bold;
    padding: 10px 0;
}

.customization_list_header div {
    padding: 0 0 0 5px;
    margin: 0;
    width: 200px;
    display: inline-block;
}

.customization_list_cell .source_field, .customization_list_cell .dest_field {
    padding: 5px 0;
    margin: 0;
}

.customization_list_cell .source_field {
    color: #999;
}

.customization_list_cell .source_field div, .customization_list_cell .dest_field div {
    width:200px;
    display:inline-block;
    vertical-align:middle;
    word-wrap: break-word;
    margin: 0;
    padding: 0 0 0 5px;
}

.customization_list_cell .dest_field {
    padding-bottom: 10px;
}

.customization_list_cell .dest_field div input, .customization_list_cell .dest_field div select {
    margin: 0 0 0 -5px;
    width: 180px;
}

.customization_list_cell .dest_field div select {
    width: 195px;
}

.customization_list_cell .dest_field input[type=checkbox] {
    width: auto;
}

.customization_list_cell .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 20px;
    margin: 0 5px 0 10px;
}

.customization_list_cell .switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.customization_list_cell .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.customization_list_cell .slider:before {
    position: absolute;
    content: "";
    height: 13px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

.customization_list_cell input:checked + .slider {
    background-color: #2196F3;
}

.customization_list_cell input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

.customization_list_cell input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 20px;
}

.slider.round:before {
    border-radius: 20px;
}

.customizationObjectListCell {
    background: #fff;
    display: flex;
    justify-content: flex-start;
    border-bottom: 1px solid #eee;
}

.customizationObjectSource, .customizationObjectDestination {
    padding: 10px;
    width: 360px;
}

.customizationObjectListHeader {
    display: flex;
    background: #efefef;
}

.customizationObjectListHeader div {
    width: 360px;
    padding: 10px;
    font-weight: bold;
}

.customizationObjectListHeader .stateHeader {
    width: 95px;
    text-align: center;
}

.customizationObjectProgress {
    padding: 10px;
    width: 95px;
    text-align: center;
}

.customizationObjectProgress .spinner {
    vertical-align: middle;
    width: 15px;
    height: 15px;
    background-position: 0px 0px;
    background-repeat: no-repeat;
    display: inline-block;
    margin: 1px 0px 1px 5px;
}

.customizationObjectDestinationSummary {
    font-size: 0.8em;
}

pre.n-notification-main__content {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
}

#source_object_pagination .n-pagination-quick-jumper .n-input {
    width: 25px;
    padding: 0;
}

#source_object_pagination .n-pagination-quick-jumper .n-input .n-input-wrapper {
    padding: 0 3px;
}

/* "Advanced" link slotted into the embedded assistant box on the result
   detail views (mirrors the Vue activity detail's .assistant-open-link). */
.assistant-open-link {
    color: #2d97c5;
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
}

.assistant-open-link:hover {
    color: #2685ad;
    text-decoration: none;
}

/* Result detail views (extract/load/conversion) only: quiet the metadata
   label column so the section headings read darker by contrast. Scoped by
   the dedicated class - #resultTable alone is reused by other views. */
.result-detail-table td:first-child {
    color: #999;
}

/* Result detail views only (root class set in the two ResultDetail ui.xmls,
   covering extract, load AND conversion - the latter reuses the importer
   view): darker section headings against the muted label column. */
#content .result-detail-view h4 {
    /* #content prefix needed to outrank the generic '#content h4' rule above. */
    color: #333;
}

/* Result detail views: soften the Status row badge to match the TaskResult
   list badges (which carry inline opacity 0.6 in TaskResultCell). Scoped to
   the metadata table only - the list badges keep their own inline value. */
.result-detail-table .badge {
    opacity: 0.6;
}

/* Result detail views only: no separator line above the back button (the
   shared .form-panel border-top serves other views), and trim its now-
   pointless top padding; metadata table loses its 20px left margin so the
   label column text aligns with the section headings. */
.result-detail-view .form-panel {
    border-top: none;
    padding-top: 0;
}

#content .result-detail-view .result-detail-table {
    margin-left: 0;
}

/* Result detail views only: the metadata table gets a deliberate fluid width
   (auto table layout sized it arbitrarily from content before), so the
   embedded assistant box's right edge lands exactly on the TaskResult
   list's right edge (full width minus the list's own 10px side margin). */
.result-detail-view .result-detail-table {
    width: calc(100% - 10px);
}

#resultTable.result-detail-table tr.assistant-row td:last-child {
    /* Assistant row's value cell only - the embedded box runs flush to the
       table edge; all other rows keep the generic 10px cell padding.
       #resultTable prefix outranks the generic '#resultTable tr td' rule. */
    padding-right: 0;
}