@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");

body {
 display: flex;
 gap: 3rem;
 margin: 0;
 padding: 0;
 font-family: "Plus Jakarta Sans", sans-serif;
 overflow-x: hidden;
}
:root {
 --dark-purple: #3b183f;
 --dark-pink: #bc2550;
 --light-purple: #f3ebf4;
 --very-light-purple: #f5f2f5;
 --text-on-dark-purple: #915e96;
 --dark-purple-text: #39223c;
 --shadow-purple: #e0d5e1;
 --pastel-green: #b3dec1;
 --pastel-green-dark: #526a5a;
 --pastel-cyan: #dbf9f0;
 --pastel-cyan-dark: #7d968f;
 --pastel-pink: #ee638b;
 --pastel-pink-dark: #9d2a4b;
 --pastel-neon-green: #d1da90;
 --pastel-neon-green-dark: #818a49;
 --pastel-dull-green: #c7deb3;
 --pastel-dull-green-dark: #8e9475;
 --neon-purple: #7c2cdd;
 --base-grey: #f9fafb;
 --smoke-grey: #a9adb0;
 --nice-blue: #e2faff;
 --nice-purple: #e3e2ff;
 --nice-dark-blue: #e3ebfb;
 --nice-red: #ffdcdc;
 --nice-pink: #fee2ff;
 --nice-blue-text: #6cc5d7;
 --nice-purple-text: #7e7cf6;
 --nice-dark-blue-text: #729cf0;
 --nice-red-text: #e93c3c;
 --nice-pink-text: #ea73ee;
 --nice-crimson: #e47a88;
 --nice-crimson-text: #a62e3e;
 --nice-orange: #e9a77e;
 --nice-orange-text: #e85a00;
}

body {
 display: flex;
 flex-direction: column;
 position: relative;
 width: 100vw;
 background: #000;
 max-height: 100vh;
}

form {
 padding: 1rem;
}

.alert {
 width: fit-content;
 display: block;
 position: absolute;
 bottom: 8rem;
 left: 1rem;
 opacity: 1;
 transition: opacity 0.5s, transform 0.5s;
 transform: translateY(0);
}

.alert.hide {
 display: none;
 opacity: 0;
 transform: translateY(100%);
}

.modal {
 /* Apply the blur effect */

 overflow-y: auto !important;

 background-color: rgba(
  114,
  110,
  110,
  0.5
 ); /* Set a semi-transparent background color */
}

.select-option-image {
 width: 2rem;
 height: 2rem;
 object-fit: cover;
}

.select2-option {
 display: flex;
 align-items: center;
 gap: 0.3rem;
 cursor: pointer;
 font-size: 12px;
}

.select2-selection__choice {
 padding: 0;
}