@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');

:root {
  /* Changes to Major version include renaming or deletion of variables.
   Changes to Minor version include addition of new variables.
   Changes to Revision version include variable value changes. */
  --Version-Number: 2.1;

  /* global styles variables */
  --font-family: 'Montserrat', sans-serif;
  --lightest: #fff;
  --light: #eee;
  --medium: #C4C4C4;
  --dark: #444;
  --darkest: #111e40;
  --body-background: var(--lightest);
  --body-color: var(--light);
  --body-font-weight: 400;
  --headings-font-weight: 600;

  --primary: #111e40;
  --primary-hover: #1b3168;
  --primary-contrast: #052474;
  --primary-inverse: var(--lightest);

  --secondary: #c49104;
  --secondary-hover: #daa105;
  --secondary-contrast: #a07705;
  --secondary-inverse: var(--lightest);

  --info: #444;
  --info-hover: rgb(100, 99, 99);
  --info-contrast: rgb(100, 99, 99);
  --info-inverse: var(--lightest);

  --highlight: #ffffff;
  --highlight-hover: #ececec;
  --highlight-contrast: #ececec;
  --highlight-inverse: var(--darkest);

  --success: #28a745;
  --danger: #dc3545;
  --warning: #ffc107;
  --dark: #343a40;
  --white: #fff;
  --bs-secondary-color: rgba(33, 37, 41, 1) !important;
}

/* ------- PER CLIENT CUSTOMIZATION ------- */

/* Assign Font to document */
html,
body {
  font-family: var(--font-family) !important;
  font-weight: var(--body-font-weight) !important;
}

/* Mapping needed when google font does not correspond */
h1,
.h1 {
  font-weight: var(--headings-font-weight) !important;
}

h2,
.h2 {
  font-weight: var(--headings-font-weight) !important;
}

h3,
.h3 {
  font-weight: var(--headings-font-weight) !important;
}

h4,
.h4 {
  font-weight: var(--headings-font-weight) !important;
}

h5,
.h5 {
  font-weight: var(--headings-font-weight) !important;
}

h6,
.h6 {
  font-weight: var(--headings-font-weight) !important;
}

/* Logo sizing specific to brand */
a.navbar-brand img {
  width: 8.4375rem;
}

/* AmeliaRes Logo Style */
.page-footer img.amelia-logo {
  width: 4.75rem;
}

/* Client Customizations */

app-trip-type-picker label.btn-outline-primary,
app-person-title-picker label.btn-outline-primary {
  background-color: var(--lightest);
  border-color: #ced4da !important;
}

.navbar-dark .navbar-text a {
  color: var(--darkest) !important;
}

#cartVisibilityController {
  border-color: var(--darkest) !important;
}

app-site-header.bg-primary {
  background-color: var(--lightest) !important;
  color: var(--darkest) !important;
}

app-journey-fares-item .fare--selection-column button {
  border-color: var(--secondary) !important;
  background-color: var(--secondary) !important;
}

app-journey-fares-item .fare--selection-column button.btn-outline-medium {
  color: var(--lightest) !important;
}


app-seats-selection .passenger--row .bg-info.btn,
app-seats-selection .leg-action button.btn.btn-info {
  color: var(--lightest) !important;
  background-color: var(--secondary) !important;
  border-color: var(--secondary) !important;
}

app-seats-selection .row-seat .seat.selected .data-set {
  color: var(--lightest) !important;
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

app-seats-selection .row-seat .seat:not(.inexistent) .data-set,
app-seats-selection .row-seat .seat:not(.inexistent) .cell:before {
  border-color: var(--primary) !important;
}

.fare-option--banner-image-container {
  color: #D6DBDA;
}

app-journey-fare-option-header.fare-type-fly {
  background: transparent !important;
}

app-journey-fare-option-header.fare-type-flyflex {
  background: #C5C9C5 !important;
}

app-journey-fare-option-header.fare-type-flyplus {
  background: #A07302 !important;
}

/* app-journey-fare-option-header.fare-type-soar {
  background: #A07302 !important;
} */

.fare-option--banner-image {
  height: 51px;
}

/*--------------------Fare Type Styling----------------- */
/* The fare type identifier is configured in client specific MongoDB Collections.
Fare type CSS class name is constrcuted using the following rules: 1. Prefix 'fare-type-',
2. Replace spaces within fare type identifier by '-'. 3. Transform fare type identifier into lowercase. */


app-journey-fare-option-header.fare-type-fly {
  color: var(--primary) !important;
}

.fare-type-fly .fare-type--header-title,
.fare-type-fly .fare-type--footer-content .btn {
  background-color: #0E1840 !important;
}

.fare-type-fly .fare-type--footer-content .btn:hover {
  background-color: #172d85 !important;
}

.fare-type-flyflex .fare-type--header-title,
.fare-type-flyflex .fare-type--footer-content .btn {
  background-color: #B0B6BB !important;
}

.fare-type-flyflex .fare-type--footer-content .btn:hover {
  background-color: #94989b !important;
}

.fare-type-flyplus .fare-type--header-title,
.fare-type-flyplus .fare-type--footer-content .btn {
  background-color: #A8802D !important;
}

.fare-type-flyplus .fare-type--footer-content .btn:hover {
  background-color: #cf9b33 !important;
}

.fare-type-soar .fare-type--header-title {
  background-color: #ffffff !important;
  color: #0E1840 !important;
}

.fare-type-soar .fare-type--footer-content .btn {
  background-color: #0E1840 !important;
}

.fare-type-soar .fare-type--footer-content .btn:hover {
  background-color: #172d85 !important;
}

app-journey-fare-option-ptc-fare-summary .price-pre-discount {
  display: none !important;
}

app-payment-method-picker .card-icons {
  display: none !important;
}

app-boarding-pass-control .btn.w-100.btn-outline-primary.px-5.fs-14 {
  background-color: var(--primary) !important;
  color: #ffffff !important;
}
app-survey-input .modal-description {
  color: #856404;
  background-color: #fff3cd;
  border-color: #ffeeba;
  padding: 1rem;
  border-radius: 0.5rem;
}
app-dashboard .page-body .card-body .text-muted.fs-24 {
  text-align: left !important;
}

[seat-map-name="73Q_737-136"] [data-seat-position="11_B"],
[seat-map-name="73Q_737-136"] [data-seat-position="11_C"] {
  transform: translateX(10px);
}
[seat-map-name="73Q_737-136"] [data-seat-position="11_D"],
[seat-map-name="73Q_737-136"] [data-seat-position="11_E"] {
  transform: translateX(-10px);
}
[seat-map-name="73Q_737 - 80"] [data-seat-position="10_B"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="10_C"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="11_B"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="11_C"] {
  transform: translateX(10px);
}
[seat-map-name="73Q_737 - 80"] [data-seat-position="10_D"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="10_E"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="11_D"],
[seat-map-name="73Q_737 - 80"] [data-seat-position="11_E"] {
  transform: translateX(-10px);
}

.agent-login-header.bg-primary,
app-agent-login .navbar-dark .navbar-text,
app-agent-login .navbar-dark .navbar-text a {
  background-color: var(--light) !important;
  color: var(--secondary-contrast) !important;
}

app-site-header .text-white,
app-site-header li::after {
  color: var(--darkest) !important;
}

app-agent-dashboard .text-secondary {
  width: 10rem !important;
}

app-agent-company-selection .btn {
  max-width: 30em !important;
  max-height: 10rem !important;
  font-size: 14px !important;
}

app-flight-status-item-leg  .item-container p{
  font-size: 0.75rem!important;
}
app-flight-status-item .pointer div{
  font-size: 0.75rem!important;
}

.avis-image {
  width: 300px;
  background-image: url(/assets/images/avis-web.png);
  height: 200px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.budget-web-image {
  width: 300px;
  background-image: url(/assets/images/budget-web.png);
  height: 200px;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.btn-secondary {
  color: var(--primary-inverse) !important;
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.btn-secondary:hover {
  opacity: 0.8 !important;
}

a, .btn-link {
  color: var(--primary) !important;
  text-decoration: underline !important;
}

:root app-site-footer a,
:root .btn-link {
  text-decoration: underline !important;
}

.agent-login-header span {
  color: var(--primary) !important;
}

:root .text-secondary {
  color: var(--primary) !important;
}

:root .text-secondary {
  color: var(--primary) !important;
}

:root .date-range-controls label {
  color: var(--primary) !important;
}

:root .text-success {
  color: var(--primary) !important;
}

:root .text-ontime-or-others {
  color: var(--primary) !important;
}

.fi-iu {
  background-image: url(/assets/images/flags/iu.png);
}