Skip to content

Instantly share code, notes, and snippets.

@cocolee
Created October 1, 2021 08:43
Show Gist options
  • Save cocolee/532b81f625b2cc5a1abc8dc59203539d to your computer and use it in GitHub Desktop.
Save cocolee/532b81f625b2cc5a1abc8dc59203539d to your computer and use it in GitHub Desktop.
<div className="bg-white grid grid-cols-12 px-8 py-5 rounded mb-10">
<div className="col-span-4 flex flex-row items-center">
<span className="w-12 h-12 bg-primary flex items-center justify-center rounded-full">
<svg
className="fill-current text-white"
width="19"
height="19"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<p className="flex flex-row ml-3 font-medium">
<span>İstanbul (SAW)</span>
<span>&nbsp; - &nbsp;</span>
<span>İtalya (FCO)</span>
</p>
</div>
<div className="col-span-3 flex flex-row items-center">
<span>
<svg
className="fill-current text-gray mr-3"
xmlns="http://www.w3.org/2000/svg"
width="21.548"
height="16.585"
viewBox="0 0 22 17"
>
<path
d="M5.5 1.58a.741.741 0 0 1-.612.851 2.094 2.094 0 0 0 .047 4.142.741.741 0 0 1-.1 1.475.667.667 0 0 1-.1-.007A3.575 3.575 0 0 1 4.652.967a.739.739 0 0 1 .85.605s0 0 0 .008ZM16.9.967a3.576 3.576 0 0 1-.084 7.072.667.667 0 0 1-.1.007.741.741 0 0 1-.1-1.475 2.094 2.094 0 0 0 .048-4.142A.741.741 0 1 1 16.9.966Zm-6.125.515a3.031 3.031 0 0 0-.029 6.063l.025.741v-.742a3.031 3.031 0 1 0 0-6.063Zm0-1.482a4.513 4.513 0 1 1 0 9.026h-.028a4.5 4.5 0 0 1-4.493-4.513A4.521 4.521 0 0 1 10.775 0ZM3.748 10.507a.743.743 0 0 1-.624.844c-1.089.162-1.638.464-1.638.9 0 .135 0 .416.672.672a.741.741 0 0 1-.264 1.433.754.754 0 0 1-.264-.048A2.174 2.174 0 0 1 0 12.248c0-.879.5-2 2.9-2.363a.746.746 0 0 1 .844.622Zm14.9-.622c2.4.359 2.9 1.482 2.9 2.363a2.174 2.174 0 0 1-1.627 2.052.754.754 0 0 1-.264.048.741.741 0 0 1-.264-1.433c.671-.255.671-.536.671-.672 0-.433-.551-.735-1.638-.9a.741.741 0 1 1 .221-1.466Zm-7.872 1.883c-2.351 0-5.155.288-5.155 1.661 0 1.342 2.637 1.655 4.94 1.673h.215c2.351 0 5.154-.287 5.154-1.657 0-1.386-2.8-1.677-5.154-1.677Zm0-1.482h.362c1.911.013 6.277.205 6.277 3.161 0 2.934-4.214 3.125-6.247 3.138h-.753c-1.911-.013-6.278-.2-6.278-3.155s4.363-3.13 6.276-3.142h.362Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span>1 Yetişkin l Ekonomi</span>
</div>
<div className="col-span-2 flex flex-row items-center">
<a href="">
<svg
xmlns="http://www.w3.org/2000/svg"
width="10.004"
height="12"
viewBox="0 0 10 12"
>
<path
d="M.369 4.869c.057-.058.27-.306.469-.51a21.683 21.683 0 0 1 5.8-4.024A4.607 4.607 0 0 1 7.817 0a1.932 1.932 0 0 1 .9.218 1.873 1.873 0 0 1 .795.9 9.981 9.981 0 0 1 .256 1.064 24.043 24.043 0 0 1 .237 3.81 27.741 27.741 0 0 1-.213 3.689 8.525 8.525 0 0 1-.341 1.327A1.784 1.784 0 0 1 7.873 12h-.056a4.893 4.893 0 0 1-1.321-.409A21.683 21.683 0 0 1 .828 7.625a5.506 5.506 0 0 1-.482-.554 1.783 1.783 0 0 1-.347-1.064 1.873 1.873 0 0 1 .369-1.138"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
<span className="ml-3 mr-3">20 Eylül Pzt</span>
<a href="">
<svg
xmlns="http://www.w3.org/2000/svg"
width="10"
height="12"
viewBox="0 0 10 12"
>
<path
fill="CurrentColor"
fillRule="evenodd"
d="M9.6327 7.131c-.057.058-.27.306-.469.51a21.6826 21.6826 0 0 1-5.795 4.024 4.606 4.606 0 0 1-1.179.335 1.932 1.932 0 0 1-.9-.218 1.873 1.873 0 0 1-.795-.9 9.982 9.982 0 0 1-.256-1.064c-.18-1.262-.259-2.536-.237-3.81-.011-1.233.06-2.465.213-3.689.078-.451.192-.895.341-1.327.298-.601.907-.984 1.578-.992h.056c.458.073.902.211 1.321.409a21.683 21.683 0 0 1 5.668 3.966c.173.174.334.359.482.554.225.309.344.682.341 1.064.005.409-.125.809-.369 1.138"
/>
</svg>
</a>
</div>
<div className="col-span-2 flex flex-row items-center">
<a href="">
<svg
xmlns="http://www.w3.org/2000/svg"
width="10.004"
height="12"
viewBox="0 0 10 12"
>
<path
d="M.369 4.869c.057-.058.27-.306.469-.51a21.683 21.683 0 0 1 5.8-4.024A4.607 4.607 0 0 1 7.817 0a1.932 1.932 0 0 1 .9.218 1.873 1.873 0 0 1 .795.9 9.981 9.981 0 0 1 .256 1.064 24.043 24.043 0 0 1 .237 3.81 27.741 27.741 0 0 1-.213 3.689 8.525 8.525 0 0 1-.341 1.327A1.784 1.784 0 0 1 7.873 12h-.056a4.893 4.893 0 0 1-1.321-.409A21.683 21.683 0 0 1 .828 7.625a5.506 5.506 0 0 1-.482-.554 1.783 1.783 0 0 1-.347-1.064 1.873 1.873 0 0 1 .369-1.138"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
<span className="ml-3 mr-3">26 Eylül Pzt</span>
<a href="">
<svg
xmlns="http://www.w3.org/2000/svg"
width="10"
height="12"
viewBox="0 0 10 12"
>
<path
fill="CurrentColor"
fillRule="evenodd"
d="M9.6327 7.131c-.057.058-.27.306-.469.51a21.6826 21.6826 0 0 1-5.795 4.024 4.606 4.606 0 0 1-1.179.335 1.932 1.932 0 0 1-.9-.218 1.873 1.873 0 0 1-.795-.9 9.982 9.982 0 0 1-.256-1.064c-.18-1.262-.259-2.536-.237-3.81-.011-1.233.06-2.465.213-3.689.078-.451.192-.895.341-1.327.298-.601.907-.984 1.578-.992h.056c.458.073.902.211 1.321.409a21.683 21.683 0 0 1 5.668 3.966c.173.174.334.359.482.554.225.309.344.682.341 1.064.005.409-.125.809-.369 1.138"
/>
</svg>
</a>
</div>
<div className="col-span-1">
<a href="" className="flex">
<span className="p-4 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="20.335"
height="20.368"
viewBox="0 0 21 21"
>
<path
data-name="Path 4"
d="m14.831 1.975-.616.614 3.527 3.528.617-.615a1.633 1.633 0 0 0 0-2.31l-1.217-1.217a1.64 1.64 0 0 0-2.311 0ZM13.155 3.65l-5.8 5.8a1.411 1.411 0 0 0-.415.968l-.075 3.011h2.98a1.414 1.414 0 0 0 1.005-.416l5.832-5.834ZM18.2.914l1.217 1.217a3.134 3.134 0 0 1 0 4.432l-7.507 7.509a2.9 2.9 0 0 1-2.065.855H6.1a.75.75 0 0 1-.75-.752v-.017l.094-3.779A2.912 2.912 0 0 1 6.3 8.387L13.771.914a3.139 3.139 0 0 1 4.429 0ZM9.492.036a.75.75 0 1 1 0 1.5H5.753c-2.584 0-4.253 1.77-4.253 4.509v8.314c0 2.739 1.669 4.509 4.253 4.509h8.824c2.584 0 4.254-1.77 4.254-4.509v-4.028a.75.75 0 0 1 1.5 0v4.028c0 3.594-2.313 6.009-5.754 6.009H5.753C2.312 20.368 0 17.953 0 14.359V6.045C0 2.451 2.312.036 5.753.036Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</a>
</div>
</div>
<div className="grid grid-cols-12 gap-5">
<div className="col-span-3">
<div className="flex flex-row items-center justify-between mb-12">
<h2 className="text-xl font-medium">Filtreleme</h2>
<a
href=""
className="flex flex-row items-center text-xs text-primary"
>
<span>
<svg
className="fill-current w-4 h-4 mr-0.5"
xmlns="http://www.w3.org/2000/svg"
width="18.458"
height="20"
viewBox="0 0 19 20"
>
<path
d="M11.346 1.497H7.113a.529.529 0 0 0-.512.392l-.233 1.17a2.357 2.357 0 0 1-.128.427h5.979a2.357 2.357 0 0 1-.128-.427l-.243-1.216a.524.524 0 0 0-.5-.346Zm0-1.5a2.033 2.033 0 0 1 1.962 1.506l.254 1.261a.9.9 0 0 0 .865.722h3.282a.75.75 0 0 1 0 1.5H.746a.75.75 0 0 1 0-1.5h3.281l.1-.006a.9.9 0 0 0 .769-.716l.24-1.216A2.043 2.043 0 0 1 7.112-.003Zm5.04 6.72a.751.751 0 0 1 .688.808c-.006.068-.548 6.779-.86 9.594a2.976 2.976 0 0 1-3.09 2.842q-2 .035-3.876.036c-1.355 0-2.676-.015-3.983-.042a2.967 2.967 0 0 1-3.018-2.829c-.315-2.84-.854-9.534-.859-9.6a.749.749 0 0 1 .685-.808.77.77 0 0 1 .808.687c0 .043.224 2.777.464 5.482l.048.54c.121 1.344.244 2.636.343 3.536a1.471 1.471 0 0 0 1.447 1.5h.111c2.5.053 5.051.056 7.8.006a1.5 1.5 0 0 0 1.621-1.369v-.138c.31-2.794.85-9.482.856-9.55a.766.766 0 0 1 .808-.689Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span>Filtreyi Temizle</span>
</a>
</div>
<div className="flex flex-col">
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Aktarmalar</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
<div className="mt-6">
<label className="flex items-center mb-6">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span className="ml-2">Direkt</span>
</label>
<label className="flex items-center text-red">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-red rounded focus:ring-primary bg-red-extralight"
/>
<span className="ml-2">1 Aktarma</span>
</label>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Fiyat</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
<div className="flex flex-row gap-5 mt-6">
<label className="flex flex-col">
<span className="mb-3">En az</span>
<input
type="number"
className="form-input border-gray rounded placeholder-currentfocus:outline-none focus-visible:ring-0 focus:border-primary appearance-none w-32"
/>
</label>
<label className="flex flex-col">
<span className="mb-3">En çok</span>
<input
type="number"
className="form-input border-gray rounded placeholder-currentfocus:outline-none focus-visible:ring-0 focus:border-primary appearance-none w-32"
/>
</label>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Sınıf</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
<div className="mt-6">
<label className="flex items-center">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span className="ml-2">Ekonomi</span>
</label>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Havayolları</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Bagaj</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
<div>
<div className="flex justify-between items-center">
<h4 className="font-medium">Süre</h4>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</div>
</div>
<div className="my-7 border-b border-gray-extralight"></div>
</div>
<div className="bg-white rounded p-6">
<div>
<a href="" className="flex items-center justify-between">
<h3 className="font-medium flex">
<svg
className="text-primary mr-3"
xmlns="http://www.w3.org/2000/svg"
width="21.5"
height="21.5"
viewBox="0 0 22 22"
>
<path
d="M15.378 11.825a.75.75 0 0 1 .75.75v3.234a.75.75 0 0 1-1.5 0v-3.231a.75.75 0 0 1 .75-.75Zm-4.59-6.909a.75.75 0 0 1 .75.75v10.145a.75.75 0 0 1-1.5 0V5.668a.75.75 0 0 1 .75-.75ZM6.121 8.197a.75.75 0 0 1 .75.75v6.86a.75.75 0 1 1-1.5 0V8.95a.75.75 0 0 1 .747-.753Zm9.315-6.7H6.064c-2.772 0-4.564 1.9-4.564 4.835v8.83c0 2.935 1.792 4.835 4.564 4.835h9.372c2.773 0 4.564-1.9 4.564-4.835v-8.83c0-2.935-1.791-4.835-4.564-4.835Zm0-1.5c3.627 0 6.064 2.546 6.064 6.335v8.83c0 3.789-2.437 6.335-6.064 6.335H6.064C2.437 21.497 0 18.951 0 15.162v-8.83C0 2.543 2.437-.003 6.064-.003Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
<span>Fiyat Tablosu</span>
</h3>
<span>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15.502"
height="8.499"
viewBox="0 0 16 9"
>
<path
d="M.222.218a.75.75 0 0 1 .976-.07l.084.07 6.47 6.469 6.47-6.469a.75.75 0 0 1 .976-.07l.084.07a.75.75 0 0 1 .073.977l-.073.084-7 7a.75.75 0 0 1-.977.073l-.083-.074-7-7A.748.748 0 0 1 .217.219h.005"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
</a>
<div className="mt-12">
<div className="flex flex-row justify-between items-center mb-8">
<h4 className="font-medium">Gidiş</h4>
<div className="text-gray flex flex-row items-center">
<a
href=""
className="hover:text-primary transition-colors"
>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
>
<path
data-name="Path 2"
d="M11.973 6a.75.75 0 0 1 0 1.061L9.019 10l2.952 2.94a.75.75 0 0 1-1 1.119.821.821 0 0 1-.058-.059l-3.487-3.47a.753.753 0 0 1 0-1.063L10.913 6a.749.749 0 0 1 1.059 0ZM10 1.5a8.5 8.5 0 1 0 8.5 8.5A8.5 8.5 0 0 0 10 1.5ZM10 0A10 10 0 1 1 0 10 10 10 0 0 1 10 0Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
<p className="text-xs mx-2">
<span>19 Eyl 2021</span>
<span>&nbsp; ,&nbsp;</span>
<span>Paz</span>
</p>
<a
href=""
className="hover:text-primary transition-colors"
>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
>
<path
d="m9.088 6 3.486 3.471a.753.753 0 0 1 0 1.063L9.088 14a.75.75 0 0 1-1.058-1.06L10.982 10 8.03 7.061A.75.75 0 0 1 9.088 6M10 1.5a8.5 8.5 0 1 0 8.5 8.5A8.5 8.5 0 0 0 10 1.5M10 0A10 10 0 1 1 0 10 10 10 0 0 1 10 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
</div>
</div>
<div className="flex flex-row justify-between items-end gap-5">
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-10"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-24"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-16"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-10"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-12"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-12"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-16"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-24"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
</div>
<div className="flex flex-row justify-between items-center mt-7 mb-8">
<h4 className="font-medium">Gidiş</h4>
<div className="text-gray flex flex-row items-center">
<a
href=""
className="hover:text-primary transition-colors"
>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
>
<path
data-name="Path 2"
d="M11.973 6a.75.75 0 0 1 0 1.061L9.019 10l2.952 2.94a.75.75 0 0 1-1 1.119.821.821 0 0 1-.058-.059l-3.487-3.47a.753.753 0 0 1 0-1.063L10.913 6a.749.749 0 0 1 1.059 0ZM10 1.5a8.5 8.5 0 1 0 8.5 8.5A8.5 8.5 0 0 0 10 1.5ZM10 0A10 10 0 1 1 0 10 10 10 0 0 1 10 0Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
<p className="text-xs mx-2">
<span>19 Eyl 2021</span>
<span>&nbsp; ,&nbsp;</span>
<span>Paz</span>
</p>
<a
href=""
className="hover:text-primary transition-colors"
>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 20 20"
>
<path
d="m9.088 6 3.486 3.471a.753.753 0 0 1 0 1.063L9.088 14a.75.75 0 0 1-1.058-1.06L10.982 10 8.03 7.061A.75.75 0 0 1 9.088 6M10 1.5a8.5 8.5 0 1 0 8.5 8.5A8.5 8.5 0 0 0 10 1.5M10 0A10 10 0 1 1 0 10 10 10 0 0 1 10 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</a>
</div>
</div>
<div className="flex flex-row justify-between items-end gap-5">
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-10"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-24"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-16"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-10"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-12"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-14"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-20"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-12"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-16"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
<div className="flex flex-col group">
<div className="price-table-item h-24"></div>
<p className="text-xs text-gray-dark mt-3">19 Paz</p>
<span className="text-[10px] font-medium text-primary-dark text-center mt-1">
180&#8378;
</span>
</div>
</div>
</div>
</div>
</div>
<div className="bg-white rounded px-8 py-5 flex flex-row items-center mt-5">
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="39"
height="25"
>
<defs>
<linearGradient
id="a"
x1="49.9999%"
x2="49.9999%"
y1="97.5359%"
y2="0%"
>
<stop offset="0%" stopColor="#C3FFE8" />
<stop offset="99.73%" stopColor="#F0FFF4" />
</linearGradient>
<linearGradient
id="b"
x1="50%"
x2="50%"
y1="100%"
y2="0%"
>
<stop offset="0%" stopColor="#00B59C" />
<stop offset="100%" stopColor="#9CFFAC" />
</linearGradient>
</defs>
<g fill="none">
<path
fill="url(#a)"
d="M21.7851 8.077c0-1.2936-1.0042-2.3078-2.2851-2.3078-1.281 0-2.2852 1.0142-2.2852 2.3077-1.2809 0-2.2851 1.0142-2.2851 2.3077 0 1.2936 1.0042 2.3077 2.2851 2.3077C17.2148 13.9858 18.2191 15 19.5 15c1.2809 0 2.2851-1.0142 2.2851-2.3077 1.281 0 2.2852-1.0141 2.2852-2.3077 0-1.2935-1.0043-2.3077-2.2852-2.3077ZM3.4277 2.3076c.6294 0 1.1426.5172 1.1426 1.1538 0 .6378.511 1.1539 1.1426 1.1539.6315 0 1.1426-.516 1.1426-1.1539C6.8555 1.5528 5.3179 0 3.4277 0 1.5376 0 0 1.5528 0 3.4615v2.3077c0 .0016.0008.0029.0008.0043.0003.054.0243.1073.0323.1615.0146.0988.0225.2003.0604.2892.0001.0004.0001.001.0003.0013.067.16 1.7116 3.9833 4.7109 7.9507.387.5107 1.1042.6015 1.6023.2175.4999-.3865.598-1.111.2142-1.617-2.445-3.2338-3.9635-6.4326-4.336-7.254V3.4614c0-.6366.5132-1.1538 1.1425-1.1538ZM35.5722 0c-1.8901 0-3.4277 1.5528-3.4277 3.4615 0 .6378.511 1.1539 1.1425 1.1539.6316 0 1.1426-.516 1.1426-1.1539 0-.6366.5133-1.1538 1.1426-1.1538.6293 0 1.1426.5172 1.1426 1.1538v2.0611c-.3726.8215-1.891 4.0203-4.336 7.2542-.3839.506-.2857 1.2305.2142 1.617.4981.384 1.2154.2933 1.6023-.2174 2.9993-3.9675 4.644-7.7907 4.711-7.9507 0-.0004 0-.001.0002-.0014.0378-.089.0458-.1903.0604-.2891.008-.0543.032-.1075.0323-.1616 0-.0014.0008-.0027.0008-.0042V3.4617C39 1.5527 37.4623 0 35.5722 0Z"
/>
<path
fill="url(#b)"
d="M33.852 4.5455c-3.4898 0-5.7473-1.25-7.8597-2.4546C24.1327 1.0227 22.365 0 20 0s-4.1327 1.0227-5.9923 2.091C11.8953 3.2954 9.6378 4.5454 6.148 4.5454 5.505 4.5455 5 5.0454 5 5.6818v9.8636c0 .2501.0918.5.2295.6819C9.6836 21.9773 14.8342 25 20 25c5.1658 0 10.3164-3.0227 14.7705-8.7727.1377-.182.2295-.4318.2295-.682V5.6819c0-.6364-.505-1.1363-1.148-1.1363Zm-11.556 9.0909h-1.148v1.1363c0 .6363-.505 1.1364-1.148 1.1364-.643 0-1.148-.5-1.148-1.1364v-1.1363h-1.148c-.6429 0-1.1479-.5001-1.1479-1.1364 0-.6364.505-1.1364 1.148-1.1364h1.148v-1.1363c0-.6365.505-1.1364 1.1479-1.1364.643 0 1.148.5 1.148 1.1364v1.1363h1.148c.6429 0 1.1479.5 1.1479 1.1364 0 .6363-.505 1.1364-1.148 1.1364Z"
/>
</g>
</svg>
</span>
<div className="flex flex-col ml-9">
<p className="text-xs mb-1">
KOVID-19 Rezervasyon yapmadan önce destinasyonunuz için
gerekli şartları sağladığınızdan emin olun.
</p>
<a
href=""
className="text-xs text-primary hover:text-primary-light transition-colors"
>
Daha fazla bilgi edin.
</a>
</div>
</div>
<div className="grid grid-cols-11 bg-white rounded p-4 mt-5 items-center">
<a href="" className="col-span-2 active-border-bottom">
<h3 className="font-medium mb-1">En Ucuz</h3>
<p className="text-xs text-gray-dark">
<span>1.573&#8378;</span>
<span>&nbsp; - &nbsp;</span>
<span>2sa. 42dk.</span>
</p>
</a>
<div className="col-span-1 border-r mx-auto border-gray-light h-3/4"></div>
<a href="" className="col-span-2">
<h3 className="font-medium mb-1">En İyi</h3>
<p className="text-xs text-gray-dark">
<span>1.573&#8378;</span>
<span>&nbsp; - &nbsp;</span>
<span>2sa. 42dk.</span>
</p>
</a>
<div className="col-span-1 border-r mx-auto border-gray-light h-3/4"></div>
<a href="" className="col-span-2">
<h3 className="font-medium mb-1">En Kısa</h3>
<p className="text-xs text-gray-dark">
<span>1.573&#8378;</span>
<span>&nbsp; - &nbsp;</span>
<span>2sa. 42dk.</span>
</p>
</a>
<div className="col-span-1 border-r mx-auto border-gray-light h-3/4"></div>
<div className="col-span-2 flex item-center group relative">
<div className="cursor-pointer flex">
<h3 className="font-medium flex items-center">
<span className="mr-2">
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="18"
height="16"
viewBox="0 0 20 18"
>
<path
d="M18.505 1.897a1.481 1.481 0 0 1 0 2.962H11.93a1.481 1.481 0 1 1 0-2.962h6.575ZM3.451-.003A3.409 3.409 0 0 1 6.89 3.376a3.409 3.409 0 0 1-3.438 3.38 3.38 3.38 0 1 1 0-6.759Zm4.644 12.958a1.482 1.482 0 1 1 .077 2.963H1.52a1.482 1.482 0 0 1-.077-2.963h.077Zm8.478-1.938a3.38 3.38 0 1 1-3.439 3.38 3.38 3.38 0 0 1 3.439-3.38Z"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span>Diğer Sıralamalar</span>
</h3>
</div>
<div
tabIndex="0"
className="opacity-0 invisible absolute top-full -right-3 rounded bg-white w-56 group-hover:mt-2 group-hover:opacity-100 group-hover:visible transition-all divide-y divide-gray-extralight z-10 shadow-2xl"
>
<div className="w-5 overflow-hidden inline-block absolute top-[-12px] right-10">
<div className="h-3 w-3 bg-gray-extralight rotate-45 transform origin-bottom-left"></div>
</div>
<a href="" className="default-dropdown-item rounded-t">
En Erken Kalkış Saati (AJI)
</a>
<a href="" className="default-dropdown-item">
Erken Erken Varış Saati (AJI)
</a>
<a href="" className="default-dropdown-item">
En Erken Varış Saatı (IST)
</a>
<a href="" className="default-dropdown-item rounded-b">
En Erken Kalkış Saati (AJI)
</a>
</div>
</div>
</div>
<div>
<div className="flex flex-row">
<div className="flex flex-col w-full">
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight mt-8">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
</div>
<div className="bg-white rouneded flex flex-col items-center justify-center ml-auto mt-8 border-l border-b border-gray-extralight p-5">
<p className="flex flex-col text-center mb-5">
<span className="text-2xl font-medium">
1.324.99&#8378;
</span>
<span className="text-xs font-medium mt-1">
Yolcu başına
</span>
</p>
<button className="btn btn-success btn-sm">
Sonraki
</button>
</div>
</div>
<div className="bg-white rounded py-4 px-6 group relative">
<button className="text-xs font-medium text-primary hover:text-primary-light transition-colors flex flex-row items-center">
<span>Detayları gör</span>
<svg
className="fill-current ml-1"
xmlns="http://www.w3.org/2000/svg"
width="16"
height="14"
viewBox="0 0 20 17"
>
<path
d="M9.994 5.678a2.427 2.427 0 1 0 2.411 2.428 2.418 2.418 0 0 0-2.411-2.428m0-1.51a3.937 3.937 0 1 1-3.91 3.938 3.923 3.923 0 0 1 3.91-3.938m0-2.658c-3.435 0-6.568 2.46-8.428 6.59 1.859 4.136 4.992 6.591 8.428 6.6s6.568-2.46 8.428-6.6c-1.859-4.136-4.992-6.6-8.428-6.6m0-1.51c4.135 0 7.848 2.919 9.933 7.807a.753.753 0 0 1 0 .6c-2.081 4.884-5.8 7.8-9.933 7.808S2.146 13.292.061 8.4a.761.761 0 0 1 0-.6C2.143 2.919 5.857 0 9.994 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</button>
<div
tabIndex="0"
className="opacity-0 invisible h-0 absolute top-full left-0 rounded bg-white w-[655px] group-focus-within:mt-1 group-focus-within:opacity-100 group-focus-within:visible z-10 group-focus-within:h-auto transition-all shadow-2xl z-10"
>
<div>
<h2 className="flex flex-row items-center justify-between text-2xl font-medium px-6 py-8 border-b border-gray-light">
Uçuş Plan Detayı
<a href="">
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 13 13"
>
<g fill="CurentColor">
<path d="M12.0372 13a.9827.9827 0 0 1-.6831-.2827L.2964 1.6548A.9664.9664 0 0 1 .2917.3072.9654.9654 0 0 1 1.6381.2659l.0246.0221 11.0576 11.0625a.9689.9689 0 0 1 .206 1.0517.9682.9682 0 0 1-.8891.5978Z" />
<path d="M.9648 12.9927a.9634.9634 0 0 1-.8917-.5956.964.964 0 0 1 .211-1.0516L11.3419.2831a.9658.9658 0 0 1 1.3662 0c.3773.3774.3773.9894 0 1.3668L1.6504 12.7124a.9559.9559 0 0 1-.6856.2803Z" />
</g>
</svg>
</a>
</h2>
<div className="grid grid-cols-12 border-b border-gray-light">
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light active-border-bottom before:-bottom-px"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
</div>
<div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col pb-6">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div className="flex flex-row">
<div className="flex flex-col w-full">
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight mt-5">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
</div>
<div className="bg-white rouneded flex flex-col items-center justify-center ml-auto mt-5 border-l border-b border-gray-extralight p-5">
<p className="flex flex-col text-center mb-5">
<span className="text-2xl font-medium">
1.324.99&#8378;
</span>
<span className="text-xs font-medium mt-1">
Yolcu başına
</span>
</p>
<button className="btn btn-success btn-sm">
Sonraki
</button>
</div>
</div>
<div className="bg-white rounded py-4 px-6 group relative">
<button className="text-xs font-medium text-primary hover:text-primary-light transition-colors flex flex-row items-center">
<span>Detayları gör</span>
<svg
className="fill-current ml-1"
xmlns="http://www.w3.org/2000/svg"
width="16"
height="14"
viewBox="0 0 20 17"
>
<path
d="M9.994 5.678a2.427 2.427 0 1 0 2.411 2.428 2.418 2.418 0 0 0-2.411-2.428m0-1.51a3.937 3.937 0 1 1-3.91 3.938 3.923 3.923 0 0 1 3.91-3.938m0-2.658c-3.435 0-6.568 2.46-8.428 6.59 1.859 4.136 4.992 6.591 8.428 6.6s6.568-2.46 8.428-6.6c-1.859-4.136-4.992-6.6-8.428-6.6m0-1.51c4.135 0 7.848 2.919 9.933 7.807a.753.753 0 0 1 0 .6c-2.081 4.884-5.8 7.8-9.933 7.808S2.146 13.292.061 8.4a.761.761 0 0 1 0-.6C2.143 2.919 5.857 0 9.994 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</button>
<div
tabIndex="0"
className="opacity-0 invisible h-0 absolute top-full left-0 rounded bg-white w-[655px] group-focus-within:mt-1 group-focus-within:opacity-100 group-focus-within:visible z-10 group-focus-within:h-auto transition-all shadow-2xl z-10"
>
<div>
<h2 className="flex flex-row items-center justify-between text-2xl font-medium px-6 py-8 border-b border-gray-light">
Uçuş Plan Detayı
<a href="">
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 13 13"
>
<g fill="CurentColor">
<path d="M12.0372 13a.9827.9827 0 0 1-.6831-.2827L.2964 1.6548A.9664.9664 0 0 1 .2917.3072.9654.9654 0 0 1 1.6381.2659l.0246.0221 11.0576 11.0625a.9689.9689 0 0 1 .206 1.0517.9682.9682 0 0 1-.8891.5978Z" />
<path d="M.9648 12.9927a.9634.9634 0 0 1-.8917-.5956.964.964 0 0 1 .211-1.0516L11.3419.2831a.9658.9658 0 0 1 1.3662 0c.3773.3774.3773.9894 0 1.3668L1.6504 12.7124a.9559.9559 0 0 1-.6856.2803Z" />
</g>
</svg>
</a>
</h2>
<div className="grid grid-cols-12 border-b border-gray-light">
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light active-border-bottom before:-bottom-px"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
</div>
<div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col pb-6">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div className="flex flex-row">
<div className="flex flex-col w-full">
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight mt-5">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
</div>
<div className="bg-white rouneded flex flex-col items-center justify-center ml-auto mt-5 border-l border-b border-gray-extralight p-5">
<p className="flex flex-col text-center mb-5">
<span className="text-2xl font-medium">
1.324.99&#8378;
</span>
<span className="text-xs font-medium mt-1">
Yolcu başına
</span>
</p>
<button className="btn btn-success btn-sm">
Sonraki
</button>
</div>
</div>
<div className="bg-white rounded py-4 px-6 group relative">
<button className="text-xs font-medium text-primary hover:text-primary-light transition-colors flex flex-row items-center">
<span>Detayları gör</span>
<svg
className="fill-current ml-1"
xmlns="http://www.w3.org/2000/svg"
width="16"
height="14"
viewBox="0 0 20 17"
>
<path
d="M9.994 5.678a2.427 2.427 0 1 0 2.411 2.428 2.418 2.418 0 0 0-2.411-2.428m0-1.51a3.937 3.937 0 1 1-3.91 3.938 3.923 3.923 0 0 1 3.91-3.938m0-2.658c-3.435 0-6.568 2.46-8.428 6.59 1.859 4.136 4.992 6.591 8.428 6.6s6.568-2.46 8.428-6.6c-1.859-4.136-4.992-6.6-8.428-6.6m0-1.51c4.135 0 7.848 2.919 9.933 7.807a.753.753 0 0 1 0 .6c-2.081 4.884-5.8 7.8-9.933 7.808S2.146 13.292.061 8.4a.761.761 0 0 1 0-.6C2.143 2.919 5.857 0 9.994 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</button>
<div
tabIndex="0"
className="opacity-0 invisible h-0 absolute top-full left-0 rounded bg-white w-[655px] group-focus-within:mt-1 group-focus-within:opacity-100 group-focus-within:visible z-10 group-focus-within:h-auto transition-all shadow-2xl z-10"
>
<div>
<h2 className="flex flex-row items-center justify-between text-2xl font-medium px-6 py-8 border-b border-gray-light">
Uçuş Plan Detayı
<a href="">
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 13 13"
>
<g fill="CurentColor">
<path d="M12.0372 13a.9827.9827 0 0 1-.6831-.2827L.2964 1.6548A.9664.9664 0 0 1 .2917.3072.9654.9654 0 0 1 1.6381.2659l.0246.0221 11.0576 11.0625a.9689.9689 0 0 1 .206 1.0517.9682.9682 0 0 1-.8891.5978Z" />
<path d="M.9648 12.9927a.9634.9634 0 0 1-.8917-.5956.964.964 0 0 1 .211-1.0516L11.3419.2831a.9658.9658 0 0 1 1.3662 0c.3773.3774.3773.9894 0 1.3668L1.6504 12.7124a.9559.9559 0 0 1-.6856.2803Z" />
</g>
</svg>
</a>
</h2>
<div className="grid grid-cols-12 border-b border-gray-light">
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light active-border-bottom before:-bottom-px"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">2sa. 50dk.</span>
</p>
</a>
</div>
<div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">11:15</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col pb-6">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div>
<div className="flex flex-row mt-5 mb-16">
<div className="flex flex-col w-full">
<div className="bg-white rounded px-6 py-5 flex flex-row items-center gap-5 border-b border-gray-extralight">
<label className="inline-flex items-center justify-start">
<input
type="checkbox"
className="form-checkbox w-6 h-6 text-primary border-gray rounded focus:ring-primary"
/>
<span>
<svg
className="ml-4"
xmlns="http://www.w3.org/2000/svg"
width="33"
height="32"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
</label>
<div className="flex flex-col">
<p className="font-medium mb-1 flex flex-row items-center">
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-right-4 after:rounded-full">
8.40
</span>
<span className="flex relative mx-16 before:w-12 before:absolute before:top-1/2 before:-translate-y-1/2 before:right-full before:border-t before:max-h-px before:border-dotted before:border-gray after:w-12 after:absolute after:top-1/2 after:-translate-y-1/2 after:left-full after:border-t after:border-solid after:border-gray">
<svg
className="text-primary mx-2"
width="16"
height="16"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 19 19"
>
<path
d="m14.9226 16.891 1.3288-1.3289c.0791-.079.1266-.2056.0791-.2847L14.638 6.909c-.0475-.1265 0-.2056.079-.2847l3.7967-3.7966a1.6518 1.6518 0 0 0 0-2.3413 1.6518 1.6518 0 0 0-2.3413 0l-3.9231 3.9232c-.0791.079-.1582.1265-.2848.079l-8.495-1.5817c-.1265 0-.2056 0-.2847.079l-1.3763 1.408c-.1582.1582-.1265.443.0791.522l6.4226 2.8316c.2056.0791.2373.3639.079.522L4.2289 12.43c-.079.0791-.2056.1266-.2847.0791l-2.7525-.5695c-.1266-.0474-.2057 0-.2848.0791L.1 12.8254c-.1581.1582-.1265.4113.0791.522l2.7526 1.3288c0 .0475.0474.0475.079.0791l1.1707 1.1707c.0474.0474.0474.0474.0474.079l1.408 2.7842c.079.2057.3638.2373.522.0791l.6802-.6802c.0791-.0791.1266-.2057.0791-.2848l-.5695-2.7841c-.0474-.1266 0-.2057.0791-.2848l4.4136-4.4135c.1582-.1582.4113-.1266.522.079l3.0373 6.2645c.1107.253.3638.2847.522.1265Z"
fill="CurrentColor"
/>
</svg>
</span>
<span className="flex relative after:w-[6px] after:h-[6px] after:bg-gray after:absolute after:top-1/2 after:-translate-y-1/2 after:-left-4 after:rounded-full">
10.35
</span>
</p>
<p className="text-xs text-gray-dark">
<span>SAW Sabiha Go..</span>
<span>&nbsp; - &nbsp;</span>
<span>FCO Fiumicino</span>
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs text-green font-medium">
Aktarmasız
</p>
</div>
<div className="w-2/12 text-center">
<p className="text-xs font-medium">2sa. 50dk.</p>
</div>
</div>
<div className="bg-white rounded py-4 px-6 group relative">
<button className="text-xs font-medium text-primary hover:text-primary-light transition-colors flex flex-row items-center">
<span>Detayları gör</span>
<svg
className="fill-current ml-1"
xmlns="http://www.w3.org/2000/svg"
width="16"
height="14"
viewBox="0 0 20 17"
>
<path
d="M9.994 5.678a2.427 2.427 0 1 0 2.411 2.428 2.418 2.418 0 0 0-2.411-2.428m0-1.51a3.937 3.937 0 1 1-3.91 3.938 3.923 3.923 0 0 1 3.91-3.938m0-2.658c-3.435 0-6.568 2.46-8.428 6.59 1.859 4.136 4.992 6.591 8.428 6.6s6.568-2.46 8.428-6.6c-1.859-4.136-4.992-6.6-8.428-6.6m0-1.51c4.135 0 7.848 2.919 9.933 7.807a.753.753 0 0 1 0 .6c-2.081 4.884-5.8 7.8-9.933 7.808S2.146 13.292.061 8.4a.761.761 0 0 1 0-.6C2.143 2.919 5.857 0 9.994 0"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</button>
<div
tabIndex="0"
className="opacity-0 invisible h-0 absolute top-full left-0 rounded bg-white w-[655px] group-focus-within:mt-1 group-focus-within:opacity-100 group-focus-within:visible z-10 group-focus-within:h-auto transition-all shadow-2xl z-10"
>
<div>
<h2 className="flex flex-row items-center justify-between text-2xl font-medium px-6 py-8 border-b border-gray-light">
Uçuş Plan Detayı
<a href="">
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="20"
viewBox="0 0 13 13"
>
<g fill="CurentColor">
<path d="M12.0372 13a.9827.9827 0 0 1-.6831-.2827L.2964 1.6548A.9664.9664 0 0 1 .2917.3072.9654.9654 0 0 1 1.6381.2659l.0246.0221 11.0576 11.0625a.9689.9689 0 0 1 .206 1.0517.9682.9682 0 0 1-.8891.5978Z" />
<path d="M.9648 12.9927a.9634.9634 0 0 1-.8917-.5956.964.964 0 0 1 .211-1.0516L11.3419.2831a.9658.9658 0 0 1 1.3662 0c.3773.3774.3773.9894 0 1.3668L1.6504 12.7124a.9559.9559 0 0 1-.6856.2803Z" />
</g>
</svg>
</a>
</h2>
<div className="grid grid-cols-12 border-b border-gray-light">
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light active-border-bottom before:-bottom-px"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">
2sa. 50dk.
</span>
</p>
</a>
<a
href=""
className="col-span-6 px-5 py-4 border-r border-gray-light"
>
<h4 className="font-medium text-gray-dark">
Gidiş
</h4>
<p className="flex flex-row justify-between">
<span className="font-medium flex flex-row items-center">
<span>AJI</span>
<span>&nbsp; - &nbsp;</span>
<span>IGA</span>
<span>&nbsp; - &nbsp;</span>
<span>WAS</span>
</span>
<span className="text-gray-dark">
2sa. 50dk.
</span>
</p>
</a>
</div>
<div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına
aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına
aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
<div className="px-8 pt-5 pb-3 flex flex-row items-center gap-5">
<span className="inline-flex p-2 border border-gray-light rounded">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 33 32"
>
<path
fill="#C80119"
fillRule="evenodd"
d="M.7029 19.1102c.3914 2.1557 1.239 4.137 2.4322 5.8744 4.4569-1.1445 8.3766-3.3127 9.7695-8.1446 1.5347-5.3177-.216-10.8906-4.4015-13.8446-5.7 3.3301-8.988 9.5917-7.8002 16.1148M32.218 13.341c1.4665 8.7083-4.4143 16.9542-13.138 18.416a16.0024 16.0024 0 0 1-4.3305.1375c-4.5507-.4748-8.651-2.8899-11.2899-6.5206l25.9281-7.4226c.373-.1075.2766-.4648-.0312-.4436l-10.8708.7584c1.5315-1.4755 2.6977-3.2871 2.5563-5.7909-.2865-4.0543-4.4206-8.0123-12.1082-10.616a15.9531 15.9531 0 0 1 4.8398-1.638c1.4677-.2461 2.9216-.2861 4.3305-.1374 6.9781.7284 12.8952 6.0108 14.114 13.2572"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span>
<svg
className="fill-current"
xmlns="http://www.w3.org/2000/svg"
width="21"
height="17"
viewBox="0 0 17 14"
>
<path
d="M-.001 6.774a.75.75 0 0 1 .648-.743l.1-.007h13.186L9.17 1.28a.75.75 0 0 1 .974-1.135l.084.072 6.05 6.024a.745.745 0 0 1 .1.124l.024.041.02.037.024.056.016.043.016.056.009.04.008.06v.076a.719.719 0 0 1-.013.139v.035a.5.5 0 0 1-.019.066l-.011.034a.638.638 0 0 1-.029.065l-.016.03-.029.048-.024.033-.006.009a.77.77 0 0 1-.066.075l-6.051 6.022a.75.75 0 0 1-1.129-.982l.073-.084 4.761-4.743H.75A.75.75 0 0 1 0 6.774"
fill="CurrentColor"
fillRule="evenodd"
/>
</svg>
</span>
<span className="text-xs font-medium">
11:15
</span>
<span className="text-xs text-gray">
17 Eyl Cuma
</span>
<span className="text-xs text-green font-medium ml-3 flex relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-4 before:rounded-full">
Ekonomi
</span>
</div>
<div className="ml-24 flex flex-col pb-6">
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(Ağrı) Ahmedi Xani Havalimanı
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="x relative flex flex-row items-center text-xs text-gray-dark gap-5">
<span>Turkish Airlines, TK 2731</span>
<span>2sa. 50dk.</span>
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
(İstanbul) İstanbul Airport (IGA)
</p>
<p className="relative before:w-px before:h-5 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:left-[-47px] before:rounded-full">
&nbsp;
</p>
<p className="text-xs bg-gray-extralight p-2 rounded relative before:w-1 before:h-1 before:bg-gray before:absolute before:top-1/2 before:-translate-y-1/2 before:-left-12 before:rounded-full">
<span>
<b>IGA</b> havaalanında kendi başına
aktarma.
</span>
<span className="text-gray-dark ml-5">
1s 45dk bekleme
</span>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="bg-white rouneded flex flex-col justify-center border-l border-gray-extralight px-5 py-4">
<p className="flex flex-col text-center mb-2">
<span className="text-xl font-medium">
1.324.99&#8378;
</span>
<span className="text-xs text-gray-dark">
Yolcu başına
</span>
</p>
<button className="btn btn-success btn-sm">
Sonraki
</button>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment