.request_block { border: 2px solid var(--border-0-color); border-radius: 15px; padding: 15px; width: 88%; height: max-content; box-sizing: border-box; .label { display: flex; margin-bottom: 10px; } } .request_container { position: relative; .editable { padding-right: 28px; } .clickable { cursor: text; } .edit_btn { position: absolute; right: 10px; top: 12px; svg { height: 25px; width: 25px; } } } .request_options { position: absolute; box-sizing: border-box; width: 100%; font-size: 16px; border: 0; border-radius: 15px; border-top-left-radius: 0; border-top-right-radius: 0; overflow-y: auto; min-height: 1rem; padding: 16px; background-color: var(--border-0-color); text-align: left; box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); .abbreviation_option { display: flex; align-items: center; gap: 10px; color: gray; .abbreviation_option_label { white-space: nowrap; } } } .request_options:before { position: absolute; top: 0; left: auto; width: 90%; border-top: 1px solid var(--white-color); content: ""; } .abbreviation { font-weight: 600; margin: 0; cursor: default; text-decoration: none !important; color: var(--secondary-color); } .abbreviation_single { font-weight: 600; } .abbr_message { color: var(--border-1-color); margin-top: 10px; display: flex; justify-content: left; gap: 10px; align-items: center; } .request_container:hover .animated { animation: glowing 1800ms infinite; @keyframes glowing { 0% { color: rgb(131, 147, 197); } 50% { color: rgb(0, 40, 161); } 100% { color: rgb(131, 147, 197); } } } .clicked { animation: glowing 700ms infinite !important; }