/** Shopify CDN: Minification failed

Line 539:18 Expected identifier but found whitespace
Line 540:0 Unexpected "has("

**/
/*
 * SACHA DRAKE Rewards History
 * Desktop polish only.
 * Mobile styling remains controlled by the working JavaScript.
 */

@media (min-width: 750px) {

  /* Popup position and darker background */
  html body
  [role="dialog"]:has(.sacha-rh),
  html body
  [aria-modal="true"]:has(.sacha-rh) {
    background: #ffffff !important;
    border-radius: 4px !important;
    bottom: 24px !important;
    box-shadow:
      0 0 0 100vmax rgba(0, 0, 0, 0.76),
      0 12px 40px rgba(0, 0, 0, 0.18) !important;
    box-sizing: border-box !important;
    height: auto !important;
    left: 50% !important;
    margin: 0 !important;
    max-height:
      calc(100dvh - 48px) !important;
    max-width:
      calc(100vw - 48px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: fixed !important;
    right: auto !important;
    top: 24px !important;
    transform:
      translateX(-50%) !important;
    width:
      min(920px, calc(100vw - 48px)) !important;
  }

  /* Centre the Rewards History title */
  html body
  [role="dialog"]:has(.sacha-rh) h1,
  html body
  [role="dialog"]:has(.sacha-rh) h2,
  html body
  [role="dialog"]:has(.sacha-rh) h3,
  html body
  [role="dialog"]:has(.sacha-rh)
  [role="heading"],
  html body
  [aria-modal="true"]:has(.sacha-rh) h1,
  html body
  [aria-modal="true"]:has(.sacha-rh) h2,
  html body
  [aria-modal="true"]:has(.sacha-rh) h3 {
    text-align: center !important;
    width: 100% !important;
  }

  /* Give the table breathing room */
  .sacha-rh.sacha-rh.sacha-rh {
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width:
      calc(100% - 40px) !important;
    overflow-x: hidden !important;
    width:
      calc(100% - 40px) !important;
  }

  /* Desktop pill tabs */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs {
    background: #f6f2ee ;
    border:
      1px solid #bd8a1d ;
    border-radius: 999px ;
    box-sizing: border-box ;
    display: flex ;
    gap: 0 ;
    margin:
      14px auto 18px ;
    max-width: 520px ;
    overflow: hidden ;
    padding: 0 ;
    width: 100% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button {
    align-items: center ;
    background: #f6f2ee ;
    border: 0 ;
    border-radius: 0 ;
    box-sizing: border-box ;
    color: #111111 ;
    display: flex ;
    flex: 1 1 50% ;
    font-size: 11px ;
    font-weight: 600 ;
    height: 42px ;
    justify-content: center ;
    letter-spacing: 0.02em ;
    margin: 0 ;
    max-width: 50% ;
    min-width: 0 ;
    padding: 0 12px ;
    text-align: center ;
    text-transform: uppercase ;
    width: 50% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button.is-active {
    background: #caa552 ;
    color: #111111 ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button + button {
    border-left:
      1px solid #bd8a1d ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs button span {
    display: none ;
  }

  /*
   * The heading and every row now use
   * exactly the same five columns.
   */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-header,
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-row {
    box-sizing: border-box ;
    column-gap: 0 ;
    display: grid ;
    grid-template-columns:
      18% 22% 22% 18% 20% ;
    width: 100% ;
  }

  /* Table heading */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-header {
    align-items: center ;
    background: #f6f2ee ;
    /* border:
      1px solid #ded8d2 ; */
    color: #171717 ;
    font-size: 11px ;
    font-weight: 500 ;
    padding: 10px 16px ;
    text-transform: none ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-header > * {
    box-sizing: border-box ;
    text-align: center ;
    font-weight: 600;
    font-size: 14px;
  }

  .yotpo-widget-my-rewards-widget .yotpo-rewards-history-wrapper :not(.yotpo-is-mobile) .yotpo-rewards-history-title {
    margin-bottom: 10px ;
  }

  /* Desktop rows */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-row {
    align-items: center ;
    background: #ffffff ;
    border: 0 ;
    border-bottom:
      1px solid #ded8d2 ;
    border-radius: 0 ;
    margin: 0 ;
    min-height: 61px ;
    padding: 11px 16px ;
  }
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-row:last-child {
    border-bottom: none ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-cell {
    box-sizing: border-box ;
    font-size: 12px !important;
    line-height: 1.4 ;
    min-width: 0 ;
    text-align: center ;
  }

  /* Reward information */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-reward {
    text-align: center ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-reward strong {
    font-size: 13px !important;
    margin-bottom: 2px !important;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-reward small {
    font-size: 12px !important;
  }

  /*
   * Fixed voucher-code layout:
   * - heading shares the same column
   * - codes finish on the same line
   * - icons form one straight line
   * - icons remain close to each code
   */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code {
    align-items: center ;
    display: grid ;
    gap: 5px ;
    grid-template-columns:
      100px 16px ;
    justify-content: center ;
    position: relative ;
    text-align: center ;
    transform: none ;
    width: 100% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > span {
    display: block ;
    font-size: 12px ;
    letter-spacing: 0.01em ;
    line-height: 1.3 ;
    overflow: visible ;
    text-align: right ;
    white-space: nowrap ;
    width: 100px ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > button {
    background: transparent ;
    border: 0 ;
    color: #b8891f ;
    display: block ;
    flex: none ;
    font-size: 0 ;
    height: 16px ;
    left: auto ;
    margin: 0 ;
    min-width: 16px ;
    padding: 0 ;
    position: relative ;
    right: auto ;
    top: auto ;
    transform: none ;
    width: 16px ;
  }

  /* Status pills */
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-status {
    align-items: center ;
    border: 0 ;
    border-radius: 999px ;
    display: inline-flex ;
    font-size: 10px ;
    font-weight: 600 ;
    justify-content: center ;
    line-height: 1 ;
    min-width: 54px ;
    padding: 6px 9px ;
    text-transform: none ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-status--active {
    background: #111111 ;
    color: #ffffff ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-status--expired,
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-status--used-online {
    background: #f3f0ec ;
    color: #77706c ;
  }
}
/* Exact 50/50 mobile tabs */
@media (max-width: 749px) {
  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs {
    display: grid ;
    gap: 0 ;
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr) ;
    overflow: hidden ;
    position: relative ;
    width: 100% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button {
    align-items: center ;
    bottom: auto ;
    display: flex ;
    flex: none ;
    font-size: 0 ;
    height: 50px ;
    inset: auto ;
    left: auto ;
    margin: 0 ;
    max-width: 100% ;
    min-width: 0 ;
    padding: 0 ;
    position: relative ;
    right: auto ;
    top: auto ;
    transform: none ;
    width: 100% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button::before {
    content: none ;
    display: none ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs > button::after {
    align-items: center ;
    box-sizing: border-box ;
    color: #111111 ;
    display: flex ;
    font-size: 11px ;
    font-weight: 600 ;
    height: 100% ;
    inset: 0 ;
    justify-content: center ;
    letter-spacing: 0 ;
    position: absolute ;
    text-align: center ;
    transform: none ;
    width: 100% ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs >
  button:first-of-type::after {
    content: "VOUCHERS" ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs >
  button:last-of-type::after {
    content:
      "POINTS & ACTIVITY" ;
  }

  .sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs button span {
    display: none ;
  }
}
/* Stop mobile tabs being positioned twice */
@media (max-width: 749px) {
  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs >
  button:first-of-type {
    grid-column: 1 ;
    inset: auto ;
    left: auto ;
    position: relative ;
    right: auto ;
    transform: none ;
  }

  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-tabs >
  button:last-of-type {
    grid-column: 2 ;
    inset: auto ;
    left: auto ;
    position: relative ;
    right: auto ;
    transform: none ;
  }
}
/* Keep mobile copy icon beside the voucher code */
@media (max-width: 749px) {
  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-voucher
  .sacha-rh-code {
    column-gap: 5px ;
    display: grid ;
    grid-template-areas:
      "code-label code-label"
      "code-value copy-icon" ;
    grid-template-columns:
      max-content 18px ;
    justify-content: start ;
    justify-self: start ;
    width: max-content ;
  }

  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code::before {
    grid-area: code-label ;
  }

  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > span {
    grid-area: code-value ;
    width: auto ;
  }

  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > button {
    grid-area: copy-icon ;
    left: auto ;
    margin: 0 ;
    position: relative ;
    right: auto ;
    transform: none ;
  }
}
/* Mobile: place copy icon directly after voucher code */
@media (max-width: 749px) {
  html body
  div.sacha-rh.sacha-rh.sacha-rh.sacha-rh
  article.sacha-rh-voucher
  div.sacha-rh-code {
    display: block ;
    font-size: 0 ;
    grid-template: none ;
    justify-self: start ;
    max-width: 100% ;
    text-align: left ;
    width: max-content ;
  }

  html body
  div.sacha-rh.sacha-rh.sacha-rh.sacha-rh
  article.sacha-rh-voucher
  div.sacha-rh-code::before {
    display: block ;
    font-size: 10px ;
    margin-bottom: 7px ;
    text-align: left ;
    width: 100% ;
  }

  html body
  div.sacha-rh.sacha-rh.sacha-rh.sacha-rh
  article.sacha-rh-voucher
  div.sacha-rh-code > span {
    display: inline-block ;
    font-size: 12.5px ;
    line-height: 20px ;
    text-align: left ;
    vertical-align: middle ;
    white-space: nowrap ;
    width: auto ;
  }

  html body
  div.sacha-rh.sacha-rh.sacha-rh.sacha-rh
  article.sacha-rh-voucher
  div.sacha-rh-code > button {
    display: inline-block ;
    height: 20px ;
    left: auto ;
    margin: 0 0 0 5px ;
    position: relative ;
    right: auto ;
    top: auto ;
    transform: none ;
    vertical-align: middle ;
    width: 20px ;
  }
}
/* Restore desktop copy icon */
@media (min-width: 750px) {
  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > button {
    background-color:
      transparent ;
    background-image:
      url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b8891f'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='9'%20y='9'%20width='10'%20height='10'%20rx='1'/%3E%3Cpath%20d='M15%209V6a1%201%200%200%200-1-1H6a1%201%200%200%200-1%201v8a1%201%200%200%200%201%201h3'/%3E%3C/svg%3E") ;
    background-position:
      center ;
    background-repeat:
      no-repeat ;
    background-size:
      16px 16px ;
    color: transparent ;
    display: block ;
    height: 18px ;
    overflow: hidden ;
    text-indent: -9999px ;
    width: 18px ;
  }

  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > button::before,
  html body
  .sacha-rh.sacha-rh.sacha-rh.sacha-rh
  .sacha-rh-code > button::after {
    content: none ;
    display: none ;
  }
}
/* Remove copy button from expired vouchers */
.sacha-rh-voucher:
has(.sacha-rh-status--expired)
.sacha-rh-code > button {
  display: none ;
}
/* Stable copy-icon position */
.sacha-rh-voucher:has(
  .sacha-rh-status--expired
) .sacha-rh-code button {
  display: none ;
}

@media (max-width: 749px) {
  .sacha-rh.sacha-rh .sacha-rh-code {
    align-items: center ;
    column-gap: 7px ;
    display: grid ;
    grid-template-areas:
      "code-label code-label"
      "code-value code-copy" ;
    grid-template-columns:
      max-content 20px ;
    justify-content: start ;
    max-width: 100% ;
    overflow: visible ;
    position: relative ;
    row-gap: 7px ;
    text-align: left ;
    width: max-content ;
  }

  .sacha-rh.sacha-rh
  .sacha-rh-code::before {
    grid-area: code-label ;
    margin: 0 ;
    text-align: left ;
  }

  .sacha-rh.sacha-rh
  .sacha-rh-code > span {
    display: block ;
    grid-area: code-value ;
    margin: 0 ;
    width: auto ;
  }

  .sacha-rh.sacha-rh
  .sacha-rh-code > button {
    align-self: center ;
    bottom: auto ;
    grid-area: code-copy ;
    height: 20px ;
    inset: auto ;
    left: auto ;
    margin: 0 ;
    min-width: 20px ;
    position: relative ;
    right: auto ;
    top: auto ;
    transform: none ;
    width: 20px ;
  }
}
/* Desktop: scroll inside Rewards History */
@media (min-width: 750px) {
  html:has(.sacha-rh),
  body:has(.sacha-rh) {
    overflow: hidden ;
    overscroll-behavior: none ;
  }

  [role="dialog"]:has(.sacha-rh),
  [aria-modal="true"]:has(.sacha-rh) {
    -webkit-overflow-scrolling: touch ;
    max-height: calc(100dvh - 40px) ;
    overflow-x: hidden ;
    overflow-y: auto ;
    overscroll-behavior: contain ;
    scrollbar-gutter: stable;
  }
}
/* Hide desktop scrollbar but retain scrolling */
@media (min-width: 750px) {
  .sacha-rh {
    -ms-overflow-style: none ;
    scrollbar-width: none ;
  }
  
  .sacha-rh::-webkit-scrollbar {
    display: none ;
    height: 0 ;
    width: 0 ;
  }
}
.sacha-rh-status--redeemed {
  background: #c9a44f ;
  border-color: #c9a44f ;
  color: #111111 ;
}
@media (max-width: 749px) {
  div .sacha-rh .sacha-rh-row:last-child {
    border-bottom: 1px solid var(--rh-border) !important;
  }
  div .sacha-rh .sacha-rh-cell::before {
    font-size: 10px !important;
  }
  div .yotpo-widget-my-rewards-widget.yotpo-widget-override-css .yotpo-is-mobile button {
      min-width: unset !important;
  }
  div .sacha-rh .sacha-rh-reward small,
  div  .sacha-rh .sacha-rh-cell {
    font-size: 12px !important;
  }
}