/**
 * Codersly SEO - Admin styles
 *
 * Styles for:
 * - Settings pages
 * - Meta boxes
 * - Pro notices / badges
 */

/* General layout helpers */
.cseo-wrap {
	max-width: 1100px;
}

.cseo-wrap .cseo-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}

.cseo-wrap .cseo-header-title {
	display: flex;
	align-items: center;
	gap: 8px;
}

.cseo-wrap .cseo-header-title h1 {
	margin: 0;
}

.cseo-wrap .cseo-badge {
	display: inline-flex;
	align-items: center;
	border-radius: 999px;
	padding: 2px 10px;
	font-size: 11px;
	line-height: 1.5;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: #2271b1;
	color: #fff;
}

/* Subtle panel */
.cseo-panel {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	padding: 16px 16px 12px;
	margin-bottom: 16px;
}

.cseo-panel--muted {
	background: #f6f7f7;
}

/* Settings tabs (if you use them) */
.cseo-tabs {
	display: flex;
	gap: 4px;
	margin-bottom: 16px;
	border-bottom: 1px solid #dcdcde;
}

.cseo-tabs a {
	padding: 8px 12px;
	text-decoration: none;
	color: #50575e;
	border-radius: 4px 4px 0 0;
	border: 1px solid transparent;
	border-bottom: none;
}

.cseo-tabs a.cseo-tab--active {
	background: #fff;
	border-color: #dcdcde;
	color: #1d2327;
	font-weight: 600;
}

/* Meta box base */
.cseo-meta-box,
.cseo-content-analysis,
.cseo-internal-links {
	font-size: 13px;
	line-height: 1.5;
}

.cseo-meta-box hr,
.cseo-content-analysis hr {
	border: 0;
	border-top: 1px solid #dcdcde;
	margin: 10px 0;
}

/* Small label/tag style */
.cseo-label {
	display: inline-block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 1px 6px;
	border-radius: 3px;
	background: #f0f0f1;
	color: #50575e;
}

/* Score badges & indicators */
.cseo-score-pill {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	border-radius: 999px;
	padding: 2px 8px;
	font-size: 11px;
	line-height: 1.5;
	background: #f0f0f1;
	color: #2c3338;
}

.cseo-score-pill--good {
	background: #e6f4ea;
	color: #06721e;
}

.cseo-score-pill--warning {
	background: #fff4e5;
	color: #8a6108;
}

.cseo-score-pill--bad {
	background: #fbe9e9;
	color: #a91b27;
}

/* Content Analysis - list style */
.cseo-analysis-list {
	margin: 0 0 0 16px;
	padding: 0;
}

.cseo-analysis-list li {
	margin-bottom: 3px;
}

/* Internal links meta box */
.cseo-internal-links ul {
	margin: 0 0 6px 16px;
	padding: 0;
	list-style: disc;
}

.cseo-internal-links li a {
	text-decoration: none;
}

.cseo-internal-links li a:hover {
	text-decoration: underline;
}

/* Image SEO page */
.cseo-image-seo-template {
	max-width: 640px;
}

.cseo-image-seo-template input[type="text"] {
	width: 100%;
}

/* Redirects table */
.cseo-redirects-table .column-from,
.cseo-redirects-table .column-to {
	width: 40%;
}

/* Audit overview */
.cseo-audit-score-circle {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 18px;
}

.cseo-audit-score-circle--good {
	background: #e6f4ea;
	color: #06721e;
}

.cseo-audit-score-circle--ok {
	background: #fff4e5;
	color: #8a6108;
}

.cseo-audit-score-circle--bad {
	background: #fbe9e9;
	color: #a91b27;
}

/* License panel */
.cseo-license-status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	line-height: 1.5;
}

.cseo-license-status--active {
	background: #e6f4ea;
	color: #06721e;
}

.cseo-license-status--inactive {
	background: #fbe9e9;
	color: #a91b27;
}

.cseo-license-status--unknown {
	background: #f0f0f1;
	color: #50575e;
}

/* Tiny helper text alignment */
.cseo-field-description {
	margin: 4px 0 0;
	color: #646970;
	font-size: 12px;
}

/* Make form-table descriptions a bit tighter */
.cseo-wrap .form-table th {
	padding-top: 12px;
}

.cseo-wrap .form-table td {
	padding-top: 8px;
}

/* Mobile tweaks */
@media (max-width: 782px) {
	.cseo-wrap .cseo-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	.cseo-wrap .form-table th {
		width: 100%;
	}
}


/* Codersly SEO – Redirects table scrolling */
.cseo-redirects-table-wrap {
	max-height: 260px;          /* roughly 4 rows + header */
	overflow-y: auto;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
	background: #fff;
	margin-top: 8px;
}

.cseo-redirects-table th,
.cseo-redirects-table td {
	padding: 6px 8px;
}

/* =========================================================
 * License page UI (theme-style) – consistent spacing + banner
 * =======================================================*/

.cseo-actions{
	margin: 14px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cseo-license-summary{
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}
.cseo-license-summary li{
	padding: 6px 0;
	border-bottom: 1px solid #f0f0f1;
}
.cseo-license-summary li:last-child{
	border-bottom: 0;
}
.cseo-license-summary__label{
	display: inline-block;
	min-width: 140px;
	color: #50575e;
	margin-right: 10px;
}

.cseo-license-status{
	display: flex;
	gap: 12px;
	padding: 14px 14px;
	border-radius: 14px;
	border: 1px solid #dcdcde;
	background: #fff;
	margin: 12px 0 16px;
}

.cseo-license-status__icon{
	font-size: 20px;
	line-height: 1;
	margin-top: 2px;
}

.cseo-license-status__content{
	flex: 1;
}

.cseo-license-status__top{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 6px;
}

.cseo-license-status__title{
	font-size: 14px;
}

.cseo-license-status__message{
	margin: 0 0 6px;
}

.cseo-license-status__hint{
	margin: 0;
	color: #50575e;
}

.cseo-license-status__error{
	margin: 8px 0 0;
	color: #b32d2e;
}

.cseo-license-badge{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 2px 10px;
	border-radius: 999px;
	font-size: 11px;
	line-height: 1.5;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border: 1px solid transparent;
}

.cseo-license-badge--neutral{
	background: #f0f0f1;
	color: #1d2327;
	border-color: #dcdcde;
}

.cseo-license-badge--active{
	background: #e6f4ea;
	color: #06721e;
	border-color: #b7e1c1;
}

.cseo-license-badge--warning{
	background: #fff8e5;
	color: #8a6d00;
	border-color: #f2d675;
}

.cseo-license-badge--error{
	background: #fbeaea;
	color: #b32d2e;
	border-color: #f2b8bb;
}

/* Banner state backgrounds */
.cseo-license-status--active{
	border-color: #b7e1c1;
	background: #f1fbf4;
}

.cseo-license-status--warning{
	border-color: #f2d675;
	background: #fffdf4;
}

.cseo-license-status--error{
	border-color: #f2b8bb;
	background: #fff5f5;
}

.cseo-license-status--neutral{
	border-color: #dcdcde;
	background: #fff;
}


/* Orange Get Pro buttons */
.cseo-get-pro,
.cseo-get-pro.button.button-primary {
	background: #f59e0b !important;
	border-color: #f59e0b !important;
	color: #fff !important;
}

.cseo-get-pro:hover,
.cseo-get-pro:focus,
.cseo-get-pro.button.button-primary:hover,
.cseo-get-pro.button.button-primary:focus {
	background: #ea8c00 !important;
	border-color: #ea8c00 !important;
	color: #fff !important;
}


.cseo-social-option__label {
	font-weight: 600;
	color: #1f2937;
}

.cseo-social-option__desc {
	color: #50575e;
}

.cseo-social-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	color: #fff;
	flex: 0 0 24px;
}

.cseo-social-icon--facebook {
	background: #1877f2;
}

.cseo-social-icon--whatsapp {
	background: #25d366;
}

.cseo-pro-networks-box {
	padding: 10px 12px;
	border: 1px dashed #f59e0b;
	background: #fff7ed;
	border-radius: 8px;
	max-width: 680px;
}

.cseo-pro-networks-grid {
	display: grid;
	gap: 6px;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.cseo-pro-placeholder-box { padding: 12px; border: 1px dashed #c3c4c7; background: #f6f7f7; border-radius: 4px; }



/* Review-safe admin helpers */
.cseo-mt-6 { margin-top: 6px; }
.cseo-mt-18 { margin-top: 18px; }
.cseo-mt-20 { margin-top: 20px; }
.cseo-mt-28 { margin-top: 28px; }
.cseo-mb-0 { margin-bottom: 0; }
.cseo-maxw-1100 { max-width: 1100px; }
.cseo-col-40 { width: 40%; }
.cseo-col-12 { width: 12%; }
.cseo-col-8-center { width: 8%; text-align: center; }
.cseo-text-center-nowrap { text-align: center; white-space: nowrap; }

.cseo-redirect-toolbar,
.cseo-actions-row {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}

.cseo-redirect-toolbar { margin: 10px 0 12px; }
.cseo-actions-row { margin-top: 12px; }

.cseo-pro-placeholder-card {
	max-width: 1200px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 12px;
	padding: 24px;
}

.cseo-upgrade-lead {
	max-width: 1200px;
	background: #f6efe5;
	border-left: 4px solid #f59e0b;
	padding: 18px 20px;
	margin: 18px 0;
}

.cseo-upgrade-lead-text { margin: 0; }

.cseo-pro-networks-box {
	margin-top: 10px;
	padding: 10px 12px;
	border: 1px dashed #f59e0b;
	background: #fff7ed;
	border-radius: 8px;
	max-width: 680px;
}

.cseo-pro-networks-title { margin: 0 0 8px; }
.cseo-pro-network-list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
}
.cseo-pro-network-item {
	opacity: 0.65;
	min-width: 110px;
}
.cseo-pro-networks-note {
	margin: 10px 0 0;
	color: #6b7280;
}

.cseo-mb-10 { margin-bottom: 10px; }
.cseo-schema-logo-preview {
	max-width: 120px;
	height: auto;
	margin-bottom: 8px;
}
.cseo-schema-logo-preview.is-visible { display: block; }
.cseo-schema-logo-preview.is-hidden,
.cseo-hidden { display: none; }
