/* ===========================
   Project Tokens & Variables
   =========================== */

/* ------Global Fonts---- */

@font-face {
  font-family: "Lato-Black";
  src: url("/wp-content/uploads/fonts/Lato-Black.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
}

@font-face {
  font-family: "Lato-Regular";
  src: url("/wp-content/uploads/fonts/Lato-Regular.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
}

@font-face {
  font-family: "Roboto-Variable";
  src:
    url("/wp-content/uploads/fonts/Roboto-Variable.woff2") format("woff2"),
    url("/wp-content/uploads/fonts/Roboto-Variable.ttf") format("opentype");
  font-weight: 100 900;
  font-style: normal;
}

* {
  --font-header: "Lato-Black", serif;
  --font-header-inner: "Lato-Regular", sans-serif;
  --font-body: "Roboto-Variable", sans-serif;
  --font-body-light: "Roboto-Variable", sans-serif;
  --font-link: "Roboto-Variable", sans-serif;
  --font-button: var(--font-body), sans-serif;
  --font-menu: "Roboto-Variable", sans-serif;

  --font-weight-thin: 100;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --floorCloseButtonIcon: url('data: image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.40002 18.6538L5.34619 17.6L10.9462 12L5.34619 6.40002L6.40002 5.34619L12 10.9462L17.6 5.34619L18.6538 6.40002L13.0538 12L18.6538 17.6L17.6 18.6538L12 13.0538L6.40002 18.6538Z" fill="white" /></svg>');
}

/* -----------Primitive Colors--------------------------------------------- */

:root {
  /* primary-base */
  --color-primary: rgb(165, 24, 28);
  --color-primary-90: rgba(165, 24, 28, 0.9);
  --color-primary-70: rgba(165, 24, 28, 0.7);
  --color-primary-50: rgba(165, 24, 28, 0.5);
  --color-primary-30: rgba(165, 24, 28, 0.3);
  --color-primary-20: rgba(165, 24, 28, 0.2);
  --color-primary-10: rgba(165, 24, 28, 0.1);
  --color-primary-05: rgba(165, 24, 28, 0.05);

  /* ------------------------------------------------------ */

  /* secondary-base */
  --color-secondary: rgb(78, 78, 78);
  --color-secondary-90: rgba(78, 78, 78, 0.9);
  --color-secondary-70: rgba(78, 78, 78, 0.7);
  --color-secondary-50: rgba(78, 78, 78, 0.5);
  --color-secondary-30: rgba(78, 78, 78, 0.3);
  --color-secondary-20: rgba(78, 78, 78, 0.2);
  --color-secondary-10: rgba(78, 78, 78, 0.1);
  --color-secondary-05: rgba(78, 78, 78, 0.05);

  /* --------- */

  /* tertiary-base  */
  --color-tertiary: rgba(215, 213, 213, 1);
  --color-tertiary-90: rgba(215, 213, 213, 0.9);
  --color-tertiary-70: rgba(215, 213, 213, 0.7);
  --color-tertiary-50: rgba(215, 213, 213, 0.5);
  --color-tertiary-30: rgba(215, 213, 213, 0.3);
  --color-tertiary-20: rgba(215, 213, 213, 0.2);

  /* quaternary-base */
  --color-quaternary: rgb(222, 220, 218);
  --color-quaternary-90: rgba(222, 220, 218, 0.9);
  --color-quaternary-70: rgba(222, 220, 218, 0.7);
  --color-quaternary-50: rgba(222, 220, 218, 0.5);
  --color-quaternary-30: rgba(222, 220, 218, 0.3);
  --color-quaternary-20: rgba(222, 220, 218, 0.2);
  --color-quaternary-10: rgba(222, 220, 218, 0.1);
  --color-quaternary-05: rgba(222, 220, 218, 0.05);

  /* quinary-base //light-gray */
  --color-quinary: rgba(255, 229, 18, 1);
  --color-quinary-90: rgba(255, 229, 18, 0.9);
  --color-quinary-70: rgba(255, 229, 18, 0.7);
  --color-quinary-50: rgba(255, 229, 18, 0.5);
  --color-quinary-30: rgba(255, 229, 18, 0.3);
  --color-quinary-20: rgba(255, 229, 18, 0.2);

  /* base colors ------------------- */

  --color-black: #000000;
  --color-white: #ffffff;
  --color-black-rgb: 0, 0, 0;
  --color-white-rgb: 255, 255, 255;

  /* neutral grays ------------------- */
  --color-gray-900: rgb(26, 26, 26);
  --color-gray-700: rgb(77, 77, 77);
  --color-gray-500: rgb(128, 128, 128);
  --color-gray-300: rgb(179, 179, 179);
  --color-gray-100: rgb(242, 242, 242);

  /* gradiant colors------------------*/

  --gradient-brand-horizontal: linear-gradient(
    90deg,
    var(--color-primary) 0%,
    var(--color-primary) 100%
  );

  /* custom-colros-------------------------------------- */
  --color-gray-500: rgb(169, 169, 169); /* gray */
  --color-green: rgb(64, 205, 58); /* available */
  --color-orange: rgb(232, 172, 23); /* reserved */
  --color-red: rgb(255, 82, 82); /* sold */
  --color-blue: rgb(41, 110, 217); /* future release */
  --color-purpple: rgb(255, 0, 255);

  /* Opaque Colors (Solid) */
  --color-gray-500-opaque: rgb(var(--color-gray-500));
  --color-green-opaque: rgb(var(--color-green));
  --color-orange-opaque: rgb(var(--color-orange));
  --color-red-opaque: rgb(var(--color-red));
  --color-blue-opaque: rgb(var(--color-blue));

  /* Semi-Transparent Colors */
  --color-gray-500-opacity: rgba(var(--color-gray-500), 0.15);
  --color-green-opacity: rgba(var(--color-green), 0.15);
  --color-orange-opacity: rgba(var(--color-orange), 0.15);
  --color-red-opacity: rgba(var(--color-red), 0.15);
  --color-blue-opacity: rgba(var(--color-blue), 0.15);

  /* --------------------------------- */

  --iconPdf: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px"><path d="M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-8.5 7.5c0 .83-.67 1.5-1.5 1.5H9v2H7.5V7H10c.83 0 1.5.67 1.5 1.5v1zm5 2c0 .83-.67 1.5-1.5 1.5h-2.5V7H15c.83 0 1.5.67 1.5 1.5v3zm4-3H19v1h1.5V11H19v2h-1.5V7h3v1.5zM9 9.5h1v-1H9v1zM4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm10 5.5h1v-3h-1v3z"/></svg>');
  --iconEye: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M607.5-372.5Q660-425 660-500t-52.5-127.5Q555-680 480-680t-127.5 52.5Q300-575 300-500t52.5 127.5Q405-320 480-320t127.5-52.5Zm-204-51Q372-455 372-500t31.5-76.5Q435-608 480-608t76.5 31.5Q588-545 588-500t-31.5 76.5Q525-392 480-392t-76.5-31.5ZM214-281.5Q94-363 40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200q-146 0-266-81.5ZM480-500Zm207.5 160.5Q782-399 832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280q113 0 207.5-59.5Z"/></svg>');
  --iconEmail: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px"><path d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm320-280 320-200v-80L480-520 160-720v80l320 200Z"/></svg>');
}