/* =====================================================================
   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.
   ===================================================================== */

.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.
   ===================================================================== */
.gd-single .post-body table {
    width: 100%; border-collapse: collapse; margin: 18px 0;
    border: 2px solid var(--gd-border); font-size: 0.95rem;
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.gd-single .post-body table th,
.gd-single .post-body table td {
    border: 1.5px solid var(--gd-border); padding: 9px 12px; color: #1a1a1a; vertical-align: top;
}
.gd-single .post-body table th { background: var(--gd-blue); color: #fff; font-weight: 700; text-align: left; }
.gd-single .post-body table tr:nth-child(even) td { background: #f6f8fb; }
/* 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; }

/* ---- Read-more wall (mobile only) ---- */
.gd-single .gd-content-wrap { position: relative; }
.gd-single .gd-content-wrap.gd-collapsed { max-height: 60vh; overflow: hidden; }
.gd-single .gd-content-wrap.gd-collapsed::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(transparent, #fff); }
.gd-single .gd-readmore-btn { display: block; width: 100%; margin: 8px 0 4px; background: var(--gd-blue); color: #fff; border: none; padding: 13px; border-radius: 8px; font-weight: 700; cursor: pointer; }
.gd-single .gd-readmore-btn[hidden] { display: none; }

/* ---- 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) ---- */
.gd-toc-fab { display: none; }
@media (max-width: 860px) {
    .gd-toc-fab { display: flex; align-items: center; justify-content: center; position: fixed; right: 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; }
}
.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 .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 .gd-single .gd-content-wrap.gd-collapsed::after { background: linear-gradient(transparent, #14171c); }
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; }
}
