/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./apps/floori/src/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* You can add global styles to this file, and also import other style files */
* {
  margin: 0;
  padding: 0;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  outline: none !important;
}

a,
a:visited {
  outline: none !important;
  text-decoration: none;
}

a:hover,
a:active,
a:focus {
  background: transparent !important;
}

html {
  width: 100dvw;
  max-height: 100vh;
  overflow: hidden;
}

@supports (max-height: 100dvh) {
  html {
    max-height: 100dvh;
  }
}
body {
  overflow-y: hidden;
}
body floori-root {
  display: flex;
  flex-direction: column;
  height: 100vh;
}
body floori-root main {
  height: inherit;
}
@supports (height: 100dvh) {
  body floori-root {
    height: 100dvh;
  }
}

/* ── EYE-CATCHING TUTORIAL HIGHLIGHTS (NO OVERLAY BLUR) ── */
/* ── STEP 1: FAVOURITES SPOTLIGHT HIGHLIGHT ── */
body.tutorial-highlight-fav floori-action-bar,
body.tutorial-highlight-fav .action-buttons,
body.tutorial-highlight-fav .first,
body.tutorial-highlight-fav .second,
body.tutorial-highlight-fav .floori-action-bar {
  position: relative !important;
  z-index: 9999999 !important;
  overflow: visible !important;
}
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=fav]),
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=heart]),
body.tutorial-highlight-fav floori-action-bar button[id*=fav],
body.tutorial-highlight-fav floori-action-bar button[aria-label*=fav],
body.tutorial-highlight-fav .favourite-btn,
body.tutorial-highlight-fav .fav-btn {
  position: relative !important;
  z-index: 9999999 !important;
  overflow: visible !important;
  background: #16a34a !important;
  color: #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 4px #ffffff, 0 0 0 10px #16a34a, 0 0 45px #22c55e !important;
  animation: flFavPulseGlow 1.4s infinite ease-in-out !important;
  /* Floating Pointer Badge */
}
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=fav]) floori-icon,
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=heart]) floori-icon,
body.tutorial-highlight-fav floori-action-bar button[id*=fav] floori-icon,
body.tutorial-highlight-fav floori-action-bar button[aria-label*=fav] floori-icon,
body.tutorial-highlight-fav .favourite-btn floori-icon,
body.tutorial-highlight-fav .fav-btn floori-icon {
  color: #ffffff !important;
}
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=fav])::after,
body.tutorial-highlight-fav floori-action-bar button:has(floori-icon[name*=heart])::after,
body.tutorial-highlight-fav floori-action-bar button[id*=fav]::after,
body.tutorial-highlight-fav floori-action-bar button[aria-label*=fav]::after,
body.tutorial-highlight-fav .favourite-btn::after,
body.tutorial-highlight-fav .fav-btn::after {
  content: "MY FAVOURITES" !important;
  position: absolute !important;
  bottom: calc(100% + 16px) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
  color: #ffffff !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  padding: 6px 14px !important;
  border-radius: 9999px !important;
  white-space: nowrap !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 8px 24px rgba(22, 163, 74, 0.8), 0 0 0 2px #ffffff !important;
  pointer-events: none !important;
  animation: flFavTagBounce 1.2s infinite ease-in-out !important;
  z-index: 99999999 !important;
}

@keyframes flFavTagBounce {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  50% {
    transform: translateX(-50%) translateY(-6px);
  }
}
@keyframes flFavPulseGlow {
  0% {
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px #16a34a, 0 0 25px rgba(34, 197, 94, 0.8);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 0 5px #ffffff, 0 0 0 14px rgba(22, 163, 74, 0.4), 0 0 50px rgb(34, 197, 94);
    transform: scale(1.22);
  }
  100% {
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px #16a34a, 0 0 25px rgba(34, 197, 94, 0.8);
    transform: scale(1);
  }
}
/* ── STEP 2: AR MODE SPOTLIGHT HIGHLIGHT ── */
body.tutorial-highlight-ar .ar-feature-card {
  position: relative !important;
  z-index: 999999 !important;
  border: 3px solid #16a34a !important;
  background: linear-gradient(135deg, rgba(22, 163, 74, 0.22) 0%, rgba(22, 163, 74, 0.4) 100%) !important;
  box-shadow: 0 0 0 4px #ffffff, 0 0 0 10px #16a34a, 0 0 50px rgba(34, 197, 94, 0.95) !important;
  animation: flArSpotlightGlow 1.5s infinite ease-in-out !important;
  /* Floating Pointer Badge */
}
body.tutorial-highlight-ar .ar-feature-card .ar-badge {
  background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(22, 163, 74, 0.7) !important;
  font-weight: 900 !important;
  letter-spacing: 0.6px !important;
}
body.tutorial-highlight-ar .ar-feature-card .product-qr-box {
  border: 3px solid #16a34a !important;
  box-shadow: 0 0 22px rgba(22, 163, 74, 0.8) !important;
}
body.tutorial-highlight-ar .ar-feature-card .ar-open-btn {
  background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
  box-shadow: 0 6px 20px rgba(22, 163, 74, 0.7) !important;
  animation: flArBtnPulse 1.2s infinite ease-in-out !important;
}
body.tutorial-highlight-ar .ar-feature-card::after {
  content: "VIEW IN YOUR ROOM (AR)" !important;
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
  color: #ffffff !important;
  font-family: "Inter", system-ui, sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 900 !important;
  padding: 5px 12px !important;
  border-radius: 9999px !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 4px 16px rgba(22, 163, 74, 0.7), 0 0 0 2px #ffffff !important;
  pointer-events: none !important;
  animation: flArBadgeSlide 1.2s infinite ease-in-out !important;
  z-index: 1000000 !important;
}

@keyframes flArBadgeSlide {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-4px);
  }
}
@keyframes flArSpotlightGlow {
  0% {
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 8px #16a34a, 0 0 30px rgba(34, 197, 94, 0.8);
  }
  50% {
    box-shadow: 0 0 0 5px #ffffff, 0 0 0 14px rgba(22, 163, 74, 0.5), 0 0 60px rgb(34, 197, 94);
  }
  100% {
    box-shadow: 0 0 0 3px #ffffff, 0 0 0 8px #16a34a, 0 0 30px rgba(34, 197, 94, 0.8);
  }
}
@keyframes flArBtnPulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 4px 16px rgba(22, 163, 74, 0.4);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 8px 24px rgba(22, 163, 74, 0.8);
  }
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./libs/floori-web/styles/src/lib/themes/default/_breakpoints.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/

/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./libs/floori-web/styles/src/lib/common.scss?ngGlobalStyle ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.floori-d-block {
  display: block;
}

.floori-d-flex {
  display: flex;
}

.floori-d-grid {
  display: grid;
}

.floori-d-inline {
  display: inline;
}

.floori-d-inline-block {
  display: inline-block;
}

.floori-d-inline-flex {
  display: inline-flex;
}

.floori-d-inline-grid {
  display: inline-grid;
}

.floori-d-initial {
  display: initial;
}

.floori-d-inherit {
  display: inherit;
}

.floori-d-none {
  display: none;
}

.floori-flex-column {
  flex-direction: column;
}

.floori-flex-column-reverse {
  flex-direction: column-reverse;
}

.floori-flex-row {
  flex-direction: row;
}

.floori-flex-row-reverse {
  flex-direction: row-reverse;
}

.floori-text-center {
  text-align: center;
}

.floori-text-left {
  text-align: left;
}

.floori-text-right {
  text-align: right;
}

.floori-text-justify {
  text-align: justify;
}

.floori-w100prc {
  width: 100%;
}

.floori-flex-1 {
  flex: 1;
}

.floori-flex-0 {
  flex: 0;
}

.floori-justify-content-space-between {
  justify-content: space-between;
}

.floori-justify-content-center {
  justify-content: center;
}

.floori-justify-content-end {
  justify-content: flex-end;
}

.floori-align-items-center {
  align-items: center;
}

.floori-pointer {
  cursor: pointer;
}

floori-root {
  height: 100%;
}

.hidden-ui {
  display: none !important;
}

.no-select {
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
}
.no-select * {
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
}

/*# sourceMappingURL=styles.16af8218a3fddb5c.css.map*/