/* Ko dodaš novo variablo, ne pozabi dodati tudi v drugih temah v imeTeme/css/variables.css */

:root {
  /* font-family*/
  --font-header: "PT Sans", sans-serif, sans-serif;
  --font-text: "Roboto", sans-serif;
  --font-text-weight: 300;

  /* colors by project */
  --gray-dark: #333;
  --gray-light: #f2f2f2;
  --blue: #02b0ae;
  --blue--hover: #02a4a1;
  --orange: #fc513f;

  /* variables */
  --text-color: var(--gray-dark);
  --primary-color: var(--blue);
  --component-bg: var(--gray-light);
  --border-color: #d1d1d6;
  --bg-gray--light: var(--gray-light);

  /* buttons */
  --btn--font-weight: 400;
  --btn--border-color: var(--blue);

  --btn-border--text-color: var(--blue);
  --btn-border--text-color--hover: #fff;
  --btn-border--bg-color--hover: var(--blue);

  --btn-bg--text-color: var(--blue);
  --btn-bg--text-color--hover: #fff;
  --btn-bg--bg-color: transparent;
  --btn-bg--bg-color--hover: var(--blue);

  --btn-open-mob-nav--line-color: var(--gray-dark);

  --link-readmore--color: var(--blue);

  /* slick slider*/
  --slick-arrow--bg--hover: var(--blue);

  /* fancybox */
  --fancy-arrow--bg--hover: var(--blue);

  /* ElementMoon and ElementHeader */
  --circle-info--bg: var(--blue);
  --circle-info--bg--hover: var(--blue--hover);
  --circle-info--text-color: #fff;
  --circle-info--text-weight: 300;

  /* tables */
  --table--border-color: var(--border-color);
  --table--arrow-color: #b3b3b8;
  --table--row-bg--hover: var(--gray-light);
  --table--link-color--hover: var(--blue);
  --table--background-dark: var(--gray-dark);

  /* table: apartment detail */
  --table-apartments--thead-bg: var(--gray-light);

  /* table: poi-list */
  --table--poi-popup--text-color: #636363;
  --table--poi-popup--link-color: var(--blue);

  /* forms */
  --form-checkbox--bg-color: #fff;
  --form-checkbox--border-color: #585858;
  --form-checkbox--bg-color-checked: var(--blue);
  --form-checkbox--border-color-checked: var(--blue);
  --form-range--label-value--color: var(--blue);

  
  /* apartment list*/
  --apartment-list--header-image--svg-building-fill: var(--orange);
  --apartment-list--header-image--svg-name-fill: var(--orange);

  /* apartment detail*/
  --apartment-detail--short-info-item--primary--border-color: var(--blue);
  --apartment-detail--short-info-item--primary--text-color: var(--blue);

  --apartment-detail--short-info-item--price--border-color: var(--gray-dark);
  --apartment-detail--short-info-item--price--text-color: var(--gray-dark);

  --apartment-detail--short-info-item--reserved--border-color: yellow;
  --apartment-detail--short-info-item--reserved--text-color: yellow;

  --apartment-detail--short-info-item--sold--border-color: var(--orange);
  --apartment-detail--short-info-item--sold--text-color: var(--orange);

  --apartment-detail--doc-list--text-color: var(--blue);
  --apartment-detail--doc-list--svg-stroke: var(--blue);

  /* form */
  --form-border-color: var(--border-color);
  --form-checkbox-bg-color: var(--border-color);
  --form-checkbox-bg-color--checked: var(--blue);
}