@charset "UTF-8";

/**
 * style_franchise.css
 * Extends style_theme.css
 * base_theme: voxelcare
 * namespace: .com-
 * written by: Alexis
 */

/* variables */
:root {
  /* theme colors */
  --color-base: #fff;
  --color-text: #555;
  --color-primary: #004292;
  --color-primary-active: #4c7ab2;
  --color-secondary: #20b8d0;
  --color-accent: #f8b800;
  --color-danger: #ff4c15;
  --color-disabled: #999;
  --color-link: #337ab7;
  --color-link-hover: #23527c;
  --color-gray: #aaa;
  --color-gray-dark: #666;
  --color-gray-light: #ddd;
  --color-gray-lighter: #f6f6f6;
}

/* ---------------------------------------------------------- */
/*              Base & Bootstrap Overrides                    */
/* ---------------------------------------------------------- */
body {
  background-color: #fff;
  background-color: var(--color-base);
  color: #555;
  color: var(--color-text);
}

a {
  color: #337ab7;
  color: var(--color-link);
  text-decoration: none;
}

a:focus,
a:hover {
  color: #23527c;
  color: var(--color-link-hover);
  text-decoration: underline;
}

/* Range inputs crossbrowser styling */
input[type='range']::-webkit-slider-runnable-track {
  background-color: #ddd;
  background-color: var(--color-gray-light);
}

input[type='range']::-webkit-slider-thumb {
  background-color: #004292;
  background-color: var(--color-primary);
}

input[type='range']:focus::-webkit-slider-runnable-track {
  opacity: 1;
  background-color: #ddd;
  background-color: var(--color-gray-light);
}

/* ---------------------------------------------------------- */
/*                        Inputs                              */
/* ---------------------------------------------------------- */
input[type='checkbox']:after,
.checkbox input[type='checkbox']:after,
.checkbox-inline input[type='checkbox']:after {
  background-color: #fff;
  background-color: var(--color-base);
  border: 1px solid #ccc;
}

input[type='checkbox']:checked:before,
.checkbox input[type='checkbox']:checked:before,
.checkbox-inline input[type='checkbox']:checked:before {
  border-color: #004292;
  border-color: var(--color-primary);
}

input[type='checkbox']:checked:after,
.checkbox input[type='checkbox']:checked:after,
.checkbox-inline input[type='checkbox']:checked:after {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #004292;
  border-color: var(--color-primary);
}

.form-control {
  border-color: #ddd;
  border-color: var(--color-gray-light);
  background-color: #fff;
  background-color: var(--color-base);
  color: #555;
  color: var(--color-text);
}

.form-control:focus {
  border-color: #66afe9;
  background-color: #fff;
  background-color: var(--color-base);
  box-shadow: none;
}

.control-label {
  color: #004292;
  color: var(--color-primary);
}

/* ---------------------------------------------------------- */
/*                       Buttons                              */
/* ---------------------------------------------------------- */
.btn-success,
.btn-primary {
  background-color: #f8b800 !important;
  background-color: var(--color-accent) !important;
  border-color: transparent !important;
}

.btn-success.active,
.btn-success.focus,
.btn-success:active,
.btn-success:focus,
.btn-success:hover,
.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success:active.focus,
.btn-success:active:focus,
.btn-success:active:hover,
.open > .dropdown-toggle.btn-success.focus,
.open > .dropdown-toggle.btn-success:focus,
.open > .dropdown-toggle.btn-success:hover .open > .dropdown-toggle.btn-success,
.btn-primary.active,
.btn-primary.focus,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:hover,
.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary:active.focus,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .dropdown-toggle.btn-primary.focus,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary:hover .open > .dropdown-toggle.btn-primary {
  background-color: #ffd761;
  border-color: transparent;
}

.btn-info {
  background-color: #20b8d0;
  background-color: var(--color-secondary);
  border-color: transparent;
  color: #fff;
  color: var(--color-base);
}

/* .btn-default.active,
.btn-default.focus,
.btn-default:active,
.btn-default:focus,
.btn-default:hover,
.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open > .dropdown-toggle.btn-default.focus,
.open > .dropdown-toggle.btn-default:focus,
.open > .dropdown-toggle.btn-default, */
.btn-info.active,
.btn-info.focus,
.btn-info:active,
.btn-info:focus,
.btn-info:hover,
.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info:active.focus,
.btn-info:active:focus,
.btn-info:active:hover,
.open > .dropdown-toggle.btn-info.focus,
.open > .dropdown-toggle.btn-info:focus,
.open > .dropdown-toggle.btn-info {
  background-color: #6dd8e8;
  border-color: transparent;
}

/* panel */

/* Overrides  panel-success */
.panel-success {
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.panel-success > .panel-heading {
  color: #555;
  color: var(--color-text);
  background-color: #ddd;
  background-color: var(--color-gray-light);
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

/* pagination */
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
  background-color: #004292;
  background-color: var(--color-primary);
  border-color: #004292;
  border-color: var(--color-primary);
}

/* ---------------------------------------------------------- */
/*                         Theme                              */
/* ---------------------------------------------------------- */

/* buttons */
.btn-gray,
.btn-dark {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #ddd;
  border-color: var(--color-gray-light);
  color: #555 !important;
  color: var(--color-text) !important;
}

.btn-gray:focus,
.btn-dark:focus,
.btn-gray:hover,
.btn-dark:hover {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #004292;
  border-color: var(--color-primary);
  color: #004292 !important;
  color: var(--color-primary) !important;
}

.btn-gray:active,
.btn-dark:active,
.btn-gray.active,
.btn-dark.active {
  background-color: #20b8d0;
  background-color: var(--color-secondary);
  border-color: #20b8d0;
  border-color: var(--color-secondary);
  color: #fff !important;
  color: var(--color-base) !important;
}

.btn.pink,
.btn-theme {
  background-color: #20b8d0 !important;
  background-color: var(--color-secondary) !important;
  overflow-wrap: anywhere;
}

.btn.green,
.btn-theme.vc_next,
.btn-theme.vc_ok,
.btn-theme.vc_good,
.btn-theme.vc_adduser,
.btn-theme.vc_save,
.btn-theme.vc_addplugin,
.btn-theme.vc_milling,
.btn-theme.vc_milling2 {
  background-color: #f8b800 !important;
  background-color: var(--color-accent) !important;
}

.red,
.red a,
.red a:hover,
.btn-theme.vc_cancel,
.btn-theme.vc_bad,
.btn-theme.vc_deleteplugin,
.btn-theme.vc_filtersremove {
  background-color: #ff4c15 !important;
  background-color: var(--color-danger) !important;
}

.btn-theme.vc_newinsole,
.btn-theme.vc_search {
  background-color: #004292 !important;
  background-color: var(--color-primary) !important;
}

.intakePlugin.active,
.intakePlugin:active {
  background: #4c7ab2 !important;
  background: var(--color-primary-active) !important;
}

.anamnesis-pill.active {
  background-color: #004292 !important;
  background-color: var(--color-primary) !important;
  border-color: #004292 !important;
  border-color: var(--color-primary) !important;
}

.btn-theme.disabled,
.btn-theme[disabled],
.btn-theme[disabled]:hover {
  background-color: #999 !important;
  background-color: var(--color-disabled) !important;
}

/* dropdown */
.vx-dropdown-menu {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.vx-dropdown-menu > li > a {
  color: #555;
  color: var(--color-text);
}

.vx-dropdown-menu > li > a:focus,
.vx-dropdown-menu > li > a:hover {
  color: #fff;
  color: var(--color-base);
  background-color: #4c7ab2;
  background-color: var(--color-primary-active);
}

/* APD plugin*/
.nvc_play,
.nvc_stop,
.nvc_pause,
.nvc_step,
.nvc_upload,
.nvc_mirror,
.nvc_swap,
.nvc_copyrl,
.nvc_copylr,
.nvc_loop {
  background-color: #004292;
  background-color: rgba(0, 66, 146, 0.8);
  color: #fff !important;
  color: var(--color-base) !important;
}

.nvc_play.active,
.nvc_play:active,
.nvc_stop.active,
.nvc_stop:active,
.nvc_pause.active,
.nvc_pause:active,
.nvc_step.active,
.nvc_step:active,
.nvc_upload.active,
.nvc_upload:active,
.nvc_swap.active,
.nvc_swap:active,
.nvc_copyrl.active,
.nvc_copyrl:active,
.nvc_copylr.active,
.nvc_copylr:active,
.nvc_mirror.active,
.nvc_mirror:active,
.nvc_loop.active,
.nvc_loop:active {
  background-color: #20b8d0;
  background-color: var(--color-secondary);
}

/* page */
.page-content {
  padding-bottom: 4.5rem;
}

@media (min-width: 768px) {
  .page-content {
    padding-bottom: 1.5rem;
  }
}

/* navbar */
.navbar.navbar-theme {
  background: #fff;
  background-color: var(--color-base);
  box-shadow: 0 1px 0 #ddd;
  box-shadow: 0 1px 0 var(--color-gray-light);
}

.navbar.navbar-theme svg.icon {
  fill: #666 !important;
  fill: var(--color-gray-dark) !important;
}

.navbar-theme .dropdown-menu > li > a,
.navbar-theme .navbar-nav > li > a {
  color: #666;
  color: var(--color-gray-dark);
}

.navbar-theme .dropdown-menu {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.navbar-theme .dropdown-menu .divider {
  background-color: #ddd;
  background-color: var(--color-gray-light);
}

.navbar-theme .navbar-nav > li > a:hover,
.navbar-theme .navbar-nav > li > a:focus,
.navbar-theme .navbar-nav > .open > a,
.navbar-theme .navbar-nav > .open > a:hover,
.navbar-theme .navbar-nav > .open > a:focus,
.navbar-theme .dropdown-menu > li > a:hover,
.navbar-theme .dropdown-menu > li > a:focus,
.navbar-theme .navbar-nav > .active > a,
.navbar-theme .navbar-nav > .active > a:hover,
.navbar-theme .navbar-nav > .active > a:focus {
  background-color: #4c7ab2;
  background-color: var(--color-primary-active);
  color: #fff;
  color: var(--color-base);
}

.navbar-theme .navbar-nav > li > a:hover svg.icon,
.navbar-theme .navbar-nav > li > a:focus svg.icon,
.navbar-theme .navbar-nav > .open > a svg.icon,
.navbar-theme .navbar-nav > .open > a:hover svg.icon,
.navbar-theme .navbar-nav > .open > a:focus svg.icon,
.navbar-theme .dropdown-menu > li > a:hover svg.icon,
.navbar-theme .dropdown-menu > li > a:focus svg.icon,
.navbar-theme .navbar-nav > .active > a svg.icon,
.navbar-theme .navbar-nav > .active > a:hover svg.icon,
.navbar-theme .navbar-nav > .active > a:focus svg.icon {
  fill: #fff !important;
  fill: var(--color-base) !important;
}

.navbar-theme.navbar-fixed-bottom {
  border-top: 1px solid #ddd;
  border-top: 1px solid var(--color-gray-light);
}

.navbar-theme .navbar-collapse {
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.navbar-theme .navbar-text {
  color: #555;
  color: var(--color-text);
}

.navbar-theme .navbar-toggle {
  border-color: #004292;
  border-color: var(--color-primary);
}

.navbar-theme .navbar-toggle .icon-bar {
  background-color: #004292;
  background-color: var(--color-primary);
}

.navbar-theme .navbar-toggle:hover,
.navbar-theme .navbar-toggle:focus {
  background-color: #004292;
  background-color: var(--color-primary);
}

.navbar-theme .navbar-toggle:hover .icon-bar,
.navbar-theme .navbar-toggle:focus .icon-bar {
  background-color: #fff;
  background-color: var(--color-base);
}

.navbar-theme .navbar-separator-bottom {
  border-bottom-color: #ddd;
  border-bottom-color: var(--color-gray-light);
  box-shadow: none;
}

.navbar-theme .navbar-separator {
  border-top-color: #ddd;
  border-top-color: var(--color-gray-light);
  box-shadow: none;
}

@media (min-width: 768px) {
  .navbar-theme .navbar-nav > .active > a,
  .navbar-theme .navbar-nav > .active > a:hover,
  .navbar-theme .navbar-nav > .active > a:focus {
    background: #004292;
    background: var(--color-primary);
    box-shadow: none;
  }
  .navbar-theme .navbar-nav.navbar-right > li {
    border-left-color: #ddd;
    border-left-color: var(--color-gray-light);
  }
}

/* status bar */

.vx-status-bar {
  background-color: #fff;
  background-color: var(--color-base);
  border-top: 1px solid #ddd;
  border-top: 1px solid var(--color-gray-light);
  width: 100%;
}

.vx-status-bar-order,
.vx-status-bar-user {
  background-color: #fff;
  background-color: var(--color-base);
  color: #555;
  color: var(--color-text);
}

/* modal */
.modal-theme .modal-content {
  color: #555;
  color: var(--color-text);
  background: #fff;
  background: var(--color-base);
}

.modal-theme .modal-footer,
.modal-theme .modal-header,
.modal-theme .modal-content {
  border: 0;
}

.modal-theme hr {
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.modal-theme .modal-header .close {
  color: #ddd;
  color: var(--color-gray-light);
  text-shadow: none;
  opacity: 1;
}

.modal-header > img {
  max-width: 210px;
}

/* tabs */
.tabs-light.nav-tabs {
  border-bottom-color: #ddd;
  border-bottom-color: var(--color-gray-light);
}

.tabs-light.nav-tabs > li > a {
  color: #666;
  color: var(--color-gray-dark);
  border-bottom-color: #ddd;
  border-bottom-color: var(--color-gray-light);
}

.tabs-light.nav-tabs > li > a:hover,
.tabs-light.nav-tabs > li > a:focus {
  color: #004292;
  color: var(--color-primary);
}

.tabs-light.nav-tabs > li.active > a,
.tabs-light.nav-tabs > li.active > a:hover,
.tabs-light.nav-tabs > li.active > a:focus {
  background-color: #fff;
  background-color: var(--color-base);
  border-color: #ddd;
  border-color: var(--color-gray-light);
  border-bottom-color: transparent;
}

/* product */
.btn.product {
  background-color: #fff;
  background-color: var(--color-base);
  color: #004292 !important;
  color: var(--color-primary) !important;
  border-color: #ddd !important;
  border-color: var(--color-gray-light) !important;
}

.btn.product:hover {
  border-color: #20b8d0 !important;
  border-color: var(--color-secondary) !important;
}

.btn.product span {
  height: 2rem;
}

.product-img {
  max-width: 100%;
}

/* editor */
.editor-header {
  background-color: #004292;
  background-color: var(--color-primary);
}

.editor-body {
  background-color: #fff;
  background-color: var(--color-base);
}

.editor-footer .btn-success {
  background-color: #f8b800;
  background-color: var(--color-accent);
}

.editor-btn {
  background-color: #aaa;
  background-color: var(--color-gray);
  border-color: #aaa;
  border-color: var(--color-gray);
  color: #fff;
  color: var(--color-base);
}

.editor-btn:hover,
.editor-btn:focus,
.editor-btn.focus {
  background-color: #ddd;
  background-color: var(--color-gray-light);
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.editor-btn.active {
  background-color: #20b8d0;
  background-color: var(--color-secondary);
  border-color: #20b8d0;
  border-color: var(--color-secondary);
}

/* design modal */
.design-modal .modal-header {
  background-color: #337abb;
}

.design-modal .modal-content {
  background-color: #666;
  background-color: var(--color-gray-dark);
  background-color: rgba(102, 102, 102, 0.95);
}

.design-option-btn:hover,
.design-option-btn.focus {
  background-color: #20b8d0;
  background-color: rgba(23, 184, 2018, 0.8);
}

/* cad */
.cad-canvas-container {
  height: calc(100vh - 100px);
}

.design-option-btn.active,
.cad-toolbar .btn.active,
.cad-tools .btn.active,
.cad-op-btn.active,
.module-btn.active,
.subproduct-btn.active,
.product.active {
  background-color: #20b8d0 !important;
  background-color: var(--color-secondary) !important;
  border-color: transparent !important;
  color: #fff !important;
  color: var(--color-base) !important;
}

.cad-tools .btn.active {
  -webkit-filter: contrast(1);
  filter: contrast(1);
}

/* stepper */

.vx-steps li.current > * {
  color: #004292 !important;
  color: var(--color-primary) !important;
}

@media only screen and (min-width: 768px) {
  .vx-steps li::after,
  .vx-steps.text-top li > *::before,
  .vx-steps.text-bottom li > *::before {
    background-color: #ddd;
    background-color: var(--color-gray-light);
  }

  .vx-steps.text-center li.current > *,
  .vx-steps.text-center li.visited > *,
  .vx-steps.text-top li.visited > *::before,
  .vx-steps.text-top li.current > *::before,
  .vx-steps.text-bottom li.visited > *::before,
  .vx-steps.text-bottom li.current > *::before,
  .vx-steps li.visited::after {
    background-color: #004292 !important;
    background-color: var(--color-primary) !important;
  }

  .vx-steps.text-top a:hover,
  .vx-steps.text-bottom a:hover {
    color: #004292 !important;
    color: var(--color-primary) !important;
  }

  .vx-steps.text-top a:hover::before,
  .vx-steps.text-bottom a:hover::before {
    box-shadow: 0 0 0 3px rgba(0, 172, 233, 0.3);
  }
}

/* webplugin */
.webplugin-sidebar-footer,
.webplugin-sidebar {
  background-color: #fff;
  background-color: var(--color-base);
}

.webplugin-sidebar-footer {
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

/* APD fix */
.webplugin .rm-theme-dark {
  border-color: #ddd;
  border-color: var(--color-gray-light);
  background-color: #fff;
  background-color: var(--color-base);
}

.webplugin .rm-theme-dark .rm-list-item {
  border-bottom-color: #ddd;
  border-bottom-color: var(--color-gray-light);
}

.webplugin .rm-icon svg {
  fill: #004292 !important;
  fill: var(--color-primary) !important;
}

/* treatment form */
.tf-panel {
  border-color: #ddd;
  border-color: var(--color-gray-light);
}

.tf-panel > .tf-panel-heading {
  background-color: #fff;
  background-color: var(--color-base);
}

.tf-panel-title {
  color: #555;
  color: var(--color-text);
}

/* theme */

.theme-primary,
.theme-primary a,
.theme-primary a:hover {
  background: #004292 !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  color: var(--color-base) !important;
}

.bg-light {
  background-color: #f6f6f6;
  background-color: var(--color-gray-lighter);
}

.dark-orange {
  background: #f87e0c !important;
  text-decoration: none !important;
  color: #fff !important;
  border-radius: 0 !important;
}

/* ---------------------------------------------------------- */
/*                   Commercial Styles                        */
/* ---------------------------------------------------------- */

/* ---------------------------------------------------------- */
/*                         Login                              */
/* ---------------------------------------------------------- */
.com-login-form {
  background-color: #f6f6f6;
  background-color: var(--color-gray-lighter);
  border: 1px solid #000;
  max-width: 320px;
}

.com-login-title {
  border-bottom: 0;
  color: #004292;
  color: var(--color-primary);
}

.com-login-btn,
.com-login-input {
  height: 45px;
}

a.com-login-btn {
  padding-top: 0;
  padding-bottom: 0;
  line-height: 43px;
}

/* ---------------------------------------------------------- */
/*                          lang                              */
/* ---------------------------------------------------------- */
.com-lang-link {
  padding: 4px 6px;
  line-height: 1;
  color: #004292;
  color: var(--color-primary);
  border-radius: 3px;
}

.com-lang-link.active,
.com-lang-link:hover {
  background: #004292;
  background: var(--color-primary);
  color: #fff;
  color: var(--color-base);
  text-decoration: none;
}

/* ---------------------------------------------------------- */
/*              ionicapp styles & Overides                    */
/* ---------------------------------------------------------- */

.positive,
a.positive,
.button.button-positive.button-clear,
.tab-item.activated.tab-item-positive,
.tab-item.active.tab-item-positive,
.tab-item.tab-item-active.tab-item-positive {
  color: #004292;
}

.ionic .checkbox input:checked + .checkbox-icon:before,
.ionic .checkbox input:checked:before {
  background: #004292;
  border-color: #004292;
}

.button.button-positive {
  background-color: #004292;
}

.button.button-positive.activated,
.button.button-positive.active {
  background-color: #004292;
}

.button.button-positive.button-clear.activated,
.button.button-positive.button-clear.active {
  color: white;
  opacity: 1;
}

.ionic .vx-steps li.current > * {
  color: #004292;
}

.ionic .vx-steps.text-top li.visited > *::before,
.ionic .vx-steps.text-top li.current > *::before,
.ionic .vx-steps.text-bottom li.visited > *::before,
.ionic .vx-steps.text-bottom li.current > *::before {
  background-color: #004292;
}

.ionic .vx-steps li.visited::after {
  background-color: #004292;
}

.tf-item-icn.positive-bg {
  background: #004292;
}

.vx-ion-login .dark-bg {
  background-color: white;
}
