:root {
    --digages-refund-purple: #533582;
    --digages-refund-purple-soft: #f3effa;
    --digages-refund-border: #dfe2e7;
    --digages-refund-text: #17191d;
    --digages-refund-muted: #667085;
    --digages-refund-surface: #fff;
}

.digages-refunds-page { max-width: 1480px; margin: 24px 24px 50px 4px; color: var(--digages-refund-text); }
.digages-refunds-page * { box-sizing: border-box; }
.digages-refunds-titlebar { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 24px; }
.digages-refunds-titlebar h1 { margin: 0; padding: 0; font-size: 32px; line-height: 1.2; font-weight: 650; }
.digages-refunds-titlebar p { margin: 7px 0 0; color: var(--digages-refund-muted); font-size: 14px; }
.digages-refunds-titlebar .button-primary { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 17px; border-color: var(--digages-refund-purple); background: var(--digages-refund-purple); }

.digages-refund-cards { display: grid; grid-template-columns: repeat(4, minmax(180px, 1fr)); gap: 16px; margin: 0 0 22px; }
.digages-refund-card { min-height: 92px; display: flex; align-items: center; gap: 16px; padding: 18px; border: 1px solid var(--digages-refund-border); border-radius: 8px; background: var(--digages-refund-surface); box-shadow: 0 1px 2px rgba(16,24,40,.03); }
.digages-refund-card > span:last-child { display: flex; flex-direction: column; gap: 5px; color: #555d66; font-size: 13px; }
.digages-refund-card strong { color: var(--digages-refund-text); font-size: 25px; line-height: 1; font-weight: 650; }
.digages-refund-card__icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 38px; border: 2px solid var(--digages-refund-purple); border-radius: 50%; color: var(--digages-refund-purple); font-size: 20px; font-weight: 600; }

.digages-refund-filters { display: flex; align-items: end; gap: 12px; padding: 14px; border: 1px solid var(--digages-refund-border); border-bottom: 0; border-radius: 8px 8px 0 0; background: #fff; }
.digages-refund-search { position: relative; flex: 1 1 360px; max-width: 440px; }
.digages-refund-search span { position: absolute; left: 13px; top: 7px; color: #667085; font-size: 21px; }
.digages-refund-search input { width: 100%; min-height: 40px; padding-left: 39px; border-color: #cfd4dc; }
.digages-refund-filters label { display: flex; flex-direction: column; gap: 4px; color: var(--digages-refund-muted); font-size: 11px; }
.digages-refund-filters select { min-width: 180px; min-height: 40px; border-color: #cfd4dc; }
.digages-refund-filters > .button { min-height: 40px; padding: 0 18px; }

.digages-refund-table-wrap { overflow: auto; border: 1px solid var(--digages-refund-border); background: #fff; }
.digages-refund-table { width: 100%; min-width: 960px; border-collapse: collapse; }
.digages-refund-table th { height: 45px; padding: 0 18px; border-bottom: 1px solid var(--digages-refund-border); color: #414651; text-align: left; font-size: 12px; font-weight: 600; }
.digages-refund-table td { height: 60px; padding: 10px 18px; border-bottom: 1px solid #e8eaee; color: #323740; font-size: 13px; vertical-align: middle; }
.digages-refund-table tr:last-child td { border-bottom: 0; }
.digages-refund-table tbody tr[role="button"] { cursor: pointer; transition: background .15s ease; }
.digages-refund-table tbody tr[role="button"]:hover,
.digages-refund-table tbody tr[role="button"]:focus { outline: 0; background: #faf8fd; box-shadow: inset 3px 0 var(--digages-refund-purple); }
.digages-refund-table a { color: var(--digages-refund-purple); }
.digages-refund-row-action { width: 30px; height: 30px; border: 0; background: transparent; cursor: pointer; font-size: 20px; }
.digages-refund-empty { height: 170px !important; text-align: center; }
.digages-refund-empty strong, .digages-refund-empty span { display: block; margin: 5px; }
.digages-refund-empty span { color: var(--digages-refund-muted); }
.digages-refund-status { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 9px; border-radius: 6px; background: #eef0f3; color: #50555e; font-size: 12px; white-space: nowrap; }
.digages-refund-status.is-requested { background: #fff2dc; color: #9a5800; }
.digages-refund-status.is-under_review { background: #e9f1ff; color: #225db0; }
.digages-refund-status.is-approved { background: #e4f4e8; color: #26733a; }
.digages-refund-status.is-processing { background: #f0eafb; color: #533582; }
.digages-refund-status.is-sent { background: #e4f4e8; color: #26733a; }
.digages-refund-status.is-failed, .digages-refund-status.is-rejected { background: #ffe8e8; color: #b42318; }
.digages-refund-pagination { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 8px 14px; border: 1px solid var(--digages-refund-border); border-top: 0; border-radius: 0 0 8px 8px; background: #fff; color: var(--digages-refund-muted); }
.digages-refund-pagination .page-numbers { display: inline-grid; min-width: 34px; height: 34px; place-items: center; margin-left: 4px; border: 1px solid var(--digages-refund-border); border-radius: 5px; text-decoration: none; }
.digages-refund-pagination .current { border-color: var(--digages-refund-purple); color: var(--digages-refund-purple); background: #faf8fd; }

.digages-refund-overlay { position: fixed; z-index: 100050; inset: 0; background: rgba(15, 18, 24, .32); backdrop-filter: blur(1px); }
.digages-refund-drawer { position: fixed; z-index: 100060; top: 32px; right: 0; bottom: 0; width: min(560px, calc(100vw - 40px)); display: flex; flex-direction: column; transform: translateX(102%); background: #fff; box-shadow: -12px 0 35px rgba(16, 24, 40, .18); transition: transform .22s ease; }
.digages-refund-drawer.is-open { transform: translateX(0); }
.digages-refund-drawer.is-busy { pointer-events: none; opacity: .68; }
body.digages-refund-drawer-open { overflow: hidden; }
.digages-refund-drawer__head { display: flex; justify-content: space-between; gap: 18px; padding: 24px 26px 20px; border-bottom: 1px solid var(--digages-refund-border); }
.digages-refund-drawer__head h2 { margin: 0; font-size: 23px; }
.digages-refund-drawer__head p { margin: 0 0 7px; color: var(--digages-refund-muted); font-size: 12px; }
.digages-refund-drawer__head p:last-child { margin: 7px 0 0; }
.digages-refund-titleline { display: flex; align-items: center; gap: 10px; }
.digages-refund-close { border: 0; background: transparent; color: #4b515b; cursor: pointer; font-size: 28px; line-height: 1; }
.digages-refund-drawer__body { flex: 1 1 auto; overflow-y: auto; padding: 20px 26px 120px; }
form.digages-refund-drawer__body { display: block; }
.digages-refund-drawer__loading, .digages-refund-drawer__error { margin: auto; padding: 40px; text-align: center; }
.digages-refund-drawer__loading .spinner { float: none; margin: 0 auto 12px; }
.digages-refund-amount { padding: 17px 18px; border: 1px solid var(--digages-refund-border); border-radius: 7px; background: #fbfcfd; }
.digages-refund-amount span, .digages-refund-amount small { display: block; color: var(--digages-refund-muted); }
.digages-refund-amount strong { display: block; margin: 4px 0; font-size: 24px; }
.digages-refund-section { position: relative; margin-top: 19px; padding: 18px; border: 1px solid var(--digages-refund-border); border-radius: 7px; }
.digages-refund-section h3 { margin: 0 0 15px; font-size: 14px; }
.digages-refund-section label { display: block; margin: 12px 0; color: #3d434c; font-size: 12px; font-weight: 600; }
.digages-refund-section input[type="text"], .digages-refund-section input[type="number"], .digages-refund-section select, .digages-refund-section textarea { width: 100%; max-width: none; margin-top: 6px; border-color: #cfd4dc; }
.digages-refund-section textarea { resize: vertical; }
.digages-refund-kv { display: flex; justify-content: space-between; gap: 20px; padding: 7px 0; color: var(--digages-refund-muted); font-size: 13px; }
.digages-refund-kv strong { color: var(--digages-refund-text); text-align: right; }
.digages-refund-reveal { margin-top: 8px; color: var(--digages-refund-purple) !important; }
.digages-refund-destination-icon { position: absolute; right: 17px; top: 14px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--digages-refund-purple-soft); color: var(--digages-refund-purple); }
.digages-refund-timeline { margin: 0; padding: 0; list-style: none; }
.digages-refund-timeline li { position: relative; display: grid; grid-template-columns: 20px 1fr; gap: 11px; min-height: 66px; margin: 0; }
.digages-refund-timeline li > span { position: relative; z-index: 1; width: 20px; height: 20px; display: grid; place-items: center; margin-top: 1px; border: 1px solid #c8cdd5; border-radius: 50%; background: #fff; color: #89919d; font-size: 10px; font-weight: 700; line-height: 1; }
.digages-refund-timeline li:not(:last-child)::after { content: ""; position: absolute; left: 8px; top: 18px; bottom: -1px; width: 2px; background: #d7cdea; }
.digages-refund-timeline li.is-complete > span { border-color: var(--digages-refund-purple); background: var(--digages-refund-purple); color: #fff; }
.digages-refund-timeline li.is-current > span { border: 2px solid var(--digages-refund-purple); color: var(--digages-refund-purple); box-shadow: 0 0 0 3px var(--digages-refund-purple-soft); }
.digages-refund-timeline li.is-complete:not(:last-child)::after { background: var(--digages-refund-purple); }
.digages-refund-timeline li.is-remaining strong, .digages-refund-timeline li.is-remaining p, .digages-refund-timeline li.is-remaining small { color: #9299a3; }
.digages-refund-timeline strong { font-size: 13px; }
.digages-refund-timeline p { margin: 3px 0; color: #454b55; font-size: 12px; }
.digages-refund-timeline small { color: var(--digages-refund-muted); font-size: 11px; }
.digages-refund-field-label { margin-top: 12px; color: #3d434c; font-size: 12px; font-weight: 600; }
.digages-refund-note-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.digages-refund-note-list article { padding: 11px 12px; border: 1px solid #e3e5e9; border-radius: 6px; background: #f8f9fa; }
.digages-refund-note-list article > div { display: flex; justify-content: space-between; gap: 12px; }
.digages-refund-note-list article strong { color: #303640; font-size: 12px; }
.digages-refund-note-list article time { color: var(--digages-refund-muted); font-size: 10px; white-space: nowrap; }
.digages-refund-note-list article p { margin: 7px 0 0; color: #454b55; font-size: 12px; line-height: 18px; }
.digages-refund-note-empty { margin: 0; padding: 10px 12px; border-radius: 6px; background: #f8f9fa; color: var(--digages-refund-muted); font-size: 12px; }
.digages-refund-note-form { padding-top: 13px; border-top: 1px solid #eceef1; }
.digages-refund-note-form textarea { margin-top: 0; }
.digages-refund-drawer__foot { position: absolute; z-index: 2; right: 0; bottom: 0; left: 0; display: flex; justify-content: flex-end; gap: 10px; padding: 16px 26px; border-top: 1px solid var(--digages-refund-border); background: #fff; box-shadow: 0 -8px 18px rgba(16,24,40,.04); }
.digages-refund-drawer__foot .button { min-height: 39px; padding: 0 17px; }
.digages-refund-drawer .button-primary { border-color: var(--digages-refund-purple); background: var(--digages-refund-purple); }
.digages-refund-drawer .is-reject { margin-right: auto; border-color: #e04f4f; color: #b42318; }

@media (max-width: 1100px) {
    .digages-refund-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 782px) {
    .digages-refunds-page { margin: 18px 10px 40px 0; }
    .digages-refunds-titlebar { align-items: flex-start; }
    .digages-refunds-titlebar h1 { font-size: 27px; }
    .digages-refund-cards { grid-template-columns: 1fr; gap: 10px; }
    .digages-refund-filters { align-items: -webkit-fill-available; flex-direction: column; }
    .digages-refund-search { flex-basis: auto; max-width: none; }
    .digages-refund-drawer { top: 46px; width: 100vw; }
}