.payments-page{color:#162c45;width:100%;max-width:1600px;margin:0 auto;padding:28px 30px 60px}.payments-hero{background:radial-gradient(circle at 82% 46%,#079dce1f,#0000 25%),radial-gradient(circle at 70% 80%,#04dc5517,#0000 24%),#fff;border:1px solid #162c4514;border-radius:28px;grid-template-columns:minmax(0,1fr) 320px;gap:28px;min-height:290px;padding:34px 38px;display:grid;position:relative;overflow:hidden;box-shadow:0 18px 50px #162c450f,inset 0 1px #ffffffe6}.payments-hero:before{content:"";pointer-events:none;background-image:linear-gradient(#162c4506 1px,#0000 1px),linear-gradient(90deg,#162c4506 1px,#0000 1px);background-size:32px 32px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#000,#0000 82%);mask-image:linear-gradient(90deg,#000,#0000 82%)}.payments-hero__content{z-index:2;flex-direction:column;justify-content:center;min-width:0;display:flex;position:relative}.payments-eyebrow{color:#078ebc;letter-spacing:.16em;align-items:center;gap:9px;width:fit-content;margin-bottom:12px;font-family:Inter,sans-serif;font-size:10px;font-weight:800;display:inline-flex}.payments-eyebrow__dot{background:#04dc55;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 5px #04dc551a}.payments-title-row{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.payments-title-row h1{color:#142a44;letter-spacing:-.055em;margin:0;font-family:Poppins,sans-serif;font-size:clamp(34px,4vw,52px);font-weight:700;line-height:1}.payments-title-row p{color:#64758a;max-width:700px;margin:16px 0 0;font-family:Inter,sans-serif;font-size:14px;line-height:1.75}.payments-refresh{color:#162c45;cursor:pointer;background:#fff;border:1px solid #162c451a;border-radius:10px;flex:none;align-items:center;gap:8px;min-height:40px;padding:0 14px;font-family:Inter,sans-serif;font-size:12px;font-weight:700;transition:transform .18s,border-color .18s,box-shadow .18s;display:inline-flex}.payments-refresh:hover:not(:disabled){border-color:#079dce47;transform:translateY(-1px);box-shadow:0 8px 20px #162c4512}.payments-refresh:disabled{opacity:.55;cursor:not-allowed}.payments-refresh__icon{font-size:14px}.payments-refresh__icon--spinning,.payments-toolbar-refresh svg.payments-refresh__icon--spinning{animation:.8s linear infinite payments-spin}@keyframes payments-spin{to{transform:rotate(360deg)}}.payments-hero__meta{flex-wrap:wrap;gap:8px;margin-top:25px;display:flex}.payments-hero__meta span{color:#65788d;background:#ffffffbf;border:1px solid #162c4514;border-radius:999px;align-items:center;gap:7px;min-height:30px;padding:0 10px;font-family:Inter,sans-serif;font-size:10px;font-weight:700;display:inline-flex}.payments-hero__meta svg{color:#078ebc;font-size:12px}.payments-hero__visual{justify-content:center;align-items:center;min-height:220px;display:flex;position:relative}.payments-orbit{border:1px solid #079dce2e;border-radius:50%;width:190px;height:190px;position:absolute;transform:rotate(-20deg)}.payments-orbit span{background:#078ebc;border-radius:50%;width:9px;height:9px;margin-left:-4.5px;position:absolute;top:7px;left:50%;box-shadow:0 0 0 6px #078ebc14}.payments-orbit--one{animation:12s linear infinite payments-orbit-one}.payments-orbit--two{border-color:#04dc552e;width:145px;height:235px;animation:16s linear infinite payments-orbit-two;transform:rotate(48deg)}.payments-orbit--two span{background:#04dc55}.payments-orbit--three{border-color:#162c4517;width:245px;height:130px;animation:18s linear infinite payments-orbit-three;transform:rotate(-12deg)}.payments-orbit--three span{background:#162c45}@keyframes payments-orbit-one{to{transform:rotate(340deg)}}@keyframes payments-orbit-two{to{transform:rotate(408deg)}}@keyframes payments-orbit-three{to{transform:rotate(348deg)}}.payments-core{z-index:2;background:radial-gradient(circle at 35% 25%,#079dce1f,#0000 60%),#fff;border:1px solid #079dce2e;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:112px;height:112px;display:flex;position:relative;box-shadow:0 20px 45px #162c4514,inset 0 0 30px #079dce09}.payments-core svg{color:#078ebc;font-size:25px}.payments-core small{color:#162c45;letter-spacing:.14em;font-family:Inter,sans-serif;font-size:8px;font-weight:800}.payments-metrics{grid-template-columns:1.45fr repeat(4,1fr);gap:12px;margin-top:18px;display:grid}.payments-metric{background:#fff;border:1px solid #162c4514;border-radius:17px;align-items:center;gap:13px;min-width:0;padding:17px;transition:transform .18s,box-shadow .18s;display:flex;box-shadow:0 10px 30px #162c450b}.payments-metric:hover{transform:translateY(-2px);box-shadow:0 15px 35px #162c4512}.payments-metric--primary{background:radial-gradient(circle at 100% 0,#079dce17,#0000 50%),#fff;border-color:#079dce2b}.payments-metric__icon{color:#078ebc;background:#079dce17;border-radius:11px;flex:none;justify-content:center;align-items:center;width:38px;height:38px;font-size:17px;display:flex}.payments-metric__icon--green{color:#04a944;background:#04dc5517}.payments-metric__icon--amber{color:#b97800;background:#f5a6231a}.payments-metric__icon--red{color:#d23f3f;background:#e64c4c17}.payments-metric__icon--purple{color:#7650b5;background:#7e57c217}.payments-metric>div:last-child{min-width:0}.payments-metric span{color:#78899b;margin-bottom:4px;font-family:Inter,sans-serif;font-size:10px;font-weight:700;display:block}.payments-metric strong{color:#162c45;letter-spacing:-.035em;text-overflow:ellipsis;white-space:nowrap;font-family:Poppins,sans-serif;font-size:19px;font-weight:700;display:block;overflow:hidden}.payments-metric small{color:#9aa8b6;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block;overflow:hidden}.payments-directory{background:#fff;border:1px solid #162c4514;border-radius:22px;margin-top:18px;overflow:hidden;box-shadow:0 15px 40px #162c450b}.payments-directory__header{justify-content:space-between;align-items:flex-end;gap:20px;padding:25px 26px 20px;display:flex}.payments-section-kicker{color:#078ebc;letter-spacing:.16em;margin-bottom:7px;font-family:Inter,sans-serif;font-size:9px;font-weight:800;display:block}.payments-directory__header h2{color:#162c45;letter-spacing:-.035em;margin:0;font-family:Poppins,sans-serif;font-size:22px;font-weight:700}.payments-directory__header p{color:#7b8b9b;margin:7px 0 0;font-family:Inter,sans-serif;font-size:12px}.payments-directory__count{flex:none;align-items:baseline;gap:6px;display:flex}.payments-directory__count strong{color:#162c45;font-family:Poppins,sans-serif;font-size:24px}.payments-directory__count span{color:#8795a4;font-family:Inter,sans-serif;font-size:10px;font-weight:700}.payments-toolbar{align-items:center;gap:9px;padding:0 26px 18px;display:flex}.payments-search{background:#f9fbfc;border:1px solid #162c451a;border-radius:10px;flex:auto;align-items:center;gap:9px;min-width:220px;height:42px;padding:0 12px;transition:border-color .16s,box-shadow .16s;display:flex}.payments-search:focus-within{border-color:#079dce66;box-shadow:0 0 0 3px #079dce14}.payments-search>svg{color:#8292a2;flex:none;font-size:15px}.payments-search input{color:#162c45;background:0 0;border:0;outline:0;flex:1;min-width:0;height:100%;font-family:Inter,sans-serif;font-size:12px}.payments-search input::placeholder{color:#9ca9b6}.payments-search__clear{color:#617285;cursor:pointer;background:#e9eef2;border:0;border-radius:50%;width:24px;height:24px;padding:0;font-size:16px;line-height:1}.payments-filter{background:#f9fbfc;border:1px solid #162c451a;border-radius:10px;align-items:center;gap:7px;height:42px;padding:0 11px;display:flex}.payments-filter svg{color:#8292a2;font-size:13px}.payments-filter select{color:#40566d;cursor:pointer;background:0 0;border:0;outline:0;min-width:130px;height:100%;font-family:Inter,sans-serif;font-size:11px;font-weight:700}.payments-toolbar-refresh{color:#40566d;cursor:pointer;background:#fff;border:1px solid #162c451a;border-radius:10px;align-items:center;gap:7px;height:42px;padding:0 13px;font-family:Inter,sans-serif;font-size:11px;font-weight:700;display:inline-flex}.payments-toolbar-refresh:hover:not(:disabled){border-color:#079dce40}.payments-toolbar-refresh:disabled{opacity:.55;cursor:not-allowed}.payments-toolbar-refresh svg{font-size:13px}.payments-table-wrap{border-top:1px solid #162c4512;width:100%;overflow-x:auto}.payments-table{border-collapse:collapse;width:100%;min-width:1180px}.payments-table th{color:#8795a3;letter-spacing:.07em;text-align:left;text-transform:uppercase;white-space:nowrap;background:#fbfcfd;border-bottom:1px solid #162c4512;padding:12px 15px;font-family:Inter,sans-serif;font-size:9px;font-weight:800}.payments-table td{vertical-align:middle;border-bottom:1px solid #162c450e;padding:14px 15px}.payments-table tbody tr{transition:background .15s}.payments-table tbody tr:hover{background:#fbfdfe}.payment-record{align-items:center;gap:10px;min-width:180px;display:flex}.payment-record__icon{color:#078ebc;background:#079dce14;border-radius:9px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.payment-record strong{color:#253d55;text-overflow:ellipsis;white-space:nowrap;max-width:180px;font-family:Inter,sans-serif;font-size:11px;font-weight:800;display:block;overflow:hidden}.payment-record span{color:#8b9aa8;white-space:nowrap;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-customer{align-items:center;gap:9px;min-width:150px;display:flex}.payment-avatar{color:#078ebc;background:#edf5f7;border-radius:50%;flex:none;justify-content:center;align-items:center;width:31px;height:31px;font-family:Poppins,sans-serif;font-size:11px;font-weight:700;display:flex;overflow:hidden}.payment-avatar img{object-fit:cover;width:100%;height:100%}.payment-customer strong,.payment-customer a{color:#2b4259;text-overflow:ellipsis;white-space:nowrap;max-width:150px;font-family:Inter,sans-serif;font-size:11px;font-weight:700;text-decoration:none;display:block;overflow:hidden}.payment-customer span{color:#8e9ba8;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-link{color:#078ebc;font-family:Inter,sans-serif;font-size:11px;font-weight:800;text-decoration:none}.payment-link:hover{color:#056e93;text-decoration:underline}.payment-link--customer{color:#2b4259}.payment-order{min-width:110px}.payment-order span{color:#8c9aa7;text-transform:capitalize;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-amount strong{color:#162c45;white-space:nowrap;font-family:Poppins,sans-serif;font-size:12px;font-weight:700;display:block}.payment-amount span{color:#9aa6b2;white-space:nowrap;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-method strong{color:#42576b;white-space:nowrap;font-family:Inter,sans-serif;font-size:10px;font-weight:700;display:block}.payment-method span{color:#9aa6b2;white-space:nowrap;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-status{white-space:nowrap;border:1px solid #0000;border-radius:999px;align-items:center;gap:5px;min-height:25px;padding:0 8px;font-family:Inter,sans-serif;font-size:9px;font-weight:800;display:inline-flex}.payment-status svg{font-size:11px}.payment-status--successful{color:#079640;background:#04dc5514;border-color:#04a94424}.payment-status--pending{color:#a56b00;background:#f5a62317;border-color:#b9780024}.payment-status--failed{color:#c53c3c;background:#e64c4c14;border-color:#d23f3f24}.payment-status--refunded{color:#7650b5;background:#7e57c214;border-color:#7650b524}.payment-date{min-width:90px}.payment-date strong{color:#40566d;white-space:nowrap;font-family:Inter,sans-serif;font-size:10px;font-weight:700;display:block}.payment-date span{color:#9aa7b3;white-space:nowrap;margin-top:3px;font-family:Inter,sans-serif;font-size:9px;display:block}.payment-open{color:#60758a;background:#fff;border:1px solid #162c4517;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;text-decoration:none;transition:color .15s,border-color .15s,background .15s,transform .15s;display:inline-flex}.payment-open:hover{color:#078ebc;background:#f4fbfd;border-color:#079dce40;transform:translate(2px)}.payments-mobile-list{display:none}.payment-mobile-card{border-top:1px solid #162c4512;padding:17px}.payment-mobile-card__top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.payment-mobile-card__amount{background:#f7fafb;border-radius:12px;margin:17px 0;padding:13px}.payment-mobile-card__amount span{color:#8b99a7;margin-bottom:4px;font-family:Inter,sans-serif;font-size:9px;font-weight:700;display:block}.payment-mobile-card__amount strong{color:#162c45;font-family:Poppins,sans-serif;font-size:20px}.payment-mobile-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.payment-mobile-card__grid>div{min-width:0}.payment-mobile-card__grid span{color:#99a6b2;text-transform:uppercase;margin-bottom:4px;font-family:Inter,sans-serif;font-size:9px;font-weight:700;display:block}.payment-mobile-card__grid strong,.payment-mobile-card__grid a{color:#40566d;text-overflow:ellipsis;white-space:nowrap;font-family:Inter,sans-serif;font-size:11px;font-weight:700;text-decoration:none;display:block;overflow:hidden}.payment-mobile-card__grid a{color:#078ebc}.payment-mobile-card__open{color:#078ebc;border-top:1px solid #162c450f;justify-content:space-between;align-items:center;gap:10px;margin-top:17px;padding-top:13px;font-family:Inter,sans-serif;font-size:11px;font-weight:800;text-decoration:none;display:flex}.payment-mobile-card__open svg{font-size:13px}.payments-loading{padding:0 26px 26px}.payments-loading__bar,.payments-loading__row{background:#f1f4f6;border-radius:8px;position:relative;overflow:hidden}.payments-loading__bar:after,.payments-loading__row:after{content:"";background:linear-gradient(90deg,#0000,#fffc,#0000);animation:1.25s infinite payments-skeleton;position:absolute;inset:0;transform:translate(-100%)}.payments-loading__bar{height:42px;margin-bottom:10px}.payments-loading__row{height:55px;margin-top:7px}@keyframes payments-skeleton{to{transform:translate(100%)}}.payments-state{border-radius:13px;align-items:center;gap:13px;margin:0 26px 26px;padding:18px;display:flex}.payments-state--error{background:#e64c4c0b;border:1px solid #d23f3f1f}.payments-state__icon{color:#c53c3c;background:#e64c4c17;border-radius:10px;flex:none;justify-content:center;align-items:center;width:38px;height:38px;display:flex}.payments-state strong{color:#a53434;font-family:Inter,sans-serif;font-size:12px;font-weight:800;display:block}.payments-state p{color:#8f6b6b;margin:4px 0 0;font-family:Inter,sans-serif;font-size:10px}.payments-state button,.payments-empty button{color:#40566d;cursor:pointer;background:#fff;border:1px solid #162c451a;border-radius:8px;min-height:34px;margin-left:auto;padding:0 12px;font-family:Inter,sans-serif;font-size:10px;font-weight:800}.payments-empty{text-align:center;border-top:1px solid #162c4512;padding:60px 25px 70px}.payments-empty__icon{color:#078ebc;background:#f0f7f9;border-radius:15px;justify-content:center;align-items:center;width:54px;height:54px;margin:0 auto 15px;font-size:22px;display:flex}.payments-empty h3{color:#273e55;margin:0;font-family:Poppins,sans-serif;font-size:17px}.payments-empty p{color:#8b99a7;max-width:420px;margin:7px auto 0;font-family:Inter,sans-serif;font-size:11px;line-height:1.7}.payments-summary{background:radial-gradient(circle at 100% 0,#04dc550f,#0000 35%),#fff;border:1px solid #162c4514;border-radius:20px;grid-template-columns:minmax(0,1.1fr) minmax(420px,.9fr);gap:25px;margin-top:18px;padding:25px 27px;display:grid}.payments-summary>div:first-child>span{color:#078ebc;letter-spacing:.15em;font-family:Inter,sans-serif;font-size:9px;font-weight:800}.payments-summary h2{color:#162c45;letter-spacing:-.03em;margin:7px 0 0;font-family:Poppins,sans-serif;font-size:19px}.payments-summary p{color:#82909e;max-width:620px;margin:8px 0 0;font-family:Inter,sans-serif;font-size:11px;line-height:1.7}.payments-summary__stats{grid-template-columns:repeat(3,1fr);align-self:center;gap:8px;display:grid}.payments-summary__stats>div{background:#fafcfd;border:1px solid #162c4512;border-radius:11px;padding:13px}.payments-summary__stats span{color:#8c9aa8;font-family:Inter,sans-serif;font-size:9px;font-weight:700;display:block}.payments-summary__stats strong{color:#273e55;text-overflow:ellipsis;white-space:nowrap;margin-top:6px;font-family:Poppins,sans-serif;font-size:13px;font-weight:700;display:block;overflow:hidden}@media (max-width:1250px){.payments-metrics{grid-template-columns:repeat(3,1fr)}.payments-metric--primary{grid-column:span 3}}@media (max-width:980px){.payments-page{padding:22px 20px 45px}.payments-hero{grid-template-columns:minmax(0,1fr) 240px;padding:28px}.payments-hero__visual{transform:scale(.85)}.payments-toolbar{flex-wrap:wrap}.payments-search{flex-basis:100%}.payments-summary{grid-template-columns:1fr}}@media (max-width:760px){.payments-page{padding:16px 14px 40px}.payments-hero{border-radius:21px;grid-template-columns:1fr;min-height:0;padding:25px 21px}.payments-title-row{display:block}.payments-title-row h1{font-size:35px}.payments-title-row p{margin-top:13px;font-size:12px}.payments-refresh{margin-top:17px}.payments-hero__visual{min-height:170px;margin-top:-5px;transform:scale(.72)}.payments-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.payments-metric--primary{grid-column:span 2}.payments-metric{padding:13px}.payments-metric strong{font-size:17px}.payments-directory{border-radius:18px}.payments-directory__header{align-items:flex-start;padding:20px 18px 16px}.payments-directory__header h2{font-size:19px}.payments-directory__header p{max-width:260px;font-size:10px}.payments-toolbar{padding:0 18px 16px}.payments-filter{flex:1}.payments-filter select{width:100%;min-width:0}.payments-toolbar-refresh{flex:none}.payments-table-wrap{display:none}.payments-mobile-list{border-top:1px solid #162c4512;display:block}.payments-state{margin:0 18px 20px}.payments-summary{border-radius:18px;padding:21px}.payments-summary__stats{grid-template-columns:1fr}}@media (max-width:480px){.payments-metrics{grid-template-columns:1fr}.payments-metric--primary{grid-column:auto}.payments-metric{min-height:72px}.payments-toolbar{grid-template-columns:1fr;display:grid}.payments-search{min-width:0}.payments-filter,.payments-toolbar-refresh{width:100%}.payments-directory__count{display:none}.payment-mobile-card__top{display:block}.payment-mobile-card__top>.payment-status{margin-top:11px}}@media (prefers-reduced-motion:reduce){.payments-orbit,.payments-refresh__icon--spinning,.payments-toolbar-refresh svg.payments-refresh__icon--spinning,.payments-loading__bar:after,.payments-loading__row:after{animation:none!important}.payments-metric,.payments-refresh,.payment-open{transition:none}}
