/* PetsMunity creation authentication + phone verification gate */
html.pm-gate-open,
html.pm-gate-open body{
	overflow:hidden!important;
}

body.pm-creation-gate-pending .pm-main{
	visibility:hidden!important;
}

.pm-gate-auto-phone{
	display:none!important;
}

.pm-gate-overlay{
	position:fixed!important;
	inset:0!important;
	z-index:2147483000!important;
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	padding:20px!important;
}

.pm-gate-backdrop{
	position:absolute!important;
	inset:0!important;
	background:rgba(15,31,45,.72)!important;
	backdrop-filter:blur(1.5px)!important;
}

.pm-gate-dialog{
	position:relative!important;
	z-index:1!important;
	width:min(430px,100%)!important;
	max-height:min(720px,calc(100vh - 40px))!important;
	overflow:auto!important;
	box-sizing:border-box!important;
	padding:34px 30px 28px!important;
	border:1px solid #e0e8ed!important;
	border-radius:10px!important;
	background:#fff!important;
	box-shadow:0 26px 80px rgba(8,28,42,.28)!important;
	color:#17324d!important;
}

.pm-gate-close{
	position:absolute!important;
	top:12px!important;
	right:14px!important;
	width:36px!important;
	height:36px!important;
	display:grid!important;
	place-items:center!important;
	border:0!important;
	background:transparent!important;
	color:#263a4c!important;
	font-size:28px!important;
	line-height:1!important;
	cursor:pointer!important;
}

.pm-gate-logo{
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	gap:5px!important;
	margin:8px 0 30px!important;
	color:#17324d!important;
	font-size:29px!important;
	line-height:1!important;
	font-weight:850!important;
}

.pm-gate-logo strong{
	margin-left:7px!important;
	letter-spacing:-1px!important;
}

.pm-gate-logo strong span{
	color:#0da999!important;
}

.pm-gate-logo-dot{
	display:inline-block!important;
	width:13px!important;
	height:13px!important;
	border-radius:50%!important;
}

.pm-gate-logo-dot.a{background:#17324d!important}
.pm-gate-logo-dot.b{background:#0da999!important;margin-top:-13px!important}
.pm-gate-logo-dot.c{background:#ff765c!important;margin-left:-8px!important;margin-top:14px!important}

.pm-gate-dialog h2{
	margin:0 0 28px!important;
	color:#172b3f!important;
	font-size:24px!important;
	line-height:1.25!important;
	text-align:center!important;
	font-weight:800!important;
}

.pm-gate-copy{
	margin:-8px 0 23px!important;
	color:#394d60!important;
	font-size:15px!important;
	line-height:1.55!important;
}

.pm-gate-center{
	text-align:center!important;
}

.pm-gate-choice-stack{
	display:grid!important;
	gap:10px!important;
}

.pm-gate-choice{
	width:100%!important;
	min-height:46px!important;
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	gap:10px!important;
	padding:9px 15px!important;
	border:1.5px solid #0da999!important;
	border-radius:7px!important;
	background:#fff!important;
	color:#17324d!important;
	font-size:15px!important;
	font-weight:750!important;
	cursor:pointer!important;
	transition:background .15s ease,border-color .15s ease,transform .15s ease!important;
}

.pm-gate-choice:hover:not(:disabled){
	background:#f1fbf9!important;
	transform:translateY(-1px)!important;
}

.pm-gate-choice:disabled{
	border-color:#d9e3e8!important;
	color:#95a2ad!important;
	background:#fafcfd!important;
	cursor:not-allowed!important;
}

.pm-gate-choice-icon{
	font-size:20px!important;
	line-height:1!important;
	color:#0da999!important;
}

.pm-gate-google{
	font-weight:900!important;
	color:#4285f4!important;
	font-size:18px!important;
}

.pm-gate-facebook{
	display:inline-grid!important;
	place-items:center!important;
	width:20px!important;
	height:20px!important;
	border-radius:50%!important;
	background:#1877f2!important;
	color:#fff!important;
	font-weight:900!important;
	font-size:14px!important;
}

.pm-gate-or{
	position:relative!important;
	margin:20px 0!important;
	text-align:center!important;
	color:#65788a!important;
	font-size:13px!important;
}

.pm-gate-or:before{
	content:""!important;
	position:absolute!important;
	left:0!important;
	right:0!important;
	top:50%!important;
	height:1px!important;
	background:#e5ebef!important;
}

.pm-gate-or span{
	position:relative!important;
	z-index:1!important;
	display:inline-block!important;
	padding:0 12px!important;
	background:#fff!important;
}

.pm-gate-create{
	width:100%!important;
	margin-top:26px!important;
	border:0!important;
	background:transparent!important;
	color:#0da999!important;
	font-size:14px!important;
	font-weight:800!important;
	cursor:pointer!important;
}

.pm-gate-provider-note{
	margin:10px 0 -3px!important;
	color:#8a98a5!important;
	font-size:11px!important;
	line-height:1.4!important;
	text-align:center!important;
}

.pm-gate-label{
	display:block!important;
	margin:0 0 7px!important;
	color:#273d52!important;
	font-size:13px!important;
	font-weight:750!important;
}

.pm-gate-phone-row{
	display:grid!important;
	grid-template-columns:112px minmax(0,1fr)!important;
	gap:8px!important;
	margin-bottom:18px!important;
}

.pm-gate-country,
.pm-gate-phone{
	width:100%!important;
	height:48px!important;
	box-sizing:border-box!important;
	border:1px solid #d7e1e8!important;
	border-radius:7px!important;
	background:#fff!important;
	color:#17324d!important;
	font-size:15px!important;
	outline:none!important;
}

.pm-gate-country{
	padding:0 10px!important;
}

.pm-gate-phone{
	padding:0 13px!important;
}

.pm-gate-country:focus,
.pm-gate-phone:focus{
	border-color:#0da999!important;
	box-shadow:0 0 0 3px rgba(13,169,153,.11)!important;
}

.pm-gate-primary,
.pm-gate-secondary{
	width:100%!important;
	min-height:47px!important;
	display:flex!important;
	align-items:center!important;
	justify-content:center!important;
	padding:10px 15px!important;
	border-radius:7px!important;
	font-size:14px!important;
	font-weight:800!important;
	cursor:pointer!important;
}

.pm-gate-primary{
	border:1px solid #0da999!important;
	background:#0da999!important;
	color:#fff!important;
}

.pm-gate-primary:disabled{
	opacity:.6!important;
	cursor:wait!important;
}

.pm-gate-secondary{
	margin-top:9px!important;
	border:1px solid #d7e1e8!important;
	background:#fff!important;
	color:#17324d!important;
}

.pm-gate-otp{
	display:grid!important;
	grid-template-columns:repeat(6,1fr)!important;
	gap:8px!important;
	margin:26px 0 24px!important;
}

.pm-gate-otp input{
	width:100%!important;
	min-width:0!important;
	height:58px!important;
	box-sizing:border-box!important;
	border:1px solid #d4dee5!important;
	border-radius:7px!important;
	background:#fff!important;
	color:#17324d!important;
	font-size:24px!important;
	font-weight:800!important;
	text-align:center!important;
	outline:none!important;
}

.pm-gate-otp input:focus{
	border-color:#0da999!important;
	box-shadow:0 0 0 3px rgba(13,169,153,.10)!important;
}

.pm-gate-status{
	min-height:19px!important;
	margin-top:12px!important;
	font-size:12px!important;
	line-height:1.45!important;
	text-align:center!important;
}

.pm-gate-status.is-error{color:#c33e38!important}
.pm-gate-status.is-success{color:#087c70!important}

@media(max-width:560px){
	.pm-gate-overlay{
		padding:0!important;
		align-items:flex-end!important;
	}
	.pm-gate-dialog{
		width:100%!important;
		max-height:92vh!important;
		padding:30px 20px 24px!important;
		border-radius:16px 16px 0 0!important;
	}
	.pm-gate-dialog h2{
		font-size:22px!important;
	}
	.pm-gate-phone-row{
		grid-template-columns:104px minmax(0,1fr)!important;
	}
	.pm-gate-otp{
		gap:5px!important;
	}
	.pm-gate-otp input{
		height:52px!important;
		font-size:21px!important;
	}
}

/* Account > Settings > Phone Number */
.pm-phone-settings-page{
	padding:34px 0 64px;
	background:#fff;
	min-height:520px;
}
.pm-phone-settings-head{
	padding:4px 0 22px;
	border-bottom:1px solid #e5ebf0;
}
.pm-phone-settings-kicker{
	margin-bottom:6px;
	color:#0da999;
	font-size:11px;
	font-weight:800;
	letter-spacing:.08em;
}
.pm-phone-settings-head h1{
	margin:0 0 7px!important;
	color:#17324d!important;
	font-size:32px!important;
	line-height:1.2!important;
}
.pm-phone-settings-head p{
	margin:0!important;
	color:#6b7280!important;
	font-size:14px!important;
}
.pm-phone-settings-layout{
	display:grid;
	grid-template-columns:220px minmax(0,760px);
	gap:24px;
	align-items:start;
	padding-top:24px;
}
.pm-phone-settings-nav{
	border:1px solid #e5ebf0;
	border-radius:9px;
	background:#fff;
	padding:8px;
}
.pm-phone-settings-nav a{
	display:block;
	padding:11px 12px;
	border-radius:7px;
	text-decoration:none!important;
	color:#42586d!important;
	font-size:14px;
	font-weight:650;
}
.pm-phone-settings-nav a.is-active{
	background:#f2f6f8;
	color:#17324d!important;
	font-weight:800;
}
.pm-phone-settings-card{
	border:1px solid #e5ebf0;
	border-radius:10px;
	background:#fff;
	padding:24px;
}
.pm-phone-settings-card-head{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:20px;
	margin-bottom:20px;
}
.pm-phone-settings-card h2{
	margin:0 0 6px!important;
	color:#17324d!important;
	font-size:22px!important;
}
.pm-phone-settings-card-head p{
	margin:0!important;
	color:#6b7280!important;
}
.pm-phone-settings-current{
	display:grid;
	grid-template-columns:44px minmax(0,1fr) auto;
	gap:13px;
	align-items:center;
	padding:16px;
	border:1px solid #e3e9ed;
	border-radius:9px;
	background:#fbfcfd;
}
.pm-phone-settings-icon{
	display:grid;
	place-items:center;
	width:44px;
	height:44px;
	border-radius:10px;
	background:#eaf8f6;
	color:#0da999;
	font-size:19px;
}
.pm-phone-settings-meta span{
	display:block;
	margin-bottom:3px;
	color:#798896;
	font-size:12px;
}
.pm-phone-settings-meta strong{
	color:#17324d;
	font-size:16px;
	font-weight:800;
}
.pm-phone-settings-badge{
	display:inline-flex;
	align-items:center;
	padding:6px 9px;
	border-radius:999px;
	font-size:11px;
	font-weight:800;
}
.pm-phone-settings-badge.is-verified{
	background:#e9f7f4;
	color:#087c70;
}
.pm-phone-settings-badge.is-unverified{
	background:#fff1e8;
	color:#b45309;
}
.pm-phone-settings-note{
	margin:16px 0;
	padding:12px 14px;
	border-radius:8px;
	background:#f6f8fa;
	color:#5f7182;
	font-size:13px;
	line-height:1.55;
}
.pm-phone-settings-change{
	min-width:180px;
}
@media(max-width:760px){
	.pm-phone-settings-page{padding:24px 0 48px}
	.pm-phone-settings-layout{grid-template-columns:1fr}
	.pm-phone-settings-nav{display:flex}
	.pm-phone-settings-nav a{flex:1}
	.pm-phone-settings-current{grid-template-columns:42px 1fr}
	.pm-phone-settings-badge{grid-column:2}
	.pm-phone-settings-card{padding:18px}
}