/* SmartCertify styles */
@font-face {
    font-family: 'Samarata';
    src: url('../font/Samarata.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* SmartCertify styles - refreshed theme */
.smartcertify-form {
	background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
	color: #fff;
	border-radius: 12px;
	padding: 28px;
	box-shadow: 0 10px 30px rgba(37,117,252,0.12);
	font-family: 'Samarata', 'Segoe UI', Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI Emoji", cursive;
}
.smartcertify-form .form-control { border-radius: 8px; padding: 12px 14px; font-size: 18px; }
.smartcertify-form h3 { color: #fff; margin-bottom: 18px; font-size: 32px; letter-spacing: 0.5px; }
.smartcertify-form .btn-primary { background: #fff; color: #333; border: none; padding: 10px 18px; font-weight: 600; transition: transform .12s ease, box-shadow .12s ease; }
.smartcertify-form .btn-primary:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.12); }
.smartcertify-form img { max-width: 100%; height: auto; }

/* Two-column layout for the page */
.sc-container { display:flex; gap:32px; align-items:flex-start; padding:40px 16px; }
.sc-left { flex:1; }
.sc-right { width:520px; }

.sc-instructions { background:#fff; color:#222; padding:28px; border-radius:16px; box-shadow:0 18px 40px rgba(16,24,40,0.08); transform: translateY(-12px); }
.c-orange { color:#ff6b00; font-weight:700 }
.sc-instructions h4 { margin-top:0; color:#111; font-size:28px; }
.sc-instructions p { color:#333; line-height:1.6; font-size:16px }

#sc_alert .alert { margin-top:12px; }
.sc-card { background:#ffffff; color:#222; border-radius:16px; padding:28px; box-shadow:0 30px 80px rgba(16,24,40,0.12); transform: translateY(-18px); }
.sc-card .btn { width:100%; padding:14px 18px; font-size:18px; }
#sc_alert .alert { margin-top:12px; }

@media (max-width: 992px) {
	.sc-container { flex-direction:column; }
	.sc-right { width:100%; }
}

/* Button styles */
.btn-primary {
	background: linear-gradient(90deg, #6a11cb 0%, #2575fc 100%);
	border: none;
	color: #fff;
	padding: 12px 18px;
	font-weight: 700;
	border-radius: 10px;
}
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(37,117,252,0.14); }

.sc-left-inner { position: sticky; top:36px; }

.sc-decor img { display:block; margin-bottom:12px; }

.sc-steps li { margin-bottom:8px; font-size:16px }
.sc-title { font-size:32px; font-weight:700; }
.sc-right .card h4 { font-size:22px; }

/* Certificate preview name style (large) */
.sc-preview-box { background: #fff; padding: 18px; border-radius: 12px; color: #000; display: inline-block; }
.sc-preview-name { font-family: 'Samarata', cursive; font-size: 115px; color: #000; text-align: center; display: block; line-height: 1; }

/* Success animation */
.sc-success { animation: sc-pop .6s ease-out; }
@keyframes sc-pop { 0% { transform: scale(.9); opacity: 0 } 100% { transform: scale(1); opacity: 1 } }

/* Success animation */
.sc-success { animation: sc-pop .6s ease-out; }
@keyframes sc-pop { 0% { transform: scale(.9); opacity: 0 } 100% { transform: scale(1); opacity: 1 } }

.sc-preview-box { background: #fff; padding: 10px; border-radius: 8px; color: #000; }

#sc_preview_iframe { border: 6px solid rgba(0,0,0,0.06); border-radius:8px; }

/* Floating/air effect on small screens reduce translate */
@media (max-width: 992px) {
	.sc-container { flex-direction:column; padding:20px; }
	.sc-card { transform: none; box-shadow:0 12px 36px rgba(16,24,40,0.08); }
}

/* Admin dashboard styles (simple) */
body.wp-admin .smartcertify-dashboard .stat-box { background:#fff;padding:18px;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,0.04); }
body.wp-admin .smartcertify-dashboard h1{ margin-bottom:16px }


/* Two-column layout */
.smartcertify-container { max-width: 1100px; margin: 20px auto; }
.sc-left { background: linear-gradient(135deg, #f7f7fb 0%, #eef2ff 100%); }
.sc-left-inner { padding: 24px; }
.sc-title { color: #333; font-size: 28px; margin-bottom: 8px; }
.sc-lead { color: #555; }
.sc-steps { color: #444; }
.sc-right { background: transparent; }
.sc-right .card { border: none; }
.btn-primary { background: #2575fc; border: none; }
.btn-primary:hover { background: #1b5ed6; }
.btn-success { background: #06b6a4; border: none; }
.btn-success:hover { background: #059482; }

@media (max-width: 767px) {
	.sc-preview-name { font-size: 48px; }
}