/* ═══════════════════════════════════════════
   Nextwebcraft Institute — Frontend (NWC brand)
   Colors: #396ebd · #74abf3 · #04367F · #fff
   ═══════════════════════════════════════════ */

/* ── Shared buttons (legacy panels) ──────── */
.nwci-btn {
  display:inline-block;padding:11px 26px;border-radius:8px;font-size:14px;
  font-weight:600;cursor:pointer;border:none;text-decoration:none;
  transition:all .25s;letter-spacing:.4px;font-family:inherit;line-height:1.4;
}
.nwci-btn-primary { background:#396ebd;color:#fff !important; }
.nwci-btn-primary:hover { background:#04367F;transform:translateY(-1px); }
.nwci-btn-outline { background:#fff;color:#04367F !important;border:2px solid #396ebd; }
.nwci-btn-outline:hover { background:#eef4fc; }
.nwci-btn-lg { font-size:16px;padding:14px 40px;min-width:220px; }

/* ═══════════════════════════════════════════
   Registration + Login — new aesthetic
   ═══════════════════════════════════════════ */
@keyframes nwciRegIn {
  from { opacity:0; transform:translateY(28px) scale(.98); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes nwciFadeUp {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes nwciFloat {
  0%,100% { transform:translate(0,0) scale(1); }
  50%     { transform:translate(12px,-16px) scale(1.05); }
}
@keyframes nwciShimmer {
  0%   { background-position:200% center; }
  100% { background-position:-200% center; }
}
@keyframes nwciPulseRing {
  0%   { box-shadow:0 0 0 0 rgba(116,171,243,.55); }
  70%  { box-shadow:0 0 0 18px rgba(116,171,243,0); }
  100% { box-shadow:0 0 0 0 rgba(116,171,243,0); }
}

.nwci-reg-page {
  --nwc-primary:#396ebd;
  --nwc-light:#74abf3;
  --nwc-navy:#04367F;
  --nwc-white:#ffffff;
  --nwc-bg:#f4f8ff;
  --nwc-text:#1a2d4a;
  --nwc-muted:#5a7194;
  position:relative;
  max-width:860px;
  margin:36px auto 48px;
  padding:0 16px;
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
  color:var(--nwc-text);
}
.nwci-reg-bg {
  position:absolute;inset:-20px -8px auto; height:320px; overflow:hidden; pointer-events:none; z-index:0;
}
.nwci-reg-bg span {
  position:absolute;border-radius:50%;filter:blur(40px);opacity:.45;
  animation:nwciFloat 9s ease-in-out infinite;
}
.nwci-reg-bg span:nth-child(1){ width:220px;height:220px;background:var(--nwc-light);top:-40px;left:-30px; }
.nwci-reg-bg span:nth-child(2){ width:180px;height:180px;background:var(--nwc-primary);top:20px;right:10%;animation-delay:-3s; }
.nwci-reg-bg span:nth-child(3){ width:140px;height:140px;background:var(--nwc-navy);top:80px;right:-20px;opacity:.25;animation-delay:-5s; }

.nwci-reg-card {
  position:relative;z-index:1;
  background:var(--nwc-white);
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(4,54,127,.12), 0 2px 8px rgba(57,110,189,.08);
  border:1px solid rgba(116,171,243,.35);
  animation:nwciRegIn .65s cubic-bezier(.22,1,.36,1) both;
}
.nwci-reg-card--login { max-width:460px;margin:0 auto; }

.nwci-reg-hero {
  text-align:center;
  padding:36px 28px 28px;
  background:linear-gradient(135deg, var(--nwc-navy) 0%, var(--nwc-primary) 52%, var(--nwc-light) 100%);
  color:var(--nwc-white);
  position:relative;
}
.nwci-reg-hero::after {
  content:'';position:absolute;inset:auto 0 0;height:4px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
}
.nwci-reg-logo-shell {
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.96);
  padding:14px 22px;border-radius:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  animation:nwciFadeUp .7s ease .15s both;
}
.nwci-reg-logo {
  display:block;max-height:80px;width:auto;max-width:min(100%,320px);height:auto;
}
.nwci-reg-tagline {
  margin:18px 0 0;font-size:1.35rem;font-weight:700;letter-spacing:.02em;
  animation:nwciFadeUp .7s ease .25s both;
}
.nwci-reg-sub {
  margin:8px 0 0;font-size:.85rem;opacity:.88;font-weight:500;
  animation:nwciFadeUp .7s ease .35s both;
}

.nwci-reg-body { padding:28px 32px 32px; }
.nwci-login-page .nwci-reg-body { padding:26px 28px 30px; }

.nwci-reg-panel {
  background:linear-gradient(180deg, #fafcff 0%, #fff 100%);
  border:1px solid rgba(116,171,243,.28);
  border-radius:16px;
  padding:20px 22px 8px;
  margin-bottom:20px;
  transition:box-shadow .3s, border-color .3s;
}
.nwci-reg-panel:hover {
  border-color:rgba(57,110,189,.45);
  box-shadow:0 8px 28px rgba(57,110,189,.08);
}
.nwci-reg-panel-head {
  display:flex;align-items:center;gap:12px;
  font-size:.95rem;font-weight:700;color:var(--nwc-navy);
  margin-bottom:18px;padding-bottom:12px;
  border-bottom:2px solid rgba(116,171,243,.35);
}
.nwci-reg-step {
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:10px;flex-shrink:0;
  font-size:.75rem;font-weight:800;color:var(--nwc-white);
  background:linear-gradient(135deg, var(--nwc-primary), var(--nwc-light));
}

.nwci-reg-anim {
  animation:nwciFadeUp .55s ease calc(.08s * var(--i, 1)) both;
}

.nwci-grid { display:grid;grid-template-columns:1fr 1fr;gap:18px 22px; }
.nwci-full  { grid-column:1/-1; }

.nwci-section-divider {
  font-size:.72rem;font-weight:800;color:var(--nwc-navy);text-transform:uppercase;
  letter-spacing:.12em;padding:14px 0 6px;border-top:2px solid rgba(116,171,243,.35);
  margin-top:4px;grid-column:1/-1;
}

.nwci-field { display:flex;flex-direction:column; }
.nwci-field label { font-size:.82rem;font-weight:700;color:var(--nwc-text);margin-bottom:7px;letter-spacing:.02em; }
.nwci-field .req { color:var(--nwc-primary); }
.nwci-field .nwci-optional { font-size:.72rem;color:var(--nwc-muted);font-weight:500; }
.nwci-hint { font-size:.75rem;color:var(--nwc-muted);margin-top:5px; }
.nwci-field-note { font-size:.75rem;color:#e65100;margin-top:5px; }

.nwci-field input,
.nwci-field select,
.nwci-field textarea {
  padding:12px 15px;
  border:1.5px solid rgba(116,171,243,.45);
  border-radius:12px;
  font-size:.92rem;color:var(--nwc-text);
  outline:none;
  background:#f8fbff;
  width:100%;box-sizing:border-box;font-family:inherit;
  transition:border-color .25s, box-shadow .25s, background .25s, transform .2s;
}
.nwci-field input:hover,
.nwci-field select:hover,
.nwci-field textarea:hover { border-color:var(--nwc-primary); }
.nwci-field input:focus,
.nwci-field select:focus,
.nwci-field textarea:focus {
  border-color:var(--nwc-primary);
  background:var(--nwc-white);
  box-shadow:0 0 0 4px rgba(116,171,243,.25);
  transform:translateY(-1px);
}

.nwci-pass-wrap { position:relative; }
.nwci-pass-wrap input { padding-right:46px; }
.nwci-pass-toggle {
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  border:none;background:transparent;cursor:pointer;font-size:1.1rem;opacity:.55;padding:4px 8px;
}
.nwci-pass-toggle:hover { opacity:1; }

.nwci-pass-meter { margin-top:10px; }
.nwci-pass-bars { display:flex;gap:5px;margin-bottom:6px; }
.nwci-pass-bars div { height:5px;flex:1;border-radius:3px;background:#e3eaf5;transition:background .25s; }
.nwci-pass-rules { display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.72rem;color:#aab4c8; }
.nwci-pass-rules span.ok { color:#2e7d32; }

.nwci-ref-row { display:flex;gap:10px;align-items:stretch; }
.nwci-ref-row input { flex:1; }
.nwci-ref-btn {
  flex-shrink:0;padding:12px 20px;border:none;border-radius:12px;cursor:pointer;
  font-weight:700;font-size:.85rem;color:var(--nwc-white);
  background:linear-gradient(135deg, var(--nwc-navy), var(--nwc-primary));
  transition:transform .2s, box-shadow .2s;
}
.nwci-ref-btn:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(57,110,189,.35); }
.nwci-ref-result { margin-top:8px;font-size:.85rem; }

.nwci-upload {
  border:2px dashed rgba(116,171,243,.55);
  border-radius:16px;padding:24px;text-align:center;
  background:linear-gradient(180deg, #f0f6ff, #fafcff);
  cursor:pointer;transition:all .3s;
}
.nwci-upload:hover {
  border-color:var(--nwc-primary);
  background:#eef4fc;
  transform:scale(1.01);
}
.nwci-upload-icon { font-size:2.4rem;margin-bottom:6px; }
#nwci-upload-placeholder p { margin:6px 0 4px;font-size:.9rem;color:var(--nwc-muted); }
#nwci-upload-placeholder small { color:#8a9bb8;font-size:.75rem; }
#nwci-pic-preview { max-height:150px;border-radius:12px;border:3px solid var(--nwc-primary); }
.nwci-upload-ok { font-size:.85rem;color:#2e7d32;margin-top:10px;font-weight:600; }

.nwci-media-actions {
  display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px;
}
.nwci-media-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border:none;border-radius:10px;cursor:pointer;
  font-size:.82rem;font-weight:700;font-family:inherit;color:var(--nwc-white);
  background:linear-gradient(135deg, var(--nwc-navy), var(--nwc-primary));
  transition:transform .2s, box-shadow .2s;
}
.nwci-media-btn:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(57,110,189,.3); }
.nwci-media-btn--outline {
  background:var(--nwc-white);color:var(--nwc-navy);border:2px solid var(--nwc-primary);
}
.nwci-media-btn--outline:hover { background:#eef4fc; }
.nwci-media-btn--sm { padding:8px 14px;font-size:.75rem;margin-top:10px; }

.nwci-upload--sig #nwci-sig-preview {
  max-height:100px;max-width:100%;background:
    repeating-conic-gradient(#e8eef8 0% 25%, #fff 0% 50%) 50% / 16px 16px;
  border-radius:8px;padding:8px;
}

.nwci-media-modal {
  display:none;position:fixed;inset:0;z-index:1000000;
  background:rgba(4,54,127,.55);align-items:center;justify-content:center;padding:16px;
  backdrop-filter:blur(4px);
}
.nwci-media-dialog {
  width:100%;max-width:640px;background:#fff;border-radius:18px;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.25);max-height:92vh;display:flex;flex-direction:column;
}
.nwci-media-head {
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;background:linear-gradient(135deg, var(--nwc-navy), var(--nwc-primary));color:#fff;
}
.nwci-media-head h3 { margin:0;font-size:1rem;font-weight:700; }
.nwci-media-close {
  border:none;background:rgba(255,255,255,.15);color:#fff;width:36px;height:36px;
  border-radius:50%;font-size:1.4rem;line-height:1;cursor:pointer;
}
.nwci-media-pane { padding:16px 18px 18px;overflow:auto; }
#nwci-media-video,
#int-media-video {
  width:100%;max-height:52vh;border-radius:12px;background:#000;display:block;
}
#nwci-media-video.nwci-video-mirror,
#int-media-video.nwci-video-mirror { transform:scaleX(-1); }
.nwci-crop-wrap {
  max-height:52vh;background:#f4f8ff;border-radius:12px;overflow:hidden;
}
.nwci-crop-wrap img { display:block;max-width:100%; }
.nwci-bg-toggle {
  display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:.85rem;color:var(--nwc-text);font-weight:600;
}
.nwci-bg-toggle input { width:18px;height:18px;accent-color:var(--nwc-primary); }
.nwci-media-foot {
  display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;justify-content:flex-end;
}

.nwci-map-modal .nwci-map-dialog { max-width:720px; }
.nwci-map-pane { padding:16px 18px 18px; }
#nwci-map-canvas {
  height:360px;width:100%;border-radius:12px;background:#e8eef8;
  border:1px solid rgba(57,110,189,.2);
}
.nwci-map-preview {
  margin-top:10px;padding:10px 12px;background:#f0f7ff;border-radius:10px;
  font-size:.88rem;line-height:1.5;
}
.nwci-map-preview a { color:var(--nwc-primary);font-weight:600;text-decoration:none; }
.nwci-map-preview a:hover { text-decoration:underline; }
.nwci-map-ok { color:#059669;font-weight:700;margin-right:6px; }
.nwci-optional { font-weight:400;color:#64748b;font-size:.85em; }

.nwci-reg-submit-wrap { text-align:center;margin-top:8px; }
.nwci-reg-submit {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:260px;padding:15px 36px;border:none;border-radius:14px;cursor:pointer;
  font-size:1rem;font-weight:700;color:var(--nwc-white);font-family:inherit;
  background:linear-gradient(120deg, var(--nwc-navy), var(--nwc-primary) 45%, var(--nwc-light));
  background-size:200% auto;
  box-shadow:0 10px 28px rgba(4,54,127,.28);
  transition:transform .25s, box-shadow .25s;
  text-decoration:none;
}
.nwci-reg-submit:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 36px rgba(57,110,189,.38);
  animation:nwciShimmer 2.5s linear infinite;
}
.nwci-reg-submit:disabled { opacity:.65;cursor:not-allowed;transform:none; }
.nwci-reg-submit--outline {
  background:var(--nwc-white);color:var(--nwc-navy) !important;
  border:2px solid var(--nwc-primary);box-shadow:none;
}
.nwci-reg-submit--outline:hover { background:#eef4fc;animation:none; }

.nwci-loading {
  padding:12px 16px;background:rgba(116,171,243,.15);border-radius:12px;
  font-size:.88rem;color:var(--nwc-navy);
}
.nwci-error-box {
  background:#fff5f5;border-left:4px solid var(--nwc-primary);
  color:var(--nwc-navy);padding:14px 18px;border-radius:12px;
  font-size:.88rem;margin-bottom:18px;
}

/* Success */
.nwci-success-screen { padding:48px 32px 40px;text-align:center; }
.nwci-success-ring {
  width:88px;height:88px;margin:0 auto 22px;border-radius:50%;
  background:linear-gradient(135deg, #43a047, #66bb6a);
  display:flex;align-items:center;justify-content:center;
  animation:nwciPulseRing 2s ease infinite;
}
.nwci-success-ring span { font-size:2.2rem;color:#fff;font-weight:800; }
.nwci-success-screen h2 { color:var(--nwc-navy);font-size:1.6rem;margin:0 0 8px; }
.nwci-success-screen p { color:var(--nwc-muted);font-size:.95rem;margin-bottom:12px; }
.nwci-roll-badge {
  display:inline-block;margin:12px 0 16px;padding:16px 32px;border-radius:14px;
  font-size:1.5rem;font-weight:800;letter-spacing:.12em;color:var(--nwc-white);
  background:linear-gradient(135deg, var(--nwc-navy), var(--nwc-primary));
}
.nwci-roll-note { font-size:.85rem;color:var(--nwc-muted); }
.nwci-success-actions { display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:24px; }

/* Login extras */
.nwci-login-meta {
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:20px;flex-wrap:wrap;gap:10px;
}
.nwci-check-label {
  display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--nwc-muted);
  cursor:pointer;font-weight:600;user-select:none;
}
.nwci-check-label input { width:16px;height:16px;accent-color:var(--nwc-primary);cursor:pointer; }
.nwci-link { color:var(--nwc-primary);font-size:.82rem;font-weight:700;text-decoration:none; }
.nwci-link:hover { color:var(--nwc-navy);text-decoration:underline; }
.nwci-reg-footnote { text-align:center;margin-top:16px;font-size:.82rem;color:var(--nwc-muted); }
.nwci-reg-footnote a { color:var(--nwc-primary);font-weight:700;text-decoration:none; }

/* Legacy wrap (other shortcodes) */
.nwci-wrap { max-width:740px;margin:30px auto;font-family:'Segoe UI',Arial,sans-serif; }
.nwci-form-header-icon { font-size:36px;margin-bottom:8px; }

/* ═══════════════════════════════════════════
   Result / Marksheet Portal
   ═══════════════════════════════════════════ */
.srp-lookup-wrap {
  max-width:520px;margin:40px auto;background:#fff;
  border:1px solid rgba(116,171,243,.35);border-radius:14px;
  padding:40px 36px;text-align:center;
  box-shadow:0 6px 24px rgba(0,0,0,.06);font-family:'Segoe UI',Arial,sans-serif;
}
.srp-lookup-logo { max-height:64px;margin-bottom:14px; }
.srp-lookup-wrap h2 { font-size:22px;color:#04367F;margin:0 0 6px; }
.srp-lookup-wrap p  { font-size:14px;color:#666;margin:0 0 24px; }
.srp-lookup-form    { display:flex;flex-direction:column;gap:14px;align-items:center; }
.srp-lookup-input   { padding:12px 16px;border:1.5px solid rgba(116,171,243,.45);border-radius:8px;font-size:15px;width:100%;max-width:340px;box-sizing:border-box;font-family:inherit;outline:none; }
.srp-lookup-input:focus { border-color:#396ebd; }

.srp-outer { font-family:'Times New Roman',Georgia,serif; }
.srp-wrap {
  max-width:960px;margin:20px auto;background:#fff;
  border:2px solid #000;padding:28px 32px;position:relative;
}
.srp-watermark {
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);opacity:.04;z-index:0;pointer-events:none;
}
.srp-watermark img { max-width:280px; }
.srp-header {
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  border-bottom:2px solid #000;padding-bottom:12px;margin-bottom:20px;
  position:relative;z-index:2;
}
.srp-logo img  { max-height:70px; }
.srp-branch img{ max-height:55px; }
.srp-title     { text-align:center;flex:1;padding:0 16px; }
.srp-title h1  { margin:0;font-size:22px;color:#000; }
.srp-title p   { margin:3px 0;font-size:13px;color:#444; }
.srp-profile { display:grid;grid-template-columns:1fr 160px;gap:16px;margin-bottom:20px;position:relative;z-index:2; }
.srp-info-table { width:100%;border-collapse:collapse; }
.srp-info-table td { padding:6px 8px;font-size:14px;border-bottom:1px solid #eee;vertical-align:top; }
.srp-info-table td:first-child { font-weight:bold;width:38%;color:#111; }
.srp-photo img { width:140px;height:180px;border:1px solid #000;object-fit:cover;display:block; }
.srp-table { width:100%;border-collapse:collapse;margin-top:10px;font-size:14px;position:relative;z-index:2; }
.srp-table th,.srp-table td { border:1px solid #000;padding:10px;text-align:center; }
.srp-table th { background:#f5f5f5;font-weight:bold; }
.srp-status { font-weight:bold; }
.srp-status.pass         { color:#1b7e1b; }
.srp-status.fail         { color:#396ebd; }
.srp-status.not-attempted{ color:#e65100; }
.srp-totals { display:flex;gap:12px;margin-top:16px;position:relative;z-index:2;flex-wrap:wrap; }
.srp-total-box {
  flex:1;min-width:160px;border:1px solid #ddd;border-radius:6px;
  padding:12px 16px;text-align:center;background:#fafafa;
}
.srp-result-pass { background:#f1f8e9;border-color:#81c784; }
.srp-result-fail { background:#ffebee;border-color:#ef9a9a; }
.srp-total-label { display:block;font-size:12px;color:#666;margin-bottom:4px; }
.srp-total-val   { display:block;font-size:18px;font-weight:bold;color:#000; }
.srp-note {
  margin-top:18px;font-size:13px;color:#555;
  border-top:1px solid #e0e0e0;padding-top:12px;position:relative;z-index:2;
}
.srp-actions { margin-top:14px;text-align:right;position:relative;z-index:2; }

@media(max-width:640px){
  .nwci-grid { grid-template-columns:1fr; }
  .nwci-reg-body { padding:20px 16px 24px; }
  .nwci-reg-hero { padding:28px 18px 22px; }
  .nwci-reg-logo { max-height:48px; }
  .nwci-ref-row { flex-direction:column; }
  .nwci-reg-submit { width:100%;min-width:0; }
  .srp-profile { grid-template-columns:1fr; }
  .srp-photo { text-align:center; }
  .srp-header { flex-direction:column;gap:8px; }
  .srp-title { text-align:center; }
  .srp-totals { flex-direction:column; }
}
@media print {
  .srp-actions,.srp-note { display:none; }
  .srp-wrap { border:none;padding:0; }
}