#divAppEditProfile
{
    background-color:rgba(0, 0, 0, 0.75);
	display:none;
    height:100%;
    left:0%;
    opacity:0;
    position:fixed;
    top:0%;
    width:100%;
    z-index:5;
}

#divAppEditProfile.show
{
    animation-duration:0.25s;
	animation-name:showEditProfile;
	display:block;
	opacity:1;
}

#divAppEditProfile #divEditProfilePopup
{
    background-color:#1b1c20;
    border-radius:10px;
	box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75), 0px 0px 50px #000000;
	height:auto;
    left:50%;
    opacity:0;
	overflow:hidden;
	padding:30px;
	position:absolute;
	top:50%;
	transform:translate(-50%, -50%);
	transition:height 0.25s;
	width:480px;
}

#divAppEditProfile.show #divEditProfilePopup
{
    animation-duration:0.25s;
	animation-name:showEditProfile;
	opacity:1;
}

#divAppEditProfile.changePassword #divEditProfilePopup
{
	height:640px;
}

#divAppEditProfile.documents #divEditProfilePopup
{
	height:auto;
	max-height:calc(100vh - 60px);
	overflow-y:auto;
}

#divAppEditProfile .h3PopupHeading
{
    height:40px;
	line-height:40px;
    margin-bottom:15px;
}

#divAppEditProfile .h3PopupHeading:before
{
	background-image:url('../images/icons/profile.svg');
    background-position:center left;
	background-repeat:no-repeat;
    background-size:80%;
	content:"";
	float:left;
	height:40px;
	line-height:40px;
	margin-right:5px;
	opacity:0.5;
    width:40px;
}

#divAppEditProfile #btnClosePopup
{
	cursor:pointer;
	height:40px;
	position:absolute;
	right:20px;
	top:20px;
	width:40px;
}

#divAppEditProfile #btnClosePopup:before
{
	background-color:#3f4656;
	content:"";
	height:2px;
	left:8px;
	position:absolute;
	top:20px;
	transform:rotate(45deg);
    transition:background-color 0.25s, box-shadow 0.25s;
	width:24px;
}

#divAppEditProfile #btnClosePopup:after
{
	background-color:#3f4656;
	content:"";
	height:2px;
	left:8px;
	position:absolute;
	top:20px;
	transform:rotate(-45deg);
    transition:background-color 0.25s, box-shadow 0.25s;
	width:24px;
}

#divAppEditProfile #btnClosePopup:hover:before, #divAppEditProfile #btnClosePopup:focus:before, #divAppEditProfile #btnClosePopup:hover:after, #divAppEditProfile #btnClosePopup:focus:after
{
    background-color:#fbd3ff;
    box-shadow:0px 0px 5px #e600ff;
}

#divAppEditProfile .divChangeDetails, #divAppEditProfile .divChangePassword, #divAppEditProfile .divDocuments, #divAppEditProfile .divBankAccounts, #divAppEditProfile .divResponsibleGambling
{
	display:none;
}

#divAppEditProfile.changeDetails .divChangeDetails, #divAppEditProfile.changePassword .divChangePassword, #divAppEditProfile.documents .divDocuments, #divAppEditProfile.bankAccounts .divBankAccounts, #divAppEditProfile.responsibleGambling .divResponsibleGambling
{
	display:block;
}

/* BANK ACCOUNTS TAB */
#divAppEditProfile.bankAccounts #divEditProfilePopup
{
	height:auto;
	max-height:calc(100vh - 60px);
	overflow-y:auto;
}

#divAppEditProfile .divBankAccounts h4
{
	margin-bottom:15px;
}

#divAppEditProfile .divBankAccountRow
{
	align-items:center;
	background-color:#23242a;
	border:1px solid #3f4656;
	border-radius:10px;
	display:flex;
	gap:10px;
	justify-content:space-between;
	margin-bottom:10px;
	padding:12px 14px;
}

#divAppEditProfile .divBankAccountLabel
{
	color:#ffffff;
	flex:1;
	font-size:14px;
}

#divAppEditProfile .divBankAccountBadge
{
	border-radius:999px;
	font-size:12px;
	font-weight:600;
	padding:3px 10px;
	white-space:nowrap;
}

#divAppEditProfile .divBankAccountBadge.verified
{
	background-color:rgba(46,204,113,0.15);
	color:#2ecc71;
}

#divAppEditProfile .divBankAccountBadge.pending
{
	background-color:rgba(136,139,144,0.18);
	color:#b8bbc0;
}

#divAppEditProfile .divBankAccountStatus
{
	font-size:13px;
	white-space:nowrap;
}

#divAppEditProfile .divBankAccountStatus.pending
{
	color:#e0b341;
}

#divAppEditProfile .divBankAccountStatus.rejected
{
	color:#ff6b6b;
}

#divAppEditProfile .divBankAccountStatus.failed
{
	color:#ff6b6b;
}

#divAppEditProfile .btnUploadBankDocument
{
	color:#01eff9;
	cursor:pointer;
	font-size:13px;
	white-space:nowrap;
}

#divAppEditProfile .btnUploadBankDocument:hover
{
	text-decoration:underline;
}

#divAppEditProfile .btnRemoveBankAccount
{
	color:#ff6b6b;
	cursor:pointer;
	font-size:16px;
	/* Keep the 16px glyph but give a ~40px touch target; negative margins absorb the
	   extra box so the row doesn't grow. */
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:40px;
	min-height:40px;
	margin:-8px -8px -8px 0;
}

#divAppEditProfile .btnRemoveBankAccount:hover
{
	opacity:0.8;
}

#divAppEditProfile .divBankAccountEmpty
{
	color:#888b90;
	font-size:14px;
	margin-bottom:15px;
	text-align:center;
}

#divAppEditProfile #divBankAccountAdd
{
	display:flex;
	flex-direction:column;
	gap:10px;
}

#divAppEditProfile #btnAddBankAccountProfile
{
	margin-top:15px;
}

#divAppEditProfile .divBankAcctTypeLabel
{
	color:#888b90;
	font-size:14px;
}

#divAppEditProfile .divBankAcctTypes
{
	display:flex;
	gap:15px;
}

#divAppEditProfile .divBankAcctTypes .radioButton
{
	flex:1;
}

/* CHANGE DETAILS */
#divAppEditProfile #txtEmailAddress, #divAppEditProfile #txtMobileNumber
{
	margin-top:10px;
}

#divAppEditProfile #divPushNotifications
{
	font-size:13px;
	margin:10px 0px 10px 10px;
}

#divAppEditProfile #btnPushNotifications
{
	display:none;
}

#divAppEditProfile #btnPushNotifications.show
{
	display:inline-block;
}

#divAppEditProfile #divQuickSignIn
{
	font-size:13px;
	margin:10px 0px 10px 10px;
}

#divAppEditProfile #btnClearQuickSignIn
{
	display:none;
}

#divAppEditProfile #btnClearQuickSignIn.show
{
	display:inline-block;
}

#divAppEditProfile .divHr
{
	height:1px;
	background-color:#888b90;
	margin:15px 0px;
}

.progressiveWebApplication #divAppEditProfile .divHr, .progressiveWebApplication #divAppEditProfile #btnInstallAsApplication, .iosApplication #divAppEditProfile #btnInstallAsApplication
{
	display:none;
}

/* CHANGE PASSWORD */
#divAppEditProfile .otp-timer
{
	background-color:rgba(255, 255, 255, 0.1);
	border-radius:5px;
	clear:both;
	color:#01eff9;
	font-size:14px;
	margin:15px 0px 10px;
	padding:10px 15px;
	text-align:center;
}

#divAppEditProfile .otp-timer.warning
{
	background-color:rgba(255, 193, 7, 0.15);
	color:#ffc107;
}

#divAppEditProfile .otp-timer.expired
{
	background-color:rgba(255, 68, 68, 0.15);
	color:#ff4444;
}

#divAppEditProfile #txtEnterOtp
{
	clear:both;
	margin:10px 0px;
	text-align:center;
	width:100%;
}

#divAppEditProfile #btnSendOtp
{
	clear:both;
	display:block;
	margin:0 auto 15px;
	width:auto;
}

#divAppEditProfile #btnSendOtp.disabled
{
	background-color:#3f4656;
	color:#888b90;
	cursor:not-allowed;
	opacity:0.7;
}

#divAppEditProfile #divDocumentNotes
{
    clear:both;
}

#divAppEditProfile.hasDocuments #divDocumentNotes
{
    display:none;
}

#divAppEditProfile #divDocumentNotes p
{
    margin-top:15px;
}

#divAppEditProfile #txtOldPassword, #divAppEditProfile #txtNewPassword
{
	clear:both;
	padding-top:10px;
}

#divAppEditProfile #btnUpdatePassword
{
	margin-top:30px;
	width:100%;
}

/* DOCUMENTS */
#divAppEditProfile .divVerificationAlert
{
	background-color:#292a2f;
	border:2px solid #3f4656;
	border-radius:10px;
	color:#ffffff;
	margin-bottom:15px;
	padding:5px 10px;
}

#divAppEditProfile .divVerificationAlert p
{
	color:#888b90;
	font-size:14px;
}

#divAppEditProfile .divFicaCard
{
	background-color:#23242a;
	border:1px solid #3f4656;
	border-radius:12px;
	margin-bottom:12px;
	overflow:hidden;
}

#divAppEditProfile .divFicaCardHeader
{
	align-items:center;
	border-bottom:1px solid #3f4656;
	display:flex;
	justify-content:space-between;
	padding:14px 16px;
}

#divAppEditProfile .divFicaCardTitle
{
	color:#ffffff;
	font-size:15px;
	font-weight:600;
}

#divAppEditProfile .divFicaBadge
{
	border-radius:999px;
	font-size:12px;
	font-weight:600;
	padding:3px 10px;
	white-space:nowrap;
}

#divAppEditProfile .divFicaBadge.ficaBadgeOk
{
	background-color:rgba(46,204,113,0.15);
	color:#2ecc71;
}

#divAppEditProfile .divFicaBadge.ficaBadgePending
{
	background-color:rgba(136,139,144,0.18);
	color:#b8bbc0;
}

#divAppEditProfile .divFicaCardBody
{
	display:flex;
	flex-direction:column;
	gap:10px;
	padding:16px;
}

#divAppEditProfile #divFicaIdForm
{
	align-items:center;
	flex-direction:row;
}

#divAppEditProfile #divFicaBankSummaryText,
#divAppEditProfile #divFicaIdSummary
{
	color:#ffffff;
	font-size:14px;
}

#divAppEditProfile #btnFicaChangeBank,
#divAppEditProfile #btnFicaCancelBank
{
	align-self:stretch;
	background:none;
	border:1px solid #3f4656;
	border-radius:10px;
	box-shadow:none;
	box-sizing:border-box;
	cursor:pointer;
	font-family:"Jost", sans-serif;
	font-size:14px;
	height:auto;
	line-height:normal;
	padding:11px;
	text-align:center;
	transition:border-color 0.2s, color 0.2s;
}

#divAppEditProfile #btnFicaChangeBank:hover,
#divAppEditProfile #btnFicaCancelBank:hover
{
	border-color:#6c5ce7;
	color:#ffffff;
}

#divAppEditProfile #txtFicaIdNumber,
#divAppEditProfile #divFicaBankForm select,
#divAppEditProfile #divFicaBankForm input
{
	background-color:#292a2f;
	border:2px solid #3f4656;
	border-radius:10px;
	box-sizing:border-box;
	color:#ffffff;
	padding:10px;
	width:100%;
}

#divAppEditProfile #txtFicaIdNumber
{
	flex:1;
	width:auto;
}

#divAppEditProfile #btnFicaVerifyId
{
	flex:none;
	width:105px;
}

#divAppEditProfile #btnFicaVerifyBank
{
	width:100%;
}

#divAppEditProfile .divRow
{
	display:flex;
	height:56px;
	line-height:56px;
	min-width:fit-content;
	position:relative;
	transition:height 0.25s;
	white-space:nowrap;
}

#divAppEditProfile .divRow:nth-child(2n)
{
	border-radius:10px;
	background-color:#292a2f;
}

#divAppEditProfile .divCell
{
	display:inline-block;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#divAppEditProfile .divCell:nth-child(1)
{
	min-width:200px;
	padding-left:20px;
	width:calc(100% - 140px);
}

#divAppEditProfile .divCell:nth-child(2)
{
	padding-left:20px;
	width:120px;
}

/* RESPONSIBLE GAMBLING */
#divAppEditProfile .divResponsibleGambling h4
{
	color:#01eff9;
	margin-bottom:10px;
}

#divAppEditProfile .divResponsibleGambling p
{
	color:#888b90;
	font-size:14px;
	line-height:1.5;
	margin-bottom:15px;
}

#divAppEditProfile .divResponsibleGambling p a
{
	color:#01eff9;
}

#divAppEditProfile #divClosureOptions
{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-bottom:15px;
}

#divAppEditProfile .btnClosure
{
	flex:1;
	min-width:0;
	padding:0px 5px;
}

#divAppEditProfile .divClosureActive
{
	background-color:rgba(255, 193, 7, 0.15);
	border-radius:8px;
	color:#ffc107;
	font-size:14px;
	margin-bottom:15px;
	padding:15px;
}

#divAppEditProfile .divResponsibleGambling .textSmall
{
	color:#666;
	font-size:12px;
}

/* ACCOUNT CLOSURE — REASON PICKER (rendered inside the confirm dialog) */
#divAppAlert .divClosureReasons
{
	border-top:1px solid rgba(255, 255, 255, 0.08);
	margin-top:20px;
	padding-top:18px;
	text-align:left;
}

#divAppAlert .divClosureReasons .closureReasonHeading
{
	color:#01eff9;
	font-size:15px;
	font-weight:600;
	margin:0px 0px 12px;
}

#divAppAlert .divClosureReasons .closureReasonOptional
{
	color:#888b90;
	font-size:12px;
	font-weight:400;
}

#divAppAlert .divClosureReasons .closureReasonOption
{
	align-items:center;
	background-color:rgba(255, 255, 255, 0.03);
	border:1px solid rgba(255, 255, 255, 0.08);
	border-radius:8px;
	box-sizing:border-box;
	color:#c7cace;
	cursor:pointer;
	display:flex;
	font-size:14px;
	gap:12px;
	margin-bottom:8px;
	padding:11px 14px;
	transition:border-color 0.15s, background-color 0.15s, color 0.15s;
	width:100%;
}

#divAppAlert .divClosureReasons .closureReasonOption:hover
{
	background-color:rgba(255, 255, 255, 0.06);
	border-color:rgba(1, 239, 249, 0.4);
}

#divAppAlert .divClosureReasons .closureReasonOption.selected,
#divAppAlert .divClosureReasons .closureReasonOption:has(input:checked)
{
	background-color:rgba(1, 239, 249, 0.08);
	border-color:#01eff9;
	color:#ffffff;
}

/* Custom brand radio indicator (replaces the default browser circle) */
#divAppAlert .divClosureReasons .closureReasonOption input
{
	-webkit-appearance:none;
	appearance:none;
	background:transparent;
	border:2px solid rgba(255, 255, 255, 0.35);
	border-radius:50%;
	box-sizing:border-box;
	cursor:pointer;
	flex:0 0 auto;
	height:18px;
	margin:0px;
	width:18px;
}

#divAppAlert .divClosureReasons .closureReasonOption input:checked
{
	background-color:#01eff9;
	border-color:#01eff9;
	box-shadow:inset 0px 0px 0px 3px #1b1c20;
}

#divAppAlert .divClosureReasons .closureReasonOther
{
	background-color:rgba(255, 255, 255, 0.05);
	border:1px solid rgba(255, 255, 255, 0.15);
	border-radius:8px;
	box-sizing:border-box;
	color:#ffffff;
	display:block;
	font-size:14px;
	margin-top:4px;
	padding:11px 14px;
	width:100%;
}

#divAppAlert .divClosureReasons .closureReasonOther::placeholder
{
	color:#6f7378;
}

#divAppAlert .divClosureReasons .closureReasonOther:focus
{
	border-color:#01eff9;
	box-shadow:0px 0px 0px 2px rgba(1, 239, 249, 0.25);
	outline:none;
}

#divAppAlert .divClosureReasonAlert
{
	color:#ff6b6b;
	font-size:13px;
	margin-top:10px;
}

/* ACCOUNT CLOSURE — FORFEIT WARNING POPUP (shown before the survey when cashback is waiting) */
#divAppAlert .divClosureForfeit
{
	text-align:center;
}

#divAppAlert .divClosureForfeit .closureForfeitIcon
{
	display:inline-block;
	margin-bottom:14px;
	position:relative;
}

#divAppAlert .divClosureForfeit .closureForfeitIcon img
{
	height:64px;
	width:64px;
}

/* Red warning badge over the wallet, echoing the mock */
#divAppAlert .divClosureForfeit .closureForfeitIcon .fa
{
	bottom:-6px;
	color:#ff4444;
	font-size:22px;
	position:absolute;
	right:-10px;
	text-shadow:0px 0px 6px rgba(0, 0, 0, 0.6);
}

#divAppAlert .divClosureForfeit .closureForfeitHeading
{
	color:#ffffff;
	font-size:20px;
	font-weight:600;
	margin:0px 0px 12px;
}

#divAppAlert .divClosureForfeit p
{
	color:#c7cace;
	font-size:14px;
	line-height:1.5;
	margin:0px 0px 12px;
}

#divAppAlert .divClosureForfeit p:last-child
{
	margin-bottom:0px;
}

#divAppAlert .divClosureForfeit .closureForfeitAmount
{
	color:#3ddc97;
	font-weight:700;
}

/* ACCOUNT CLOSURE — SURVEY POPUP heading + "during this time" list */
#divAppAlert .closureSurveyHeading
{
	color:#ffffff;
	font-size:20px;
	font-weight:600;
	margin:0px 0px 14px;
}

#divAppAlert .closureSurveyDuring
{
	font-weight:600;
	margin-bottom:6px;
}

#divAppAlert .closureSurveyList
{
	margin:0px;
	padding-left:20px;
	text-align:left;
}

#divAppAlert .closureSurveyList li
{
	color:#c7cace;
	font-size:14px;
	line-height:1.5;
}

/* Reason picker — mobile */
@media (max-width: 500px)
{
	#divAppAlert .divClosureReasons
	{
		margin-top:16px;
		padding-top:14px;
	}

	#divAppAlert .divClosureReasons .closureReasonHeading
	{
		font-size:14px;
		margin-bottom:10px;
	}

	#divAppAlert .divClosureReasons .closureReasonOption
	{
		font-size:13px;
		gap:10px;
		padding:11px 12px;
	}

	#divAppAlert .divClosureReasons .closureReasonOther
	{
		font-size:13px;
		padding:11px 12px;
	}
}

/* ANIMATION KEY FRAMES */
@keyframes showEditProfile
{
	0%   {opacity:0;}
	1%   {opacity:0;}
	100% {opacity:1;}
}

/* MEDIA QUERIES */
@media (max-height: 654px)
{
    #divAppEditProfile.documents #divEditProfilePopup
    {
        height:calc(100% - 100px);
        overflow-y:auto;
        top:20px;
		transform:translate(-50%, 0%);
    }
}

@media (max-height: 574px)
{
    #divAppEditProfile.changePassword #divEditProfilePopup
    {
        height:calc(100% - 100px);
        overflow-y:auto;
        top:20px;
		transform:translate(-50%, 0%);
    }
}

@media (max-height: 474px)
{
    #divAppEditProfile #divEditProfilePopup
    {
        height:calc(100% - 100px);
        overflow-y:auto;
        top:20px;
		transform:translate(-50%, 0%);
    }
}

@media (max-width: 540px)
{
    #divAppEditProfile
	{
		display:block;
		opacity:1;
		transform:translate(-100%, 0%);
		transition:transform 0.25s;
	}

	#divAppEditProfile.show
	{
		animation:none;
		transform:translate(0%, 0%);
	}

	#divAppEditProfile #divEditProfilePopup, #divAppEditProfile.changePassword #divEditProfilePopup
    {
        box-shadow:none;
        border-radius:0px;
        height:calc(100% - 120px);
        left:0%;
		opacity:1;
        overflow-y:auto;
		padding:20px 20px 100px;
        top:0%;
        transform:translate(0%, 0%);
        width:calc(100% - 40px);
    }

	#divAppEditProfile.show #divEditProfilePopup
	{
		animation:none;
	}

	#divAppEditProfile #btnClosePopup
	{
		right:15px;
		top:15px;
	}

	#divAppEditProfile #btnClosePopup:before, #divAppEditProfile #btnClosePopup:after
    {
        background-color:#fbd3ff;
        box-shadow:0px 0px 5px #e600ff;
    }

	#divAppEditProfile #divDocuments
	{
		max-height:auto;
	}
}

@media (max-width: 420px)
{
    #divAppEditProfile #divEditProfilePopup
    {
        height:calc(100% - 115px);
        padding:15px 15px 100px;
        width:calc(100% - 70px);
    }

	#divAppEditProfile #btnClosePopup
	{
		right:10px;
		top:10px;
	}

	#divAppEditProfile #txtEnterOtp
	{
		width:100%;
	}
}