/*
 * Portable homepage block. Scoped to .ktby-portal so another theme
 * can mount [kutby_home] without the Jannah child stylesheet.
 */

.ktby-portal {
	--ktby-line: rgba(15, 23, 42, 0.08);
	--ktby-muted: #5c6570;
	--ktby-soft: #f3f6fb;
	--ktby-accent: #0e8a82;
}

body.home #content {
	background: #f3f5f8;
}

.ktby-portal .container-wrapper,
.ktby-portal .ktby-box {
	margin-bottom: 20px;
	padding: 18px 18px 20px;
	background: #fff;
	border: 1px solid #e8eaef;
	border-radius: 16px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.ktby-portal .ktby-title,
.ktby-portal .ktby-portal__title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	border: 0;
	color: var(--base-color, #2c2f34);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
}

.ktby-portal .ktby-pagehead {
	margin: 0 0 12px;
}

.ktby-portal .ktby-pagehead .ktby-title {
	margin: 0;
}

.ktby-portal .ktby-ico {
	flex: 0 0 auto;
	color: var(--ktby-accent);
	box-sizing: content-box;
}

.ktby-portal .ktby-portal__title .ktby-ico,
.ktby-portal .ktby-title .ktby-ico,
.ktby-portal .ktby-points .ktby-ico,
.ktby-portal .ktby-event__kicker .ktby-ico {
	padding: 5px;
	border-radius: 9px;
	background: #e7f6f4;
}

.ktby-portal .ktby-ico.ktby-ico--books { color: #0e8a82; background-color: #e7f6f4; }
.ktby-portal .ktby-ico.ktby-ico--grades { color: #0c7c96; background-color: #e5f4f8; }
.ktby-portal .ktby-ico.ktby-ico--file { color: #1a7eb5; background-color: #e8f4fb; }
.ktby-portal .ktby-ico.ktby-ico--clock { color: #a8842a; background-color: #fbf6ea; }
.ktby-portal .ktby-ico.ktby-ico--download { color: #1d8a62; background-color: #e8f7f1; }
.ktby-portal .ktby-ico.ktby-ico--info { color: #3d7a8c; background-color: #eef5f7; }
.ktby-portal .ktby-ico.ktby-ico--eye { color: #1d8a62; background-color: #e8f7f1; }

.ktby-portal .ktby-file__thumb .ktby-ico {
	padding: 0;
	background: transparent;
	color: inherit;
}

.ktby-portal .ktby-file:nth-child(4n+1) .ktby-file__thumb { background: #e7f6f4; color: #0e8a82; }
.ktby-portal .ktby-file:nth-child(4n+2) .ktby-file__thumb { background: #e8f4fb; color: #1a7eb5; }
.ktby-portal .ktby-file:nth-child(4n+3) .ktby-file__thumb { background: #e8f7f1; color: #1d8a62; }
.ktby-portal .ktby-file:nth-child(4n+4) .ktby-file__thumb { background: #fbf6ea; color: #a8842a; }

.ktby-portal .ktby-app .ktby-ico {
	padding: 0;
	background: transparent;
	color: #fff;
}

.ktby-portal .ktby-app__btn .ktby-ico {
	color: var(--ktby-accent);
	background: transparent;
}

.ktby-portal .ktby-more {
	color: var(--ktby-accent);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.ktby-portal .ktby-pagehead--split {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.ktby-portal .ktby-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 10px;
}

.ktby-portal .ktby-card {
	min-width: 0;
	height: 100%;
	border: 1px solid #e6e8ee;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.ktby-portal .ktby-card__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.ktby-portal .ktby-card:hover {
	border-color: rgba(15, 23, 42, 0.16);
	background: #fff;
}

.ktby-portal .ktby-card__media {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 118px;
	padding: 8px 8px 0;
	overflow: hidden;
}

.ktby-portal .ktby-card__media img {
	width: auto;
	height: 100%;
	max-width: 100%;
	object-fit: contain;
}

.ktby-portal .ktby-card__fallback {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 10px;
	background: transparent;
	color: var(--ktby-accent);
}

.ktby-portal .ktby-card__body {
	padding: 6px 8px 10px;
	text-align: center;
}

.ktby-portal .ktby-card__title {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.45;
}

.ktby-portal .ktby-files {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.ktby-portal .ktby-file {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	padding: 10px 12px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 12px;
	background: #fff;
	color: inherit;
	text-decoration: none;
}

.ktby-portal .ktby-file:hover {
	background: #f4f7fb;
}

.ktby-portal .ktby-file__thumb {
	display: flex;
	flex: 0 0 48px;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	overflow: hidden;
	border-radius: 2px;
	background: #f4f7fb;
	color: var(--ktby-accent);
}

.ktby-portal .ktby-file__thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ktby-portal .ktby-file__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 1px;
	min-width: 0;
}

.home .entry {
	font-size: 13px;
}

.ktby-portal .ktby-copy,
.ktby-portal .ktby-copy p,
.ktby-portal .ktby-intro__text,
.ktby-portal .ktby-intro__text p,
.ktby-portal .ktby-points li,
.ktby-portal .ktby-event__list li {
	font-size: 13px;
	font-weight: 400;
	line-height: 1.7;
}

.ktby-portal .ktby-copy strong,
.ktby-portal .ktby-copy b,
.ktby-portal .ktby-intro__text strong,
.ktby-portal .ktby-intro__text b {
	font-size: inherit;
	font-weight: 600;
}

.ktby-portal .ktby-file__title {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.45;
}

.ktby-portal .ktby-file__meta {
	color: var(--ktby-muted);
	font-size: 13px;
	line-height: 1.45;
}

.ktby-portal .ktby-portal__head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.ktby-portal .ktby-portal__head .ktby-portal__title {
	margin: 0;
}

.ktby-portal .ktby-chip {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--ktby-accent);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.6;
}

.ktby-portal .ktby-points {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ktby-portal .ktby-points li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 10px 12px;
	border: 1px solid #e6e8ee;
	border-radius: 16px;
	background: #fff;
	color: var(--ktby-muted);
	font-size: 13px;
	line-height: 1.6;
}

.ktby-portal .ktby-copy {
	margin-top: 12px;
}

.ktby-portal .ktby-copy p {
	margin: 0 0 8px;
	color: var(--ktby-muted);
	font-size: 13px;
	line-height: 1.7;
}

.ktby-portal .ktby-copy p:last-child {
	margin-bottom: 0;
}

.ktby-portal .ktby-event {
	display: flex;
	align-items: center;
	gap: 14px;
}

.ktby-portal .ktby-event__line {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 2px 0;
}

.ktby-portal .ktby-event__line h3 {
	margin: 0;
}

.ktby-portal .ktby-event__date {
	min-width: 58px;
	text-align: center;
}

.ktby-portal .ktby-event__date strong {
	display: block;
	color: var(--ktby-accent);
	font-size: 28px;
	line-height: 1;
}

.ktby-portal .ktby-event__date span,
.ktby-portal .ktby-event__kicker,
.ktby-portal .ktby-event__body p {
	margin: 0;
	color: var(--ktby-muted);
	font-size: 13px;
}

.ktby-portal .ktby-event__kicker {
	display: flex;
	align-items: center;
	gap: 4px;
}

.ktby-portal .ktby-event__body h3 {
	margin: 2px 0;
	font-size: 16px;
	font-weight: 700;
}

.ktby-portal .ktby-badge {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: transparent;
	color: var(--ktby-accent);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}

.ktby-portal .ktby-event__list {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.ktby-portal .ktby-event__list li {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	padding: 8px 0;
	border-top: 1px solid var(--ktby-line);
	font-size: 13px;
}

.ktby-portal .ktby-app {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px;
	border-radius: 16px;
	background: var(--ktby-accent);
	color: #fff;
}

.ktby-portal .ktby-app .ktby-portal__title,
.ktby-portal .ktby-app .ktby-ico,
.ktby-portal .ktby-app p {
	color: #fff;
}

.ktby-portal .ktby-app .ktby-portal__title {
	margin-bottom: 4px;
}

.ktby-portal .ktby-app p {
	margin: 0;
	font-size: 13px;
}

.ktby-portal .ktby-app__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	padding: 8px 14px;
	border-radius: 8px;
	background: #fff;
	color: var(--ktby-accent);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.ktby-portal .ktby-app__btn .ktby-ico {
	color: var(--ktby-accent);
}

.ktby-portal .ktby-empty {
	margin: 0;
	color: var(--ktby-muted);
}

.ktby-portal .ktby-intro__text {
	color: var(--ktby-muted);
	font-size: 13px;
	line-height: 1.7;
}

.ktby-portal .ktby-intro__text p {
	margin: 0;
}

.ktby-portal .ktby-social {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.ktby-portal .ktby-intro .ktby-portal__title:last-child + .ktby-social,
.ktby-portal .ktby-social:first-child {
	margin-top: 0;
}

.ktby-portal .ktby-social a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border: 1px solid #e6e8ee;
	border-radius: 999px;
	background: #fff;
	color: #3d4654;
	text-decoration: none;
}

.ktby-portal .ktby-social a:hover {
	border-color: #c5c9d1;
	color: #1f2933;
}

.ktby-portal .ktby-social .ktby-ico {
	color: currentColor;
	padding: 0;
	background: transparent;
}

.ktby-portal .ktby-social a.ktby-social--facebook { background: #e8f1fb; border-color: #c9dff6; color: #1877f2; }
.ktby-portal .ktby-social a.ktby-social--twitter { background: #f4f4f5; border-color: #e4e4e7; color: #111827; }
.ktby-portal .ktby-social a.ktby-social--telegram { background: #e7f6fd; border-color: #b9e3f7; color: #168ac2; }
.ktby-portal .ktby-social a.ktby-social--whatsapp { background: #e8f7f1; border-color: #c6ead8; color: #157a45; }
.ktby-portal .ktby-social a.ktby-social--youtube { background: #fdecec; border-color: #f6d0d0; color: #c4302b; }
.ktby-portal .ktby-social a.ktby-social--instagram { background: #fdf0f6; border-color: #f3d5e4; color: #c13584; }
.ktby-portal .ktby-social a.ktby-social--tiktok { background: #f4f4f5; border-color: #e4e4e7; color: #111827; }
.ktby-portal .ktby-social a.ktby-social--linkedin { background: #e8f2fb; border-color: #c9dff3; color: #0a66c2; }

@media (max-width: 991px) {
	.ktby-portal .ktby-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.ktby-portal .ktby-files,
	.ktby-portal .ktby-points {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.ktby-portal .ktby-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.ktby-portal .ktby-card__media {
		height: 84px;
	}

	.ktby-portal .ktby-files,
	.ktby-portal .ktby-points {
		grid-template-columns: minmax(0, 1fr);
	}

	.ktby-portal .ktby-event,
	.ktby-portal .ktby-event__line {
		flex-wrap: wrap;
	}

	.ktby-portal .ktby-app {
		flex-direction: column;
		align-items: stretch;
	}
}
