@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100..800&display=swap');

:root {
  --primary-color: #009ee3; /* (0,158,227) */
  --secondary-color: #2e4e61; /* (46,78,97) */
  --muted-color: #aaa;
  --image-border-radius: 12px;
}


body {
  font-family: 'Roboto', sans-serif;
  min-height: 100vh;
  /*background-image: url("/images/renet_login_background.jpg");*/
  /*background-repeat: no-repeat;*/
  /*background-position: center;*/
  /*background-attachment: fixed;*/
  display: flex;
  flex-direction: column;
  font-size: 15px;
  position: relative;
  padding: 6px;
}

body::before {
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #fff;
  opacity: .6;
  z-index: -1;
  backdrop-filter: blur(5px);
}

.main-app-container {
  background-image: url('/images/background_1.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  border-radius: var(--image-border-radius);
  padding: 0;
  background-size: cover;
}

.renet-container {
  flex: 1 1 0;
  max-width: none;
  padding: 20px;
}

.renet-content {
  background-color: rgba(255, 255, 255, .85);
  backdrop-filter: blur(5px);
  padding: 40px;
  border-radius: 15px;
  max-width: 1860px;
  margin: auto;
  height: 100%;
}

.renet-content-inner {
  background-color: rgba(255, 255, 255, 1);
  padding: 20px;
  border-radius: 15px;
}

.renet-content-header {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, .06);
}

.renet-submenu-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.renet-submenu-list .renet-submenu-list-item {
  border-bottom: 1px solid rgba(0, 0, 0, .03);
}

.renet-submenu-list .renet-submenu-list-item:last-of-type {
  border-bottom: none;
}

.renet-submenu-list .renet-submenu-list-item a {
  color: inherit;
  text-decoration: none;
  display: block;
  width: 100%;
  padding: 12px 4px;
}

.renet-submenu-list .renet-submenu-list-item a:hover {
  font-weight: 500;
}

.bg-renet {
  background-color: var(--primary-color);
}

.btn-renet {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}

.btn-renet:hover {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #fff;
}

.btn-outline-renet {
  border-color: var(--primary-color);
  color: var(--primary-color);
}

.btn-outline-renet:hover {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
  color: #000;
}

.btn-renet-link {
  padding: 2px 0;
  border-radius: 0;
  border: none;
  color: var(--primary-color);
  transition: all 0.2s ease-in-out;
}

.btn-renet-link:hover {
  padding: 2px 0;
  border-bottom: 1px solid var(--primary-color);
  border-radius: 0;
  color: var(--primary-color);
}

.text-renet {
  color: var(--primary-color);
}

.text-renet-muted {
  color: var(--muted-color) !important;
}

.text-renet-warning {
  color: #e0a800 !important;
}

.border-renet {
  border-color: var(--primary-color) !important;
}

.renet-image-border {
  border-radius: var(--image-border-radius);
}


.outline-dark {
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: black;
}


.form-control-sm {
  padding: .2rem .5rem;
  font-size: .9rem;
}

.form-title,
.form-subtitle {
  margin-bottom: 20px;
  display: flex;
  width: auto;
}


.form-title span,
.form-subtitle span {
  font-size: 90%;
  font-weight: 700;
  border-bottom: 1px solid rgba(0, 0, 0, .3);
  margin: 20px 0 0;
  padding-bottom: 3px;
  padding-left: 10px;
  padding-right: 50px;
  width: auto;
}

.form-title span {
  text-transform: uppercase;
  color: var(--primary-color);
}


.collapse-title {
  border-bottom: 1px solid rgba(0, 0, 0, .05);
  margin: 1rem 0;
  padding: 6px 10px;
  background-color: var(--primary-color);
  color: #fff;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.sub-collapse-title {
  background-color: #0077ad;
}

.collapse-title * {
  transition: 0.2s all ease-in-out;
}

.collapse-title a {
  font-weight: 500;
  /*text-transform: uppercase;*/
}

.collapse-content .collapse-title {
  margin: 10px 0;
}

.collapse-content .collapse-title a {
  text-transform: none;
  font-weight: 500;
}

.collapse-title .collapse-link[aria-expanded="true"] svg,
.collapse-title .collapse-link[aria-expanded="1"] svg {
  transform: rotate(180deg);
}

.collapse-title .collapse-link[aria-expanded="false"] svg,
.collapse-title .collapse-link[aria-expanded="0"] svg {
  transform: rotate(0deg);
}

.collapse-content {
  padding: 0 .65rem;
}

.collapse-content .real-estate-item {
  border-bottom: 1px solid rgba(0, 0, 0, .03);
}

.collapse-content .real-estate-item .form-check {
  display: flex;
  flex-wrap: nowrap;
}

.collapse-content .real-estate-item .form-check input {
  flex: 0 0 auto;
  margin-right: 10px;
}

.collapse-content .real-estate-item .form-check label {
  flex: 1 1 auto;
}

.input-group.disabled input {
  background-color: #fff;
}

.input-group.disabled input,
.input-group.disabled span {
  opacity: .4;
}

.input-text-help {
  color: #777;
  font-size: 75%;
}

.fw-500 {
  font-weight: 500;
}

.text-size-xs {
  font-size: 75%;
}

.no-white-space {
  white-space: nowrap;
}

table.table-renet tr th {
  border-right: 1px solid #fff;
  padding: .6rem .8rem !important;
  font-weight: 500;
  vertical-align: middle;
}

table.table-renet tr th a {
  color: inherit;
  text-decoration: none;
}

table.table-renet tr td {
  padding: .2rem .8rem !important;
  vertical-align: middle;
}


table.table-renet.table-striped > tbody > tr:nth-of-type(2n+1) > * {
  background-color: rgba(0, 158, 227, .1);
  color: inherit;
}

.pill-renet {
  text-decoration: none;
  color: inherit;
}

.pill-renet.active {
  font-weight: 600;
  color: var(--primary-color);
}

.navigation-steps {
  background-color: rgba(255, 255, 255, 1);
  border-radius: 15px;
  margin-right: 16px;
}

.pac-container {
  z-index: 2000;
}

.navigation-steps ul li.list-group-item {
  color: inherit;
  background-color: transparent;
  border: none;
  padding: 0;
  margin-bottom: 0;
}

.navigation-steps ul li.list-group-item.active {
  background-color: rgba(0, 158, 227, .05);
}

.navigation-steps ul li.list-group-item a {
  color: inherit;
  text-decoration: none;
  display: block;
  width: 100%;
  padding: 8px 24px;
}

.navigation-steps ul li.list-group-item li.list-group-item > a {
  padding: 8px 24px 8px 40px;
}

.navigation-steps ul li.list-group-item.inactive a:hover {
  color: #000;
  font-weight: 600;
}

.navigation-steps ul li.list-group-item.active a {
  font-weight: 600;
  border-left: 4px solid var(--primary-color);
  color: #000;
}

/** BEGIN - Dropzone */
.dropzone {
  background: #fff;
  border-radius: 10px;
  border: 2px dashed rgba(0, 0, 0, .5);
  border-image: none;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.dropzone .dz-message .dz-button {
  font-size: 1.5rem;
  color: #777;
}

.dropzone .dz-preview {
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 12px;
}

.dropzone .dz-preview * {
  position: relative;
!important;
}

.dropzone .dz-preview.dz-error {
  background: rgba(220, 53, 69, .03);
  border: none;
  border-radius: 6px;
  border-left: 4px solid #dc3545;
  box-shadow: 0 0 37px rgba(0, 0, 0, .1);
  position: relative;
}

/* DZ image */
.dropzone .dz-preview .dz-image {
  width: auto;
  height: auto;
  flex: 0 0 auto;
  order: 2;
  border-radius: 0;
  position: relative;
}

.dropzone .dz-preview:hover .dz-image img {
  transform: none;
  filter: none;
  position: relative;
}

/* DZ details - name and size */
.dropzone .dz-preview.dz-image-preview .dz-details {
  opacity: 1;
  position: relative;
  flex: 1 0 0;
  order: 3;
  /*width: auto;*/
  top: unset;
  left: unset;
  min-width: unset;
  min-height: unset;
  padding: 0;
  font-size: 16px;
  line-height: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-left: 20px;
}

.dropzone .dz-preview .dz-details .dz-filename {
  width: 60%;
  order: 1;
  margin-bottom: 0.8em;
  text-align: start;
  position: relative;
}

.dropzone .dz-preview .dz-details .dz-filename:hover span {
  border: 0;
  background-color: transparent;
  position: relative;
}

.dropzone .dz-preview .dz-details .dz-size {
  order: 2;
  margin-bottom: 0;
  text-align: start;
  flex: 1 1 100%;
  position: relative;
}

/* DZ - success / error mark */
.dropzone .dz-preview .dz-success-mark,
.dropzone .dz-preview .dz-error-mark {
  order: 1;
  top: unset;
  left: unset;
  animation: none !important;
  margin-left: 0;
  margin-top: 0;
  display: none;
  position: relative;
}

.dropzone .dz-preview .dz-success-mark svg,
.dropzone .dz-preview .dz-error-mark svg {
  width: 42px;
  height: 42px;
}

.dropzone .dz-preview .dz-error-mark svg {
  fill: #dc3545;
}

/*.dropzone .dz-preview.dz-error .dz-error-mark {*/
/*  display: block;*/
/*}*/


.dropzone .dz-preview .dz-error-mark {
  background-color: transparent;
  position: relative;
}

/* DZ - error message */
.dropzone .dz-preview .dz-error-message {
  opacity: 1;
  top: unset;
  left: unset;
  order: 3;
  flex: 0 0 auto;
  background-color: #dc3545;
  border-radius: 4px;
  padding: 3px 10px;
  color: #fff;
  margin-right: 10px;
  font-size: 14px;
  position: relative;
  max-height: 100px;
}

.dropzone .dz-preview .dz-error-message::after {
  display: none;
}

/* DZ - remove button */
.dropzone .dz-preview .dz-remove {
  order: 4;
  margin-left: 10px;
  flex: 0 0 auto;
  position: relative;
}

.dropzone .dz-preview .dz-remove:hover {
  cursor: pointer;
}

/* DZ - progress */
.dropzone .dz-preview:not(.dz-processing) .dz-progress {
  animation: none;
}

.dropzone .dz-preview .dz-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  top: unset;
  height: 6px;
  border-radius: 0;
  border-color: #28a745;
  border-width: 2px;
  animation: none;
  width: 100%;
}

/** END - Dropzone */

/** BEGIN - Sortable */

.sortable-list-image {
  text-align: center;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.sortable-list-image:first-of-type {
  border: 2px dashed var(--primary-color);
  background-color: rgba(0, 0, 0, .05);
}

.sortable-list-image:hover {
  cursor: grab;
}

.sortable-list-image .image-actions {
  position: absolute;
  right: 5px;
  top: -5px;
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.sortable-list-image:hover .image-actions {
  top: 5px;
  opacity: 1;
}

.sortable-list-image img {
  width: 100%;
  height: auto;
  max-width: 120px;
}

.sortable-list-image:first-of-type img {
  max-width: 160px;
}

/** END - Sortable */

.editor_container {
  min-height: 75vh;
}

#editor_container {
  min-height: 50vh;
}

#editor_container .konvajs-content {
  height: 100%;
  min-height: 50vh;
}

.fhQJAg {
  width: 100% !important;
  text-align: center;
}

.dYravD {
  width: auto !important;
}

.eSfBkL {
  flex-wrap: wrap;
}

/** BEGIN -- Colorbox */
#cboxPrevious,
#cboxNext {
  background: none;
  text-indent: 0;
  top: 30px;
  height: 100%;
  width: 15%;
  background: transparent;
}

#cboxPrevious {
  background: linear-gradient(90deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, 0) 100%);
  text-align: left;
  padding-left: 50px;
}

#cboxPrevious svg {
  color: rgba(255, 255, 255, .7);
  font-size: 4rem;
}

#cboxNext {
  background: linear-gradient(-90deg, rgba(255, 255, 255, .1) 0%, rgba(255, 255, 255, 0) 100%);
  text-align: right;
  padding-right: 50px;
}

#cboxNext svg {
  color: rgba(255, 255, 255, 1);
  font-size: 4rem;
}

#cboxTitle {
  top: 0;
  background: #000;
  padding: 10px;
}

/** END -- Colorbox */
.real-estate-item {
  padding: 6px;
}

.real-estate-item:hover {
  background-color: rgba(0, 0, 0, .02);
}

.real-estate-item label:hover {
  cursor: pointer;
}

.real-estate-image-container {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}


/** Real estates -- GRID */
.real-estate-grid-item {
  margin: 4px;
  box-shadow: 0 0 17px 7px rgba(0, 0, 0, .04);
  border-radius: var(--image-border-radius);
}

.real-estate-grid-item .content-container {
  padding: 0 12px 12px 12px;
}

.real-estate-image-container-size {
  width: 250px;
  height: 150px;
}

.real-estate-image-grid-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 250px;
  overflow: hidden;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.real-estate-image-grid-container img {
  width: 100%;
}

.real-estate-image-grid-container.default-image {
  opacity: .7;
}

.real-estate-show-image-container {
  width: 550px;
  height: 320px;
  border-radius: 12px;
}


.real-estate-image-container-size-sm {
  width: 80px;
  height: 48px;
}

.real-estate-image-container img {
  width: auto;
  height: auto;
  max-height: 150px;
  max-width: 100%;
  border-radius: var(--image-border-radius);
}

.login-page {
  background-image: none;
}

.login-page-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  background-image: url('/images/background_1.jpg');
  /*background-image: url('/images/background_2.jpg');*/
  /*background-image: url('/images/background_3.png');*/
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: .6;
  z-index: 1;
}

.login-page-container {
  z-index: 9;
}

.login-box {
  padding: 40px;
  border-radius: 20px;
  background-color: rgba(255, 255, 255, .8);
  backdrop-filter: blur(5px);
}

.filter-pills {
  margin-bottom: 10px;
}

.filter-pills .filter-pill {
  padding: 2px 6px;
  background-color: rgba(0, 0, 0, .03);
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 8px;
  font-size: 90%;
}

.filter-pills .filter-pill:hover {
  background-color: rgba(0, 0, 0, .1);
  cursor: pointer;
}


.real-estate-index .real-estate-overview svg {
  color: var(--primary-color);
  width: 20px;
}

.real-estate-action svg {
  width: 20px;
  text-align: center;
}

.real-estate-index-description {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.6rem;
}

.real-estate-index-description.expanded {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}

.btn-addon-renet {
  border: var(--bs-border-width) solid var(--bs-border-color);
  background: var(--primary-color);
  color: #fff;
  border-left: none;
  border-right: none;
}

.btn-addon-renet:hover {
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-left: none;
  border-right: none;
  color: var(--primary-color);
}

.btn-addon-delete {
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-left: none;
  background: #fff;
}

.warning {
  font-size: 17px;
  line-height: 26px;
}

.task-type-color-box {
  width: 40px;
  height: 20px;
  max-width: 100%;
  max-height: 100%;
}


#loader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, .8);
  display: flex;
  justify-content: center;
  z-index: 999;
}

#loader svg {
  color: var(--primary-color);
}


/** Agent profile */
/*.agent-profile-statistics-icon {*/
/*  border-radius: 50%;*/
/*  background-color: var(--primary-color);*/
/*  display: flex;*/
/*  justify-content: center;*/
/*  align-items: center;*/
/*  color: #fff;*/
/*  font-size: 50px;*/
/*}*/

/*.agent-profile-statistics-text {*/
/*  display: flex;*/
/*  flex-wrap: wrap;*/
/*  align-items: center;*/
/*}*/

.agent-profile-statistics-text i {
  font-size: 1.7rem;

}

.agent-profile-statistics-value {
  font-size: 1.6rem;
  font-weight: bold;
}

.agent-profile-statistics-title {
  /*text-align: center;*/
  flex: 1 1 100%;
  order: 3;
}

.agent-profile-statistics-percentage {
  /*text-align: center;*/
  flex: 0 0 auto;
  order: 2;
  padding-left: 8px;
  font-size: 1.2rem;
  /*color: #777;*/
  opacity: .7;
}

.agent-profile-statistics-date {
  font-size: 1.1rem;
  font-weight: bold;
}

.agent-profile-link:hover {
  cursor: pointer;
  background: rgba(0, 0, 0, .05);
}

.agent-profile-link-icon {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  background-color: var(--primary-color);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.3rem;
}


.location-container {
  position: relative;
}

.location-container .search-results {
  position: absolute;
  top: 60px;
  left: 0;
  width: 100%;
  z-index: 9999;
  background-color: #fff;
}

#searchResults {
  max-height: 400px;
  overflow-y: scroll;
}

#searchResults .results > div {
  padding: 10px 15px;
  font-size: 1rem;
  cursor: pointer;
  border: 1px solid #ddd;;
  border-top: none;
  border-radius: 6px;
}

#searchResults .results > div:first-of-type {
  border-top: 1px solid #ddd;
}

#searchResults .results > div:hover {
  background: #eeeeee;
}


/** Content style */
.renet-content-main {
  background-color: rgba(255, 255, 255, .8);
  box-shadow: 0 0 37px 17px rgba(0, 0, 0, .02);
  border-radius: 20px;
  padding: 30px 0;
  width: 100%;
  /*max-width: 1820px;*/
  margin: 0 auto 30px;
}

.renet-content-main .general-info {
  padding-left: 30px;
  padding-right: 30px;
}

.renet-content-main-title {
  font-size: 2rem;
  color: var(--secondary-color);
}

.renet-icon {
  width: 40px;
  height: 40px;
  display: block;
  background-color: transparent;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  transition: all .1s ease-in-out;
}

a.renet-icon {
  opacity: .9;
  cursor: pointer;
}

a.renet-icon:hover {
  opacity: 1;
}

.renet-icon.icon-menu-nekretnina {
  background-image: url("/images/icons/icon_menu_nekretnina.png");
}

.renet-icon.icon-adresa {
  background-image: url("/images/icons/icon_adresa.png");
}

.renet-icon.icon-soba {
  background-image: url("/images/icons/icon_soba.png");
}

.renet-icon.icon-povrsina {
  background-image: url("/images/icons/icon_povrsina.png");
}

.renet-icon.icon-tus {
  background-image: url("/images/icons/icon_tus.png");
}

.renet-icon.icon-toalet {
  background-image: url("/images/icons/icon_toalet.png");
}

.renet-icon.icon-broj-pregleda-nekretnine {
  background-image: url("/images/icons/icon_broj_pregleda_nekretnine.png");
}

.renet-icon.icon-dokumentacija {
  background-image: url("/images/icons/icon_dokumentacija.png");
}

.renet-icon.icon-financije {
  background-image: url("/images/icons/icon_financije.png");
}

.renet-icon.icon-moje-nekretnine {
  background-image: url("/images/icons/icon_moje_nekretnine.png");
}

.renet-icon.icon-dnevnik-aktivnosti {
  background-image: url("/images/icons/icon_dnevnik_aktivnosti.png");
}

.renet-icon.icon-izvjestaji {
  background-image: url("/images/icons/icon_izvjestaji.png");
}

.renet-icon.icon-dodatni-info-o-nekretnini {
  background-image: url("/images/icons/icon_dodatni_info_o_nekretnini.png");
}

.renet-icon.icon-prikljucci {
  background-image: url("/images/icons/icon_prikljucci.png");
}

.renet-icon.icon-oprema {
  background-image: url("/images/icons/icon_oprema.png");
}

.renet-icon.icon-sadrzaji-u-blizini {
  background-image: url("/images/icons/icon_sadrzaji_u_blizini.png");
}

.renet-icon.icon-promjena-cijene {
  background-image: url("/images/icons/icon_promjena_cijene.png");
}

.renet-icon.icon-info-o-nekretnini {
  background-image: url("/images/icons/icon_info_o_nekretnini.png");
}

.renet-icon.icon-parking {
  background-image: url("/images/icons/icon_parking.png");
}

.renet-icon.icon-bazen {
  background-image: url("/images/icons/icon_bazen.png");
}

.renet-icon.icon-balkon {
  background-image: url("/images/icons/icon_balkon.png");
}

.renet-icon.icon-okucnica {
  background-image: url("/images/icons/icon_okucnica.png");
}

.renet-icon.icon-oglasavanje {
  background-image: url("/images/icons/icon_oglasavanje.png");
}


.renet-content-main .renet-content-header-image {
  padding-left: 30px;
  padding-right: 30px;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
}

.real-estate-image-container.real-estate-show-image-container a {
  width: 100%;
  /*height: 100%;*/
  display: flex;
  justify-content: center;
}

.real-estate-image-container.real-estate-show-image-container a img {
  width: 100%;
  height: auto;
}

.renet-content-main .renet-content-header-image img {
  /*max-height: 350px;*/
  /*max-width: 450px;*/
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}

.renet-icon-text {
  font-size: 1.2rem;
}

.renet-content-main .select2-container--default .select2-selection--single,
.renet-content-main .form-control {
  background-color: rgba(255, 255, 255, .6);
}

.renet-content-main .icon-row {
  margin-bottom: 10px
}

.renet-content-main .price {
  padding-left: 30px;
  padding-right: 30px;
}

.renet-content-main .current-price {
  color: var(--secondary-color);
  font-size: 2.5rem;
}

.renet-content-main .code {
  color: var(--secondary-color);
  font-size: 2rem;
}

.renet-content-main .price-per-square {
  color: var(--secondary-color);
  font-size: 1.3rem;
  font-weight: 500;
}

.renet-content-main .last-price {
  color: red;
  font-size: 1.5rem;
}

.renet-content-main .diff-in-price {
  color: red;
  font-size: 1rem;
  font-weight: bold;
}

.renet-content-body {
  /*max-width: 1820px;*/
  margin: 10px auto;
}

.renet-content-body .renet-content-links {
  padding: 0 30px;
}

.renet-content-body .renet-content-body-main {
  background-color: rgba(255, 255, 255, .8);
  box-shadow: 0 0 37px 17px rgba(0, 0, 0, .02);
  border-radius: 20px;
  padding: 30px;
}

.icon-row.icon-square-row .renet-icon {
  width: 70px;
  height: 70px;
  padding: 10px
}

.icon-row.icon-square-row .renet-icon-text {
  font-size: .9rem;
}

.renet-content-real-estate-info {
  margin-bottom: 20px;
}

.renet-content-real-estate-info .title {
  text-decoration: underline;
  font-weight: 500;
}

.renet-content-real-estate-info .info-item {
  color: #777777;
}

.renet-content-notes {
  background-color: rgba(255, 255, 255, .8);
  box-shadow: 0 0 37px 17px rgba(0, 0, 0, .02);
  border-radius: var(--image-border-radius);
  padding: 12px;
  max-height: 800px;
  overflow: auto;
  border: 1px solid rgba(0, 0, 0, 0.02);
}

.renet-content-notes .title {
  font-weight: 500;
  text-decoration: underline;
  font-size: 1.1rem;
}

.no-notes-text {
  color: #aaa;
  font-size: .9rem;
  border-bottom: 1px dashed #aaa;
  padding-bottom: 2px;
}

.renet-content-footer {
  /*max-width: 1820px;*/
  margin: 30px auto;
}

/** END -- content style */

.grade-container {
  position: relative;
  align-items: center;
  background-color: rgba(0, 0, 0, .02);
  padding: 4px 10px;
  width: auto;
  border-radius: 20px;
}

.grade-container.total {
  /*border: 1px solid rgba(0, 0, 0, .2);*/
  background-color: var(--primary-color);
  color: #fff;
}

.grade-container .grade {
  padding: 0 6px;
  font-weight: 600;
}

.grade-container .home-score {
  margin: 0 2px;
  width: 20px;
}

.fa-home-half {
  position: relative;
}

.home-half::before,
.home-half::after {
  font-family: "Font Awesome 6 Free";
  content: '\f015'; /* Unicode for the full home icon */
  position: absolute;
  clip: rect(0, 10px, 10px, 0); /* Adjust to show half icon */
  font-weight: 900;
  font-size: 85%;
  top: 50%;
  transform: translateY(-50%);
  font-style: normal;
}

.home-half:before {
  clip: rect(0, 7px, 20px, 0px); /* Adjust to show half icon */
  color: #efbf04 !important;
}

.home-half:after {
  clip: rect(0px, 16px, 20px, 7px); /* Adjust to show half icon */
  color: #bbb;
}

.grade-container.total .home-half:after {
  clip: rect(0px, 16px, 20px, 7px); /* Adjust to show half icon */
  color: #fff;
}

.grade-container .home-disabled {
  color: #bbb !important;
}

.grade-container.total .home-disabled {
  color: #fff !important;
}

.grade-container .home-enabled {
  color: gold !important;
}

.grade-container .grade-text {
  color: var(--muted-color);
}

.grade-container .grade-title {
  color: #777;
}

.grade-container.total .grade-text,
.grade-container.total .grade-title {
  color: #fff;
}

.grade-container.total .grade-title {
  font-weight: bold;
}

.bubble {
  --r: 1em; /* the radius */
  --t: 1.5em; /* the size of the tail */

  padding: .5rem;
  border-inline: var(--t) solid #0000;
  border-radius: calc(var(--r) + var(--t))/var(--r);
  margin-bottom: 16px;
  font-size: .9rem;
}

.my-note .bubble {
  background: var(--primary-color);
  color: #fff;
  mask: radial-gradient(100% 100% at var(--_p) 0, #0000 99%, var(--primary-color) 102%) var(--_p) 100%/var(--t) var(--t) no-repeat,
  linear-gradient(var(--primary-color) 0 0) padding-box;
}

.other-note .bubble {

  background: var(--secondary-color);
  color: #fff;
  mask: radial-gradient(100% 100% at var(--_p) 0, #0000 99%, var(--secondary-color) 102%) var(--_p) 100%/var(--t) var(--t) no-repeat,
  linear-gradient(var(--secondary-color) 0 0) padding-box;
}

.my-note.fancy .note-image,
.other-note.fancy .note-note {
  order: 1;
}

.my-note.fancy .note-note,
.other-note.fancy .note-image {
  order: 2;
}


.my-note .side {
  --_p: 0;
  border-bottom-left-radius: 0 0;
  place-self: start;
}

.other-note .side {
  --_p: 100%; /* Tail position on the right */
  border-bottom-right-radius: 0 0;
  place-self: end;
}

.fancy .notes-avatar {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  overflow: hidden;
}

.note {
  padding: 12px;
  background-color: rgba(255, 255, 255, .6);
  border-radius: var(--image-border-radius);
}

.note-image {
  padding-right: 10px;
}

.notes-avatar {
  height: 30px;
  width: 30px;
  border-radius: 50%;
  overflow: hidden;
}

.download-pdf-icon,
.export-excel-icon {
  position: relative;
}

.download-pdf-icon::before,
.export-excel-icon::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 400;
}

.download-pdf-icon::before {
  content: "\f1c1";
}

.export-excel-icon::before {
  content: "\f1c3";
}

.agent-container {
  background-color: rgba(255, 255, 255, .8);
  box-shadow: 0 0 37px 17px rgba(0, 0, 0, .02);
  border-radius: 20px;
  padding: 30px;
  max-height: 800px;
  overflow: auto;
  border: 1px solid rgba(0, 0, 0, 0.02);
}

.default-profile-picture {
  height: 100px;
  width: 100px;
  background-color: #e7e7e7;
  border: 1px dashed #aaa;
  border-radius: var(--image-border-radius);
}

.profile-image-container,
.profile-image-container-100 {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: start;
  border: 1px solid rgba(0, 158, 227, .1);
  border-radius: var(--image-border-radius);
}

.profile-image-container {
  width: 200px;
  height: 200px;
}

.profile-image-container-100 {
  width: 100px;
  height: 100px;
}

.profile-image-container-50 {
  width: 50px;
  height: 50px;
}

.profile-image {
  width: auto;
  height: auto;
  max-width: 100%;
}

.profile-image-container img,
.profile-image-container-100 img {
  border-radius: var(--image-border-radius);
}

/** Progress bar */
.progress-bar-container {
  width: 100%;
  height: 50px;
  background: linear-gradient(
    to right,
    red,
    orange,
    yellow,
    green
  );
  border-radius: var(--image-border-radius);
  overflow: hidden;
  position: relative;
}

.progress-bar {
  background-color: #e0e0e0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
}

.progress-bar-text {
  line-height: 50px;
  font-size: 1.2rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

/** Circular rogress bar */
.circular-progress-container {
  position: relative;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.circular-progress-container-100 {
  width: 100px;
  height: 100px;
}

.circular-progress-container-130 {
  width: 130px;
  height: 130px;
}

.circular-progress-empty {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 105px;
  height: 105px;
  background-color: #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.circular-progress-container-100 .circular-progress-empty {
  width: 85px;
  height: 85px;
}

.progress-bar-text {
  position: absolute;
  line-height: 30px;
  font-weight: bold;
  padding-right: 6px;
}


.circular-progress-text {
  font-weight: bold;
  font-size: 1.2rem;
}

.circular-progress-container-130 .circular-progress-text {
  font-size: 1.8rem;
}

/* Circular progress */
/* Circular progress */
.circular-progress {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: conic-gradient(
    red, orange, yellow, green 0deg calc(var(--percentage) * 3.6deg),
    #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg
  );
}

.circular-progress.red {
  background: conic-gradient(red 0deg calc(var(--percentage) * 3.6deg), #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg);
}

.circular-progress.orange {
  background: conic-gradient(orange 0deg calc(var(--percentage) * 3.6deg), #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg);
}

.circular-progress.yellow {
  background: conic-gradient(#F7D300 0deg calc(var(--percentage) * 3.6deg), #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg);
}

.circular-progress.green {
  background: conic-gradient(green 0deg calc(var(--percentage) * 3.6deg), #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg);
}

.circular-progress.renet {
  background: conic-gradient(var(--primary-color) 0deg calc(var(--percentage) * 3.6deg), #e0e0e0 calc(var(--percentage) * 3.6deg) 360deg);
}

.text-orange {
  color: orange;
}

.text-red {
  color: red;
}

.text-yellow {
  color: #F7D300;
}

.text-green {
  color: green;
}

.new-notifications {
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, .8);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  padding: 50px;
}

.notification {
  max-width: 1260px;
  background-color: #fff;
  border-radius: var(--image-border-radius);
  padding: 20px;
  margin: 10px auto;
  box-shadow: 0 0 27px rgba(0, 0, 0, 0.1);
}

.renet-box {
  background-color: rgba(0, 158, 227, .05);
  padding: 6px 14px 14px;
  border-radius: var(--image-border-radius);
}

.hover-element:hover {
  background-color: rgba(0, 158, 227, .05);
}

.point-on-hover:hover {
  cursor: pointer;
}


/* Sparkle shape */
/*.sparkle {*/
/*  position: absolute;*/
/*  width: 12px;*/
/*  height: 12px;*/
/*  background: linear-gradient(135deg, #00d4ff, #8e00ff);*/
/*  clip-path: polygon(50% 0%, 65% 35%, 100% 50%, 65% 65%, 50% 100%, 35% 65%, 0% 50%, 35% 35%);*/
/*  opacity: 0;*/
/*  animation: sparkle-fade 1.5s infinite ease-in-out;*/
/*}*/

/*!* Random positions and delays for sparkles *!*/
/*.sparkle:nth-child(1) { top: 10%; left: 20%; animation-delay: 0s; }*/
/*.sparkle:nth-child(2) { top: 30%; left: 70%; animation-delay: 0.3s; }*/
/*.sparkle:nth-child(3) { top: 50%; left: 40%; animation-delay: 0.6s; }*/
/*.sparkle:nth-child(4) { top: 70%; left: 60%; animation-delay: 0.9s; }*/
/*.sparkle:nth-child(5) { top: 80%; left: 30%; animation-delay: 1.2s; }*/
/*.sparkle:nth-child(6) { top: 20%; left: 50%; animation-delay: 1.5s; }*/
/*.sparkle:nth-child(7) { top: 60%; left: 10%; animation-delay: 1.8s; }*/

/*!* Animation *!*/
/*@keyframes sparkle-fade {*/
/*  0%, 100% {*/
/*    opacity: 0;*/
/*    transform: scale(0.5);*/
/*  }*/
/*  50% {*/
/*    opacity: 1;*/
/*    transform: scale(1.5);*/
/*  }*/
/*}*/

/* 50x50 container */
.sparkle-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(255, 255, 255, 0.05); /* Light background for visibility */
}

.sparkle-container .sparkles {
  width: 70px;
  height: 70px;
  position: relative;
}

/* Sparkle shape */
.sparkle {
  position: absolute;
  width: 12px;
  height: 12px;
  background: linear-gradient(135deg, #00d4ff, #8e00ff);
  clip-path: polygon(50% 0%, 65% 35%, 100% 50%, 65% 65%, 50% 100%, 35% 65%, 0% 50%, 35% 35%);
  opacity: 0;
  animation: sparkle-fade 1.5s infinite ease-in-out;
}

/* Position sparkles randomly within 50x50px container */
.sparkle:nth-child(1) {
  top: 10%;
  left: 20%;
  animation-delay: 0s;
}

.sparkle:nth-child(2) {
  top: 30%;
  left: 70%;
  animation-delay: 0.3s;
}

.sparkle:nth-child(3) {
  top: 50%;
  left: 40%;
  animation-delay: 0.6s;
}

.sparkle:nth-child(4) {
  top: 70%;
  left: 60%;
  animation-delay: 0.9s;
}

.sparkle:nth-child(5) {
  top: 80%;
  left: 30%;
  animation-delay: 1.2s;
}

.sparkle:nth-child(6) {
  top: 20%;
  left: 50%;
  animation-delay: 1.5s;
}

.sparkle:nth-child(7) {
  top: 60%;
  left: 10%;
  animation-delay: 1.8s;
}

/* Sparkle animation */
@keyframes sparkle-fade {
  0%, 100% {
    opacity: 0;
    transform: scale(0.5);
  }
  50% {
    opacity: 1;
    transform: scale(1.5);
  }
}

.renet-tab {
  padding: 8px 20px;
  border-bottom: 1px solid var(--muted-color);
  text-align: center;
}

.renet-tab a {
  color: var(--muted-color);
  text-decoration: none;
}

.renet-tab.active {
  border-bottom: 3px solid var(--primary-color);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.renet-tab.active a {
  color: var(--primary-color);
}


.model-info-row {
  padding: 10px 6px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.model-info-row:nth-child(2n) {
  background-color: rgba(0, 158, 227, .1);
}

.model-info-row .model-info-title,
.model-info-row .model-info-value {
  flex: 1 1 auto;
}

.model-info-row .model-info-value {
  text-align: right;
}

.model-info-row .model-info-textarea-value {
  text-align: left;
  flex: 0 0 100%;
  padding-top: 6px;
}

.model-info-row .model-info-value a {
  text-decoration: none;
  color: inherit;
}

.dropdown-menu li {
  position: relative;
}

.dropdown-menu .dropdown-submenu {
  display: none;
  position: absolute;
  right: 100%;
  top: -7px;
}

.dropdown-menu .dropdown-submenu-left {
  right: 100%;
  left: auto;
}

.dropdown-menu > li:hover > .dropdown-submenu {
  display: block;
}


/** Dashboard */
.dashboard-box {
  width: 100%;
  /*height: 100%;*/
  max-width: 650px;
  height: 150px;
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, .1) 0 0 17px 7px;
  border-radius: var(--image-border-radius);
  display: flex;
  align-items: center;
  margin: 20px;
  transition: all 0.3s ease-in-out;
}

.dashboard-box-sm {
  height: auto;
  margin: 10px;
  padding: 15px;
}

.dashboard-box:hover {
  cursor: pointer;
  box-shadow: rgba(0, 0, 0, .1) 0 0 1px 1px;
}

.dashboard-box .dashboard-icon {
  flex: 0 0 auto;
  text-align: center;
  padding: 0 50px;
}

.dashboard-box .dashboard-box-sm {
  padding: 20px;
}

.dashboard-box .dashboard-icon img {
  width: 70px;
  height: 70px;
}

.dashboard-box .dashboard-box-sm .dashboard-icon img {
  width: 45px;
  height: 45px;
}

.dashboard-box .dashboard-content {
  flex: 1 1 auto;
}

.dashboard-box .dashboard-content .dashboard-subtext {
  color: var(--muted-color);
}

.dashboard-box .dashboard-content .dashboard-text {
  font-size: 1.4rem;
  line-height: 1.8rem;
  font-weight: bold;
  color: var(--secondary-color);
}

.dashboard-box .dashboard-box-sm .dashboard-content .dashboard-text {
  font-size: 1.2rem;
  line-height: 2rem;
}


.label-checked {
  color: green;
  font-weight: normal;
  font-size: inherit;
}

.label-unchecked {
  color: red;
  font-weight: bold;
  font-size: 1rem;
  line-height: 1rem;
  padding-left: 6px;
}


.renet-input-group-text {
  background-color: var(--primary-color);
  color: #fff;
}


.highlighted-price {
  font-weight: 600;
  font-size: 120%;
  color: green;
}

.custom-file {
  position: relative;
}

.custom-file-label {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 4px;
  padding: 4px 10px;
  line-height: 25px;
  color: #6c757d;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  z-index: 1;
  transition: background-color 0.2s ease;
}

.custom-file-label:hover {
  background-color: #e2e6ea;
}

.energy-class-arrow {
  position: relative;
  color: white;
  padding: 10px 35px 10px 15px;
  margin: 4px 0;
  clip-path: polygon(0 0, 90% 0, 100% 50%, 90% 100%, 0 100%);
  font-weight: bold;
  min-width: 150px;
  opacity: .6;
  transition: all 0.3s ease-in-out;
}

.energy-class-arrow:hover {
  cursor: pointer;
  opacity: 1;
}

.energy-class-arrow.selected {
  opacity: 1;
  transform: scaleY(1.1);
}

.energy-class-arrow.selected::before {
  content: "";
  position: absolute;
  height: 80%;
  width: 85%;
  bottom: 2px;
  left: 2px;
  border-bottom: 2px solid white;
  border-left: 2px solid white;
}

.navbar-toggler {
  border: none;
}

.navbar-toggler:focus {
  box-shadow: none !important;
  border: none;
}

.icon-row {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 20px;
}

.icon-row .icon-row-icon {
  flex: 0 0 auto;
  margin-right: 10px;
}

.icon-row.icon-square-row .icon-row-icon .renet-icon {
  width: 60px;
  height: 60px;
}

.icon-row .icon-row-text .renet-icon-text {
  flex: 1 1 auto;
  text-align: left;
  font-size: 1.1rem;
}

#unrequired-fields {
  max-height: 70vh;
  overflow-y: auto;
  padding-right: 20px;
}

.field-group {
  padding: 4px 10px;
  border-radius: 6px;
  margin-bottom: 10px;
  min-height: 40px;
  border: 1px dashed #777;
}

.field-group .field {
  background-color: rgba(0, 158, 227, .1);
  margin: 6px 0;
  padding: 4px 8px;
}



.video-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.video-card-preview {
  width: 100%;
  height: 250px;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, .3);
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: .8;
}


.video-card-preview:hover,
.video-card-preview:hover svg {
  opacity: 1;
}

.video-card-preview svg {
  padding: 20px;
  height: 4rem;
  opacity: .8;
}

.video-watermark {
  position: absolute;
  bottom: 30%;
  left: 50%;
  opacity: 0.2;
  color: #fff;
  z-index: 999;
  transform: translateX(-50%);
  background: #000;
  font-size: 1.5rem;
}
