/* =====================================================================
   Global Drishti — Single Post "Supercharged" UI (Batch-1)
   Scoped entirely under .gd-single so the main sarkari-style.css and all
   other templates remain 100% untouched (zero regression risk).
   Brand tokens reused: --primary-blue #0A2463, --primary-red #D90429,
   --primary-green #2ecc71.
   ===================================================================== */

/* Backup for the color-scheme meta tag in header.php — belt and suspenders
   against Android Chrome's auto-dark-theme feature re-coloring table cells
   inconsistently (dark background, unchanged text color) when the phone is
   in system dark mode. This site's own dark mode is a manual .gd-dark
   toggle, not tied to prefers-color-scheme, so we always want light here. */
html { color-scheme: light; }

.gd-single {
    --gd-blue: #0A2463;
    --gd-red: #D90429;
    --gd-green: #1a9d54;
    --gd-link: #1551d4;
    --gd-border: #111;
}

/* ---- Title + meta ---- */
.gd-single .gd-post-head { margin-bottom: 12px; }
.gd-single .post-title { line-height: 1.3; }
.gd-single .gd-meta-row { display: flex; flex-wrap: wrap; gap: 14px; font-size: 0.85rem; color: #555; margin-top: 6px; }
.gd-single .gd-meta-row i { color: var(--gd-blue); }

/* ---- Status badge ---- */
.gd-single .gd-badge { display: inline-block; font-size: 0.72rem; font-weight: 700; padding: 3px 9px; border-radius: 20px; vertical-align: middle; margin-left: 6px; white-space: nowrap; }
.gd-single .gd-badge-active { background: #e6f7ee; color: #1a7a44; }
.gd-single .gd-badge-soon   { background: #fff5e0; color: #b8860b; }
.gd-single .gd-badge-exp    { background: #fdebec; color: #c0392b; }

/* ---- Countdown ---- */
.gd-single .gd-countdown { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: linear-gradient(90deg, var(--gd-red), #a4031f); color: #fff; padding: 10px 14px; border-radius: var(--radius, 8px); font-weight: 600; margin: 14px 0; }
.gd-single .gd-cd-timer { font-variant-numeric: tabular-nums; letter-spacing: 0.3px; background: rgba(0,0,0,0.18); padding: 3px 10px; border-radius: 6px; }

/* ---- Generic CTA buttons ---- */
.gd-single .gd-btn { display: inline-block; padding: 11px 16px; border-radius: 7px; font-weight: 700; font-size: 0.92rem; text-decoration: none; color: #fff !important; text-align: center; border: none; cursor: pointer; transition: transform .08s ease, filter .15s ease; }
.gd-single .gd-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.gd-single .gd-btn:active { transform: translateY(0); }
.gd-single .gd-btn-green { background: var(--gd-green); }
.gd-single .gd-btn-red   { background: var(--gd-red); }
.gd-single .gd-btn-blue  { background: var(--gd-blue); }
.gd-single .gd-btn-dark  { background: #334155; }

/* ---- Quick links box (top) ---- */
.gd-single .gd-quicklinks { border: 2px solid var(--gd-border); border-radius: var(--radius, 8px); margin: 16px 0; overflow: hidden; }
.gd-single .gd-ql-title { background: var(--gd-blue); color: #fff; font-weight: 700; padding: 9px 14px; }
.gd-single .gd-ql-btns { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; padding: 14px; }

/* ---- Short info box ---- */
.gd-single .gd-shortinfo { border: 2px solid var(--gd-border); border-radius: var(--radius, 8px); margin: 16px 0; overflow: hidden; }
.gd-single .gd-si-title { background: #f1f5fb; color: var(--gd-blue); font-weight: 700; padding: 9px 14px; border-bottom: 2px solid var(--gd-border); }
.gd-single .gd-si-body { padding: 12px 14px; }
.gd-single .gd-si-body p { margin: 4px 0; }

/* =====================================================================
   IN-CONTENT TABLES — SarkariResult style 2.0
   Black borders everywhere, blue underlined links (clickable signal),
   red on hover, horizontal scroll on mobile. Targets existing content
   tables without altering their HTML.
   ===================================================================== */
/* Wrapper handles the mobile horizontal scroll. The <table> itself keeps
   display:table (the default) so the browser's normal cross-row column
   layout algorithm runs intact — putting display:block directly on a
   <table> disables that algorithm and can misalign columns row-to-row
   (seen live: first data row's column boundaries didn't match the rest). */
.gd-single .gd-table-scroll {
    overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 18px 0;
    border: 1px solid #c9d3e2; border-radius: 12px;
    box-shadow: 0 1px 4px rgba(16, 24, 40, 0.07);
}
.gd-single .post-body table {
    width: 100%; border-collapse: collapse; margin: 0;
    border: none; font-size: 1rem;
}
.gd-single .post-body table th,
.gd-single .post-body table td {
    border: 1px solid #e2e8f2; padding: 10px 14px; color: #1f2937; vertical-align: top;
}
.gd-single .post-body table th {
    background: var(--gd-blue); color: #fff; font-weight: 700; text-align: left;
    font-size: 0.9rem; letter-spacing: 0.02em; border-color: #33549b;
}
.gd-single .post-body table td:first-child { font-weight: 600; }
.gd-single .post-body table tr:nth-child(even) td { background: #f7f9fc; }
.gd-single .post-body table tbody tr:hover td { background: #eef4fe; }
/* Touch target: table links (Download Result/Cutoff/PDF etc.) get an
   invisible padded hit area >=44px tall — negative margin keeps the
   visible link box unchanged so table alignment/spacing doesn't shift. */
.gd-single .post-body table td a,
.gd-single .post-body table th a {
    display: inline-block; padding: 12px 8px; margin: -12px -8px;
}
/* Swipe affordance hint — hidden by default (JS unhides only when a table
   actually overflows horizontally); disappears after first scroll. */
.gd-single .gd-scroll-hint-label {
    text-align: center; font-size: 0.75rem; color: #6b7280;
    padding: 5px 0 0; margin: 0 0 10px;
}
.gd-single .gd-scroll-hint-label[hidden] { display: none; }
/* Links inside content + tables: blue + underline; red on hover */
.gd-single .post-body a { color: var(--gd-link); text-decoration: underline; font-weight: 600; }
.gd-single .post-body a:hover { color: var(--gd-red); }

/* ---- Salary reveal ---- */
.gd-single .gd-salary { margin: 18px 0; }
.gd-single .gd-salary-btn { width: 100%; background: linear-gradient(90deg, #0d9488, #0f766e); color: #fff; border: none; padding: 13px; border-radius: 8px; font-weight: 700; cursor: pointer; }
.gd-single .gd-salary-body { border: 2px solid var(--gd-border); border-top: none; padding: 12px 14px; border-radius: 0 0 8px 8px; }
.gd-single .gd-salary-range { font-weight: 700; color: var(--gd-green); }
.gd-single .gd-salary-note { margin: 6px 0; }

/* ---- Eligibility checker ---- */
.gd-single .gd-eligi { border: 2px solid var(--gd-blue); border-radius: var(--radius, 8px); padding: 14px; margin: 18px 0; background: #f8faff; }
.gd-single .gd-eligi-title { font-weight: 700; color: var(--gd-blue); margin-bottom: 10px; }
.gd-single .gd-eligi-row { display: flex; flex-wrap: wrap; gap: 8px; }
.gd-single .gd-eligi-age, .gd-single .gd-eligi-cat { flex: 1 1 110px; padding: 10px; border: 1.5px solid #ccc; border-radius: 6px; font-size: 0.95rem; }
.gd-single .gd-eligi-result { margin-top: 10px; font-weight: 700; }
.gd-single .gd-eligi-result.ok  { color: #1a7a44; }
.gd-single .gd-eligi-result.no  { color: #c0392b; }
.gd-single .gd-eligi small, .gd-single .gd-salary-body small { color: #777; display: block; margin-top: 6px; font-size: 0.78rem; }

/* ---- Important links hub ---- */
.gd-single .gd-implinks { border: 2px solid var(--gd-border); border-radius: var(--radius, 8px); margin: 22px 0; overflow: hidden; }
.gd-single .gd-implinks-title { background: var(--gd-red); color: #fff; margin: 0; padding: 11px 14px; font-size: 1.15rem; }
.gd-single .gd-implinks-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 11px; padding: 16px; }
.gd-single .gd-cal-btn { display: block; width: calc(100% - 32px); margin: 0 16px 16px; background: #fff; border: 1.5px dashed var(--gd-blue); color: var(--gd-blue); padding: 9px; border-radius: 7px; font-weight: 600; cursor: pointer; }


/* ---- Copy buttons (injected by JS) ---- */
.gd-single .gd-copy { background: none; border: none; cursor: pointer; color: var(--gd-blue); font-size: 0.85rem; padding: 0 4px; }
.gd-single .gd-copy:hover { color: var(--gd-red); }

/* ---- Sticky mobile action bar (glassmorphism) ---- */
.gd-sticky-bar { display: none; }
@media (max-width: 860px) {
    .gd-sticky-bar {
        display: flex; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
        padding: 9px 12px; background: rgba(255,255,255,0.72); backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px); border-top: 1px solid rgba(0,0,0,0.1);
        box-shadow: 0 -3px 14px rgba(0,0,0,0.1);
    }
    .gd-sticky-bar .gd-sb-apply { flex: 1; text-align: center; background: var(--primary-green, #1a9d54); color: #fff; text-decoration: none; padding: 12px; border-radius: 8px; font-weight: 700; }
    .gd-sticky-bar .gd-sb-save, .gd-sticky-bar .gd-sb-dark { background: #fff; border: 1px solid #ccc; border-radius: 8px; padding: 10px 14px; font-size: 1rem; cursor: pointer; }
    /* keep content clear of fixed bar */
    .gd-single { padding-bottom: 70px; }
}

/* ---- Mobile TOC drawer (floating button + sheet, built by JS) ----
   Placed bottom-LEFT (not right) so it never collides with the sitewide
   gd-tools floating "Tools" button, which lives on the right (see the
   body.single .gdt-fab override below). */
.gd-toc-fab { display: none; }
@media (max-width: 860px) {
    .gd-toc-fab { display: flex; align-items: center; justify-content: center; position: fixed; left: 14px; bottom: 76px; z-index: 9989; width: 46px; height: 46px; border-radius: 50%; background: var(--gd-blue); color: #fff; border: none; font-size: 1.2rem; box-shadow: var(--shadow-md, 0 5px 15px rgba(0,0,0,.2)); cursor: pointer; }
}

/* ---- Coexist with the sitewide gd-tools floating button (.gdt-fab) ----
   That button is a separate, sitewide plugin feature (bottom:12px on every
   page). On single posts our own full-width sticky action bar also sits at
   bottom:0, so the two collide/overlap. Scoped to body.single only — every
   other page (home, category, etc.) keeps the tools button's original
   position untouched. */
@media (max-width: 860px) {
    body.single .gdt-fab { bottom: 78px; }
}
.gd-toc-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9995; background: #fff; border-radius: 16px 16px 0 0; box-shadow: 0 -8px 30px rgba(0,0,0,0.25); transform: translateY(100%); transition: transform .28s ease; max-height: 70vh; overflow-y: auto; padding: 8px 0 20px; }
.gd-toc-sheet.open { transform: translateY(0); }
.gd-toc-sheet h4 { margin: 10px 16px; padding-bottom: 8px; border-bottom: 2px solid var(--gd-border); }
.gd-toc-sheet a { display: block; padding: 11px 16px; color: var(--gd-link); text-decoration: none; border-bottom: 1px solid #eee; }
.gd-toc-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 9994; opacity: 0; pointer-events: none; transition: opacity .28s; }
.gd-toc-backdrop.show { opacity: 1; pointer-events: auto; }

/* =====================================================================
   DARK MODE — "Night Study Mode". Scoped to .gd-single wrapper only, so
   header/footer/other pages are never affected. Toggled via body class.
   ===================================================================== */
body.gd-dark .gd-single { background: #14171c; color: #e3e6ea; }
body.gd-dark .gd-single .post-main { background: #1a1d23; box-shadow: none; }
body.gd-dark .gd-single .gd-meta-row { color: #aab1bb; }
body.gd-dark .gd-single .breadcrumb,
body.gd-dark .gd-single .breadcrumb span { color: #aab1bb; }
body.gd-dark .gd-single .post-title,
body.gd-dark .gd-single .gd-si-body,
body.gd-dark .gd-single .post-body { color: #e3e6ea; }
body.gd-dark .gd-single .post-body table th { background: #1f2a44; }
body.gd-dark .gd-single .post-body table td { background: #1a1d23; color: #dfe3e8; border-color: #3a3f47; }
body.gd-dark .gd-single .post-body table tr:nth-child(even) td { background: #20242b; }
body.gd-dark .gd-single .post-body table { border-color: #3a3f47; }
body.gd-dark .gd-single .gd-table-scroll { border-color: #3a3f47; box-shadow: none; }
body.gd-dark .gd-single .post-body table tbody tr:hover td { background: #232936; }
body.gd-dark .gd-single .gd-scroll-hint-label { color: #9aa3b0; }
body.gd-dark .gd-single .post-body a { color: #6ea8ff; }
body.gd-dark .gd-single .gd-shortinfo,
body.gd-dark .gd-single .gd-eligi { background: #1a1d23; }
body.gd-dark .gd-single .gd-si-title { background: #1f2a44; color: #cfe0ff; }
body.gd-dark .sarkari-box .box-content { background: #1a1d23; }

/* =====================================================================
   BATCH-1.5 ADDITIONS — ad slots, FAQ accordion, a11y, freshness
   ===================================================================== */

/* ---- Policy-safe ad slot (CLS-safe; only renders when configured) ---- */
.gd-single .gd-ad-slot { min-height: 100px; margin: 22px 0; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.gd-single .gd-ad-label { font-size: 0.62rem; letter-spacing: 1px; text-transform: uppercase; color: #aaa; margin-bottom: 4px; }
.gd-single .gd-ad-slot ins { width: 100%; }
@media (min-width: 768px) { .gd-single .gd-ad-slot { min-height: 280px; } }

/* ---- FAQ accordion (native <details> inside .schema-faq) ---- */
.gd-single .post-body .schema-faq details,
.gd-single .post-body details { border: 1.5px solid var(--gd-border); border-radius: 7px; margin: 10px 0; overflow: hidden; background: #fff; }
.gd-single .post-body details summary { cursor: pointer; padding: 12px 14px; font-weight: 700; color: var(--gd-blue); list-style: none; position: relative; padding-right: 40px; }
.gd-single .post-body details summary::-webkit-details-marker { display: none; }
.gd-single .post-body details summary::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 1.3rem; color: var(--gd-red); transition: transform .2s; }
.gd-single .post-body details[open] summary::after { content: "−"; }
.gd-single .post-body details[open] summary { border-bottom: 1.5px solid var(--gd-border); }
.gd-single .post-body details > *:not(summary) { padding: 6px 14px 12px; margin: 0; }

/* ---- Last-updated freshness ---- */
.gd-single time { font-weight: 600; }

/* ---- a11y: screen-reader-only helper ---- */
.gd-single .gd-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.gd-single .gd-btn:focus-visible, .gd-single button:focus-visible, .gd-single a:focus-visible { outline: 3px solid #1551d4; outline-offset: 2px; }

/* dark mode for new elements */
body.gd-dark .gd-single .post-body details { background: #1a1d23; border-color: #3a3f47; }
body.gd-dark .gd-single .post-body details summary { color: #cfe0ff; }

/* ---- Reduce motion respect ---- */
@media (prefers-reduced-motion: reduce) {
    .gd-single .gd-btn, .gd-toc-sheet, .gd-toc-backdrop { transition: none; }
}

/* Type-specific status banner CSS moved OUT of this shared file (01.07.2026)
   — each of admit_card/result/cutoff now has its own fully separate CSS
   file (css/gd-type-admit_card.css, gd-type-result.css, gd-type-cutoff.css),
   per explicit instruction: every post type gets its own CSS, no sharing,
   even at the cost of some duplication. Do not re-add banner rules here. */