/* Ordexa additions to the original theme (UI pieces that had no class in frontend-ui). */

[hidden] { display: none !important; }

.store-toast {
  display: flex; align-items: flex-start; gap: .625rem;
  padding: .75rem 1rem; border-radius: .75rem;
  background: rgb(var(--cl-card)); border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 20px 50px -20px rgba(0,0,0,.8);
  animation: store-toast-in .2s ease-out;
}
.store-toast > i { margin-top: .15rem; color: #22c55e; }
.store-toast > i[data-type="error"] { color: #ef4444; }
.store-toast p { flex: 1; font-size: .875rem; }
.store-toast button { color: rgba(var(--cl-t-primary), .5); }
.store-toast button:hover { color: rgb(var(--cl-t-primary)); }
@keyframes store-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.store-demo-hint { margin-top: .6rem; font-size: .75rem; color: rgba(var(--cl-t-primary), .5); display: flex; gap: .4rem; align-items: center; }
.store-demo-hint i { color: rgb(var(--cl-accent)); }
.store-link-button { display: block; margin: .9rem auto 0; font-size: .8rem; color: rgba(var(--cl-t-primary), .55); text-decoration: underline; text-underline-offset: 3px; }
.store-link-button:hover { color: rgb(var(--cl-accent)); }

/* Simple shell used by pages ported from plain templates */
.store-page { width: 100%; max-width: 1280px; margin: 0 auto; padding: 2rem 1rem 4rem; }
@media (min-width: 768px) { .store-page { padding: 3rem 1.5rem 5rem; } }

.store-empty { text-align: center; padding: 3rem 1rem; color: rgba(var(--cl-t-primary), .6); }
.store-empty i { font-size: 2.5rem; color: rgba(var(--cl-t-primary), .25); margin-bottom: 1rem; display: block; }

.store-card { background: rgb(var(--cl-card)); border: 1px solid rgba(255,255,255,.06); border-radius: 1rem; padding: 1.25rem; }
.store-btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; padding: .6rem 1.25rem; border-radius: .6rem; font-weight: 600; background: rgb(var(--cl-accent)); color: rgb(var(--cl-t-accent)); border: 1px solid rgb(var(--cl-accent)); transition: opacity .2s; }
.store-btn:hover { opacity: .85; }
.store-btn:disabled { opacity: .5; pointer-events: none; }
.store-btn--ghost { background: transparent; color: rgb(var(--cl-accent)); }
.store-input { width: 100%; padding: .55rem .9rem; border-radius: .6rem; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.06); color: rgb(var(--cl-t-primary)); }
.store-input:focus { outline: none; border-color: rgb(var(--cl-accent)); box-shadow: 0 0 0 3px rgba(var(--cl-accent), .25); }

.store-gallery-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 2.5rem; height: 2.5rem; border-radius: 999px; background: rgba(0,0,0,.55); color: #fff; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); }
.store-gallery-arrow:hover { background: rgb(var(--cl-accent)); }

.editor ul { list-style: disc; padding-left: 1.25rem; margin: .75rem 0; }
.editor ol { list-style: decimal; padding-left: 1.25rem; margin: .75rem 0; }
.editor li { margin: .25rem 0; }
.editor h2 { font-size: 1.25rem; font-weight: 700; margin: 1.25rem 0 .5rem; }
.editor p { margin: .5rem 0; }
.editor a { color: rgb(var(--cl-accent)); text-decoration: underline; }

/* Checkout step (cart page) */
.store-checkout { margin-top: 1.5rem; padding: 1.5rem; border-radius: .75rem; background: rgb(var(--cl-card)); border: 1px solid rgba(255,255,255,.05); scroll-margin-top: 6rem; }
.store-checkout h2 { display: flex; align-items: center; gap: .6rem; font-weight: 700; margin: 1.5rem 0 .75rem; }
.store-checkout h2:first-child { margin-top: 0; }
.store-checkout h2 span { display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 999px; background: rgba(var(--cl-accent), .15); color: rgb(var(--cl-accent)); font-size: .8rem; }
.store-checkout__hint { margin-top: .5rem; font-size: .8rem; color: rgba(var(--cl-t-primary), .5); }
.store-pay-grid { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.store-pay-option { display: flex; align-items: center; gap: .65rem; padding: .7rem .85rem; border-radius: .65rem; border: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.02); font-size: .875rem; font-weight: 600; text-align: left; transition: border-color .2s, background .2s; }
.store-pay-option:hover { background: rgba(255,255,255,.04); }
.store-pay-option.is-selected { border-color: rgb(var(--cl-accent)); background: rgba(var(--cl-accent), .08); }
.store-pay-option > i { margin-left: auto; color: rgb(var(--cl-accent)); }
.store-pay-option .payment-mark { display: inline-grid; place-items: center; width: 2rem; height: 1.5rem; }
.store-pay-option .payment-mark svg { max-width: 2rem; max-height: 1.5rem; }
.store-checkbox { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1.5rem; font-size: .85rem; color: rgba(var(--cl-t-primary), .75); }
.store-checkbox input { margin-top: .2rem; accent-color: rgb(var(--cl-accent)); }
.store-checkbox a { color: rgb(var(--cl-accent)); }
.store-coupon { display: flex; gap: .5rem; }
.store-coupon .store-input { font-size: .85rem; padding: .45rem .7rem; }
.store-coupon button { padding: 0 .85rem; border-radius: .6rem; border: 1px solid rgba(var(--cl-accent), .5); color: rgb(var(--cl-accent)); font-size: .85rem; font-weight: 600; }
.store-checkout__secure { margin-top: .75rem; text-align: center; font-size: .75rem; color: rgba(var(--cl-t-primary), .45); }
.store-success-icon { width: 4rem; height: 4rem; margin: 0 auto 1rem; border-radius: 999px; display: grid; place-items: center; background: rgba(34,197,94,.15); color: #22c55e; font-size: 1.6rem; }

/* Policy pages (from frontend-ui terms/privacy/refund components) */
.policy-container {
    max-width: 850px;
    margin: 0 auto;
    background: #0d0e12;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 36px 32px;
    color: #cbd5e1;
    font-size: 15px;
    line-height: 1.75;
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
  }

  .policy-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding-bottom: 18px;
    margin-bottom: 24px;
  }

  .policy-header h2 {
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 6px 0;
  }

  .policy-header p {
    color: #94a3b8;
    font-size: 13px;
    margin: 0;
  }

  .policy-section {
    margin-bottom: 24px;
  }

  .policy-section h3 {
    color: #f8fafc;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px 0;
  }

  .policy-section p {
    margin: 0 0 10px 0;
  }

  .policy-section ul {
    margin: 0;
    padding-left: 20px;
  }

  .policy-section li {
    margin-bottom: 8px;
  }

  .policy-highlight {
    background: rgba(239, 68, 68, 0.1);
    border-left: 3px solid #ef4444;
    padding: 12px 16px;
    border-radius: 4px;
    margin-top: 12px;
    color: #fca5a5;
    font-size: 14px;
  }

  /* Custom styling for the Product Exception Card */
  .policy-card-special {
    background: rgba(59, 130, 246, 0.08);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: 8px;
    padding: 16px 20px;
    margin-top: 16px;
  }

  .policy-card-special h4 {
    color: #60a5fa;
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 10px 0;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .policy-card-special p {
    font-size: 14px;
    margin: 0 0 8px 0;
    color: #cbd5e1;
  }

  .policy-card-special p:last-child {
    margin: 0;
  }
.policy-section h3 { display: flex; align-items: center; gap: 8px; }
.policy-badge { display: inline-block; background: #2563eb; color: #ffffff; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 9999px; text-transform: uppercase; letter-spacing: 0.5px; }
.policy-section ul { list-style: disc; }

/* Utilities used by ported pages that weren't in the precompiled theme build */
.bg-accent-500\/15 { background-color: rgba(var(--cl-accent), .15); }
.border-white\/10 { border-color: rgba(255,255,255,.1); }
.bottom-0\.5 { bottom: .125rem; }
.left-5 { left: 1.25rem; }
.font-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.font-normal { font-weight: 400; }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hover\:border-accent-500:hover { border-color: rgb(var(--cl-accent)); }
.last\:border-0:last-child { border-width: 0; }
.max-h-\[28rem\] { max-height: 28rem; }
.max-w-\[16rem\] { max-width: 16rem; }
.max-w-\[80\%\] { max-width: 80%; }
.max-w-\[850px\] { max-width: 850px; }
.mt-3 { margin-top: .75rem; }
.mt-5 { margin-top: 1.25rem; }
.overflow-x-auto { overflow-x: auto; }
.place-items-center { place-items: center; }
.pointer-events-auto { pointer-events: auto; }
.pt-4 { padding-top: 1rem; }
.px-2\.5 { padding-left: .625rem; padding-right: .625rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.self-start { align-self: flex-start; }
.shrink-0 { flex-shrink: 0; }
.size-12 { width: 3rem; height: 3rem; }
.w-72 { width: 18rem; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.z-\[60\] { z-index: 60; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }
@media (min-width: 640px) {
  .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sm\:justify-center { justify-content: center; }
}

/* ---------- checkout ---------- */
.store-pay-note { display: block; font-size: .7rem; font-weight: 500; color: rgba(var(--cl-t-primary), .55); }
.store-crypto-picker { display: grid; gap: .75rem; margin-top: 1rem; }
@media (min-width: 640px) { .store-crypto-picker { grid-template-columns: 1fr 1fr; } .store-crypto-picker .store-checkout__hint { grid-column: 1 / -1; } }
.store-field { display: flex; flex-direction: column; gap: .35rem; font-size: .8rem; font-weight: 600; color: rgba(var(--cl-t-primary), .75); }
.store-field select option { background: rgb(var(--cl-card)); color: rgb(var(--cl-t-primary)); }

.ck { display: grid; gap: 1.5rem; padding: 2rem 0 4rem; }
@media (min-width: 1024px) { .ck { grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: 3rem; align-items: start; } .ck__summary { position: sticky; top: 6rem; } }
.ck__label { font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: rgba(var(--cl-t-primary), .5); }
.ck__total { font-size: 1.9rem; font-weight: 700; margin: .15rem 0 1.25rem; }
.ck__line, .ck__row { display: flex; justify-content: space-between; gap: 1rem; font-size: .875rem; }
.ck__line { padding: .6rem 0; }
.ck__line small { display: block; font-size: .75rem; color: rgba(var(--cl-t-primary), .5); }
.ck__sums { margin-top: .5rem; padding-top: .75rem; border-top: 1px solid rgba(255,255,255,.06); display: grid; gap: .4rem; font-size: .8rem; color: rgba(var(--cl-t-primary), .6); }
.ck__sums .ck__row--strong { color: rgb(var(--cl-t-primary)); font-weight: 700; font-size: .9rem; }
.ck__help { margin-top: 1.25rem; font-size: .8rem; color: rgba(var(--cl-t-primary), .6); }
.ck__help a { color: rgb(var(--cl-accent)); font-weight: 600; }
.ck__steps { display: flex; align-items: center; gap: .6rem; margin-bottom: 1.25rem; font-size: .75rem; color: rgba(var(--cl-t-primary), .5); }
.ck__steps li { display: flex; align-items: center; gap: .4rem; white-space: nowrap; }
.ck__steps li::after { content: ''; width: clamp(.75rem, 5vw, 4rem); height: 1px; background: rgba(255,255,255,.1); margin-left: .3rem; }
.ck__steps li:last-child::after { display: none; }
.ck__steps b { display: grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 999px; background: rgba(255,255,255,.06); font-size: .65rem; }
.ck__steps .is-done { color: rgba(var(--cl-t-primary), .8); }
.ck__steps .is-done b, .ck__steps .is-now b { background: rgb(var(--cl-accent)); color: rgb(var(--cl-t-accent)); }
.ck__steps .is-now { color: rgb(var(--cl-t-primary)); font-weight: 600; }
.ck__panel { margin-bottom: 1rem; }
.ck__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
.ck__head strong { display: block; }
.ck__head small { font-size: .75rem; color: rgba(var(--cl-t-primary), .55); }
.ck__live { display: inline-flex; align-items: center; gap: .4rem; font-size: .75rem; color: rgba(var(--cl-t-primary), .6); }
.ck__live::before { content: ''; width: .45rem; height: .45rem; border-radius: 999px; background: #22c55e; animation: ck-pulse 1.6s infinite; }
@keyframes ck-pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .ck__live::before { animation: none; } }
.ck__qr { display: block; width: 9.5rem; height: 9.5rem; margin: 0 auto 1rem; padding: .5rem; background: #fff; border-radius: .75rem; }
.ck__copy { display: flex; align-items: center; gap: .6rem; padding: .6rem .8rem; border: 1px solid rgba(255,255,255,.07); border-radius: .6rem; background: rgba(255,255,255,.02); font-size: .8rem; }
.ck__copy > span:first-child { flex-shrink: 0; color: rgba(var(--cl-t-primary), .5); }
.ck__copy code { flex: 1; min-width: 0; overflow-wrap: anywhere; font-family: ui-monospace, monospace; }
.ck__copy button { flex-shrink: 0; color: rgba(var(--cl-t-primary), .6); }
.ck__copy button:hover { color: rgb(var(--cl-accent)); }
.ck__stack { display: grid; gap: .6rem; }
.ck__how { margin-top: 1rem; padding-left: 1.1rem; list-style: decimal; display: grid; gap: .4rem; font-size: .8rem; color: rgba(var(--cl-t-primary), .6); }
.ck__link { display: block; margin: .9rem auto 0; font-size: .8rem; color: rgba(var(--cl-t-primary), .55); }
.ck__link:hover { color: rgb(var(--cl-t-primary)); }
.ck__status { display: flex; align-items: flex-start; gap: .85rem; }
.ck__status > i { font-size: 1.6rem; color: rgb(var(--cl-accent)); margin-top: .1rem; }
.ck__status > i.is-good { color: #22c55e; }
.ck__status > i.is-warn { color: #f59e0b; }
.ck__status h1 { font-size: 1.15rem; font-weight: 700; }
.ck__status p { font-size: .85rem; color: rgba(var(--cl-t-primary), .65); margin-top: .15rem; }
.ck__error { margin-bottom: 1rem; padding: .75rem 1rem; border-radius: .6rem; background: rgba(239,68,68,.12); border: 1px solid rgba(239,68,68,.35); font-size: .85rem; }
.ck__item { margin-top: .75rem; }
.ck__item-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .6rem; font-size: .875rem; font-weight: 600; }
.ck__actions { display: flex; gap: .4rem; }
.ck__actions button { padding: .3rem .6rem; border: 1px solid rgba(255,255,255,.08); border-radius: .45rem; font-size: .75rem; }
.ck__actions button:hover { border-color: rgb(var(--cl-accent)); }
.ck__info { display: grid; font-size: .8rem; }
.ck__info > div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-top: 1px solid rgba(255,255,255,.05); }
.ck__info > div:first-child { border-top: 0; }
.ck__info dt { color: rgba(var(--cl-t-primary), .5); flex-shrink: 0; }
.ck__info dd { text-align: right; overflow-wrap: anywhere; }

/* Spacing: the theme's #products>div rule added 80px around every block inside the section. */
#products>div{padding-top:0!important;padding-bottom:0!important}
#products>.section-heading{margin-bottom:28px}
.premium-section{margin-top:64px;margin-bottom:64px}
.components>.premium-hero{margin-top:24px;margin-bottom:32px}
@media (max-width:640px){
  .premium-section{margin-top:44px;margin-bottom:44px}
  .components>.premium-hero{margin-top:12px;margin-bottom:20px}
}

/* Descriptions: the tick list and videos from the product editor. */
ul.ordexa-ticks{list-style:none;padding-left:0}
ul.ordexa-ticks>li{position:relative;padding-left:1.6em}
ul.ordexa-ticks>li:before{content:"\2713";position:absolute;left:0;font-weight:700;color:#7c5cff}
div[data-youtube-video] iframe{display:block;width:100%;max-width:640px;height:auto;aspect-ratio:16/9;border:0;border-radius:10px}

/* Feedback on the delivered order page. */
.ck-feedback{display:flex;flex-direction:column;gap:.75rem}
.ck-feedback__rating{display:flex;align-items:center;gap:.6rem}
.ck-feedback__rating span,.ck-feedback__picker>div{display:flex;align-items:center;gap:.2rem}
.ck-feedback i.fa-star{color:rgba(255,255,255,.18);font-size:1.05rem;transition:color .12s}
.ck-feedback i.fa-star.is-on{color:#fbbf24}
.ck-feedback b{margin-left:.45rem;font-size:.85rem;font-weight:600}
.ck-feedback__picker{border:0;margin:0;padding:0}
.ck-feedback__picker legend,.ck-feedback__message>span{display:block;margin-bottom:.35rem;font-size:.75rem;opacity:.7}
.ck-feedback__picker label{position:relative;display:block;padding:.15rem;cursor:pointer}
.ck-feedback__picker input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.ck-feedback__picker label:focus-within i{outline:2px solid rgb(var(--cl-accent));outline-offset:2px;border-radius:3px}
.ck-feedback__message{display:block}
.ck-feedback__text{margin:0;white-space:pre-line;overflow-wrap:anywhere;font-size:.9rem}
.ck-feedback__reply{border-left:2px solid rgba(255,255,255,.15);padding-left:.75rem;font-size:.85rem}
.ck-feedback__reply small{opacity:.6}
.ck-feedback__reply p{margin:.2rem 0 0;overflow-wrap:anywhere}
.ck-feedback__actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
.ck-feedback__actions small{opacity:.6}

/* Copy buttons in the order information table. */
.ck__info-copy{margin-left:.35rem;padding:0 .15rem;background:none;border:0;cursor:pointer;color:inherit;opacity:.55}
.ck__info-copy:hover{opacity:1}
.ck__info dd{overflow-wrap:anywhere;text-align:right}

/* Coin and network buttons at checkout. */
.store-crypto-picker{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.store-pay-heading{margin:0 0 .45rem;font-size:.8rem;font-weight:600;color:rgba(var(--cl-t-primary),.7)}
.store-pay-grid--coins{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.store-coin-icon{flex:none;width:1.75rem;height:1.75rem;border-radius:50%}
.store-coin-icon--text{display:grid;place-items:center;background:rgba(255,255,255,.1);font-size:.8rem;font-weight:700}
