/* Custom Stylesheet */
/**
 * Use this file to override Materialize files so you can update
 * the core Materialize files in the future
 *
 * Made by Sirea
 */
:root {
  --main-bgcolor: #01A49E;
  --main-textcolor: #FFFFFF;
}

/* NAV BAR
-------------------------------------------------------------------------- */
a {
  color: var(--main-bgcolor);
}

nav {
  background-color: var(--main-bgcolor);
}

nav .nav-wrapper,
.widget.widget-type-pages nav .dropdown-content {
  background-color: var(--main-bgcolor);
}

nav .nav-wrapper .sidenav li a,
nav .nav-wrapper .sidenav li a i.mdi {
  color: var(--main-bgcolor);
}

nav .nav-wrapper .sidenav li.active {
  background-color: var(--main-bgcolor);
}

nav .nav-wrapper .sidenav li.active a,
nav .nav-wrapper .sidenav li.active a i.mdi {
  color: var(--main-textcolor);
}

.dropdown-content li>a,
.dropdown-content li>span {
  color: var(--main-bgcolor);
}

nav .nav-wrapper ul li a,
.widget.widget-type-pages nav .dropdown-content li>a {
  color: var(--main-textcolor);
}

/* BUTTONS
-------------------------------------------------------------------------- */
.btn,
.btn-large,
.btn-small,
.btn:hover,
.btn-large:hover,
.btn-small:hover,
.btn:focus,
.btn-large:focus,
.btn-small:focus,
.btn-floating:focus {
  background-color: var(--main-bgcolor);
  color: var(--main-textcolor);
}

.btn-floating i {
  color: var(--main-textcolor);
}

.widget-options .btn-option:hover {
  color: var(--main-bgcolor);
}

.widget:not(.widget-type-pages).editable .widget-options {
  background-color: rgba(255, 255, 255, .5);
}

.widget.editable .widget-options .widget-type-label-group .widget-visibility-personal {
  color: var(--main-bgcolor);
  background-color: var(--main-textcolor);
}

.widget.editable .widget-options .widget-type-label-group .widget-visibility-all {
  color: var(--main-textcolor);
  background-color: var(--main-bgcolor);
}

.widget.widget-type-pages.editable>.widget-options {
  border-left-width: 1px;
  border-left-style: dashed;
  border-left-color: var(--main-textcolor);
}

.widget.widget-type-pages.editable>.widget-options .btn-option {
  color: var(--main-textcolor);
}


/* INPUTS
-------------------------------------------------------------------------- */
input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=date]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border: 2px solid var(--main-bgcolor);
}

select:focus {
  border-color: var(--main-bgcolor);
}

span.select2.select2-container--focus span.selection span.select2-selection {
  border-color: var(--main-bgcolor);
}

span.select2-dropdown li.select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option.select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[aria-selected]:hover {
  background-color: var(--main-bgcolor);
  color: var(--main-textcolor);
}

[type="radio"]:checked+span:after,
[type="radio"].with-gap:checked+span:before,
[type="radio"].with-gap:checked+span:after {
  border: 2px solid var(--main-bgcolor);
}

[type="radio"]:checked+span:after,
[type="radio"].with-gap:checked+span:after {
  background-color: var(--main-bgcolor);
}

[type="checkbox"].filled-in:checked+span:not(.lever):after {
  border: 2px solid var(--main-bgcolor);
  background-color: var(--main-bgcolor);
}


/* TABLE
-------------------------------------------------------------------------- */
li.monthtoweek:hover>span {
  background-color: var(--main-bgcolor);
}


/* PAGINATION
-------------------------------------------------------------------------- */
.pagination li.active {
  background-color: var(--main-bgcolor);
  color: var(--main-textcolor);
}


/* WIDGET CARD TAB
-------------------------------------------------------------------------- */
.tabs .tab a {
  color: var(--main-bgcolor);
}

.tabs .tab a:hover,
.tabs .tab a.active {
  color: var(--main-bgcolor);
}

.tabs .indicator {
  background-color: var(--main-bgcolor);
}

/* VARIABLES FORCABLES
-------------------------- */
.table-item-viewer h3>span.writable {
  color: #276cb8;
  cursor: pointer;
}

.table-item-viewer h3>span.writable:hover {
  background-color: #EEE;
}

.table-variables-item-viewer-mixed.writable {
  color: #276cb8;
  cursor: pointer;
}

.table-variables-item-viewer-mixed.writable:hover {
  background-color: #EEE;
}

.table-devices-item-viewer-string.writable {
  color: #276cb8;
  cursor: pointer;
}

.table-devices-item-viewer-string.writable:hover {
  background-color: #EEE;
}
