.promocode_popup_wrapper{position: fixed;background-color: rgba(0, 0, 0, 0.5);left: 0;top: 0;z-index: 200;width: 100%;height: 100%;}
.promocode_popup{background: white;width: fit-content;top: 50%;left: 50%;transform: translate(-50%, -50%);position: relative;border-radius: 20px;}
.close_promocode_popup{position: absolute;right: 24px;top: 24px;}
.inner_promocode_popup{width: 600px;font-family: RobotoMedium; text-align: center; font-size: 24px; line-height: 32px; margin-bottom: 10px; padding: 14px 78px; padding-top: 78px;}
.inner_promocode_popup p {line-height: 20px; font-size: 16px;font-family: RobotoRegular;text-align: center;margin-bottom: 20px;}
.promocode_wrap{display: flex;margin: 0 auto; width: 100%; gap: 10px; margin-bottom: 20px;}
#promocode_popup{cursor: pointer;color: black;background: white;border: 1px solid #A9B5C6;border-radius: 12px;padding: 10px 20px;font-family: RobotoRegular;font-size: 16px;}
#copy_promocode_popup{transition: 0.3s ease;cursor: pointer;width: 171px; background: white; border: 1px solid #A9B5C6; border-radius: 10px; font-family: RobotoRegular; padding: 12px 20px; display: flex; align-items: center; color: #44308f; font-size: 16px;}
#hide_promocode_popup{cursor: pointer; margin: 0 auto;display: block;background: white;border: none;color: #44308F;font-family: RobotoMedium;font-size: 16px;padding: 12px 20px;}
.copy_promocode_popup-btn::after{content: url('/images/promocode/copy_promocode.svg'); margin-left: 8px; display: flex; width: fit-content;}
.copy_promocode_popup-btn.copyed::after{content: url('/images/promocode/success_copy.svg');}
.copy_promocode_popup-btn.copyed{color: #7D8FA9!important}
.close_promocode_popup{cursor: pointer;background: url('/images/promocode/close.svg'); display: block; width: 24px; height: 24px; border: none; background-position: center;}
.inner_promocode_popup h4::after{content: url('/images/promocode/thumbs-up.svg'); margin-left: 8px; display: flex; width: fit-content;}
.inner_promocode_popup h4{display: flex;margin: 0 auto;width: fit-content;}
#copy_promocode_popup:hover {transition: 0.3s ease;border: 1px solid #44308F; }
#copy_promocode_popup:active{transition: 0.3s ease; font-family:border: 1px solid #44308F;}
@media(max-width: 1023px) {
 .inner_promocode_popup{width: 446px;}
 .promocode_wrap{flex-direction: column;}
 .promocode_popup{width: 290px;}
 .inner_promocode_popup{width: initial;padding: 16px; padding-top: 64px;}
 #copy_promocode_popup{width: 100%;}
 #copy_promocode_popup{padding-left: 25%;}
 #inner_promocode_popup h4{margin-bottom: 10px;}
}
