/* Fonts */
:root {
    --font-base: sans-serif;
    --font-base-weight: 300;
    --font-accent: sans-serif;
    --font-accent-weight: 600;

    /* Border Radius */
    --button-primary-border-radius: 10em;
    --button-secondary-border-radius: 10em;
    --button-cta-border-radius: 10em;
    --button-control-border-radius: 50%;
    --container-border-radius: 5px;

    /* Transition */
    --button-hover-transition: background-color 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;

    /* Paddings */
    --container-padding: 10px;
    --form-padding: 2em;

    /* Colors */
    /* Branding & Constants */
    --color-brand-primary: #c18757;
    --color-brand-secondary: #f0cb97;
    --color-brand-accent: #32395a;
    --color-black: #000000;
    --color-black-transparent: #00000080;
    --color-white: #ffffff;
    --color-white-transparent: #ffffff80;
    --color-gray-dark: #444;
    --color-gray-dark-dark: #222;
    --color-gray-light: silver;
    --color-red: #cc0000;
    --color-green: #00c73c;

    /* Body */
    --body-bg: var(--color-black);
    --body-text: var(--color-white);
    --body-hr: var(--color-white-transparent);

    /* Headers */
    --heading-h1: var(--body-text);
    --heading-h2: var(--body-text);
    --heading-h3: var(--body-text);
    --heading-h4: var(--body-text);

    /* Blinds */
    --blinds-bg: var(--body-bg);
    --blinds-opacity: 1;

    /* Left Column Gradient */
    --left-column-gradient-start: #000000aa;
    --left-column-gradient-end: #00000000;

    /* Links */
    --link-normal: var(--body-text);
    --link-hover: var(--color-brand-secondary);

    /* Switcher */
    --switcher-bg: var(--color-black);
    --switcher-shadow: 0 0 0 2px #ffffff40;
    --switcher-shadow-hover: 0 0 0 4px var(--color-white-transparent);
    --switcher-item-text: var(--body-text);
    --switcher-item--active-bg: var(--color-brand-accent);
    --switcher-item--active-text: var(--switcher-item-text);

    /* Buttons Primary */
    --button-hover-shadow: 0 0 0 3px var(--color-white-transparent);
    --button-primary-border: var(--color-white-transparent);
    --button-primary-bg: var(--color-brand-accent);
    --button-primary-text: var(--color-white);
    --button-primary-hover-bg: var(--color-brand-primary);
    --button-primary-hover-text: var(--color-black);

    /* Buttons Secondary */
    --button-secondary-bg: var(--color-brand-primary);
    --button-secondary-border: var(--button-primary-border);
    --button-secondary-text: var(--color-black);
    --button-secondary-hover-bg: var(--color-brand-secondary);
    --button-secondary-hover-text: var(--color-black);

    /* Buttons CTA */
    --button-cta-bg: var(--button-primary-bg);
    --button-cta-border: var(--button-primary-border);
    --button-cta-text: var(--button-primary-text);
    --button-cta-hover-bg: var(--button-primary-hover-bg);
    --button-cta-hover-text: var(--button-primary-hover-text);

    /* Buttons Control */
    --button-control-border: var(--button-primary-border);
    --button-control-bg: var(--button-primary-bg);
    --button-control-text: var(--button-primary-text);
    --button-control-hover-bg: var(--button-primary-hover-bg);
    --button-control-hover-text: var(--button-primary-hover-text);

    /* Popup & Gallery */
    --popup-bg: var(--color-black-transparent);
    --popup-text: var(--color-white);
    --popup-backdrop: var(--color-black-transparent);
    --popup-border: #ffffff20;
    --popup-backdrop-filter: blur(30px);

    /* Floorplan */
    --floorplan-bg: #000000;
    --floorplan-text: #888;
    --floorplan-text-active: var(--color-white);
    --floorplan-values: var(--color-white);
    --floorplan-values-hover-bg: #ffffff20;
    --floorplan-values-border: var(--color-gray-dark);

    --floorplan-overlay-bg: var(--popup-bg);
    --floorplan-overlay-backdrop-filter: var(--popup-backdrop-filter);

    /* Menu */
    --menu-bg: var(--color-black);
    --menu-text: var(--color-white);
    --menu-item-active-bg: var(--color-brand-accent);
    --menu-item-active-text: var(--menu-text);
    --menu-item-hover-bg: var(--color-brand-primary);
    --menu-item-hover-text: var(--color-black);
    --menu-header-bg: var(--color-gray-dark-dark);
    --menu-footer-bg: var(--menu-header-bg);
    --menu-footer-text: var(--color-white);
    --menu-footer-links: var(--link-normal);
    --menu-footer-links-hover: var(--link-hover);

    /* Slide Navigator */
    --slide-navigator-item-bg: #ffffff20;
    --slide-navigator-item-outline: var(--color-white-transparent);
    --slide-navigator-item-text: var(--color-white);
    --slide-navigator-item-active: var(--color-brand-accent);
    --slide-navigator-item-hover: var(--color-brand-primary);
    --slide-navigator-item-visited: var(--color-gray-dark-dark);

    /* Header Project Title */
    --header-project-title-text: var(--body-text);
    --header-slide-number-text: var(--color-brand-secondary);

    /* Tooltips */
    --tooltip-bg: var(--color-white);
    --tooltip-text: var(--color-black);

    /* Property Details */
    --property-details-bg: var(--color-black-transparent);
    --property-details-bg: #00000020;
    --property-details-text: var(--body-text);
    --property-details-backdrop-filter: var(--popup-backdrop-filter);

    /* Modules */

    /* Start */
    --start-button-bg: var(--color-black-transparent);
    --start-button-text: var(--color-white);
    --start-button-border: var(--color-white);
    --start-button-hover-bg: var(--color-brand-accent);
    --start-button-hover-text: var(--start-button-text);
    --start-button-hover-border: rgba(255, 255, 255, 0.2);
    --start-tagline-text: var(--color-brand-secondary);
    --start-hr: var(--color-brand-secondary);

    /* Panoramas */
    --hotspot-unset: var(--color-brand-accent);

    /* Masterplan */
    --masterplan-hotspot-size: 15px;
    --masterplan-hotspot-text-size: 12px;
    --masterplan-hotspot-text: transparent;
    --unit-popup-bg: var(--color-brand-accent);
    --unit-popup-text-property: var(--color-white-transparent);
    --unit-popup-text-value: var(--color-brand-secondary);
    --unit-row-divider: #ffffff20;
    --masterplan-disclaimer-text: var(--body-text);

    /* Inventory */
    --inventory-table-backdrop-filter: var(--popup-backdrop-filter);
    --inventory-table-bg: #ffffff20;
    --inventory-table-text: var(--body-text);
    --inventory-table-header-bg: var(--color-black-transparent);
    --inventory-table-header-text: var(--inventory-table-text);
    --inventory-table-row-divider: #ffffff20;
    --inventory-disclaimer-text: var(--body-text);

    /* Contacts */
    --contact-card-photo-border: var(--color-white-transparent);
    --contact-card-bg: var(--color-black-transparent);
    --contact-card-border: var(--color-brand-accent);

    /* Forms */
    --form-backdrop: var(--popup-backdrop);
    --form-bg: var(--color-white);
    --form-text: var(--color-black);
    --form-title: var(--color-brand-accent);
    --form-subtitle: var(--form-title);
    --form-backdrop-filter: var(--popup-backdrop-filter);
    --form-border: var(--color-brand-accent);

    /* Inputs */
    --input-border: var(--color-gray-light);

    /* Controls (checkbox/radio) */
    --control-border: var(--color-brand-accent);
    --control-bg: var(--color-white);
    --control-shadow: var(--control-border);

    --control-checked-bg: var(--control-border);
    --control-checked-border: var(--control-border);

    --control-disabled-bg: var(--color-gray-light);
    --control-disabled-border: var(--color-black);

    --control-checked-mark: var(--color-white);

    /* Site Location */
    --map-type-switcher-bg: var(--color-gray-light);
    --map-type-switcher-active-bg: var(--color-green);
    --map-type-switcher-thumb: var(--color-white);
    --map-type-switcher-text: var(--body-text);

    --map-poi-size: 30px;
    --pano-poi-size: var(--map-poi-size);
    --map-poi-poject-site-size: 60px;
    --pano-poi-poject-site-size: var(--map-poi-poject-site-size);

    --pano-callout-height: 50px;
    --pano-callout-bg: #00000080;
    --pano-callout-text: var(--color-white);
    --pano-callout-line: var(--color-white);

    --poi-icon-size: 60%;

    --poi-default-bg: #000000;

    --poi-default-hover-bg: var(--color-brand-accent);
    --poi-border: #ffffff80;

    --poi-popup-bg: var(--color-brand-accent);
    --poi-popup-text: var(--color-white);
    --poi-popup-distance-text: var(--color-brand-secondary);

    --poi-type-recreation: #93a83c;
    --poi-type-transit: #457c5b;
    --poi-type-education: #8031bd;
    --poi-type-shopping: #c7883f;
    --poi-type-medical: #3f65c7;
    --poi-type-arterials: #87480e;
    --poi-type-employers: #0e8780;
    --poi-type-logistics: #e9b200;
    --poi-type-petrol: #c74e3f;
    --poi-type-fb: #fe60a7;
    --poi-type-port: #006bf7;
    --poi-type-airport: #34b2d1;
    --poi-type-site-location: var(--poi-default-bg);

    /* Status Filters */
    --status-filter-bg: none;
    --status-filter-backdrop-filter: none;
    --status-filter-text: var(--body-text);
    --inventory-status-filter-bg: var(--color-brand-accent);
    --inventory-status-filter-text: var(--inventory-table-text);

    /* Statuses */
    --status-all: #cacaca;
    --status-unset: rgb(114, 114, 114);
    --status-available: rgb(64, 205, 58);
    --status-reserved: #ffae00;
    --status-sold: #df0000;
    --status-leased: #ee0000;
    --status-under-contract: #4b40e9;
    --status-withdrawn: #9900ff;
    --status-future-release: #5f77ff;
    --status-stage_2: #617a8f;
}

/* Legasy */
* {
    --footerHeight: 60px;
    --headerHeight: 60px;
}