/* compile */
/**
 * API credentials table
 */
td.forminp-wss_credentials_table > table th,
td.forminp-wss_credentials_table > table td {
  width: auto;
  margin-bottom: 9px;
  padding: 15px 10px;
}

td.forminp-wss_credentials_table > table td.min,
td.forminp-wss_credentials_table > table th.min {
  width: 2%;
  white-space: nowrap;
  margin-right: 5px;
}

td.forminp-wss_credentials_table > table input {
  max-width: 100%;
}

td.forminp-wss_credentials_table > table tfoot a {
  display: inline-block;
}

td.forminp-wss_credentials_table > table .pro-sites {
  line-height: 30px;
  display: inline-block;
  margin-left: 10px;
  color: #646970;
  font-size: 12px;
}

/**
 * API check modal
 */
.wss-api-check-dialog-container .ui-dialog-titlebar-close {
  text-indent: -9999px !important;
}

.wss-api-check-dialog-container .ui-dialog-titlebar-close:before {
  display: none !important;
}

.wss-api-check-dialog-container .ui-dialog-titlebar-close:focus {
  outline: none;
  box-shadow: none;
}

.wss-api-check-dialog-container #wss-api-check-app table {
  width: 100%;
  margin-bottom: 20px;
}

.wss-api-check-dialog-container #wss-api-check-app table th {
  text-align: left;
  width: 100px;
}

.wss-api-check-dialog-container #wss-api-check-app table td {
  text-align: left;
}

.wss-api-check-dialog-container #wss-api-check-app table .error {
  color: #c92a2a;
}

.wss-api-check-dialog-container #wss-api-check-app table .error pre {
  display: block;
  width: 400px;
  overflow-x: scroll;
}

.wss-api-check-dialog-container #wss-api-check-app table.wss-checks-table th {
  width: 75%;
}

.wss-api-check-dialog-container #wss-api-check-app table .wss-check-status {
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  display: inline-block;
}

.wss-api-check-dialog-container #wss-api-check-app table .wss-check-status.pending {
  background-image: url("../img/wpspin_light.gif");
}

.wss-api-check-dialog-container #wss-api-check-app table .wss-check-status.error {
  background-image: url("../img/no.png");
}

.wss-api-check-dialog-container #wss-api-check-app table .wss-check-status.ok {
  background-image: url("../img/yes.png");
}

.wss-api-check-dialog-container #wss-api-check-app table .wss-check-status.warning {
  background-image: url("../img/warning.png");
}

.wss-api-check-dialog-container #wss-api-check-app .wss-api-check-ok {
  color: #087f5b;
}

/**
 * Error modal
 */
#wss-error-dialog table.wss-error-data-table {
  width: 100%;
}

#wss-error-dialog table.wss-error-data-table * {
  box-sizing: border-box;
}

#wss-error-dialog table.wss-error-data-table th {
  padding: 5px 10px 5px 0;
}

#wss-error-dialog table.wss-error-data-table td {
  padding: 5px 0 5px 10px;
}

#wss-error-dialog table.wss-error-data-table th, #wss-error-dialog table.wss-error-data-table td {
  text-align: left;
}

#wss-error-dialog table.wss-error-data-table th {
  vertical-align: baseline;
}

#wss-error-dialog table.wss-error-data-table td pre {
  background: #f1f3f5;
  border: 1px solid #dee2e6;
  padding: 10px;
  overflow: auto;
  margin: 0;
  width: 0;
  min-width: 100%;
  height: 200px;
}

#wss-error-dialog .wss-actions button.button:focus {
  box-shadow: none;
}

/**
 * Sync update app
 */
.wss-app .header {
  text-align: center;
  margin-bottom: 30px;
}

.wss-app .header p {
  font-size: 16px;
}

.wss-app .header h2 {
  font-size: 32px;
}

.wss-app .header .processing h2 {
  color: #1864ab;
}

.wss-app .header .completed h2 {
  color: #2b8a3e;
}

.wss-app .sites {
  display: grid;
  grid-template-columns: repeat(auto-fit, 300px);
}

.wss-app .sites .site {
  background: #ffffff;
  border: 1px solid #dee2e6;
  margin: 0 20px 20px 0;
  background: #ffffff;
}

.wss-app .sites .site .site-header {
  display: flex;
  border-bottom: 1px solid #dee2e6;
}

.wss-app .sites .site .site-header .title {
  flex: auto;
  padding: 10px 20px;
  font-size: 16px;
  font-weight: bold;
}

.wss-app .sites .site .site-header .status {
  flex: none;
  padding: 10px 20px;
}

.wss-app .sites .site .site-header .status .icon {
  display: block;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: left top;
}

.wss-app .sites .site .site-header .status.process .icon {
  background-image: url("../img/wpspin_light.gif");
}

.wss-app .sites .site .site-header .status.completed .icon {
  background-image: url("../img/yes.png");
}

.wss-app .sites .site .content {
  padding: 10px 20px;
}

.wss-app .sites .site .content table th, .wss-app .sites .site .content table td {
  text-align: left;
  padding: 5px 10px;
}

.wss-app .sites .site .content table th {
  padding-left: 0;
}

/**
 * Stock Sync report page
 */
#woo-stock-sync-report .last-updated {
  line-height: 30px;
  margin: 10px 0;
}

#woo-stock-sync-report #woo-stock-sync-filter .tablenav .wss-filters,
#woo-stock-sync-report #woo-stock-sync-filter .tablenav .wss-product-search {
  float: left;
  margin-bottom: 10px;
}

#woo-stock-sync-report .actions {
  margin-bottom: 10px;
}

#woo-stock-sync-report #wss-report-footer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

#woo-stock-sync-report #wss-report-footer .wss-desc-container {
  width: 50%;
  flex: auto;
}

#woo-stock-sync-report #wss-report-footer .wss-clear-log {
  text-align: right;
  flex: auto;
  width: 50%;
}

#woo-stock-sync-report #wss-report-footer .wss-clear-log a.wss-clear-logs {
  text-decoration: none;
  line-height: 14px;
  padding: 8px 0;
  display: inline-block;
  vertical-align: top;
}

#woo-stock-sync-report table {
  background: #ffffff;
}

#woo-stock-sync-report table th, #woo-stock-sync-report table td {
  vertical-align: middle;
}

#woo-stock-sync-report table .button {
  line-height: 24px;
  min-height: 24px;
  padding: 0 5px;
}

/**
 * Log table
 */
.wss-log-table {
  margin-bottom: 20px;
}

.wss-log-table tr.type-error {
  background: #ffe3e3;
}

.wss-descs {
  margin: 0 0 10px;
}

.wss-descs .desc {
  margin-right: 10px;
}

.wss-descs .desc .wss-sync-result {
  margin-right: 3px;
}

.wss-sync-result {
  border-radius: 8px;
  font-weight: bold;
  color: #ffffff;
  cursor: pointer;
  width: 16px;
  height: 16px;
  display: inline-block;
  text-align: center;
  line-height: 16px;
  font-size: 12px;
  vertical-align: text-top;
}

.wss-sync-result:hover {
  text-decoration: none;
  color: #fff;
}

.wss-sync-result.sync-result-info {
  background: #1971c2;
}

.wss-sync-result.sync-result-success {
  background: #2f9e44;
}

.wss-sync-result.sync-result-warning {
  background: #f08c00;
}

.wss-sync-result.sync-result-error {
  background: #e03131;
}

.wss-sync-result.sync-result-na {
  background: #ced4da;
}

/**
 * Log entry modal
 */
.wss-log-modal .wc-backbone-modal-main {
  padding-bottom: 0;
}

.wss-log-modal table.wss-log-entry-table {
  width: 100%;
  margin: 0;
  border: 0;
  box-shadow: none;
  table-layout: fixed;
}

.wss-log-modal table.wss-log-entry-table tr th, .wss-log-modal table.wss-log-entry-table tr td {
  color: #50575e;
  text-align: left;
  font-size: 14px;
  line-height: 1.3em;
  vertical-align: top;
}

.wss-log-modal table.wss-log-entry-table tr th {
  font-weight: bold;
  padding: 0.5em 1em 0.5em 0;
  width: 30%;
}

.wss-log-modal table.wss-log-entry-table tr td {
  padding: 0.5em 0 0.5em 0;
  width: 70%;
  word-break: break-word;
  overflow-wrap: break-word;
}

.wss-log-modal .wss-spinner {
  height: 16px;
  width: 16px;
  margin: 20px auto;
  background: url("../img/wpspin_light.gif") no-repeat top left;
}

/**
 * Tools page
 */
#woo-stock-sync-tools .tools {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-top: 20px;
}

#woo-stock-sync-tools .tools .tool {
  flex: auto;
  max-width: 300px;
  margin: 0 20px 20px 0;
  background: #ffffff;
  border: 1px solid #dee2e6;
  padding: 20px;
}

#woo-stock-sync-tools .tools .tool .title {
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 10px;
}

#woo-stock-sync-tools .tools .tool .desc {
  margin-bottom: 20px;
}

/**
 * Icons
 */
.wss-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: left top;
  vertical-align: text-top;
}

.wss-icon.process {
  background-image: url("../img/wpspin_light.gif");
}

.wss-icon.warning {
  background-image: url("../img/warning.png");
}

.wss-icon.completed {
  background-image: url("../img/yes.png");
}

/**
 * Tabs
 */
.wss-tabs .dashicons-external {
  font-size: 12px;
  height: 12px;
  width: 12px;
}

/**
 * Alert
 */
.wss-alert {
  background: #fff9db;
  border: 1px solid #ffe066;
  padding: 10px 20px;
  margin: 20px 0;
}

/**
 * Labels
 */
.wss-label.wss-label-ok {
  color: #2b8a3e;
}

.wss-label.wss-label-error {
  color: #c92a2a;
}

.wss-label.wss-label-warning {
  color: #e67700;
}

.wss-label.wss-label-info {
  color: #1864ab;
}

.wss-label.wss-label-na {
  color: #495057;
}

.wss-help {
  color: #495057;
  font-size: 0.9em;
}

/**
 * License status label (Pro only)
 */
.markup-license-status-label {
  color: #ffffff;
  padding: 5px 7px;
  font-size: 13px;
  border-radius: 5px;
  text-transform: uppercase;
  display: inline-block;
}

.markup-license-status-label.license-ok {
  background: #2b8a3e;
  color: #ffffff;
}

.markup-license-status-label.license-disabled {
  background: #c92a2a;
}

.markup-license-status-label.license-unknown {
  background: #212529;
}

.markup-license-error {
  display: inline-block;
  margin-left: 5px;
}

.markup-license-last-checked {
  color: #666666;
  margin-top: 10px;
}