/* ===== ROOT VARIABLES ===== */
:root {
	--cb-primary: #f95450;
	--cb-secondary: #e9e9e9;
	--cb-white: #ffffff;
	--cb-black: #2b3337;
	--cb-yellow: #e6bb45;
	--cb-red: #d9534f;
	--cb-green: #009440;
	--cb-blue: #2271b1;
	--cb-blue-soft: #e7f1f9;
	--cb-yellow-soft: #fbf3dc;
	--cb-red-soft: #fae6e5;
	--cb-green-soft: #e6f3ec;
	--cb-big-title: 23px;
	--cb-small-title: 18px;
	--cb-text: 13px;
	--cb-small-text: 12px;
	--cb-bold-text: 600;
}

.wrap {
	flex: 1;
	min-width: 0;
}

.cbllms-header {
	position: relative;
    padding: 10px 30px;
    background: var(--cb-black);
	display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.cbllms-header-left {
	display:flex;
	align-items:center;
	gap:12px;
	flex:0 1 auto;
}

.cbllms-header p {
	font-size: var(--cb-big-title);
	color: var(--cb-white);
	margin: 0;
}

.form-table td p,
.description,
.cbllms-subtle,
.cbllms-header span {
	font-size: var(--cb-small-text);
}

.cbllms-logo {
	width:48px;
}

.cbllms-version {
	font-size: var(--cb-small-text);
	color: var(--cb-primary);
}

.cbllms-header h3 {
	font-size: var(--cb-small-title);
	margin: 0 0 15px 0;
}

.cbllms-doc-block {
	color: var(--cb-white);
	display: flex;
    padding: 12px;
    border: 1px solid var(--cb-primary);
    border-radius: 3px;
}

.cbllms-doc-text a {
	color: var(--cb-primary);
}

.cbllms-content {
	display: grid;
	grid-template-columns: 1fr 400px;
	gap: 24px;
	margin-top: 16px;
}

@media (max-width: 1100px) {
	.cbllms-content {
		grid-template-columns: 1fr;
	}
}

.cbllms-card {
	background: var(--cb-white);
	box-sizing: border-box;
	padding: 24px;
}

.cbllms-card + .cbllms-card {
	margin-top: 16px;
}

.cbllms-card-title {
	margin: 0 0 15px 0;
	font-size: var(--cb-small-title);
}

.cbllms-dot {
	margin: 0 6px;
}

.cbllms-files {
	list-style: none;
	padding: 0;
	margin: 0;
}

.cbllms-files li {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 0;
	border-bottom: 1px solid var(--cb-secondary);
	font-size: 13px;
}

.cbllms-files li:last-child {
	border-bottom: 0;
}

.cbllms-yes {
	color: var(--cb-green);
}

.cbllms-warn {
	color: var(--cb-yellow);
}

.cbllms-history {
	list-style: none;
	padding: 0;
	margin: 0;
}

.cbllms-history-item {
	padding: 10px 0;
	border-bottom: 1px solid var(--cb-secondary);
	font-size: 13px;
}
.cbllms-history-item:last-child {
	border-bottom: 0;
}

.cbllms-fieldset {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 6px 16px;
}

.cbllms-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
}

.cbllms-card .form-table th {
	width: 300px;
	padding: 14px 10px 14px 0;
	vertical-align: top;
}
.cbllms-card .form-table td {
	padding: 10px 10px;
}

.dashicons-info {
	color: var(--cb-blue);
	vertical-align: middle;
	margin-left: 4px;
	font-size: 16px;
}

.cbllms-sidebar {
  position: sticky;
  top: 44px;
  align-self: flex-start;
  z-index: 2;
}

/* ===== SERVER CONFIGURATION ===== */
.cbllms-server-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin: 20px 0;
}

.cbllms-server-left,
.cbllms-server-right,
.cbllms-card-column {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.monospace {
	font-family: Menlo, Monaco, "Courier New", monospace;
}

.cbllms-badge {
	margin-left: 10px;
	padding: 4px 12px;
	background: var(--cb-blue-soft, #e7f1f9);
	color: var(--cb-blue, #2271b1);
	border-radius: 3px;
	font-family: inherit;
	display: inline-block;
	font-size: var(--cb-small-text, 12px);
}

.cbllms-badge--success {
	background: var(--cb-green-soft, #e6f3ec);
	color: var(--cb-green, #009440);
}

.cbllms-badge--warning {
	background: var(--cb-yellow-soft, #fbf3dc);
	color: var(--cb-yellow, #e6bb45);
}

.cbllms-badge--error {
	background: var(--cb-red-soft, #fae6e5);
	color: var(--cb-red, #d9534f);
}

.cbllms-badge--success,
.cbllms-badge-success,
.cbllms-status-ok {
	background: var(--cb-green-soft, #e6f3ec);
	color: var(--cb-green, #009440);
}

.cbllms-badge--warning,
.cbllms-badge-warning,
.cbllms-status-warning {
	background: var(--cb-yellow-soft, #fbf3dc);
	color: var(--cb-yellow, #e6bb45);
}

.cbllms-badge--error,
.cbllms-badge-error {
	background: var(--cb-red-soft, #fae6e5);
	color: var(--cb-red, #d9534f);
}

.cbllms-button-group {
	display: inline-flex;
	gap: 10px;
	align-items: center;
}

.cbllms-pre {
	background: var(--cb-secondary, #e9e9e9);
	padding: 15px;
	overflow-x: auto;
	font-size: var(--cb-small-text, 12px);
	font-family: Menlo, Monaco, "Courier New", monospace;
	white-space: pre-wrap;
	word-break: break-word;
	border-radius: 4px;
}

.cbllms-textarea-wrap {
	margin-top: 12px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.cbllms-textarea {
	width: 100%;
	flex: 1;
	min-height: 500px;
	font-family: Menlo, Monaco, "Courier New", monospace;
	font-size: var(--cb-small-text, 12px);
	background: var(--cb-secondary, #e9e9e9);
	padding: 15px;
	resize: vertical;
	border: 1px solid #e5e7eb;
	border-radius: 4px;
}

#cbllms-generate-result.cbllms-status-badge {
	margin-left: 10px;
	padding: 4px 12px;
	font-size: var(--cb-small-text);
	border-radius: 3px;
	display: inline-block;
}

/* Stati */
#cbllms-generate-result.loading {
	color: var(--cb-blue);
	background: var(--cb-blue-soft);
}

#cbllms-generate-result.success {
	background: var(--cb-green-soft);
	color: var(--cb-green);
}

#cbllms-generate-result.error {
	background: var(--cb-red-soft);
	color: var(--cb-red);
}

/* ===== BUTTONS ===== */
.wp-core-ui .button-primary {
	background: var(--cb-black) !important;
	color: var(--cb-white) !important;
	border: 1px solid var(--cb-black) !important;
}

.wp-core-ui .button-primary:hover {
	opacity: 0.6;
}