.container { border: 1px solid var(--Base-Border-Subtle); border-radius: var(--Corner-Radius-md); min-width: 358px; background: var(--Base-Surface-Primary-light-Normal); box-shadow: 0px 0px 8px 3px rgba(0, 0, 0, 0.1); position: relative; } .content { padding: var(--Space-x15); display: flex; flex-direction: column; gap: var(--Space-x15); } .header { display: flex; gap: var(--Space-x15); } .divider { color: var(--Text-Tertiary); } .red { color: var(--Text-Accent-Primary); } .name { height: 48px; max-width: 180px; margin-bottom: var(--Space-x05); display: flex; align-items: center; } .facilities { display: flex; gap: 0 var(--Space-x15); } .priceCard { border-radius: var(--Corner-Radius-md); padding: var(--Space-x05) var(--Space-x1); background: var(--Base-Surface-Secondary-light-Normal); margin-top: var(--Space-x1); } .prices { display: flex; flex-direction: column; gap: var(--Space-x1); justify-content: space-between; } .bottomContainer { display: flex; border-top: 1px solid var(--Primary-Light-On-Surface-Divider-subtle); padding-top: var(--Space-x2); padding-bottom: var(--Space-x05); } .pricesContainer { display: flex; flex-direction: column; flex: 1; height: 44px; } .listingPrices { display: flex; flex-direction: row; gap: var(--Space-x1); } .content .button { margin-top: auto; } .closeButton { position: absolute; top: 8px; right: 8px; } .notEnoughPointsButton { border-radius: var(--Corner-Radius-Rounded); border-width: 2px; border-style: solid; display: flex; align-items: center; justify-content: center; gap: var(--Space-x05); padding: 10px var(--Space-x2); background-color: var(--Component-Button-Brand-Primary-Fill-Disabled); border-color: var(--Component-Button-Brand-Primary-Border-Disabled); color: var(--Component-Button-Brand-Primary-On-fill-Disabled); }