{"id":1389,"date":"2026-07-26T08:12:36","date_gmt":"2026-07-26T08:12:36","guid":{"rendered":"https:\/\/thkey.net\/?page_id=1389"},"modified":"2026-08-03T08:30:21","modified_gmt":"2026-08-03T08:30:21","slug":"all-courses","status":"publish","type":"page","link":"https:\/\/thkey.net\/en\/all-courses\/","title":{"rendered":"all courses"},"content":{"rendered":"\n<div style=\" margin-top: 15px; margin-left: 10px; margin-right: 10px;\">\n    \t\t<div class=\"atb-nav-bar\">\n\t\t\t\t\t<style>\n\t\t:root{--atb-accent:#19194d;--atb-accent-dark:#14143c;--atb-accent-soft:#e3e3ea;}\n\t\t:root{--atb-bar-violet:#19194d;--atb-bar-lime:#dae83d;--atb-bar-surface:#ffffff;--atb-bar-muted:#8a8fa8;--atb-bar-radius:18px;--atb-bar-dome:46px;--atb-bar-dome-scale:1.533;--atb-bar-height:62px;--atb-bar-shrink:46px;}\n\t\t\/* Keeps this fixed-to-the-bottom bar from covering the last bit of\n\t\t   page content, on whichever page it renders. *\/\n\t\t@media ( max-width: 1024px ) { body { padding-bottom: 72px !important; } }\n\n\t\t\/* TranslatePress's floating language switcher is position:fixed at\n\t\t   bottom:0 with z-index:99999 - higher than this bar's 9999 - so it\n\t\t   lands on top of the bar's last item and covers it (\"\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629\" in\n\t\t   Arabic, \"Explore\" in English: it collides in both languages, since\n\t\t   the pill's own position never changes). Lift it clear of the bar.\n\t\t   Scoped with :has() to pages that actually contain a bar, so the pill\n\t\t   stays exactly where TranslatePress put it everywhere else instead of\n\t\t   floating above nothing. *\/\n\t\t@media ( max-width: 1024px ) {\n\t\t\tbody:has( .tutor-dashboard-nav-mobile ) .trp-floating-switcher.trp-switcher-position-bottom {\n\t\t\t\tbottom: calc( 84px + env( safe-area-inset-bottom, 0px ) ) !important;\n\t\t\t}\n\t\t}\n\n\t\t.atb-tutor-style-bar { display: none; }\n\t\t@media ( min-width: 1025px ) { .atb-tutor-style-bar { display: none !important; } }\n\n\t\t@media ( max-width: 1024px ) {\n\t\t\t\/* Tutor's actual light-theme colours as literal values (text\n\t\t\t   #0c111d, surface #fcfcfc, border #ececed) - Tutor only defines\n\t\t\t   those design tokens on its own dashboard page, so off-dashboard\n\t\t\t   we hardcode them to match its bar pixel-for-pixel. *\/\n\t\t\t.atb-tutor-style-bar {\n\t\t\t\tdisplay: block !important;\n\t\t\t\tposition: fixed !important;\n\t\t\t\tleft: 0;\n\t\t\t\tright: 0;\n\t\t\t\tbottom: 0;\n\t\t\t\tz-index: 9999;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tbackground: #fcfcfc !important;\n\t\t\t\tborder-top: 1px solid #ececed;\n\t\t\t\tbox-shadow: none;\n\t\t\t\tpadding: 16px 16px calc( 12px + env( safe-area-inset-bottom, 0px ) ) !important;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list {\n\t\t\t\tdisplay: flex !important;\n\t\t\t\tflex-flow: row;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: space-between;\n\t\t\t\tgap: 0;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tpadding: 0 !important;\n\t\t\t\tlist-style: none !important;\n\t\t\t\tbackground: transparent !important;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list > li {\n\t\t\t\tflex-flow: column;\n\t\t\t\tmin-width: 44px;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tpadding: 0 !important;\n\t\t\t\tlist-style: none !important;\n\t\t\t\tposition: relative;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list > li > a,\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list > li > button {\n\t\t\t\tdisplay: flex !important;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-start;\n\t\t\t\tgap: 4px;\n\t\t\t\twidth: 100%;\n\t\t\t\tpadding: 0 !important;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tbackground: transparent !important;\n\t\t\t\tborder: 0 !important;\n\t\t\t\tbox-shadow: none !important;\n\t\t\t\tcolor: #0c111d !important;\n\t\t\t\tfont-size: 0.75rem !important;\n\t\t\t\tfont-weight: 500;\n\t\t\t\tline-height: 1.25rem !important;\n\t\t\t\ttext-align: center;\n\t\t\t\ttext-decoration: none !important;\n\t\t\t\tcursor: pointer;\n\t\t\t\tfont-family: inherit;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-icon {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tline-height: 0;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-icon svg { width: 20px; height: 20px; }\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-text {\n\t\t\t\tdisplay: block;\n\t\t\t\tfont-size: 0.75rem !important;\n\t\t\t\tline-height: 1.25rem;\n\t\t\t\twhite-space: nowrap;\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list > li > a.atb-nav-active,\n\t\t\t.atb-tutor-style-bar .tutor-dashboard-nav-mobile-list > li > button.atb-nav-active {\n\t\t\t\tcolor: var(--atb-accent,#183fe1) !important;\n\t\t\t\tfont-weight: 600;\n\t\t\t}\n\t\t\t\/* Anchoring is written with LOGICAL properties (inset-inline-*),\n\t\t\t   never \"right\"\/\"left\", and that is load-bearing rather than\n\t\t\t   stylistic. Both popover triggers (\"Explore\" and \"More\") are the\n\t\t\t   last items in the bar, so in English AND in Arabic they sit at\n\t\t\t   the inline END of it - which means the panel must always grow\n\t\t\t   inline-START-wards, i.e. inwards, to stay on screen. One logical\n\t\t\t   rule expresses that for both directions.\n\n\t\t\t   Previously this rule said \"right: 0\" (physical) and a second rule\n\t\t\t   below tried to flip it with inset-inline-start (logical). In RTL\n\t\t\t   inset-inline-start IS physical right, so the \"flip\" resolved to\n\t\t\t   exactly the same thing as the base rule and did nothing: every\n\t\t\t   panel stayed anchored to its physical right edge and opened\n\t\t\t   leftwards, off the left side of the screen, on the Arabic site.\n\t\t\t   (That flip rule also used :first-of-type, which means \"first <li>\n\t\t\t   among its siblings\" - Home\/My Courses\/My Sessions come first, so\n\t\t\t   it never matched anything in any language.) *\/\n\t\t\t.atb-tutor-style-bar .tutor-popover {\n\t\t\t\tdisplay: none;\n\t\t\t\tposition: absolute;\n\t\t\t\tbottom: calc( 100% + 10px );\n\t\t\t\tinset-inline-end: 0;\n\t\t\t\tinset-inline-start: auto;\n\t\t\t\tmin-width: 210px;\n\t\t\t\tmax-width: calc( 100vw - 24px );\n\t\t\t\tpadding: 6px;\n\t\t\t\tbackground: #fff;\n\t\t\t\tborder: 1px solid #eef0f4;\n\t\t\t\tborder-radius: 14px;\n\t\t\t\tbox-shadow: 0 8px 30px rgba( 15, 23, 42, 0.16 );\n\t\t\t\tz-index: 10000;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .atb-popover-open .tutor-popover { display: block; }\n\t\t\t.atb-tutor-style-bar .tutor-popover::after {\n\t\t\t\tcontent: \"\";\n\t\t\t\tposition: absolute;\n\t\t\t\ttop: 100%;\n\t\t\t\tinset-inline-end: 24px;\n\t\t\t\twidth: 12px;\n\t\t\t\theight: 12px;\n\t\t\t\tmargin-top: -6px;\n\t\t\t\tbackground: #fff;\n\t\t\t\tborder-right: 1px solid #eef0f4;\n\t\t\t\tborder-bottom: 1px solid #eef0f4;\n\t\t\t\ttransform: rotate( 45deg );\n\t\t\t}\n\t\t\t\t\t\t.atb-tutor-style-bar .tutor-popover ul { display: block; margin: 0; padding: 0; list-style: none !important; }\n\t\t\t.atb-tutor-style-bar .tutor-popover li { margin: 0 !important; padding: 0 !important; list-style: none !important; }\n\t\t\t.atb-tutor-style-bar .tutor-popover a {\n\t\t\t\tdisplay: flex !important;\n\t\t\t\tflex-direction: row !important;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 8px;\n\t\t\t\tpadding: 9px 12px !important;\n\t\t\t\tmargin: 0 !important;\n\t\t\t\tborder-radius: 9px;\n\t\t\t\tcolor: #0c111d !important;\n\t\t\t\tfont-size: 0.8125rem !important;\n\t\t\t\tfont-weight: 400;\n\t\t\t\tline-height: 1.25rem !important;\n\t\t\t\ttext-align: start;\n\t\t\t\ttext-decoration: none !important;\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-popover a:hover,\n\t\t\t.atb-tutor-style-bar .tutor-popover a.atb-nav-active {\n\t\t\t\tbackground: var(--atb-accent-soft,#eef2ff);\n\t\t\t\tcolor: var(--atb-accent,#183fe1) !important;\n\t\t\t}\n\t\t\t.atb-tutor-style-bar .tutor-popover a.atb-nav-active { font-weight: 600; }\n\t\t\t.atb-tutor-style-bar .tutor-popover a svg { width: 20px; height: 20px; flex-shrink: 0; color: #0c111d !important; }\n\t\t\t.atb-tutor-style-bar .tutor-popover a.atb-nav-active svg { color: var(--atb-accent,#183fe1) !important; }\n\t\t\t.atb-tutor-style-bar .tutor-popover a .tutor-tiny { font-size: 0.8125rem !important; }\n\t\t}\n\n\t\t\/* Desktop-only \"Back to Dashboard\" link (only on \/courses\/ via the\n\t\t   show_back_link attribute; hidden below 1025px). *\/\n\t\t.atb-back-to-dashboard-wrap { display: none; }\n\t\t@media ( min-width: 1025px ) {\n\t\t\t.atb-back-to-dashboard-wrap { display: block; margin: 0 0 20px; }\n\t\t\t.atb-back-to-dashboard {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tfont-size: 14px;\n\t\t\t\tfont-weight: 600;\n\t\t\t\tcolor: var(--atb-accent,#183fe1);\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t\t.atb-back-to-dashboard:hover { text-decoration: underline; }\n\t\t}\n\t\t<\/style>\n\t\t\t\t\t\t\t<div class=\"tutor-dashboard-nav-mobile atb-tutor-style-bar atb-bar atb-bar-pill atb-bar-press atb-bar-press-strong atb-bar-popover\" role=\"navigation\">\n\t\t\t<ul class=\"tutor-dashboard-nav-mobile-list\">\n\t\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t<a class=\"\" href=\"https:\/\/thkey.net\/en\/\">\n\t\t\t\t\t\t\t<span class=\"tutor-dashboard-nav-mobile-icon\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M3 11.5 12 4l9 7.5\"\/><path d=\"M5.5 10v9a1 1 0 0 0 1 1H9v-5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v5h2.5a1 1 0 0 0 1-1v-9\"\/><\/svg><\/span>\n\t\t\t\t\t\t\t<span class=\"tutor-tiny tutor-dashboard-nav-mobile-text\">Home<\/span>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t<a class=\"\" href=\"https:\/\/thkey.net\/book-a-session\/\">\n\t\t\t\t\t\t\t<span class=\"tutor-dashboard-nav-mobile-icon\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3.5\" y=\"5\" width=\"17\" height=\"16\" rx=\"2\"\/><path d=\"M8 3v4M16 3v4M3.5 10h17\"\/><\/svg><\/span>\n\t\t\t\t\t\t\t<span class=\"tutor-tiny tutor-dashboard-nav-mobile-text\">Sessions<\/span>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t<a class=\"\" href=\"https:\/\/thkey.net\/suggested-courses\/\">\n\t\t\t\t\t\t\t<span class=\"tutor-dashboard-nav-mobile-icon\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 5.5c2-1 5-1 8 .5 3-1.5 6-1.5 8-.5v13c-2-1-5-1-8 .5-3-1.5-6-1.5-8-.5Z\"\/><path d=\"M12 6v13\"\/><\/svg><\/span>\n\t\t\t\t\t\t\t<span class=\"tutor-tiny tutor-dashboard-nav-mobile-text\">Courses<\/span>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t<a class=\"\" href=\"https:\/\/thkey.net\/login\/\">\n\t\t\t\t\t\t\t<span class=\"tutor-dashboard-nav-mobile-icon\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"8\" r=\"3.5\"\/><path d=\"M5 20c1-4 4.5-6 7-6s6 2 7 6\"\/><\/svg><\/span>\n\t\t\t\t\t\t\t<span class=\"tutor-tiny tutor-dashboard-nav-mobile-text\">Login \/ Register<\/span>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/li>\n\t\t\t\t\t\t\t<\/ul>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\n    \t<div id=\"fifty-all-courses-1\" class=\"fifty-explorer fifty-all-courses\" data-fifty-all-courses data-per-page=\"6\">\n\t\t<style>\n\t\t#fifty-all-courses-1 { max-width:1200px; margin:0 auto; font-family:inherit; box-sizing:border-box; }\n\t\t#fifty-all-courses-1 *, #fifty-all-courses-1 *::before, #fifty-all-courses-1 *::after { box-sizing:inherit; }\n\n\t\t\/* Mobile-first base: everything stacked, big touch targets. *\/\n\t\t#fifty-all-courses-1 .fifty-explorer-search { display:flex; gap:8px; margin:0 0 12px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-search input[type=\"search\"] { flex:1; padding:12px 16px; border:1.5px solid #E2E2EA; border-radius:999px; font-size:15px; min-width:0; }\n\t\t#fifty-all-courses-1 .fifty-explorer-search button { padding:12px 20px; background:#19194D; color:#fff; border:none; border-radius:999px; cursor:pointer; font-weight:700; font-size:14px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 12px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-toggle { display:inline-flex; align-items:center; gap:5px; background:#F0F1F7; border:1px solid #E2E2EA; color:#19194D; font-weight:700; font-size:12.5px; line-height:1.2; padding:7px 13px; border-radius:999px; cursor:pointer; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-toggle svg { width:13px; height:13px; flex:none; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-toggle.is-active { background:#19194D; border-color:#19194D; color:#fff; }\n\t\t#fifty-all-courses-1 .fifty-explorer-count { font-size:12px; color:#8A8A99; white-space:nowrap; }\n\t\t#fifty-all-courses-1 .fifty-explorer-suggest-link { display:flex; align-items:center; justify-content:space-between; gap:10px; background:#F7F9E6; border:1px solid #DAE83D; border-radius:12px; padding:10px 14px; margin:0 0 16px; text-decoration:none; color:#19194D; font-size:12.5px; font-weight:600; line-height:1.35; }\n\t\t#fifty-all-courses-1 .fifty-explorer-suggest-link span:last-child { font-size:15px; flex:none; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters { display:none; background:#F5F6FA; border:1px solid #ECECF2; border-radius:14px; padding:16px; margin:0 0 20px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters.is-open { display:block; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters h4 { margin:16px 0 8px; font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; color:#19194D; font-weight:800; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters h4:first-child { margin-top:0; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-head { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid #E2E2EA; padding-bottom:10px; margin-bottom:4px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-head h4 { margin:0; font-size:13px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-clear { background:none; border:none; padding:0; color:#6B6B78; font-size:12px; font-weight:600; text-decoration:underline; cursor:pointer; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters label { display:flex; align-items:center; gap:6px; font-size:14px; margin:6px 0; font-weight:400; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters select { width:100%; padding:10px; border-radius:8px; border:1px solid #ddd; margin-bottom:6px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-filters-apply { display:block; width:max-content; max-width:100%; margin:16px auto 0; padding:9px 22px; background:#19194D; color:#fff; border:none; border-radius:999px; font-weight:700; font-size:12.5px; line-height:1.2; cursor:pointer; }\n\t\t#fifty-all-courses-1 .fifty-explorer-section-title { font-size:17px; font-weight:800; margin:0 0 12px; color:#19194D; }\n\t\t#fifty-all-courses-1 .fifty-explorer-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:0 0 18px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-empty { background:#F5F6FA; border:1px dashed #C9CBDA; border-radius:12px; color:#6B6B78; font-size:13px; line-height:1.5; padding:20px 16px; text-align:center; margin:0 0 18px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-admin-note { font-size:12px; color:#b32d2e; background:#fdecea; border-radius:8px; padding:10px 12px; margin:0 0 14px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-pagination { display:flex; justify-content:center; flex-wrap:wrap; gap:6px; margin:8px 0 30px; }\n\t\t#fifty-all-courses-1 .fifty-explorer-page-btn { min-width:38px; padding:9px 12px; border-radius:10px; border:1px solid #E2E2EA; background:#fff; color:#19194D; font-weight:700; font-size:13.5px; cursor:pointer; }\n\t\t#fifty-all-courses-1 .fifty-explorer-page-btn.is-active { background:#19194D; color:#fff; border-color:#19194D; }\n\t\t#fifty-all-courses-1 .fifty-explorer-page-btn:disabled { opacity:.4; cursor:default; }\n\n\t\t\/* Larger screens: filters become a permanent sidebar, grid gets roomier. *\/\n\t\t@media (min-width:480px) {\n\t\t\t#fifty-all-courses-1 .fifty-explorer-grid { gap:14px; }\n\t\t}\n\t\t@media (min-width:900px) {\n\t\t\t\t\t\t#fifty-all-courses-1 .fifty-explorer-filters-toggle { display:none; }\n\t\t\t#fifty-all-courses-1 .fifty-explorer-filters-apply { display:none; }\n\t\t\t#fifty-all-courses-1 .fifty-explorer-layout { display:flex; gap:24px; align-items:flex-start; }\n\t\t\t#fifty-all-courses-1 .fifty-explorer-filters { display:block !important; width:250px; flex:none; margin:0; }\n\t\t\t#fifty-all-courses-1 .fifty-explorer-main { flex:1; min-width:0; }\n\t\t\t\t\t\t#fifty-all-courses-1 .fifty-explorer-grid { grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:18px; }\n\t\t}\n\t\t\n#fifty-all-courses-1 .fifty-explorer-card { position:relative; display:block; text-decoration:none; color:inherit; background:#fff; border:1px solid #ECECF2; border-radius:14px; overflow:hidden; transition:transform .15s ease, box-shadow .15s ease; }\n#fifty-all-courses-1 .fifty-explorer-card:hover { box-shadow:0 6px 20px rgba(25,25,77,.10); }\n#fifty-all-courses-1 .fifty-explorer-card:active { transform:scale(0.98); }\n#fifty-all-courses-1 .fifty-explorer-card-media { position:relative; aspect-ratio:16\/9; background:#EEF0F7; overflow:hidden; }\n#fifty-all-courses-1 .fifty-explorer-card-media img { width:100%; height:100%; object-fit:cover; display:block; }\n#fifty-all-courses-1 .fifty-explorer-card-media-fallback { width:100%; height:100%; background:linear-gradient(135deg,#19194D,#33336e); }\n#fifty-all-courses-1 .fifty-explorer-card-level { position:absolute; top:8px; inset-inline-start:8px; background:rgba(25,25,77,.85); color:#fff; font-size:10.5px; font-weight:700; padding:3px 9px; border-radius:999px; text-transform:capitalize; }\n#fifty-all-courses-1 .fifty-explorer-card-body { padding:11px 13px 13px; }\n#fifty-all-courses-1 .fifty-explorer-card-title { font-size:14px; font-weight:700; line-height:1.35; margin:0 0 4px; color:#19194D; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }\n#fifty-all-courses-1 .fifty-explorer-card-instructor { font-size:12px; color:#8A8A99; margin:0 0 8px; }\n#fifty-all-courses-1 .fifty-explorer-card-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; }\n#fifty-all-courses-1 .fifty-explorer-card-rating { font-size:12px; color:#B98B00; display:inline-flex; align-items:center; gap:3px; white-space:nowrap; }\n#fifty-all-courses-1 .fifty-explorer-card-rcount { color:#8A8A99; font-weight:400; }\n#fifty-all-courses-1 .fifty-explorer-card-price { font-size:13px; font-weight:800; color:#19194D; display:inline-flex; align-items:baseline; justify-content:flex-end; gap:6px; flex-wrap:wrap; text-align:end; min-width:0; }\n#fifty-all-courses-1 .fifty-explorer-card-price.is-free { color:#5C7A00; }\n#fifty-all-courses-1 .fifty-explorer-card-price-now { color:#19194D; font-weight:800; }\n#fifty-all-courses-1 .fifty-explorer-card-price-was { font-size:11.5px; font-weight:600; color:#A6A6B4; text-decoration:line-through; text-decoration-thickness:1.5px; }\n\/* Flatten whatever markup the payment plugin wraps the number in. Scoped to\n   the INSIDE of each amount, so it can never out-specify the amount itself\n   and quietly undo the struck-through styling on the old price. *\/\n#fifty-all-courses-1 .fifty-explorer-card-price-now *, #fifty-all-courses-1 .fifty-explorer-card-price-was * { font-size:inherit; font-weight:inherit; color:inherit; text-decoration:inherit; background:none; }\n#fifty-all-courses-1 .fifty-explorer-card-price .screen-reader-text { display:none !important; }\n#fifty-all-courses-1 .fifty-explorer-card-sale { position:absolute; top:8px; inset-inline-end:8px; background:#DAE83D; color:#19194D; font-size:10.5px; font-weight:800; letter-spacing:.02em; padding:3px 9px; border-radius:999px; box-shadow:0 2px 6px rgba(0,0,0,.14); }\n\t\t<\/style>\n\n\t\t<div class=\"fifty-explorer-search\">\n\t\t\t<input type=\"search\" placeholder=\"Search by course or instructor\u2026\" data-fifty-explorer-search>\n\t\t\t<button type=\"button\" data-fifty-explorer-search-btn>Search<\/button>\n\t\t<\/div>\n\n\t\t<div class=\"fifty-explorer-toolbar\">\n\t\t\t<button type=\"button\" class=\"fifty-explorer-filters-toggle\" data-fifty-filters-toggle aria-expanded=\"false\">\n\t\t\t\t<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" aria-hidden=\"true\"><path d=\"M3 6h18M7 12h10M10 18h4\"\/><\/svg>\n\t\t\t\tFilters\t\t\t<\/button>\n\t\t\t<span class=\"fifty-explorer-count\" data-fifty-explorer-count><\/span>\n\t\t<\/div>\n\n\t\t\n\t\t<div class=\"fifty-explorer-layout\">\n\t\t\t<div class=\"fifty-explorer-filters\" data-fifty-filters-panel>\n\t\t\t\t<div class=\"fifty-explorer-filters-head\">\n\t\t\t\t\t<h4>Filter courses<\/h4>\n\t\t\t\t\t<button type=\"button\" class=\"fifty-explorer-filters-clear\" data-fifty-filters-clear>Clear all<\/button>\n\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t\t\t<h4>Education<\/h4>\n\t\t\t\t\t\t<div class=\"fifty-edu-fields\" data-fifty-edu-fields>\n\t\t<div class=\"tutor-form-group fifty-edu-form-group\">\n\t\t\t<label class=\"tutor-block tutor-mb-3 fifty-edu-label\">Education Level<\/label>\n\t\t\t<div class=\"tutor-input-field tutor-mb-8\">\n\t\t\t\t<select class=\"tutor-form-control tutor-input fifty-edu-select\" name=\"fifty_education_level\" data-fifty-edu-level >\n\t\t\t\t\t<option value=\"\">\u2014 Select \u2014<\/option>\n\t\t\t\t\t\t\t\t\t\t\t<option value=\"high_school\" >High School<\/option>\n\t\t\t\t\t\t\t\t\t\t\t<option value=\"undergraduate\" >Undergraduate<\/option>\n\t\t\t\t\t\t\t\t\t\t\t<option value=\"fresh_graduate\" >Fresh Graduate<\/option>\n\t\t\t\t\t\t\t\t\t<\/select>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"tutor-form-group fifty-edu-form-group fifty-edu-university-wrap\" data-fifty-edu-university-wrap style=\"display:none;\">\n\t\t\t<label class=\"tutor-block tutor-mb-3 fifty-edu-label\">University<\/label>\n\t\t\t<div class=\"tutor-input-field tutor-mb-8\">\n\t\t\t\t<select class=\"tutor-form-control tutor-input fifty-edu-select\" name=\"fifty_university_term_id\" data-fifty-edu-university>\n\t\t\t\t\t<option value=\"\">\u2014 Select \u2014<\/option>\n\t\t\t\t\t<option value=\"66\">\u062c\u0627\u0645\u0639\u0629 \u0627\u0644\u0645\u0644\u0643<\/option><option value=\"68\">\u062c\u0627\u0645\u0639\u0629 \u0627\u0644\u0645\u0644\u06432<\/option><option value=\"45\">\u062c\u0627\u0645\u0639\u0629 \u0633\u062a\u0627\u0646\u0641\u0648\u0631\u062f<\/option><option value=\"46\">\u062c\u0627\u0645\u0639\u0629 \u0645\u064a\u0634\u064a\u063a\u0627\u0646<\/option><option value=\"44\">\u062c\u0627\u0645\u0639\u0629 \u0647\u0627\u0631\u0641\u0627\u0631\u062f<\/option>\t\t\t\t<\/select>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t<div class=\"tutor-form-group fifty-edu-form-group fifty-edu-major-wrap\" data-fifty-edu-major-wrap style=\"display:none;\">\n\t\t\t<label class=\"tutor-block tutor-mb-3 fifty-edu-label\">Major<\/label>\n\t\t\t<div class=\"tutor-input-field tutor-mb-8\">\n\t\t\t\t<select class=\"tutor-form-control tutor-input fifty-edu-select\" name=\"fifty_major_term_id\" data-fifty-edu-major>\n\t\t\t\t\t<option value=\"\">\u2014 Select \u2014<\/option>\n\t\t\t\t\t\t\t\t\t<\/select>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t<\/div>\n\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t<h4>Category<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<label><input type=\"checkbox\" data-fifty-explorer-category value=\"52\"> \u0627\u0644\u0645\u0647\u0627\u0631\u0627\u062a \u0627\u0644\u062d\u064a\u0627\u062a\u064a\u0629<\/label>\n\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t\n\t\t\t\t<button type=\"button\" class=\"fifty-explorer-filters-apply\" data-fifty-filters-apply>See results<\/button>\n\t\t\t<\/div>\n\n\t\t\t<div class=\"fifty-explorer-main\">\n\t\t\t\t<div class=\"fifty-explorer-section-title\">All Courses<\/div>\n\t\t\t\t<div class=\"fifty-explorer-grid\" data-fifty-explorer-results><\/div>\n\t\t\t\t<div class=\"fifty-explorer-empty\" data-fifty-explorer-empty style=\"display:none;\">No courses match these filters.<\/div>\n\t\t\t\t<div class=\"fifty-explorer-pagination\" data-fifty-explorer-pagination><\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t<\/div>\n\n\t<script>\n\t( function () {\n\t\tvar root = document.getElementById( \"fifty-all-courses-1\" );\n\t\tif ( ! root || root.dataset.fiftyAllCoursesWired ) {\n\t\t\treturn;\n\t\t}\n\t\troot.dataset.fiftyAllCoursesWired = '1';\n\n\t\tvar ajaxUrl     = \"https:\\\/\\\/thkey.net\\\/wp-admin\\\/admin-ajax.php\";\n\t\tvar nonce       = \"81cda099a7\";\n\t\tvar resultsEl   = root.querySelector( '[data-fifty-explorer-results]' );\n\t\tvar emptyEl     = root.querySelector( '[data-fifty-explorer-empty]' );\n\t\tvar pagerEl     = root.querySelector( '[data-fifty-explorer-pagination]' );\n\t\tvar countEl     = root.querySelector( '[data-fifty-explorer-count]' );\n\t\tvar countLabel  = \"%s courses\";\n\t\tvar filtersBtn  = root.querySelector( '[data-fifty-filters-toggle]' );\n\t\tvar filtersPnl  = root.querySelector( '[data-fifty-filters-panel]' );\n\t\tvar filtersOk   = root.querySelector( '[data-fifty-filters-apply]' );\n\t\tvar page        = 1;\n\t\tvar debounceTimer;\n\n\t\tif ( filtersBtn && filtersPnl ) {\n\t\t\tfiltersBtn.addEventListener( 'click', function () {\n\t\t\t\tvar isOpen = filtersPnl.classList.toggle( 'is-open' );\n\t\t\t\tfiltersBtn.classList.toggle( 'is-active', isOpen );\n\t\t\t\tfiltersBtn.setAttribute( 'aria-expanded', isOpen ? 'true' : 'false' );\n\t\t\t} );\n\t\t}\n\t\tif ( filtersOk && filtersPnl && filtersBtn ) {\n\t\t\tfiltersOk.addEventListener( 'click', function () {\n\t\t\t\tfiltersPnl.classList.remove( 'is-open' );\n\t\t\t\tfiltersBtn.classList.remove( 'is-active' );\n\t\t\t\tfiltersBtn.setAttribute( 'aria-expanded', 'false' );\n\t\t\t} );\n\t\t}\n\n\t\tfunction currentFilters() {\n\t\t\tvar eduSelect = root.querySelector( '[data-fifty-edu-level]' );\n\t\t\tvar uniSelect = root.querySelector( '[data-fifty-edu-university]' );\n\t\t\tvar majSelect = root.querySelector( '[data-fifty-edu-major]' );\n\t\t\tvar priceVals = Array.from( root.querySelectorAll( '[data-fifty-explorer-price]:checked' ) ).map( function ( el ) { return el.value; } );\n\t\t\tvar levelVals = Array.from( root.querySelectorAll( '[data-fifty-explorer-level]:checked' ) ).map( function ( el ) { return el.value; } );\n\t\t\tvar catVals   = Array.from( root.querySelectorAll( '[data-fifty-explorer-category]:checked' ) ).map( function ( el ) { return el.value; } );\n\t\t\treturn {\n\t\t\t\tkeyword: root.querySelector( '[data-fifty-explorer-search]' ).value || '',\n\t\t\t\teducation_level: eduSelect ? eduSelect.value : '',\n\t\t\t\tuniversity_term_id: uniSelect ? uniSelect.value : '',\n\t\t\t\tmajor_term_id: majSelect ? majSelect.value : '',\n\t\t\t\tprice: priceVals,\n\t\t\t\tlevel: levelVals,\n\t\t\t\tcategory: catVals,\n\t\t\t};\n\t\t}\n\n\t\tfunction renderPagination( totalPages ) {\n\t\t\tif ( ! pagerEl ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( totalPages <= 1 ) {\n\t\t\t\tpagerEl.innerHTML = '';\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tvar start = Math.max( 1, page - 2 );\n\t\t\tvar end   = Math.min( totalPages, start + 4 );\n\t\t\tstart     = Math.max( 1, end - 4 );\n\n\t\t\tvar html = '';\n\t\t\thtml += '<button type=\"button\" class=\"fifty-explorer-page-btn\" data-fifty-page=\"' + Math.max( 1, page - 1 ) + '\"' + ( page <= 1 ? ' disabled' : '' ) + '>&lsaquo;<\/button>';\n\t\t\tfor ( var p = start; p <= end; p++ ) {\n\t\t\t\thtml += '<button type=\"button\" class=\"fifty-explorer-page-btn' + ( p === page ? ' is-active' : '' ) + '\" data-fifty-page=\"' + p + '\">' + p + '<\/button>';\n\t\t\t}\n\t\t\thtml += '<button type=\"button\" class=\"fifty-explorer-page-btn\" data-fifty-page=\"' + Math.min( totalPages, page + 1 ) + '\"' + ( page >= totalPages ? ' disabled' : '' ) + '>&rsaquo;<\/button>';\n\t\t\tpagerEl.innerHTML = html;\n\n\t\t\tArray.from( pagerEl.querySelectorAll( '[data-fifty-page]' ) ).forEach( function ( btn ) {\n\t\t\t\tbtn.addEventListener( 'click', function () {\n\t\t\t\t\tvar target = parseInt( btn.getAttribute( 'data-fifty-page' ), 10 );\n\t\t\t\t\tif ( ! target || target === page ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tpage = target;\n\t\t\t\t\tfetchResults();\n\t\t\t\t\tresultsEl.scrollIntoView( { behavior: 'smooth', block: 'start' } );\n\t\t\t\t} );\n\t\t\t} );\n\t\t}\n\n\t\tfunction fetchResults() {\n\t\t\tvar f    = currentFilters();\n\t\t\tvar body = new URLSearchParams();\n\t\t\tbody.set( 'action', 'fifty_courses_explorer_query' );\n\t\t\tbody.set( 'nonce', nonce );\n\t\t\tbody.set( 'page', page );\n\t\t\tbody.set( 'keyword', f.keyword );\n\t\t\tbody.set( 'education_level', f.education_level );\n\t\t\tbody.set( 'university_term_id', f.university_term_id );\n\t\t\tbody.set( 'major_term_id', f.major_term_id );\n\t\t\tf.price.forEach( function ( v ) { body.append( 'price[]', v ); } );\n\t\t\tf.level.forEach( function ( v ) { body.append( 'level[]', v ); } );\n\t\t\tf.category.forEach( function ( v ) { body.append( 'category[]', v ); } );\n\n\t\t\tfetch( ajaxUrl, { method: 'POST', credentials: 'same-origin', body: body } )\n\t\t\t\t.then( function ( r ) { return r.json(); } )\n\t\t\t\t.then( function ( res ) {\n\t\t\t\t\tif ( ! res || ! res.success ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tresultsEl.innerHTML = res.data.html;\n\t\t\t\t\tif ( ! res.data.found && res.data.empty_message ) {\n\t\t\t\t\t\temptyEl.textContent = res.data.empty_message;\n\t\t\t\t\t}\n\t\t\t\t\temptyEl.style.display = res.data.found ? 'none' : '';\n\t\t\t\t\tif ( countEl ) {\n\t\t\t\t\t\tcountEl.textContent = res.data.found ? countLabel.replace( '%s', res.data.found ) : '';\n\t\t\t\t\t}\n\t\t\t\t\trenderPagination( res.data.total_pages || 1 );\n\t\t\t\t} )\n\t\t\t\t.catch( function () {} );\n\t\t}\n\n\t\tfunction debouncedRefetch() {\n\t\t\tclearTimeout( debounceTimer );\n\t\t\tdebounceTimer = setTimeout( function () { page = 1; fetchResults(); }, 350 );\n\t\t}\n\n\t\troot.querySelector( '[data-fifty-explorer-search]' ).addEventListener( 'input', debouncedRefetch );\n\t\troot.querySelector( '[data-fifty-explorer-search-btn]' ).addEventListener( 'click', function () { page = 1; fetchResults(); } );\n\t\troot.querySelectorAll( '[data-fifty-explorer-price], [data-fifty-explorer-level], [data-fifty-explorer-category]' ).forEach( function ( el ) {\n\t\t\tel.addEventListener( 'change', function () { page = 1; fetchResults(); } );\n\t\t} );\n\t\t\/\/ Re-fetch whenever the education cascade (Level\/University\/Major) changes too.\n\t\troot.addEventListener( 'change', function ( e ) {\n\t\t\tif ( e.target.matches( '[data-fifty-edu-level], [data-fifty-edu-university], [data-fifty-edu-major]' ) ) {\n\t\t\t\tpage = 1;\n\t\t\t\tfetchResults();\n\t\t\t}\n\t\t} );\n\n\t\tvar clearBtn = root.querySelector( '[data-fifty-filters-clear]' );\n\t\tif ( clearBtn ) {\n\t\t\tclearBtn.addEventListener( 'click', function () {\n\t\t\t\troot.querySelectorAll( '[data-fifty-explorer-price], [data-fifty-explorer-level], [data-fifty-explorer-category]' ).forEach( function ( el ) {\n\t\t\t\t\tel.checked = false;\n\t\t\t\t} );\n\t\t\t\troot.querySelectorAll( '[data-fifty-edu-level], [data-fifty-edu-university], [data-fifty-edu-major]' ).forEach( function ( el ) {\n\t\t\t\t\tel.value = '';\n\t\t\t\t\tel.dispatchEvent( new Event( 'change', { bubbles: true } ) );\n\t\t\t\t} );\n\t\t\t\troot.querySelector( '[data-fifty-explorer-search]' ).value = '';\n\t\t\t\tpage = 1;\n\t\t\t\tfetchResults();\n\t\t\t} );\n\t\t}\n\n\t\tfetchResults();\n\t} )();\n\t<\/script>\n\t\n<\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":"","_members_access_role":[],"_members_access_error":""},"class_list":["post-1389","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/pages\/1389","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/comments?post=1389"}],"version-history":[{"count":16,"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/pages\/1389\/revisions"}],"predecessor-version":[{"id":1552,"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/pages\/1389\/revisions\/1552"}],"wp:attachment":[{"href":"https:\/\/thkey.net\/en\/wp-json\/wp\/v2\/media?parent=1389"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}