/* Bootstrap 5.3 look (colors, spacing, form controls, buttons, alerts, dark mode) without loading Bootstrap */
:root{
  --app-body-bg:#f8f9fa;--app-body-color:#212529;--app-secondary-color:#6c757d;--app-card-bg:#fff;
  --app-border-color:#dee2e6;--app-card-border:rgba(0,0,0,.175);--app-input-bg:#fff;
  --app-primary:#0d6efd;--app-primary-hover:#0b5ed7;--app-primary-ring:rgba(13,110,253,.25);--app-link:#0d6efd;
  --app-success:#198754;
  --app-danger-bg:#f8d7da;--app-danger-border:#f1aeb5;--app-danger-text:#58151c;--app-danger:#dc3545;
  --app-font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --app-body-bg:#212529;--app-body-color:#dee2e6;--app-secondary-color:rgba(222,226,230,.75);--app-card-bg:#2b3035;
  --app-border-color:#495057;--app-card-border:rgba(255,255,255,.15);--app-input-bg:#212529;
  --app-primary:#0d6efd;--app-primary-hover:#3d8bfd;--app-primary-ring:rgba(13,110,253,.4);--app-link:#6ea8fe;
  --app-success:#75b798;
  --app-danger-bg:#2c0b0e;--app-danger-border:#842029;--app-danger-text:#ea868f;--app-danger:#ea868f;
}}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--app-body-bg);color:var(--app-body-color);font:400 1rem/1.5 var(--app-font);-webkit-text-size-adjust:100%}
main{max-width:760px;margin:0 auto;padding:1.5rem 1rem 4rem}
a{color:var(--app-link)}
h1{font-size:calc(1.375rem + 1.5vw);font-weight:500;line-height:1.2;margin:.5rem 0 .25rem}
@media (min-width:1200px){h1{font-size:2.5rem}}
h2{font-size:1.5rem;font-weight:500;line-height:1.2;margin:0 0 1rem}
h3{font-size:1.25rem;font-weight:500;line-height:1.2}
.sub{color:var(--app-secondary-color);margin:0 0 1rem;font-size:.875rem}

/* header block and logo */
.site-head{text-align:center;margin-bottom:1.25rem}
.site-head h1{margin:.25rem 0}
.site-head .sub{margin:0}
.logo-img{display:block;margin:0 auto .5rem;max-width:100%;height:auto;max-height:90px}

/* progress bar (nav) */
nav ol{display:flex;gap:.375rem;list-style:none;margin:0 0 1.25rem;padding:0;font-size:.8125rem}
nav li{flex:1;border-top:4px solid var(--app-border-color);padding-top:.375rem;color:var(--app-secondary-color);border-radius:2px}
nav li.done{border-color:var(--app-primary);color:var(--app-body-color)}
nav li.current{border-color:var(--app-primary);color:var(--app-primary);font-weight:700}

/* card */
form,.panel{background:var(--app-card-bg);border:1px solid var(--app-card-border);border-radius:.375rem;padding:1rem;box-shadow:0 .125rem .25rem rgba(0,0,0,.075)}
.card-center{text-align:center}
.card-center .site-head{margin-bottom:.75rem}

/* form controls */
label{display:block;margin-bottom:1rem;font-size:1rem}
input:not([type=radio]):not([type=checkbox]),select,textarea{display:block;width:100%;margin-top:.5rem;padding:.375rem .75rem;font:inherit;font-size:1rem;line-height:1.5;color:var(--app-body-color);background:var(--app-input-bg);border:1px solid var(--app-border-color);border-radius:.375rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}
select{appearance:auto}
input[type=file]{padding:.375rem .75rem}
input:focus,select:focus,textarea:focus{border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem var(--app-primary-ring)}
input[type=radio],input[type=checkbox]{width:1em;height:1em;margin:0;accent-color:var(--app-primary)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media (max-width:600px){.grid{grid-template-columns:1fr}nav li span{display:none}}
.choice{display:inline-flex;align-items:center;gap:.4rem;margin:0 1.25rem .5rem 0}
.q{font-weight:500;margin:0 0 .5rem}
.hint{color:var(--app-secondary-color);font-size:.875em;font-weight:400}
.saved{display:block;color:var(--app-success);font-size:.875em;margin:.5rem 0 1rem}

/* alerts */
.errors{background:var(--app-danger-bg);color:var(--app-danger-text);border:1px solid var(--app-danger-border);border-radius:.375rem;padding:1rem;margin-bottom:1rem}
.errors ul{margin:.5rem 0 0;padding-left:1.25rem}

/* repeated rows (employment, education) */
.row-card{border:1px solid var(--app-border-color);border-radius:.375rem;margin:0 0 1rem;padding:1rem 1rem .25rem;min-width:0}
.row-card legend{float:none;width:auto;margin:0;padding:0 .5rem;font-size:.875rem;font-weight:500;color:var(--app-secondary-color)}

/* buttons */
button{display:inline-block;font:inherit;font-size:1rem;line-height:1.5;cursor:pointer;text-align:center;padding:.375rem .75rem;border:1px solid transparent;border-radius:.375rem;transition:color .15s,background-color .15s,border-color .15s,box-shadow .15s}
button:focus-visible{outline:0;box-shadow:0 0 0 .25rem var(--app-primary-ring)}
.primary{color:#fff;background:var(--app-primary);border-color:var(--app-primary)}
.primary:hover{background:var(--app-primary-hover);border-color:var(--app-primary-hover)}
.secondary,.add{color:var(--app-secondary-color);background:transparent;border-color:var(--app-secondary-color)}
.secondary:hover,.add:hover{color:#fff;background:#6c757d;border-color:#6c757d}
.link{color:var(--app-danger);background:none;border:0;padding:.25rem 0 .75rem;text-decoration:underline}
.actions{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-top:1.5rem}

/* review page */
dl{margin:0 0 1.25rem;font-size:.95rem}
dt{color:var(--app-secondary-color);margin-top:.625rem}
dd{margin:0;white-space:pre-wrap}
.review-h{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--app-border-color);margin:1.5rem 0 .25rem}
.review-h h3{margin:0;font-size:1.1rem}
.review-h a{font-size:.875rem}
.part{font-size:1.15rem;margin:1.75rem 0 .75rem;padding-top:1rem;border-top:1px solid var(--app-border-color)}
[hidden]{display:none !important}

/* success message (works with or without Bootstrap) */
.alert-success{background:#d1e7dd;color:#0a3622;border:1px solid #a3cfbb;border-radius:.375rem;padding:1rem;margin-bottom:1rem}
@media (prefers-color-scheme:dark){.alert-success{background:#051b11;color:#75b798;border-color:#0f5132}}

/* CAPTCHA box */
.captcha-box img{display:block;margin-bottom:.25rem;background:#fff}
.captcha-box a{display:inline-block;margin-bottom:.75rem}

/* Bootstrap card: keep it white (the page behind it stays light grey) */
.card{background-color:var(--app-card-bg);box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);padding:2rem;}

.card-header{background-color:transparent}

/* ---- Review page ---- */
.rv-intro{background:#e7f1ff;border:1px solid #b6d4fe;color:#084298;border-radius:.5rem;padding:.85rem 1rem;margin-bottom:1.25rem;overflow:hidden}
.rv-appno{margin-top:.4rem;font-size:.95rem}
.rv-card{background:#fff;background:var(--app-card-bg,#fff);border:1px solid #dee2e6;border-radius:.5rem;margin-bottom:1.25rem;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.rv-head{background:#f1f5f9;border-bottom:1px solid #dee2e6;padding:.6rem 1rem;overflow:hidden}
.rv-head h3{margin:0;float:left;font-size:1.05rem;line-height:2}
.rv-num{display:inline-block;width:1.7rem;height:1.7rem;line-height:1.7rem;margin-right:.6rem;border-radius:50%;background:#0d6efd;color:#fff;text-align:center;font-size:.85rem}
.rv-edit{float:right;margin-top:.15rem;padding:.2rem .8rem;border:1px solid #0d6efd;border-radius:.3rem;font-size:.85rem;text-decoration:none}
.rv-edit:hover{background:#0d6efd;color:#fff}
.rv-body{padding:.25rem 1rem .5rem}
.rv-table{width:100%;border-collapse:collapse}
.rv-table + .rv-table{border-top:1px solid #dee2e6}
.rv-table th{width:34%;padding:.6rem .8rem .6rem 0;text-align:left;vertical-align:top;font-weight:500;color:#6c757d;border-bottom:1px solid #eef0f2}
.rv-table td{padding:.6rem 0;vertical-align:top;white-space:pre-line;word-break:break-word;border-bottom:1px solid #eef0f2}
.rv-table tr:last-child th,.rv-table tr:last-child td{border-bottom:0}
.rv-files{display:inline-block;margin-top:.15rem;font-size:0}   /* font-size 0 hides the dot between the two links */
.rv-files a{display:inline-block;margin-right:.4rem;padding:.05rem .6rem;border:1px solid #0d6efd;border-radius:1rem;font-size:.8rem;text-decoration:none;white-space:nowrap}
.rv-files a:hover{background:#0d6efd;color:#fff}
.rv-missing{display:inline-block;padding:.05rem .6rem;border-radius:1rem;background:#f8d7da;color:#842029;font-size:.8rem}
.rv-declare{background:#fff8e1;border:1px solid #ffe08a;color:#3d3200;border-radius:.5rem;padding:1rem 1.1rem;margin:1.5rem 0 1rem}
.rv-declare-label{display:block;margin:0;text-align:justify;font-size:.92rem;line-height:1.6;cursor:pointer}
.rv-declare-label input{float:left;width:1.2rem;height:1.2rem;margin:.25rem .75rem .2rem 0}
.rv-back{padding:.45rem 1rem;border:1px solid #6c757d;border-radius:.375rem;color:#6c757d;text-decoration:none}
.rv-back:hover{background:#6c757d;color:#fff}

.heading-panel{background:var(--bs-tertiary-bg,#f8f9fa);border-bottom:2px solid var(--bs-border-color,#dee2e6);border-radius:.375rem;padding:.75rem 1rem;margin-bottom:1rem;text-align:center}
.heading-panel h2{margin:0;font-size:1.25rem}
.app-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 1.5rem;
}

.app-header .app-logo {
    display: block;
    width: 100%;
    max-width: 320px;
    height: auto;
    margin: 0 auto 1rem;
}

.app-header .app-title {
    width: 100%;
    margin: 0 0 .25rem;
    font-size: 1.75rem;
    text-align: center !important;
    float: none !important;
}

.app-header .app-user {
    width: 100%;
    margin: 0;
    color: #6c757d;
    text-align: center !important;
}

@media (max-width: 576px) {
    .app-header .app-logo { max-width: 220px; }
}
@media (max-width:600px){.rv-table th,.rv-table td{display:block;width:auto}.rv-table th{padding:.6rem 0 0;border-bottom:0}.rv-table td{padding:.1rem 0 .6rem}}
@media (prefers-color-scheme:dark){
  .rv-intro{background:#031633;border-color:#084298;color:#6ea8fe}
  .rv-head{background:#2b3035;border-color:#495057}
  .rv-card{border-color:#495057}
  .rv-table th,.rv-table td{border-color:#343a40}
  .rv-table + .rv-table{border-color:#495057}
  .rv-missing{background:#2c0b0e;color:#ea868f}
  .rv-declare{background:#332701;border-color:#664d03;color:#ffda6a}
}