/* ================================================================
   icseboard.org — Custom Design System
   ================================================================
   Matches ncertbooks.net design language:
   - Inter font (loaded via <link> in header.php, NOT @import)
   - 3-column layout (260px sidebar | content | 320px sidebar)
   - Bootstrap 5.3.3 blue (#0d6efd) as primary
   - Zero Bootstrap-duplicate rules — only overrides & additions
   - Target: 0-3 !important declarations (print/footer only)
   ================================================================ */

/* ── CSS Variables ─────────────────────────────────────────────── */
:root {
  --icse-primary: #0d6efd;
  --icse-primary-hover: #0a58ca;
  --icse-primary-dark: #005075;
  --icse-secondary: #6c757d;
  --icse-success: #198754;
  --icse-warning: #ffc107;
  --icse-danger: #dc3545;
  --icse-light: #f8f9fa;
  --icse-dark: #212529;
  --icse-white: #ffffff;
  --icse-border: #dee2e6;
  --icse-border-light: #e9ecef;
  --icse-text: #212529;
  --icse-text-muted: #6c757d;
  --icse-shadow-sm: 0 .125rem .25rem rgba(0,0,0,.075);
  --icse-shadow: 0 .25rem .5rem rgba(0,0,0,.1);
  --icse-radius: .375rem;
  --icse-font: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --icse-sidebar-left: 260px;
  --icse-sidebar-right: 320px;
  --icse-dark-navy: #0a2647;
}

/* ── Global Overrides (non-duplicate) ────────────────────────── */
body {
  font-family: var(--icse-font);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--icse-text);
  background-color: var(--icse-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { transition: color .15s ease-in-out; }

/* ── Typography (ncertbooks.net: weight 500, clean hierarchy) ── */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--icse-font);
  font-weight: 500;
  line-height: 1.2;
  color: var(--icse-dark);
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}

h1 { font-size: 2.25rem; font-weight: 700; }
h2 { font-size: 1.75rem; border-bottom: 2px solid var(--icse-primary); padding-bottom: 0.5rem; margin-top: 2rem; }
h3 { font-size: 1.375rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: 1rem; font-weight: 600; }

p { margin-bottom: 1rem; line-height: 1.7; }

/* ── Navbar (only non-Bootstrap additions) ────────────────────── */
.navbar-brand,
.site-title a {
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--icse-primary);
  text-decoration: none;
}

.navbar-nav .nav-link,
.main-navigation a {
  font-size: 0.9375rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
  transition: color .15s, background-color .15s;
  border-radius: var(--icse-radius);
}

.navbar-nav .nav-link:hover,
.main-navigation a:hover {
  color: var(--icse-primary);
  background-color: rgba(13, 110, 253, 0.05);
}

.navbar-nav .nav-link.active,
.main-navigation .current-menu-item a {
  color: var(--icse-primary);
  font-weight: 600;
}

/* ── Breadcrumbs ───────────────────────────────────────────────── */
.breadcrumb,
.rank-math-breadcrumb,
nav.breadcrumb {
  padding: 0.75rem 0;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--icse-border);
  font-size: 0.875rem;
}

.breadcrumb a { color: var(--icse-primary); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }

.breadcrumb .separator,
.breadcrumb-item + .breadcrumb-item::before {
  color: var(--icse-secondary);
  content: "›";
  padding: 0 0.5rem;
  font-size: 1.2em;
  line-height: 1;
}

/* ── 3-Column Layout (Desktop) ─────────────────────────────────── */
#content.site-content {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0.5rem 0.75rem;
}

.layout-grid {
  display: flex;
  gap: 1rem;
}

@media (min-width: 992px) {
  .layout-grid {
    display: grid;
    grid-template-columns: var(--icse-sidebar-left) minmax(0, 1fr) var(--icse-sidebar-right);
    column-gap: 1rem;
    align-items: start;
  }
}

@media (max-width: 991.98px) {
  .layout-grid { display: block; }
}

#primary.content-area { min-width: 0; }

.page-template-page-fullwidth .entry-content {
  max-width: 900px;
  margin: 0 auto;
}

/* ── Left Sidebar ──────────────────────────────────────────────── */
.left-sidebar,
.sidebar-left,
#secondary {
  position: sticky;
  top: 70px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
}

.left-sidebar .menu-item a,
.widget-area a {
  display: block;
  padding: 0.65rem 1rem;
  font-size: 0.9375rem;
  color: var(--icse-text);
  border-bottom: 1px solid var(--icse-border-light);
  border-left: 2px solid transparent;
  transition: background-color .15s, border-color .15s;
}

.left-sidebar .menu-item a:hover,
.widget-area a:hover {
  background-color: rgba(13, 110, 253, 0.07);
  color: var(--icse-primary);
  text-decoration: none;
  border-left-color: var(--icse-primary);
}

.left-sidebar .current-menu-item > a {
  color: var(--icse-primary);
  font-weight: 600;
  border-left-color: var(--icse-primary);
  background-color: rgba(13, 110, 253, 0.04);
}

@media (max-width: 991.98px) {
  .left-sidebar,
  .sidebar-left,
  #secondary,
  .right-sidebar,
  .sidebar-right { display: none; }
}

/* ── Content Area ──────────────────────────────────────────────── */
.entry-content,
.page-content,
article .content {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--icse-text);
}

.entry-content p { margin-bottom: 1rem; }

.entry-content ul,
.entry-content ol {
  margin-bottom: 1.25rem;
  padding-left: 1.5rem;
}

.entry-content li {
  margin-bottom: 0.35rem;
  line-height: 1.6;
}

/* ── Cards (only hover addition — base is Bootstrap) ──────────── */
.card:hover { box-shadow: var(--icse-shadow); }

/* ── Tables (scoped to content area — won't affect admin) ─────── */
.entry-content table {
  width: 100%;
  margin-bottom: 1.5rem;
  border-collapse: collapse;
  font-size: 0.9375rem;
  border: 1px solid var(--icse-border);
}

.entry-content table caption {
  caption-side: top;
  padding: 0.75rem 1rem;
  font-weight: 600;
  font-size: 1rem;
  color: var(--icse-dark);
  background-color: var(--icse-light);
  border: 1px solid var(--icse-border);
  border-bottom: none;
  border-radius: var(--icse-radius) var(--icse-radius) 0 0;
}

.entry-content table thead {
  background-color: #cfe2ff;
}

.entry-content table th {
  font-weight: 600;
  padding: 0.75rem;
  border: 1px solid var(--icse-border);
  text-align: left;
  font-size: 0.875rem;
  color: var(--icse-dark);
}

.entry-content table td {
  padding: 0.75rem;
  border: 1px solid var(--icse-border);
  vertical-align: middle;
}

.entry-content table tbody tr:nth-child(odd) {
  background-color: rgba(0, 0, 0, .02);
}

.entry-content table tbody tr:hover {
  background-color: rgba(13, 110, 253, .04);
}

@media (max-width: 767.98px) {
  .entry-content table { font-size: 0.8125rem; }
  .entry-content table th,
  .entry-content table td { padding: 0.5rem; }
}

/* ── PDF Download Button (custom — not in Bootstrap) ──────────── */
.pdf-download-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%);
  color: var(--icse-white);
  border-radius: var(--icse-radius);
  font-weight: 500;
  font-size: 0.9375rem;
  text-decoration: none;
  box-shadow: var(--icse-shadow-sm);
  transition: all .2s;
}

.pdf-download-btn:hover {
  background: linear-gradient(135deg, #0a58ca 0%, #084298 100%);
  box-shadow: 0 .25rem .5rem rgba(13, 110, 253, .25);
  transform: translateY(-1px);
  color: var(--icse-white);
  text-decoration: none;
}

/* PDF Coming Soon Badge */
.pdf-coming-soon {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  background: var(--icse-light);
  color: var(--icse-secondary);
  border: 1px solid var(--icse-border);
  border-radius: var(--icse-radius);
  font-size: 0.8125rem;
}

/* ── Table of Contents (Bootstrap Accordion) ──────────────────── */
.wp-block-rank-math-toc-block,
#rank-math-toc {
  margin-bottom: 1.5rem;
}

.wp-block-rank-math-toc-block .accordion-item {
  border: 1px solid var(--icse-border);
  border-radius: var(--icse-radius);
  overflow: hidden;
}

.wp-block-rank-math-toc-block .accordion-button {
  font-weight: 600;
  font-size: 1.0625rem;
  color: var(--icse-dark);
  background-color: var(--icse-light);
  padding: 0.75rem 1.25rem;
}

.wp-block-rank-math-toc-block .accordion-button:not(.collapsed) {
  color: var(--icse-primary);
  background-color: #e8f0fe;
  border-bottom: 1px solid var(--icse-border);
}

.wp-block-rank-math-toc-block .accordion-body {
  padding: 1rem 1.25rem;
}

.wp-block-rank-math-toc-block .accordion-body a {
  display: block;
  padding: 0.35rem 0;
  color: var(--icse-text);
  font-size: 0.9375rem;
  border-bottom: 1px dotted var(--icse-border-light);
}

.wp-block-rank-math-toc-block .accordion-body a:hover {
  color: var(--icse-primary);
  padding-left: 0.5rem;
  transition: padding-left .15s;
}

.wp-block-rank-math-toc-block .accordion-body li.ms-3 a {
  font-size: 0.875rem;
  color: var(--icse-secondary);
}

/* ── FAQ Accordion ─────────────────────────────────────────────── */
.faq-section {
  margin-top: 2.5rem;
  margin-bottom: 2rem;
}

.faq-section .accordion-item {
  border: 1px solid var(--icse-border);
  margin-bottom: 0.5rem;
  border-radius: var(--icse-radius);
  overflow: hidden;
}

.faq-section .accordion-button {
  font-weight: 500;
  font-size: 1rem;
  color: var(--icse-dark);
  background: var(--icse-white);
  padding: 1rem 1.25rem;
}

.faq-section .accordion-button:not(.collapsed) {
  color: var(--icse-primary);
  background-color: #f0f6ff;
}

.faq-section .accordion-body {
  padding: 1rem 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--icse-text);
}

/* ── Featured Image ────────────────────────────────────────────── */
.wp-block-image,
.entry-content figure {
  margin: 1.5rem 0;
  border-radius: var(--icse-radius);
  overflow: hidden;
}

.wp-block-image img {
  border-radius: var(--icse-radius);
  box-shadow: var(--icse-shadow-sm);
}

.wp-block-image figcaption,
figure figcaption {
  font-size: 0.8125rem;
  color: var(--icse-secondary);
  text-align: center;
  padding: 0.5rem;
  font-style: italic;
}

/* ── Footer ────────────────────────────────────────────────────── */
.site-footer,
footer.site-footer {
  background: #1a1a2e;
  color: #c4c4c4;
  padding: 2.5rem 0 1rem;
  margin-top: 3rem;
  font-size: 0.875rem;
}

/* Hide default WP footer widgets (moved from inline style in footer.php) */
.site-footer .widget-area,
.site-footer aside.widget-area,
.site-footer .footer-widgets,
footer aside,
footer .widget-area { display: none; }

.site-footer h6.widget-title {
  color: var(--icse-white);
  font-size: 0.9375rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--icse-primary);
  display: inline-block;
}

.site-footer .footer-column .widget ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.site-footer .footer-column .widget ul li {
  padding: 0.3rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .05);
}

.site-footer a {
  color: #a8a8b8 !important; /* needed: overrides Bootstrap link blue in dark footer */
  text-decoration: none;
  font-size: 0.8125rem;
  transition: color .15s, padding-left .15s;
}

.site-footer a:hover {
  color: var(--icse-primary) !important; /* needed: paired with above */
  padding-left: 0.25rem;
}

.footer-disclaimer-row {
  border-top: 1px solid rgba(255,255,255,.1);
  padding-top: 1.25rem;
  margin-top: 1rem;
}

.footer-disclaimer-row .disclaimer-content {
  font-size: 0.8125rem;
  color: #999;
  line-height: 1.6;
}

.footer-bottom {
  background: rgba(0,0,0,.15);
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 1rem 0;
  margin-top: 1.5rem;
  text-align: center;
  font-size: 0.8125rem;
  color: #888;
}

.footer-bottom a { color: #aaa; }
.footer-bottom a:hover { color: var(--icse-primary); }

/* ── Utility: Info Boxes & Alerts ──────────────────────────────── */
.alert-info,
.info-box {
  background-color: #e8f4fd;
  border: 1px solid #b8daff;
  border-left: 4px solid var(--icse-primary);
  border-radius: var(--icse-radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
  font-size: 0.9375rem;
}

.alert-warning,
.warning-box {
  background-color: #fff8e1;
  border: 1px solid #ffecb5;
  border-left: 4px solid var(--icse-warning);
  border-radius: var(--icse-radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
}

.alert-success,
.success-box {
  background-color: #d1e7dd;
  border: 1px solid #badbcc;
  border-left: 4px solid var(--icse-success);
  border-radius: var(--icse-radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1.25rem;
}

/* ── Page Title / Entry Header ─────────────────────────────────── */
.entry-title,
.page-title {
  font-size: 2rem;
  font-weight: 700;
  color: var(--icse-dark);
  line-height: 1.3;
  margin-bottom: 0.5rem;
}

.entry-meta,
.post-meta {
  font-size: 0.8125rem;
  color: var(--icse-secondary);
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--icse-border-light);
}

/* ── Blockquotes ───────────────────────────────────────────────── */
blockquote,
.wp-block-quote {
  border-left: 4px solid var(--icse-primary);
  padding: 1rem 1.5rem;
  margin: 1.5rem 0;
  background: var(--icse-light);
  border-radius: 0 var(--icse-radius) var(--icse-radius) 0;
  font-style: italic;
  color: var(--icse-text);
}

/* ── Code Blocks (for math LaTeX) ──────────────────────────────── */
code, pre {
  font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
  font-size: 0.875rem;
}

pre {
  background: #f6f8fa;
  border: 1px solid var(--icse-border);
  border-radius: var(--icse-radius);
  padding: 1rem;
  overflow-x: auto;
}

/* ── Search Bar ────────────────────────────────────────────────── */
.search-field,
input[type="search"] {
  font-family: var(--icse-font);
  padding: 0.5rem 1rem;
  border: 1px solid var(--icse-border);
  border-radius: 2rem;
  font-size: 0.9375rem;
  transition: border-color .15s, box-shadow .15s;
}

.search-field:focus,
input[type="search"]:focus {
  border-color: var(--icse-primary);
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .15);
  outline: none;
}

/* ── Pagination ────────────────────────────────────────────────── */
.pagination,
.page-numbers {
  display: flex;
  gap: 0.25rem;
  list-style: none;
  padding: 0;
  margin: 2rem 0;
}

.page-numbers li a,
.page-numbers li span {
  display: block;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--icse-border);
  border-radius: var(--icse-radius);
  color: var(--icse-primary);
  font-size: 0.875rem;
  text-decoration: none;
}

.page-numbers li span.current,
.page-numbers li a:hover {
  background: var(--icse-primary);
  color: var(--icse-white);
  border-color: var(--icse-primary);
}

/* ── Scroll to Top ─────────────────────────────────────────────── */
.scroll-to-top {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 40px;
  height: 40px;
  background: var(--icse-primary);
  color: var(--icse-white);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  box-shadow: var(--icse-shadow);
  cursor: pointer;
  opacity: 0;
  transition: opacity .3s;
  z-index: 100;
}

.scroll-to-top.visible { opacity: 1; }

/* ── Chapter Table Specific (Subject Book Pages) ───────────────── */
[id*="-chapters"] .btn-sm { white-space: nowrap; min-width: 70px; }
[id*="-chapters"] td strong { color: #1a1a2e; font-size: 0.9375rem; }
[id*="-chapters"] td small { display: block; margin-top: 0.25rem; line-height: 1.4; }

/* ── Homepage (merged from site.css) ───────────────────────────── */
.hero-section {
  background: linear-gradient(135deg, var(--icse-dark-navy) 0%, #144272 100%);
  padding: 6rem 0;
  position: relative;
}

.hero-section::after {
  content: "";
  opacity: 0.1;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  background-image: radial-gradient(circle at 2px 2px, white 1px, transparent 0);
  background-size: 30px 30px;
  pointer-events: none;
}

.feature-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.feature-card:hover,
.hover-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, .1);
}

.bg-primary-soft { background-color: rgba(13, 110, 253, 0.1); }
.bg-success-soft { background-color: rgba(25, 135, 84, 0.1); }
.bg-warning-soft { background-color: rgba(255, 193, 7, 0.1); }
.bg-info-soft { background-color: rgba(13, 202, 240, 0.1); }

.text-justify { text-align: justify; }

.search-wrapper {
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(5px);
  padding: 8px;
}

.page-header { background: var(--icse-dark-navy); }

/* ── Inline SVG Icon Sizing (replaces Font Awesome) ────────────── */
.icse-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  fill: currentColor;
}

.icse-icon-2x { width: 2em; height: 2em; }

/* ── Mobile Offcanvas ──────────────────────────────────────────── */
@media (max-width: 991.98px) {
  .offcanvas { width: 85vw; max-width: 400px; }
}

/* ── Accessibility ─────────────────────────────────────────────── */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--icse-primary);
  color: var(--icse-white);
  padding: 0.5rem 1rem;
  z-index: 9999;
  transition: top .15s;
}

.skip-link:focus { top: 0; }

:focus-visible {
  outline: 2px solid var(--icse-primary);
  outline-offset: 2px;
}

::selection {
  background: rgba(13, 110, 253, .15);
  color: var(--icse-dark);
}

/* ── Print Styles ──────────────────────────────────────────────── */
@media print {
  .site-header, .site-footer, .left-sidebar, .right-sidebar,
  .scroll-to-top, .faq-section, .wp-block-rank-math-toc-block,
  .search-field, nav.breadcrumb, .offcanvas { display: none !important; }
  body { font-size: 11pt; color: #000; line-height: 1.5; background: #fff; }
  .layout-grid { display: block !important; }
  .content-area { max-width: 100% !important; }
  a { color: #000; text-decoration: underline; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; }
  a[href^="#"]::after { content: ""; }
  table { page-break-inside: avoid; border: 1px solid #000; }
  h2, h3 { page-break-after: avoid; }
  .pdf-download-btn { background: none !important; color: #000 !important; border: 1px solid #000; box-shadow: none; }
}

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 575.98px) {
  h1 { font-size: 1.625rem; }
  h2 { font-size: 1.375rem; }
  h3 { font-size: 1.125rem; }
  .entry-title { font-size: 1.5rem; }
  .pdf-download-btn { font-size: 0.8125rem; padding: 0.375rem 0.75rem; }
  .faq-section .accordion-button { font-size: 0.9375rem; padding: 0.75rem 1rem; }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  h1 { font-size: 1.875rem; }
  h2 { font-size: 1.5rem; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  #content.site-content { max-width: 960px; }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  #content.site-content { max-width: 1140px; }
  :root {
    --icse-sidebar-left: 220px;
    --icse-sidebar-right: 280px;
  }
}

@media (min-width: 1400px) {
  #content.site-content { max-width: 1320px; }
}

/* ── Reduced Motion ────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── Bootstrap CDN Fallback (safety net) ───────────────────────── */
.accordion-collapse:not(.show):not(.collapsing) { display: none; }