:root{
  --mcc-blue:#2f3e91;
  --mcc-blue-dark:#23316f;
  --mcc-red:#ef2b35;
  --mcc-yellow:#ffc533;
  --mcc-green:#8cc63f;
  --ink:#20242d;
  --muted:#687083;
  --line:#d9deea;
}

*{box-sizing:border-box}
html,body{min-height:100%}
body{
  margin:0;
  color:var(--ink);
  background: linear-gradient(135deg, #edf9ff, #fbf1ff 48%, #fff4e8);
  background-attachment:fixed;
}

.page-wrap{
  max-width:1180px;
  margin:0 auto;
  padding:14px 14px 34px;
}

.main-card{
  background:#fff;
  border-radius:18px;
  box-shadow:0 18px 48px rgba(13,22,70,.28);
  overflow:hidden;
}

.site-head{
  position:relative;
  display:grid;
  grid-template-columns:170px 1fr 52px;
  align-items:center;
  gap:18px;
  padding:22px 22px 20px;
}
.site-head::after,
.pdf-like-topline{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:4px;
  background:linear-gradient(90deg,var(--mcc-red) 0 25%,var(--mcc-yellow) 25% 50%,var(--mcc-green) 50% 75%,var(--mcc-blue) 75%);
}
.site-logo{width:140px;max-height:72px;object-fit:contain;object-position:left center}
.site-copy{text-align:center}
.site-copy h1{font-size:clamp(1.45rem,2.7vw,2.2rem);font-weight:800;margin:0;color:#20242d;text-transform:uppercase}
.site-copy p{margin:7px 0 0;color:var(--mcc-blue);font-weight:700;font-size:1.02rem}
.admin-icon{
  width:40px;height:40px;display:grid;place-items:center;
  border:1px solid var(--line);border-radius:10px;color:var(--mcc-blue);
  text-decoration:none;background:#fff;
}

.form-content{padding:24px}
.form-section{
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  margin-bottom:16px;
}
.form-section-title{
  background:var(--mcc-blue);
  color:#fff;
  font-weight:800;
  text-align:center;
  padding:9px 12px;
}
.form-section-body{padding:18px}
.form-label{font-weight:700}
.required::after{content:" *";color:#dc3545}
.form-control,.form-select{
  min-height:44px;border-radius:9px;border-color:#d7dce7;
}
textarea.form-control{min-height:auto}
.form-control:focus,.form-select:focus{
  border-color:#6873ca;
  box-shadow:0 0 0 .18rem rgba(47,62,145,.12);
}

.instruction-box{
  background:#f7f8fb;border:1px solid #e0e4ec;border-radius:10px;
  padding:14px;font-size:.94rem;line-height:1.48;margin-bottom:14px;
}

.signature-wrap{
  border:1px solid #cfd5e2;
  border-radius:10px;
  background:#fff;
  overflow:hidden;
}
.signature-pad{
  display:block;
  width:100%;
  height:170px;
  touch-action:none;
  cursor:crosshair;
  background:#fff;
}
.signature-actions{
  display:flex;justify-content:flex-end;
  padding:8px;border-top:1px solid #e4e7ed;background:#f8f9fb;
}
.btn-submit{
  background:var(--mcc-blue);color:#fff;border:0;border-radius:10px;
  font-weight:800;padding:12px 30px;min-width:280px;
}
.btn-submit:hover{background:var(--mcc-blue-dark);color:#fff}

.dashboard-body{background:#f4f6fa}
.dashboard-nav{background:linear-gradient(90deg,#25347d,#3f4998)}
.stat-card,.data-card{border:0;border-radius:14px;box-shadow:0 6px 20px rgba(29,40,100,.09)}
.table td,.table th{vertical-align:middle}
.mobile-request-list{display:none}

.mcc-modal .modal-dialog{max-width:980px}
.mcc-box{
  border:2px solid #30343c;border-radius:18px;padding:16px;background:#fff;
}
.mcc-title{text-align:center;font-weight:800;margin-bottom:14px}
.mcc-subtitle{text-align:center;font-weight:800;margin:16px 0 10px}
.call-table th,.call-table td{font-size:.85rem}
.modal-signature .signature-pad{height:120px}

.pdf-like-sheet{
  background:#fff;border:1px solid #e1e4ec;border-radius:12px;
  box-shadow:0 12px 32px rgba(24,35,88,.10);padding:0 18px 22px;overflow:hidden;
}
.pdf-like-topline{position:relative;height:5px;margin:0 -18px 18px}
.pdf-like-header{
  display:grid;grid-template-columns:80px 1fr 80px;align-items:center;min-height:82px;
}
.pdf-like-logo{width:60px;max-height:68px;object-fit:contain}
.pdf-like-headcopy{text-align:center}
.pdf-like-headcopy h1{font-size:1.25rem;font-weight:800;margin:0}
.pdf-like-headcopy h2{font-size:.95rem;color:var(--mcc-blue);font-weight:800;margin:5px 0 0}
.pdf-like-meta{
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;
  background:#f0f3fb;border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin-bottom:14px;
}
.pdf-like-section{
  background:var(--mcc-blue);color:#fff;text-align:center;font-weight:800;
  font-size:.82rem;padding:8px 10px;margin:8px 0;
}
.pdf-like-cell{
  display:grid;grid-template-columns:165px minmax(0,1fr);
  border:1px solid var(--line);min-height:42px;background:#fff;
}
.pdf-like-label{
  padding:8px 10px;background:#f7f8fa;border-right:1px solid #e1e4eb;
  font-size:.76rem;font-weight:800;color:#626a7a;display:flex;align-items:center;
}
.pdf-like-value{padding:8px 10px;font-size:.87rem;overflow-wrap:anywhere}

@media(max-width:767.98px){
  .page-wrap{padding:8px}
  .main-card{border-radius:14px}
  .site-head{grid-template-columns:105px 1fr 40px;gap:7px;padding:11px 10px 14px}
  .site-logo{width:100px;max-height:50px}
  .site-copy h1{font-size:1rem}
  .site-copy p{font-size:.75rem}
  .form-content{padding:12px 10px 16px}
  .signature-pad{height:145px}
  .btn-submit{min-width:100%}

  .desktop-table{display:none}
  .mobile-request-list{display:block}
  .request-card{
    border:1px solid #dfe3eb;background:#fff;border-radius:12px;
    box-shadow:0 5px 15px rgba(25,35,86,.08);overflow:hidden;margin-bottom:10px;
  }
  .request-summary{
    padding:12px 14px;display:flex;justify-content:space-between;gap:10px;align-items:flex-start;
    cursor:pointer;
  }
  .request-summary .code{font-size:.73rem;color:var(--mcc-blue);font-weight:800}
  .request-summary .name{font-weight:800}
  .request-summary .candidate{font-size:.82rem;color:#6b7280;margin-top:2px}
  .request-summary .date{text-align:right;font-size:.75rem;color:#626a7a}
  .request-detail{display:none;border-top:1px solid #eceef3;padding:12px 14px}
  .request-card.open .request-detail{display:block}
  .detail-row{padding:7px 0;border-bottom:1px solid #eef0f4}
  .detail-row:last-child{border-bottom:0}
  .detail-label{font-size:.68rem;color:#7a8290;font-weight:800;text-transform:uppercase}
  .detail-value{font-size:.86rem;margin-top:2px}

  .pdf-like-header{grid-template-columns:55px 1fr 30px}
  .pdf-like-logo{width:44px}
  .pdf-like-headcopy h1{font-size:.92rem}
  .pdf-like-headcopy h2{font-size:.75rem}
  .pdf-like-meta{grid-template-columns:1fr}
  .pdf-like-cell{grid-template-columns:115px 1fr}
}

.success-wrap{padding:48px 24px 52px;text-align:center}
.success-logo{width:74px;max-height:74px;object-fit:contain}
.success-number{
  display:inline-block;
  margin-top:6px;
  padding:8px 18px;
  border-radius:10px;
  background:#f0f3fb;
  border:1px solid #d9deea;
  font-size:1.2rem;
  font-weight:800;
  color:#2f3e91;
}
