https://dload.com/assets/payment-methods-6oDtApsC.js

1import{k as d,I as e,Q as a}from"./index-CL6DkWfS.js";import{P as x}from"./plus-CLLby2zx.js";import{S as u}from"./shield-DH_NRX3Y.js";import{B as c}from"./building-2-BO1RiVyW.js";import{S as m}from"./star-CO9X_msf.js";import{S as b}from"./square-pen-CDL15Vl6.js";import{T as y}from"./trash-2-Bz3GEfxR.js";import{C as i}from"./credit-card-B1HL8yGH.js";const p=[{id:"1",type:"card",name:"Visa ending in 4242",last4:"4242",expiry:"12/26",isDefault:!0,brand:"visa"},{id:"2",type:"card",name:"Mastercard ending in 8888",last4:"8888",expiry:"08/25",isDefault:!1,brand:"mastercard"},{id:"3",type:"bank",name:"Chase Business Checking",last4:"6789",isDefault:!1}],h=r=>{switch(r){case"visa":return e.jsx("div",{className:"w-10 h-6 bg-white rounded flex items-center justify-center text-[10px] font-bold text-blue-600",children:"VISA"});case"mastercard":return e.jsx("div",{className:"w-10 h-6 bg-neutral-800 rounded flex items-center justify-center",children:e.jsxs("div",{className:"flex",children:[e.jsx("div",{className:"w-3 h-3 rounded-full bg-red-500 -mr-1"}),e.jsx("div",{className:"w-3 h-3 rounded-full bg-yellow-500"})]})});default:return e.jsx(i,{className:"w-6 h-6 text-neutral-400"})}};function S(){const[r,l]=d.useState(!1),[t,n]=d.useState("card");return e.jsxs("div",{className:"min-h-screen bg-dark text-neutral-white",children:[e.jsx("div",{className:"border-b border-neutral-700 bg-dark-surface",children:e.jsx("div",{className:"max-w-7xl mx-auto px-8 py-6",children:e.jsxs("div",{className:"flex items-start justify-between",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-heading-l mb-2",children:"Payment Methods"}),e.jsx("p",{className:"text-body-m text-neutral-400",children:"Manage your payment methods for campaigns and billing"})]}),e.jsxs("button",{onClick:()=>l(!0),className:"flex items-center gap-2 px-4 py-2 bg-cyan text-dark rounded-lg text-body-s font-medium hover:bg-cyan/90 transition-colors",children:[e.jsx(x,{className:"w-4 h-4"}),"Add Payment Method"]})]})})}),e.jsxs("div",{className:"max-w-3xl mx-auto px-8 py-8",children:[e.jsxs(a.div,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},className:"bg-cyan/10 border border-cyan/30 rounded-xl p-4 mb-8 flex items-start gap-4",children:[e.jsx(u,{className:"w-5 h-5 text-cyan flex-shrink-0 mt-0.5"}),e.jsxs("div",{children:[e.jsx("p",{className:"text-body-s text-white mb-1",children:"Your payment information is secure"}),e.jsx("p",{className:"text-body-xs text-neutral-400",children:"All payment methods are encrypted using industry-standard 256-bit SSL encryption. We never store your full card number on our servers."})]})]}),e.jsx("div",{className:"space-y-4",children:p.map((s,o)=>e.jsx(a.div,{initial:{opacity:0,y:20},animate:{opacity:1,y:0},transition:{delay:o*.05},className:`bg-dark-surface border rounded-xl p-6 ${s.isDefault?"border-cyan":"border-neutral-700"}`,children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[s.type==="card"?h(s.brand):e.jsx("div",{className:"w-10 h-10 rounded-lg bg-neutral-800 flex items-center justify-center",children:e.jsx(c,{className:"w-5 h-5 text-neutral-400"})}),e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 mb-1",children:[e.jsx("p",{className:"text-body-m font-medium text-white",children:s.name}),s.isDefault&&e.jsxs("span",{className:"flex items-center gap-1 px-2 py-0.5 bg-cyan/20 text-cyan rounded text-body-xs",children:[e.jsx(m,{className:"w-3 h-3"}),"Default"]})]}),s.expiry&&e.jsxs("p",{className:"text-body-xs text-neutral-400",children:["Expires ",s.expiry]}),s.type==="bank"&&e.jsxs("p",{className:"text-body-xs text-neutral-400",children:["Bank Account **** ",s.last4]})]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[!s.isDefault&&e.jsx("button",{className:"px-3 py-1.5 text-body-xs text-neutral-400 hover:text-white border border-neutral-700 rounded-lg hover:border-neutral-600 transition-colors",children:"Set as Default"}),e.jsx("button",{className:"p-2 rounded-lg hover:bg-neutral-700 transition-colors",children:e.jsx(b,{className:"w-4 h-4 text-neutral-400"})}),e.jsx("button",{className:"p-2 rounded-lg hover:bg-neutral-700 hover:text-warning-red-500 transition-colors",children:e.jsx(y,{className:"w-4 h-4 text-neutral-400"})})]})]})},s.id))}),e.jsxs(a.div,{initial:{opacity:0,y:20}

1,animate:{opacity:1,y:0},transition:{delay:.2},className:"mt-8",children:[e.jsxs("div",{className:"flex items-center justify-between mb-4",children:[e.jsx("h2",{className:"text-heading-xs",children:"Billing Address"}),e.jsx("button",{className:"text-body-s text-cyan hover:text-cyan/80 transition-colors",children:"Edit"})]}),e.jsxs("div",{className:"bg-dark-surface border border-neutral-700 rounded-xl p-6",children:[e.jsx("p",{className:"text-body-m text-white mb-1",children:"Gaming Publisher Inc."}),e.jsx("p",{className:"text-body-s text-neutral-400",children:"123 Gaming Street"}),e.jsx("p",{className:"text-body-s text-neutral-400",children:"Suite 500"}),e.jsx("p",{className:"text-body-s text-neutral-400",children:"San Francisco, CA 94105"}),e.jsx("p",{className:"text-body-s text-neutral-400",children:"United States"})]})]}),r&&e.jsx("div",{className:"fixed inset-0 bg-black/60 flex items-center justify-center z-50",children:e.jsxs(a.div,{initial:{opacity:0,scale:.95},animate:{opacity:1,scale:1},className:"bg-dark-surface border border-neutral-700 rounded-xl w-full max-w-lg",children:[e.jsx("div",{className:"p-6 border-b border-neutral-700",children:e.jsx("h2",{className:"text-heading-s",children:"Add Payment Method"})}),e.jsxs("div",{className:"p-6 space-y-6",children:[e.jsxs("div",{className:"flex gap-4",children:[e.jsxs("button",{onClick:()=>n("card"),className:`flex-1 p-4 rounded-xl border flex flex-col items-center gap-2 transition-colors ${t==="card"?"border-cyan bg-cyan/10":"border-neutral-700 hover:border-neutral-600"}`,children:[e.jsx(i,{className:`w-6 h-6 ${t==="card"?"text-cyan":"text-neutral-400"}`}),e.jsx("span",{className:"text-body-s",children:"Credit/Debit Card"})]}),e.jsxs("button",{onClick:()=>n("bank"),className:`flex-1 p-4 rounded-xl border flex flex-col items-center gap-2 transition-colors ${t==="bank"?"border-cyan bg-cyan/10":"border-neutral-700 hover:border-neutral-600"}`,children:[e.jsx(c,{className:`w-6 h-6 ${t==="bank"?"text-cyan":"text-neutral-400"}`}),e.jsx("span",{className:"text-body-s",children:"Bank Account"})]})]}),t==="card"?e.jsxs(e.Fragment,{children:[e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Card Number"}),e.jsx("input",{type:"text",placeholder:"1234 5678 9012 3456",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]}),e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Expiry Date"}),e.jsx("input",{type:"text",placeholder:"MM/YY",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"CVC"}),e.jsx("input",{type:"text",placeholder:"123",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Cardholder Name"}),e.jsx("input",{type:"text",placeholder:"Name on card",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]})]}):e.jsxs(e.Fragment,{children:[e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Account Holder Name"}),e.jsx("input",{type:"text",placeholder:"Name on account",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Routing Number"}),e.jsx("input",{type:"text",placeholder:"123456789",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-body-s text-neutral-400 mb-2",children:"Account Number"}),e.jsx("input",{type:"text",placeholder:"Account number",className:"w-full bg-dark border border-neutral-700 rounded-lg px-4 py-3 text-body-s focus:border-cyan focus:outline-none"})]})]}),e.jsxs("label",{className:"flex items-center gap-3 cursor-pointer",children:[e.jsx("input",{type:"checkbox",className:"w-4 h-4 accent-cyan"}),e.jsx("span",{className:"text-body-s text-neutral-400",children:"Set as default payment method"})]})]}),e.jsxs("div",{className:"p-6 border-t border-neutral-700 flex items-center justify-end gap-3",children:[e.jsx("button",{onClick:()=>l(!1),className:"px-4 py-2 border border-neutral-700 rounded-lg text-body-s hover:border-neutral-600 transition-colors",children:"Cancel"}),e.jsx("button",{className:"px-4 py-2 bg-cyan text-dark rounded-lg text-body-s font-medium hover:bg-cyan/90 transition-colors",children:"Add Payment Method"})]})]})})]})]})}export{S as BrandBillingPaymentMethods,S as default};