/* ---------- ROOT TOKENS ---------- */
:root{
  --gk-blue:#2C4A6C;
  --gk-blue-dark:#22395a;
  --gk-orange:#f47521;
  --gk-orange-dark:#d85f10;
  --gk-bg:#f6f8fb;
  --gk-card:#ffffff;
  --gk-text:#1f2937;
  --gk-muted:#64748b;
  --gk-border:#e5e7eb;
  --gk-green:#16a34a;
  --gk-red:#dc2626;
  --gk-radius:10px;
  --gk-shadow:0 6px 24px -10px rgba(15,29,74,.18);
  --gk-container:1280px;
}
body { background: var(--gk-bg); color: var(--gk-text); }
.ss-section { padding: 40px 0; }
.ss-form, .ss-card { background: var(--gk-card); border: 1px solid var(--gk-border); border-radius: var(--gk-radius); padding: 24px; box-shadow: var(--gk-shadow); }
.ss-card .ss-icon { width:56px;height:56px;background:linear-gradient(135deg,var(--gk-blue),var(--gk-orange));color:#fff;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:14px; }
.ss-icon.mx-auto { margin-left:auto; margin-right:auto; }
.ss-btn { display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:8px;font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .2s;font-size:14px; }
.ss-btn-primary { background:linear-gradient(135deg,var(--gk-orange),var(--gk-orange-dark));color:#fff; }
.ss-btn-primary:hover { background:var(--gk-orange-dark);color:#fff;transform:translateY(-1px); }
.ss-btn-outline { background:transparent;color:var(--gk-blue);border:1.5px solid var(--gk-blue); }
.ss-btn-outline:hover { background:var(--gk-blue);color:#fff; }
.form-control, .form-select { border-radius:8px;border:1px solid var(--gk-border);padding:9px 12px; }
.form-control:focus, .form-select:focus { border-color:var(--gk-orange);box-shadow:0 0 0 .15rem rgba(244,117,33,.18); }
.ss-dash-head { background:var(--gk-card);padding:18px 22px;border-radius:var(--gk-radius);box-shadow:var(--gk-shadow); }
.ss-tabs .nav-link { color:var(--gk-text);border-radius:8px;font-weight:600; }
.ss-tabs .nav-link.active { background:var(--gk-blue);color:#fff; }

/* ---------- ID CARD ---------- */
.ss-idcard { max-width:520px;margin:0 auto;background:linear-gradient(135deg,var(--gk-blue),var(--gk-orange));color:#fff;border-radius:16px;padding:22px;box-shadow:0 14px 40px -10px rgba(0,0,0,.25); }
.ss-idcard-head { display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:12px;margin-bottom:14px; }
.ss-idcard-head .org { font-size:13px;letter-spacing:1.5px;opacity:.9; }
.ss-idcard-head .ttl { font-weight:700;font-size:1.1rem; }
.ss-idcard-head .om { font-size:2.5rem; }
.ss-idcard-body { display:flex;gap:16px; }
.ss-idcard-body .ph { width:100px;height:120px;background:rgba(255,255,255,.2);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:2.5rem;overflow:hidden;flex-shrink:0; }
.ss-idcard-body .ph img { width:100%;height:100%;object-fit:cover; }
.ss-idcard-body .info { flex:1;font-size:13px; }
.ss-idcard-body .nm { font-size:1.2rem;font-weight:700; }
.ss-idcard-body .sm { opacity:.9;margin-bottom:8px; }
.ss-idcard-body table { width:100%; }
.ss-idcard-body th { width:80px;font-weight:500;opacity:.9;padding:2px 0; }
.ss-idcard-body td { padding:2px 0;font-weight:600; }
.ss-idcard-foot { margin-top:12px;padding-top:10px;border-top:1px solid rgba(255,255,255,.3);font-size:11px;text-align:center;opacity:.9; }

/* ---------- CERTIFICATE ---------- */
.ss-certificate { max-width:820px;margin:0 auto;background:#fffdf7;border:14px double var(--gk-orange);border-radius:8px;padding:30px;box-shadow:var(--gk-shadow); }
.ss-certificate .bd { border:2px solid var(--gk-blue);padding:30px;text-align:center;background:
  radial-gradient(circle at 10% 10%, rgba(244,117,33,.06), transparent 40%),
  radial-gradient(circle at 90% 90%, rgba(44,74,108,.06), transparent 40%); }
.ss-certificate .top { font-size:3rem;color:var(--gk-orange);line-height:1; }
.ss-certificate .org { font-size:1.4rem;font-weight:700;color:var(--gk-blue);letter-spacing:2px;margin-top:6px; }
.ss-certificate .ttl { font-size:2rem;font-weight:800;color:var(--gk-orange);margin:14px 0;font-family:Georgia,serif; }
.ss-certificate .sub { font-size:14px;color:var(--gk-muted);margin:6px 0; }
.ss-certificate .nm { font-size:2.2rem;font-weight:800;color:var(--gk-blue);margin:14px 0;font-family:Georgia,serif;border-bottom:1px dashed var(--gk-border);padding-bottom:8px;display:inline-block;min-width:60%; }
.ss-certificate .bd-text { max-width:600px;margin:18px auto;line-height:1.7;color:var(--gk-text);font-size:15px; }
.ss-certificate .sign-row { display:flex;justify-content:space-around;margin-top:40px; }
.ss-certificate .sign-row .line { width:160px;border-top:1px solid var(--gk-text);margin-bottom:4px; }
.ss-certificate .cn { margin-top:24px;font-size:12px;color:var(--gk-muted); }

/* ---------- PRINT ---------- */
@media print {
  body * { visibility: hidden !important; }
  .ss-print-area, .ss-print-area * { visibility: visible !important; }
  .ss-print-area { position: absolute; left: 0; top: 0; width: 100%; }
  .ss-section, body { background: #fff !important; padding: 0 !important; }
}

@media(max-width:768px){

.ss-idcard-body {
    flex-direction: column;
}
}