/* OpenKademi Bridge — front-end styles (OpenKademi brand). */
:root {
	--okb-blue: var(--blue, #2A56BE);
	--okb-navy: var(--navy, #162A4D);
	--okb-ink: var(--ink, #111827);
	--okb-muted: var(--muted, #5A6376);
	--okb-line: var(--line, #E5E9F2);
	--okb-soft: var(--soft, #F5F7FC);
	--okb-blue-soft: var(--blue-soft, #E8EFFB);
	--okb-green: var(--green, #10B27E);
	--okb-coral: var(--coral, #FF6A3D);
	--okb-radius: 16px;
}

/* ---------- Shared ---------- */
.okb-aula, .okb-seats, .okb-order-courses { color: var(--okb-ink); }
.okb-head h2 { margin: 0 0 4px; color: var(--okb-navy); font-size: 1.45rem; }
.okb-head p { margin: 0 0 18px; color: var(--okb-muted); }
.okb-empty {
	padding: 22px; border: 1px dashed var(--okb-line); border-radius: var(--okb-radius);
	background: var(--okb-soft); color: var(--okb-muted); text-align: center;
}
.okb-small { font-size: .875rem; color: var(--okb-muted); margin: 0 0 8px; }
.okb-bar { display: block; height: 8px; border-radius: 999px; background: var(--okb-blue-soft); overflow: hidden; margin: 8px 0 4px; }
.okb-bar > span { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--okb-blue), #1FB0BC); }
.okb-go, a.button.okb-go, .okb-aula-btn {
	display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
	background: var(--okb-blue) !important; color: #fff !important; border: 0 !important;
	border-radius: 999px !important; padding: 10px 20px !important; font-weight: 700; text-decoration: none !important;
	transition: transform .15s ease, box-shadow .15s ease;
}
.okb-go:hover, .okb-aula-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -12px rgba(42, 86, 190, .8); }

/* ---------- Mi cuenta › Aula virtual ---------- */
.okb-courses { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.okb-course {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	padding: 16px 18px; border: 1px solid var(--okb-line); border-radius: var(--okb-radius); background: #fff;
}
.okb-course-b { flex: 1; min-width: 0; }
.okb-course-b strong { display: block; color: var(--okb-navy); }
.okb-course-b small { color: var(--okb-muted); }

/* ---------- Mi cuenta › Cupos de mi empresa ---------- */
.okb-msg { padding: 12px 16px; border-radius: 12px; margin: 0 0 16px; font-weight: 600; }
.okb-msg--ok { background: #E3F8F0; color: #0b6b4c; }
.okb-msg--error { background: #FFEDE6; color: #9a3412; }
.okb-purchase {
	border: 1px solid var(--okb-line); border-radius: var(--okb-radius); padding: 18px 20px;
	margin: 0 0 18px; background: #fff; box-shadow: 0 20px 45px -34px rgba(22, 42, 77, .35);
}
.okb-purchase.is-revoked { opacity: .6; }
.okb-purchase header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.okb-purchase header strong { display: block; color: var(--okb-navy); font-size: 1.05rem; }
.okb-purchase header small { color: var(--okb-muted); }
.okb-count { background: var(--okb-blue-soft); color: var(--okb-blue); border-radius: 999px; padding: 4px 12px; font-size: .875rem; white-space: nowrap; }
.okb-people { width: 100%; border-collapse: collapse; margin: 14px 0 6px; font-size: .925rem; }
.okb-people th { text-align: left; color: var(--okb-muted); font-weight: 600; border-bottom: 1px solid var(--okb-line); padding: 6px 8px; }
.okb-people td { border-bottom: 1px solid var(--okb-line); padding: 8px; }
.okb-remove { color: var(--okb-coral); font-weight: 600; text-decoration: none; }
.okb-assign { display: grid; gap: 16px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--okb-line); }
.okb-assign h3 { margin: 0 0 8px; font-size: 1rem; color: var(--okb-navy); }
.okb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 10px; }
.okb-grid label { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; color: var(--okb-muted); }
.okb-grid input, .okb-invite input {
	width: 100%; padding: 9px 12px; border: 1px solid var(--okb-line); border-radius: 10px; font-size: .95rem; background: #fff;
}
.okb-invite input { background: var(--okb-soft); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .85rem; }

/* ---------- Pedido y producto ---------- */
.okb-order-courses { margin: 18px 0; padding: 16px 18px; border-radius: var(--okb-radius); background: var(--okb-soft); }
.okb-order-courses h2, .okb-order-courses h3 { margin-top: 0; color: var(--okb-navy); }
.okb-seats-hint { margin: 8px 0; font-size: .875rem; color: var(--okb-muted); }

/* ---------- Edwiser Bridge pages ---------- */
.eb-course-action-btn, .wdm-btn, .eb_join_button, .eb-course-action-btn a {
	border-radius: 999px !important; background: var(--okb-blue) !important; color: #fff !important; border-color: var(--okb-blue) !important;
}
.eb-user-profile .eb-dash-div, .eb-course-summary, .eb-course-card {
	border-radius: var(--okb-radius); border-color: var(--okb-line);
}
.eb_progress, .eb-course-progress { accent-color: var(--okb-blue); }

@media (max-width: 600px) {
	.okb-course { flex-direction: column; align-items: stretch; }
	.okb-go { justify-content: center; }
	.okb-purchase header { flex-direction: column; }
	.okb-people thead { display: none; }
	.okb-people tr { display: grid; grid-template-columns: 1fr auto; padding: 8px 0; border-bottom: 1px solid var(--okb-line); }
	.okb-people td { border: 0; padding: 2px 0; }
}