/* Rewards follow the mini-program's sidebar, paired cards and detail hierarchy. */
.myopal-rewards,.myopal-reward-detail { background:#f8f4ec; max-width:64rem; margin-inline:auto; width:100%; }
.myopal-reward-layout { display:grid; grid-template-columns:minmax(4.5rem,22%) minmax(0,1fr); min-height:65vh; }
.myopal-reward-categories { background:#efe5d6; align-self:stretch; }
.myopal-reward-categories a { position:relative; display:flex; align-items:center; justify-content:center; text-align:center; min-height:3rem; padding:.75rem .5rem; color:#7d6d57; font-size:.75rem; line-height:1.35; text-decoration:none; overflow-wrap:anywhere; }
.myopal-reward-categories [aria-current] { background:#f8f4ec; color:#111; font-weight:600; }
.myopal-reward-categories [aria-current]::before { content:''; position:absolute; left:0; top:50%; translate:0 -50%; width:3px; height:1.25rem; border-radius:1rem; background:#c99a3a; }
.myopal-reward-results { min-width:0; padding:.75rem .6875rem 2.5rem; }
.myopal-reward-subcategories { display:flex; gap:.375rem; overflow-x:auto; margin-bottom:.6875rem; }
.myopal-reward-subcategories a { flex-shrink:0; padding:.375rem .625rem; border-radius:999px; background:#eee5d8; color:#7d6d57; font-size:.6875rem; text-decoration:none; }
.myopal-reward-subcategories [aria-current] { background:#111; color:#f3d188; }
.myopal-reward-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6875rem; }
.myopal-reward-card { min-width:0; border-radius:.75rem; background:white; box-shadow:0 .25rem .75rem #0000000d; overflow:hidden; text-decoration:none; }
.myopal-reward-card > img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; background:#eee6d8; }
.myopal-reward-card > div { padding:.5625rem; }
.myopal-reward-card h2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.3rem; font:600 .78125rem/1.45 var(--myopal-font-body); color:#111; overflow-wrap:anywhere; }
.myopal-reward-card strong { display:block; margin-top:.5rem; font-size:.875rem; color:#9b6a16; overflow-wrap:anywhere; }
.myopal-reward-empty { padding:3.75rem .625rem; text-align:center; font-size:.78125rem; color:var(--myopal-color-muted); }
.myopal-reward-load-status,[data-reward-pager] { text-align:center; font-size:.75rem; margin-top:1rem; color:#7d6d57; }
.myopal-reward-detail { max-width:48rem; padding:1rem var(--myopal-container-gutter) 2rem; }
.myopal-reward-hero { aspect-ratio:1; overflow:hidden; border-radius:.9375rem; box-shadow:0 .375rem 1.0625rem #00000014; background:#eee6d8; }
.myopal-reward-hero img { display:block; width:100%; height:100%; object-fit:cover; }
.myopal-reward-paper { margin-top:.875rem; padding:1rem; border-radius:.875rem; background:#fff; box-shadow:0 .25rem .875rem #0000000d; }
.myopal-reward-category { display:inline-block; padding:.2rem .5rem; border-radius:999px; color:#9b6a16; background:#f6efe2; font-size:.6875rem; margin-bottom:.5625rem; }
.myopal-reward-paper h1 { font:600 1.3125rem/1.25 var(--myopal-font-body); margin-bottom:.6875rem; overflow-wrap:anywhere; }
.myopal-reward-points { font-size:1.3125rem; color:#9b6a16; font-weight:600; }
.myopal-reward-stock { font-size:.72rem; color:#8a7a5e; margin-top:.375rem; }
.myopal-reward-content { padding:0; overflow:hidden; }
.myopal-reward-content [role=tabpanel] { padding:0 1rem 1rem; font-size:.8125rem; line-height:1.75; color:#6f6251; overflow-wrap:anywhere; }
.myopal-reward-content [role=tabpanel] img { width:100%; height:auto; display:block; }
.myopal-reward-content.is-enhanced .myopal-reward-nojs-heading { display:none; }
.myopal-reward-content.is-enhanced [role=tabpanel]:not([hidden]) { animation:myopal-reward-panel .22s ease both; }
.myopal-reward-action {display:flex;align-items:center;justify-content:space-between;gap:var(--myopal-space-4);}
.myopal-reward-action > div { min-width:0; }
.myopal-reward-action span { display:block; font-size:.6875rem; color:#6f6251; }
.myopal-reward-action strong { display:block; font-size:1.1875rem; color:#9b6a16; overflow-wrap:anywhere; }
.myopal-reward-action a,.myopal-reward-action button { display:grid; place-items:center; text-align:center; padding:.5rem 1rem; flex-shrink:0; max-width:60%; min-height:2.75rem; border:0; border-radius:999px; background:#111; color:#f3d188; font-size:.875rem; font-weight:600; text-decoration:none; }
.myopal-reward-action button:disabled { background:#ddd6c8; color:#77664b; }
@keyframes myopal-reward-panel { from { opacity:0; transform:translateX(.375rem); } to { opacity:1; transform:translateX(0); } }
@media(min-width:48rem) { .myopal-reward-layout { grid-template-columns:10rem minmax(0,1fr); } .myopal-reward-results { padding:1.25rem; } .myopal-reward-grid { gap:1rem; } }
@media(prefers-reduced-motion:reduce) { .myopal-reward-content.is-enhanced [role=tabpanel]:not([hidden]) { animation:none; } }

.myopal-reward-tablist { margin:.75rem 1rem .875rem; }