
.com-popup .default-loader-wrap.inactive {display: none}

.com-popup.lang-switch .default-loader, .com-popup.default-redirect .default-loader {
	border: 7px solid rgb(255, 255, 255, .75);
	border-top: 7px solid transparent;
}
/* click blocker section */
.com-popup .click-blocker, .com-popup .click-blocker-loader, .com-popup .click-blocker-bg {
	display: none;
}
.com-popup .click-blocker {
	border-radius: 15px; /* we do this since we cannot use overflow on parent */
	background: rgba(255,255,255, .5);
}
.com-popup .click-blocker-loader {
	border: 7px solid #d2dce4;
	border-top: 7px solid transparent;
	border-radius: 50%;
	width: 80px;
	height: 80px;
	animation: spin .7s linear infinite;
  margin: auto;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.com-popup .click-blocker-bg {
	background-color: rgba(255,255,255,.5);
}
.com-popup.loading .click-blocker, .com-popup.loading .click-blocker-loader, .com-popup.loading .click-blocker-loader {
	display: block;
}

.com-popup.paint-bg-themecolor-dark .click-blocker {background: rgba(36,41,57,.35)}

.com-overlay-popup.inactive {height: 0}
.com-overlay-popup.active {/*height: 150%  fixes  Safari cover bug */}
.com-overlay-popup .com-popup-wrap .cover {
	display: block;
	background: rgba(0,0,0, .3);
	height: 150%; /* mobile height fix */
}
.com-overlay-popup .com-popup-wrap .cover.darker {background: rgba(0,0,0, .62)}
.com-overlay-popup.inactive .com-popup-wrap .cover {display: none}

.com-overlay-popup .com-popup-animation.width-364 {width: 364px}
.com-overlay-popup .com-popup-animation.width-430 {width: 430px}
.com-overlay-popup .com-popup-animation.width-472 {width: 472px}
.com-overlay-popup .com-popup-animation.width-512 {width: 512px}
.com-overlay-popup .com-popup-animation.default-width {width: 624px}
.com-overlay-popup .com-popup-animation.width-700 {width: 700px}
.com-overlay-popup .com-popup-animation.width-764 {width: 764px}
.com-overlay-popup .com-popup-animation.width-864 {width: 864px}
.com-overlay-popup .com-popup-animation.width-1024 {width: 1024px}
.com-overlay-popup .com-popup-animation.width-1280 {width: 1280px}
.com-overlay-popup .com-popup-animation.width-fullscreen {width: 100%}

.com-overlay-popup .com-popup.min-height-100 .body {min-height: 100px}
.com-overlay-popup .com-popup.min-height-120 .body {min-height: 120px}
.com-overlay-popup .com-popup.min-height-150 .body {min-height: 150px}

.com-overlay-popup .com-popup {
	-webkit-box-shadow: 0px 3px 4px 0px rgb(0, 33, 74, .15);
    box-shadow: 0px 3px 4px 0px rgb(0, 33, 74, .15);
    border-radius: 15px;
    padding: 0 25px;
}
.com-overlay-popup .com-popup.darkmode {
	/*-webkit-box-shadow: 1px 18px 35px -8px rgb(42 57 68 / 40%);
    box-shadow: 1px 18px 35px -8px rgb(42 57 68 / 40%);*/
	-webkit-box-shadow: 0px 3px 4px 0px rgb(0, 33, 74, .2);
    box-shadow: 0px 3px 4px 0px rgb(0, 33, 74, .2);
	background: #242939;
}
.com-overlay-popup .com-popup.paint-bg-trans {
	-webkit-box-shadow: none;
    box-shadow: none;
}
.com-overlay-popup .com-popup .default-btn {height: 36px}
.com-overlay-popup .com-popup .default-btn.height-32 {height: 32px}
.com-overlay-popup .com-popup .default-btn.height-30 {height: 30px}
.com-overlay-popup .com-popup .default-btn.height-28 {height: 28px}
.com-overlay-popup .com-popup .default-btn.height-26 {height: 26px}
.com-overlay-popup .com-popup .default-btn.height-24 {height: 24px}
.com-overlay-popup .com-popup .default-btn.height-22 {height: 22px}
.com-overlay-popup .com-popup .default-btn.height-20 {height: 20px}
.com-overlay-popup .com-popup .default-btn.height-18 {height: 18px}


.com-overlay-popup .com-popup.animate {
	-webkit-animation: popup-open .3s 1;
	animation: popup-open .3s 1;
}
@keyframes popup-open {
	0% {
		-webkit-transform: scale(.7,.7);
		-ms-transform: scale(.7,.7);
		transform: scale(.7,.7);
		/*width: 70%; 
		height: 70%; */
		opacity: 0;
	}
	1% { /*safari fliker bug fix*/
		opacity: .6;
	}
	100% {
		-webkit-transform: scale(1,1);
		-ms-transform: scale(1,1);
		transform: scale(1,1);
		opacity: 1;
	}
}
.com-overlay-popup .com-popup.de-animate {
	-webkit-animation: popup-close .25s 1;
	animation: popup-close .25s 1;
}
@keyframes popup-close {
	0% {
		-webkit-transform: scale(1,1);
		-ms-transform: scale(1,1);
		transform: scale(1,1);
		opacity: 1;
	}
	100% {
		-webkit-transform: scale(.8,.8);
		-ms-transform: scale(.8,.8);
		transform: scale(.8,.8);
		opacity: 0;
	}
}

.com-popup-wrap.active {display: block}
.com-popup-wrap.inactive {display: none}
.com-popup .top {
	height: 58px;
    padding-top: 4px;
}
.com-popup .top.has-subtitle {height: 68px}
.com-popup .top.has-subtitle .icon-holder {padding-bottom: 19.5px}
.com-popup .top .title-wrap {padding-left: 34.5px}

.com-popup .top .title-icon .icon {
	font-size: 26px;
	width: 26px; 
	height: 26px;
}
.com-popup .top .close-tab .icon {
	font-size: 28px;
	width: 28px;
    height: 28px;
}
.com-popup .top .close-tab.svg {
	width: 14.5px;
}
.com-popup .top .title-tab .subtitle {padding-left: 1.5px}

.com-overlay-popup .com-popup-animation.width-512 .com-popup .body {min-height: 184px}
.com-overlay-popup .com-popup-animation.default-width .com-popup .body {min-height: 160px}
.com-overlay-popup .com-popup-animation.width-700 .com-popup .body {min-height: 170px}

.com-popup .popup-bg-layer-wrap {border-radius: 15px;}

.com-overlay-popup .com-popup.no-pad, .com-popup.no-pad {padding-left: 0; padding-right: 0}

.com-overlay-popup .com-popup.cart.loading .click-blocker {display: none}
.com-overlay-popup .com-popup.cart .default-btn.support {height: 26px;}

.com-popup .footnote-sub {
	font-size: .6rem;
    line-height: .7rem;
    text-align: justify;
    text-align-last: left;
	font-weight: 700;
	padding: 0 3px;
}

/*-------------------*/

/* --- POPUP /// APP NEW VERSION --- */

.com-popup.comp-new-version .default-btn .btn-icon .icon {font-size: 21px; width: 21px; height: 21px;}
.com-popup.comp-new-version .popup-bg-layer {width: 300%; opacity: .6}
.com-popup.comp-new-version .latest-ver-text-wrap {height: 40px}
.marker-box {
	padding: 0 12px;
    border-radius: 10px;
    line-height: 18px;
}
.com-popup.comp-new-version.loading .click-blocker {background: rgba(36, 41, 57, .5)}

/*-------------------*/

/* --- POPUP /// SESSION EXPIRED LOGIN --- */

.com-popup.session-expired .session-login-form .edit-input-wrap {
	background: #fff;
	border: 1.5px solid #adc5de;
	border-radius: 8px;
	margin-bottom: 4px;
	padding: 6px 16px 0 16.5px
}
.com-popup.session-expired .session-login-form .edit-input-wrap .title {
	-webkit-transform: scale(0.82) translate3d(0, 0, 0);
	transform: scale(0.82) translate3d(0, 0, 0);
	line-height: 12px
}
.com-popup.session-expired .session-login-form .edit-input-wrap .marker-area {
	align-items: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 0
}
.com-popup.session-expired .session-login-form .edit-input-wrap:focus-within {
	border-color: #6196f9;
	box-shadow: 0 0 0 2px rgba(97, 150, 249, 0.15)
}
.com-popup.session-expired .session-login-form .edit-input-wrap:focus-within .title {color: #6196f9}
.com-popup.session-expired .pw-toggle-btn {cursor: pointer; padding-top: 2px}
.com-popup.session-expired .pw-toggle-btn:hover svg {opacity: 0.6}
.com-popup.session-expired .session-login-form .login-field-wrap {font-size: 0}
.com-popup.session-expired .login-card-header {font-size: 0}
.com-popup.session-expired.loading .click-blocker {background: rgba(255, 255, 255, .5)}

/*-------------------*/

.com-popup .lang-icon-wrap.pdf {
	border-radius: 50px;
    width: 24px;
	height: 22px;
}
.com-popup.user-download-cert .lang-icon-wrap.pdf {
	border: 2px solid rgb(105 139 175);
}
.com-popup .lang-icon.pdf {
	width: 33px;
    height: 24px;
    margin-left: -4px;
    margin-top: -1.5px;
}
.com-popup .lang-icon.pdf svg {
	width: auto;
    height: 100%;
}

/*------  CERT PREVIEW  ------*/

.ee-cert-preview-wrap {
	margin: 0 15px;
	width: 180px;
}
.ee-cert-preview {
	height: 254px;
}
.ee-cert-preview-wrap .outline {
	border: 1px solid rgb(145 162 180 / 100%);
	-webkit-box-shadow: inset 0 0 0 1px rgb(145 162 180 / 100%);
    box-shadow: inset 0 0 0 1px rgb(145 162 180 / 100%);
    border-radius: 8px;
}
.ee-cert-preview-wrap .default-loader {
	width: 50px;
	height: 50px;
	border-width: 4px;
	z-index: 4;
}
.ee-cert-preview-wrap .image {
	background-repeat: no-repeat; 
	background-size: cover;
	border-radius: 8px;
}
/*-------------------*/

/* ----- enlarge feature ---- */
body.enlarge-img-open, body.enlarge-img-open .com-body {
	overflow: hidden;
	width: 100%;
	height: 100%;
}
body.enlarge-img-open .com-popup-wrap.enlarge-img {
	width: 100%;
    height: 100%;
    position: fixed;
}
body.enlarge-img-open .com-popup-wrap.enlarge-img .com-popup-animation {
	position: absolute;
    display: block;
    top: 0 !important;
    left: 0;
	margin: 9.5vh 10vw 10.5vh 10vw;
    width: 80vw; height: 80vh;
} 
.com-popup-wrap .com-popup.enlarge-img {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.com-popup-wrap .enlarge-img-body {
	display: flex;
    flex-direction: column;
    align-items: center;
}
.com-popup-wrap .enlarge-img-layer {
	background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.com-popup-wrap .enlarge-img-bg {
	background: rgba(0,0,0,.50); 
	/*backdrop-filter: blur(10px); bug: causes flicker on animation scale */
}
.com-popup-wrap .enlarge-close-icon {
    top: 2vh;
    right: 1.5vw;
    background: rgba(0, 0, 0, 0.65);
	backdrop-filter: blur(5px);
    border-radius: 50%;
	padding: 10px;
}
.com-popup-wrap .enlarge-desc-wrap {
	bottom: 2vh;
	left: 0;
	padding: 0 2vw;
	max-height: 40%;
}
.com-popup-wrap .enlarge-desc-box {
	background: linear-gradient(165deg, rgb(0 0 0 / 60%), rgb(0 0 0 / 45%) 70%);
	/*background: rgba(0, 0, 0, 0.65);*/
    backdrop-filter: blur(5px);
    /* border: 1px solid rgba(255, 255, 255, .1); */
    padding: 10px 60px;
}
.com-popup-wrap .enlarge-copyright-text-wrapper {
	background: linear-gradient(165deg, rgb(0 0 0 / 60%), rgb(0 0 0 / 45%) 70%);
    backdrop-filter: blur(5px);
    padding: 10px 30px;
	border-radius: 60px;
}
.com-popup-wrap .enlarge-copyright-text {
	color: rgba(255,255,255,1); 
	/*text-shadow: 0px 1px 3px rgb(0,0,0,.7), 0px 1px 2px rgb(0,0,0,.7);*/
}
.com-popup-wrap .enlarge-desc-box .enlarge-copyright-text {text-shadow: none}

@media only screen and (max-width: 1024px) {
	body.enlarge-img-open .com-popup-wrap.enlarge-img .com-popup-animation {
		margin: 4.5vh 5vw 5.5vh 5vw;
		width: 90vw; height: 90vh;
	}
}
@media only screen and (max-width: 720px) {
	body.enlarge-img-open .com-popup-wrap.enlarge-img .com-popup-animation {
		margin: 4.5vh 2vw 5.5vh 2vw;
		width: 96vw;
	}
}

/* -------- notification -------- */
.notification-item {
	background: rgb(38 44 63 / 85%);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, .08);
	padding: 0 60px;
	top: 30px;
	left: 50%;
  transform: translate(-50%, 0);
	opacity: 0;
	max-width: 90%;
	width: max-content;
}
.notification-item.error {
	/*background: rgb(63 38 44 / 85%);*/
}
.notification-item.active {
	-webkit-animation: notification-open .3s 1;
	animation: notification-open .3s 1;
	/*transform: translate(-50%, 0); // [ Ron 🌵 24.04.2026] Safari bugfix */
	opacity: 1;
}
.notification-item.active.out {
	-webkit-animation: notification-close .35s 1;
	animation: notification-close .35s 1;
	transform: translate(-100%, 0);
	opacity: 0;
}
@keyframes notification-open {
	0% {
		-webkit-transform: translate(0, 0) scale(.7,.7);
		-ms-transform: translate(0, 0) scale(.7,.7);
		transform: translate(0, 0) scale(.7,.7);
		opacity: 0;
	}
	1% { /*safari flicker bug fix*/
		opacity: .6;
	}
	100% {
		-webkit-transform: translate(-50%, 0) scale(1,1);
		-ms-transform: translate(-50%, 0) scale(1,1);
		transform: translate(-50%, 0) scale(1,1);
		opacity: 1;
	}
}
@keyframes notification-close {
	0% {
		-webkit-transform: translate(-50%, 0) scale(1,1);
		-ms-transform: translate(-50%, 0) scale(1,1);
		transform: translate(-50%, 0) scale(1,1);
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(-100%, 0) scale(.8,.8);
		-ms-transform: translate(-100%, 0) scale(.8,.8);
		transform: translate(-100%, 0) scale(.8,.8);
		opacity: 0;
	}
}

.notification-item:nth-child(2) {top: 90px}
.notification-item:nth-child(3) {top: 150px}
.notification-item:nth-child(4) {top: 210px}
.notification-item:nth-child(5) {top: 270px}

.notification-item .notification-icon {top: 16px; left: 24px}
.notification-item .close-icon-wrap {padding: 13px 20px 13px 18px}
.notification-item .close-icon {background: rgba(255, 255, 255, 0); width: 22px; height: 22px;}
.notification-item .close-icon:hover {background: rgba(255, 255, 255, 0.2)}

.notification-item .fillbar-wrap {height: 2px}
.notification-item .fillbar-wrap.inactive {height: 0}
.notification-item .fillbar {
	background-image: linear-gradient(rgba(27, 201, 141, 1), rgba(27, 201, 141, 1));
	background-size: 100% 100%;
	background-position: left;
	background-repeat: no-repeat;
	transition-property: all;
	transition-duration: 2s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
	-webkit-backface-visibility: hidden;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: translate3d(0, 0, 0);
}

.notification-item.none {padding-left: 30px;}
.notification-item.none .fillbar {background-image: linear-gradient(rgba(255, 255, 255, .7), rgba(255, 255, 255, .7))}
.notification-item.error .notification-icon {left: 25px}
.notification-item.info .fillbar {background-image: linear-gradient(rgba(3, 144, 243, 1), rgba(3, 144, 243, 1))}
.notification-item.error .fillbar {background-image: linear-gradient(rgba(255, 81, 81, 1), rgba(255, 81, 81, 1))}
.notification-item.warn .fillbar {background-image: linear-gradient(rgba(255, 187, 89, 1), rgba(255, 187, 89, 1))}

/*-------------------*/