/* -- Flight Search Section -- */
  .search-section {
    background: var(--gray-bg);
    padding: 1rem;
    border-bottom: 1px solid #DDE0E4;
  }
 
  @media (min-width: 1024px) {
    .search-section { padding: 2rem; }
  }
 
  .search-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
  }
 
  @media (min-width: 1024px) {
    .search-grid { grid-template-columns: repeat(4, 1fr); }
  }
 
  .search-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
 
  .search-label {
    font-size: 0.75rem;
    font-weight: 700;
    color: #555E68;
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }
 
  .search-input-wrapper {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    border: 1px solid #DDE0E4;
    padding: 0.625rem 0.75rem;
    border-radius: 0.125rem;
    transition: border-color 0.2s;
  }
 
  .search-input-wrapper:focus-within {
    border-color: #51B4FB;
  }
 
  .search-input-icon {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
  }
 
  .search-input {
    width: 100%;
    background: transparent;
    outline: none;
    border: none;
    color: #161A1D;
    font-weight: 500;
    font-size: 0.75rem;
  }
 
  .search-input::placeholder { color: #555E68; }
 
  @media (min-width: 640px) {
    .search-input { font-size: 1rem; }
  }
 
.ui-autocomplete {
    max-width: 95vw;
    overflow-x: hidden !important;
    box-sizing: border-box;
    transition:none !important;
}

.ui-menu-item-wrapper {
    white-space: normal;
}

.ui-menu-item-wrapper {
    white-space: normal;
    font-size: 16px;
    line-height: 1.3;
    padding: 10px 14px;
    box-sizing: border-box;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-menu-item-wrapper.ui-state-active {
    font-size: 16px !important;
    line-height: 1.3 !important;
    padding: 10px 14px !important;
    border: none !important;
    margin: 0 !important;
}

.ui-autocomplete .ui-menu-item {
    margin: 0 !important;
    padding: 0 !important;
}

.ui-autocomplete .ui-menu-item-wrapper {
    display: block;
    padding: 8px 14px !important;
    line-height: 1.25 !important;
    font-size: 14px !important;
    border: 0 !important;
    margin: 0 !important;
}

.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper:hover {
    padding: 8px 14px !important;
    line-height: 1.25 !important;
    font-size: 14px !important;
    border: 0 !important;
    margin: 0 !important;
}

.airport-wrap {
    position: relative;
}

.airport-wrap .awesomplete {
    width: 100%;
    display: block;
}

.airport-wrap .awesomplete > ul {
    transition: none !important;
    transform: none !important;
    width: min(420px, 90vw);
    max-width: 90vw;
}

.airport-left .awesomplete > ul {
    left: 0 !important;
    right: auto !important;
}

.airport-right .awesomplete > ul {
    left: auto !important;
    right: -10px !important;
  
}
  
/* -- Results Section -- */
  .results-section {
    flex: 1;
    padding: 1rem;
    /*padding-bottom: 6rem;*/
  }

  @media (min-width: 1024px) {
    .results-section { padding: 2rem; }
  }

  .results-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
  }

  .results-count {
    font-size: 0.875rem;
    font-weight: 700;
    color: #555E68;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0;
  }

  .results-clear-btn {
    font-size: 0.75rem;
    font-weight: 700;
    color: #51B4FB;
    background: none;
    border: none;
    cursor: pointer;
  }
  .results-clear-btn:hover { text-decoration: underline; }

  .results-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  @media (min-width: 768px) {
    .results-grid { grid-template-columns: 1fr 1fr; }
  }

  @media (min-width: 1024px) {
    .results-grid { grid-template-columns: 1fr; }
  }

  /* -- Flight Card -- */
  .flight-card {
    background: white;
    border: 2px solid #DDE0E4;
    border-radius: 0.125rem;
    padding: 1.25rem;
    position: relative;
    overflow: hidden;
    transition: border-color 0.2s;
  }

  .flight-card:hover { border-color: #51B4FB; }

  .flight-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
  }

  .flight-card-airline {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .flight-card-airline-logo {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 20%;
    background: #e8f4f8;
    overflow: hidden;
    flex-shrink: 0;
  }

  .flight-card-airline-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .flight-card-airline-name {
    font-size: 0.75rem;
    font-weight: 700;
    color: #555E68;
    margin: 0 0 0.125rem;
  }

  .flight-card-flight-number {
    font-size: 1rem;
    font-weight: 700;
    color: #161A1D;
    margin: 0;
  }

  .flight-card-duration {
    font-size: 0.625rem;
    font-weight: 900;
    color: #161A1D;
    background: transparent;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
  }
  
  .flight-card-partners {
	    padding: 0.75rem 0;
	    border-top: 1px solid #DDE0E4;
	    display: flex;
	    flex-direction: column;
	    gap: 0.375rem;
	}

	.flight-card-partner-label {
	    font-size: 10px;
	    font-weight: 700;
	    text-transform: uppercase;
	    letter-spacing: 0.08em;
	    color: #555E68;
	    margin-bottom: 0.25rem;
	}
	
	.flight-card-partner {
	    display: flex;
	    align-items: center;
	    gap: 0;
	    line-height: 1.4;
	}
	
	.flight-card-partner-flight-number {
	    font-size: 12px;
	    font-weight: 700;
	    color: #161A1D;
	    min-width: 4rem;
	    flex-shrink: 0;
	}
	
	.flight-card-partner-airline {
	    font-size: 12px;
	    font-weight: 400;
	    color: #555E68;
	}

  /* -- Route Row -- */
  .flight-card-route {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
    padding: 0 0.5rem;
  }

  .flight-card-airport {
    text-align: center;
  }

  .flight-card-airport-code {
    font-size: 1.5rem;
    font-weight: 900;
    margin: 0;
  }

  .flight-card-airport-label {
    font-size: 0.625rem;
    font-weight: 700;
    color: #555E68;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    display: block;
  }

  .flight-card-airport-time {
    font-size: 0.75rem;
    font-weight: 500;
  }

  .flight-card-route-line {
    flex: 1;
    margin: 0 1rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .flight-card-route-line-bar {
    width: 100%;
    height: 1px;
    background: #DDE0E4;
  }

  .flight-card-route-line img {
    position: absolute;
    width: 1rem;
    height: 1rem;
    background: white;
    padding: 0 0.125rem;
  }

  /* -- Card Footer -- */
  .flight-card-footer {
    padding-top: 1rem;
    border-top: 1px solid #DDE0E4;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }


  /* -- Footer note -- */
  .results-footer-note {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #555E68;
    font-style: italic;
    font-size: 0.75rem;
  }

  .results-footer-note img {
    width: 0.75rem;
    height: 0.75rem;
  }   
  
/* -- Bet Form: Left Column -- */
  .bet-left-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #f3f4f6;
  }
 
  .bet-header {
    position: sticky;
    top: 0;
    z-index: 30;
    background: var(--gray-bg);
    border-bottom: 1px solid #DDE0E4;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
 
  .bet-header-btn {
    padding: 0.5rem;
    border: none;
    background: transparent;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.2s;
  }
  .bet-header-btn:hover { background: #f3f4f6; }
  .bet-header-btn img { width: 1.25rem; height: 1.25rem; display: block; }
 
  .bet-header-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
  }
 
  .bet-scroll-area {
    flex: 1;
    overflow-y: auto;
  }
 
  /* -- Flight Summary Card -- */
  .bet-flight-card {
    padding: 1rem;
    border-bottom: 2px solid #DDE0E4;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
 
  .bet-flight-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }
 
  .bet-flight-logo {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    overflow: hidden;
    background: #e8e3fc;
    flex-shrink: 0;
  }
 
  .bet-flight-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
 
  .bet-flight-number-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.125rem;
  }
 
  .bet-flight-number {
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0;
  }
 
  .bet-flight-route-badge {
    padding: 0.125rem 0.5rem;
    border: 1px solid #51B4FB;
    color: #51B4FB;
    font-size: 0.625rem;
    font-weight: 700;
    border-radius: 9999px;
  }
 
  .bet-flight-departs {
    font-size: 0.75rem;
    font-weight: 500;
    color: #555E68;
    margin: 0;
  }
 
  .bet-flight-timer {
    text-align: right;
  }
 
  .bet-flight-countdown {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: #EB4763;
    font-weight: 700;
  }
 
  .bet-flight-countdown img { width: 1rem; height: 1rem; }
  .bet-flight-countdown span { font-size: 0.875rem; }
 
  .bet-flight-timer-label {
    font-size: 0.625rem;
    font-weight: 700;
    color: #555E68;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0;
  }
 
  /* -- Prediction Selection -- */
  .bet-prediction-section {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
 
  .bet-prediction-heading {
    font-size: 0.75rem;
    font-weight: 900;
    color: #555E68;
    text-transform: uppercase;
    letter-spacing: 0.075em;
    margin: 0 0 0.5rem;
  }
 
  .bet-prediction-desc {
    font-size: 0.875rem;
    font-weight: 500;
    color: #161A1D;
    margin: 0;
  }
 
  .bet-tier-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }
 
  .bet-tier-btn {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    border-radius: 0;
    border: 2px solid #DDE0E4;
    background: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    cursor: pointer;
    transition: border-color 0.2s;
  }
 
  .bet-tier-btn:hover { border-color: #51B4FB; }
 
  .bet-tier-btn-full {
    width: 100%;
  }
 
  .bet-tier-check {
    margin-bottom: 0.25rem;
  }
 
  .bet-tier-check.faded { opacity: 0.3; }
 
  .bet-tier-label {
    font-size: 0.875rem;
    font-weight: 700;
  }
 
  .bet-tier-meta {
    font-size: 0.625rem;
    font-weight: 500;
    color: rgba(22, 26, 29, 0.8);
    text-align: center;
  }
 
  /* -- Right Column: Stake -- */
  .bet-right-col {
    display: flex;
    flex-direction: column;
    background: var(--gray-bg);
  }
 

 
  .bet-stake-area {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
 
  .bet-stake-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
 
  .bet-stake-title {
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.025em;
    margin: 0;
  }
 
  .bet-currency-toggle {
    display: flex;
    background: #F3F5F6;
    padding: 0.25rem;
    border-radius: 0.625rem;
    border: 1px solid #DDE0E4;
    gap: 0.125rem;
  }
 
  .bet-currency-btn {
    padding: 0.25rem 0.75rem;
    font-size: 0.625rem;
    font-weight: 700;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    background: transparent;
    color: #555E68;
  }
 
  .bet-currency-btn--active {
    background: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    color: #161A1D;
  }
 
  .bet-stake-input-wrapper {
    display: flex;
    align-items: center;
    width: 100%;
    height: 4rem;
    padding: 0 1rem;
    background: white;
    border: 2px solid #DDE0E4;
  }
 
  .bet-stake-currency-symbol {
    font-size: 1rem;
    font-weight: 700;
    color: #555E68;
    margin-right: 0.5rem;
  }
 
  .bet-stake-input {
    flex: 1;
    font-size: 1.5rem;
    font-weight: 700;
    outline: none;
    border: none;
    background: transparent;
    max-width: 200px;
    min-width: 100px;
  }
 
  .bet-stake-max {
    font-size: 0.625rem;
    font-weight: 700;
    color: #555E68;
  }
 
  .bet-disclaimer {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid #DDE0E4;
    border-radius: 0.5rem;
    background: #f9fafb;
  }
 
  .bet-disclaimer img {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
  }
 
  .bet-disclaimer-text {
    font-size: 0.625rem;
    line-height: 1.6;
    font-weight: 500;
    margin: 0;
  }  
  
/* -- Place Bet: Header -- */
  .place-header {
    position: sticky;
    top: 0;
    z-index: 30;
    background: white;
    border-bottom: 1px solid #DDE0E4;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
 
  .place-header-btn {
    padding: 0.5rem;
    border: none;
    background: transparent;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.2s;
  }
  .place-header-btn:hover { background: #f3f4f6; }
  .place-header-btn img,
  .place-header-btn svg { width: 1.25rem; height: 1.25rem; display: block; }
 
  .place-header-title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
  }
 
  /* -- Scrollable Body -- */
  .place-body {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-bottom: 6rem;
  }
 
  @media (min-width: 1024px) {
    .place-body { padding: 2rem; padding-bottom: 6rem; }
  }
 
  /* -- Shared Card -- */
  .place-card {
    border: 1px solid #DDE0E4;
    border-radius: 14px;
    padding: 1rem;
  }
 
  .place-card--tinted { background: #F9FAFB; }
  .place-card--white  { background: white; }
 
  .place-card-title {
    font-size: 0.75rem;
    font-weight: 700;
    color: #555E68;
    letter-spacing: 0.075em;
    text-transform: uppercase;
    margin: 0 0 0.75rem;
  }
 
  /* -- Flight Details Card -- */
  .place-route-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
  }
 
  .place-airport {
    text-align: center;
  }
 
  .place-airport-code {
    font-size: 1.875rem;
    font-weight: 900;
    letter-spacing: -0.05em;
    color: #161A1D;
    line-height: 1.1;
    margin: 0;
  }
 
  .place-airport-name {
    font-size: 0.6875rem;
    font-weight: 500;
    color: #555E68;
    margin: 0;
  }
 
  .place-airport-time {
    font-size: 1rem;
    font-weight: 700;
    color: #161A1D;
    margin: 0.25rem 0 0;
  }
 
  .place-route-connector {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    padding: 0 0.75rem;
  }
 
  .place-route-connector-line {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }
 
  .place-route-connector-bar {
    flex: 1;
    height: 1px;
    background: #DDE0E4;
  }
 
  .place-route-connector-icon {
    color: #51B4FB;
    flex-shrink: 0;
  }
 
  .place-route-flight-number {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #51B4FB;
    margin: 0.25rem 0 0;
  }
 
  .place-route-date {
    font-size: 0.625rem;
    color: #555E68;
    margin: 0;
  }
 
  /* -- Meta Chips -- */
  .place-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }
 
  .place-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
  }
 
  .place-chip--blue {
    background: rgba(81, 180, 251, 0.1);
    color: #51B4FB;
  }
 
  .place-chip--grey {
    background: #F3F5F6;
    color: #555E68;
  }
 
  /* -- Bet Summary Card -- */
  .place-summary-rows {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
 
  .place-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
 
  .place-summary-label {
    font-size: 0.875rem;
    color: #555E68;
  }
 
  .place-summary-value {
    font-size: 0.875rem;
    font-weight: 700;
    color: #161A1D;
  }
 
  .place-summary-value--muted {
    font-weight: 500;
    color: #555E68;
  }
 
  .place-summary-value--total {
    font-size: 1rem;
    font-weight: 900;
    color: #161A1D;
  }
 
  .place-summary-value--payout {
    font-size: 1rem;
    font-weight: 900;
    color: #3CDDA7;
  }
 
  .place-summary-divider {
    border: none;
    border-top: 1px solid #DDE0E4;
    margin: 0.25rem 0;
  }
 
  /* -- Form Fields -- */
  .place-form-section {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
  }
 
#credit_card_form .input-wrapper {
	height:2.5rem;	
}
 
  /* -- Card / Stripe Element -- */
  .place-stripe-wrapper {
    background: white;
    border: 2px solid #DDE0E4;
    border-radius: 0.125rem;
    padding: 0.75rem;
  }
 
  .place-stripe-placeholder {
    font-size: 0.875rem;
    font-style: italic;
    color: rgba(85, 94, 104, 0.6);
    user-select: none;
  }
 
  .place-stripe-errors {
    margin-top: 0.375rem;
    font-size: 0.75rem;
    color: #EB4763;
    font-weight: 500;
    display: none;
  }
 
  /* -- Secure Badge -- */
  .place-secure-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: rgba(85, 94, 104, 0.6);
    padding-bottom: 1rem;
  }
 
  .place-secure-badge span {
    font-size: 0.6875rem;
    font-weight: 500;
  }
 
  /* -- Submit Button -- */
  .place-submit-btn {
    width: 100%;
    background: #51B4FB;
    color: white;
    font-weight: 700;
    font-size: 0.875rem;
    padding: 0.875rem;
    border: none;
    border-radius: 0.125rem;
    box-shadow: 0 4px 8px rgba(81, 180, 251, 0.2);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.2s;
  }
 
  .place-submit-btn:hover { background: #40a3e9; }
  .place-submit-btn:active { transform: scale(0.98); }  
  
  /* -- Bet Confirmation -- */
  .confirm-wrapper {
    padding: 1.5rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1rem;
  }
 
  .confirm-icon {
    width: 4rem;
    height: 4rem;
    border-radius: 9999px;
    background: rgba(60, 221, 167, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
 
  .confirm-heading {
    font-size: 1.125rem;
    font-weight: 900;
    color: #161A1D;
    letter-spacing: -0.025em;
    margin: 0;
  }
 
  .confirm-subheading {
    font-size: 0.875rem;
    color: #555E68;
    margin: 0.25rem 0 0;
  }
 
  .confirm-receipt {
    width: 100%;
    background: #F9FAFB;
    border: 1px solid #DDE0E4;
    border-radius: 10px;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
 
  .confirm-receipt-col--left  { text-align: left; }
  .confirm-receipt-col--right { text-align: right; }
 
  .confirm-receipt-label {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #555E68;
    text-transform: uppercase;
    letter-spacing: 0.075em;
    margin: 0;
  }
 
  .confirm-receipt-amount {
    font-size: 1rem;
    font-weight: 900;
    color: #161A1D;
    margin: 0;
  }
 
  .confirm-receipt-amount--payout { color: #3CDDA7; }
 
  .confirm-receipt-divider {
    width: 1px;
    height: 2rem;
    background: #DDE0E4;
    flex-shrink: 0;
  }
 
  .confirm-ref {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
  }
 
  .confirm-ref-label {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #555E68;
    text-transform: uppercase;
    letter-spacing: 0.075em;
    margin: 0;
  }
 
  .confirm-ref-number {
    font-size: 0.875rem;
    font-family: monospace;
    font-weight: 600;
    color: #161A1D;
    background: #F3F5F6;
    padding: 0.375rem 0.75rem;
    border-radius: 0.125rem;
    letter-spacing: 0.15em;
    margin: 0;
  }
 
  .confirm-note {
    font-size: 0.6875rem;
    color: rgba(85, 94, 104, 0.6);
    line-height: 1.6;
    margin: 0;
  }
 
  .confirm-cta {
    width: 100%;
    background: #161A1D;
    color: white;
    font-weight: 700;
    font-size: 0.875rem;
    padding: 0.875rem;
    border: none;
    border-radius: 0.125rem;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.2s;
  }
 
  .confirm-cta:hover { background: #31383F; }
  .confirm-cta:active { transform: scale(0.98); }