function Text() {
  return (
    <div className="h-[14px] relative shrink-0 w-[13.703px]" data-name="Text">
      <div className="bg-clip-padding border-0 border-[transparent] border-solid box-border h-[14px] relative w-[13.703px]">
        <div className="absolute font-['Poppins:Bold',_sans-serif] leading-[0] left-0 not-italic text-[10.5px] text-nowrap text-white top-0">
          <p className="leading-[14px] whitespace-pre">JD</p>
        </div>
      </div>
    </div>
  );
}

function Container() {
  return (
    <div className="box-border content-stretch flex items-center justify-center pl-0 pr-[0.016px] py-0 relative rounded-[3.35544e+07px] shrink-0 size-[28px]" data-name="Container" style={{ backgroundImage: "linear-gradient(90deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 100%), linear-gradient(90deg, rgb(249, 95, 98) 0%, rgb(249, 95, 98) 100%)" }}>
      <Text />
    </div>
  );
}

function Text1() {
  return (
    <div className="content-stretch flex h-[17.5px] items-start relative shrink-0 w-[86.047px]" data-name="Text">
      <div className="font-['Poppins:SemiBold',_sans-serif] leading-[0] not-italic relative shrink-0 text-[12.25px] text-nowrap text-white">
        <p className="leading-[17.5px] whitespace-pre">MY CITY CARD</p>
      </div>
    </div>
  );
}

export default function AfterLogin() {
  return (
    <div className="bg-[#f95f62] relative rounded-[3.35544e+07px] shadow-[0px_10px_15px_-3px_rgba(0,0,0,0.1),0px_4px_6px_-4px_rgba(0,0,0,0.1)] size-full" data-name="After Login">
      <div className="flex flex-row items-center justify-center relative size-full">
        <div className="box-border content-stretch flex gap-[4px] items-center justify-center overflow-clip px-[15px] py-[12px] relative size-full">
          <Container />
          <Text1 />
        </div>
      </div>
    </div>
  );
}