
.container-fluid {
  padding-left: 30px;
  padding-right: 30px
}

body {padding-top:65px;}
.navbar, .navbar-brand { min-height: 65px; margin-bottom:0px;}
.flow-nav, .flow-builder {top:65px; height: calc(100% - 65px - 39px);}

.navbar {
  border-top:none;
  background-color:#2193d6;
  background-image: url('../images/explore.png') !important;
  background-position: top right;
  background-repeat:no-repeat
}

.navbar-default .navbar-nav>li>a {
  color:#ffffff;
  min-height: 63px; height: 63px;
  line-height:63px;
  padding-top:0px;
  padding-bottom:0px;
  font-size:1.05em;
}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
  color:white;
  background-color: rgba(0, 0, 0, 0.13);
  background-color: #00000022;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus {
  color:white;
  background-color: rgba(0, 0, 0, 0.13);
  background-color: #00000022;
}

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
  color:white;
  background-color: rgba(0, 0, 0, 0.03);
  background-color: #00000008;
}

/* 
  the :not(.btn-primary) here is a hack since some old external ports UIs have buttons 
  with both btn-default and btn-primary classes. Otherwise the button will show up with 
  a white background and white text. We should remove this once we've ended support for those
  old external ports. -Zak
*/
.btn-default:not(.btn-primary) {
  background: linear-gradient(1turn, #dff2fd,#fff 15%);
}
.btn-default:not(.btn-primary):hover, .btn-default:not(.btn-primary):focus, .btn-default:not(.btn-primary):active, .btn-default:not(.btn-primary).active, .open>.dropdown-toggle.btn-default:not(.btn-primary) { 
  background: linear-gradient(1turn, #dff2fd,#fff 40%);
}

 table .badge {
  position: relative;
  left: 25%;
}

#statussummary_sent_count.badge {
  background-color: rgba(101, 149, 180, 0.52);
  background-color: #6595B485;
}

#statussummary_received_count.badge {
  background-color: rgba(126, 157, 58, 0.52);
  background-color: #7E9D3A85;
}

#statussummary_esend_count, #statussummary_ereceive_count {
  background-color: rgba(169, 68, 66, 0.52);
  background-color: #a9444285;
}

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  padding:.5em;
}

.flow-nav .flow-port .flow-port-img {
  width: 26px !important;
  height:26px;
}

.flow-nav .flow-port {
  padding:.5em;
}

.flow-nav-tabs { border-right:1px solid #DDDDDD; min-width:270px;}
.flow-nav, .port-expander {min-width:270px;}
.flow-nav-tabs.nav-tabs>li { padding-top:2px;}

#status-table {
  margin-bottom: 12px;
}

.search-bar .input-group {
  width: 100%;
}

.search-bar .input-group .input-group-btn {
  width: 1%;
}

.message-header-row {
  margin-top: 8px;
  margin-left: 1px;
}

.ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.middle-ellipsis {
  white-space: nowrap;
  overflow: hidden;
}

.middle-ellipsis>span {
  display: inline-block;
  vertical-align: bottom;
  white-space: nowrap;
  overflow: hidden;
}

.middle-ellipsis>span:first-child {
  max-width: calc(100% - 15em);
  text-overflow: ellipsis;
}

.pointercursor {
  cursor: pointer;
}

.port-navbar, .profile-navbar {
  position: fixed;
  padding-left: 0px;
  padding-right: 60px;
  padding-top: 20px;
  padding-bottom: 2px;
  z-index: 1029;
  background-color: #fff;
  margin-top: -20px;
  width: 100%;
}

.port-tab-content, .profile-tab-content {
  padding-top: 36px;
}

.alert-dismissible content {
  word-break: break-word;
}

.rule-value-container input { 
  padding-left: 12px !important; 
}

/* Outgoing Table */
table.table-send-error {
  border:1px solid #2A83C5;
}

table.table-send-error thead tr {
  background-color: WhiteSmoke;
}

table.table-send-error thead tr th span {
  color: Red;
}

table.table-send-error tbody tr td {
  white-space:normal;
}

table.table-send-error tbody tr td:first {
  font-weight:bold;
}

button.send-error-btn {
  margin-right: 15px;
  margin-top: -3px;
  color: black;
}

/* Port Settings */
#port-tab {
  padding-right: 140px;
}
#port-tab .btn-group {
  min-width: 120px;
}

#port-tab .btn-group button {
  text-align: left;
}

#port-tab div + li {
  margin-left: 26px;
}

#port-btn {
  min-width: 200px;
  text-align: left;
}

#port-btn .caret {
  margin-left: 0;
  float: right;
  margin-top: 7px;
}

#paidMention {
  margin-top: 8px;
  margin-bottom: -25px;
}

#scriptTitle {
  margin: -10px 0px 0px 0px;
}

#scriptTitle label p{
  margin: 0px;
}

.settings-text {
  margin-top: 7px;
}

.port-menu {
  min-width: 200px;
  max-height: 400px;
  overflow-y: auto;
}

.port-menu li {
  cursor: pointer;
  margin-top: 2px;
}

.port-menu li.selected, #workspaceList li.selected a {
  background-color: #337ab7;
  color: white;
}

.port-menu li.currentport {
  background-color: #f5f5f5;
  color: white;
}

#port-list>li>a {
  text-align: right;
}

.port-menu li.selected span {
  color: white;
}

.port-menu li.selected:hover span {
  color: #4d4d4d;
}

.port-menu .port-id {
  margin-right: 30px;
}

.port-menu .port-img {
  width: 24px;
}

.download-btn {
  margin-left: 15px;
}

.workspace-search {
  padding-bottom: 5px;
}

li.port-search>div {
  width:100%;
  padding: 0px 20px;
}

li.workspace-search>div {
  width: 100%;
  min-width: 160px;
  padding: 0px 10px;
}

#port-search, #workspace-search {
  padding-left:30px;
  border-radius: 3px;
}

#port-search+i, #workspace-search+i {
  position:absolute;
  top:9px;
  z-index:2;
}

#port-search+i {
  left:30px;
}

#workspace-search+i {
  left:20px;
}

div.inherited-settings input, div.inherited-settings label, div.inherited-settings select, div.inherited-settings textarea, div.inherited-settings .input-group-addon {
  border-color: #146da1;
  color: #146da1;
}

div.inherited-settings select option {
  color: #4d4d4d;
}

.inline-select p {
  display: inline;
  float: left;
}

.inline-select select {
  display: inline;
  float: left;
}

.dropdown-input {
  width: 100%;
}

.dropdown-input input.form-control {
  width: calc(100% - 34px);
}

.dropdown-input button {
  border-radius: 0 4px 4px 0;
  margin-left: -1px;
}

.dropdown-input ul {
  width: 100%;
  border-radius: 0 0 4px 4px;
  margin-top: -1px;
}

/* Port Advanced */
#heartbeatinterval {
  padding-left: 16px;
}

.event-label {
  padding-top: 6px;
  width: calc(100% - 220px);
}

#header-logo {
  height: 65px;
  padding-top: 17px;
}

@media (max-width: 850px) {
  #header-logo {
    padding-right: 25px;
  }
  #navbar-body {
    background: rgb(33, 147, 214);
  }
}

.popover-content {
  word-wrap: break-word;
}

/* OFTP/SFTP Server Profile */
.profile-server-status {
  top: 200px;
}

/* Log section */
.log-option input[type="checkbox"] {
  margin-top: 12px;
}

.log-option input[type="text"] {
  width: 15%;
  display: inline;
}

.log-option input[type="number"] {
  width: 70px;
  display: inline;
}

/* Disable link */
a.disabled-link,
a.disabled-link:visited ,
a.disabled-link:active,
a.disabled-link:hover {
  color: graytext !important;
  cursor: default !important;
}

/* CodeMirror */
#settings .CodeMirror { height: 400px; }
#events .CodeMirror { height: 600px; }

.tab-underline.nav-tabs>li>a {
  color: #4d4d4d;
  border: 0px !important;
}

.tab-underline.nav-tabs>li.active>a {
  color: #2193d6;
  box-shadow: 0 4px 0px #2193d6;
  border: 0px;
}

.tab-underline.nav>li.disabled>a {
  color: #b3b3b3;
}

div.form-group div.checkbox, div.form-group div.settings-text, div.form-group label.radio-inline {
  padding-bottom: 7px;
}

div.form-group div.log-option {
  padding-top: 0px;
  padding-bottom: 0px;
}

/* App icons */
.app-icon {
  display: inline-block;
  background-image: url('../images/Port.svg');
  background-size: contain;
  background-repeat: no-repeat !important;
}

.app-icon-ach { background-image:url('../images/ACH.svg');}
.app-icon-as2 { background-image:url('../images/AS2.svg');}
.app-icon-as3 { background-image:url('../images/AS3.svg');}
.app-icon-as4 { background-image:url('../images/AS4.svg');}
.app-icon-azureblob { background-image:url('../images/AzureBlob.svg');}
.app-icon-branch { background-image:url('../images/FileMatch.svg');}
.app-icon-clouddata { background-image:url('../images/CloudData.svg');}
.app-icon-cdata { background-image:url('../images/CData.svg');}
.app-icon-copy { background-image:url('../images/Copy.svg');}
.app-icon-eancom { background-image:url('../images/EANCOM.svg');}
.app-icon-edifact { background-image:url('../images/EDIFACT.svg');}
.app-icon-emailreceive { background-image:url('../images/EmailReceive.svg');}
.app-icon-emailsend { background-image:url('../images/EmailSend.svg');}
.app-icon-file { background-image:url('../images/File.svg');}
.app-icon-filematch { background-image:url('../images/FileMatch.svg');}
.app-icon-flatfile { background-image:url('../images/FlatFile.svg');}
.app-icon-form { background-image:url('../images/Form.svg');}
.app-icon-ftpserver { background-image:url('../images/FTPServer.svg');}
.app-icon-gisb { background-image:url('../images/GISB.svg');}
.app-icon-googlestorage { background-image:url('../images/GoogleStorage.svg');}
.app-icon-headermatch { background-image:url('../images/HeaderMatch.svg');}
.app-icon-hl7 { background-image:url('../images/HL7.svg');}
.app-icon-hl7mllp { background-image:url('../images/HL7MLLP.svg');}
.app-icon-hpcc, .app-icon-hpccsystems { background-image:url('../images/HPCC.svg');}
.app-icon-iatapadis { background-image:url('../images/IATAPADIS.svg');}
.app-icon-ibmmq { background-image:url('../images/IBMMQ.svg');}
.app-icon-json { background-image:url('../images/JSON.svg');}
.app-icon-lookup { background-image:url('../images/Lookup.svg');}
.app-icon-map { background-image:url('../images/Map.svg');}
.app-icon-merge { background-image:url('../images/Merge.svg');}
.app-icon-mqtt { background-image:url('../images/MQTT.svg');}
.app-icon-notify { background-image:url('../images/Notify.svg');}
.app-icon-oftp { background-image:url('../images/OFTP.svg');}
.app-icon-onedrive { background-image:url('../images/OneDrive.svg');}
.app-icon-openpgp { background-image:url('../images/PGP.svg');}
.app-icon-payment { background-image:url('../images/Payment.svg');}
.app-icon-pdf { background-image:url('../images/PDF.svg');}
.app-icon-pip { background-image:url('../images/PIP.svg');}
.app-icon-psv { background-image:url('../images/PSV.svg');}
.app-icon-rest { background-image:url('../images/REST.svg');}
.app-icon-rnif { background-image:url('../images/RNIF.svg');}
.app-icon-sap, .app-icon-idoc { background-image:url('../images/SAP.svg');}
.app-icon-sapbw { background-image:url('../images/icon-sapbw.png');}
.app-icon-schedule { background-image:url('../images/Schedule.svg');}
.app-icon-scp { background-image:url('../images/SCP.svg');}
.app-icon-script { background-image:url('../images/script.svg');}
.app-icon-sftp { background-image:url('../images/SFTP.svg');}
.app-icon-sftpserver { background-image:url('../images/SFTPServer.svg');}
.app-icon-soap { background-image:url('../images/SOAP.svg');}
.app-icon-split { background-image:url('../images/Split.svg');}
.app-icon-tcpserver { background-image:url('../images/TCPServer.svg');}
.app-icon-tradacoms { background-image:url('../images/TRADACOMS.svg');}
.app-icon-tsv { background-image:url('../images/TSV.svg');}
.app-icon-validate { background-image:url('../images/Validate.svg');}
.app-icon-vda { background-image:url('../images/VDA.svg');}
.app-icon-webdav { background-image:url('../images/WebDAV.svg');}
.app-icon-webhook { background-image:url('../images/Webhook.svg');}
.app-icon-x12 { background-image:url('../images/X12.svg');}
.app-icon-xml { background-image:url('../images/XMLFiles.svg');}
.app-icon-xmlmap { background-image:url('../images/XMLMap.svg');}
.app-icon-xmlmatch { background-image: url('../images/XMLMatch.svg');}
.app-icon-xslt { background-image:url('../images/XSLT.svg');}
.app-icon-zip { background-image:url('../images/Zip.svg');}

/* Central Reference Input Group */
.central-group {
  position: relative;
}

.central-group:not(.on) .input-group {
  width: 100%;
}

.central-group:not(.on) .input-group>.input-group-addon {
  display: none;
}

.central-group:not(.on) .central-group-input {
  border-radius: 4px !important;
}

.central-group .central-group-input {
  padding-right: 26px;
  width: 100%;
  cursor: text;
  border-radius: 0px 4px 4px 0px !important;
}

.central-group .dropdown-menu {
  margin: 0;
  width: 100%;
}

.central-group .central-group-dropdown-icon {
  z-index: 5;
  transform: rotate(90deg);
}

.central-group .central-group-input+.dropdown-toggle>.central-group-dropdown-icon {
  opacity: 0.5;
}

.central-group .central-group-input[readonly]+.dropdown-toggle>.central-group-dropdown-icon {
  opacity: 1 !important;
  color: rgb(0, 146, 221) !important;
}

.central-group .dropdown-toggle {
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 10px;
  top: 0;
  right: 0;
  cursor: pointer;
  position: absolute;
}
