/* Shared reference navigation. Brand-blue travel texture with T174 red accents and compact icons. */
/* T117: exact owner-requested Dhaka reference composition; travel labels and palette. */
@font-face {
  font-family: TravelsianDockNunito;
  src: url("assets/dock-reference-t117/Nunito.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
}
@font-face {
  font-family: TravelsianDockDuotone;
  src: url("assets/dock-reference-t117/fa-duotone-900.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: block;
}
.dock-glyph {
  position: relative;
  font-family: TravelsianDockDuotone !important;
  font-style: normal;
  font-weight: 900;
  letter-spacing: normal;
  line-height: 1;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  --dock-primary: #fff;
  --dock-secondary: #b9e3ef;
  --dock-secondary-opacity: 0.62;
}
.dock-glyph:before {
  position: absolute;
  color: var(--dock-primary);
  opacity: 1;
}
.dock-glyph:after {
  color: var(--dock-secondary);
  opacity: var(--dock-secondary-opacity);
}
.dock-house:before {
  content: "\f015";
}
.dock-house:after {
  content: "\f015\f015";
}
.dock-book:before {
  content: "\f518";
}
.dock-book:after {
  content: "\f518\f518";
}
.dock-heart:before {
  content: "\f004";
}
.dock-heart:after {
  content: "\f004\f004";
}
.dock-cart:before {
  content: "\f07a";
}
.dock-cart:after {
  content: "\f07a\f07a";
}
.dock-receipt:before {
  content: "\f543";
}
.dock-receipt:after {
  content: "\f543\f543";
}
.dock-plane:before {
  content: "\f072";
}
.dock-plane:after {
  content: "\f072\f072";
}
.dock-calendar:before {
  content: "\f274";
}
.dock-calendar:after {
  content: "\f274\f274";
}
.dock-phone:before {
  content: "\f095";
}
.dock-phone:after {
  content: "\f095\f095";
}
.dock-chat:before {
  content: "\f4ad";
}
.dock-chat:after {
  content: "\f4ad\f4ad";
}
.app-dock.app-dock-curve {
  --dock-tile: url("assets/dock-travel-t123/travel-line-art.svg");
  --dock-accent: linear-gradient(145deg, #d84a50, var(--red) 55%, #94151c);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  position: fixed;
  inset: auto 12px calc(12px + env(safe-area-inset-bottom, 0px));
  width: auto;
  max-width: 403px;
  margin: 0 auto;
  z-index: 40;
  height: calc(62px * var(--dock-scale, 1));
  min-height: calc(62px * var(--dock-scale, 1));
  overflow: visible;
  border: 0;
  border-radius: calc(31px * var(--dock-scale, 1));
  padding: 0 var(--dock-inline-padding, 10px);
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
.app-dock.app-dock-curve:before,
.app-dock.app-dock-curve:after {
  content: none;
}
.app-dock.app-dock-curve > .dock-surface {
  position: absolute;
  inset: calc(-20px * var(--dock-scale, 1)) 0 0;
  width: 100%;
  height: calc(100% + 20px * var(--dock-scale, 1));
  z-index: 0;
  overflow: visible;
  pointer-events: none;
  filter: drop-shadow(0 8px 14px #00000026);
}
.app-dock.app-dock-curve .dock-item,
.app-dock.app-dock-curve .dock-item[aria-current="page"] {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: calc(22px * var(--dock-scale, 1)) calc(
      14px * var(--dock-scale, 1)
    );
  align-content: center;
  justify-items: center;
  gap: 0;
  width: 100%;
  min-width: 0;
  height: calc(62px * var(--dock-scale, 1));
  min-height: calc(62px * var(--dock-scale, 1));
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 16px;
  background: none;
  box-shadow: none;
  color: #8b9497;
  font:
    400 calc(10.5px * var(--dock-scale, 1)) / calc(14px * var(--dock-scale, 1))
      Arial,
    sans-serif;
  letter-spacing: 0;
  text-decoration: none;
  text-align: center;
  scale: 1;
  transform: none;
  transition: color 250ms;
  -webkit-tap-highlight-color: transparent;
}
.app-dock.app-dock-curve .dock-item:before {
  content: none;
}
.app-dock.app-dock-curve .dock-item:after {
  content: "";
  position: absolute;
  top: auto;
  bottom: calc(6.5px * var(--dock-scale, 1));
  left: calc(50% - 2.5px * var(--dock-scale, 1));
  width: calc(5px * var(--dock-scale, 1));
  height: calc(5px * var(--dock-scale, 1));
  border-radius: 50%;
  background: #b81d24;
  box-shadow: 0 0 6px 2px #b81d2480;
  opacity: 0;
  transform: none;
  transition: opacity 240ms;
  animation: none;
  pointer-events: none;
}
.app-dock.app-dock-curve .dock-item > .dock-glyph,
.app-dock.app-dock-curve .dock-item .app-contact-orb {
  position: relative;
  inset: auto;
  display: grid;
  place-items: center;
  width: calc(24px * var(--dock-scale, 1));
  height: calc(22px * var(--dock-scale, 1));
  margin: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-size: calc(18px * var(--dock-scale, 1));
  line-height: 1;
  scale: 1;
  transform: none;
  transition:
    transform 420ms cubic-bezier(0.22, 0.8, 0.22, 1),
    filter 300ms;
}
.app-dock.app-dock-curve .dock-item .dock-glyph {
  --dock-primary: currentColor;
  --dock-secondary: currentColor;
  --dock-secondary-opacity: 0.6;
  color: #fff;
}
.app-dock.app-dock-curve .dock-item > span:not(.app-contact-orb) {
  line-height: calc(14px * var(--dock-scale, 1));
  white-space: nowrap;
  transform: translateY(calc(-1.5px * var(--dock-scale, 1)));
}
.app-dock.app-dock-curve .dock-item:not(.is-dock-highlighted) {
  row-gap: calc(4px * var(--dock-scale, 1));
}
.app-dock.app-dock-curve
  .dock-item:not(.is-dock-highlighted)
  > span:not(.app-contact-orb) {
  transform: none;
}
.app-dock.app-dock-curve .dock-item.is-dock-highlighted {
  color: #b81d24;
  font-weight: 700;
  background: none;
}
.app-dock.app-dock-curve .dock-item > .dock-glyph,
.app-dock.app-dock-curve .dock-item .app-contact-orb {
  top: 0;
}
.app-dock.app-dock-curve .dock-item.is-dock-highlighted .dock-glyph {
  color: #b81d24;
  --dock-secondary-opacity: 1;
}
.app-dock.app-dock-curve .dock-item.is-dock-highlighted:after {
  opacity: 1;
}
.app-dock.app-dock-curve .dock-item.is-dock-highlighted > .dock-glyph,
.app-dock.app-dock-curve .dock-item.is-dock-highlighted .app-contact-orb {
  transform: translateY(calc(-16px * var(--dock-scale, 1)));
  filter: drop-shadow(0 0 3px #b81d2433);
}
.app-dock.app-dock-curve .dock-item:active {
  background: none;
}
.app-dock.app-dock-curve .dock-item:focus {
  outline: none;
}
.app-dock.app-dock-curve .dock-item:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -3px;
  border-radius: 16px;
}
.app-dock.app-dock-curve .app-contact-slot {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
  min-height: calc(62px * var(--dock-scale, 1));
  height: calc(62px * var(--dock-scale, 1));
}
.app-dock.app-dock-curve .app-contact-orb > .dock-glyph {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: calc(18px * var(--dock-scale, 1));
  line-height: 1;
}
.app-dock.app-dock-curve .contact-phone {
  opacity: 1;
  animation: reference-contact-call 5s ease-in-out -2.5s infinite;
}
.app-dock.app-dock-curve .contact-chat {
  display: grid;
  opacity: 0;
  animation: reference-contact-chat 5s ease-in-out -2.5s infinite;
}
.app-dock.app-dock-curve .app-contact-menu {
  right: 0;
}
.app-dock.app-dock-curve .app-contact-menu:after {
  right: calc(var(--dock-slot-width) / 2 - 7px);
}

.app-dock-primary > .dock-plane:before,
.app-dock-primary > .dock-plane:after {
  transform: rotate(-45deg);
  transform-origin: center;
}
@media (min-width: 1025px) {
  .app-dock.app-dock-curve {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .app-dock.app-dock-curve .dock-item,
  .app-dock.app-dock-curve .dock-item:after,
  .app-dock.app-dock-curve .dock-item > .dock-glyph,
  .app-dock.app-dock-curve .dock-item .app-contact-orb {
    transition: none;
  }
}

/* Clear chat bubble; Contact shares the same white/red treatment as other icons. */
.app-dock.app-dock-curve .app-contact-orb > .contact-chat:before {
  content: "";
  position: static;
  display: block;
  width: calc(17px * var(--dock-scale, 1));
  height: calc(17px * var(--dock-scale, 1));
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M12 2C5.9 2 1 6.1 1 11.2c0 2.4 1.1 4.7 3 6.4L3 22l5-2.1c1.3.4 2.6.6 4 .6 6.1 0 11-4.2 11-9.3S18.1 2 12 2Z'/%3E%3Cg fill='black'%3E%3Ccircle cx='7' cy='11' r='1.4'/%3E%3Ccircle cx='12' cy='11' r='1.4'/%3E%3Ccircle cx='17' cy='11' r='1.4'/%3E%3C/g%3E%3C/svg%3E")
    center / contain no-repeat;
  mask-mode: luminance;
}
.app-dock.app-dock-curve .app-contact-orb > .contact-chat:after {
  content: none;
}

@keyframes reference-contact-call {
  0%,
  40%,
  100% {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
  50%,
  90% {
    opacity: 0;
    transform: scale(0.55) rotate(-20deg);
  }
}
@keyframes reference-contact-chat {
  0%,
  40%,
  100% {
    opacity: 0;
    transform: scale(0.55);
  }
  50%,
  90% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-dock.app-dock-curve .contact-phone {
    animation: none;
    opacity: 1;
    transform: none;
  }
  .app-dock.app-dock-curve .contact-chat {
    animation: none;
    display: none;
  }
}

/* Cart quantity is nested inside the Shop glyph so it never adds a grid row. */
.app-dock .cart-count {
  position: absolute;
  top: calc(-6px * var(--dock-scale, 1));
  right: calc(-7px * var(--dock-scale, 1));
  display: grid;
  place-items: center;
  min-width: calc(15px * var(--dock-scale, 1));
  height: calc(15px * var(--dock-scale, 1));
  padding: 0 3px;
  border-radius: 12px;
  background: #b81d24;
  color: #fff;
  border: 1px solid transparent;
  transition: border-color 280ms ease;
  font:
    700 calc(9px * var(--dock-scale, 1))/1 Arial,
    sans-serif;
  font-style: normal;
  pointer-events: none;
}
.app-dock .dock-item.is-dock-highlighted .cart-count {
  border-color: #ffffffb3;
}
@media (prefers-reduced-motion: reduce) {
  .app-dock .cart-count {
    transition: none;
  }
}
.app-dock .cart-count[hidden] {
  display: none;
}
.cart-live {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}