import React from 'react';
import style from './index.module.scss';

interface BookingInnerCardProps {
  image?: React.JSX.Element;
  title?: string;
  subTitle?: string;
  isSwapColumn?: boolean;
}

const BookingInnerCard = ({
  image,
  title,
  subTitle,
  isSwapColumn,
}: BookingInnerCardProps) => {
  return (
    <div
      className={`${style.pendingTags} rounded-3 d-flex gap-3 justify-content-start align-items-center shadow-md`}
    >
      {image}
      <div
        className={`d-flex ${isSwapColumn ? 'flex-column-reverse' : ''} flex-column justify-content-start align-items-start`}
      >
        <h5 className="mb-0 fs-9 fs-md-10 text-light-grey-2 pb-0">{title}</h5>
        <h5 className="pb-0 fs-10 fs-md-11 fw-medium mb-0">{subTitle}</h5>
      </div>
    </div>
  );
};

export default BookingInnerCard;