/* Selection Colors (matching Studio theme) */
:root {
  --pc-selection-red: #ed6a5a;
  --pc-selection-green: #1c8578;
  --pc-selection-purple: #8d6a9f;
  --pc-selection-yellow: #deb841;
  --pc-selection-blue: #13499a;
  --pc-selection-gray: #9f9f9f;
}

.mud-dialog .mud-dialog-content.photo-viewer-dialog-content {
  padding: 0px;
  margin: 0px;
}

.mud-dialog.photo-viewer-dialog {
  background: rgba(0, 0, 0, 0.8);
}

.drag-select-area {
  background-color: hsl(210deg 80% 50% / 50%);
  border: 1px solid hsl(210deg 80% 50% / 75%);
  box-sizing: border-box;
}

.heading-link-copybutton {
  display: none;
}

.linear-progress {
    background: silver;
    width: 50vw;
    height: 0.5rem;
    border-radius: 10rem;
    overflow: hidden;
    position: relative;
}

.linear-progress:after {
  content: '';
  position: absolute;
  inset: 0;
  background: #93B7DA;
  scale: var(--blazor-load-percentage, 0%) 100%;
  transform-origin: left top;
  transition: scale ease-out 0.5s;
}

.cyp-login-logged-in-container {
  width: 100%;
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
}

.hide-loading-banner ~ .loading-banner {
  display: none;
}

.cyp-loader-container {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2300;
  height: 100vh;
  width: 100vw;
  background-color: var(--mud-palette-background);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media (max-width: 960px) {

  .cyp-appbar-logo {
    height: 20px;
    margin-right: 12px;
    margin-left: -10px;
  }

  .filter-drawer {
    width: 100%;
  }

  .cyp-appbar-drawer-background {
    position: fixed;
    left: 0px;
    width: 100vw;
    height: 100vh;
    display: flex;
    background-color: var(--mud-palette-overlay-dark);
    z-index: 1050;
  }

  .cyp-appbar-drawer-content.surface-white {
    padding: 0px;
    height: 100%;
    border-radius: 0px 0px 24px 24px;
  }

  .cyp-appbar-drawer {
    position: fixed;
    left: 0px;
    width: 100%;
    height: 340px;
    z-index: 1100;
    transition: transform 325ms cubic-bezier(0,0,.2,1) 0ms;
  }
  
  .cyp-appbar-drawer.cyp-hidden {
    top: -340px;
  }
  
  .cyp-appbar-drawer.cyp-hidden:not(.cyp-appbar-drawer--initial) {
    animation: cyp-appbar-drawer-slide-up 375ms cubic-bezier(0,0,.2,1) 0ms 1;
  }
  
  .cyp-appbar-drawer.cyp-visible {
    top: 70px;
    animation: cyp-appbar-drawer-slide-down 375ms cubic-bezier(0,0,.2,1) 0ms 1;
  }
  
  .cyp-appbar-drawer-background.cyp-hidden {
      display: none;
  }
  
  .search-text-chip-container {
    top: calc(var(--mud-appbar-height) - var(--mud-appbar-height)/8);
    margin-right: 8px;
    margin-top: 8px;
  }

  .thumbnail {
    max-width: 130px;
  }

  .cyp-row-radio-col-name {
    flex-grow: 1;
  }

  .cyp-row-radio-desc-in-name {
      display: none;
  }

  .cyp-selected .cyp-row-radio-desc-in-name {
    display: initial;
  }

  .cyp-row-radio-col-price {
    min-width: 70px;
    max-width: 70px;
  }

  .cyp-radio-col-description {
    display: none;
  }

  .cyp-row-radio-col-selected-check {
    min-width: 70px;
    display: flex;
    justify-content: center;
  }

  .cyp-row-radio-col-selected-check.cyp-shipping-check {
    display: none;
  }

  .cyp-row-radio-col {
    padding: 16px 4px;
  }

  .mud-stepper-header p {
      display: none;
  }

  .best-seller-item-3 {
      display: none;
  }
  .best-seller-item-4 {
    display: none;
  }
  .best-seller-item-5 {
    display: none;
  }
}

@media (max-width: 630px) {
  .best-seller-item-2 {
    display: none;
  }
}

@media (min-width: 961px) {

  .mud-toolbar-gutters {
    padding-left: 10px;
  }

  .cyp-appbar-logo {
    height: 20px;
    margin-right: 12px;
    margin-left: -10px;
  }

  .categories-grid-item {
    max-width: 450px;
    padding: 18px 24px !important;
  }

  .filter-drawer {
    max-width: 550px;
  }

  .added-to-cart-dialog.cyp-visible {
    animation: cyp-added-to-cart-dialog-fade-in 825ms cubic-bezier(0,0,.2,1) 0ms 1;
    animation-fill-mode: both;
    position: fixed;
    right: 0px;
    z-index: var(--mud-zindex-tooltip);
    top: calc(var(--mud-appbar-height) + 2px);
  }

  .added-to-cart-dialog.cyp-hidden {
    display: none;
  }

  .search-text-chip-container {
    top: var(--mud-appbar-height);
    margin-right: 16px;
    margin-top: 16px;
  }

  .thumbnail {
    max-width: 200px;
  }

  .cyp-row-radio-col-name {
    min-width: 200px;
    max-width: 200px;
  }

  .cyp-row-radio-desc-in-name {
    display: none;
  }

  .cyp-row-radio-col-price {
    min-width: 250px;
    max-width: 250px;
  }

  .cyp-row-radio-col-selected-check {
    min-width: 60px;
  }

  .cyp-row-radio-selected-check-in-price {
    display: none;
  }

  .cyp-row-radio-col {
    padding: 16px;
  }
}
@media (min-width: 961px) and (max-width: 1280px) {
  .best-seller-item-4 {
    display: none;
  }

  .best-seller-item-5 {
    display: none;
  }
}
@media (min-width: 1281px) and (max-width: 1600px) {
  .best-seller-item-5 {
    display: none;
  }
}

.best-seller-item {
    max-width: 300px;
}

.mud-appbar .mud-badge.mud-badge-top.right.mud-badge-overlap {
  inset: auto auto calc(100% - 17px) calc(100% - 16px);
}

.mud-appbar .mud-select .mud-select-input .mud-input-adornment-end {
  display: none;
}

.mud-appbar .mud-input.mud-input-outlined.mud-input-adorned-end {
  padding-right: 0px;
  padding-inline-end: 0px;
}

.cyp-appbar-left-spacer {
    padding-right: 120px;
}

.footer-top-row {
  height: 50px;
}

.mud-appbar .mud-button-label .mud-button-icon-start {
  margin-inline-start: 4px;
  margin-inline-end: 4px;
}

.added-to-cart-container .mud-button-label .mud-button-icon-start {
  margin-inline-start: 4px;
  margin-inline-end: 4px;
}

.added-to-cart-container .added-to-cart-shield .mud-button {
  padding: 6px 6px;
  min-width: 0px;
}

.mud-appbar .mud-input.mud-input-outlined .mud-input-outlined-border {
    border-width: 0px;
}

.desktop-text-search {
  position: fixed;
  top: var(--mud-appbar-height);
  right: 0px;
  margin-right: 16px;
  width: 550px;
  z-index: 2000;
}

.desktop-text-search .pa-3 {
  padding-top: 0px!important
}

.desktop-text-search .mud-input-control {
    margin-top: 0px;
}

.search-text-chip-container {
  position: fixed;
  right: 0px;
  z-index: var(--mud-zindex-appbar);
}

.cookie-accept-container.cyp-hidden {
  display: none;
}

.desktop-text-search.cyp-hidden {
  display: none;
}

.mud-chip.search-text-chip {
  max-width: 25vw;
}

.search-text-chip .mud-chip-content {
  text-wrap: wrap;
}

.cyp-order-container {
  position: fixed;
  bottom: 72px;
  right: 16px;
  z-index: 1500;
}

.cyp-order-selected-option {
  margin-bottom: 16px;
}

.mud-popover-provider > .mud-paper {
  background-color: var(--mud-palette-background);
}

.cyp-order-options {
  position: fixed;
  bottom: calc(72px + 160px);
  width: 350px;
  margin-right: 16px;
  z-index: 1400;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: end;
  transition: transform 325ms cubic-bezier(0,0,.2,1) 0ms;
}

.cyp-order-options-item {
  display: flex;
  justify-content: center;
}

.cyp-order-options.cyp-visible {
  right: 0px;
  animation: cyp-order-options-slide-out-bottom 325ms cubic-bezier(0,0,.2,1) 0ms 1;
}

.cyp-order-options.cyp-hidden {
  right: -350px;
}

.cyp-order-options.cyp-hidden:not(.cyp-order--initial) {
  animation: cyp-order-options-slide-in-bottom 325ms cubic-bezier(0,0,.2,1) 0ms 1;
}

@keyframes cyp-order-options-slide-in-bottom {
  from {
    right: 0px;
  }
}

@keyframes cyp-order-options-slide-out-bottom {
  from {
    right: -350px;
  }
}

@keyframes cyp-added-to-cart-dialog-fade-in {
    from {
        opacity: 0.2;
    }
    to {
        opacity: 1;
    }
}

.thumbnail-container {
  display: flex;
  flex-direction: row;
  width: calc(100% - 10px);
  overflow-x: scroll;
  justify-content: center;
}

.thumbnail {
  opacity: 0.6;
}

.thumbnail:hover {
  opacity: 1;
}

.attachment-popup-image {
    cursor: pointer;
}

.snkrd-ls {
  width: 60%;
}
.snkrd-rs {
    width: 40%;
}
.snkrd-image-carausel {
    aspect-ratio: 16 / 9;
}


.cyp-iv-dialog-thumbnail-img {
  opacity: 0.6;
}

.cyp-iv-dialog-thumbnail-img:hover {
  opacity: 1;
}

.cyp-iv-dialog-close {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 100;
}

@media (orientation: portrait) {

  .cyp-iv-dialog-container {
    display: flex;
    flex-direction: column;
  }

  .cyp-iv-dialog-carausel {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  @media (max-width: 960px) {

    .cyp-iv-dialog-close {
      bottom: 24px;
      right: -16px;
      top: unset;
    }

    .cyp-iv-dialog-carausel {
      height: 80vh;
    }

    div.cyp-iv-dialog-thumbnail {
      height: 20vh;
      flex-direction: row-reverse;
    }

    .cyp-iv-dialog-thumbnail-img {
      transform: rotate(90deg) scale(1.09);
    }

    .cyp-iv-dialog-carausel {
      aspect-ratio: 9 / 16;
    }

    .cyp-iv-dialog-main-img {
      transform: rotate(90deg) translate(-54%, 12%) scale(1.974);
      transform-origin: left bottom;
    }
  }

  @media (min-width: 961px) {

    .cyp-iv-dialog-carausel {
      aspect-ratio: 16 / 9;
    }
  }

  .cyp-iv-dialog-thumbnail {
    display: flex;
    flex-direction: row;
    width: calc(100% - 10px);
    overflow-x: scroll;
    justify-content: center;
  }
  .cyp-iv-dialog-thumbnail-img {
    width: var(--cyp-iv-dialog-thumbnail-width);
  }
}

@media (orientation: landscape) {

  .cyp-iv-dialog-container {
    display: flex;
    flex-direction: row;
    height: 100%;
  }

  .cyp-iv-dialog-carausel {
    aspect-ratio: 16 / 9;
    width: 80vw;
    height: 100%;
    display: flex;
    justify-content: center;
  }


  .cyp-iv-dialog-thumbnail {
    display: flex;
    flex-direction: column;
    width: 20vw;
    overflow-x: scroll;
    justify-content: space-evenly;
  }
}

ul.ul-text-page {
  list-style-type: disc;
  list-style-position: inside;
}

ol.ol-text-page {
  list-style-position: inside;
}

.cart-table .mud-table-cell {
  border-bottom: 1px solid var(--mud-palette-primary);
}

.product-added-to-cart {
  backdrop-filter: blur(1px);
}

.cart-table .mud-table-cell a img:hover {
    opacity: 0.8;
}

a.sneaker-card:hover, a.other-product-card:hover, a.categories-grid-link:hover h3 {
  animation-name: opacity-07;
  animation-duration: 500ms;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
}
a.sneaker-card:hover, a.other-product-card:hover, a.categories-grid-link:hover img {
  animation-name: opacity-07;
  animation-duration: 500ms;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
}

.sneaker-card-sale-img-container {
  position: relative;
}
.sneaker-card-sale-icon {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
}
.sneaker-card-price {
  white-space: nowrap;
}

@media (min-width: 961px) {
  .sneaker-card-sale-icon > svg {
    font-size: 4.25rem;
  }
}

@media (max-width: 960px) {
  .sneaker-card-sale-icon > svg {
    font-size: 2.15rem;
  }
}

@keyframes opacity-07 {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0.7;
  }
}

.surface-white.mud-paper {
  background-color: var(--mud-palette-info);
  padding: 12px;
}

.mud-input-control.surface-white .mud-input.mud-input-outlined {
  background-color: var(--mud-palette-surface);
}

.mud-input-control.surface-white .mud-input-label-outlined {
  background-color: var(--mud-palette-surface);
}

.product-filter-panel.mud-expand-panel {
  background-color: rgba(255,255,255,0);
}

.cart-stepper .mud-button {
    margin-top: 12px;
}

.cyp-container-90 {
  width: 90%;
}

.cyp-row-radio {
  border-top-color: var(--mud-palette-primary);
  border-top-width: 1px;
}
.cyp-row-radio:nth-child(1) {
  border-top-width: 0px;
}

.cyp-row-radio:hover {
  background-color: var(--mud-palette-dark-hover);
}
.cyp-row-radio.cyp-selected {
  background-color: rgba(147,183,218,0.158823529411764705);
}

.cyp-row-radio.cyp-disabled {
  opacity: 0.6;
}

.cyp-row-radio.cyp-disabled:hover {
  background-color: inherit;
}

.absolute {
    position: absolute;
}

iframe.fbarat-iframe {
  height: 80vh;
  width: 100%;
  border: none;
}
.cart-stepper .mud-input.mud-disabled {
  color: rgba(66,66,66,0.7);
  cursor: default;
}
.cart-stepper .mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol.mud-disabled {
  color: rgba(66,66,66,0.7);
  cursor: default;
}
.cart-stepper .mud-input.mud-disabled > textarea.mud-input-root {
  cursor: default;
}

.cart-stepper .mud-input.mud-disabled > .mud-input-adornment {
  color: rgba(66,66,66,0.7);
}

.cart-stepper .mud-switch.mud-disabled {
  color: rgba(66,66,66,0.7) !important;
}

.mud-main-content:has(div.sneakers-container) .mud-scroll-to-top.visible {
  bottom: 160px;
}

.filter-fab {
  z-index: 1600;
  position: fixed;
  bottom: 16px;
  right: 16px;
}

.filter-drawer-background {
  position: fixed;
  left: 0px;
  width: 100vw;
  height: 100vh;
  display: flex;
  background-color: var(--mud-palette-overlay-dark);
  z-index: 2100;
}

.filter-drawer-content.surface-white {
  overflow: hidden;
  padding: 0px;
  margin: 0px 16px;
  height: 100%;
  border-radius: 24px 24px 0px 0px;
}

.filter-drawer {
  position: fixed;
  right: 0px;
  height: 75vh;
  z-index: 2200;
  transition: transform 325ms cubic-bezier(0,0,.2,1) 0ms;
}

.filter-drawer.cyp-hidden {
  bottom: -75vh;
}

.filter-drawer.cyp-hidden:not(.filter-drawer--initial) {
  animation: filter-drawer-slide-up 375ms cubic-bezier(0,0,.2,1) 0ms 1;
}

.filter-drawer.cyp-visible {
  bottom: 0px;
  animation: filter-drawer-slide-down 375ms cubic-bezier(0,0,.2,1) 0ms 1;
}

.filter-drawer-background.cyp-hidden {
    display: none;
}

.filter-drawer-inner {
  height: 100%;
  overflow: auto;
  padding: 12px;
}

@keyframes filter-drawer-slide-up {
  from {
    bottom: 0px;
  }
}
@keyframes filter-drawer-slide-down {
  from {
    bottom: -75vh;
  }
}

@keyframes cyp-appbar-drawer-slide-up {
  from {
    top: 70px;
  }
}

@keyframes cyp-appbar-drawer-slide-down {
  from {
    top: -340px;
  }
}

.px-18 {
  padding-left: 72px;
  padding-right: 72px;
}

[style*="--aspect-ratio"] > :first-child {
  width: 100%;
}

[style*="--aspect-ratio"] > img {
  height: auto;
}

.cookie-accept-container {
  position: fixed;
  bottom: 0px;
  left: 0px;
  z-index: 2000;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.cookie-accept-container.not-cookie-info-page {
  height: 100%;
}

.cookie-accept-background {
  flex-grow: 1;
  width: 100%;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
}

.cookie-accept-content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  width: 100%;
  padding: 16px;
  background-color: var(--mud-palette-dark)
}

.newsletter-container {
  width: 100%;
  padding: 24px;
  position: relative;
}

.newsletter-image-container {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
}
.newsletter-image-container > img {
    width: 99vw;
}
.newsletter-text-container {
  width: 90%;
  position: absolute;
  top: 0;
  left: 5%;
  z-index: 5;
  padding: 32px 0px;
  display: flex;
}
.newsletter-container .mud-input.mud-input-filled {
  background-color: #ffffffff;
}
.newsletter-container .mud-input.mud-input-filled:hover {
  background-color: #ffffffdd;
}
.newsletter-container .mud-button-filled.mud-button-filled-info {
  color: var(--mud-palette-dark);
}
.newsletter-subscribe {
  display: flex;
  flex-direction: column;
  gap: 24px;
  justify-content: center;
  width: 100%;
}

.newsletter-subscribe-button {
  padding: 15px;
  margin-top: 6px;
}


@media (max-width: 505px) {
  .newsletter-image-container > img {
    height: 294px;
  }

  .newsletter-container {
    height: 294px;
  }
}

@media (min-width: 506px) and (max-width: 960px) {
  .newsletter-image-container > img {
    height: 258px;
  }

  .newsletter-container {
    height: 258px;
  }
}

@media (min-width: 961px) and (max-width: 1196px) {
  .newsletter-image-container > img {
    height: 286px;
  }

  .newsletter-container {
    height: 286px;
  }
}

@media (min-width: 1197px) {
  .newsletter-image-container > img {
    height: 212px;
  }
  .newsletter-container {
      height: 212px;
  }
}

.cyp-size-table-container {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
  height: 100%;
  position: relative;
}
.cyp-size-table-img-container {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.cyp-size-table-img {
  opacity: 0.2;
}

.cyp-size-table-tbl {
    width: 100%;
}

.cyp-size-table-tbl.mud-simple-table table * tr>td, .cyp-size-table-tbl.mud-simple-table table * tr th {
  text-align: center;
}

@media (min-width: 961px) {
  .cyp-size-table-img.mud-image.fluid {
    max-width: 70%;
  }  
}

.mud-avatar.mud-avatar-large.cyp-avatar-xl {
  width: 72px;
  height: 72px;
  font-size: 1.5rem;
}

.mud-avatar.mud-avatar-large.cyp-avatar-xl.mud-avatar-filled-primary > .mud-icon-root.mud-svg-icon {
  fill: var(--mud-palette-primary-text)
}

.mud-avatar.mud-avatar-large.cyp-avatar-xl.mud-avatar-filled-transparent > .mud-icon-root.mud-svg-icon {
  fill: var(--mud-palette-text-primary)
}

.mud-icon-size-large.cyp-icon-size-xl {
  font-size: 3rem;
}

.cyp-order-status-container {
   position: relative;
   display: flex;
   flex-direction: column;
   gap: 32px;
   margin: 12px 0px;
}

.cyp-order-status-progress {
  position: absolute;
  top: 0;
  left: 32px;
  height: 100%;
}

.cyp-order-status-container > .cyp-order-status-progress > .mud-progress-linear > .mud-progress-linear-bars > .mud-progress-linear-bar {
  transform: translateY(var(--cyp-order-status-translate-percent)) !important;
}

.cyp-order-status-text-container {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 100%;
  flex-grow: 1;
}

.cyp-order-status-title, .cyp-order-status-description {
  display: flex;
  justify-content: start;
  gap: 12px;
}

@media (max-width: 960px) {
  .cyp-order-status-description {
    flex-direction: column;
    gap: 6px;
  }
}

@media (min-width: 961px) {
  .cyp-order-status-description {
  }
}

.cyp-order-status-left, .cyp-order-status-right {
    width: 50%;
}

.just-in-container {
  display: flex;
}

@media (max-width: 960px) {
  .just-in-container {
    flex-direction: column-reverse;
  }
}
@media (min-width: 961px) {
  .just-in-text-container {
    flex-grow: 1;
  }
  .just-in-link{
    flex-grow: 1;
  }
}

.cyp-size-select-list-container {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
}

.cyp-size-select-list-item {
  min-width: 90px;
}

.mud-button.cyp-size-select-list-item {
  padding: 6px;
}

.cyp-size-select-list-item.mud-button-filled.mud-button-filled-primary:hover,
.cyp-size-select-list-item.mud-button-filled.mud-button-filled-primary:focus-visible {
  background-color: var(--mud-palette-primary);
}
.cyp-size-select-list-item.mud-button-filled:hover,
.cyp-size-select-list-item.mud-button-filled:focus-visible {
  box-shadow: 0 3px 1px -2px rgba(0,0,0,.2), 0 2px 2px 0 rgba(0,0,0,.14), 0 1px 5px 0 rgba(0,0,0,.12);
}

.cyp-size-select-list-item.mud-button-outlined {
  background-color: var(--mud-palette-info);
}

.order-status-update-btn {
  margin: 24px 0px;
}

.test-banner {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 1000;
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: var(--mud-palette-secondary);
}

.order-status-rating-container-outer {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 12px;
}
.order-status-rating-container {
  display: flex;
  width: 100%;
  gap: 12px;
  align-items: center;
}
.order-status-rating-stars {
  display: flex;
}

@media (max-width: 960px) {
  .order-status-rating-container {
    flex-direction: column;
  }
}

@media (min-width: 961px) {
  .order-status-rating-button {
    display: flex;
    justify-content: right;
  }
  .order-status-rating-box {
    flex: 1;
    display: flex;
  }
  .order-status-rating-stars {
    justify-content: center;
  }
  .order-status-rating-stars {
    justify-content: center;
  }
  .order-status-rating-button {
    justify-content: right;
  }
}

.order-status-rating-star {
  cursor: pointer;
}





.old-price {
  text-decoration: line-through;
  color: var(--mud-palette-dark-lighten);
}




















