/* TestSeriesPoint — govt-vacancy-detail.css */
:root{
    --navy:#0b1e3d;
    --navy2:#0f2748;
    --navy3:#1a3a6e;
    --orange:#f97316;
    --orange2:#ea6c0a;
    --teal:#0f9b77;
    --card-bg:#ffffff;
    --surface:#f5f7fa;
    --border:#e2e8f2;
    --text:#1e293b;
    --muted:#64748b;
    --radius:14px;
    --radius-sm:8px;
}

*{box-sizing:border-box}

.vd-page{
    font-family:'DM Sans',system-ui,sans-serif;
    background:var(--surface);
    min-height:100vh;
    padding:0 0 3rem;
}

/* ── Hero Banner ── */
.vd-hero{
    background:linear-gradient(135deg,var(--navy) 0%,#1a3560 60%,#0e2d5a 100%);
    padding:2.5rem 0 3.5rem;
    position:relative;
    overflow:hidden;
}
.vd-hero::after{
    content:'';
    position:absolute;
    bottom:-2px;left:0;right:0;height:40px;
    background:var(--surface);
    clip-path:ellipse(55% 100% at 50% 100%);
}
.vd-hero-inner{
    max-width:860px;
    margin:0 auto;
    padding:0 1.25rem;
    position:relative;
    z-index:1;
}
.vd-hero-badge{
    display:inline-flex;
    align-items:center;
    gap:7px;
    background:rgba(249,115,22,.18);
    border:1px solid rgba(249,115,22,.35);
    border-radius:20px;
    padding:4px 13px;
    margin-bottom:1rem;
}
.vd-hero-badge-dot{
    width:7px;height:7px;
    border-radius:50%;
    background:var(--orange);
    animation:vd-pulse 1.6s ease-in-out infinite;
}
@keyframes vd-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.vd-hero-badge-txt{
    font-size:11px;font-weight:700;
    color:var(--orange);letter-spacing:.9px;
    text-transform:uppercase;
}
.vd-hero-title{
    font-family:'Rajdhani',sans-serif;
    font-size:clamp(1.5rem,4vw,2.2rem);
    font-weight:700;
    color:#fff;
    line-height:1.25;
    margin-bottom:.5rem;
}
.vd-hero-sub{
    font-size:13px;
    color:rgba(255,255,255,.5);
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.vd-hero-sub-sep{color:rgba(255,255,255,.2)}

/* ── Main Layout ── */
.vd-body{
    max-width:860px;
    margin:-2rem auto 0;
    padding:0 1.25rem;
    position:relative;
    z-index:2;
}

/* ── Section Card ── */
.vd-card{
    background:var(--card-bg);
    border-radius:var(--radius);
    border:1px solid var(--border);
    overflow:hidden;
    margin-bottom:1.25rem;
    box-shadow:0 2px 16px rgba(11,30,61,.07);
}
.vd-card-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding:13px 18px;
    border-bottom:1px solid var(--border);
    background:#fafbfd;
}
.vd-card-head-icon{
    width:28px;height:28px;
    background:var(--navy);
    border-radius:7px;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
}
.vd-card-head-icon svg{width:14px;height:14px;fill:#fff}
.vd-card-head-title{
    font-size:13px;font-weight:700;
    color:var(--navy);
    letter-spacing:.5px;
    text-transform:uppercase;
}

/* ── Info Table ── */
.vd-table{width:100%;border-collapse:collapse}
.vd-table tr{border-bottom:1px solid var(--border)}
.vd-table tr:last-child{border-bottom:none}
.vd-table tr:hover{background:#f8fafc}
.vd-table td{padding:11px 16px;vertical-align:top;font-size:14px}
.vd-table .vd-label{
    width:38%;
    color:var(--muted);
    font-weight:600;
    font-size:13px;
    letter-spacing:.2px;
    white-space:nowrap;
}
.vd-table .vd-sep{
    width:30px;
    color:var(--border);
    font-weight:700;
    text-align:center;
}
.vd-table .vd-val{
    color:var(--text);
    font-weight:500;
    font-size:13.5px;
    line-height:1.6;
}

/* ── Status Badge ── */
.vd-badge{
    display:inline-block;
    padding:2px 9px;
    border-radius:5px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.4px;
    text-transform:uppercase;
}
.vd-badge-green{background:#dcfce7;color:#166534}
.vd-badge-orange{background:#fff7ed;color:#9a3412}
.vd-badge-blue{background:#eff6ff;color:#1e40af}

/* ── Click Here Button ── */
.vd-btn{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 14px;
    border-radius:var(--radius-sm);
    font-size:12.5px;
    font-weight:600;
    text-decoration:none;
    transition:all .2s;
    border:1.5px solid;
}
.vd-btn-primary{
    background:var(--navy);
    color:#fff;
    border-color:var(--navy);
}
.vd-btn-primary:hover{background:var(--navy3);color:#fff;text-decoration:none}
.vd-btn-outline{
    background:transparent;
    color:var(--navy);
    border-color:var(--navy3);
}
.vd-btn-outline:hover{background:var(--navy);color:#fff;text-decoration:none}
.vd-btn-orange{
    background:var(--orange);
    color:#fff;
    border-color:var(--orange);
}
.vd-btn-orange:hover{background:var(--orange2);color:#fff;text-decoration:none}
.vd-btn svg{width:13px;height:13px;fill:currentColor}

/* ── Download Row ── */
.vd-dl-row{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:4px;
}
.vd-dl-link{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:4px 11px;
    border-radius:6px;
    background:#eff6ff;
    color:#1e40af;
    font-size:12px;
    font-weight:600;
    text-decoration:none;
    border:1px solid #bfdbfe;
    transition:all .18s;
}
.vd-dl-link:hover{background:#1e40af;color:#fff;text-decoration:none}
.vd-dl-link svg{width:11px;height:11px;fill:currentColor}

/* ── Exam Date Block ── */
.vd-exam-block{
    background:#f0fdf4;
    border:1px solid #bbf7d0;
    border-radius:8px;
    padding:8px 12px;
    margin-bottom:6px;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
}
.vd-exam-type{
    font-size:12px;font-weight:700;
    color:#166534;
    background:#dcfce7;
    padding:2px 9px;border-radius:5px;
}
.vd-exam-date{font-size:12.5px;color:#166534;font-weight:500}

/* ── Related Links Grid ── */
.vd-related-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    padding:14px;
}
.vd-related-link{
    display:flex;
    align-items:center;
    gap:8px;
    padding:10px 13px;
    border-radius:9px;
    background:var(--surface);
    border:1px solid var(--border);
    text-decoration:none;
    color:var(--navy);
    font-size:12.5px;
    font-weight:600;
    line-height:1.4;
    transition:all .18s;
}
.vd-related-link:hover{
    background:var(--navy);
    color:#fff;
    border-color:var(--navy);
    text-decoration:none;
}
.vd-related-link-dot{
    width:6px;height:6px;
    border-radius:50%;
    background:var(--orange);
    flex-shrink:0;
    transition:background .18s;
}
.vd-related-link:hover .vd-related-link-dot{background:#fff}

/* ── Action Bar ── */
.vd-actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    padding:14px 16px;
}

/* ── Breadcrumb ── */
.vd-breadcrumb{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
    margin-bottom:1rem;
}
.vd-breadcrumb a,.vd-breadcrumb span{
    font-size:12px;
    color:rgba(255,255,255,.5);
    text-decoration:none;
}
.vd-breadcrumb a:hover{color:rgba(255,255,255,.85)}
.vd-breadcrumb-sep{color:rgba(255,255,255,.25);font-size:11px}
.vd-breadcrumb-current{color:rgba(255,255,255,.85)!important;font-weight:500}

/* ── Footer Note ── */
.vd-footnote{
    text-align:center;
    font-size:11.5px;
    color:var(--muted);
    padding:1rem 0 0;
}
.vd-footnote a{color:var(--orange);font-weight:600;text-decoration:none}
.vd-footnote a:hover{text-decoration:underline}

/* ── Responsive ── */
@media(max-width:640px){
    .vd-hero{padding:1.75rem 0 3rem}
    .vd-table .vd-label{width:42%;font-size:12px}
    .vd-table td{padding:9px 12px}
    .vd-table .vd-val{font-size:12.5px}
    .vd-related-grid{grid-template-columns:1fr}
    .vd-actions{flex-direction:column}
    .vd-btn{width:100%;justify-content:center}
    .vd-body{padding:0 .75rem}
    .vd-card-head{padding:11px 14px}
}
@media(max-width:400px){
    .vd-hero-title{font-size:1.4rem}
    .vd-table .vd-label{display:none}
    .vd-table .vd-sep{display:none}
    .vd-table .vd-val{font-size:12px;padding:9px 10px}
}
