/*
 * PCAMS Public CSS — Police Certificate Application Management System
 * Modern, clean, citizen-facing design. Zero admin data exposed to public.
 * Scoped to .pcams-wrap to avoid WordPress theme conflicts.
 */

/* ── Design tokens ────────────────────────────────────────────────────── */
.pcams-wrap {
  --p-brand:        #1B3A6B;
  --p-brand-dark:   #122850;
  --p-brand-light:  #2855A0;
  --p-accent:       #C89B2A;
  --p-success:      #0E8A5F;
  --p-warning:      #B45309;
  --p-danger:       #C0392B;
  --p-info:         #0E6F9E;
  --p-bg:           #F7F8FA;
  --p-surface:      #FFFFFF;
  --p-surface-2:    #F3F5F8;
  --p-border:       #DDE2EA;
  --p-border-focus: #2855A0;
  --p-text-primary:   #1A2030;
  --p-text-secondary: #4B5467;
  --p-text-muted:     #7D889A;
  --p-text-placeholder: #AAB3C0;
  --p-radius-sm: 6px;
  --p-radius:    10px;
  --p-radius-lg: 16px;
  --p-shadow-sm:  0 1px 3px rgba(0,0,0,.06);
  --p-shadow:     0 4px 12px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.04);
  --p-shadow-lg:  0 12px 32px rgba(0,0,0,.10);
  --p-transition: all .18s cubic-bezier(.4,0,.2,1);
  font-family:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:15px; line-height:1.6; color:var(--p-text-primary);
  background:var(--p-bg); -webkit-font-smoothing:antialiased;
}
.pcams-wrap *,.pcams-wrap *::before,.pcams-wrap *::after{box-sizing:border-box;}
.pcams-wrap{max-width:780px;margin:0 auto;padding:1.5rem 1rem 3rem;}

/* ── Header ─── */
.pcams-form-header{text-align:center;padding:2rem 1rem 1.5rem;margin-bottom:1.5rem;}
.pcams-org-badge{display:inline-flex;align-items:center;gap:.5rem;background:var(--p-brand);color:#fff;padding:.35rem 1rem;border-radius:50px;font-size:.74rem;font-weight:800;letter-spacing:.6px;text-transform:uppercase;margin-bottom:1rem;}
.pcams-form-header h1{font-size:1.65rem;font-weight:800;color:var(--p-text-primary);margin:0 0 .5rem;letter-spacing:-.3px;line-height:1.25;}
.pcams-form-header p{font-size:.9rem;color:var(--p-text-secondary);margin:0;}

/* ── Step progress ─── */
.pcams-progress-wrap{margin-bottom:1.75rem;}
.pcams-step-counter{text-align:right;font-size:.78rem;color:var(--p-text-muted);font-weight:700;margin-bottom:.5rem;}
.pcams-step-counter strong{color:var(--p-brand);}
.pcams-step-track{display:flex;gap:3px;margin-bottom:.6rem;}
.pcams-step-seg{flex:1;height:4px;background:var(--p-border);border-radius:2px;transition:background .3s;}
.pcams-step-seg.done{background:var(--p-brand);}
.pcams-step-seg.active{background:linear-gradient(90deg,var(--p-brand),var(--p-brand-light));}
.pcams-step-labels{display:flex;}
.pcams-step-lbl{flex:1;font-size:.68rem;color:var(--p-text-muted);font-weight:700;text-align:center;line-height:1.2;}
.pcams-step-lbl.active{color:var(--p-brand);}
.pcams-step-lbl.done{color:var(--p-success);}

/* ── Card ─── */
.pcams-card{background:var(--p-surface);border:1px solid var(--p-border);border-radius:var(--p-radius-lg);box-shadow:var(--p-shadow);overflow:hidden;}
.pcams-card-body{padding:1.75rem;}
.pcams-section-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.9px;color:var(--p-brand);margin-bottom:1.25rem;display:flex;align-items:center;gap:.5rem;}
.pcams-section-label::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--p-border),transparent);}

/* ── Fields ─── */
.pcams-field{margin-bottom:1.2rem;}
.pcams-field:last-child{margin-bottom:0;}
.pcams-label{display:flex;align-items:baseline;gap:.35rem;font-size:.82rem;font-weight:700;color:var(--p-text-secondary);margin-bottom:.45rem;}
.pcams-label .req{color:var(--p-danger);font-size:.75rem;}
.pcams-input,.pcams-select{width:100%;padding:.7rem 1rem;border:1.5px solid var(--p-border);border-radius:var(--p-radius);font-size:.9rem;color:var(--p-text-primary);background:var(--p-surface);font-family:inherit;transition:var(--p-transition);appearance:none;-webkit-appearance:none;}
.pcams-input::placeholder{color:var(--p-text-placeholder);}
.pcams-input:focus,.pcams-select:focus{outline:none;border-color:var(--p-brand-light);box-shadow:0 0 0 3px rgba(40,85,160,.12);}
.pcams-input.error,.pcams-select.error{border-color:var(--p-danger);}
.pcams-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237D889A' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem;}
.pcams-input[type="date"]{color-scheme:light;}
.pcams-field-hint{font-size:.75rem;color:var(--p-text-muted);margin-top:.35rem;line-height:1.4;}
.pcams-field-error{font-size:.75rem;color:var(--p-danger);margin-top:.35rem;display:none;}

/* ── Choices ─── */
.pcams-choices{display:grid;gap:.6rem;}
.pcams-choices.cols-2{grid-template-columns:1fr 1fr;}
.pcams-choices.cols-3{grid-template-columns:repeat(3,1fr);}
@media(max-width:520px){.pcams-choices.cols-2,.pcams-choices.cols-3{grid-template-columns:1fr 1fr;}}
.pcams-choice{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border:1.5px solid var(--p-border);border-radius:var(--p-radius);cursor:pointer;transition:var(--p-transition);background:var(--p-surface);user-select:none;}
.pcams-choice:hover{border-color:var(--p-brand-light);background:#F0F5FF;}
.pcams-choice.selected{border-color:var(--p-brand);background:rgba(27,58,107,.04);box-shadow:0 0 0 1px var(--p-brand) inset;}
.pcams-choice input[type="radio"],.pcams-choice input[type="checkbox"]{accent-color:var(--p-brand);width:17px;height:17px;flex-shrink:0;cursor:pointer;}
.pcams-choice-icon{width:38px;height:38px;border-radius:var(--p-radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0;}
.pcams-choice-title{font-size:.88rem;font-weight:700;color:var(--p-text-primary);line-height:1.3;}
.pcams-choice-desc{font-size:.75rem;color:var(--p-text-muted);margin-top:.1rem;}

/* ── Alerts ─── */
.pcams-alert{display:flex;gap:.75rem;align-items:flex-start;padding:.85rem 1rem;border-radius:var(--p-radius);font-size:.83rem;line-height:1.5;margin-bottom:1rem;border-left:4px solid;}
.pcams-alert i{font-size:1rem;flex-shrink:0;margin-top:.1rem;}
.pcams-alert-info   {background:#EFF6FF;border-color:var(--p-info);color:#1E407C;}
.pcams-alert-success{background:#ECFDF5;border-color:var(--p-success);color:#065F46;}
.pcams-alert-warning{background:#FFFBEB;border-color:var(--p-warning);color:#78350F;}
.pcams-alert-error  {background:#FEF2F2;border-color:var(--p-danger);color:#7F1D1D;}

/* ── Price / amount ─── */
.pcams-price-badge{display:inline-flex;align-items:center;gap:.25rem;background:rgba(200,155,42,.12);color:#7C5A0A;border:1px solid rgba(200,155,42,.3);padding:.15rem .6rem;border-radius:20px;font-size:.74rem;font-weight:800;margin-top:.25rem;}
.pcams-amount-display{background:linear-gradient(135deg,rgba(27,58,107,.05),rgba(40,85,160,.03));border:1.5px solid rgba(27,58,107,.15);border-radius:var(--p-radius);padding:.85rem 1.1rem;display:flex;justify-content:space-between;align-items:center;}
.pcams-amount-label{font-size:.8rem;font-weight:700;color:var(--p-text-muted);}
.pcams-amount-value{font-size:1.25rem;font-weight:800;color:var(--p-brand);}

/* ── Nav bar ─── */
.pcams-nav{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.75rem;border-top:1px solid var(--p-surface-2);gap:.75rem;}
.pcams-btn{display:inline-flex;align-items:center;gap:.45rem;padding:.7rem 1.5rem;border-radius:var(--p-radius);font-size:.88rem;font-weight:700;font-family:inherit;cursor:pointer;border:none;transition:var(--p-transition);white-space:nowrap;letter-spacing:.1px;}
.pcams-btn:disabled{opacity:.45;cursor:not-allowed;}
.pcams-btn-primary{background:var(--p-brand);color:#fff;}
.pcams-btn-primary:hover:not(:disabled){background:var(--p-brand-dark);box-shadow:0 4px 16px rgba(27,58,107,.3);transform:translateY(-1px);}
.pcams-btn-secondary{background:var(--p-surface);color:var(--p-text-secondary);border:1.5px solid var(--p-border);}
.pcams-btn-secondary:hover:not(:disabled){border-color:var(--p-brand-light);color:var(--p-brand);background:#F0F5FF;}
.pcams-btn-success{background:var(--p-success);color:#fff;}
.pcams-btn-success:hover:not(:disabled){background:#0A7A53;box-shadow:0 4px 16px rgba(14,138,95,.3);transform:translateY(-1px);}
.pcams-btn:active:not(:disabled){transform:translateY(0)!important;}

/* ── Spinner ─── */
.pcams-spinner{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.3);border-top-color:currentColor;border-radius:50%;animation:pcams-spin .65s linear infinite;display:inline-block;flex-shrink:0;}
@keyframes pcams-spin{to{transform:rotate(360deg);}}

/* ── Time slots ─── */
.pcams-timeslot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:.45rem;}
.pcams-timeslot{padding:.5rem;text-align:center;border:1.5px solid var(--p-border);border-radius:var(--p-radius-sm);font-size:.78rem;font-weight:700;cursor:pointer;color:var(--p-text-secondary);transition:var(--p-transition);background:var(--p-surface);}
.pcams-timeslot:hover{border-color:var(--p-brand-light);color:var(--p-brand);background:#F0F5FF;}
.pcams-timeslot.selected{background:var(--p-brand);border-color:var(--p-brand);color:#fff;}
.pcams-timeslot.full{background:var(--p-surface-2);color:var(--p-text-placeholder);cursor:not-allowed;text-decoration:line-through;}

/* ── Upload ─── */
.pcams-upload-zone{border:2px dashed var(--p-border);border-radius:var(--p-radius-lg);padding:2.25rem 1.5rem;text-align:center;cursor:pointer;transition:var(--p-transition);background:var(--p-surface-2);}
.pcams-upload-zone:hover{border-color:var(--p-brand-light);background:#EEF3FC;}
.pcams-upload-zone i{font-size:2.2rem;color:var(--p-text-muted);margin-bottom:.65rem;display:block;}
.pcams-upload-zone p{margin:0;font-size:.82rem;color:var(--p-text-muted);line-height:1.5;}
.pcams-upload-zone .browse{color:var(--p-brand);font-weight:700;}

/* ── Consent ─── */
.pcams-consent-box{background:var(--p-surface-2);border:1px solid var(--p-border);border-radius:var(--p-radius);padding:1rem 1.25rem;font-size:.8rem;color:var(--p-text-secondary);line-height:1.75;max-height:170px;overflow-y:auto;margin-bottom:.85rem;scrollbar-width:thin;}

/* ── Endpoint checker ─── */
.pcams-ep-checker{border:1.5px solid var(--p-border);border-radius:var(--p-radius);overflow:hidden;margin-top:1.25rem;}
.pcams-ep-checker-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--p-surface-2);border-bottom:1px solid var(--p-border);gap:.75rem;flex-wrap:wrap;}
.pcams-ep-checker-title{display:flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:700;color:var(--p-text-secondary);}
.pcams-ep-dot{width:9px;height:9px;border-radius:50%;background:var(--p-border);flex-shrink:0;transition:background .3s;}
.pcams-ep-dot.checking{background:#F59E0B;animation:pcams-pulse .8s ease-in-out infinite;}
.pcams-ep-dot.valid{background:var(--p-success);}
.pcams-ep-dot.invalid{background:var(--p-danger);}
@keyframes pcams-pulse{0%,100%{opacity:1}50%{opacity:.35}}
.pcams-ep-checker-body{padding:.85rem 1rem;}
.pcams-ep-check-btn{background:var(--p-brand);border:none;color:#fff;padding:.45rem 1rem;border-radius:var(--p-radius-sm);font-size:.8rem;font-weight:700;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:.4rem;transition:var(--p-transition);white-space:nowrap;}
.pcams-ep-check-btn:hover:not(:disabled){background:var(--p-brand-dark);}
.pcams-ep-check-btn:disabled{opacity:.5;cursor:not-allowed;}
.pcams-ep-result{border-radius:var(--p-radius-sm);padding:.75rem 1rem;font-size:.82rem;margin-top:.65rem;display:none;border-left:4px solid;}
.pcams-ep-result.valid  {background:#ECFDF5;border-color:var(--p-success);color:#065F46;}
.pcams-ep-result.invalid{background:#FEF2F2;border-color:var(--p-danger);color:#7F1D1D;}
.pcams-ep-result.checking{background:#FFFBEB;border-color:#F59E0B;color:#78350F;display:block;}
.pcams-ep-result-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.3rem;font-size:.8rem;}
.pcams-ep-result-row:last-child{margin-bottom:0;}
.pcams-ep-result-label{font-weight:700;opacity:.7;}
.pcams-ep-result-value{font-weight:800;}
.pcams-validation-success{background:#ECFDF5;border:1.5px solid rgba(14,138,95,.25);border-radius:var(--p-radius);padding:1rem 1.1rem;margin-top:.75rem;display:flex;align-items:center;gap:.75rem;}
.pcams-validation-success i{font-size:1.3rem;color:var(--p-success);flex-shrink:0;}

/* ── PDF box ─── */
.pcams-pdf-box{background:#FEF3E2;border:1.5px solid rgba(200,155,42,.3);border-radius:var(--p-radius);padding:1rem 1.1rem;margin:1rem auto;max-width:460px;}
.pcams-pdf-box-title{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--p-warning);margin-bottom:.65rem;display:flex;align-items:center;gap:.4rem;}
.pcams-pdf-link-row{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid rgba(200,155,42,.2);border-radius:var(--p-radius-sm);padding:.5rem .75rem;margin-bottom:.45rem;}
.pcams-pdf-link-row i{color:#C0392B;font-size:1rem;flex-shrink:0;}
.pcams-pdf-link-row a{font-size:.8rem;font-weight:700;color:var(--p-brand);text-decoration:none;flex:1;}
.pcams-pdf-link-row a:hover{text-decoration:underline;}
.pcams-pdf-dl-btn{background:none;border:none;cursor:pointer;color:var(--p-text-muted);font-size:.85rem;padding:0 .2rem;transition:color .15s;}
.pcams-pdf-dl-btn:hover{color:var(--p-brand);}
.pcams-gravitypdf-wrap{flex:1;}
.pcams-gravitypdf-wrap a,.pcams-pdf-btn{color:var(--p-brand);font-size:.8rem;font-weight:700;text-decoration:none;}
.pcams-gravitypdf-wrap a:hover,.pcams-pdf-btn:hover{text-decoration:underline;}
.pcams-pdf-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem 1rem;background:linear-gradient(135deg,#C0392B,#A93226);color:#fff;border-radius:var(--p-radius-sm);text-decoration:none;transition:var(--p-transition);}
.pcams-pdf-btn:hover{opacity:.88;color:#fff;text-decoration:none;}

/* ── Success ─── */
.pcams-success{text-align:center;padding:2.5rem 2rem 2rem;}
.pcams-success-icon{width:80px;height:80px;background:linear-gradient(135deg,var(--p-success),#065F46);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;color:#fff;margin:0 auto 1.25rem;box-shadow:0 8px 24px rgba(14,138,95,.3);}
.pcams-success h2{font-size:1.4rem;font-weight:800;color:var(--p-text-primary);margin:0 0 .5rem;}
.pcams-success p{color:var(--p-text-secondary);font-size:.9rem;margin:0 0 1.25rem;}
.pcams-ref-badge{display:inline-block;background:var(--p-surface-2);border:1.5px dashed var(--p-border);border-radius:var(--p-radius);padding:.65rem 1.5rem;font-size:1.1rem;font-weight:800;color:var(--p-brand);letter-spacing:2px;margin-bottom:1.25rem;}
.pcams-next-steps{background:var(--p-surface-2);border-radius:var(--p-radius);padding:1rem 1.25rem;text-align:left;margin:0 auto 1.5rem;max-width:420px;}
.pcams-next-steps-title{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--p-text-muted);margin-bottom:.6rem;}
.pcams-next-step-item{font-size:.84rem;color:var(--p-text-secondary);padding:.3rem 0;display:flex;align-items:flex-start;gap:.5rem;}

/* ── Dept badge ─── */
.pcams-dept-badge{display:inline-block;padding:.18rem .6rem;border-radius:20px;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.35px;color:#fff;white-space:nowrap;}

/* ── Company search ─── */
.pcams-company-search-wrap{position:relative;}
.pcams-company-search-input-row{display:flex;gap:.5rem;align-items:center;}
.pcams-company-search-box{position:relative;flex:1;}
.pcams-company-search-icon{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:var(--p-text-placeholder);font-size:.9rem;pointer-events:none;}
.pcams-company-input{width:100%;padding:.7rem 2.1rem .7rem 2.6rem;border:1.5px solid var(--p-border);border-radius:var(--p-radius);font-size:.9rem;color:var(--p-text-primary);background:var(--p-surface);font-family:inherit;transition:var(--p-transition);}
.pcams-company-input:focus{outline:none;border-color:var(--p-brand-light);box-shadow:0 0 0 3px rgba(40,85,160,.12);}
.pcams-company-clear{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);color:var(--p-text-muted);cursor:pointer;font-size:.9rem;line-height:1;transition:color .15s;}
.pcams-company-clear:hover{color:var(--p-danger);}
.pcams-dept-filter{flex-shrink:0;width:170px;padding:.7rem 2.2rem .7rem .85rem;border:1.5px solid var(--p-border);border-radius:var(--p-radius);font-size:.82rem;color:var(--p-text-primary);background:var(--p-surface);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%237D889A' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85rem center;font-family:inherit;cursor:pointer;appearance:none;transition:var(--p-transition);}
.pcams-dept-filter:focus{outline:none;border-color:var(--p-brand-light);}
.pcams-company-dropdown{position:absolute;top:calc(100% + 5px);left:0;right:0;background:var(--p-surface);border:1.5px solid var(--p-border);border-radius:var(--p-radius-lg);box-shadow:var(--p-shadow-lg);z-index:1000;overflow:hidden;animation:pcams-dropdown-in .14s cubic-bezier(.16,1,.3,1);}
@keyframes pcams-dropdown-in{from{opacity:0;transform:translateY(-6px) scale(.99);}to{opacity:1;transform:none;}}
.pcams-company-dropdown-inner{max-height:300px;overflow-y:auto;scrollbar-width:thin;}
.pcams-company-result-item{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;cursor:pointer;transition:background .1s;border-bottom:1px solid #F3F5F8;}
.pcams-company-result-item:last-child{border-bottom:none;}
.pcams-company-result-item:hover,.pcams-company-result-item.highlighted{background:#F0F5FF;}
.pcams-company-result-item:focus{outline:2px solid var(--p-brand-light);outline-offset:-2px;}
.pcams-result-icon{width:36px;height:36px;border-radius:var(--p-radius-sm);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800;color:#fff;flex-shrink:0;}
.pcams-result-name{font-size:.86rem;font-weight:700;color:var(--p-text-primary);flex:1;}
.pcams-result-name mark{background:rgba(200,155,42,.2);color:var(--p-brand-dark);border-radius:2px;padding:0 1px;}
.pcams-company-empty{padding:1.75rem 1rem;text-align:center;color:var(--p-text-muted);font-size:.83rem;}
.pcams-company-empty i{font-size:1.8rem;display:block;margin-bottom:.5rem;opacity:.3;}
.pcams-company-loading{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;color:var(--p-text-muted);font-size:.83rem;}
.pcams-company-dropdown-footer{display:flex;align-items:center;justify-content:space-between;padding:.55rem 1rem;border-top:1px solid var(--p-border);background:var(--p-surface-2);}
.pcams-company-add-btn{background:none;border:none;cursor:pointer;color:var(--p-brand);font-size:.78rem;font-weight:700;font-family:inherit;display:flex;align-items:center;gap:.3rem;padding:0;transition:opacity .15s;}
.pcams-company-add-btn:hover{opacity:.75;}
.pcams-selected-company{margin-top:.75rem;border:1.5px solid rgba(14,138,95,.25);background:#ECFDF5;border-radius:var(--p-radius);animation:pcams-slide-up .18s ease;}
@keyframes pcams-slide-up{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.pcams-selected-company-inner{display:flex;align-items:center;gap:.85rem;padding:.85rem 1rem;}
.pcams-selected-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--p-success),#065F46);border-radius:var(--p-radius-sm);display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;flex-shrink:0;}
.pcams-selected-name{font-size:.9rem;font-weight:800;color:var(--p-text-primary);}
.pcams-selected-info{flex:1;min-width:0;}
.pcams-selected-actions{display:flex;gap:.4rem;}
.pcams-action-btn{background:var(--p-surface);border:1.5px solid var(--p-border);color:var(--p-text-secondary);padding:.3rem .7rem;border-radius:var(--p-radius-sm);font-size:.76rem;font-weight:700;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:.25rem;transition:var(--p-transition);}
.pcams-action-btn:hover{border-color:var(--p-brand-light);color:var(--p-brand);background:#F0F5FF;}

/* ── Drawer ─── */
.pcams-drawer-overlay{position:fixed;inset:0;background:rgba(10,15,30,.5);z-index:10000;opacity:0;pointer-events:none;transition:opacity .25s;backdrop-filter:blur(2px);}
.pcams-drawer-overlay.open{opacity:1;pointer-events:all;}
.pcams-drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,96vw);background:var(--p-surface);z-index:10001;display:flex;flex-direction:column;box-shadow:-12px 0 50px rgba(0,0,0,.15);transform:translateX(105%);transition:transform .28s cubic-bezier(.4,0,.2,1);}
.pcams-drawer.open{transform:translateX(0);}
.pcams-drawer-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.25rem 1rem;border-bottom:1px solid var(--p-border);background:var(--p-brand);}
.pcams-drawer-title{font-size:1rem;font-weight:800;color:#fff;display:flex;align-items:center;gap:.45rem;}
.pcams-drawer-close{background:rgba(255,255,255,.15);border:none;cursor:pointer;color:#fff;width:32px;height:32px;border-radius:var(--p-radius-sm);display:flex;align-items:center;justify-content:center;font-size:.9rem;transition:background .15s;}
.pcams-drawer-close:hover{background:rgba(255,255,255,.28);}
.pcams-drawer-body{flex:1;overflow-y:auto;padding:1.25rem;}
.pcams-drawer-footer{padding:1rem 1.25rem;border-top:1px solid var(--p-border);background:var(--p-surface-2);display:flex;justify-content:space-between;align-items:center;}
.pcams-drawer-id-row{display:flex;align-items:center;gap:.5rem;background:var(--p-surface-2);border-radius:var(--p-radius-sm);padding:.5rem .75rem;margin-bottom:1rem;font-size:.8rem;}
.pcams-drawer-id-label{color:var(--p-text-muted);font-weight:700;}
.pcams-drawer-id-val{font-family:monospace;font-weight:700;color:var(--p-brand);}
.pcams-drawer-alert{border-radius:var(--p-radius-sm);padding:.65rem .9rem;font-size:.82rem;font-weight:700;display:flex;align-items:center;gap:.45rem;margin-bottom:.85rem;border:1px solid;}
.pcams-drawer-alert.success{background:#ECFDF5;border-color:rgba(14,138,95,.3);color:#065F46;}
.pcams-drawer-alert.error{background:#FEF2F2;border-color:rgba(192,57,43,.3);color:#7F1D1D;}
.pcams-drawer-alert.info{background:#EFF6FF;border-color:rgba(27,58,107,.2);color:#1E407C;}

/* ── Responsive ─── */
@media(max-width:600px){
  .pcams-wrap{padding:1rem .75rem 2rem;}
  .pcams-card-body{padding:1.25rem 1.1rem;}
  .pcams-nav{padding:1rem 1.1rem;}
  .pcams-form-header h1{font-size:1.3rem;}
  .pcams-company-search-input-row{flex-wrap:wrap;}
  .pcams-dept-filter{width:100%;}
  .pcams-choices.cols-2{grid-template-columns:1fr;}
  .pcams-btn{padding:.65rem 1.1rem;font-size:.84rem;}
  .pcams-selected-company-inner{flex-wrap:wrap;}
}

/* ── Utility ─── */
.pcams-admin-only{display:none!important;}
.pcams-form-step{display:none;}
.pcams-form-step.active{display:block;}

/* ===== SECURE GATE STATES ===== */
/* is-invalid persists until field is corrected — does NOT auto-clear on timeout */
.pcams-input.is-invalid,
.pcams-select.is-invalid,
.form-control.is-invalid {
  border-color: var(--vz-danger);
  box-shadow: 0 0 0 3px rgba(240,101,72,.12);
}
.pcams-input.is-invalid:focus,
.form-control.is-invalid:focus {
  border-color: var(--vz-danger);
  box-shadow: 0 0 0 3px rgba(240,101,72,.18);
}

/* Spinner for buttons */
.pcams-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: pcams-spin .7s linear infinite;
  vertical-align: middle;
}
@keyframes pcams-spin { to { transform: rotate(360deg); } }

/* Proceed button — locked by default, visible only after server passes */
#pcams-api-proceed-btn[data-gate="locked"],
#pcams-api-submit-btn[data-gate="locked"]:disabled {
  cursor: not-allowed;
  opacity: .65;
}

/* Hard block error box emphasis */
.check-result.invalid .check-result-value[style*="f06548"] {
  letter-spacing: .3px;
}

/* ===== FINGERPRINT BUTTON LOADER ===== */
.pcams-fp-btn-wrap {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  justify-content: center;
}
.pcams-fp-mini {
  width: 22px;
  height: 24px;
  flex-shrink: 0;
  overflow: visible;
  filter: drop-shadow(0 0 3px rgba(53,119,241,.5));
}
.pcams-fp-scan-line {
  animation: fpMiniScan 1.1s ease-in-out infinite;
  transform-origin: center;
  opacity: .9;
}
@keyframes fpMiniScan {
  0%,100% { transform: translateY(0px);   opacity: 0; }
  5%       { opacity: 1; }
  50%      { transform: translateY(64px); opacity: 1; }
  95%      { opacity: 1; }
}
.pcams-fp-btn-text {
  font-size: .82rem;
  font-weight: 700;
}
/* Pulse glow on the verify button while scanning */
#pcams-ep-check-btn:has(.pcams-fp-mini) {
  box-shadow: 0 0 0 0 rgba(53,119,241,.4);
  animation: fpBtnPulse 1.1s ease-in-out infinite;
}
@keyframes fpBtnPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(53,119,241,.3); }
  50%      { box-shadow: 0 0 0 8px rgba(53,119,241,.0); }
}

/* ═══════════════════════════════════════════════════════════════
   FINGERPRINT BUTTON LOADER — inline scanner on Verify Payment
   ═══════════════════════════════════════════════════════════════ */
.pcams-fp-btn-wrap {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
}
.pcams-fp-mini {
  width: 26px;
  height: 28px;
  flex-shrink: 0;
  overflow: visible;
  animation: fpMiniSpin 2.4s ease-in-out infinite;
}
@keyframes fpMiniSpin {
  0%,100% { opacity: .5; transform: scale(.92); }
  50%      { opacity: 1;  transform: scale(1);   }
}
.pcams-fp-scan-line {
  animation: fpScanMove 1.6s ease-in-out infinite;
  stroke: rgba(53,119,241,.75);
  filter: drop-shadow(0 0 3px rgba(53,119,241,.6));
}
@keyframes fpScanMove {
  0%   { transform: translateY(0px);  opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateY(64px); opacity: 0; }
}
.pcams-fp-btn-text {
  font-weight: 700;
  letter-spacing: .2px;
}

/* Verify Payment button pulse while scanning */
#pcams-ep-check-btn:disabled .pcams-fp-btn-wrap {
  animation: verifyPulse 1.4s ease-in-out infinite;
}
@keyframes verifyPulse {
  0%,100% { opacity: .85; }
  50%     { opacity: 1;   }
}

/* ═══════════════════════════════════════════════════════════════════
   PCAMS Fingerprint Loading Overlay
   ═══════════════════════════════════════════════════════════════════ */
#pcams-fp-overlay {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .2s;
  pointer-events: none;
}
#pcams-fp-overlay.pcams-fp-ov-in  { opacity: 1; pointer-events: all; }
#pcams-fp-overlay.pcams-fp-ov-out { opacity: 0; pointer-events: none; }

.pcams-fp-ov-backdrop {
  position: absolute; inset: 0;
  background: rgba(10,15,30,.82);
  backdrop-filter: blur(4px);
}
.pcams-fp-ov-card {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 1.25rem;
  padding: 2.5rem;
  background: #0d1426;
  border: 1px solid rgba(53,119,241,.25);
  border-radius: 20px;
  box-shadow: 0 0 60px rgba(53,119,241,.2), 0 20px 40px rgba(0,0,0,.4);
  animation: ovCardIn .22s ease;
}
@keyframes ovCardIn {
  from { transform: scale(.88); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}
.pcams-fp-ov-frame {
  position: relative;
  width: 160px; height: 160px;
  display: flex; align-items: center; justify-content: center;
}
/* Corners */
.pcams-fp-ov-corner {
  position: absolute; width: 18px; height: 18px;
  border-color: #3577f1; border-style: solid;
  transition: border-color .4s;
}
.pcams-fp-ov-tl{top:0;left:0;border-width:2px 0 0 2px;}
.pcams-fp-ov-tr{top:0;right:0;border-width:2px 2px 0 0;}
.pcams-fp-ov-bl{bottom:0;left:0;border-width:0 0 2px 2px;}
.pcams-fp-ov-br{bottom:0;right:0;border-width:0 2px 2px 0;}

/* Scanline */
.pcams-fp-ov-scanline {
  position: absolute; left: 6px; right: 6px; height: 2px;
  background: linear-gradient(90deg,transparent,rgba(53,119,241,.8),transparent);
  box-shadow: 0 0 8px 2px rgba(53,119,241,.4);
  animation: ovScan 1.4s ease-in-out infinite;
}
@keyframes ovScan {
  0%,100%{top:6px;opacity:0.2} 5%{opacity:1} 95%{opacity:1} 50%{top:calc(100% - 8px)}
}
/* SVG */
.pcams-fp-ov-svg {
  width: 150px; height: 168px;
  filter: drop-shadow(0 0 6px rgba(53,119,241,.4));
}
.pcams-fp-ov-core { animation: ovCore 2s ease-in-out infinite; }
@keyframes ovCore { 0%,100%{opacity:.6} 50%{opacity:1} }

/* Pulse rings */
.pcams-fp-ov-pulse {
  position: absolute; inset: 16px;
  border-radius: 50%; border: 1.5px solid #3577f1;
  opacity: 0; animation: ovPulse 2.4s ease-out infinite;
}
.pcams-fp-ov-pulse.p2 { animation-delay: 1.2s; }
@keyframes ovPulse {
  0%{transform:scale(.6);opacity:0} 40%{opacity:.3} 100%{transform:scale(1.25);opacity:0}
}
/* Status text */
.pcams-fp-ov-status {
  color: rgba(255,255,255,.7);
  font-family: 'Nunito',sans-serif;
  font-size: .8rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  text-align: center;
  animation: ovTextBlip 1.4s ease-in-out infinite alternate;
}
@keyframes ovTextBlip { to { opacity: .45; } }

/* Verified state */
#pcams-fp-overlay.pcams-fp-ov-verified .pcams-fp-ov-corner { border-color: #0ab39c; }
#pcams-fp-overlay.pcams-fp-ov-verified .pcams-fp-ov-status {
  color: #0ab39c; animation: none; opacity: 1;
}
#pcams-fp-overlay.pcams-fp-ov-verified .pcams-fp-ov-svg {
  filter: drop-shadow(0 0 12px rgba(10,179,156,.6));
}
#pcams-fp-overlay.pcams-fp-ov-verified .pcams-fp-ov-card {
  border-color: rgba(10,179,156,.35);
  box-shadow: 0 0 40px rgba(10,179,156,.2),0 20px 40px rgba(0,0,0,.4);
}
/* Failed state */
#pcams-fp-overlay.pcams-fp-ov-failed .pcams-fp-ov-corner { border-color: #f06548; }
#pcams-fp-overlay.pcams-fp-ov-failed .pcams-fp-ov-status {
  color: #f06548; animation: none; opacity: 1;
}
#pcams-fp-overlay.pcams-fp-ov-failed .pcams-fp-ov-svg {
  animation: failShake .4s ease;
  filter: drop-shadow(0 0 12px rgba(240,101,72,.5));
}
#pcams-fp-overlay.pcams-fp-ov-failed .pcams-fp-ov-card {
  border-color: rgba(240,101,72,.35);
}
@keyframes failShake {
  0%,100%{transform:translateX(0)} 20%,60%{transform:translateX(-5px)} 40%,80%{transform:translateX(5px)}
}

/* Prefilled fields from TAJ validation — locked but visually clear */
.pcams-prefilled.pcams-choice,
.pcams-choice.pcams-prefilled {
  border-color: rgba(10,179,156,.45) !important;
  background: rgba(10,179,156,.06) !important;
  cursor: default;
}
.pcams-prefilled .pcams-choice-title { color: #076e5e !important; font-weight:700; }

/* ── Appointment Calendar ────────────────────────────────────── */
.pcams-appt-cal{background:#fff;border:1.5px solid #e9ebec;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.pcams-cal-header{display:flex;align-items:center;justify-content:space-between;padding:.7rem 1rem;background:#405189;color:#fff}
.pcams-cal-title{font-weight:800;font-size:.9rem}
.pcams-cal-nav{background:rgba(255,255,255,.2);border:none;color:#fff;width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:1.1rem;font-weight:700;line-height:1;transition:.15s}
.pcams-cal-nav:hover{background:rgba(255,255,255,.35)}
.pcams-cal-days-head{display:grid;grid-template-columns:repeat(7,1fr);background:#f8f9fa;padding:.35rem .5rem 0}
.pcams-cal-days-head span{text-align:center;font-size:.68rem;font-weight:800;color:#878a99;text-transform:uppercase;padding:.2rem 0}
.pcams-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;padding:.4rem .5rem .5rem}
.cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;transition:.15s;border:2px solid transparent;font-size:.82rem;font-weight:700;color:#495057;position:relative;gap:1px}
.cal-day:hover:not(.cal-empty):not(.cal-unavailable){background:#f0f4ff;border-color:#405189}
.cal-day.cal-empty,.cal-day.cal-unavailable{cursor:default;color:#ced4da;background:none}
.cal-day.cal-unavailable{background:#f8f9fa}
.cal-day.cal-selected{background:#405189;color:#fff;border-color:#405189}
.cal-day.cal-selected:hover{background:#2d3a6d}
.cal-dot-wrap{display:flex;justify-content:center}
.cal-dot{width:6px;height:6px;border-radius:50%;display:inline-block}
.cal-dot.green,.cal-dot-wrap .green{background:#0ab39c}
.cal-dot.amber,.cal-dot-wrap .amber{background:#f7b84b}
.cal-dot.red,.cal-dot-wrap .red{background:#f06548}
.cal-dot.grey,.cal-dot-wrap .grey{background:#ced4da}
.pcams-cal-legend{display:flex;gap:.75rem;padding:.4rem .75rem .6rem;background:#f8f9fa;flex-wrap:wrap}
.pcams-cal-legend span{display:flex;align-items:center;gap:.3rem;font-size:.68rem;color:#6c757d;font-weight:600}
/* Time slots grid */
.pcams-slot-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.45rem .75rem;border:1.5px solid #e9ebec;border-radius:8px;background:#fff;cursor:pointer;font-size:.82rem;font-weight:700;color:#495057;transition:.2s;margin-bottom:.3rem;gap:.5rem}
.pcams-slot-btn:hover:not(.slot-full){border-color:#405189;background:#f0f4ff}
.pcams-slot-btn.selected{border-color:#0ab39c;background:rgba(10,179,156,.08);color:#076e5e}
.pcams-slot-btn.slot-full{cursor:not-allowed;opacity:.5;background:#f8f9fa;text-decoration:line-through}
.slot-cap{font-size:.68rem;font-weight:700;padding:.1rem .4rem;border-radius:20px;white-space:nowrap}
.slot-cap.many{background:rgba(10,179,156,.1);color:#076e5e}
.slot-cap.few{background:rgba(247,184,75,.15);color:#8a6b00}
.slot-cap.one{background:rgba(240,101,72,.1);color:#b83e26}
.slot-cap.none{background:#f1f3f5;color:#adb5bd}

/* ── Photo Editor ─────────────────────────────────────────────── */
.pcams-editor-btn{padding:.38rem .8rem;border:1.5px solid #e9ebec;border-radius:7px;background:#fff;cursor:pointer;font-size:.78rem;font-weight:700;color:#405189;transition:.15s}
.pcams-editor-btn:hover{background:#f0f4ff;border-color:#405189}
.pcams-editor-btn-accent{background:rgba(53,119,241,.07);border-color:#3577f1;color:#2a5bc4}
.pcams-editor-btn-accent:hover{background:rgba(53,119,241,.14)}
.pcams-photo-upload-block .pcams-upload-zone{transition:.2s}

/* ── 2FA Login Screen ───────────────────────────────────────────────────────── */
@keyframes pcamsFadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pcamsShake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}

.pcams-2fa-screen{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:2rem 1.5rem;animation:pcamsFadeIn .35s ease;
}
.pcams-2fa-icon{
  width:80px;height:80px;border-radius:50%;
  background:linear-gradient(135deg,rgba(53,119,241,.12),rgba(64,81,137,.08));
  border:2px solid rgba(53,119,241,.25);
  display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem;
}
.pcams-2fa-title{font-size:1.25rem;font-weight:800;color:#2a3a6d;margin:0 0 .5rem}
.pcams-2fa-desc{font-size:.88rem;color:#6c757d;margin:0 0 1.5rem;line-height:1.6}
.pcams-2fa-desc strong{color:#2a3a6d;font-weight:700}

/* 6-digit OTP boxes */
.pcams-otp-boxes{display:flex;gap:.45rem;align-items:center;justify-content:center;margin:.25rem 0}
.pcams-otp-digit{
  width:48px;height:58px;text-align:center;font-size:1.5rem;font-weight:800;
  border:2px solid #e2e8f0;border-radius:10px;background:#f8faff;color:#2a3a6d;
  outline:none;transition:all .18s;caret-color:transparent;
}
.pcams-otp-digit:focus{border-color:#3577f1;background:#fff;box-shadow:0 0 0 4px rgba(53,119,241,.12);transform:scale(1.05)}
.pcams-otp-digit.filled{border-color:#405189;background:#f0f4ff}
.pcams-otp-digit.error{border-color:#f06548;background:#fff5f3;animation:pcamsShake .35s ease}
.pcams-otp-sep{font-size:1.2rem;color:#ced4da;font-weight:700;margin:0 .15rem}

.pcams-2fa-footer{
  display:flex;align-items:center;gap:.75rem;margin-top:1.25rem;
  font-size:.82rem;flex-wrap:wrap;justify-content:center;width:100%;
}
.pcams-2fa-footer button,.pcams-2fa-footer .pcams-auth-link{
  color:#3577f1;font-weight:600;text-decoration:none;border:none;
  background:none;cursor:pointer;padding:0;font-size:.82rem;
  transition:color .15s;
}
.pcams-2fa-footer button:hover{color:#2a5bc4;text-decoration:underline}

/* OTP timer badge */
#pcams-login-otp-timer{
  display:inline-flex;align-items:center;gap:.3rem;
  background:#f8f9fa;border:1px solid #e9ebec;border-radius:20px;
  padding:.2rem .65rem;font-size:.75rem;font-weight:600;color:#6c757d;
}

/* Auth page — full screen split layout (login + register) */
.pcams-auth-page{min-height:100vh;display:flex;align-items:stretch;position:relative;overflow:hidden;background:#0e1628}
.pcams-auth-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.pcams-auth-bg-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(53,119,241,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(53,119,241,.05) 1px,transparent 1px);
  background-size:40px 40px;
}
.pcams-auth-bg-glow{position:absolute;border-radius:50%;filter:blur(80px);opacity:.35}
.pcams-auth-bg-glow-1{width:500px;height:500px;background:radial-gradient(circle,#3577f1,transparent 70%);top:-100px;left:-100px}
.pcams-auth-bg-glow-2{width:400px;height:400px;background:radial-gradient(circle,#405189,transparent 70%);bottom:-80px;right:10%}

.pcams-auth-wrap{display:flex;width:100%;min-height:100vh;z-index:1;position:relative}

/* Left brand panel */
.pcams-auth-brand{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:3rem 2.5rem;background:rgba(255,255,255,.02);
  border-right:1px solid rgba(255,255,255,.06);
}
.pcams-brand-inner{display:flex;flex-direction:column;align-items:center;gap:2rem;max-width:360px;width:100%}
.pcams-brand-logo{display:flex;align-items:center;gap:.85rem}
.pcams-brand-logo-icon{width:48px;height:48px;flex-shrink:0}
.pcams-brand-name{font-size:1.5rem;font-weight:900;color:#fff;letter-spacing:.5px}
.pcams-brand-tagline{font-size:.72rem;color:rgba(255,255,255,.45);font-weight:500;margin-top:.1rem;line-height:1.4}
.pcams-brand-footer{text-align:center;margin-top:auto}
.pcams-brand-org{font-size:.85rem;font-weight:700;color:rgba(255,255,255,.8)}
.pcams-brand-sub{font-size:.72rem;color:rgba(255,255,255,.35);margin-top:.2rem}

/* Fingerprint scanner */
.pcams-fp-scanner{display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%}
.pcams-fp-frame{
  position:relative;width:220px;height:220px;display:flex;align-items:center;justify-content:center;
  --fp-color-1:#3577f1;--fp-color-2:#405189;
}
.pcams-fp-corner{position:absolute;width:28px;height:28px;border-color:var(--fp-color-1);border-style:solid;transition:border-color .4s,opacity .4s}
.pcams-fp-corner-tl{top:0;left:0;border-width:3px 0 0 3px;border-radius:4px 0 0 0}
.pcams-fp-corner-tr{top:0;right:0;border-width:3px 3px 0 0;border-radius:0 4px 0 0}
.pcams-fp-corner-bl{bottom:0;left:0;border-width:0 0 3px 3px;border-radius:0 0 0 4px}
.pcams-fp-corner-br{bottom:0;right:0;border-width:0 3px 3px 0;border-radius:0 0 4px 0}
.pcams-fp-scanline{
  position:absolute;left:12px;right:12px;height:2px;
  background:linear-gradient(90deg,transparent,rgba(53,119,241,.9),transparent);
  box-shadow:0 0 12px 3px rgba(53,119,241,.35);
  animation:fpScan 2.2s ease-in-out infinite;top:12px;
}
@keyframes fpScan{0%{top:12px;opacity:0}5%{opacity:1}95%{opacity:1}100%{top:calc(100% - 14px);opacity:0}}
.pcams-fp-svg{width:200px;height:220px;filter:drop-shadow(0 0 12px rgba(53,119,241,.3))}
.pcams-fp-ridges{animation:fpRidge 2.5s ease-in-out infinite alternate}
@keyframes fpRidge{from{opacity:.55}to{opacity:1}}
.pcams-fp-core{animation:fpCore 2s ease-in-out infinite}
@keyframes fpCore{0%,100%{opacity:.5;r:3}50%{opacity:1;r:4.5}}
.pcams-fp-pulse{position:absolute;border-radius:50%;border:1.5px solid rgba(53,119,241,.3);animation:fpPulse 3s ease-out infinite}
.pcams-fp-pulse-1{inset:25px}
.pcams-fp-pulse-2{inset:25px;animation-delay:1.2s}
@keyframes fpPulse{0%{transform:scale(.7);opacity:0}40%{opacity:.5}100%{transform:scale(1.5);opacity:0}}
.pcams-fp-check{transition:opacity .4s}
.pcams-fp-fail{transition:opacity .4s}

/* Scanner states */
.pcams-fp-scanner.scanning .pcams-fp-corner{border-color:#f7b84b;animation:fpCornerPulse .8s ease-in-out infinite alternate}
.pcams-fp-scanner.verified .pcams-fp-corner{border-color:#0ab39c}
.pcams-fp-scanner.verified .pcams-fp-check{opacity:1!important}
.pcams-fp-scanner.verified .pcams-fp-scanline{display:none}
.pcams-fp-scanner.failed  .pcams-fp-corner{border-color:#f06548}
.pcams-fp-scanner.failed  .pcams-fp-fail{opacity:1!important}
.pcams-fp-scanner.failed  .pcams-fp-scanline{display:none}
@keyframes fpCornerPulse{from{opacity:.6}to{opacity:1}}

.pcams-fp-status{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:rgba(255,255,255,.6);font-weight:600;letter-spacing:.2px}
.pcams-fp-status-dot{width:8px;height:8px;border-radius:50%;background:#3577f1;flex-shrink:0;animation:fpDot 1.6s ease-in-out infinite}
@keyframes fpDot{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.4);opacity:1}}
.pcams-fp-scanner.verified .pcams-fp-status-dot{background:#0ab39c;animation:none}
.pcams-fp-scanner.failed   .pcams-fp-status-dot{background:#f06548;animation:none}

/* Right form panel */
.pcams-auth-form-panel{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:2.5rem;background:#fff;
}
.pcams-auth-form-inner{width:100%;max-width:420px}
.pcams-auth-form-header{margin-bottom:2rem}
.pcams-auth-title{font-size:1.75rem;font-weight:900;color:#1a2640;margin:0 0 .35rem;letter-spacing:-.3px}
.pcams-auth-subtitle{font-size:.9rem;color:#6c757d;margin:0}

/* Form elements */
.pcams-auth-field{margin-bottom:1.1rem}
.pcams-auth-label{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:700;color:#374151;margin-bottom:.45rem;text-transform:uppercase;letter-spacing:.4px}
.pcams-auth-input{
  width:100%;padding:.75rem 1rem;border:2px solid #e5e7eb;border-radius:10px;
  font-size:.9rem;color:#1a2640;background:#fafbfc;
  outline:none;transition:all .2s;box-sizing:border-box;
}
.pcams-auth-input:focus{border-color:#3577f1;background:#fff;box-shadow:0 0 0 4px rgba(53,119,241,.1)}
.pcams-auth-input:valid:not(:placeholder-shown){border-color:#0ab39c}

.pcams-auth-input-wrap{position:relative}
.pcams-auth-input-wrap .pcams-auth-input{padding-right:2.8rem}
.pcams-auth-eye{
  position:absolute;right:.75rem;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;color:#9ca3af;padding:.2rem;line-height:0;
  transition:color .15s;
}
.pcams-auth-eye:hover{color:#374151}

.pcams-auth-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem}
.pcams-auth-check{display:flex;align-items:center;gap:.5rem;font-size:.83rem;color:#374151;cursor:pointer;font-weight:600}
.pcams-auth-check input{width:16px;height:16px;accent-color:#3577f1;cursor:pointer}

/* Buttons */
.pcams-auth-btn{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  width:100%;padding:.85rem 1.25rem;border:none;border-radius:10px;
  background:linear-gradient(135deg,#405189,#3577f1);color:#fff;
  font-size:.92rem;font-weight:800;cursor:pointer;letter-spacing:.2px;
  text-decoration:none;transition:all .2s;box-shadow:0 4px 14px rgba(53,119,241,.3);
}
.pcams-auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px rgba(53,119,241,.4)}
.pcams-auth-btn:active{transform:translateY(0)}
.pcams-auth-btn:disabled{opacity:.65;cursor:not-allowed;transform:none}
.pcams-auth-btn-outline{
  background:#fff;color:#405189;border:2px solid #e5e7eb;box-shadow:none;margin-top:.75rem;
}
.pcams-auth-btn-outline:hover:not(:disabled){background:#f0f4ff;border-color:#3577f1}
.pcams-auth-btn-spinner{
  width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;
  border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0;
}
.pcams-auth-btn-arrow{transition:transform .2s}
.pcams-auth-btn:hover .pcams-auth-btn-arrow{transform:translateX(3px)}

/* Alerts */
.pcams-auth-alert{
  display:flex;align-items:flex-start;gap:.6rem;padding:.75rem 1rem;
  border-radius:10px;font-size:.83rem;font-weight:600;margin-bottom:1.1rem;
}
.pcams-auth-alert-error{background:rgba(240,101,72,.08);border:1.5px solid rgba(240,101,72,.25);color:#b83e26}
.pcams-auth-alert-success{background:rgba(10,179,156,.08);border:1.5px solid rgba(10,179,156,.3);color:#076e5e}
.pcams-auth-alert-info{background:rgba(53,119,241,.07);border:1.5px solid rgba(53,119,241,.2);color:#2a5bc4}

/* Divider + links */
.pcams-auth-divider{display:flex;align-items:center;gap:.75rem;margin:1.25rem 0;color:#9ca3af;font-size:.8rem;font-weight:600}
.pcams-auth-divider::before,.pcams-auth-divider::after{content:'';flex:1;height:1px;background:#e5e7eb}
.pcams-auth-link{color:#3577f1;font-weight:600;text-decoration:none;font-size:.83rem;transition:color .15s}
.pcams-auth-link:hover{color:#2a5bc4;text-decoration:underline}
.pcams-auth-legal{font-size:.75rem;color:#9ca3af;text-align:center;margin-top:1.25rem;line-height:1.6}
.pcams-reset-link{font-size:.82rem}

/* Step indicators for register flow */
.pcams-auth-steps{display:flex;gap:.5rem;margin-bottom:2rem;justify-content:center}
.pcams-auth-step-dot{
  width:8px;height:8px;border-radius:50%;background:#e5e7eb;transition:.3s;
}
.pcams-auth-step-dot.active{width:24px;border-radius:4px;background:#3577f1}
.pcams-auth-step-dot.done{background:#0ab39c}

/* Responsive — stack on mobile */
@media(max-width:768px){
  .pcams-auth-wrap{flex-direction:column}
  .pcams-auth-brand{
    padding:2rem 1.5rem 1.5rem;border-right:none;
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .pcams-fp-frame{width:160px;height:160px}
  .pcams-fp-svg{width:150px;height:165px}
  .pcams-auth-form-panel{padding:1.75rem 1.25rem}
  .pcams-otp-digit{width:40px;height:50px;font-size:1.25rem}
  .pcams-brand-logo{flex-direction:column;text-align:center;gap:.5rem}
}
@media(max-width:400px){
  .pcams-otp-digit{width:34px;height:44px;font-size:1.1rem;border-radius:8px}
  .pcams-otp-sep{display:none}
}

/* ── Review Step Cards ───────────────────────────────────────────────────── */
.pcams-review-card{background:#fff;border:1.5px solid #e9ebec;border-radius:10px;overflow:hidden;transition:box-shadow .18s}
.pcams-review-card:hover{box-shadow:0 2px 12px rgba(64,81,137,.08)}
.pcams-review-card-header{display:flex;align-items:center;justify-content:space-between;padding:.65rem 1rem;background:#f8f9ff;border-bottom:1px solid #e9ebec}
.pcams-review-card-title{font-size:.85rem;font-weight:800;color:#2a3a6d;display:flex;align-items:center;gap:.45rem}
.pcams-review-edit-btn{padding:.3rem .85rem;border:1.5px solid #3577f1;border-radius:7px;background:#fff;color:#3577f1;font-size:.78rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:.35rem;transition:.15s}
.pcams-review-edit-btn:hover{background:#f0f4ff}
.pcams-review-card-body{padding:.75rem 1rem;display:grid;grid-template-columns:1fr 1fr;gap:.3rem .75rem}
.pcams-rv-row{display:contents}
.pcams-rv-label{font-size:.75rem;font-weight:700;color:#878a99;text-transform:uppercase;letter-spacing:.3px;align-self:center;padding:.25rem 0}
.pcams-rv-value{font-size:.85rem;color:#1a2640;font-weight:600;align-self:center;padding:.25rem 0;word-break:break-word}
@media(max-width:600px){
  .pcams-review-card-body{grid-template-columns:1fr}
  .pcams-rv-row{display:flex;flex-direction:column;gap:.05rem;padding:.2rem 0;border-bottom:1px solid #f1f3f5}
  .pcams-rv-label{padding:0}
  .pcams-rv-value{padding:0}
}

/* Clickable step label hover */
.pcams-step-lbl[style*="pointer"]:hover{color:#405189;font-weight:700}

/* ── Success Screen — Modern ───────────────────────────────────────────────── */
.pcams-success-wrap{
  position:relative;display:flex;flex-direction:column;align-items:center;
  padding:3rem 2rem 2.5rem;text-align:center;overflow:hidden;
  background:linear-gradient(160deg,#f8f9ff 0%,#fff 60%);
  border-radius:12px;
}

/* Animated burst rings */
.pcams-success-burst{position:absolute;top:0;left:50%;transform:translateX(-50%);pointer-events:none}
.burst-ring{position:absolute;border-radius:50%;left:50%;top:0;transform:translate(-50%,-50%);border:2px solid rgba(10,179,156,.25);animation:burstExpand 2.4s ease-out forwards}
.burst-ring-1{width:120px;height:120px;animation-delay:.1s}
.burst-ring-2{width:200px;height:200px;animation-delay:.35s;border-color:rgba(10,179,156,.15)}
.burst-ring-3{width:300px;height:300px;animation-delay:.6s;border-color:rgba(10,179,156,.08)}
@keyframes burstExpand{0%{transform:translate(-50%,-50%) scale(.2);opacity:.8}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}

/* Animated check path */
.pcams-check-path{stroke-dasharray:40;stroke-dashoffset:40;animation:drawCheck .5s ease .3s forwards}
@keyframes drawCheck{to{stroke-dashoffset:0}}

.pcams-success-check{position:relative;z-index:1;margin-bottom:1.25rem;animation:popIn .5s cubic-bezier(.34,1.56,.64,1) both}
@keyframes popIn{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}

.pcams-success-title{
  font-size:1.75rem;font-weight:900;color:#1a2640;margin:0 0 .5rem;
  letter-spacing:-.4px;animation:fadeUp .4s ease .4s both;
}
.pcams-success-sub{
  font-size:.95rem;color:#6c757d;margin:0 0 1.5rem;max-width:420px;line-height:1.6;
  animation:fadeUp .4s ease .5s both;
}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Appointment box */
.pcams-success-appt-box{
  display:flex;align-items:center;gap:.6rem;
  background:rgba(64,81,137,.06);border:1.5px solid rgba(64,81,137,.15);
  border-radius:10px;padding:.7rem 1.25rem;margin-bottom:1rem;
  font-size:.9rem;font-weight:700;color:#405189;
  animation:fadeUp .4s ease .55s both;
}
.pcams-success-appt-box .bi{font-size:1.1rem;flex-shrink:0}

/* Reference row */
.pcams-success-ref-row{
  display:flex;align-items:center;justify-content:center;gap:.75rem;
  flex-wrap:wrap;animation:fadeUp .4s ease .65s both;
}
.pcams-success-ref-badge{
  display:flex;flex-direction:column;align-items:center;
  background:linear-gradient(135deg,#405189,#2e3b6e);
  color:#fff;border-radius:12px;padding:.85rem 1.5rem;
  box-shadow:0 6px 20px rgba(64,81,137,.35);
}
.pcams-success-ref-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;opacity:.75;margin-bottom:.2rem}
.pcams-success-ref-id{font-size:1.4rem;font-weight:900;letter-spacing:1px}

/* PDF download button in success */
#pcams-pdf-links a{
  display:inline-flex;align-items:center;gap:.5rem;
  background:#0ab39c;color:#fff;border-radius:10px;
  padding:.85rem 1.5rem;font-weight:800;font-size:.92rem;
  text-decoration:none;box-shadow:0 6px 18px rgba(10,179,156,.35);
  transition:.2s;
}
#pcams-pdf-links a:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(10,179,156,.45)}

/* ── Top bar (logout strip) ─────────────────────────────────────────────────── */
.pcams-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:.55rem 1.25rem;
  background:#f8f9ff;
  border-bottom:1px solid rgba(64,81,137,.1);
  border-radius:12px 12px 0 0;
  margin-bottom:-1px;
}
.pcams-topbar-user{display:flex;align-items:center;gap:.5rem}
.pcams-topbar-avatar{
  width:28px;height:28px;border-radius:50%;
  background:linear-gradient(135deg,#405189,#3577f1);
  color:#fff;font-size:.75rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.pcams-topbar-name{font-size:.82rem;font-weight:700;color:#374151}
.pcams-topbar-logout{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.3rem .85rem;border-radius:7px;
  border:1.5px solid rgba(240,101,72,.25);
  background:rgba(240,101,72,.05);
  color:#b83e26;font-size:.78rem;font-weight:700;
  text-decoration:none;cursor:pointer;transition:.15s;
}
.pcams-topbar-logout:hover{background:rgba(240,101,72,.12);border-color:#f06548;color:#f06548}

/* ══════════════════════════════════════════════════════════════════════════════
   VELZON DESIGN SYSTEM — Profile, Topbar, Biometric
   All tokens match .pcams-wrap variables above.
══════════════════════════════════════════════════════════════════════════════ */

/* ── Shared Velzon components ──────────────────────────────────────────────── */
.vz-card{background:#fff;border:1px solid #e9ebec;border-radius:var(--p-radius,10px);box-shadow:0 1px 3px rgba(0,0,0,.05);overflow:hidden;margin-bottom:1.25rem}
.vz-card-header{padding:1.25rem 1.5rem .75rem;border-bottom:1px solid #f3f6f9}
.vz-card-title{font-size:.95rem;font-weight:800;color:#1a2640;margin:0 0 .2rem;display:flex;align-items:center}
.vz-card-subtitle{font-size:.8rem;color:#878a99;margin:0}
.vz-card-footer{padding:.85rem 1.5rem;border-top:1px solid #f3f6f9;background:#fafbfd}
.vz-form-grid{padding:1.25rem 1.5rem;display:grid;grid-template-columns:1fr 1fr;gap:.85rem 1.25rem}
@media(max-width:560px){.vz-form-grid{grid-template-columns:1fr}}
.vz-form-group{display:flex;flex-direction:column;gap:.3rem}
.vz-label{font-size:.73rem;font-weight:700;color:#495057;text-transform:uppercase;letter-spacing:.45px}
.vz-input{padding:.6rem .9rem;border:1.5px solid #e9ebec;border-radius:var(--p-radius-sm,6px);font-size:.88rem;color:#1a2640;background:#fff;outline:none;transition:.18s;width:100%}
.vz-input:focus{border-color:#405189;box-shadow:0 0 0 3px rgba(64,81,137,.12)}
.vz-input-disabled,.vz-input:disabled{background:#f8f9fa;cursor:not-allowed;opacity:.7}
.vz-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.25rem;border-radius:var(--p-radius-sm,6px);font-size:.85rem;font-weight:700;cursor:pointer;border:1.5px solid transparent;transition:.18s;text-decoration:none}
.vz-btn:disabled{opacity:.6;cursor:not-allowed}
.vz-btn-primary{background:#405189;color:#fff;border-color:#405189;box-shadow:0 2px 8px rgba(64,81,137,.25)}
.vz-btn-primary:hover:not(:disabled){background:#2e3b6e;border-color:#2e3b6e}
.vz-btn-sm{padding:.38rem .9rem;font-size:.8rem}
.vz-btn-outline-danger{background:transparent;color:#f06548;border-color:rgba(240,101,72,.35)}
.vz-btn-outline-danger:hover:not(:disabled){background:rgba(240,101,72,.08);border-color:#f06548}
.vz-badge{display:inline-flex;align-items:center;padding:.18rem .55rem;border-radius:4px;font-size:.72rem;font-weight:700;vertical-align:middle}
.vz-badge-soft-primary{background:rgba(64,81,137,.1);color:#405189}
.vz-badge-soft-success{background:rgba(10,179,156,.1);color:#076e5e}
.vz-badge-soft-secondary{background:#f3f6f9;color:#6c757d}
.vz-alert{padding:.7rem 1rem;border-radius:var(--p-radius-sm);font-size:.83rem;font-weight:600;margin:0 1.5rem .75rem}
.vz-alert-success{background:rgba(10,179,156,.08);border:1px solid rgba(10,179,156,.3);color:#076e5e}
.vz-alert-danger{background:rgba(240,101,72,.07);border:1px solid rgba(240,101,72,.25);color:#b83e26}
.vz-spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;display:inline-block;flex-shrink:0}

/* ── Profile hero ────────────────────────────────────────────────────────── */
.pcams-profile-wrap{max-width:700px!important;padding-top:0!important}
.vz-profile-hero{background:#fff;border:1px solid #e9ebec;border-radius:var(--p-radius,10px);box-shadow:0 1px 3px rgba(0,0,0,.05);overflow:hidden;margin-bottom:1.25rem}
.vz-profile-hero-cover{height:90px;background:linear-gradient(135deg,#405189 0%,#3577f1 60%,#0ab39c 100%)}
.vz-profile-hero-body{padding:0 1.5rem 1.25rem;display:flex;align-items:flex-end;gap:1.25rem;flex-wrap:wrap;position:relative;margin-top:-36px}
.vz-profile-avatar-zone{position:relative;flex-shrink:0}
.vz-profile-avatar{width:72px;height:72px;border-radius:50%;border:3px solid #fff;object-fit:cover;display:block;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.vz-profile-avatar-init{width:72px;height:72px;border-radius:50%;border:3px solid #fff;background:linear-gradient(135deg,#405189,#3577f1);color:#fff;font-size:1.75rem;font-weight:900;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.vz-profile-avatar-cam{position:absolute;bottom:2px;right:2px;width:22px;height:22px;border-radius:50%;background:#405189;border:2px solid #fff;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.15s;padding:0}
.vz-profile-avatar-cam:hover{background:#2e3b6e}
.vz-profile-identity{flex:1;min-width:0;padding-top:2rem}
.vz-profile-fullname{font-size:1.1rem;font-weight:900;color:#1a2640;margin:0 0 .15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vz-profile-email{font-size:.8rem;color:#878a99;margin:0 0 .5rem}
.vz-profile-meta{display:flex;gap:.35rem;flex-wrap:wrap}
.vz-profile-hero-actions{display:flex;gap:.5rem;align-items:flex-end;padding-bottom:.1rem;flex-shrink:0;margin-left:auto}
@media(max-width:560px){.vz-profile-hero-body{margin-top:-24px}.vz-profile-hero-actions{width:100%;justify-content:flex-start;padding-bottom:0}}

/* ── Nav tabs ────────────────────────────────────────────────────────────── */
.vz-profile-nav{display:flex;gap:2px;background:#fff;border:1px solid #e9ebec;border-radius:var(--p-radius,10px);padding:.4rem;margin-bottom:1.25rem;overflow-x:auto}
.vz-profile-nav-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.45rem;padding:.6rem .5rem;border:none;background:transparent;border-radius:7px;font-size:.8rem;font-weight:700;color:#6c757d;cursor:pointer;transition:.18s;white-space:nowrap}
.vz-profile-nav-btn i{font-size:.88rem}
.vz-profile-nav-btn:hover{background:#f3f6f9;color:#405189}
.vz-profile-nav-btn.active{background:#405189;color:#fff;box-shadow:0 2px 6px rgba(64,81,137,.3)}
@media(max-width:480px){.vz-profile-nav-btn span{display:none}}

/* ── Tab panels ─────────────────────────────────────────────────────────── */
.vz-tab-panel{display:none}.vz-tab-panel.active{display:block}

/* ── Topbar strip ────────────────────────────────────────────────────────── */
.pcams-topbar{
  display:flex;align-items:center;justify-content:flex-end;
  padding:.45rem 1.25rem;background:#fff;
  border:1px solid #e9ebec;border-radius:10px 10px 0 0;
  margin-bottom:-1px;position:relative;
}
.pcams-topbar-user.pcams-topbar-dropdown-trigger{display:flex;align-items:center;gap:.45rem;cursor:pointer;padding:.3rem .6rem;border-radius:6px;transition:.15s;margin-left:auto}
.pcams-topbar-user.pcams-topbar-dropdown-trigger:hover{background:#f3f6f9}
.pcams-topbar-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#405189,#3577f1);color:#fff;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pcams-topbar-avatar-photo{width:28px;height:28px;border-radius:50%;object-fit:cover;border:2px solid rgba(64,81,137,.3)}
.pcams-topbar-name{font-size:.83rem;font-weight:700;color:#374151}
.pcams-topbar-chevron{flex-shrink:0;transition:transform .2s;opacity:.45}
.pcams-topbar.open .pcams-topbar-chevron{transform:rotate(180deg)}

/* Dropdown */
.pcams-topbar-menu{
  position:absolute;top:calc(100% + 6px);right:0;z-index:9999;
  background:#fff;border:1px solid #e9ebec;border-radius:var(--p-radius,10px);
  box-shadow:0 8px 24px rgba(0,0,0,.1),0 2px 6px rgba(0,0,0,.06);min-width:210px;
  opacity:0;transform:translateY(-6px) scale(.98);pointer-events:none;
  transition:opacity .16s,transform .16s;
}
.pcams-topbar.open .pcams-topbar-menu{opacity:1;transform:none;pointer-events:auto}
.pcams-topbar-menu-header{display:flex;align-items:center;gap:.65rem;padding:.85rem 1rem;border-bottom:1px solid #f3f6f9}
.pcams-topbar-menu-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#405189,#3577f1);color:#fff;font-weight:800;font-size:1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pcams-topbar-menu-items{padding:.3rem 0}
.pcams-topbar-menu-item{display:flex;align-items:center;gap:.55rem;padding:.55rem 1rem;font-size:.82rem;font-weight:600;color:#374151;text-decoration:none;transition:background .15s}
.pcams-topbar-menu-item:hover{background:#f3f6f9;color:#405189}
.pcams-topbar-menu-divider{height:1px;background:#f3f6f9;margin:.25rem 0}
.pcams-topbar-menu-logout,.pcams-topbar-menu-logout:hover{color:#f06548!important}
.pcams-topbar-menu-logout:hover{background:rgba(240,101,72,.06)!important}

/* Topbar logout button (fallback without dropdown) */
.pcams-topbar-logout{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .8rem;border-radius:6px;border:1.5px solid rgba(240,101,72,.25);background:rgba(240,101,72,.05);color:#b83e26;font-size:.78rem;font-weight:700;text-decoration:none;transition:.15s}
.pcams-topbar-logout:hover{background:rgba(240,101,72,.1);border-color:#f06548;color:#f06548}

/* ── Biometric settings ─────────────────────────────────────────────────── */
.pcams-bio-settings{display:flex;flex-direction:column;gap:1rem}
.pcams-bio-section{background:#fff;border:1px solid #e9ebec;border-radius:var(--p-radius,10px);padding:1.25rem 1.5rem;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.pcams-bio-section-title{display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:800;color:#1a2640;margin-bottom:.35rem}
.pcams-bio-desc{font-size:.8rem;color:#878a99;margin:0 0 1rem;line-height:1.6}
.pcams-cred-list{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.75rem}
.pcams-cred-row{display:flex;align-items:center;justify-content:space-between;background:#f8f9fa;border:1px solid #e9ebec;border-radius:8px;padding:.55rem .9rem}
.pcams-cred-info{display:flex;align-items:center;gap:.55rem}
.pcams-cred-icon{width:30px;height:30px;border-radius:7px;background:rgba(64,81,137,.08);color:#405189;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pcams-cred-name{font-size:.83rem;font-weight:700;color:#1a2640}
.pcams-cred-date{font-size:.7rem;color:#adb5bd}
.pcams-cred-delete{padding:.25rem .65rem;border:1px solid rgba(240,101,72,.25);border-radius:5px;background:transparent;color:#b83e26;font-size:.73rem;font-weight:700;cursor:pointer;transition:.15s}
.pcams-cred-delete:hover{background:rgba(240,101,72,.08);border-color:#f06548}
.pcams-bio-add-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.42rem .95rem;border:1.5px solid rgba(64,81,137,.22);border-radius:7px;background:#fff;color:#405189;font-size:.8rem;font-weight:700;cursor:pointer;transition:.15s}
.pcams-bio-add-btn:hover{background:#f0f4ff;border-color:#405189}
.pcams-face-capture-wrap{display:flex;flex-direction:column;gap:.5rem}
#pcams-bio-status,#pcams-face-status{font-size:.78rem;font-weight:600;padding:.3rem 0}

/* Biometric login button */
.pcams-bio-btn{background:#f8f9ff!important;border-color:rgba(64,81,137,.2)!important;color:#405189!important}
.pcams-bio-btn:hover:not(:disabled){background:#eef2ff!important;border-color:#405189!important}

/* Face preview overlay */
@keyframes pcamsFaceIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
#pcams-face-overlay{animation:pcamsFaceIn .25s ease;border:1px solid #e9ebec}

/* ── Guided Face Capture ─────────────────────────────────────────────────────── */
.pcams-face-zone{margin-top:1rem}
.pcams-face-current{display:flex;align-items:center;gap:1rem;padding:.85rem;background:#f8f9fa;border-radius:10px;margin-bottom:.75rem}
.pcams-face-current-img{width:64px;height:64px;border-radius:50%;object-fit:cover;border:3px solid #405189;flex-shrink:0}
.pcams-face-start-btn{background:linear-gradient(135deg,#405189,#3577f1)!important;color:#fff!important;border-color:transparent!important;padding:.6rem 1.25rem!important;box-shadow:0 3px 10px rgba(64,81,137,.25)}

/* Face capture widget */
.fc-wrap{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:.75rem 0}
.fc-guide-text{font-size:.82rem;font-weight:700;color:#405189;letter-spacing:.2px;text-align:center;min-height:1.2em}

.fc-viewer{position:relative;width:260px;height:260px;border-radius:50%;overflow:hidden;background:#000;flex-shrink:0}
.fc-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}/* mirror like selfie cam */
.fc-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.fc-instructions{display:flex;align-items:center;gap:.5rem}
.fc-dot{width:8px;height:8px;border-radius:50%;background:#e9ebec;transition:.3s}
.fc-dot-active{background:#3577f1;transform:scale(1.3)}
.fc-dot-done{background:#0ab39c}
.fc-step-label{font-size:.78rem;font-weight:600;color:#6c757d;margin-left:.25rem}

/* Captured state */
.fc-captured-wrap{display:flex;flex-direction:column;align-items:center;gap:.6rem;animation:pcamsFadeIn .4s ease}
.fc-captured-img{width:180px;height:180px;border-radius:50%;border:4px solid #0ab39c;box-shadow:0 4px 20px rgba(10,179,156,.3);display:block}
.fc-captured-label{display:flex;align-items:center;gap:.45rem;font-size:.88rem;font-weight:700;color:#076e5e}
.fc-retake-btn{padding:.35rem .9rem;border:1.5px solid #e9ebec;border-radius:6px;background:#fff;color:#6c757d;font-size:.78rem;font-weight:600;cursor:pointer;transition:.15s}
.fc-retake-btn:hover{border-color:#405189;color:#405189}

.fc-saving{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:#878a99;font-weight:600}
.fc-saving-ring{width:16px;height:16px;border:2px solid #e9ebec;border-top-color:#405189;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}

.fc-error{background:rgba(240,101,72,.07);border:1px solid rgba(240,101,72,.25);border-radius:10px;padding:1rem 1.25rem;font-size:.84rem;color:#b83e26;font-weight:600;text-align:center;line-height:1.6;margin:.5rem 0}
