/* SmartMuslim R8 — final visual polish candidate
 * Scope: Commerce/Marketplace, Payments, Finance, Loyalty, Charity, Impact.
 * No business logic, provider or ledger changes.
 */

:root{
  --r8-ink:#123f34;
  --r8-ink-soft:#5f7069;
  --r8-green:#0f5c46;
  --r8-green-2:#164f3f;
  --r8-mint:#e8f3ed;
  --r8-cream:#fbf8f1;
  --r8-surface:#fffdfa;
  --r8-line:#e5d9c8;
  --r8-gold:#c89c4a;
  --r8-danger:#a94b43;
  --r8-radius:22px;
  --r8-control:14px;
  --r8-shadow:0 10px 30px rgba(24,56,46,.065);
}

/* ---------- shared page rhythm ---------- */
.sm-commerce,
.finance-page{
  color:var(--r8-ink)!important;
  max-width:940px!important;
  margin-inline:auto!important;
}
.sm-commerce{
  padding:18px 14px 150px!important;
}
.finance-page{
  padding:22px 16px 150px!important;
}
#commerce-marketplace-root,
#finance-root{
  scroll-padding-bottom:160px;
}
.cm-head,
.finance-page>header{
  padding:2px 2px 18px!important;
  margin-bottom:8px!important;
}
.cm-head h1,
.finance-page h1{
  color:var(--r8-ink)!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-weight:700!important;
  letter-spacing:-.025em!important;
  line-height:1.08!important;
}
.cm-head h1{font-size:clamp(2rem,5vw,3rem)!important;}
.finance-page h1{font-size:clamp(2rem,5vw,2.75rem)!important;}
.cm-head .cm-muted,
.finance-page>header p{
  max-width:680px;
  color:var(--r8-ink-soft)!important;
  font-size:1rem!important;
  line-height:1.55!important;
}
.cm-eyebrow,
.finance-page>header span{
  display:inline-flex!important;
  width:max-content;
  align-items:center;
  gap:6px;
  color:var(--r8-green)!important;
  background:var(--r8-mint);
  border-radius:999px;
  padding:6px 10px;
  font-size:.7rem!important;
  line-height:1;
  letter-spacing:.11em!important;
  font-weight:800!important;
  text-transform:uppercase;
}

/* ---------- cards ---------- */
.cm-card,
.finance-card,
.finance-balance>div{
  background:var(--r8-surface)!important;
  border:1px solid var(--r8-line)!important;
  border-radius:var(--r8-radius)!important;
  box-shadow:var(--r8-shadow)!important;
}
.cm-card{
  padding:18px!important;
  margin-bottom:14px!important;
}
.finance-card{
  padding:20px!important;
  margin:14px 0!important;
}
.cm-card h2,
.cm-card h3,
.finance-card h2,
.finance-card h3{
  color:var(--r8-ink)!important;
  letter-spacing:-.018em;
  line-height:1.2;
}
.cm-card h2,.finance-card h2{
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:1.38rem!important;
}
.cm-card h3,.finance-card h3{font-size:1.03rem!important;}
.cm-card p,
.finance-card p,
.finance-card small{
  color:var(--r8-ink-soft);
}
.cm-muted{color:var(--r8-ink-soft)!important;}
.cm-grid{
  gap:14px!important;
}
.cm-media{
  height:auto!important;
  aspect-ratio:16/9;
  object-fit:cover!important;
  border-radius:18px!important;
  margin-bottom:14px!important;
  background:#eef2ee;
}

/* ---------- badges ---------- */
.cm-badges{
  gap:7px!important;
  margin:8px 0 12px;
}
.cm-badge{
  padding:6px 10px!important;
  font-size:.72rem!important;
  line-height:1.15;
  font-weight:650;
  background:var(--r8-mint)!important;
  border:1px solid rgba(15,92,70,.09);
  color:var(--r8-green)!important;
}

/* ---------- buttons ---------- */
.sm-commerce button,
.finance-card button{
  min-height:44px;
  border-radius:var(--r8-control)!important;
  padding:11px 15px!important;
  font-weight:720!important;
  line-height:1.25;
  transition:transform .12s ease,opacity .12s ease,background .12s ease;
}
.sm-commerce button:active,
.finance-card button:active{transform:scale(.985);}
.sm-commerce .cm-primary,
.finance-card button[type=submit],
.finance-card .cm-primary{
  background:var(--r8-green)!important;
  border-color:var(--r8-green)!important;
  color:#fff!important;
}
.sm-commerce button:not(.cm-primary),
.finance-card button:not([type=submit]):not(.cm-primary){
  background:#fffdfa!important;
  border:1px solid #d9cbb8!important;
  color:var(--r8-ink)!important;
}
.sm-commerce button:disabled,
.finance-card button:disabled{
  opacity:.42!important;
  cursor:not-allowed!important;
}
.cm-actions{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:9px!important;
  margin:16px 0 10px!important;
}

/* ---------- forms ---------- */
.sm-commerce label,
.finance-card label{
  color:var(--r8-ink)!important;
  font-size:.83rem!important;
  font-weight:680!important;
  line-height:1.35;
}
.sm-commerce input,
.sm-commerce select,
.sm-commerce textarea,
.finance-card input,
.finance-card select,
.finance-card textarea{
  width:100%;
  box-sizing:border-box;
  margin-top:6px;
  min-height:44px;
  border:1px solid #d8cbb8!important;
  border-radius:13px!important;
  background:#fffdfa!important;
  color:var(--r8-ink)!important;
  padding:10px 12px!important;
  font:inherit!important;
  outline:none;
}
.sm-commerce textarea,
.finance-card textarea{
  min-height:96px;
  resize:vertical;
}
.sm-commerce input:focus,
.sm-commerce select:focus,
.sm-commerce textarea:focus,
.finance-card input:focus,
.finance-card select:focus,
.finance-card textarea:focus{
  border-color:var(--r8-green)!important;
  box-shadow:0 0 0 3px rgba(15,92,70,.10);
}
input[type=file]{
  padding:7px!important;
}
input[type=file]::file-selector-button{
  min-height:36px;
  margin-right:10px;
  border:0;
  border-radius:10px;
  padding:8px 11px;
  background:var(--r8-mint);
  color:var(--r8-green);
  font-weight:750;
  cursor:pointer;
}

/* ---------- merchant page ---------- */
.cm-price{
  color:var(--r8-green)!important;
  font-size:1.75rem!important;
  font-weight:800!important;
  letter-spacing:-.02em;
}
.cm-card del{
  color:#7a817d;
  text-decoration-thickness:1.5px;
}
.cm-back{
  border:0!important;
  background:transparent!important;
  padding-inline:2px!important;
  color:var(--r8-green)!important;
}
#cm-r7-merchant-metrics .cm-muted{
  padding-top:10px;
  border-top:1px solid var(--r8-line);
}
#cm-r7-catalogs>h2,
#cm-r7-offer-editor>h2{
  margin:28px 0 12px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.65rem;
  color:var(--r8-ink);
}
#cm-r7-offer-editor .cm-grid{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;
}
#cm-r7-offer-editor form,
#cm-catalog-form{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px 14px;
}
#cm-r7-offer-editor form label:has(textarea),
#cm-r7-offer-editor form label:has(input[name=targets]),
#cm-r7-offer-editor form label:has(input[name=claim]),
#cm-r7-offer-editor form button,
#cm-catalog-form label:nth-last-of-type(1),
#cm-catalog-form button{
  grid-column:1/-1;
}
#cm-r7-offer-editor form label:has(input[type=checkbox]){
  display:grid!important;
  grid-template-columns:auto 1fr;
  align-items:start;
  gap:9px;
  padding:10px 0;
}
#cm-r7-offer-editor input[type=checkbox]{
  width:18px!important;
  min-height:18px!important;
  margin:2px 0 0!important;
}

/* ---------- mixed tender ---------- */
[data-r7b-panel]{
  margin-top:14px;
  padding:14px;
  border-radius:16px;
  background:#f4f8f5;
  border:1px solid #d9e6df;
}
[data-r7b-panel] form{
  padding-bottom:0!important;
}
[data-r7b-residual]{
  margin:10px 0!important;
  padding:12px 14px;
  border-radius:13px;
  background:#fffdfa;
  border:1px solid var(--r8-line);
  color:var(--r8-ink)!important;
  font-weight:760;
}

/* ---------- payment summary ---------- */
#cm-payment{
  max-width:720px;
  margin:0 auto 18px!important;
}
#cm-payment .cm-payment-summary{
  display:grid;
  gap:9px;
  margin:14px 0;
  padding:14px;
  border:1px solid var(--r8-line);
  border-radius:16px;
  background:#f8f6f0;
}
#cm-payment .cm-payment-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:3px 0;
}
#cm-payment .cm-payment-row span{
  color:var(--r8-ink-soft);
}
#cm-payment .cm-payment-row strong{
  color:var(--r8-ink);
  text-align:right;
}
#cm-payment .cm-payment-row--total{
  padding-top:10px;
  border-top:1px solid var(--r8-line);
}
#cm-payment .cm-payment-row--total strong{
  font-size:1.25rem;
  color:var(--r8-green);
}
#cm-payment .cm-payment-state{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:32px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--r8-mint);
  color:var(--r8-green)!important;
  font-weight:800;
}
#cm-payment .cm-payment-meta{
  font-size:.82rem;
  color:var(--r8-ink-soft)!important;
}
#cm-refund-form{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--r8-line);
}
#cm-refund-form label,
#cm-r7-offer-editor form label{
  display:block;
  min-width:0;
  max-width:100%;
}
#cm-refund-form input[name=amount],
#cm-r7-offer-editor input[name=original],
#cm-r7-offer-editor input[name=discount],
#cm-r7-offer-editor input[name=cap],
#cm-r7-offer-editor input[name=capacity]{
  display:block;
  width:100%!important;
  min-width:0;
  box-sizing:border-box;
  font-size:16px!important;
  min-height:48px;
}
#cm-refund-form button{margin-top:12px;}
#cm-stripe-element{
  overflow:hidden;
  border-radius:18px;
}

/* ---------- Finance Hub ---------- */
.finance-balance{
  gap:12px!important;
}
.finance-balance>div{
  padding:16px!important;
}
.finance-balance small{
  color:var(--r8-ink-soft)!important;
  font-size:.78rem;
}
.finance-balance strong{
  color:var(--r8-ink)!important;
  font-size:1.28rem!important;
}
[data-financial-hub] .finance-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:14px 0;
}
[data-financial-hub] .finance-list>div{
  display:block!important;
  padding:13px!important;
  border:1px solid var(--r8-line)!important;
  border-radius:14px;
  background:#f8f6f0;
}
[data-financial-hub] .finance-list>div span{
  display:block;
  color:var(--r8-ink-soft);
  font-size:.78rem;
  margin-bottom:5px;
}
[data-financial-hub] .finance-list>div strong{
  display:block;
  color:var(--r8-ink);
  font-size:1.06rem;
}
.finance-list>div{
  border-top:1px solid #eee3d4!important;
  padding:12px 0!important;
}
#cm-finance-history .cm-card{
  box-shadow:none!important;
  background:#f9f7f2!important;
}

/* ---------- loyalty / charity / impact ---------- */
[data-loyalty],
[data-smartpoints],
[data-r6-charity],
[data-r6-impact],
[data-r6-sponsored]{
  position:relative;
}
[data-smartpoints]>h3,
[data-r6-impact]>h3,
[data-r6-charity]>h3{
  margin-top:20px;
}
[data-r6-impact] .finance-list,
[data-r6-sponsored] .finance-list{
  padding:14px;
  margin:10px 0;
  border:1px solid var(--r8-line);
  border-radius:14px;
  background:#faf8f3;
}
[data-r6-impact] figure.finance-list{
  display:grid;
  gap:8px;
}
[data-r6-impact] figure img{
  border-radius:14px;
  background:#eef2ee;
}
[data-r6-impact] form{
  margin-top:16px;
  padding:16px;
  border:1px solid var(--r8-line);
  border-radius:16px;
  background:#faf8f3;
}

/* ---------- responsive ---------- */
@media(max-width:620px){
  .sm-commerce{padding:14px 12px 172px!important;}
  .finance-page{padding:16px 12px 172px!important;}
  .cm-card,.finance-card{padding:16px!important;border-radius:20px!important;}
  .cm-head h1,.finance-page h1{font-size:2rem!important;}
  .cm-actions{grid-template-columns:1fr!important;}
  #cm-r7-offer-editor form,
  #cm-catalog-form{grid-template-columns:1fr!important;}
  #cm-r7-offer-editor form>*,
  #cm-catalog-form>*{grid-column:1!important;}
  [data-financial-hub] .finance-list{grid-template-columns:1fr 1fr!important;}
  #cm-payment .cm-payment-row{gap:10px;}
  #cm-payment .cm-payment-row strong{max-width:52%;}
  .cm-media{aspect-ratio:3/2;}
}

@media(max-width:390px){
  [data-financial-hub] .finance-list{grid-template-columns:1fr!important;}
}

/* ---------- dark ---------- */
html.sm-dark-v2 .cm-card,
html.sm-dark-v2 .finance-card,
html.sm-dark-v2 .finance-balance>div{
  background:#102c24!important;
  border-color:#315448!important;
  box-shadow:none!important;
}
html.sm-dark-v2 .sm-commerce,
html.sm-dark-v2 .finance-page,
html.sm-dark-v2 .cm-card h2,
html.sm-dark-v2 .cm-card h3,
html.sm-dark-v2 .finance-card h2,
html.sm-dark-v2 .finance-card h3,
html.sm-dark-v2 .finance-balance strong{
  color:#f5efe3!important;
}
html.sm-dark-v2 .cm-muted,
html.sm-dark-v2 .cm-card p,
html.sm-dark-v2 .finance-card p,
html.sm-dark-v2 .finance-card small,
html.sm-dark-v2 .finance-balance small{
  color:#b9c5bf!important;
}
html.sm-dark-v2 .cm-badge,
html.sm-dark-v2 .cm-eyebrow{
  background:#173b31!important;
  color:#9fd4bd!important;
  border-color:#315448!important;
}
html.sm-dark-v2 .sm-commerce input,
html.sm-dark-v2 .sm-commerce select,
html.sm-dark-v2 .sm-commerce textarea,
html.sm-dark-v2 .finance-card input,
html.sm-dark-v2 .finance-card select,
html.sm-dark-v2 .finance-card textarea,
html.sm-dark-v2 .sm-commerce button:not(.cm-primary),
html.sm-dark-v2 .finance-card button:not([type=submit]):not(.cm-primary){
  background:#0d241e!important;
  border-color:#36584d!important;
  color:#f5efe3!important;
}
html.sm-dark-v2 [data-r7b-panel],
html.sm-dark-v2 [data-financial-hub] .finance-list>div,
html.sm-dark-v2 #cm-payment .cm-payment-summary,
html.sm-dark-v2 #cm-finance-history .cm-card,
html.sm-dark-v2 [data-r6-impact] .finance-list,
html.sm-dark-v2 [data-r6-sponsored] .finance-list,
html.sm-dark-v2 [data-r6-impact] form{
  background:#0d241e!important;
  border-color:#315448!important;
}
html.sm-dark-v2 #cm-payment .cm-payment-row span,
html.sm-dark-v2 [data-financial-hub] .finance-list>div span{
  color:#aebdb6!important;
}
html.sm-dark-v2 #cm-payment .cm-payment-row strong,
html.sm-dark-v2 [data-financial-hub] .finance-list>div strong{
  color:#f5efe3!important;
}
html.sm-dark-v2 #cm-payment .cm-payment-state{
  background:#173b31!important;
  color:#9fd4bd!important;
}

/* ---------- SmartPoints compact history ---------- */
[data-smartpoints]{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--r8-line);
}
[data-smartpoints]>.finance-points-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin:12px 0;
}
[data-smartpoints]>.finance-points-summary>.finance-list{
  display:block!important;
  padding:12px!important;
  border:1px solid var(--r8-line)!important;
  border-radius:13px;
  background:#f8f6f0;
}
[data-smartpoints]>.finance-points-summary>.finance-list span{
  display:block;
  color:var(--r8-ink-soft);
  font-size:.76rem;
  margin-bottom:4px;
}
[data-smartpoints]>.finance-points-summary>.finance-list strong{
  display:block;
  color:var(--r8-ink);
}
.finance-history-disclosure{
  margin:10px 0;
  border:1px solid var(--r8-line);
  border-radius:14px;
  background:#faf8f3;
  overflow:hidden;
}
.finance-history-disclosure>summary{
  cursor:pointer;
  list-style:none;
  padding:12px 14px;
  color:var(--r8-green);
  font-weight:760;
}
.finance-history-disclosure>summary::-webkit-details-marker{display:none;}
.finance-history-disclosure>summary::after{
  content:'＋';
  float:right;
  font-weight:500;
}
.finance-history-disclosure[open]>summary::after{content:'−';}
.finance-history-body{
  max-height:420px;
  overflow:auto;
  padding:0 14px 10px;
  border-top:1px solid var(--r8-line);
}
.finance-history-body p{
  margin:0;
  padding:10px 0;
  border-bottom:1px solid #eee3d4;
  font-size:.86rem;
  line-height:1.45;
}
.finance-history-body p:last-child{border-bottom:0;}
html.sm-dark-v2 [data-smartpoints]{
  border-top-color:#315448;
}
html.sm-dark-v2 [data-smartpoints]>.finance-points-summary>.finance-list,
html.sm-dark-v2 .finance-history-disclosure{
  background:#0d241e;
  border-color:#315448!important;
}
html.sm-dark-v2 .finance-history-body{
  border-top-color:#315448;
}
html.sm-dark-v2 .finance-history-body p{
  border-bottom-color:#27493f;
}
@media(max-width:390px){
  [data-smartpoints]>.finance-points-summary{grid-template-columns:1fr 1fr;}
}

/* ---------- merchant tools / loyalty ---------- */
[data-loyalty-entry]{
  margin-top:16px;
}
[data-loyalty-entry]>button{
  width:100%;
  margin-bottom:10px;
}
[data-loyalty-entry] h3,
[data-loyalty-entry] h4{
  color:var(--r8-ink);
  letter-spacing:-.015em;
}
[data-loyalty-entry] h4{
  margin:22px 0 10px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.16rem;
}
[data-loyalty-entry] article.finance-card{
  margin:10px 0!important;
  box-shadow:none!important;
  background:#faf8f3!important;
}
[data-loyalty-entry] form.finance-card{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
  margin:12px 0!important;
  background:#faf8f3!important;
  box-shadow:none!important;
}
[data-loyalty-entry] form.finance-card>button,
[data-loyalty-entry] form.finance-card>p{
  grid-column:1/-1;
}
[data-loyalty-entry] details{
  margin-top:10px;
  border-top:1px solid var(--r8-line);
  padding-top:8px;
}
[data-loyalty-entry] details>summary{
  cursor:pointer;
  color:var(--r8-green);
  font-weight:730;
  padding:6px 0;
}
[data-loyalty-entry] code{
  display:block;
  margin:12px 0;
  padding:12px;
  border-radius:12px;
  background:#f1eee6;
  color:var(--r8-ink);
  font-size:1rem;
  font-weight:800;
  letter-spacing:.06em;
}
#cm-r7-catalogs .cm-card>img{
  max-width:190px!important;
  border-radius:14px;
  border:1px solid var(--r8-line);
  background:#f3f1ea;
}
#cm-r7-catalogs label:has(input[type=file]){
  display:block;
  padding:10px 0;
}
#cm-r7-offer-editor small,
#cm-r7-catalogs small{
  display:block;
  margin-top:5px;
  color:var(--r8-ink-soft);
  font-weight:500;
  line-height:1.4;
}
html.sm-dark-v2 [data-loyalty-entry] article.finance-card,
html.sm-dark-v2 [data-loyalty-entry] form.finance-card{
  background:#0d241e!important;
}
html.sm-dark-v2 [data-loyalty-entry] h3,
html.sm-dark-v2 [data-loyalty-entry] h4{
  color:#f5efe3!important;
}
html.sm-dark-v2 [data-loyalty-entry] code{
  background:#173b31;
  color:#f5efe3;
}
@media(max-width:620px){
  [data-loyalty-entry] form.finance-card{
    grid-template-columns:1fr!important;
  }
  [data-loyalty-entry] form.finance-card>*{
    grid-column:1!important;
  }
}