/* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&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: 'Lato', sans-serif; */
  --lightest: #fff;
  --light: #F3F3F3;
  --medium: #C4C4C4;
  --dark: #333;
  --darkest: #000;
  --body-background: var(--lightest);
  --body-color: var(--light);
  --headings-font-weight: 700;

  --primary: #003C5F;
  --primary-hover: #00698A;
  --primary-contrast: #6D9DB8;
  --primary-inverse: var(--lightest);

  --secondary: #0082AF;
  --secondary-hover: #009FBF;
  --secondary-contrast: #62B5CE;
  --secondary-inverse: var(--lightest);

  --info: #003C5F;
  --info-hover: #00698A;
  --info-contrast: #6D9DB8;
  --info-inverse: var(--lightest);

  --highlight: hsla(207, 79%, 95%, 1);
  --highlight-hover: hsla(207, 79%, 75%, 1);
  --highlight-contrast: hsla(207, 79%, 25%, 1);
  --highlight-inverse: var(--darkest);

  --success: #28a745;
  --danger: #dc3545;
  --warning: #ffc107;
  --dark: #343a40;
  --white: #fff;
}

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

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

/* 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: 8rem;
}

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

/* SVG Icon Substitution */
.leg--footer .logo {
  background-image: url(./img/airline-icon.svg);
  width: 20px;
  height: 20px;
}


/*--------------------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. */
/* Example CSS class for fare type identifier Bronze:*/


/* app-journey-fare-option-header.fare-type-bronze,
app-journey-fare-option-summary.fare-type-bronze .btn-select {
  background-color: #b3ae9b !important;
}

app-journey-fare-option-header.fare-type-silver,
app-journey-fare-option-summary.fare-type-silver .btn-select {
  background-color: #b0b6bb !important;
}

app-journey-fare-option-header.fare-type-gold,
app-journey-fare-option-summary.fare-type-gold .btn-select {
  background-color: #dab74d !important;
}

app-journey-fare-option-header.fare-type-platinum,
app-journey-fare-option-summary.fare-type-platinum .btn-select {
  background-color: var(--primary-hover) !important;
} */

/* Customer Customization/Overrides */

/* Site header */
app-site-header-flight-summary span {
  font-size: 0.825rem !important;
}

app-check-in-summary,
app-check-in .page-header--pnr,
app-check-in app-thanks .cart--outbound,
app-check-in app-thanks .page--action {
  display: none !important;
}

div.check-in-constrain.text-medium {
  padding: 1rem !important;
  background-color: var(--warning) !important;
  color: var(--darkest) !important;
}

/* Remove Flight Status */
app-flight-status .row.mb-1 {
  display: none;
}

app-flight-status .page-body {
  margin-top: 1rem !important;
}

app-flight-status .form-group {
  display: none;
}

app-flight-status .bg-light {
  background-color: #ffffff !important;
  color: var(--light-inverse) !important;
}

app-flight-status .col-12.col-md-11.align-self-center.text-primary {
  display: none;
}

app-flight-status svg.fa-lightbulb-on.fa-2x {
  display: none;
}

/* Remove Rounded Cornders */
.passenger__contact-details {
  display: none;
}

/* PASSENGER PAGE THEMING */
@media screen and (min-width: 768px) {
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3:not(.passenger__address) {
    width: 33.33333333% !important;
    margin-left: 0;
  }
  /* Passenger address */
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3.passenger__address {
    width: 66.66666666% !important;
    margin-left: 0;
    display: flex;
    column-gap: 1.5rem;
  }
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3.passenger__address .address__address-1,
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3.passenger__address .address__postal-code {
    width: 100% !important;
  }
  /* Search existing passenger button */
  .search-existing-passengers.my-3 {
    margin-top: 0px !important;
  }
  /* Title and input */
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3 .row {
    display: block;
  }
  /* Title */
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3 .row .col-md-3 {
    padding-bottom: 0;
    font-size: 14px;
  }
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3 .row .col-md-3,
  app-passenger-information-input .passenger__data .col-lg-9.offset-lg-3 .row .col-md-8 {
    width: 100%;
  }

  /* Booking Information */
  app-reservations-booking-info-form .offset-md-3 {
    margin-left: 0;
    width: 100% !important;
  }
  app-reservations-booking-info-form app-contact-information-input {
    display: flex;
    column-gap: 1.5rem;
  }
  /* Title and input */
  app-reservations-booking-info-form app-contact-information-input .row {
    display: block;
    width: 100% !important;
  }
  /* Title */
  app-reservations-booking-info-form app-contact-information-input .row .col-md-3 {
    padding-bottom: 0;
    font-size: 14px;
  }
  app-reservations-booking-info-form app-contact-information-input .row .col-md-3,
  app-reservations-booking-info-form app-contact-information-input .row .col-md-8 {
    width: 100% !important;
  }
}
/* END PASSENGER PAGE THEMING */