/* English theme for the Jeddojehad English / Viewpoint archive section.
   Loaded INSTEAD of bbc-urdu.css on English pages, because that file hardcodes
   `html { direction: rtl }` and unscoped row-reverse rules that no override can beat. */

:root {
  /* straight off the recovered Viewpoint masthead */
  --en-accent: #e90101;       /* Viewpoint red  */
  --vp-green: #289b00;        /* Viewpoint green */
  --en-accent-dark: #b30000;  /* nav fill - pure brand red fails contrast on white text */
  --en-text: #1a1a1a;
  --en-text-secondary: #3d3d3d;
  --en-meta: #6b7280;
  --en-border: #e2e5e9;
  --en-bg: #ffffff;
  --en-bg-alt: #f6f7f9;
  --en-serif: Georgia, 'Times New Roman', Times, serif;
  --en-sans: 'Inter', -apple-system, 'Segoe UI', Arial, Helvetica, sans-serif;
}

/* ===== GLOBAL: undo every RTL assumption inherited from the Urdu build ===== */
html { direction: ltr; }
body {
  direction: ltr;
  text-align: left;
  font-family: var(--en-serif);
  background: var(--en-bg);
  color: var(--en-text);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
body, p, span, div, li, a, h1, h2, h3, h4, h5, h6, label, td, th {
  font-family: var(--en-serif);
}
input, textarea, select, button, .kt-nav, .kt-nav *, .card-meta, .article-list-meta,
.section-badge, .article-date, .article-read-time, .footer-brand, footer, footer * {
  font-family: var(--en-sans);
}
code, pre, .monospace { font-family: ui-monospace, Menlo, Consolas, monospace; }
.fas, .fab, .far, .fa, i[class*="fa-"] {
  font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands' !important;
}
input, textarea, select { direction: ltr; text-align: left; }
.row, .breadcrumb, .kt-search-form { direction: ltr; }
.kt-search-form input { text-align: left; }
.text-start { text-align: left !important; }
.text-end { text-align: right !important; }

.container { max-width: 1180px; }

a { color: var(--en-text); text-decoration: none; }
a:hover { color: var(--en-accent); text-decoration: underline; }

/* ===== HEADER / NAV ===== */
.kt-header-inner { flex-direction: row; }
.kt-nav { background: var(--en-accent); }
.kt-nav-menu, .kt-nav-right { flex-direction: row; }
.kt-nav-menu a { letter-spacing: .02em; font-size: .82rem; text-transform: uppercase; }
.kt-nav-menu a.active, .kt-nav-menu a:hover { text-decoration: none; opacity: .85; }
.kt-en-badge {
  display: inline-block; margin-left: 10px; padding: 2px 8px;
  background: var(--en-accent); color: #fff; font-family: var(--en-sans);
  font-size: .62rem; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; border-radius: 2px; vertical-align: middle;
}

/* ===== SECTION HEADINGS ===== */
.home-section-title {
  font-family: var(--en-serif);
  font-size: 1.35rem; font-weight: 700; color: var(--en-text);
  border-bottom: none; border-top: 4px solid var(--en-accent);
  padding-top: 10px; margin-bottom: 16px; letter-spacing: 0;
}
.home-section-more { color: var(--en-accent); border: none; font-weight: 600; font-size: .88rem; padding: 0; }

/* ===== LISTS / CARDS ===== */
.news-grid { grid-template-columns: 1.4fr 1fr; direction: ltr; }
.news-side { flex-direction: row; }
.news-side div { text-align: left; }
.news-main .card, .news-side .card { border: none; border-radius: 0; box-shadow: none; }
.news-main .card-title { font-size: 1.5rem; font-weight: 700; line-height: 1.35; }
.news-side .card-title { font-size: 1rem; font-weight: 700; line-height: 1.4; }
.card-meta { font-size: .78rem; color: var(--en-meta); }
.section-badge {
  color: var(--en-accent) !important; background: transparent !important;
  font-weight: 700; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
}

.article-list-item { flex-direction: row; gap: 16px; border-bottom: 1px solid var(--en-border); padding: 16px 0; }
.article-list-item div, .article-list-item h3, .article-list-item p { text-align: left; }
.article-list-img { order: -1; }
.article-list-title { font-weight: 700; line-height: 1.35; font-size: 1.12rem; }
.article-list-title a:hover { color: var(--en-accent); }
.article-list-meta { color: var(--en-meta); font-size: .78rem; }
.article-list-summary { color: var(--en-text-secondary); line-height: 1.6; }

/* ===== ARTICLE PAGE ===== */
.article-headline {
  font-family: var(--en-serif);
  font-size: clamp(1.7rem, 4vw, 2.6rem);
  font-weight: 700; line-height: 1.22; letter-spacing: -.01em;
  color: var(--en-text); direction: ltr; text-align: left;
}
.article-subheadline { color: var(--en-text-secondary); line-height: 1.5; text-align: left; }
.article-content {
  font-size: 1.08rem; line-height: 1.78; color: var(--en-text);
  direction: ltr; text-align: left;
}
.article-content p { margin-bottom: 1.15em; }
.article-content img, .article-content .vp-img {
  max-width: 100%; height: auto; margin: 20px 0; border-radius: 3px;
}
.article-content blockquote {
  border-left: 4px solid var(--en-accent); border-right: none;
  padding: .6rem 0 .6rem 1rem; margin-left: 0;
  background: var(--en-bg-alt); color: var(--en-text-secondary); font-style: italic;
}
.article-author-bar, .article-meta, .article-list-meta, .article-author-info {
  flex-direction: row; justify-content: flex-start;
}
.article-author-bar > * + * { margin-left: 12px; }
.article-date, .article-read-time { color: var(--en-meta); }
.article-share a:hover { background: var(--en-accent); color: #fff; }

/* Archive provenance line at the foot of a recovered article */
.vp-source {
  margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--en-border);
  font-family: var(--en-sans); font-size: .82rem; color: var(--en-meta);
}

/* ===== FOOTER ===== */
footer, .newsletter-form { direction: ltr; }
.newsletter-form { flex-direction: row; }
.footer-brand { font-family: var(--en-serif); }

/* ===== DARK MODE ===== */
body.dark-mode { background: #14171a; color: #e8eaed; }
body.dark-mode .article-content, body.dark-mode .article-headline { color: #e8eaed; }
body.dark-mode .article-content blockquote { background: #1e2226; color: #c3c7cc; }
body.dark-mode .article-list-item { border-bottom-color: #2a2f35; }


/* ===== VIEWPOINT BRANDING ===== */
.kt-header { background: #fff !important; border-bottom: 3px solid var(--vp-green); }
.kt-logo-vp { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.vp-masthead { max-height: 52px; width: auto; display: block; }
.kt-en-badge { background: var(--vp-green); }

.kt-nav { background: var(--en-accent-dark); border-bottom: 3px solid var(--vp-green); }
.kt-nav-menu a.active { box-shadow: inset 0 -3px 0 var(--vp-green); opacity: 1; }

.home-section-title { border-top-color: var(--en-accent); }
.article-share a:hover { background: var(--en-accent); }
.kt-search-bar button, .newsletter-form button { background: var(--en-accent-dark); border-color: var(--en-accent-dark); }
.kt-search-bar button:hover, .newsletter-form button:hover { background: var(--vp-green); border-color: var(--vp-green); }
footer { border-top: 3px solid var(--en-accent); }

body.dark-mode .kt-header { background: #14171a !important; }
body.dark-mode .vp-masthead { filter: brightness(1.12); }
