/* ===========================================================
   SCC — INLINE WHATSAPP OTP LOGIN
=========================================================== */

.scc-otp-inline{
	margin: 18px 0;
	padding: 0;                /* remove card padding */
	background: transparent;   /* blend with Woo form */
	border: 0;                 /* remove border */
	border-radius: 0;
	box-shadow: none;
}

.scc-otp-head{
	margin-bottom: 14px;
	padding-bottom: 6px;
}

.scc-otp-title{
	font-size: 15px;
	font-weight: 700;
	color: #222;
}

.scc-otp-sub{
	font-size: 13px;
	line-height: 1.4;
	color: #666;
}

.scc-otp-field label{
	display:block;
	font-weight: 600;
	font-size: 13px;
	color: #222;
	margin-bottom: 6px;
}

.scc-otp-inline input[type="tel"],
.scc-otp-inline input[type="text"]{
	width: 100%;
	padding: 10px 12px;
	background: #fff;
	border: 1px solid #d6d6d6;
	border-radius: 10px;
	box-sizing: border-box;
	font-size: 14px;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.scc-otp-inline input:focus{
	outline: none;
	border-color: rgba(37,211,102,.75);
	box-shadow: 0 0 0 3px rgba(37,211,102,.15);
}

/* OTP code field: spaced digits vibe */
.scc-otp-code{
	letter-spacing: .25em;
	font-weight: 700;
	text-align: left;
}

/* Actions */
.scc-otp-actions{
	display:flex;
	gap: 12px;
	align-items:flex-start;
	flex-wrap:wrap;
	margin-top: 12px;
}

/* Normalize Woo .button padding differences */
.scc-otp-actions .button{
	height: 40px;
	padding: 0 14px !important;
	font-size: 14px !important;
	border-radius: 10px !important;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	white-space:nowrap;
	line-height:1 !important;
	min-width: 140px;
}

/* Primary / Secondary */
.scc-btn-primary{
	background: #25d366 !important;
	border: 1px solid #1fb457 !important;
	color: #fff !important;
}

.scc-btn-primary:hover{
	filter: brightness(.98);
}

.scc-btn-secondary{
	background: #f3f4f6 !important;
	border: 1px solid #d6d6d6 !important;
	color: #222 !important;
}

.scc-btn-secondary:hover{
	background: #eef0f3 !important;
}

/* Resend wrapper */
.scc-otp-resend-wrap{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	min-width: 140px;
}

.scc-otp-resend-hint{
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.25;
	color: #6b6b6b;
}

/* Disabled resend */
.scc-otp-resend[disabled]{
	opacity: .55;
	cursor: not-allowed;
}

/* intl-tel-input */
.intl-tel-input{ width:100% !important; }
.intl-tel-input input{ padding-left: 52px !important; }

/* Messages: Woo-like notice style */
.scc-otp-msg{
	margin-top: 12px;
	font-size: 13px;
}

.scc-otp-msg.ok{
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	color: #166534;
	padding: 10px 12px;
	border-radius: 10px;
	font-weight: 600;
}

.scc-otp-msg.err{
	background: #fef2f2;
	border: 1px solid #fecaca;
	color: #991b1b;
	padding: 10px 12px;
	border-radius: 10px;
	font-weight: 600;
}

/* Force Step 2 show when activated */
.scc-otp-inline.scc-otp-step2-on .scc-otp-step2{ display:block !important; }
.scc-otp-inline.scc-otp-step2-on .scc-otp-resend-wrap{ display:flex !important; }

/* Mobile */
@media (max-width: 480px){
	.scc-otp-actions .button{
		height: 44px;
		min-width: 100%;
	}
	.scc-otp-resend-wrap{ min-width: 100%; }
}

/* OR separator (like Woo screenshot) */
.scc-or-sep{
	display:flex;
	align-items:center;
	font-weight:700;
	font-size:17px;
	color:#3c434a;
}
.scc-or-sep::before,
.scc-or-sep::after{
	content:"";
	flex:1;
	padding:1px;
	background-color:#ececec;
	margin:5px;
}