/* =========================================================================
   Library pieces (books, sections, authors) on top of the الحكمة look.
   Colours only from the shared variables, so night mode follows.
   ========================================================================= */

.wp-site-blocks, .wp-site-blocks * { box-sizing: border-box; }
main.hk-page-wide { width: 100%; }


/* Sidebar menu icons for the library links */
.hk-sidebar__nav a[href$="/sections/"]::before { content: ""; --hk-nav-ico: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h4l2 2h8a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.hk-sidebar__nav a[href$="/authors/"]::before { content: ""; --hk-nav-ico: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='8' r='3' stroke='%23000' stroke-width='1.8'/%3E%3Cpath d='M3.5 20c0-3.3 2.5-5 5.5-5s5.5 1.7 5.5 5' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='9' r='2.2' stroke='%23000' stroke-width='1.8'/%3E%3Cpath d='M15.8 14.3c2.6.3 4.2 1.9 4.2 4.7' stroke='%23000' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.hk-sidebar__nav a[href$="/books/"]::before { content: ""; --hk-nav-ico: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5.5c2.5-1 5.5-1 8 1c2.5-2 5.5-2 8-1v13c-2.5-1-5.5-1-8 1c-2.5-2-5.5-2-8-1v-13z' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M12 6.5v13' stroke='%23000' stroke-width='1.8'/%3E%3C/svg%3E"); }
.hk-sidebar__nav .hk-nav-sub > a::before { content: none !important; }
.hk-sidebar__nav .wp-block-navigation__submenu-container { max-height: 46vh; overflow-y: auto; }
.hk-sidebar__nav .hk-nav-sub .wp-block-navigation-item__content { font-size: 15px; padding-block: 5px !important; }

/* Page headings and breadcrumbs */
.fk-page-title { font-size: 24px !important; margin: 0 0 12px !important; color: var(--hk-strong); }
.fk-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; margin: 0 0 14px; font-size: 14px; font-weight: 400; color: var(--hk-muted); }
.fk-crumbs a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.fk-crumbs a:hover { color: var(--hk-link); }
.fk-crumbs [aria-current] { color: var(--hk-link); max-width: 46ch; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fk-crumbs-sep { opacity: .55; }
.fk-muted { color: var(--hk-muted); font-size: 15px; margin: 0; }
.fk-empty { padding: 26px; text-align: center; color: var(--hk-muted); background: var(--hk-card); border-radius: var(--hk-radius); }
.fk-head { display: flex; align-items: center; gap: 16px; margin: 0 0 16px; padding: 18px 20px; background: var(--hk-card); border-radius: var(--hk-radius); box-shadow: 0 1px 2px rgba(58, 47, 37, .05); }
.fk-head .fk-page-title { margin: 0 !important; }
.fk-head-ico { display: inline-flex; width: 52px; height: 52px; border-radius: 14px; align-items: center; justify-content: center; background: var(--hk-head); color: var(--hk-nav-icon, var(--hk-link)); flex-shrink: 0; }
.fk-head--author .fk-avatar { flex-shrink: 0; }

/* Toolbar */
.fk-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin: 0 0 12px; font-size: 14px; }
.fk-toolbar .hwza-log-count { display: inline-flex; align-items: center; gap: 6px; }
.fk-toolbar-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fk-sort, .fk-view { display: inline-flex; background: var(--hk-card); border-radius: 10px; padding: 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.fk-sort a, .fk-view a { padding: 4px 12px; border-radius: 8px; color: var(--hk-muted); text-decoration: none; display: inline-flex; align-items: center; }
.fk-view a { padding: 6px 9px; }
.fk-sort a:hover, .fk-view a:hover { color: var(--hk-strong); }
.fk-sort a.is-active, .fk-view a.is-active { background: var(--hk-head); color: var(--hk-strong); }
.fk-filter { display: inline-flex; align-items: center; gap: 6px; background: var(--hk-card); border: 1px solid var(--hk-line); border-radius: 10px; padding: 2px 10px; color: var(--hk-muted); }
.fk-filter input { border: 0; background: transparent; font: inherit; font-size: 15px; color: var(--hk-text); padding: 5px 0; width: 200px; outline: none; }

/* Book cards grid */
.fk-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 18px 16px; }
.fk-card { display: flex; flex-direction: column; background: var(--hk-card); border-radius: var(--hk-radius); overflow: hidden; box-shadow: 0 1px 2px rgba(58, 47, 37, .06); transition: transform .15s, box-shadow .15s; }
.fk-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(58, 47, 37, .10); }
.fk-card-cover { display: block; aspect-ratio: 5 / 7; background: var(--hk-head); }
.fk-cover { width: 100%; height: 100%; object-fit: cover; display: block; contain-intrinsic-size: none !important; }
.fk-cover--empty { display: flex; align-items: center; justify-content: center; color: var(--hk-muted); height: 100%; }
.fk-card-body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.fk-card-title { font-size: 15px !important; line-height: 1.5 !important; margin: 0 !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fk-card-title a { color: var(--hk-strong); text-decoration: none; }
.fk-card-title a:hover { color: var(--hk-link); }
.fk-card-author { margin: 0; font-size: 13px; color: var(--hk-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fk-card-author a { color: inherit; text-decoration: none; }
.fk-card-author a:hover { color: var(--hk-link); }
.fk-card-meta { margin: auto 0 0; display: flex; gap: 12px; font-size: 12px; color: var(--hk-muted); }
.fk-card-meta span { display: inline-flex; align-items: center; gap: 4px; }

/* Thumbnails in tables */
.fk-table .hwza-col-image { width: 56px; padding-inline: 8px; }
.fk-thumb { width: 36px; height: 50px; object-fit: cover; border-radius: 4px; display: block; margin: 0 auto; background: var(--hk-head); }
span.fk-thumb { display: flex; align-items: center; justify-content: center; color: var(--hk-muted); }
.fk-table .hwza-col-title { width: auto; }
.fk-table .hwza-col-speaker { width: 22%; font-size: 14px; }
.fk-table .hwza-log-col-topic { width: 18%; }
.fk-table .hwza-log-col-date { width: 12%; }

/* Sections */
.fk-home-block { margin-top: 26px; }
.fk-sections { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.fk-section { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--hk-card); border-radius: var(--hk-radius); text-decoration: none; color: var(--hk-strong); height: 100%; transition: background .15s; }
.fk-section:hover { background: var(--hk-head); color: var(--hk-strong); }
.fk-section-ico { display: inline-flex; color: var(--hk-nav-icon, var(--hk-link)); flex-shrink: 0; }
.fk-section-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.fk-section-text b { font-size: 16px; }
.fk-section-text small { font-size: 12px; color: var(--hk-muted); font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fk-badge { flex-shrink: 0; font-size: 12px; font-weight: 600; padding: 1px 9px; border-radius: 999px; background: var(--hk-head); color: var(--hk-muted); }
.fk-section:hover .fk-badge { background: var(--hk-card); }
.fk-sections-row { background: var(--hk-card); border-radius: var(--hk-radius); padding: 14px 18px; margin: 0 0 10px; }
.fk-sections-row-head { display: flex; align-items: center; gap: 8px; color: var(--hk-strong); text-decoration: none; font-size: 18px; }
.fk-sections-row-head svg { color: var(--hk-nav-icon, var(--hk-link)); }
.fk-sections-row-head:hover b { color: var(--hk-link); }
.fk-sections-row .fk-muted { margin: 2px 26px 0 0; font-size: 13px; }
.fk-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 14px; }
.fk-sections-row .fk-chips { margin: 10px 0 2px; }
.fk-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 12px; border-radius: 999px; background: var(--hk-head); color: var(--hk-text); text-decoration: none; font-size: 14px; }
.fk-chip span { color: var(--hk-muted); font-size: 12px; }
.fk-chip:hover { background: var(--wp--preset--color--beige); color: var(--hk-strong); }
.fk-head ~ .fk-chips { margin-top: -4px; }

/* Authors */
.fk-authors { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.fk-author { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: var(--hk-card); border-radius: var(--hk-radius); text-decoration: none; color: var(--hk-strong); height: 100%; transition: background .15s; }
.fk-author:hover { background: var(--hk-head); color: var(--hk-strong); }
.fk-author span { display: flex; flex-direction: column; min-width: 0; }
.fk-author b { font-size: 15px; line-height: 1.5; }
.fk-author small { font-size: 12px; color: var(--hk-muted); font-weight: 400; }
.fk-avatar { border-radius: 50%; object-fit: cover; flex-shrink: 0; display: block; background: var(--hk-head); }
.fk-avatar.no-photo { display: inline-flex; align-items: center; justify-content: center; color: var(--hk-muted); border: 1px solid var(--hk-line); background: transparent; }

/* Single book */
.fk-book { display: grid; grid-template-columns: 240px 1fr; gap: 26px; background: var(--hk-card); border-radius: var(--hk-radius); padding: 22px; box-shadow: 0 1px 2px rgba(58, 47, 37, .05); }
.fk-book-cover { display: flex; flex-direction: column; gap: 10px; }
.fk-book-cover .fk-cover { width: 100%; height: auto; aspect-ratio: auto; border-radius: 8px; box-shadow: 0 6px 18px rgba(58, 47, 37, .18); }
.fk-book-cover .fk-cover--empty { aspect-ratio: 5 / 7; background: var(--hk-head); border-radius: 8px; }
.fk-book-info { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.fk-book-title { font-size: 26px !important; line-height: 1.5 !important; margin: 0 !important; color: var(--hk-strong); }
.fk-book-author { display: inline-flex; align-items: center; gap: 8px; color: var(--hk-link); text-decoration: none; font-size: 17px; align-self: flex-start; }
.fk-book-author:hover { text-decoration: underline; text-underline-offset: 4px; }
.fk-stats { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.fk-stats li, .fk-stats a { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 10px; background: var(--hk-head); color: var(--hk-strong); font-size: 15px; text-decoration: none; }
.fk-stats li > a { padding: 0; background: transparent; }
.fk-stats svg { color: var(--hk-link); }
.fk-stats small { color: var(--hk-muted); font-size: 12px; font-weight: 400; }
.fk-facts { width: 100%; border-collapse: collapse; font-size: 15px; }
.fk-facts th, .fk-facts td { padding: 7px 10px; border: 0; border-top: 1px solid color-mix(in srgb, var(--hk-line) 70%, transparent); text-align: right; vertical-align: top; }
.fk-facts tr:first-child th, .fk-facts tr:first-child td { border-top: 0; }
.fk-facts th { width: 130px; color: var(--hk-muted); font-weight: 600; font-size: 14px; white-space: nowrap; }
.fk-facts td { color: var(--hk-strong); }
.fk-facts a { color: inherit; text-decoration: none; }
.fk-facts a:hover { color: var(--hk-link); }
.fk-share { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }

/* Buttons */
.fk-btn { all: unset; box-sizing: border-box; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 14px; border-radius: 10px; font: 600 14px "IBM Plex Sans Arabic", sans-serif; text-decoration: none !important; white-space: nowrap; transition: background .15s, color .15s; }
.fk-btn:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 2px; }
.fk-btn--main { background: var(--wp--preset--color--bronze); color: var(--hk-strong); }
.fk-btn--main:hover { background: var(--hk-link); color: var(--wp--preset--color--surface); }
.fk-btn--alt, .fk-btn--ghost { background: var(--hk-head); color: var(--hk-text); }
.fk-btn--alt:hover, .fk-btn--ghost:hover { background: var(--wp--preset--color--beige); color: var(--hk-strong); }
.fk-btn.is-done { background: var(--hk-link); color: var(--wp--preset--color--surface); }

/* Boxes under the book */
.fk-box { background: var(--hk-card); border-radius: var(--hk-radius); padding: 18px 22px; margin-top: 18px; box-shadow: 0 1px 2px rgba(58, 47, 37, .05); }
.fk-box-title { display: flex; align-items: center; gap: 8px; font-size: 18px !important; margin: 0 0 12px !important; color: var(--hk-strong); }
.fk-box-title svg { color: var(--hk-link); }
.fk-sub { font-size: 15px !important; color: var(--hk-muted); margin: 16px 0 8px !important; }
.fk-files { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.fk-file { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: var(--hk-head); }
.fk-file-ico { display: inline-flex; color: #B5483B; flex-shrink: 0; }
.fk-file-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.fk-file-text b { font-size: 15px; color: var(--hk-strong); line-height: 1.5; overflow-wrap: anywhere; }
.fk-file-text small { font-size: 12px; color: var(--hk-muted); font-weight: 400; }
.fk-file-btns { display: flex; gap: 6px; flex-shrink: 0; }
.fk-file .fk-btn--alt { background: var(--hk-card); }
.fk-about { font-size: 17px; line-height: 1.9; }
.fk-about p { margin: 0 0 10px; }
.fk-lead { color: var(--hk-strong); }

/* Table of contents dialog */
.fk-dialog { position: fixed; inset: 0; z-index: 200; background: rgba(20, 16, 12, .6); display: flex; align-items: center; justify-content: center; padding: 20px; }
.fk-dialog[hidden] { display: none; }
.fk-dialog-box { position: relative; max-width: min(900px, 100%); max-height: 100%; overflow: auto; background: var(--hk-card); border-radius: var(--hk-radius); padding: 14px; }
.fk-dialog-box img { display: block; max-width: 100%; height: auto; border-radius: 8px; }
.fk-dialog-close { all: unset; position: sticky; float: left; top: 0; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--hk-head); cursor: pointer; font-size: 22px; color: var(--hk-strong); z-index: 1; }
.fk-dialog-close:focus-visible { outline: 2px solid var(--hk-accent); }

/* Search page */
.fk-search { display: flex; gap: 8px; margin: 0 0 18px; }
.fk-search input { flex: 1; min-width: 0; font: inherit; font-size: 17px; padding: 8px 14px; border-radius: 12px; border: 1px solid var(--hk-line); background: var(--hk-card); color: var(--hk-text); }
.fk-search input:focus { outline: 2px solid var(--wp--preset--color--bronze); outline-offset: 0; }
.fk-search button { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; padding: 8px 18px; border-radius: 12px; background: var(--wp--preset--color--bronze); color: var(--hk-strong); font-weight: 700; }
.fk-search button:hover { background: var(--hk-link); color: var(--wp--preset--color--surface); }

/* Comments: country tag and the form */
.fk-cmt-country { font-size: 12px; color: var(--hk-muted); padding: 0 8px; border-radius: 999px; background: var(--hk-card); }
.fk-comments .comment-form { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 12px; }
.fk-comments .comment-form > p { margin: 0 0 10px; }
.fk-comments .comment-notes, .fk-comments .comment-form-comment, .fk-comments .form-submit, .fk-comments .logged-in-as { grid-column: 1 / -1; }
.fk-comments .comment-form label { display: block; font-size: 14px; color: var(--hk-muted); margin-bottom: 3px; }
.fk-comments .comment-form input[type="text"], .fk-comments .comment-form input[type="email"], .fk-comments .comment-form textarea { width: 100%; font: inherit; font-size: 16px; padding: 7px 12px; border-radius: 10px; border: 1px solid var(--hk-line); background: var(--hk-head); color: var(--hk-text); }
.fk-comments .comment-form input:focus, .fk-comments .comment-form textarea:focus { outline: 2px solid var(--wp--preset--color--bronze); outline-offset: 0; }
.fk-comments .comment-notes { font-size: 13px; color: var(--hk-muted); }
.fk-comments .form-submit input { border: 0; cursor: pointer; padding: 8px 22px; border-radius: 10px; font: 700 15px "IBM Plex Sans Arabic", sans-serif; background: var(--wp--preset--color--bronze); color: var(--hk-strong); }
.fk-comments .form-submit input:hover { background: var(--hk-link); color: var(--wp--preset--color--surface); }

/* Phones */
@media (max-width: 781px) {
	.fk-book { grid-template-columns: 1fr; padding: 16px; gap: 16px; }
	.fk-book-cover { flex-direction: row; align-items: flex-end; }
	.fk-book-cover .fk-cover, .fk-book-cover .fk-cover--empty { width: 130px; }
	.fk-book-title { font-size: 22px !important; }
	.fk-comments .comment-form { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.fk-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.fk-file { flex-wrap: wrap; }
	.fk-file-btns { width: 100%; }
	.fk-file-btns .fk-btn { flex: 1; }
	.fk-facts th { width: 96px; }
	.fk-filter input { width: 140px; }
	.fk-box { padding: 14px; }
	.fk-head { padding: 14px; }
}

/* Phones: book rows become cards with a large cover beside the title, author, section and date. */
@media (max-width: 600px) {
	.fk-table tbody tr {
		display: grid !important; grid-template-columns: 78px minmax(0, 1fr); column-gap: 14px; align-items: start;
		padding: 12px !important;
	}
	.fk-table td.hwza-col-image { display: block !important; grid-column: 1; grid-row: 1 / span 4; width: 78px !important; padding: 0 !important; }
	.fk-table td.hwza-col-image .fk-thumb { width: 78px; height: 110px; margin: 0; border-radius: 6px; box-shadow: 0 2px 6px rgba(58, 47, 37, .15); }
	.fk-table td.hwza-col-title,
	.fk-table td.hwza-col-speaker,
	.fk-table td.hwza-log-col-topic,
	.fk-table td.hwza-log-col-date { grid-column: 2; padding-right: 0 !important; }
	.fk-table td.hwza-col-title { grid-row: 1; padding: 0 0 4px !important; line-height: 1.6; }
	.fk-table td.hwza-col-speaker { grid-row: 2; }
	.fk-table td.hwza-log-col-topic { grid-row: 3; }
	.fk-table td.hwza-log-col-date { grid-row: 4; margin-top: 6px; }
}

/* ---------- Home: latest books as wide cards — 2 per row, 1 on phones ---------- */
.fk-updated { display: flex; align-items: center; gap: 5px; margin: 0 0 10px; padding-inline-start: 12px; font-size: 13px; font-weight: 400; color: var(--hk-muted); }
.fk-updated svg { flex-shrink: 0; opacity: .85; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fk-hcards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.fk-hcard {
	display: flex; gap: 14px; align-items: flex-start; padding: 14px;
	background: var(--hk-card); border-radius: var(--hk-radius); box-shadow: 0 1px 2px rgba(58, 47, 37, .06);
	transition: box-shadow .15s, transform .15s;
}
.fk-hcard:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(58, 47, 37, .10); }
.fk-hcard-cover { flex: 0 0 88px; display: block; }
.fk-hcard-img { width: 88px; height: 125px; object-fit: cover; display: block; border-radius: 10px; box-shadow: 0 2px 6px rgba(58, 47, 37, .18); contain-intrinsic-size: none !important; }
span.fk-hcard-img { display: flex; align-items: center; justify-content: center; background: var(--hk-head); color: var(--hk-muted); }
.fk-hcard-body { min-width: 0; flex: 1; align-self: stretch; display: flex; flex-direction: column; gap: 4px; }
.fk-hcard-title { margin: 0 !important; font-size: 15px !important; line-height: 1.55 !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fk-hcard-title a { color: var(--hk-link); text-decoration: none; }
.fk-hcard-title a:hover { color: var(--hk-strong); }
.fk-hcard-author { margin: 0; font-size: 13px; color: var(--hk-strong); }
.fk-hcard-author a { color: inherit; text-decoration: none; }
.fk-hcard-author a:hover { color: var(--hk-link); }
.fk-hcard-author { display: flex; align-items: center; gap: 5px; }
.fk-hcard-author svg { flex-shrink: 0; color: var(--hk-nav-icon, var(--hk-link)); }
.fk-hcard-section { margin: 0; display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 400; color: var(--hk-muted); }
.fk-hcard-section svg { flex-shrink: 0; color: var(--hk-nav-icon, var(--hk-link)); }
.fk-hcard-section a { color: inherit; text-decoration: none; }
.fk-hcard-section a:hover { color: var(--hk-link); }
.fk-hcard-meta { margin: auto 0 0; padding-top: 6px; display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--hk-muted); font-weight: 400; }
.fk-hcard-meta span { display: inline-flex; align-items: center; gap: 5px; }
.fk-hcard-date { font-size: 12px; white-space: nowrap; }

/* Phones: 1 per row */
@media (max-width: 600px) {
	.fk-hcards { grid-template-columns: 1fr; gap: 10px; }
}

/* ---------- Site logo: "شبكة الفكر" calligraphy in the theme's accent colour ---------- */
/* The PNG is only a shape (mask); the colour comes from the palette, so it follows night mode and the design panel. */
.fk-site-name { display: block; line-height: 0; padding: 4px 0; }
.fk-stamp {
	display: block; width: 190px; aspect-ratio: 600 / 242;
	background-color: var(--hk-nav-icon, var(--wp--preset--color--ink));
	-webkit-mask: url("images/logo-name.png") center / contain no-repeat; mask: url("images/logo-name.png") center / contain no-repeat;
}
@media (max-width: 781px) { .fk-site-name { padding: 0; } .fk-stamp { width: 110px; } }

/* ---------- Sidebar: sections list always open — subject icon, name, small book count ---------- */
.hk-sidebar__nav .hk-nav-sub .wp-block-navigation-item__content { font-size: 15px; padding-block: 5px !important; gap: 9px; }
.hk-sidebar__nav .hk-nav-sub .wp-block-navigation-item__label { flex: 1; min-width: 0; }
.fk-sec-ico { display: inline-flex; flex-shrink: 0; color: var(--hk-nav-icon, var(--hk-link)); }
.fk-sec-count {
	flex-shrink: 0; min-width: 22px; padding: 0 6px; border-radius: 999px; text-align: center;
	font-size: 11px; font-weight: 600; line-height: 18px; color: var(--hk-muted);
	background: color-mix(in srgb, var(--wp--preset--color--base) 70%, transparent);
}
.hk-sidebar__nav .current-menu-item .fk-sec-count { background: var(--hk-head); }

/* ---------- Fonts and sizes chosen in the design panel (variables set by inc/design.php) ---------- */
body { font-family: var(--fk-font-body, var(--wp--preset--font-family--scheherazade)) !important; }
.hwza-table, .hwza-table *, .hk-home-tab { font-family: var(--fk-font-body, "Scheherazade New", serif) !important; }
h1, h2, h3, h4, h5, h6, .fk-hcard-title, .fk-card-title, .fk-book-title, .fk-page-title, .hwza-section-title, .fk-box-title {
	font-family: var(--fk-font-head, var(--fk-font-body, var(--wp--preset--font-family--scheherazade))) !important;
}
.fk-about, .wp-block-post-content { font-size: var(--fk-fs-body, 17px); }
.hk-cmt-text { font-size: calc(var(--fk-fs-body, 17px) - 2px) !important; }
.fk-hcard-title, .fk-card-title { font-size: var(--fk-fs-card-title, 15px) !important; }
.fk-hcard-author, .fk-card-author { font-size: var(--fk-fs-card-author, 15px) !important; }
.fk-book-title { font-size: var(--fk-fs-book-title, 21px) !important; }
@media (max-width: 781px) { .fk-book-title { font-size: calc(var(--fk-fs-book-title, 21px) * .9) !important; } }
.hk-sidebar__nav .wp-block-navigation-item__content, .hk-sidebar__nav .hk-nav-sub .wp-block-navigation-item__content { font-size: var(--fk-fs-menu, 15px) !important; }
.hwza-table td.hwza-col-title, .hwza-table td.hwza-col-speaker, .fk-facts td, .fk-file-text b, .fk-section-text b, .fk-author b { font-size: var(--fk-fs-table, 15px) !important; }

/* Phones: the WordPress admin bar (admins only) scrolls away below 600px, so the sticky header must not leave room for it. */
@media (max-width: 600px) { .admin-bar { --hk-top: 0px; } }

/* Section / author page heading: smaller title and description */
.fk-head { padding: 12px 16px; gap: 12px; }
.fk-head .fk-page-title { font-size: 19px !important; line-height: 1.5 !important; }
.fk-head .fk-muted { font-size: 13px; }
.fk-head-ico { width: 40px; height: 40px; border-radius: 11px; }
.fk-head-ico svg { width: 20px; height: 20px; }

/* Download rows: file name small, light and soft; one button per row */
.fk-file-text .fk-file-name { font-size: 14px; font-weight: 400; color: var(--hk-muted); line-height: 1.6; overflow-wrap: anywhere; }
.fk-file > .fk-btn { flex-shrink: 0; }
@media (max-width: 600px) { .fk-file > .fk-btn { width: 100%; } }

/* ---------- Book card: share icon (top left), date (bottom left), contents button under the cover ---------- */
.fk-book { position: relative; padding-bottom: 40px; }
.fk-book .fk-share { position: absolute; top: 14px; left: 14px; display: block; margin: 0; z-index: 3; }
.fk-share-btn {
	all: unset; box-sizing: border-box; cursor: pointer; width: 38px; height: 38px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--hk-head); color: var(--hk-link); transition: background .15s;
}
.fk-share-btn:hover, .fk-share-btn[aria-expanded="true"] { background: var(--wp--preset--color--beige); color: var(--hk-strong); }
.fk-share-btn:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 2px; }
.fk-share-menu {
	position: absolute; top: 44px; left: 0; min-width: 150px; padding: 6px; border-radius: 12px;
	display: flex; flex-direction: column; gap: 2px;
	background: var(--hk-card); box-shadow: 0 8px 24px rgba(58, 47, 37, .18);
}
.fk-share-menu[hidden] { display: none; }
.fk-share-menu a, .fk-share-menu button {
	all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; gap: 8px;
	padding: 7px 10px; border-radius: 8px; font: 600 14px "IBM Plex Sans Arabic", sans-serif; color: var(--hk-text);
}
.fk-share-menu a:hover, .fk-share-menu button:hover { background: var(--hk-head); color: var(--hk-strong); }
.fk-share-menu .is-done { color: var(--hk-link); }
.fk-book-date {
	position: absolute; bottom: 14px; left: 18px;
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 12px; font-weight: 400; color: var(--hk-muted);
}
.fk-book-date svg { flex-shrink: 0; opacity: .85; }
.fk-book-info .fk-book-title { padding-left: 46px; } /* room for the share icon */
@media (max-width: 781px) {
	.fk-book-cover { flex-direction: column !important; align-items: flex-start !important; width: fit-content; }
	.fk-book-cover .fk-toc-btn { width: 100%; }
}

/* Share menu: a row of round icon buttons */
.fk-share-menu { flex-direction: row; min-width: 0; gap: 4px; padding: 5px; border-radius: 999px; }
.fk-share-menu a, .fk-share-menu button { width: 36px; height: 36px; padding: 0; justify-content: center; border-radius: 50%; color: var(--hk-link); }
.fk-share-menu a:hover, .fk-share-menu button:hover { background: var(--hk-head); color: var(--hk-strong); }
.fk-share-menu .is-done { background: var(--hk-link) !important; color: var(--wp--preset--color--surface) !important; }

/* ---------- Book page refinements ---------- */
.fk-facts th { width: 1%; padding-left: 18px; white-space: nowrap; }
.fk-book-views {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 12px; font-weight: 400; color: var(--hk-muted);
}
.fk-book-views svg { flex-shrink: 0; opacity: .85; }
.fk-btn--icon { width: 40px; height: 36px; padding: 0; }
@media (max-width: 600px) { .fk-file > .fk-btn--icon { width: 40px; } }
.fk-comments .comment-form .fk-send {
	all: unset; box-sizing: border-box; cursor: pointer; width: 44px; height: 40px; border-radius: 10px;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--wp--preset--color--bronze); color: var(--hk-strong); transition: background .15s, color .15s;
}
.fk-comments .comment-form .fk-send:hover { background: var(--hk-link); color: var(--wp--preset--color--surface); }
.fk-comments .comment-form .fk-send:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 2px; }
.fk-comments .comment-form .fk-send svg { transform: scaleX(-1); } /* points left, the reading direction */

/* Other books by the same author: compact rows */
.fk-related { margin-top: 28px; }
.fk-minis { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.fk-mini { display: flex; align-items: center; gap: 12px; padding: 8px 10px; background: var(--hk-card); border-radius: 12px; }
.fk-mini-cover { flex: 0 0 44px; display: block; line-height: 0; }
.fk-mini-img { width: 44px; height: 62px; object-fit: cover; border-radius: 3px; box-shadow: 0 1px 4px rgba(58, 47, 37, .18); display: block; contain-intrinsic-size: none !important; }
span.fk-mini-img { display: flex; align-items: center; justify-content: center; background: var(--hk-head); color: var(--hk-muted); }
.fk-mini-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.fk-mini-title { font-size: 14px; line-height: 1.6; color: var(--hk-strong); text-decoration: none; }
.fk-mini-title:hover { color: var(--hk-link); }
.fk-mini-views { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 400; color: var(--hk-muted); }

/* Card footer (bottom left): views, then the date */
.fk-book-foot { position: absolute; bottom: 14px; left: 18px; display: flex; align-items: center; gap: 14px; }
.fk-book-foot .fk-book-date { position: static; }
.fk-book-author .fk-avatar { width: 42px; height: 42px; }

/* Other books: views and date on one line */
.fk-mini-meta { display: flex; align-items: center; gap: 14px; font-size: 12px; font-weight: 400; color: var(--hk-muted); }
.fk-mini-meta span, .fk-mini-meta time { display: inline-flex; align-items: center; gap: 4px; }
.fk-mini-meta svg { opacity: .85; }

/* Book description: lighter, smaller, justified, folded */
.fk-about-text, .fk-about-text p, .fk-about .fk-lead { font-size: 15.5px; font-weight: 200; line-height: 2; text-align: justify; text-justify: inter-word; color: var(--hk-text); }
.fk-about-text.is-folded { max-height: 12em; overflow: hidden; position: relative;
	-webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent); mask-image: linear-gradient(to bottom, #000 60%, transparent); }
.fk-more { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; padding: 4px 12px; border-radius: 999px;
	background: var(--hk-head); color: var(--hk-link); font: 600 14px "IBM Plex Sans Arabic", sans-serif; }
.fk-more:hover { background: var(--wp--preset--color--beige); color: var(--hk-strong); }
.fk-more:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 2px; }
.fk-more[aria-expanded="true"] svg { transform: rotate(180deg); }
.fk-more[hidden] { display: none; }

/* Sidebar search: plain, smaller text */
.hk-sidebar__search input, .hk-sidebar__search input::placeholder { font: 400 14px "IBM Plex Sans Arabic", sans-serif !important; }
.hk-sidebar__search input::placeholder { color: var(--hk-muted); opacity: .8; }

/* Book page: label and value close together (القسم، عدد الأجزاء…) */
.fk-facts th { padding-left: 4px !important; }
.fk-facts td { padding-right: 4px !important; }
/* Smaller box headings: تحميل الكتاب، عن الكتاب، كتب أخرى */
.fk-box-title { font-size: 15px !important; margin-bottom: 10px !important; }
.fk-box-title svg { width: 16px; height: 16px; }
.fk-related .hwza-section-title { font-size: 15px !important; }

/* Book facts: an icon instead of the written label (القسم، الأجزاء…) */
.fk-facts th { vertical-align: middle; }
.fk-fact-ico { display: inline-flex; color: var(--hk-nav-icon, var(--hk-link)); }

/* Book details: author, section, volumes… one tidy list */
.fk-meta { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.fk-meta li { display: flex; align-items: center; gap: 10px; min-height: 30px; }
.fk-meta-ico { flex: 0 0 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; color: var(--hk-nav-icon, var(--hk-link)); }
.fk-meta-ico .fk-avatar { width: 30px !important; height: 30px !important; }
.fk-meta-val { font-size: 15px; font-weight: 600; color: var(--hk-strong); line-height: 1.5; }
.fk-meta-val a { color: inherit; text-decoration: none; }
.fk-meta-val a:hover { color: var(--hk-link); }

/* Book page: the author as its own block, larger photo */
.fk-author-chip {
	display: inline-flex; align-items: center; gap: 12px; align-self: flex-start;
	padding: 6px 6px 6px 18px; border-radius: 999px; background: var(--hk-head);
	text-decoration: none; color: var(--hk-strong); transition: background .15s;
}
.fk-author-chip:hover { background: var(--wp--preset--color--beige); }
.fk-author-chip .fk-avatar { width: 56px !important; height: 56px !important; flex-shrink: 0; }
.fk-author-chip .fk-avatar.no-photo { background: var(--hk-card); border: 0; color: var(--hk-nav-icon, var(--hk-link)); }
.fk-author-chip-text { display: flex; flex-direction: column; line-height: 1.4; min-width: 0; }
.fk-author-chip-text small { font-size: 12px; font-weight: 400; color: var(--hk-muted); }
.fk-author-chip-text b { font-size: 16px; font-weight: 700; }
.fk-author-chip:hover b { color: var(--hk-link); }

/* Cover opens full size */
.fk-cover-zoom { display: block; line-height: 0; cursor: zoom-in; border-radius: 8px; }
.fk-cover-zoom:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 3px; }
.fk-zoom .fk-dialog-box { padding: 10px; background: transparent; box-shadow: none; }
.fk-zoom img { display: block; max-width: min(92vw, 900px); max-height: 88vh; width: auto; height: auto; border-radius: 6px; box-shadow: 0 10px 40px rgba(0, 0, 0, .4); }

/* ---------- Book card on phones and small screens: three layouts (fk_mobile_layout) ---------- */
@media (max-width: 781px) {
	.fk-book[class*="fk-book--m-"] { display: grid; gap: 12px 16px; padding: 16px 16px 44px; }
	.fk-book[class*="fk-book--m-"] .fk-book-info { display: contents; }
	.fk-book[class*="fk-book--m-"] .fk-book-cover { grid-area: cover; width: auto; }
	.fk-book[class*="fk-book--m-"] .fk-book-title { grid-area: title; margin: 0 !important; }
	.fk-book[class*="fk-book--m-"] .fk-author-chip { grid-area: chip; }
	.fk-book[class*="fk-book--m-"] .fk-meta { grid-area: meta; }
	.fk-book[class*="fk-book--m-"] .fk-book-cover .fk-cover { width: 100%; height: auto; }

	/* A — like the old site: title on top, a big cover on the right half, details beside it */
	.fk-book--m-a { grid-template-columns: 46% 1fr; grid-template-areas: "title title" "cover chip" "cover meta"; align-items: start; }
	.fk-book--m-a .fk-book-cover { grid-row: 2 / span 2; }
	.fk-book--m-a .fk-author-chip { flex-direction: column; align-items: flex-start; gap: 6px; padding: 0; background: none; border-radius: 0; }
	.fk-book--m-a .fk-author-chip .fk-avatar { width: 48px !important; height: 48px !important; }
	.fk-book--m-a .fk-author-chip-text b { font-size: 14px; }
	.fk-book--m-a .fk-meta { gap: 6px; }
	.fk-book--m-a .fk-meta li { min-height: 24px; gap: 6px; }
	.fk-book--m-a .fk-meta-ico { flex-basis: 22px; height: 22px; }
	.fk-book--m-a .fk-meta-val { font-size: 13px; }

	/* B — big cover on top, everything centred under it */
	.fk-book--m-b { grid-template-columns: 1fr; grid-template-areas: "cover" "title" "chip" "meta"; justify-items: center; text-align: center; }
	.fk-book--m-b .fk-book-cover { width: 62%; max-width: 260px; align-items: stretch !important; }
	.fk-book--m-b .fk-book-title { padding: 0 !important; }
	.fk-book--m-b .fk-meta { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 6px 14px; }
	.fk-book--m-b .fk-meta li { gap: 4px; }
	.fk-book--m-b .fk-meta-ico { flex-basis: 20px; }
	.fk-book--m-b .fk-meta-val { font-size: 14px; }

	/* C — compact: a medium cover beside title and author, details as small tags below */
	.fk-book--m-c { grid-template-columns: 112px 1fr; grid-template-areas: "cover title" "cover chip" "meta meta"; align-items: start; }
	.fk-book--m-c .fk-book-title { font-size: 18px !important; }
	.fk-book--m-c .fk-author-chip { padding: 4px 4px 4px 12px; gap: 8px; }
	.fk-book--m-c .fk-author-chip .fk-avatar { width: 40px !important; height: 40px !important; }
	.fk-book--m-c .fk-author-chip-text b { font-size: 14px; }
	.fk-book--m-c .fk-meta { flex-direction: row; flex-wrap: wrap; gap: 6px; }
	.fk-book--m-c .fk-meta li { min-height: 0; gap: 4px; padding: 3px 10px 3px 8px; border-radius: 999px; background: var(--hk-head); }
	.fk-book--m-c .fk-meta-ico { flex-basis: 16px; height: 16px; }
	.fk-book--m-c .fk-meta-ico svg { width: 15px; height: 15px; }
	.fk-book--m-c .fk-meta-val { font-size: 13px; }
}

/* Home search box for phones (the sidebar one is hidden there) */
.fk-mobile-search { display: none; }
@media (max-width: 781px) {
	.fk-mobile-search {
		display: flex; align-items: center; margin: 0 0 14px; padding: 2px 4px 2px 2px;
		background: var(--hk-card); border: 1px solid var(--hk-line); border-radius: 12px; box-shadow: 0 1px 2px rgba(58, 47, 37, .05);
	}
	.fk-mobile-search input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 10px 12px; font: 400 15px "IBM Plex Sans Arabic", sans-serif; color: var(--hk-text); outline: none; }
	.fk-mobile-search input::placeholder { color: var(--hk-muted); opacity: .8; }
	.fk-mobile-search button { all: unset; cursor: pointer; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; color: var(--hk-link); }
	.fk-mobile-search button:hover { background: var(--hk-head); }
	.fk-mobile-search:focus-within { border-color: var(--wp--preset--color--bronze); }
}

/* Phone header: the dots and menu buttons sit at the far left (the account icon that used to sit there is gone) */
@media (max-width: 781px) {
	.hk-sidebar > .hk-hicons-toggle { margin-inline-start: auto !important; }
	.hk-sidebar__nav .wp-block-navigation__responsive-container-open { width: 34px; height: 34px; align-items: center; justify-content: center; border-radius: 10px; }
	.hk-sidebar__nav .wp-block-navigation__responsive-container-open:hover { background: color-mix(in srgb, var(--wp--preset--color--contrast) 10%, transparent); }
}

/* Quick icons inside the phone menu (above the sections); the separate dots button is gone */
.fk-menu-icons { display: none; }
.is-menu-open .fk-menu-icons {
	display: flex; justify-content: space-around; align-items: center; width: 100%;
	padding: 6px 4px 12px; margin-bottom: 8px; border-bottom: 1px solid var(--hk-line); color: var(--hk-link);
}
.is-menu-open .fk-menu-icons .hk-hicon { width: 40px; height: 40px; border-radius: 10px; }
.is-menu-open .fk-menu-icons .hk-hicon svg { width: 21px !important; height: 21px !important; }
.is-menu-open .fk-menu-icons .hk-hicon:hover { background: color-mix(in srgb, var(--wp--preset--color--contrast) 8%, transparent); opacity: 1; }
@media (max-width: 781px) { .hk-sidebar .hk-hicons, .hk-hicons-toggle { display: none !important; } }
@media (max-width: 781px) { .hk-sidebar > .hk-sidebar__nav { margin-inline-start: auto !important; } }

/* Phone header: Telegram and mail on the left, beside the menu button, same size and style */
@media (max-width: 781px) {
	.hk-sidebar .hk-sidebar__foot { order: 2 !important; margin-inline-start: auto !important; gap: 2px !important; }
	.hk-sidebar > .hk-sidebar__nav { order: 3; margin-inline-start: 2px !important; }
	.hk-sidebar .hk-sidebar__foot .wp-block-social-links { gap: 2px !important; }
	.hk-sidebar .hk-sidebar__foot .wp-social-link { margin: 0 !important; }
	.hk-sidebar .hk-sidebar__foot .wp-social-link a {
		width: 34px; height: 34px; padding: 0 !important; display: inline-flex !important; align-items: center; justify-content: center;
		border-radius: 10px; color: var(--wp--preset--color--contrast);
	}
	.hk-sidebar .hk-sidebar__foot .wp-social-link a:hover { background: color-mix(in srgb, var(--wp--preset--color--contrast) 10%, transparent); }
	.hk-sidebar .hk-sidebar__foot .wp-social-link svg { width: 21px !important; height: 21px !important; margin: 0 !important; fill: currentColor; }
	.hk-sidebar__nav .wp-block-navigation__responsive-container-open svg { width: 21px; height: 21px; }
}

/* Phone header buttons (menu, mail, Telegram): one size, close together, glyphs balanced by eye */
@media (max-width: 781px) {
	.hk-sidebar .hk-sidebar__foot, .hk-sidebar .hk-sidebar__foot .wp-block-social-links { gap: 0 !important; }
	.hk-sidebar > .hk-sidebar__nav { margin-inline-start: 0 !important; }
	.hk-sidebar .hk-sidebar__foot .wp-social-link a,
	.hk-sidebar__nav .wp-block-navigation__responsive-container-open { width: 36px !important; height: 36px !important; border-radius: 10px; color: var(--wp--preset--color--contrast); }
	.hk-sidebar__nav .wp-block-navigation__responsive-container-open svg { width: 22px !important; height: 22px !important; }
	.hk-sidebar .hk-sidebar__foot .wp-social-link-mail svg { width: 22px !important; height: 22px !important; }
	.hk-sidebar .hk-sidebar__foot .wp-social-link-telegram svg { width: 30px !important; height: 30px !important; } /* its drawing is smaller inside its box */
}
@media (max-width: 781px) { .hk-sidebar > .hk-sidebar__nav { margin-inline-start: -8px !important; } } /* cancel the header's 8px gap so the three buttons sit together */
@media (max-width: 781px) { .hk-sidebar .hk-sidebar__foot .wp-social-link-telegram svg { transform: translateY(2px); } } /* the plane drawing sits high; line it up with the mail icon */

/* Search boxes: light text (IBM Plex Sans Arabic 300) */
.fk-mobile-search input, .fk-mobile-search input::placeholder,
.hk-sidebar__search input, .hk-sidebar__search input::placeholder,
.fk-search input, .fk-search input::placeholder { font-family: "IBM Plex Sans Arabic", sans-serif !important; font-weight: 300 !important; }

/* Book cards: dark title, lighter author */
.fk-hcard-title a { color: var(--hk-strong) !important; }
.fk-hcard-title a:hover { color: var(--hk-link) !important; }
.fk-hcard-author { color: var(--hk-link) !important; font-weight: 500; }
.fk-hcard-author a:hover { color: var(--hk-strong) !important; }

/* Sidebar: sub-sections opened under their section */
.hk-sidebar__nav .wp-block-navigation__submenu-container {
	position: static !important; width: auto !important; min-width: 0 !important; max-height: none; overflow: visible;
	margin: 2px 0 6px; padding: 0 !important; padding-inline-start: 14px !important; border: 0 !important;
	border-inline-start: 2px solid color-mix(in srgb, var(--hk-nav-icon, var(--hk-link)) 35%, transparent) !important;
	margin-inline-start: 22px !important; background: transparent !important; box-shadow: none !important;
}
.hk-sidebar__nav .wp-block-navigation-item:not(.has-child) .wp-block-navigation__submenu-container,
.hk-sidebar__nav .wp-block-navigation-submenu__toggle[aria-expanded="false"] ~ .wp-block-navigation__submenu-container { display: none; }
.hk-sidebar__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 14px !important; font-weight: 400 !important; padding-block: 4px !important; color: var(--hk-text);
}
.hk-sidebar__nav .wp-block-navigation__submenu-container .wp-block-navigation-item > a::before { content: none !important; }
.hk-sidebar__nav .fk-sub-all .wp-block-navigation-item__content { font-weight: 600 !important; color: var(--hk-link); }
.hk-sidebar__nav .wp-block-navigation-submenu__toggle { cursor: pointer; }
.hk-sidebar__nav .wp-block-navigation-submenu__toggle[aria-expanded="true"] { color: var(--hk-strong); }
.hk-sidebar__nav .has-child > .wp-block-navigation__submenu-icon { transition: transform .2s; }
.hk-sidebar__nav .has-child > .wp-block-navigation-submenu__toggle[aria-expanded="true"] + .wp-block-navigation__submenu-icon { transform: rotate(180deg); }
/* Sub-sections open and close only on click (not on hover), in the sidebar and in the phone menu */
.hk-sidebar__nav .wp-block-navigation-submenu:has(> .wp-block-navigation-submenu__toggle[aria-expanded="false"]) > .wp-block-navigation__submenu-container { display: none !important; }
.hk-sidebar__nav .wp-block-navigation__responsive-container:not(.is-menu-open) li.has-child:has(> .wp-block-navigation-submenu__toggle[aria-expanded="true"]) > .wp-block-navigation__submenu-container { display: flex !important; flex-direction: column; }
/* Phone menu: WordPress marks every sub-list open there, so a tap toggles .hk-sub-open instead (feker.js) */
.hk-sidebar__nav .is-menu-open li.has-child.hk-sub-open > .wp-block-navigation__submenu-container { flex-direction: column; }

/* Card titles: room for Arabic letters below the line (the 3-line clamp was clipping them) */
.fk-hcard-title, .fk-card-title, .fk-mini-title { line-height: 1.75 !important; padding-bottom: 3px; }

/* Approved palette (from the design panel): section icon colour and the night-mode background */
:root { --hk-nav-icon: #9C6B3C; }
html[data-theme="dark"] { --wp--preset--color--surface: #312E28; }

/* The sidebar styles from the reference theme use fixed colours of their own (a green hover among them);
   in day mode they now follow the palette, so the design panel changes them too. */
html:not([data-theme="dark"]) .hk-sidebar {
	--gs-sage: var(--wp--preset--color--beige);
	--gs-border: var(--wp--preset--color--line);
	--gs-border-strong: var(--wp--preset--color--line);
	--gs-surface: var(--wp--preset--color--base);
	--gs-text: var(--wp--preset--color--text-dark);
	--gs-text-2: var(--wp--preset--color--contrast);
	--gs-muted: var(--wp--preset--color--muted);
	--gs-faint: var(--wp--preset--color--muted);
	--gs-accent: var(--hk-nav-icon);
	--gs-bronze: var(--wp--preset--color--bronze);
}
.hk-sidebar .hk-sidebar__nav .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--beige) !important; }

/* Site logo size and colour (#6E5D4C = the palette's secondary-text colour, so night mode still lights it up) */
.fk-stamp { width: 104px; background-color: var(--wp--preset--color--muted, #6e5d4c); }
@media (max-width: 781px) { .fk-stamp { width: 69px; } }

/* Sidebar: arrow beside the section name; counts aligned at the end for every row */
.hk-sidebar__nav li.has-child > .wp-block-navigation__submenu-icon { display: none !important; }
.hk-sidebar__nav .wp-block-navigation-submenu__toggle { width: 100% !important; flex: 1 1 auto !important; }
.hk-sidebar__nav .wp-block-navigation-submenu__toggle .wp-block-navigation-item__label { flex: 0 1 auto; }
.fk-sec-chev { display: inline-flex; margin-inline-end: auto; color: var(--hk-muted); transition: transform .2s; }
.wp-block-navigation-submenu__toggle[aria-expanded="true"] .fk-sec-chev,
.is-menu-open li.hk-sub-open > .wp-block-navigation-submenu__toggle .fk-sec-chev { transform: rotate(180deg); }
.is-menu-open li.has-child:not(.hk-sub-open) > .wp-block-navigation-submenu__toggle .fk-sec-chev { transform: none; }

/* Sidebar menu and phone menu: Scheherazade New for the section names */
.hk-sidebar__nav .wp-block-navigation-item__content,
.hk-sidebar__nav .wp-block-navigation-item__label,
.hk-sidebar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: "Scheherazade New", "Amiri", serif !important; }

/* Telegram and mail: lighter than the menu button; same size, no extra nudges */
.hk-sidebar .hk-sidebar__foot .wp-social-link a { color: var(--wp--preset--color--muted) !important; }
.hk-sidebar .hk-sidebar__foot .wp-social-link a:hover { color: var(--wp--preset--color--text-dark) !important; }
.hk-sidebar .hk-sidebar__foot .wp-social-link svg { fill: none !important; }
@media (max-width: 781px) {
	.hk-sidebar .hk-sidebar__foot .wp-social-link-telegram svg,
	.hk-sidebar .hk-sidebar__foot .wp-social-link-mail svg { width: 22px !important; height: 22px !important; transform: none !important; }
}
@media (max-width: 781px) { .hk-sidebar .hk-sidebar__foot .wp-social-link svg { transform: translateY(1px) !important; } } /* same line as the menu icon */

/* Desktop: Telegram and mail live in the icon row at the top; the sidebar footer is no longer needed */
@media (min-width: 782px) { .hk-sidebar .hk-sidebar__foot { display: none !important; } }

/* Page headings (جميع الكتب، المؤلفون، الأقسام…): a little smaller */
.fk-page-title { font-size: 20px !important; }

/* Phone menu: hide WordPress's own sub-menu arrow too (ours sits beside the section name) */
.hk-sidebar__nav .wp-block-navigation__responsive-container.is-menu-open li.has-child > .wp-block-navigation__submenu-icon,
.hk-sidebar__nav .wp-block-navigation__responsive-container li.has-child > .wp-block-navigation__submenu-icon { display: none !important; }

/* Phone menu: the quick icons share the top line with the close (×) button */
.hk-sidebar__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 0 !important; }
.hk-sidebar__nav .is-menu-open .fk-menu-icons { padding-top: 0 !important; padding-inline-end: 44px !important; min-height: 40px; justify-content: space-between !important; }
.hk-sidebar__nav .is-menu-open .wp-block-navigation__responsive-container-close { top: 0 !important; width: 40px; height: 40px; display: flex !important; align-items: center; justify-content: center; }

/* Phone book card (layout B): section and pages use the full card width, side by side on one line */
@media (max-width: 781px) {
	.fk-book--m-b .fk-meta { justify-self: stretch; width: 100%; justify-content: center; gap: 4px 18px; }
	.fk-book--m-b .fk-meta li { white-space: nowrap; flex: 0 0 auto; }
}

/* Night mode: main buttons (download, send comment, search) — dark tinted background, bronze icon */
html[data-theme="dark"] .fk-btn--main,
html[data-theme="dark"] .fk-comments .comment-form .fk-send,
html[data-theme="dark"] .fk-search button {
	background: color-mix(in srgb, var(--wp--preset--color--bronze) 22%, var(--hk-card)) !important;
	color: var(--wp--preset--color--bronze) !important;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--bronze) 35%, transparent);
}
html[data-theme="dark"] .fk-btn--main:hover,
html[data-theme="dark"] .fk-comments .comment-form .fk-send:hover,
html[data-theme="dark"] .fk-search button:hover {
	background: var(--wp--preset--color--bronze) !important;
	color: var(--wp--preset--color--surface) !important;
}

/* No black frame after a mouse click or tap; the outline stays for keyboard users (:focus-visible) */
.wp-site-blocks *:focus:not(:focus-visible),
a:focus:not(:focus-visible), button:focus:not(:focus-visible), [tabindex]:focus:not(:focus-visible) { outline: none !important; box-shadow: none; }
.wp-site-blocks a:focus-visible, .wp-site-blocks button:focus-visible { outline: 2px solid var(--wp--preset--color--bronze) !important; outline-offset: 2px; border-radius: 6px; }

/* Comments: no "no comments yet" line and no "add a comment" heading (only the cancel-reply link when replying) */
.fk-comments .comment-reply-title { margin: 0 !important; font-size: 14px !important; }
.fk-comments .comment-respond { margin-top: 8px !important; }

/* Send button: on the left, a little in from the edge. */
.fk-comments .comment-form .form-submit { display: flex; justify-content: flex-end; padding-inline-end: 14px; }

/* Comments: no empty space above the form (the reply heading shows only while replying). */
.fk-comments .comment-respond { padding-top: 0 !important; }
.fk-comments .comment-reply-title:not(:has(a:not([style*="none"]))) { display: none !important; }

/* Book page boxes: a border the colour of the page, so they read as borderless. */
.fk-book, .fk-box, .fk-comments.hk-article, .fk-mini { border: 1px solid var(--wp--preset--color--surface) !important; box-shadow: none !important; }

/* Borderless look everywhere: box borders take the page colour, and boxes at rest lose their shadow. */
main, .hk-sidebar .wp-block-search { --hk-line: var(--wp--preset--color--surface); }
.hk-sidebar .wp-block-search__inside-wrapper { border-color: var(--wp--preset--color--surface) !important; }
.fk-hcard, .fk-mobile-search, .fk-box, .fk-book { box-shadow: none !important; }
.fk-hcard { border: 1px solid var(--wp--preset--color--surface); }

/* Comments: a folded "add a comment" bar first, then the form (when opened), then the comments. */
.fk-comments .fk-add-cmt {
	display: flex; align-items: center; gap: 8px; width: 100%; margin: 14px 0 0; padding: 12px 14px; cursor: pointer; text-align: start;
	border: 0; border-radius: 10px; background: var(--hk-head); color: var(--hk-muted); font: 400 15px "IBM Plex Sans Arabic", sans-serif;
}
.fk-comments .fk-add-cmt:hover { color: var(--hk-text); }
.fk-comments .fk-add-cmt:focus-visible { outline: 2px solid var(--hk-accent); outline-offset: 2px; }
.fk-comments.fk-form-open .fk-add-cmt { display: none; }
.fk-comments:not(.fk-form-open) .comment-respond { display: none !important; }
.fk-comments .comment-respond { margin-top: 14px !important; }
.fk-comments .comment-respond + .hk-cmt-list, .fk-comments .fk-add-cmt ~ .hk-cmt-list { margin-top: 18px; }

/* In case a browser still links a number (iOS data detectors): show it as plain text. */
a[x-apple-data-detectors], a[href^="tel:"]:not([href^="tel:+"]) { color: inherit !important; text-decoration: none !important; pointer-events: none; }

/* Card footer: views sit beside the date, both on the left. */
.fk-hcard-meta { justify-content: flex-end; gap: 14px; }

/* Card footer: views and date as small snug pills (they don't make the row taller). */
.fk-hcard-meta { gap: 6px; }
.fk-hcard-meta > span, .fk-hcard-meta > .fk-hcard-date {
	display: inline-flex; align-items: center; gap: 4px; padding: 0 7px; line-height: 20px; height: 20px;
	border-radius: 999px; background: var(--hk-head); font-size: 12px;
}
.fk-hcard-meta svg { width: 13px; height: 13px; flex: none; }
html:not([data-theme="dark"]) .fk-hcard-meta > span, html:not([data-theme="dark"]) .fk-hcard-meta > .fk-hcard-date { background: #F0E5D6; }