@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700;800;900&display=swap');

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 17px; }
body {
	font-family: 'Noto Sans Bengali', 'Inter', system-ui, -apple-system, sans-serif;
	font-size: 1rem;
	scroll-behavior: smooth;
	overflow-x: hidden;
	width: 100%;
	max-width: 100vw;
}

/* Static card shadow — no hover transform, no color change. */
.gj-card { box-shadow: 0 1px 3px 0 var(--gj-card-shadow); }

/* Entrance animation only (not hover-triggered). */
@keyframes slideUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.gj-anim { opacity: 0; animation: slideUp .35s ease forwards; }

/* Responsive content tables (from the_content filter) */
.gj-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1rem; border-radius: 8px; }
.gj-table-wrap table { margin-bottom: 0; }
.gj-content table { width: 100%; border-collapse: collapse; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--gj-section-alt-bg); }
::-webkit-scrollbar-thumb { background: var(--gj-muted-text); border-radius: 3px; }

.gj-insert-url-btn { font-family: inherit; }

/* ============================================================
   HOVER / FOCUS LOCK
   The active theme's global button:hover / a:hover rules were
   recoloring these controls and making text blend into the
   background. These rules pin every interactive element to its
   exact colors on hover, focus and active — no color change.
   ============================================================ */
.gj-search-btn, .gj-search-btn:hover, .gj-search-btn:focus, .gj-search-btn:active {
	background: var(--gj-btn-primary-hover) !important; color: var(--gj-btn-primary-text) !important; border: none !important; text-decoration: none !important;
}
.gj-reset-btn, .gj-reset-btn:hover, .gj-reset-btn:focus, .gj-reset-btn:active {
	background: var(--gj-section-alt-bg) !important; color: var(--gj-body-text) !important; border: 1px solid var(--gj-input-border) !important; text-decoration: none !important;
}
.gj-loadmore, .gj-loadmore:hover, .gj-loadmore:focus, .gj-loadmore:active {
	background: var(--gj-card-bg) !important; color: var(--gj-btn-outline-text) !important; border: 1px solid var(--gj-btn-outline-border) !important; text-decoration: none !important;
}
.gj-empty-btn, .gj-empty-btn:hover, .gj-empty-btn:focus, .gj-empty-btn:active {
	background: var(--gj-card-bg) !important; color: var(--gj-btn-outline-text) !important; border: 1.5px solid var(--gj-input-border) !important; text-decoration: none !important;
}
.gj-cbtn-outline, .gj-cbtn-outline:hover, .gj-cbtn-outline:focus, .gj-cbtn-outline:active {
	background: var(--gj-card-bg) !important; color: var(--gj-btn-outline-text) !important; border: 1.5px solid var(--gj-btn-outline-border) !important; text-decoration: none !important;
}
.gj-cbtn-primary, .gj-cbtn-primary:hover, .gj-cbtn-primary:focus, .gj-cbtn-primary:active {
	background: var(--gj-btn-primary-hover) !important; color: var(--gj-btn-primary-text) !important; text-decoration: none !important;
}
.gj-card-title-link, .gj-card-title-link:hover, .gj-card-title-link:focus { color: var(--gj-body-text) !important; text-decoration: none !important; }
.gj-toc-link, .gj-toc-link:hover, .gj-toc-link:focus { color: var(--gj-body-text) !important; }
.gj-nav-inner a, .gj-nav-inner a:hover, .gj-nav-inner a:focus { color: var(--gj-nav-text) !important; }

/* Inputs/selects keep readable text on hover & focus */
.gj-input-large, .gj-input-large:hover, .gj-input-large:focus,
.gj-select, .gj-select:hover, .gj-select:focus {
	color: var(--gj-body-text) !important; background-color: var(--gj-card-bg) !important;
}
.gj-select option { color: var(--gj-body-text); background: var(--gj-card-bg); }

#gj-back-top, #gj-back-top:hover, #gj-back-top:focus {
	background: var(--gj-btn-primary-hover) !important; color: var(--gj-btn-primary-text) !important;
}

/* Cursor stays a pointer on all buttons */
.gj-search-btn, .gj-reset-btn, .gj-loadmore, .gj-empty-btn,
.gj-cbtn-outline, .gj-cbtn-primary { cursor: pointer; }

/* ============================================================
   PRESSED / DARKEN FEEDBACK
   A dark inset overlay darkens the button background on press
   (mouse :active or the JS-added .gj-pressed class) while the
   label text stays full-color and crisp. Works on both light
   and dark buttons.
   ============================================================ */
.gj-search-btn, .gj-reset-btn, .gj-loadmore, .gj-empty-btn,
.gj-cbtn-outline, .gj-cbtn-primary { transition: box-shadow .08s ease, transform .08s ease; }

.gj-search-btn:active,  .gj-search-btn.gj-pressed,
.gj-reset-btn:active,   .gj-reset-btn.gj-pressed,
.gj-empty-btn:active,   .gj-empty-btn.gj-pressed,
.gj-loadmore:active,    .gj-loadmore.gj-pressed,
.gj-cbtn-outline:active,
.gj-cbtn-primary:active {
	box-shadow: inset 0 0 0 999px rgba(0,0,0,.18) !important;
	transform: translateY(1px);
}