/* ===== SyriaIO — المحفظة ===== */
html, body { overflow-x: hidden; }
.wallet { min-height: 100dvh; }
.wallet__main { max-width: 640px; margin: 0 auto; padding: 20px 16px 60px; }

.dash__bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--ink-2); position: sticky; top: 0; z-index: 5; }
.dash__tag { font-size: 12px; color: var(--gold); border: 1px solid rgba(232,176,75,.3); border-radius: 999px; padding: 3px 10px; margin-inline-start: 4px; }
.dash__actions { display: flex; align-items: center; gap: 14px; }

/* اختيار العملة */
.cur-choices { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.cur-choice {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 16px 18px; cursor: pointer; font-family: var(--font); text-align: start; transition: all .15s;
}
.cur-choice:hover { border-color: var(--gold); background: var(--surface-2); }
.cur-choice__sym { color: var(--gold); font-size: 22px; font-weight: 700; }
.cur-choice__name { color: var(--text); font-size: 16px; font-weight: 600; }
.cur-choice__desc { color: var(--muted); font-size: 13px; }

/* بطاقة الرصيد */
.bal-card {
  background: linear-gradient(140deg, rgba(232,176,75,.14), rgba(28,36,52,.6));
  border: 1px solid rgba(232,176,75,.28); border-radius: var(--radius);
  padding: 24px; display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; position: relative;
}
.bal-card__label { color: var(--muted); font-size: 14px; }
.bal-card__value { font-size: 34px; font-weight: 700; color: var(--gold); }
.bal-card__badge { position: absolute; top: 18px; inset-inline-start: 18px; font-size: 12px; font-weight: 700; color: #241a05; background: linear-gradient(135deg, var(--gold), var(--gold-deep)); padding: 4px 12px; border-radius: 999px; }

/* لوحات */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; margin-bottom: 18px; }
.panel__title { font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.panel__hint { font-size: 13.5px; color: var(--muted); margin-bottom: 14px; }

.fld { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.fld label { font-size: 13px; color: var(--muted); }
.fld input { font-family: var(--font); font-size: 16px; color: var(--text); background: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px 14px; width: 100%; }
.fld input:focus { outline: none; border-color: var(--gold); }

.deposit-preview { font-size: 15px; color: var(--gold); font-weight: 600; margin: 4px 0 14px; }

/* طرق الدفع */
.pay-methods { display: flex; flex-direction: column; gap: 10px; }
.pay-method { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; background: var(--ink-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 14px 16px; cursor: pointer; font-family: var(--font); text-align: start; transition: all .15s; }
.pay-method:hover { border-color: var(--gold); }
.pay-method__name { color: var(--text); font-size: 15px; font-weight: 600; }
.pay-method__desc { color: var(--muted); font-size: 13px; }

/* الاشتراك */
.premium-card { border-color: rgba(232,176,75,.28); }
.premium-card__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.premium-card__price { color: var(--gold); font-weight: 700; font-size: 15px; }
.premium-card__feats { list-style: none; padding: 0; margin: 0 0 16px; display: flex; flex-direction: column; gap: 8px; }
.premium-card__feats li { font-size: 14px; color: var(--text); padding-inline-start: 22px; position: relative; }
.premium-card__feats li::before { content: "✓"; position: absolute; inset-inline-start: 0; color: var(--gold); font-weight: 700; }

/* ===== أكوردين طرق الدفع ===== */
.pay-method { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--ink-2); overflow: hidden; }
.pay-method__head {
  width: 100%; text-align: start; background: none; border: none; cursor: pointer;
  font-family: var(--font); padding: 14px 16px; display: grid;
  grid-template-columns: 1fr auto; grid-template-areas: "name chev" "desc chev"; gap: 2px 8px; align-items: center;
}
.pay-method__name { grid-area: name; color: var(--text); font-size: 15px; font-weight: 600; }
.pay-method__desc { grid-area: desc; color: var(--muted); font-size: 13px; }
.pay-method__chev { grid-area: chev; color: var(--muted); transition: transform .2s; }
.pay-method.open .pay-method__chev { transform: rotate(180deg); color: var(--gold); }
.pay-method.open { border-color: var(--gold); }
.pay-method__body { display: none; padding: 4px 16px 16px; border-top: 1px solid var(--line); }
.pay-method.open .pay-method__body { display: block; }

.prev { font-size: 14px; color: var(--gold); font-weight: 600; margin: 0 0 14px; }
.sham-inst { font-size: 14px; color: var(--text); background: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin: 4px 0 14px; white-space: pre-wrap; line-height: 1.7; }
.pay-method .receipt { font-family: var(--font); font-size: 13px; color: var(--muted); background: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; width: 100%; }
.sham-status { font-size: 14px; color: var(--teal); margin-top: 12px; background: rgba(79,209,197,.08); border: 1px solid rgba(79,209,197,.25); border-radius: 10px; padding: 10px 12px; }
