:root {
      /* Primary Colors (base: #001976) */
      --primary: #001976;
      --primary-950: #00040f;
      --primary-900: #000a1f;
      --primary-800: #00143f;
      --primary-700: #001e5e;
      --primary-600: #00297d;
      --primary-500: #001976;
      --primary-400: #274494;
      --primary-300: #1a5cff;
      --primary-200: #4d85ff;
      --primary-100: #99b8ff;
      --primary-50: #e6f0ff;

      /* Secondary Colors (base: #0095da) */
      --secondary: #0095da;
      --secondary-950: #00253a;
      --secondary-900: #003a5a;
      --secondary-800: #00507a;
      --secondary-700: #00689e;
      --secondary-600: #0080c2;
      --secondary-500: #0095da;
      --secondary-400: #2eb3ff;
      --secondary-300: #5cc6ff;
      --secondary-200: #8ed9ff;
      --secondary-100: #c2ebff;
      --secondary-50: #f0f9ff;

      /* Zinc / Neutral Colors (بدون تغییر) */
      --zinc-950: #09090b;
      --zinc-900: #18181b;
      --zinc-800: #27272a;
      --zinc-700: #3f3f46;
      --zinc-600: #52525b;
      --zinc-500: #71717a;
      --zinc-400: #a1a1aa;
      --zinc-300: #d4d4d8;
      --zinc-200: #e4e4e7;
      --zinc-100: #FFFFFF;
      --zinc-50: #fafafa;

      --neutral-950: #09090b;
      --neutral-900: #18181b;
      --neutral-800: #27272a;
      --neutral-700: #3f3f46;
      --neutral-600: #52525b;
      --neutral-500: #71717a;
      --neutral-400: #a1a1aa;
      --neutral-300: #d4d4d8;
      --neutral-200: #e4e4e7;
      --neutral-100: #FFFFFF;
      --neutral-50: #fafafa;
    }




    /* css normalization */
    *,
    ::before,
    ::after {
      box-sizing: border-box;
      border-width: 0;
      border-style: solid;
      border-color: #e5e7eb;
    }

    ::before,
    ::after {
      --tw-content: '';
    }

    html,
    :host {
      line-height: 1.5;
      -webkit-text-size-adjust: 100%;
      -moz-tab-size: 4;
      -o-tab-size: 4;
      tab-size: 4;
      font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
      font-feature-settings: normal;
      font-variation-settings: normal;
      -webkit-tap-highlight-color: transparent;
    }

    body {
      margin: 0;
      line-height: inherit;
    }

    hr {
      height: 0;
      color: inherit;
      border-top-width: 1px;
    }

    abbr:where([title]) {
      -webkit-text-decoration: underline dotted;
      text-decoration: underline dotted;
    }

    a {
      color: inherit;
      text-decoration: inherit;
    }

    b,
    strong {
      font-weight: bolder;
    }

    code,
    kbd,
    samp,
    pre {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
      font-feature-settings: normal;
      font-variation-settings: normal;
      font-size: 1em;
    }

    small {
      font-size: 80%;
    }

    sub,
    sup {
      font-size: 75%;
      line-height: 0;
      position: relative;
      vertical-align: baseline;
    }

    sub {
      bottom: -0.25em;
    }

    sup {
      top: -0.5em;
    }

    table {
      text-indent: 0;
      border-color: inherit;
      border-collapse: collapse;
    }

    button,
    input,
    optgroup,
    select,
    textarea {
      font-family: inherit;
      font-feature-settings: inherit;
      font-variation-settings: inherit;
      font-size: 100%;
      font-weight: inherit;
      line-height: inherit;
      letter-spacing: inherit;
      color: inherit;
      margin: 0;
      padding: 0;
    }

    button,
    select {
      text-transform: none;
    }

    button,
    input:where([type='button']),
    input:where([type='reset']),
    input:where([type='submit']) {
      -webkit-appearance: button;
      background-color: transparent;
      background-image: none;
    }

    :-moz-focusring {
      outline: auto;
    }

    :-moz-ui-invalid {
      box-shadow: none;
    }

    progress {
      vertical-align: baseline;
    }

    ::-webkit-inner-spin-button,
    ::-webkit-outer-spin-button {
      height: auto;
    }

    [type='search'] {
      -webkit-appearance: textfield;
      outline-offset: -2px;
    }

    ::-webkit-search-decoration {
      -webkit-appearance: none;
    }

    ::-webkit-file-upload-button {
      -webkit-appearance: button;
      font: inherit;
    }

    summary {
      display: list-item;
    }

    blockquote,
    dl,
    dd,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    hr,
    figure,
    p,
    pre {
      margin: 0;
    }

    fieldset {
      margin: 0;
      padding: 0;
    }

    legend {
      padding: 0;
    }

    ol,
    ul,
    menu {
      list-style: none;
      margin: 0;
      padding: 0;
    }

    dialog {
      padding: 0;
    }

    textarea {
      resize: vertical;
    }

    input::-moz-placeholder,
    textarea::-moz-placeholder {
      opacity: 1;
      color: #9ca3af;
    }

    input::placeholder,
    textarea::placeholder {
      opacity: 1;
      color: #9ca3af;
    }

    button,
    [role="button"] {
      cursor: pointer;
    }

    :disabled {
      cursor: default;
    }

    img,
    svg,
    video,
    canvas,
    audio,
    iframe,
    embed,
    object {
      vertical-align: middle;
    }

    [hidden]:where(:not([hidden="until-found"])) {
      display: none;
    }

    body {
      font-family: "DanaFaNum";
      overflow-x: hidden;
    }

    #r-flight.module-form {
      padding-top: 0 !important;
      margin: 0 !important;
    }


    @media (min-width: 640px) {}

    @media (min-width: 768px) {}

    @media (min-width: 1024px) {}

    @media (min-width: 1280px) {}

    @media (min-width: 1536px) {}

    .gradient-border {
      position: relative;
      z-index: 0;
      border-radius: 0.375rem;
      overflow: hidden;
    }

    .gradient-border::before {
      content: "";
      position: absolute;
      inset: 0;
      padding: 0.75px;
      border-radius: inherit;
      background: linear-gradient(248.18deg, var(--tw-gradient-from) 1.36%, var(--tw-gradient-to) 98.64%);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      z-index: -1;
      pointer-events: none;
    }

    .pointer-events-none {
      pointer-events: none;
    }

    .pointer-events-auto {
      pointer-events: auto;
    }

    .visible {
      visibility: visible;
    }

    .invisible {
      visibility: hidden;
    }

    .fixed {
      position: fixed;
    }

    .absolute {
      position: absolute;
    }

    .relative {
      position: relative;
    }

    .inset-0 {
      inset: 0px;
    }

    .-bottom-2 {
      bottom: -0.5rem;
    }

    .-bottom-px {
      bottom: -1px;
    }

    .-left-px {
      left: -1px;
    }

    .right-0 {
      right: 0px;
    }

    .right-1 {
      right: 0.25rem;
    }

    .right-\[218px\] {
      right: 218px;
    }

    .top-0 {
      top: 0px;
    }

    .top-1 {
      top: 0.25rem;
    }

    .top-16 {
      top: 4rem;
    }

    .z-30 {
      z-index: 30;
    }

    .z-50 {
      z-index: 50;
    }

    .z-10000 {
      z-index: 10000;
    }

    .mx-auto {
      margin-left: auto;
      margin-right: auto;
    }

    .mb-2 {
      margin-bottom: 0.5rem;
    }

    .mb-3 {
      margin-bottom: 0.75rem;
    }

    .mb-6 {
      margin-bottom: 1.5rem;
    }

    .mt-2 {
      margin-top: 0.5rem;
    }

    .mt-20 {
      margin-top: 5rem;
    }

    .mt-24 {
      margin-top: 6rem;
    }

    .mt-6 {
      margin-top: 1.5rem;
    }

    .mt-8 {
      margin-top: 2rem;
    }

    .block {
      display: block;
    }

    .inline-block {
      display: inline-block;
    }

    .inline {
      display: inline;
    }

    .flex {
      display: flex;
    }

    .contents {
      display: contents;
    }

    .hidden {
      display: none;
    }

    .h-0\.5 {
      height: 0.125rem;
    }

    .h-12 {
      height: 3rem;
    }

    .h-14 {
      height: 3.5rem;
    }

    .h-16 {
      height: 4rem;
    }

    .h-6 {
      height: 1.5rem;
    }

    .h-full {
      height: 100%;
    }

    .h-px {
      height: 1px;
    }

    .max-h-0 {
      max-height: 0px;
    }

    .w-0 {
      width: 0px;
    }

    .w-12 {
      width: 3rem;
    }

    .w-20 {
      width: 5rem;
    }

    .w-32 {
      width: 8rem;
    }

    .w-48 {
      width: 12rem;
    }

    .w-56 {
      width: 14rem;
    }

    .w-6 {
      width: 1.5rem;
    }

    .w-\[90\%\] {
      width: 90%;
    }

    .w-full {
      width: 100%;
    }

    .flex-1 {
      flex: 1 1 0%;
    }

    .flex-shrink-0 {
      flex-shrink: 0;
    }

    

    .translate-y-2 {
      --tw-translate-y: 0.5rem;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .translate-y-full {
      --tw-translate-y: 100%;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .rotate-180 {
      --tw-rotate: 180deg;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .scale-0 {
      --tw-scale-x: 0;
      --tw-scale-y: 0;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .scale-100 {
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .scale-95 {
      --tw-scale-x: .95;
      --tw-scale-y: .95;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .transform {
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .cursor-pointer {
      cursor: pointer;
    }

    .select-none {
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none;
    }

    .resize {
      resize: both;
    }

    .flex-col {
      flex-direction: column;
    }

    .items-center {
      align-items: center;
    }

    .items-stretch {
      align-items: stretch;
    }

    .justify-center {
      justify-content: center;
    }

    .justify-between {
      justify-content: space-between;
    }

    .gap-0\.5 {
      gap: 0.125rem;
    }

    .gap-2 {
      gap: 0.5rem;
    }

    .gap-3 {
      gap: 0.75rem;
    }

    .gap-4 {
      gap: 1rem;
    }

    .gap-6 {
      gap: 1.5rem;
    }

    .divide-x>:not([hidden])~ :not([hidden]) {
      --tw-divide-x-reverse: 0;
      border-right-width: calc(1px * var(--tw-divide-x-reverse));
      border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
    }

    .divide-y>:not([hidden])~ :not([hidden]) {
      --tw-divide-y-reverse: 0;
      border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
      border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
    }

    .divide-x-reverse>:not([hidden])~ :not([hidden]) {
      --tw-divide-x-reverse: 1;
    }

    .divide-zinc-100>:not([hidden])~ :not([hidden]) {
      --tw-divide-opacity: 1;
      border-color: rgb(244 244 245 / var(--tw-divide-opacity, 1));
    }

    .divide-zinc-200>:not([hidden])~ :not([hidden]) {
      --tw-divide-opacity: 1;
      border-color: rgb(228 228 231 / var(--tw-divide-opacity, 1));
    }

    .overflow-hidden {
      overflow: hidden;
    }

    .overflow-scroll {
      overflow: scroll;
    }

    .rounded-lg {
      border-radius: 0.5rem;
    }

    .rounded-md {
      border-radius: 0.375rem;
    }

    .rounded-xl {
      border-radius: 0.75rem;
    }

    .border {
      border-width: 1px;
    }

    .border-2 {
      border-width: 2px;
    }

    .border-b {
      border-bottom-width: 1px;
    }

    .border-solid {
      border-style: solid;
    }

    .border-gray-100 {
      --tw-border-opacity: 1;
      border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
    }

    .border-primary-100 {
      border-color: var(--primary-100);
    }

    .border-primary-600 {
      border-color: var(--primary-600);
    }

    .border-zinc-300 {
      --tw-border-opacity: 1;
      border-color: rgb(212 212 216 / var(--tw-border-opacity, 1));
    }

    .border-zinc-400 {
      --tw-border-opacity: 1;
      border-color: rgb(161 161 170 / var(--tw-border-opacity, 1));
    }

    .bg-secondary {
      background-color: var(--secondary);
    }

    .bg-primary {
      background-color: var(--primary);
    }

    .bg-primary-50 {
      background-color: var(--primary-50);
    }

    .bg-primary-600 {
      background-color: var(--primary-600);
    }

    .bg-white {
      --tw-bg-opacity: 1;
      background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    }

    .bg-white\/90 {
      background-color: rgb(255 255 255 / 0.9);
    }

    .bg-white\/95 {
      background-color: rgb(255 255 255 / 0.95);
    }

    .bg-zinc-100 {
      --tw-bg-opacity: 1;
      background-color: rgb(244 244 245 / var(--tw-bg-opacity, 1));
    }

    .from-primary-600 {
      --tw-gradient-from: var(--primary-600) var(--tw-gradient-from-position);
      --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
      --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    }

    .object-contain {
      -o-object-fit: contain;
      object-fit: contain;
    }

    .object-cover {
      -o-object-fit: cover;
      object-fit: cover;
    }

    .p-1 {
      padding: 0.25rem;
    }

    .p-2 {
      padding: 0.5rem;
    }

    .px-3 {
      padding-left: 0.75rem;
      padding-right: 0.75rem;
    }

    .px-6 {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }

    .py-10 {
      padding-top: 2.5rem;
      padding-bottom: 2.5rem;
    }

    .py-2 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
    }

    .py-4 {
      padding-top: 1rem;
      padding-bottom: 1rem;
    }

    .py-6 {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
    }

    .pb-4 {
      padding-bottom: 1rem;
    }

    .pb-6 {
      padding-bottom: 1.5rem;
    }

    .pl-10 {
      padding-left: 2.5rem;
    }

    .pr-0 {
      padding-right: 0px;
    }

    .pr-12 {
      padding-right: 3rem;
    }

    .pr-2 {
      padding-right: 0.5rem;
    }

    .pr-3 {
      padding-right: 0.75rem;
    }

    .pt-3 {
      padding-top: 0.75rem;
    }

    .pt-6 {
      padding-top: 1.5rem;
    }

    .text-center {
      text-align: center;
    }

    .text-3xl {
      font-size: 1.875rem;
      line-height: 2.25rem;
    }

    .text-lg {
      font-size: 1.125rem;
      line-height: 1.75rem;
    }

    .text-sm {
      font-size: 0.875rem;
      line-height: 1.25rem;
    }

    .text-xl {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }

    .font-bold {
      font-weight: 700;
    }

    .font-medium {
      font-weight: 500;
    }

    .font-semibold {
      font-weight: 600;
    }

    .text-gray-400 {
      --tw-text-opacity: 1;
      color: rgb(156 163 175 / var(--tw-text-opacity, 1));
    }

    .text-primary {
      color: var(--primary);
    }

    .text-primary-600 {
      color: var(--primary-600);
    }

    .text-red-500 {
      --tw-text-opacity: 1;
      color: rgb(239 68 68 / var(--tw-text-opacity, 1));
    }

    .text-secondary {
      color: var(--secondary);
    }

    .text-zinc-500 {
      --tw-text-opacity: 1;
      color: rgb(113 113 122 / var(--tw-text-opacity, 1));
    }

    .text-zinc-800 {
      --tw-text-opacity: 1;
      color: rgb(39 39 42 / var(--tw-text-opacity, 1));
    }

    .text-zinc-900 {
      --tw-text-opacity: 1;
      color: rgb(24 24 27 / var(--tw-text-opacity, 1));
    }

    .placeholder-gray-400::-moz-placeholder {
      --tw-placeholder-opacity: 1;
      color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1));
    }

    .placeholder-gray-400::placeholder {
      --tw-placeholder-opacity: 1;
      color: rgb(156 163 175 / var(--tw-placeholder-opacity, 1));
    }

    .placeholder-zinc-700::-moz-placeholder {
      --tw-placeholder-opacity: 1;
      color: rgb(63 63 70 / var(--tw-placeholder-opacity, 1));
    }

    .placeholder-zinc-700::placeholder {
      --tw-placeholder-opacity: 1;
      color: rgb(63 63 70 / var(--tw-placeholder-opacity, 1));
    }

    .opacity-0 {
      opacity: 0;
    }

    .opacity-100 {
      opacity: 1;
    }

    .shadow-lg {
      --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
      --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }

    .outline-none {
      outline: 2px solid transparent;
      outline-offset: 2px;
    }

    .filter {
      filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
    }

    .backdrop-blur-md {
      --tw-backdrop-blur: blur(12px);
      -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
      backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    }

    .transition {
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 150ms;
    }

    .transition-all {
      transition-property: all;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 150ms;
    }

    .transition-colors {
      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 150ms;
    }

    .duration-300 {
      transition-duration: 300ms;
    }

    .duration-\[30ms\] {
      transition-duration: 30ms;
    }

    .h1-tag {
      position: absolute;
      width: 1px;
      padding: 0;
      height: 1px;
      margin: -1px;
      overflow: hidden;
      white-space: nowrap;
      border-width: 0;
      clip: rect(0, 0, 0, 0);
    }

    .direction-ltr {
      direction: ltr;
      unicode-bidi: embed;
    }

    .line-clamp-10 {
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 10;
    }

    .line-clamp-15 {
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 15;
    }

    .phone-number a:not(:last-child)::after {
      content: '-';
      margin-left: 4px;
      margin-right: 4px;
    }

    .hover\:-translate-y-px:hover {
      --tw-translate-y: -1px;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .hover\:scale-105:hover {
      --tw-scale-x: 1.05;
      --tw-scale-y: 1.05;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .hover\:scale-90:hover {
      --tw-scale-x: .9;
      --tw-scale-y: .9;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .hover\:border-secondary-600:hover {
      border-color: var(--secondary-600);
    }

    .hover\:bg-primary-600:hover {
      background-color: var(--primary-600);
    }

    .hover\:bg-gradient-to-r:hover {
      background-image: linear-gradient(to right, var(--tw-gradient-stops));
    }

    .hover\:from-primary-900:hover {
      --tw-gradient-from: var(--primary-900) var(--tw-gradient-from-position);
      --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
      --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    }

    .hover\:to-primary-400:hover {
      --tw-gradient-to: var(--primary-400) var(--tw-gradient-to-position);
    }

    .hover\:text-primary-600:hover {
      color: var(--primary-600);
    }

    .hover\:text-white:hover {
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    }

    .hover\:shadow-lg:hover {
      --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
      --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }

    .group\/levelthree:hover .group-hover\/levelthree\:visible {
      visibility: visible;
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:visible {
      visibility: visible;
    }

    .group:hover .group-hover\:visible {
      visibility: visible;
    }

    .group:hover .group-hover\:w-full {
      width: 100%;
    }

    .group\/levelthree:hover .group-hover\/levelthree\:translate-y-0 {
      --tw-translate-y: 0px;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:translate-y-0 {
      --tw-translate-y: 0px;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group:hover .group-hover\:translate-y-0 {
      --tw-translate-y: 0px;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group\/levelthree:hover .group-hover\/levelthree\:rotate-90 {
      --tw-rotate: 90deg;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:rotate-90 {
      --tw-rotate: 90deg;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group:hover .group-hover\:rotate-180 {
      --tw-rotate: 180deg;
      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .group\/levelthree:hover .group-hover\/levelthree\:fill-white {
      fill: #fff;
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:fill-white {
      fill: #fff;
    }

    .group:hover .group-hover\:fill-primary-600 {
      fill: var(--primary-600);
    }

    .group:hover .group-hover\:fill-secondary-600 {
      fill: var(--secondary-600);
    }

    .group\/levelfour:hover .group-hover\/levelfour\:text-white {
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    }

    .group\/levelthree:hover .group-hover\/levelthree\:text-white {
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:text-white {
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    }

    .group:hover .group-hover\:text-primary-500 {
      color: var(--primary-500);
    }

    .group:hover .group-hover\:text-primary-600 {
      color: var(--primary-600);
    }

    .group\/levelthree:hover .group-hover\/levelthree\:opacity-100 {
      opacity: 1;
    }

    .group\/leveltwo:hover .group-hover\/leveltwo\:opacity-100 {
      opacity: 1;
    }

    .group:hover .group-hover\:opacity-100 {
      opacity: 1;
    }

    .peer:checked~.peer-checked\:border-primary-600 {
      border-color: var(--primary-600);
    }

    .peer:checked~.peer-checked\:bg-primary-600 {
      background-color: var(--primary-600);
    }

    @media not all and (min-width: 1280px) {
      .max-xl\:w-\[97\%\] {
        width: 97%;
      }
    }

    @media not all and (min-width: 1024px) {
      .max-lg\:w-\[90\%\] {
        width: 90%;
      }
    }

    @media (min-width: 1024px) {
      .lg\:h-4 {
        height: 1rem;
      }

      .lg\:w-4 {
        width: 1rem;
      }

      .lg\:gap-4 {
        gap: 1rem;
      }

      .lg\:text-xs {
        font-size: 0.75rem;
        line-height: 1rem;
      }
    }

    @media (min-width: 1280px) {
      .xl\:h-6 {
        height: 1.5rem;
      }

      .xl\:w-6 {
        width: 1.5rem;
      }

      .xl\:max-w-\[1200px\] {
        max-width: 1200px;
      }

      .xl\:max-w-7xl {
        max-width: 80rem;
      }

      .xl\:gap-8 {
        gap: 2rem;
      }

      .xl\:text-base {
        font-size: 1rem;
        line-height: 1.5rem;
      }
    }

    /* css normalization */
    #search-box input {
      font-family: "IRANSansWeb" !important;
    }

    .search-banner {
      background-image: url(../images/banner-1.jpg);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      height: 550px;
      width: 100%;
      position: relative;
      padding-top: 2em;
    }

    .search-box-container {
      max-width: 1200px !important;
      margin: 0 auto !important;
      gap: 0 !important;
      /* background:white; */
    }

    /* searchbox  */
    .Basis_Calendar {
      font-family: 'DanaFaNum' !important
    }

    .Basis_Calendar .selected_date {
      background: var(--primary-800) !important
    }

    .confirm-date-content button:hover {
      background: var(--secondary-600)
    }

    .confirm-date-content button {
      background: var(--primary-800);
      color: white
    }

    .calendar-apply-date:hover {
      background: var(--secondary-600)
    }

    .calendar-apply-date {
      background: var(--primary-800);
      color: white
    }

    .day.days_available {
      background: var(--secondary-600)
    }

    .calendar-switch {
      color: var(--primary-800)
    }

    .Basis_Calendar .section_next_month,
    .Basis_Calendar .section_prev_month {
      color: var(--primary-800)
    }

    .Basis_Calendar .current_day::after {
      border-color: var(--primary-800) transparent transparent
    }

    .Basis_Calendar .month_day_list table td:not(.disable_day, .empty_day, .expire_day):hover {
      border-color: var(--primary-800)
    }

    .Basis_Calendar .current_day {
      background: var(--primary-800) !important;
      color: white !important
    }

    .Basis_Calendar_Box {
      font-family: 'DanaFaNum' !important;
      margin-top: -3.25rem
    }

    .calendar-apply-date,
    .calendar-switch,
    .calendar-today,
    .calendar-footer input::placeholder {
      font-family: 'DanaFaNum' !important
    }

    .calendar-footer input,
    .calendar-footer::placeholder {
      font-family: 'DanaFaNum'
    }

    /* .search-box-container{border-radius:1em;background-image:linear-gradient(to left,var(--primary),rgba(255,255,255,0));padding:0 1px 1px 0;box-shadow:5px 5px 10px #0000002a} */

    /* #search-box{margin-top:0!important}
#search-box{background:white;padding:1em;border-radius:1em!important} */
    #flightHotelSearch {
      flex-direction: column !important;
      align-items: start !important
    }

    .search-box-container input,
    .search-box-container select,
    .search-box-container button {
      font-family: 'DanaFaNum' !important
    }

    .search-engine-container {
      padding-top: 13rem;
      display: flex;
      justify-content: center
    }

    .module-banner-image img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 405px;
      object-fit: cover;
      border-radius: 24px
    }

    #search-box {
      max-width: 100%;
      padding: 24px 12px 12px
    }

    .search-nav {
      margin-bottom: 0 !important
    }

    .reservation-item {
      grid-template-columns: repeat(10, minmax(0, 1fr));
      display: grid;
      gap: 10px
    }

    /* .reserve-btn{display:flex!important;flex-direction:column;align-items:center;justify-content:center;background-color:#FFFFFF;width:auto!important;
    height:68px!important;margin:0!important;padding:0!important;border-radius:12px;transition:all 300ms ease} */

    .reserve-btn .module-name {
      color: var(--primary-400);
      transition: all 300ms ease
    }

    .reservation-item li {
      border-left: unset !important
    }

    /* .reservation-item li.active-module{border-left:2px solid var(--primary-900)!important} */
    .reservation-item li.active-module {
      background-color: transparent !important;
      color: var(--primary-400) !important;
    }

    /* .active-module{background-color:var(--primary-400)!important;color:white;box-shadow:0 4px 7.7px 0 black40;filter:drop-shadow(5px 5px 10px #0000002a)} */
    /* .active-module .module-name{color:white} */
    .reserve-btn:hover {
      background-color: var(--primary-400);
      box-shadow: 0 4px 7.7px 0 black40
    }

    .reserve-btn:hover .module-name {
      color: white
    }

    .reserve-btn .module-name:hover {
      color: white !important
    }

    .formhotel,
    .formtour,
    .forminsurance,
    #cipSearch,
    .formvisa,
    #serviceSearch,
    .formbus {
      margin-top: 0 !important
    }

    .formtrain .reserve-field.destination-route .click-content,
    .formflight .reserve-field.destination-route .click-content,
    #flightHotelSearch .reserve-field.destination-route .click-content,
    .formbus .reserve-field.departure-route .click-content {
      padding-right: 16px !important;
    }

    .reserve-field.departure-date,
    .click-content,
    .reserve-field.passengers-field,
    .reserve-field.return-date,
    .reserve-field.traveltype-field,
    .reserve-field.flighttype-field,
    .reserve-field.Compartment-field {
      background-color: #FFFFFF !important;
      height: 70px !important;
      border-radius: 0px;
      padding: 4px !important;
      border-left: 2px solid #CCC !important;
    }

    .click-content,
    .reserve-field.departure-date>div:first-of-type,
    .reserve-field.return-date>div:first-of-type {
      display: flex;
      align-items: center
    }

    .reserve-field.departure-date>div:first-of-type,
    .reserve-field.return-date>div:first-of-type {
      padding: 0 !important
    }

    .label-routes .down-icon,
    .label-routes .label-text,
    .label-dates .down-icon,
    .label-dates .label-text,
    .label-passengers .down-icon,
    .label-passengers .label-text,
    .label-flighttype-cip .down-icon,
    .label-flighttype-cip .label-text,
    .label-traveltype-cip .down-icon,
    .label-traveltype-cip .label-text,
    .label-compartment-train .down-icon,
    .label-compartment-train .label-text,
    .reserve-field.departure-route p,
    .reserve-field.destination-route p,
    .reserve-field.departure-date p,
    .reserve-field.return-date p,
    .reserve-search button svg {
      display: none !important
    }

    .label-routes,
    .label-dates,
    .label-passengers {
      width: auto !important
    }

    .reserve-field.flightclass-field {
      display: flex !important;
      align-items: center;
      justify-content: center;
      gap: 8px;
      height: 48px !important;
      padding: 0 12px 0 8px;
      cursor: pointer;
      border: 1px solid #71717a;
      border-radius: 12px 0 0 12px;
      background: transparent !important;
    }

    .flighttype-field.flighttype-dropDown {
      display: flex !important;
      align-items: center;
      justify-content: center;
      gap: 8px;
      height: 48px !important;
      padding: 0 12px 0 8px;
      cursor: pointer;
      border: 1px solid #71717a;
      border-radius: 0 12px 12px 0;
      background: transparent !important;
    }


    .reserve-field.flightclass-field {
      width: 138px !important;
      height: 48px !important;
      position: absolute !important;
      top: -64px;
      right: 162px !important;
    }

    .departure-route-flight>.click-content {
      border-radius: 0 12px 12px 0 !important;
    }

    #flightHotelSearch .reserve-field.flightclass-field {
      right: 0
    }

    .reserve-field.flightclass-field>div:first-of-type {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-direction: row-reverse;
      padding: 0
    }

    #flightHotelSearch .flight-routes {
      margin-top: 0
    }

    #flightHotelSearch {
      padding-top: 4rem
    }

    .reserve-field.flightclass-field>div:first-of-type .clr {
      position: absolute
    }

    .flighttype-field.flighttype-dropDown {
      margin-bottom: 16px;
      width: 163px !important;
      height: 48px !important
    }

    .flighttype-field.flighttype-dropDown .flighttype-field-icon {
      left: 8px;
      display: block !important
    }

    .flighttype-field-icon .down-icon,
    .label-flightclass .down-icon {
      margin-top: 0 !important
    }

    .flighttype-field-icon svg,
    .label-flightclass .down-icon,
    .label-routes svg,
    .label-dates svg,
    .label-passengers svg {
      width: 48px !important;
      height: 48px !important
    }

    .close-passenger-box svg,
    .selectLocation svg {
      width: 32px !important;
      height: 32px !important
    }

    .flighttype-field.flighttype-dropDown .flighttype-dropDown-text {
      margin-bottom: 0 !important;
      height: auto !important;
      font-size: 16px !important
    }

    .label-flightclass>svg:first-of-type,
    .label-flightclass .label-text {
      display: none
    }

    .flight-routes,
    .train-routes {
      flex: 2.5 !important
    }

    .reserve-field.passengers-field {
      flex: 1 !important
    }

    .Basis_Date_Box {
      flex: 1.54 !important
    }

    .formtrain .Basis_Date_Box {
      flex: 1.7 !important
    }

    .formtrain .departure {
      width: 65% !important
    }

    .formflight .departure,
    #flightHotelSearch .departure {
      width: 72% !important
    }

    .reserve-field.departure-route,
    .reserve-field.destination-route {
      flex: 2 !important
    }

    #cipSearch .reserve-field.passengers-field {
      flex: 1.1 !important
    }

    #flightHotelSearch .Flightclass-Passenger,
    .formflight .Flightclass-Passenger {
      flex: 1.1 !important
    }

    .reserve-field.departure-route,
    .reserve-field.destination-route {
      width: 100% !important;
      height: 59px !important
    }

    #cipSearch .Basis_Date_Box,
    #trainSearch .Basis_Date_Box {
      flex-basis: 100%
    }

    .reserve-field.traveltype-field,
    .reserve-field.flighttype-field {
      flex: 1;
      height: 70px !important
    }

    .reserve-field.Compartment-field {
      flex: 1
    }

    .Basis_Date_Box {
      flex: 2
    }

    #hotelSearch .Basis_Date_Box,
    #tourSearch .Basis_Date_Box,
    #insuranceSearch .Basis_Date_Box,
    #serviceSearch .Basis_Date_Box,
    #busSearch .Basis_Date_Box {
      flex-basis: 100%
    }

    .Flightclass-Passenger {
      flex: 1
    }

    .flightclass-in-passengerbox {
      display: none !important
    }

    .Wrapper-ExteraHoteldate {
      width: 60% !important
    }

    .Basis_Date.start_date,
    .Basis_Date.end_date,
    .Basis_Date_ExteraHoteldate {
      position: unset !important;
      padding: 0 !important
    }

    .reserve-field.passengers-field {
      flex: 1
    }

    .reserve-field.passengers-field>div:first-of-type {
      display: flex;
      align-items: center;
      padding: 0
    }

    .exchangeRoute {
      top: 11px !important;
      left: -27px !important;
      background-color: var(--primary-400) !important;
      border-radius: 100%;
      width: 48px !important;
      height: 48px !important;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 !important;
      transition: all 300ms ease;
      transform: rotate(90deg)
    }

    .exchangeRoute:hover {
      background-color: var(--secondary-600) !important
    }

    .reserve-search {
      margin-top: 0;
      height: 70px !important
    }

    .reserve-search button {
      position: relative;
      width: 125px !important;
      background-color: var(--primary-400) !important;
      height: 70px !important;
      color: white !important;
      border-radius: 12px 0 0 12px !important;
      transition: all 300ms ease;
      overflow: hidden
    }


    .reserve-search button span {
      position: relative;
      z-index: 10;
      color: white;
      transition: color .3s ease
    }

    .reserve-search button::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--secondary-600);
      border-radius: inherit;
      transform: translateX(100%) translateY(100%);
      transition: all .3s ease-out
    }

    .reserve-search button:hover::after {
      transform: translateX(0) translateY(0)
    }

    .flighttype-items,
    .FlightClass.hidden-box,
    .traveltype.hidden-box,
    .flighttype.hidden-box,
    .Compartment.hidden-box {
      top: 100%;
      width: 100% !important;
      right: 0;
      background-color: white;
      border: none !important;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px;
      border-radius: 12px !important;
      padding: 8px;
      margin-bottom: 30px !important
    }

    .FlightClass.hidden-box li,
    .traveltype.hidden-box li,
    .flighttype.hidden-box li,
    .Compartment.hidden-box li {
      line-height: 2rem;
      font-size: 1rem;
      text-align: center;
      display: block;
      margin: 4px 0;
      border: unset;
      padding: 2px 6px;
      transition: all 300ms ease
    }

    .active-r-btn,
    .active-FlightClass,
    .active-FlightType,
    .active-TravelType,
    .active-Compartment {
      border-radius: 8px !important;
      background-color: var(--primary-800) !important;
      transition: all 300ms ease
    }

    .active-r-btn span,
    .active-FlightClass,
    .active-FlightType label,
    .active-TravelType label,
    .active-Compartment label {
      color: white !important
    }

    #oneway:hover span,
    #backtoback:hover span,
    #multi:hover span,
    .FlightClass.hidden-box li:hover span,
    .traveltype.hidden-box li:hover label,
    .flighttype.hidden-box li:hover label,
    .Compartment.hidden-box li:hover label {
      color: white !important
    }

    #oneway:hover,
    #backtoback:hover,
    #multi:hover,
    .FlightClass.hidden-box li:hover,
    .traveltype.hidden-box li:hover,
    .flighttype.hidden-box li:hover,
    .Compartment.hidden-box li:hover {
      background-color: var(--primary-800);
      border-radius: 8px !important
    }

    .searchList {
      height: auto !important;
      position: absolute !important;
      width: 254px !important;
      min-width: auto !important;
      border-radius: 8px;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px;
      left: 0;
      max-height: 254px;
      overflow-y: auto
    }

    .multicity-flight-form .searchList {
      width: 350px !important
    }

    .ul-list ul li {
      text-align: center
    }

    .ul-list ul li:first-of-type {
      background-color: var(--primary-800);
      color: white !important
    }

    .ul-list ul li:not(:last-child),
    .locationResult div:not(:last-of-type) {
      border-bottom: 1px solid var(--primary-100)
    }

    .ul-list ul li:hover {
      background-color: var(--primary-800);
      color: white !important;
      transition: all 300ms ease
    }

    .passengerbox.hidden-box {
      width: 310px !important;
      position: absolute !important;
      right: 0;
      left: 0;
      margin: 0;
      padding: 16px !important;
      top: 100%;
      border-radius: 8px;
      overflow-x: hidden !important;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px
    }

    .passenger-item.adult-passenger-item,
    .passenger-item.child-passenger-item,
    .passenger-item.infant-passenger-item,
    .passenger-item.room-passenger-item,
    .passengerbox.hidden-box .passenger-item {
      display: flex;
      justify-content: space-between
    }

    .passenger-item.child-passenger-item ul,
    .passenger-item.adult-passenger-item ul,
    .passenger-item.infant-passenger-item ul,
    .passenger-item.room-passenger-item ul,
    .passengerbox.hidden-box .passenger-item ul {
      height: auto !important;
      line-height: normal !important;
      display: flex;
      align-items: center;
      justify-content: space-between
    }

    .minus-count,
    .plus-count {
      line-height: normal !important;
      width: 24px !important;
      height: 24px !important;
      background: var(--primary-800);
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      border-radius: 4px
    }

    .plus-count .count-icon-simple,
    .minus-count .count-icon-simple {
      color: white;
      font-size: 24px !important
    }

    .plus-count>div,
    .minus-count>div {
      line-height: 27px !important
    }

    .passenger-counts .count {
      min-width: 0 !important
    }

    .confirm-passenger,
    .toggle-calendar {
      display: flex !important;
      align-items: center;
      justify-content: center;
      margin-top: 24px;
      background-color: var(--primary-800) !important;
      color: white;
      border-radius: 8px;
      font-weight: 500;
      height: 40px !important;
      transition: all 300ms ease
    }

    .confirm-passenger:hover,
    .toggle-calendar:hover {
      background-color: var(--secondary-600) !important;
      color: white !important
    }

    .reserve-field.flightclass-field div:first-of-type .clr,
    .passengerbox.hidden-box .clr {
      position: absolute
    }

    .route-container {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      display: grid;
      gap: 24px
    }

    .multi-route-tlt {
      margin-bottom: 8px !important
    }

    .multicity-flight-form .route-minus-btn {
      top: -20px;
      left: 0;
      width: auto !important;
      position: absolute;
      display: flex;
      line-height: normal !important;
      height: auto !important;
      padding-right: 10px !important
    }

    button,
    [role="button"] {
      cursor: pointer
    }

    .multicity-flight-form .route-minus-btn span {
      display: none
    }

    .multicity-flight-form .route-content:first-of-type div.route-minus-btn,
    .multicity-flight-form .route-content:nth-child(2) div.route-minus-btn,
    .remove-routs {
      display: none !important
    }

    .route-content-inner {
      flex-wrap: wrap
    }

    .multicity-flight-form .departure {
      width: 60% !important
    }

    .multicity-flight-form .passengers-field-f {
      width: 352px !important;
      flex: unset
    }

    .multicity-flight-form .reserve-search {
      width: auto !important;
      flex-basis: auto !important;
      margin-top: 0 !important
    }

    .Add-Remove.reserve-field {
      width: 187px !important;
      height: 70px !important;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: var(--primary-100);
      color: var(--primary-800);
      border-radius: 12px;
      transition: all 300ms ease;
      cursor: pointer
    }

    .Add-Remove.reserve-field:hover {
      background-color: var(--primary-800)
    }

    .multiroute-fields {
      align-items: center
    }

    .add-routs {
      width: 100% !important;
      font-size: 12px !important;
      font-weight: 500;
      transition: all 300ms ease
    }

    .add-routs:hover {
      color: white
    }

    .addroute-icon {
      display: none
    }

    .deleteRoom {
      color: red
    }

    .passenger-birthday-dropdown li {
      font-size: 12px
    }

    .selectLocation {
      display: flex;
      align-items: center;
      width: 100% !important;
      padding: 4px 0
    }

    .selectLocation .parent-item,
    .selectLocation .child-item {
      display: flex;
      align-items: center
    }

    .createChildDropdown {
      float: unset !important
    }

    .createChildDropdown .select-age {
      border: 1px solid var(--primary-400);
      border-radius: 8px;
      outline: none;
      height: 40px !important;
      float: unset !important
    }

    .createChildDropdown label {
      float: unset !important
    }

    .contentRoom {
      border-top: 1px solid var(--primary-100);
      padding-top: 8px
    }

    .birthdate-day-value,
    .birthdate-month-value,
    .birthdate-year-value {
      border: 1px solid #737373 !important;
      border-radius: 8px;
      margin-top: .5rem;
      font-size: 12px
    }

    .search-box-container .birthdate-dates div::after {
      top: 14px !important
    }

    .createPassengerDropdown {
      margin-top: .5rem
    }

    .traintype-items {
      width: fit-content !important;
      background-color: var(--primary-50);
      border-radius: 8px;
      padding: 8px;
      margin-bottom: 16px !important
    }

    .traintype-items li {
      padding: 4px;
      border-radius: 8px;
      transition: all 300ms ease
    }

    .traintype-items li:hover {
      background-color: var(--primary-800)
    }

    .traintype-items li:hover span {
      color: white !important
    }

    #busSearch .reserve-field.departure-date,
    #busSearch .reserve-field.return-date {
      flex: 1
    }

    .close-passenger-box {
      width: auto !important;
      height: auto !important
    }

    .Compartment-field .border-type-1.cursor-pointer.h-full.rounded-type-1.px-2,
    .traveltype-field .border-type-1.cursor-pointer.h-full.rounded-type-1.px-2,
    .flighttype-field .border-type-1.cursor-pointer.h-full.rounded-type-1.px-2 {
      display: flex;
      justify-content: start;
      align-items: center
    }

    label.label-traveltype>svg,
    label.label-compartment-train>svg {
      min-width: 24px;
      min-height: 24px;
      transform: scale(1);
      transform-origin: center
    }

    label.label-flighttype-cip>svg {
      min-width: 24px;
      min-height: 24px;
      transform: scale(2);
      transform-origin: center
    }

    label.w-full {
      width: 39px !important
    }

    .banner-searchBox {
      background-image: url(../images/banner-searchBox-tem4.jpg);
      height: 450px;
      padding-top: 0 !important;
      position: initial
    }

    .searchHistory-content {
      margin-top: 2em !important
    }

    *.reservation-item img,
    .reservation-item svg {
      margin-right: 0 !important;
      vertical-align: middle;
      fill: #141111;
      stroke: #989898;
      stroke-width: .7
    }

    .reserve-btn:hover .module-icon-active {
      color: #fff !important;
      fill: currentColor !important;
      stroke: currentColor !important;
      filter: invert(0) brightness(2) contrast(1) !important
    }

    .active-module .module-icon-active {
      color: #274494 !important;
      fill: #274494 !important;
      stroke: #274494 !important;
      filter: invert(0) brightness(2) contrast(1) !important
    }


    .searchList ul {
      overflow-y: auto;
      height: auto !important
    }

    .search-box-container .add-routs.deactive-addmc:hover {
      color: var(--neutral-100) !important;
      color: white !important;
      cursor: not-allowed
    }

    .Add-Remove:has(.deactive-addmc) {
      background: var(--neutral-100) !important;
      color: white !important
    }

    .deactive-addmc:hover {
      background-color: unset !important;
      border-color: var(--neutral-100) !important;
      color: white !important;
      cursor: not-allowed;
      background: unset !important;
      opacity: 1 !important
    }

    .deactive-addmc {
      background-color: unset !important;
      border-color: var(--neutral-100) !important;
      color: white !important;
      cursor: not-allowed;
      background: unset !important;
      opacity: 1 !important
    }

    .search-box-container .add-routs.deactive-addmc:hover {
      color: white !important
    }

    .search-box-container .add-routs.deactive-addmc.text-primary {
      color: white !important
    }

    .searchList ul li:not(:first-child):hover {
      background: var(--primary-400)
    }

    .search-box-container input.bg-bgColor-100 {
      background-color: white !important
    }

    .search-box-container.mobile-search-box .module-form .close-module-form {
      display: none !important
    }

    .book-border {
      border: 1px solid rgb(228 228 231) !important
    }

    .book-border-zinc-200 {
      --tw-border-opacity: 1 !important;
      border-color: rgb(228 228 231 / var(--tw-border-opacity, 1)) !important
    }

    .searchList .flex.relative.mb-2.float-right.w-full.clear-both.rounded-lg.bg-bgColor-100 {
      background: unset !important
    }

    .bg-primary {
      background: var(--primary)
    }

    .mobile-search-box.search-box-container {
      margin-top: 40px !important
    }

    .mobile-search-box .reservation-item {
      width: 100% !important
    }

    .mobile-search-box .Basis_Calendar {
      font-family: 'DanaFaNum' !important
    }

    .mobile-search-box .Basis_Calendar .selected_date {
      background: var(--primary-800) !important
    }

    .mobile-search-box .confirm-date-content button:hover {
      background: var(--secondary-600)
    }

    .mobile-search-box .confirm-date-content button {
      background: var(--primary-800);
      color: #fff
    }

    .mobile-search-box .calendar-apply-date:hover {
      background: var(--secondary-600)
    }

    .mobile-search-box .calendar-apply-date {
      background: var(--primary-800);
      color: #fff
    }

    .mobile-search-box .day.days_available {
      background: var(--secondary-600)
    }

    .mobile-search-box .calendar-switch {
      color: var(--primary-800)
    }

    .mobile-search-box .Basis_Calendar .section_next_month,
    .mobile-search-box .Basis_Calendar .section_prev_month {
      color: var(--primary-800)
    }

    .mobile-search-box .Basis_Calendar .current_day::after {
      border-color: var(--primary-800) transparent transparent
    }

    .mobile-search-box .Basis_Calendar .month_day_list table td:not(.disable_day, .empty_day, .expire_day):hover {
      border-color: var(--primary-800)
    }

    .mobile-search-box .Basis_Calendar .current_day {
      background: var(--primary-800) !important;
      color: #fff !important
    }

    .mobile-search-box .Basis_Calendar_Box {
      font-family: 'DanaFaNum' !important
    }

    .mobile-search-box .calendar-apply-date,
    .mobile-search-box .calendar-switch,
    .mobile-search-box .calendar-today,
    .mobile-search-box .calendar-footer input::placeholder {
      font-family: 'DanaFaNum' !important
    }

    .mobile-search-box .calendar-footer input,
    .mobile-search-box .calendar-footer::placeholder {
      font-family: 'DanaFaNum'
    }

    .mobile-search-box .search-box-container input,
    .mobile-search-box .search-box-container select,
    .mobile-search-box .search-box-container button {
      font-family: 'DanaFaNum' !important
    }

    .mobile-search-box .module-banner-image img {
      width: 100%;
      height: 12rem;
      object-fit: cover;
      border-radius: 24px
    }

    .mobile-search-box #search-box {
      padding: 12px
    }

    .mobile-search-box .search-nav {
      margin-bottom: 24px !important
    }

    .mobile-search-box .reservation-item {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
      gap: 10px 4px !important
    }

    .mobile-search-box .reserve-btn {
      display: flex !important;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      grid-column: span 2;
      background-color: #FFFFFF;
      height: 60px !important;
      margin: 0 !important;
      padding: 0 !important;
      border-radius: 12px;
      transition: all 300ms ease
    }

    .mobile-search-box .reserve-btn:last-child:nth-child(3n + 1) {
      grid-column: 1 / -1
    }

    .mobile-search-box .reserve-btn:nth-last-child(2):nth-child(3n + 1),
    .mobile-search-box .reserve-btn:nth-last-child(1):nth-child(3n + 2) {
      grid-column: span 3
    }

    .mobile-search-box .reserve-btn .module-name {
      color: #52525b;
      transition: all 300ms ease
    }

    .mobile-search-box .active-module {
      background-color: var(--primary-800) !important;
      color: white;
      box-shadow: 0 4px 7.7px 0 #00000040
    }

    .mobile-search-box .active-module .module-name {
      color: white
    }

    .mobile-search-box .reserve-btn:hover {
      background-color: var(--primary-800);
      box-shadow: 0 4px 7.7px 0 #00000040
    }

    .mobile-search-box .reserve-btn:hover .module-name {
      color: #ffffff
    }

    .mobile-search-box .reserve-btn .module-name:hover {
      color: #ffffff !important
    }

    .mobile-search-box .reserve-field.departure-date,
    .mobile-search-box .click-content,
    .mobile-search-box .reserve-field.passengers-field,
    .mobile-search-box .reserve-field.return-date,
    .mobile-search-box .reserve-field.traveltype-field,
    .mobile-search-box .reserve-field.flighttype-field,
    .mobile-search-box .reserve-field.Compartment-field {
      background-color: #FFFFFF !important;
      width: 100% !important;
      height: 70px !important;
      border-radius: 12px;
      padding: 4px !important
    }

    .mobile-search-box .click-content,
    .mobile-search-box .reserve-field.departure-date>div:first-of-type,
    .mobile-search-box .reserve-field.return-date>div:first-of-type {
      display: flex;
      align-items: center
    }

    .mobile-search-box .reserve-field.departure-date>div:first-of-type,
    .mobile-search-box .reserve-field.return-date>div:first-of-type {
      padding: 0 !important
    }

    .mobile-search-box .label-routes .down-icon,
    .mobile-search-box .label-routes .label-text,
    .mobile-search-box .label-dates .down-icon,
    .mobile-search-box .label-dates .label-text,
    .mobile-search-box .label-passengers .down-icon,
    .mobile-search-box .label-passengers .label-text,
    .mobile-search-box .label-flighttype-cip .down-icon,
    .mobile-search-box .label-flighttype-cip .label-text,
    .mobile-search-box .label-traveltype-cip .down-icon,
    .mobile-search-box .label-traveltype-cip .label-text,
    .mobile-search-box .label-compartment-train .down-icon,
    .mobile-search-box .label-compartment-train .label-text,
    .mobile-search-box .reserve-field.departure-route p,
    .mobile-search-box .reserve-field.destination-route p,
    .mobile-search-box .reserve-field.departure-date p,
    .mobile-search-box .reserve-field.return-date p,
    .mobile-search-box .reserve-search button svg {
      display: none !important
    }

    .mobile-search-box .label-routes,
    .mobile-search-box .label-dates,
    .mobile-search-box .label-passengers {
      width: auto !important
    }

    .mobile-search-box .flighttype-field.flighttype-dropDown,
    .mobile-search-box .reserve-field.flightclass-field {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      height: 48px !important;
      padding: 0 12px 0 8px;
      cursor: pointer;
      border: 1px solid #71717a;
      border-radius: 12px;
      background-color: #fff
    }

    .mobile-search-box .flighttype-field.flighttype-dropDown {
      margin-bottom: 24px;
      width: 136px !important;
      height: 48px !important
    }

    .mobile-search-box .flighttype-field.flighttype-dropDown .flighttype-field-icon {
      margin-left: 8px !important;
      display: block !important
    }

    .mobile-search-box .flighttype-field.flighttype-dropDown .flighttype-dropDown-text {
      margin-bottom: 0 !important;
      height: auto !important
    }

    .mobile-search-box .flighttype-dropDown-text,
    .mobile-search-box .FlightClass-text {
      font-size: 12px !important
    }

    .mobile-search-box .flighttype-field-icon .down-icon,
    .mobile-search-box .label-flightclass .down-icon {
      margin-top: 0 !important
    }

    .mobile-search-box .flighttype-field-icon svg,
    .mobile-search-box .label-flightclass .down-icon,
    .mobile-search-box .label-routes svg,
    .mobile-search-box .label-dates svg,
    .mobile-search-box .label-passengers svg,
    .mobile-search-box .close-searchList svg {
      width: 48px !important;
      height: 48px !important
    }

    .mobile-search-box .close-passenger-box svg {
      width: 24px !important;
      height: 24px !important
    }

    .exchangeRoute svg,
    .removeroute-icon {
      width: 24px !important;
      height: 24px !important;
      transform: scale(1);
      transform-origin: center
    }

    .mobile-search-box .selectLocation svg {
      width: 32px !important;
      height: 32px !important
    }

    .mobile-search-box .exchangeRoute svg,
    .mobile-search-box .removeroute-icon {
      width: 24px !important;
      height: 24px !important
    }

    .mobile-search-box .r-bus .label-routes.label-departure-bus svg {
      width: 53px !important
    }

    .mobile-search-box .label-routes.label-departure-train svg {
      width: 43px !important;
      transform: scale(1.1) !important
    }

    .mobile-search-box .reserve-field.flightclass-field {
      display: block !important;
      width: 120px !important;
      height: 48px !important;
      position: absolute !important;
      top: -72px;
      right: 9rem
    }

    .mobile-search-box #flightHotelSearch .reserve-field.flightclass-field {
      right: 0
    }

    .mobile-search-box .reserve-field.flightclass-field>div:first-of-type {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-direction: row-reverse;
      padding: 0
    }

    .mobile-search-box .reserve-field.flightclass-field>div:first-of-type .clr {
      position: absolute
    }

    .mobile-search-box .label-flightclass>svg:first-of-type,
    .mobile-search-box .label-flightclass .label-text {
      display: none
    }

    .mobile-search-box .form-search,
    .mobile-search-box #flightHotelSearch>div:first-of-type,
    .mobile-search-box #trainSearch>div:first-of-type {
      flex-wrap: wrap
    }

    .mobile-search-box #flightSearch {
      position: relative
    }

    .mobile-search-box #flightHotelSearch .flight-routes {
      margin-top: 72px
    }

    .mobile-search-box .reserve-field.departure-route,
    .mobile-search-box .reserve-field.destination-route {
      width: 100% !important;
      height: 70px !important;
      margin-bottom: 8px !important
    }

    .mobile-search-box #cipSearch .Basis_Date_Box,
    .mobile-search-box #trainSearch .Basis_Date_Box {
      flex-basis: 100%
    }

    .mobile-search-box .reserve-field.traveltype-field,
    .mobile-search-box .reserve-field.flighttype-field {
      margin-bottom: 8px !important;
      height: 70px !important
    }

    .mobile-search-box .reserve-field.Compartment-field {
      margin-bottom: 8px !important
    }

    .mobile-search-box .Basis_Date_Box {
      margin-bottom: 8px !important;
      flex-direction: column
    }

    .mobile-search-box #hotelSearch .Basis_Date_Box,
    .mobile-search-box #tourSearch .Basis_Date_Box,
    .mobile-search-box #insuranceSearch .Basis_Date_Box,
    .mobile-search-box #serviceSearch .Basis_Date_Box,
    .mobile-search-box #busSearch .Basis_Date_Box {
      flex-basis: 100%
    }

    .mobile-search-box .Flightclass-Passenger {
      flex: 1
    }

    .mobile-search-box .flightclass-in-passengerbox {
      display: none !important
    }

    .mobile-search-box .Basis_Date.start_date,
    .mobile-search-box .Basis_Date.end_date,
    .mobile-search-box .Basis_Date_ExteraHoteldate {
      position: unset !important;
      padding: 0 !important
    }

    .mobile-search-box .reserve-field.passengers-field {
      margin-bottom: 12px !important
    }

    .mobile-search-box .reserve-field.passengers-field>div:first-of-type {
      display: flex;
      align-items: center;
      padding: 0
    }

    .mobile-search-box .exchangeRoute {
      top: 55px !important;
      left: 20px !important;
      background-color: var(--primary-800) !important;
      border-radius: 100%;
      width: 40px !important;
      height: 40px !important;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 !important;
      transform: rotate(0) !important
    }

    .mobile-search-box .reserve-search {
      flex-basis: 100%;
      margin-top: 16px;
      height: auto !important
    }

    .mobile-search-box .reserve-search button {
      position: relative;
      width: 100% !important;
      background-color: var(--primary-800) !important;
      height: 48px !important;
      color: white !important;
      margin-top: 0 !important;
      margin-left: 0 !important;
      border-radius: 12px;
      transition: all 300ms ease;
      overflow: hidden
    }

    .mobile-search-box .reserve-search button span {
      position: relative;
      z-index: 10;
      color: #fff;
      transition: color .3s ease
    }

    .mobile-search-box .reserve-search button::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--secondary-900);
      border-radius: inherit;
      transform: translateX(100%) translateY(100%);
      transition: all .3s ease-out
    }

    .mobile-search-box .reserve-search button:hover::after {
      transform: translateX(0) translateY(0)
    }

    .mobile-search-box .flighttype-items,
    .mobile-search-box .FlightClass.hidden-box,
    .mobile-search-box .traveltype.hidden-box,
    .mobile-search-box .flighttype.hidden-box,
    .mobile-search-box .Compartment.hidden-box {
      z-index: 50 !important;
      background-color: #fff;
      border: none !important;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px;
      border-radius: 8px;
      padding: 8px;
      margin-bottom: 30px !important
    }

    .mobile-search-box .FlightClass.hidden-box ul,
    .mobile-search-box .traveltype.hidden-box ul,
    .mobile-search-box .flighttype.hidden-box ul,
    .mobile-search-box .Compartment.hidden-box ul {
      clear: both
    }

    .mobile-search-box .FlightClass.hidden-box li,
    .mobile-search-box .traveltype.hidden-box ul li,
    .mobile-search-box .flighttype.hidden-box ul li,
    .mobile-search-box .Compartment.hidden-box ul li {
      line-height: 2rem;
      font-size: 1rem;
      text-align: center;
      display: block;
      margin: 4px 0;
      border: unset;
      padding: 8px 4px !important;
      transition: all 300ms ease
    }

    .mobile-search-box .active-r-btn,
    .mobile-search-box .active-FlightClass,
    .mobile-search-box .active-TravelType,
    .mobile-search-box .active-FlightType,
    .mobile-search-box .active-Compartment {
      border-radius: 8px !important;
      background-color: var(--primary-800) !important;
      transition: all 300ms ease
    }

    .mobile-search-box .active-r-btn span,
    .mobile-search-box .active-FlightClass span,
    .mobile-search-box .active-TravelType label,
    .mobile-search-box .active-FlightType label,
    .mobile-search-box .active-Compartment label {
      color: #ffffff !important
    }

    .mobile-search-box #oneway:hover span,
    .mobile-search-box #backtoback:hover span,
    .mobile-search-box #multi:hover span,
    .mobile-search-box .FlightClass.hidden-box li:hover span {
      color: white !important
    }

    .mobile-search-box #oneway:hover,
    .mobile-search-box #backtoback:hover,
    .mobile-search-box #multi:hover,
    .mobile-search-box .FlightClass.hidden-box li:hover {
      background-color: var(--primary-800);
      border-radius: 8px !important
    }

    .mobile-search-box .searchList {
      border-radius: 8px;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px;
      overflow-y: auto
    }

    .mobile-search-box .multicity-flight-form .searchList {
      width: 100% !important
    }

    .mobile-search-box .ul-list ul li {
      text-align: center !important
    }

    .mobile-search-box .ul-list ul li:first-of-type {
      background-color: var(--primary-800);
      color: white !important;
      border-radius: 4px;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px
    }

    .mobile-search-box .ul-list ul li:not(:last-child),
    .mobile-search-box .locationResult div:not(:last-of-type) {
      border-bottom: 1px solid var(--primary-100)
    }

    .mobile-search-box .ul-list ul li:hover {
      background-color: var(--primary-800);
      color: white !important;
      transition: all 300ms ease
    }

    .mobile-search-box .passengerbox.hidden-box {
      z-index: 5000000 !important;
      margin: 0;
      padding: 16px !important;
      top: 100%;
      border-radius: 0 !important;
      width: 100% !important;
      border-radius: 8px;
      overflow-x: hidden !important;
      box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px
    }

    .mobile-search-box .flighttype-items-ul li {
      text-align: center !important;
      padding: 8px 4px !important
    }

    .mobile-search-box .passenger-item.adult-passenger-item,
    .mobile-search-box .passenger-item.child-passenger-item,
    .mobile-search-box .passenger-item.infant-passenger-item,
    .mobile-search-box .passenger-item.room-passenger-item,
    .mobile-search-box .passengerbox.hidden-box .passenger-item {
      display: flex;
      justify-content: space-between
    }

    .mobile-search-box .passenger-item.child-passenger-item ul,
    .mobile-search-box .passenger-item.adult-passenger-item ul,
    .mobile-search-box .passenger-item.infant-passenger-item ul,
    .mobile-search-box .passenger-item.room-passenger-item ul,
    .mobile-search-box .passengerbox.hidden-box .passenger-item ul {
      height: auto !important;
      line-height: normal !important;
      display: flex;
      align-items: center;
      justify-content: space-between
    }

    .mobile-search-box .minus-count,
    .mobile-search-box .plus-count {
      line-height: normal !important;
      width: 24px !important;
      height: 24px !important;
      background: var(--primary-800);
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      border-radius: 4px
    }

    .mobile-search-box .plus-count .count-icon-simple,
    .mobile-search-box .minus-count .count-icon-simple {
      color: #fff;
      font-size: 24px !important
    }

    .mobile-search-box .plus-count>div,
    .mobile-search-box .minus-count>div {
      line-height: 27px !important
    }

    .mobile-search-box .confirm-passenger,
    .mobile-search-box .toggle-calendar {
      display: flex !important;
      align-items: center;
      justify-content: center;
      margin-top: 24px;
      background-color: var(--primary-800) !important;
      color: white;
      border-radius: 8px;
      font-weight: 500;
      height: 40px !important;
      transition: all 300ms ease
    }

    .mobile-search-box .confirm-passenger:hover,
    .mobile-search-box .toggle-calendar:hover {
      background-color: var(--secondary-900) !important;
      color: white !important
    }

    .mobile-search-box .reserve-field.flightclass-field div:first-of-type .clr,
    .mobile-search-box .passengerbox.hidden-box .clr {
      position: absolute
    }

    .mobile-search-box .multi-route-tlt {
      margin-bottom: 20px !important
    }

    .mobile-search-box .multicity-flight-form .route-minus-btn {
      top: 0;
      left: 0;
      width: auto !important;
      position: absolute;
      display: flex;
      line-height: normal !important
    }

    .mobile-search-box .multicity-flight-form .route-content:first-of-type div.route-minus-btn,
    .mobile-search-box .multicity-flight-form .route-content:nth-child(2) div.route-minus-btn,
    .mobile-search-box .remove-routs,
    .mobile-search-box .multicity-flight-form .route-minus-btn span {
      display: none !important
    }

    .mobile-search-box .route-content-inner {
      flex-wrap: wrap
    }

    .mobile-search-box .multicity-flight-form .reserve-search {
      width: auto !important;
      flex-basis: auto !important;
      margin-top: 0 !important
    }

    .mobile-search-box .Add-Remove.reserve-field {
      width: 100% !important;
      height: 48px !important;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: var(--primary-100);
      color: var(--primary-800);
      border-radius: 12px;
      transition: all 300ms ease;
      cursor: pointer
    }

    .mobile-search-box .multiroute-fields {
      align-items: center
    }

    .mobile-search-box .add-routs {
      width: 100% !important;
      font-size: 16px !important;
      font-weight: 500;
      transition: all 300ms ease
    }

    .mobile-search-box .add-routs:hover {
      color: white
    }

    .mobile-search-box .deleteRoom {
      color: red;
    }

    .mobile-search-box .addroute-icon,
    .mobile-search-box .close-module-form {
      display: none
    }

    .mobile-search-box .passenger-birthday-dropdown li {
      font-size: 12px
    }

    .mobile-search-box .selectLocation {
      display: flex;
      align-items: center;
      width: 100% !important;
      padding: 4px 0
    }

    .mobile-search-box .selectLocation .parent-item,
    .mobile-search-box .selectLocation .child-item {
      display: flex;
      align-items: center
    }

    .mobile-search-box .createChildDropdown {
      float: unset !important
    }

    .mobile-search-box .createChildDropdown .select-age {
      border: 1px solid var(--primary-400);
      background: unset !important;
      border-radius: 8px;
      outline: none;
      height: 40px !important;
      float: unset !important
    }

    .mobile-search-box .createChildDropdown label {
      float: unset !important
    }

    .search-box-container input.bg-bgColor-100,
    .search-box-container select.bg-bgColor-100 {
      background: transparent !important
    }

    .mobile-search-box .contentRoom {
      border-top: 1px solid var(--primary-100);
      padding-top: 8px
    }

    .mobile-search-box .birthdate-day-value,
    .mobile-search-box .birthdate-month-value,
    .mobile-search-box .birthdate-year-value {
      border: 1px solid var(--primary-300) !important;
      border-radius: 8px;
      margin-top: .5rem;
      font-size: 12px
    }

    .mobile-search-box .search-box-container .birthdate-dates div::after {
      top: 14px !important
    }

    .mobile-search-box .createPassengerDropdown {
      margin-top: .5rem
    }

    .mobile-search-box .traintype-items {
      width: fit-content !important;
      background-color: var(--primary-50);
      border-radius: 8px;
      padding: 8px;
      margin-bottom: 20px !important
    }

    .mobile-search-box .traintype-items li {
      padding: 4px;
      border-radius: 8px;
      transition: all 300ms ease
    }

    .mobile-search-box .traintype-items li:hover {
      background-color: var(--primary-800)
    }

    .mobile-search-box .traintype-items li:hover span {
      color: white !important
    }

    .mobile-search-box #busSearch .reserve-field.departure-date,
    .mobile-search-box #busSearch .reserve-field.return-date {
      flex: 1
    }

    .mobile-search-box .close-passenger-box {
      width: auto !important;
      height: auto !important
    }

    .mobile-search-box .close-searchList {
      width: auto !important;
      height: auto !important
    }

    .mobile-search-box .searchHistory-content {
      width: 100% !important;
      margin: 1em !important
    }

    .Add-Remove>.h-full,
    .Add-Remove>.h-full>button {
      width: 100% !important
    }

    .mobile-search-box .flighttype-field.flighttype-dropDown .flighttype-dropDown-text {
      font-size: 12px !important
    }

    .mobile-search-box #flightHotelSearch {
      padding-top: 0 !important
    }

    .mobile-search-box .Wrapper-ExteraHoteldate {
      width: 100% !important
    }

    .search-box-container.mobile-search-box .fixed-FlightClass,
    .search-box-container.mobile-search-box .fixed-traveltype,
    .search-box-container.mobile-search-box .fixed-flighttype,
    .search-box-container.mobile-search-box .fixed-Compartment,
    .search-box-container.mobile-search-box .fixed-Dropdownflighttype {
      border-radius: 0 !important
    }

    .search-box-container.mobile-search-box .fixed-searchList {
      right: 0 !important;
      left: 0 !important;
      width: 100% !important;
      position: fixed !important;
      top: 0 !important;
      bottom: 0 !important;
      transition: right .5s ease !important;
      background-color: #fff !important;
      height: 100% !important;
      border-radius: 0 !important;
      max-height: unset !important;
      max-width: unset !important;
      z-index: 9999999 !important
    }

    .mobile-search-box .formtrain .reserve-field.destination-route .click-content,
    .mobile-search-box .formflight .reserve-field.destination-route .click-content,
    .mobile-search-box #flightHotelSearch .reserve-field.destination-route .click-content,
    .mobile-search-box .formbus .reserve-field.departure-route .click-content {
      padding-right: 0 !important
    }

    .mobile-search-box .route-container {
      grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
      display: grid;
      gap: 24px
    }

    .search-box-container.mobile-search-box .fixed-FlightClass,
    .search-box-container.mobile-search-box .fixed-traveltype,
    .search-box-container.mobile-search-box .fixed-flighttype,
    .search-box-container.mobile-search-box .fixed-Compartment,
    .search-box-container.mobile-search-box .fixed-Dropdownflighttype {
      z-index: 9999999 !important
    }

    .search-box-container.mobile-search-box .fixed-searchList ul:first-child {
      border-bottom: none !important
    }

    .form-search {
      margin: 0 !important
    }

    .searchHistory-content .sub-title svg {
      display: none
    }

    @media (min-width:1024px) {
      .passenger-birthday-dropdown {
        z-index: 99 !important
      }

      #search-box-banner-image {
        position: relative !important;
        padding: 174px 0 !important
      }

      .search-box-container {
        position: relative !important;
        z-index: 20 !important
      }

      .Add-Remove:has(.deactive-addmc):hover {
        background: var(--neutral-100) !important;
        color: white !important
      }

      .searchHistory-content {
        position: relative !important;
        z-index: 10 !important
      }

      .Add-Remove:has(.deactive-addmc) {
        background-color: var(--primary-300) !important
      }

      .Add-Remove.reserve-field:hover .add-routs {
        color: white
      }
    }

    @media not all and (min-width:1024px) {
      .passenger-birthday-dropdown {
        z-index: 999999999 !important
      }

      .Add-Remove.reserve-field:hover .add-routs {
        color: var(--primary) !important
      }

      .Add-Remove:has(.deactive-addmc) {
        background-color: var(--primary-100) !important;
        opacity: .4
      }

      #search-box-banner-image {
        position: relative !important;
        padding: 70px 16px !important
      }

      #search-box-banner-image {
        display: flex !important;
        flex-direction: column !important
      }
    }

    @media (max-width:750px) {
      .mobile-search-box .reservation-item li {
        border: unset !important
      }
    }

    .formtrain {
      flex-direction: column !important
    }

    .minus-count div,
    .plus-count div,
    .minus-count div span.count-icon-simple,
    .plus-count div span.count-icon-simple {
      height: 100% !important;
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center
    }

    .minus-count div span.count-icon-simple,
    .plus-count div span.count-icon-simple {
      padding-top: 5px !important
    }

    .searchList ul {
      max-height: unset !important
    }

    .Compartment-text {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 1;
      overflow: hidden
    }

    /* .flight-banner-background{background-image: url('../images/search-bg-flight.jpg') !important;}
.hotel-banner-background{background-image: url('../images/search-bg-hotel.jpg') !important;}
.flighthotel-banner-background{background-image: url('../images/search-bg-flighthotel.jpg') !important;}
.cip-banner-background{background-image: url('../images/search-bg-cip.jpg') !important;}
.insurance-banner-background{background-image: url('../images/search-bg-insurance.jpg') !important;}
.visa-banner-background{background-image: url('../images/search-bg-visa.jpg') !important;}
.service-banner-background{background-image: url('../images/search-bg-service.jpg') !important;}
.train-banner-background{background-image: url('../images/search-bg-train.jpg') !important;}
.bus-banner-background{background-image: url('../images/search-bg-bus.jpg') !important;} */
    #search-box-banner-image .module-banner-background {
      z-index: -1 !important;
      width: 100% !important;
      height: 100% !important;
      background-position: center;
      background-size: cover;
      position: absolute !important;
      left: 0;
      top: 0
    }



    #flightSearch {
      gap: 0 !important;
      padding: 0 !important;
      filter: drop-shadow(-4px 2px 7px #b5b5b5);
    }

    .date__searched__container.Basis_Date_Box.w-1\/5.flex.gap-2.max-xl\:w-full.max-xl\:mb-4,
    .flight-routes.w-2\/5.flex.gap-2.max-xl\:w-full.max-xl\:block.max-xl\:gap-0 {
      gap: 0 !important;
    }



    .block {
      display: block;
    }

    .inline-block {
      display: inline-block;
    }

    .inline {
      display: inline;
    }

    .flex {
      display: flex;
    }

    .contents {
      display: contents;
    }

    .hidden {
      display: none;
    }




    .search-box-container .flighttype-dropDown .flighttype-items li {
      /* height: 2em !important; */
      line-height: 2rem;
      text-align: center !important;
      display: block;
      margin: 4px 0;
      border: unset;
      padding: 2px 6px;
      transition: all 300ms ease;

    }

    .search-box-container .flighttype-dropDown .flighttype-items li#multi {
      display: none !important;
    }

    .search-box-container .flighttype-dropDown .flighttype-items li>label>span,
    .search-box-container .FlightClass li>label>span.flightclass-fa {
      line-height: 2em !important;
      display: block !important;
    }

    .flighttype-items,
    .FlightClass.hidden-box,
    .traveltype.hidden-box,
    .flighttype.hidden-box,
    .Compartment.hidden-box {
      border-radius: 12px !important;
    }


    .passengerbox input[type='text'] {
      line-height: 2.25rem !important;
    }


    @media (max-width: 1023px) {
      #flightSearch {
        filter: none !important;
      }

      .reserve-field.departure-date,
      .click-content,
      .reserve-field.passengers-field,
      .reserve-field.return-date,
      .reserve-field.traveltype-field,
      .reserve-field.flighttype-field,
      .reserve-field.Compartment-field {
        border-left: none !important;
      }


      .search-banner {
        height: 800px;
      }

      .reserve-search button {
        border-radius: 12px !important;
      }

      .departure-route-flight>.click-content {
        border-radius: 12px !important;
      }

      .search-box-container .reserve-btn.active-module {
        background-color: var(--primary-800) !important;
        color: #fff !important;
      }


    }


    /* searchbox  */