/* Тема: каталог онлайн-тестів (/test…) */
.tb-tests .tb-tests-subjects { margin-bottom: 14px; display: grid; gap: 6px; }
.tb-tests .tb-tests-form { margin: 0; display: grid; gap: 12px; }
.tb-tests .tb-search-field { flex: 1; margin: 0; }
.tb-tests .tb-search-field .form-control { width: 100%; min-height: 44px; padding: 8px 40px 8px 38px; border: 2px solid var(--line); border-radius: 12px; background: var(--paper); font: 500 15px/1.3 var(--f-body); color: var(--ink); box-shadow: none; height: auto; }
.tb-tests .tb-search-field .form-control:focus { border-color: var(--sky); background: #fff; }
.tb-tests .tb-search-clear { position: absolute; right: 10px; color: var(--ink-3); font-weight: 700; text-decoration: none !important; }
.tb-tests .tb-selectbox .form-group { margin: 0; }
.tb-tests .tb-selectbox .help-block { display: none; }
.tb-tests-grid { grid-template-areas: "main top" "main top"; }
/* без правої колонки — список на всю ширину змісту */
.tb-tests-grid-full { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main"; }
/* ряд пошуку: запит · предмет · клас · «Знайти» (44px, проміжок 10px) */
.tb-tests .tb-filters-row > .tb-selectbox { display: flex; min-width: 0; margin: 0; }
.tb-tests .tb-selectbox .form-group { flex: 1; min-width: 0; }
.tb-tests .tb-selectbox .tb-select { width: 100%; }
.tb-tests .tb-tests-select-subject { flex: 0 1 260px; }
.tb-tests .tb-tests-select-grade { flex: 0 1 150px; }
/* на телефоні фільтри в стовпчик на всю ширину — як у бібліотеці (інакше «Оберіть предмет» і «Клас» обривались посередині) */
@media (max-width: 640px) { .tb-tests .tb-tests-select-subject, .tb-tests .tb-tests-select-grade { flex: 1 1 100%; width: 100%; } .tb-tests .tb-selectbox select { width: 100%; } }
.tb-tests-create { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; background: linear-gradient(135deg, #fff8e1, #fff); }
.tb-tests-create b { display: block; font: 800 17px/1.25 var(--f-display); }
.tb-tests-create span { font-size: 14px; color: var(--ink-2); }
.tb-tests-cards { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.tb-tests .tb-crumbs svg { width: 14px; height: 14px; color: var(--line-2); }
.tb-tests-seo-text { margin-top: 16px; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.tb-tests-seo-text h2, .tb-tests-seo-text h3 { font: 800 18px/1.25 var(--f-display); color: var(--ink); margin: 14px 0 8px; }
.tb-tests-videos { display: grid; gap: 8px; }
.tb-tests-video { display: grid; gap: 6px; border-radius: 12px; overflow: hidden; color: var(--ink) !important; text-decoration: none !important; }
.tb-tests-video img { width: 100%; border-radius: 12px; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.tb-tests-video b { font: 700 13.5px/1.3 var(--f-display); }
.tb-tests-video:hover img { filter: brightness(.95); }
.tb-tests-admin { padding-top: 8px; border-top: 1px dashed var(--line); }
.tb-tests-promo-classic:empty { display: none; }
@media (max-width: 991px) { .tb-tests-grid { grid-template-areas: "main"; grid-template-columns: 1fr; } }
@media (max-width: 640px) { .tb-tests-cards { grid-template-columns: 1fr; } .tb-tests .tb-selectbox { width: 100%; } .tb-tests .tb-selectbox .tb-select { width: 100%; } }
@media (max-width: 640px) {
    .tb-tests .tb-filters-row > * { width: 100%; }
    .tb-tests .tb-filters-row .tb-btn { width: 100%; }
}
/* Результати домашнього завдання (/test/homework/<id>) */
.tb-hw .tb-page-h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.tb-hw-edit { display: inline-flex; align-items: center; gap: 4px; font: 700 13px/1 var(--f-body); color: var(--ink-3) !important; text-decoration: none !important; }
.tb-hw-edit:hover { color: var(--orange-d) !important; }
.tb-hw-edit svg { width: 14px; height: 14px; }
.tb-hw-head-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tb-hw-head-actions .tb-btn svg, .tb-hw-exports .tb-btn svg { width: 15px; height: 15px; }
.tb-hw-head-actions .toggle-share.active { background: var(--paper); }
.tb-hw-share { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; margin-bottom: 14px; background: linear-gradient(135deg, #fff8e1, #fff 70%); }
.tb-hw-share-main { display: grid; gap: 8px; }
.tb-hw-share-main .homework-code-info { margin: 0; font-size: 14px; color: var(--ink-2); }
.tb-hw-share-main .homework-code-info a { color: var(--ink); font-weight: 700; }
.tb-hw-code-row { display: flex; align-items: center; gap: 12px; }
.tb-hw-code { font: 900 34px/1 var(--f-display); letter-spacing: .08em; color: var(--ink); padding: 6px 14px; border-radius: 12px; background: #fff; border: 2px dashed var(--go); }
.tb-hw-share-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tb-hw-join { width: min(360px, 100%) !important; min-height: 40px !important; height: 40px !important; padding: 6px 12px !important; border: 2px solid var(--line) !important; border-radius: 10px !important; font: 500 13px/1.3 var(--f-body) !important; box-shadow: none !important; }
.tb-hw-share-art img { width: 100%; }
.tb-hw-summary { grid-template-columns: repeat(3, minmax(120px, 1fr)) minmax(240px, 2fr); }
.tb-hw-exports { display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px; justify-content: center; }
.tb-hw-exports .tb-btn.is-disabled { opacity: .5; cursor: default; }
.tb-hw-tabs-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.tb-hw-tabs.nav-tabs { border: 0; display: inline-flex; gap: 2px; padding: 3px; border-radius: 12px; background: var(--paper); }
.tb-hw-tabs.nav-tabs > li > a { margin: 0; border: 0 !important; border-radius: 9px; padding: 8px 14px; font: 700 14px/1 var(--f-body); color: var(--ink-2); }
.tb-hw-tabs.nav-tabs > li.active > a, .tb-hw-tabs.nav-tabs > li > a:hover { background: var(--ink); color: #fff; }
.tb-hw-tabs.nav-tabs > li > a:hover { background: #fff; color: var(--ink); }
.tb-hw-tabs.nav-tabs > li.active > a:hover { background: var(--ink); color: #fff; }
.tb-hw-sessions { display: grid; gap: 8px; }
.tb-hw-session { display: grid; grid-template-columns: minmax(160px, 1.2fr) minmax(0, 2fr) 64px 80px 80px; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 2px solid var(--line); cursor: pointer; transition: border-color .12s, transform .12s; }
.tb-hw-session:hover { border-color: var(--ink); transform: translateY(-1px); }
.tb-hw-session-name { display: grid; gap: 2px; min-width: 0; }
.tb-hw-session-name b { font: 700 15px/1.25 var(--f-body); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-hw-session-name small { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-3); }
.tb-hw-session-bar { display: flex; height: 22px; border-radius: 8px; overflow: hidden; background: var(--paper); }
.tb-hw-session-bar i { display: grid; place-items: center; min-width: 22px; font: 700 11.5px/1 var(--f-body); color: #fff; font-style: normal; }
.tb-hw-session-bar .is-ok { background: var(--mint); } .tb-hw-session-bar .is-part { background: var(--go); color: var(--ink); } .tb-hw-session-bar .is-bad { background: var(--coral); } .tb-hw-session-bar .is-skip { background: var(--line-2); color: var(--ink-2); }
.tb-hw-questions { display: grid; gap: 10px; }
.tb-hw-question-text { font-size: 15px; line-height: 1.5; margin-bottom: 10px; }
.tb-hw-question-text p { margin: 0; display: inline; }
.tb-hw-options { display: grid; gap: 6px; }
.tb-hw-option { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto 120px; align-items: center; gap: 10px; padding: 6px 10px; border-radius: 10px; background: var(--paper); font-size: 14px; }
.tb-hw-option-n { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #fff; font: 800 12px/1 var(--f-display); color: var(--ink-2); }
.tb-hw-option.is-ok .tb-hw-option-n { background: var(--mint); color: #fff; }
.tb-hw-option.is-bad .tb-hw-option-n { background: var(--coral); color: #fff; }
.tb-hw-option-value p { margin: 0; display: inline; }
.tb-hw-option-stat { font-size: 12.5px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.tb-hw-option-meter { height: 8px; border-radius: 4px; background: #fff; overflow: hidden; }
.tb-hw-option-meter i { display: block; height: 100%; background: var(--sky); border-radius: 4px; }
.tb-hw-option.is-ok .tb-hw-option-meter i { background: var(--mint); }
/* модалки (класична розмітка бутстрапу) у стилі бети на цій сторінці */
.tb-hw .modal .homework-switcher { padding: 6px 0; border-bottom: 1px dashed var(--line); }
@media (max-width: 991px) { .tb-hw-share { grid-template-columns: 1fr; } .tb-hw-summary { grid-template-columns: repeat(3, 1fr); } .tb-hw-exports { grid-column: 1 / -1; } }
@media (max-width: 640px) {
    .tb-hw-session { grid-template-columns: 1fr 1fr 1fr; }
    .tb-hw-session-name, .tb-hw-session-bar { grid-column: 1 / -1; }
    .tb-hw-option { grid-template-columns: 26px minmax(0, 1fr); }
    .tb-hw-option-stat, .tb-hw-option-meter { grid-column: 2; }
    .tb-hw-code { font-size: 26px; }
    .tb-hw-summary { grid-template-columns: 1fr 1fr; }
}
/* лише блок із вкладками на сторінці результатів; у списку «Результати тестувань» .tb-hw-stats — рядок із трьох чисел (flex) */
div.tb-hw-stats { display: block !important; }
.tb-hw-stats .tab-content { width: 100%; }
/* Лендінг онлайн-тестів (/test/about) */
.tb-tl-page { max-width: 1180px; }
.tb-tl-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 24px; padding: clamp(16px, 4vw, 40px); border-radius: 24px; background: linear-gradient(135deg, #fff8e1, #fff 60%); border: 2px solid var(--line); box-shadow: 0 6px 0 var(--line); margin-bottom: 24px; }
.tb-tl-hero h1 { margin: 0 0 14px; font: 900 clamp(30px, 5vw, 52px)/1.1 var(--f-display); color: var(--ink); }
.tb-tl-sub { font-size: 17px; line-height: 1.5; color: var(--ink-2); margin-bottom: 20px; }
.tb-tl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: var(--ink-3); font-weight: 600; }
.tb-tl-link { color: var(--ink) !important; font-weight: 800; text-decoration: underline !important; text-decoration-color: var(--go) !important; text-underline-offset: 4px; }
.tb-tl-hero-art #text-top { max-width: 100%; }
.tb-tl-section { margin-bottom: 28px; }
.tb-tl-h3 { margin: 0 0 16px; font: 800 clamp(22px, 3vw, 28px)/1.2 var(--f-display); color: var(--ink); }
.tb-tl-steps-row { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px; align-items: center; }
.tb-tl-steps-art img { width: 100%; }
.tb-tl-steps { display: grid; gap: 12px; }
.tb-tl-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; align-items: start; padding: 14px 16px; border-radius: 18px; background: #fff; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); }
.tb-tl-step-n img { width: 56px; }
.tb-tl-step-head { font: 800 18px/1.25 var(--f-display); color: var(--ink); margin-bottom: 4px; }
.tb-tl-step-text { font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.tb-tl-cta { justify-self: start; }
.tb-tl-videos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.tb-tl-video { display: block; border-radius: 14px; overflow: hidden; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); transition: transform .12s; }
.tb-tl-video:hover { transform: translateY(-2px); }
.tb-tl-video img { display: block; aspect-ratio: 16 / 9; object-fit: cover; }
@media (max-width: 991px) { .tb-tl-hero { grid-template-columns: 1fr; } .tb-tl-hero-art { display: none; } .tb-tl-steps-row { grid-template-columns: 1fr; } .tb-tl-hero-text h1 br, .tb-tl-sub br { display: none; } }
@media (max-width: 640px) { .tb-tl-videos { grid-template-columns: 1fr 1fr; } .tb-tl-actions .tb-btn { width: 100%; } }
.tb-tl .tb-tl-hero h1 { font-weight: 900 !important; font-family: var(--f-display) !important; color: var(--ink) !important; }
/* телефон: інструменти тесту (клонувати / PDF / поширити / поскаржитися) — рівна сітка 2×2 замість рваного ряду 2 + 1 + посилання */
@media (max-width: 640px) {
    .tb-single-tools { display: grid; grid-template-columns: 1fr 1fr; }
    .tb-single-tools > * { width: 100%; min-width: 0; justify-content: center; text-align: center; }
    .tb-single-tools > :last-child:nth-child(odd) { grid-column: 1 / -1; }
    .tb-single-tools > form { display: grid; margin: 0; }
    .tb-single-tools > form .tb-btn { width: 100%; justify-content: center; }
}
/* телефон: головна дія картки тесту («Відкрити») — на всю ширину, як дії під нею (була вузька кнопка зліва) */
@media (max-width: 640px) { .tb-tcard-actions:has(> .tb-btn-go) { flex: 1 1 100%; width: 100%; } .tb-tcard-actions > .tb-btn-go { flex: 1 1 100%; width: 100%; justify-content: center; } }