.nfc-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);display:none;align-items:center;justify-content:center;z-index:100000;padding:16px;}
.nfc-overlay.open{display:flex;}
.nfc-box{background:#fff;border-radius:16px;padding:28px 22px;max-width:340px;width:100%;max-height:calc(100vh - 32px);overflow-y:auto;text-align:center;box-shadow:0 10px 40px rgba(0,0,0,.25);box-sizing:border-box;}
.nfc-box h2{margin:0 0 6px;font-size:18px;}
.nfc-box .nfc-hint{color:#64748b;font-size:13px;margin:0 0 20px;}
.nfc-icon{font-size:46px;margin-bottom:10px;}
.nfc-state{border-radius:12px;padding:16px;font-size:14px;font-weight:600;margin-bottom:18px;}
.nfc-state.ready{background:#dcfce7;color:#166534;}
.nfc-state.wait{background:#fef9c3;color:#854d0e;}
.nfc-state.error{background:#fee2e2;color:#991b1b;}
.nfc-state.loading{background:#f1f5f9;color:#64748b;}
.nfc-close-btn{display:inline-block;padding:10px 24px;border-radius:8px;border:none;background:#2563eb;color:#fff;font-weight:600;font-size:14px;cursor:pointer;}

/* ===== "Yazaki карта" — premium info modal (fintech-style, вдъхновен от
   Revolut усещане, не копие) — САМО информационен, не отваря реалната
   NFC/HCE функционалност. z-index 100000 > .mp-bottom-nav (99990) и
   > кръглия бутон (z-index:2 вътре в лентата), значи винаги е отгоре. */
.nfc-modal-overlay{
  position:fixed;inset:0;
  background:rgba(15,23,42,0);
  display:flex;align-items:center;justify-content:center;
  z-index:100000;
  padding:20px;
  box-sizing:border-box;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, background-color .3s ease, visibility 0s linear .3s;
}
.nfc-modal-overlay.open{
  opacity:1;
  visibility:visible;
  background:rgba(15,23,42,.58);
  pointer-events:auto;
  transition:opacity .3s ease, background-color .3s ease;
}
.nfc-modal-sheet{
  width:88%;
  max-width:420px;
  max-height:85vh;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  background:#fff;
  border-radius:28px;
  padding:30px 24px 24px;
  box-sizing:border-box;
  box-shadow:0 30px 70px rgba(0,0,0,.35);
  position:relative;
  transform:translateY(28px) scale(.96);
  opacity:0;
  transition:transform .34s cubic-bezier(.22,1,.36,1), opacity .28s ease;
}
.nfc-modal-overlay.open .nfc-modal-sheet{
  transform:translateY(0) scale(1);
  opacity:1;
}
.nfc-modal-close{
  position:absolute;
  top:16px; right:16px;
  width:34px; height:34px;
  border-radius:50%;
  border:0;
  background:#f1f5f9;
  color:#334155;
  font-size:16px;
  font-weight:700;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  line-height:1;
}
.nfc-modal-icon{display:flex;align-items:center;justify-content:center;gap:8px;margin:6px 0 18px;}
.nfc-modal-icon-circle{
  border-radius:50%;
  background:linear-gradient(135deg,#FFD400,#ffb800);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 22px rgba(255,184,0,.35);
  flex:0 0 auto;
}
.nfc-modal-icon-circle.lg{width:64px;height:64px;font-size:30px;}
.nfc-modal-icon-circle.sm{width:42px;height:42px;font-size:19px;}
.nfc-modal-icon-waves{display:flex;gap:5px;align-items:center;}
.nfc-modal-icon-waves span{
  display:block;width:6px;height:6px;border-radius:50%;
  background:#f0b400;
  animation:nfcDotPulse 1.3s ease-in-out infinite;
}
.nfc-modal-icon-waves span:nth-child(2){animation-delay:.15s;}
.nfc-modal-icon-waves span:nth-child(3){animation-delay:.3s;}
@keyframes nfcDotPulse{
  0%,100%{opacity:.25;transform:scale(.75);}
  50%{opacity:1;transform:scale(1.15);}
}
.nfc-modal-title{margin:0 0 10px;font-size:22px;font-weight:800;text-align:center;color:#0f172a;letter-spacing:-.2px;}
.nfc-modal-status{
  display:block;
  text-align:center;
  border-radius:14px;
  padding:12px 16px;
  font-size:13.5px;
  font-weight:700;
  line-height:1.45;
  margin:0 0 18px;
}
.nfc-modal-status.status-ready,
.nfc-modal-status.status-success{background:#dcfce7;color:#166534;}
.nfc-modal-status.status-wait{background:#fef9c3;color:#854d0e;}
.nfc-modal-status.status-error{background:#fee2e2;color:#991b1b;}
.nfc-modal-status.status-loading{background:#f1f5f9;color:#475569;}
.nfc-modal-lead{margin:0 0 12px;font-size:16.5px;font-weight:700;text-align:center;color:#0f172a;line-height:1.35;}
.nfc-modal-text{margin:0 0 12px;font-size:14px;line-height:1.55;color:#475569;text-align:left;}
.nfc-modal-text.strong{color:#0f172a;font-weight:700;}
.nfc-modal-features{margin:18px 0 24px;padding-top:18px;border-top:1px solid #f1f5f9;}
.nfc-feature-row{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px;}
.nfc-feature-row:last-child{margin-bottom:0;}
.nfc-feature-icon{
  flex:0 0 auto;
  width:42px;height:42px;
  border-radius:13px;
  background:#fff7d6;
  display:flex;align-items:center;justify-content:center;
  font-size:19px;
}
.nfc-feature-title{font-size:14.5px;font-weight:700;color:#0f172a;margin-bottom:2px;}
.nfc-feature-desc{font-size:13px;color:#64748b;line-height:1.4;}
.nfc-modal-cta{
  display:block;
  width:100%;
  border:0;
  border-radius:16px;
  background:linear-gradient(180deg,#FFD400,#ffc400);
  color:#111;
  font-size:16px;
  font-weight:800;
  padding:16px;
  box-sizing:border-box;
  box-shadow:0 10px 20px rgba(255,196,0,.35);
  cursor:pointer;
}
.nfc-modal-cta:active{transform:scale(.98);}

@media(max-width:360px){
  .nfc-modal-sheet{padding:26px 18px 20px;}
  .nfc-modal-title{font-size:20px;}
  .nfc-modal-lead{font-size:15.5px;}
}

/* ===== Реален статус/HCE панел — дигитална карта, NFC pulse, headline ===== */

.nfc-employee-name{
  text-align:center;
  font-size:14.5px;
  font-weight:700;
  color:#64748b;
  text-transform:uppercase;
  letter-spacing:.4px;
  min-height:18px;
  margin:0 0 18px;
}

.nfc-pulse-wrap{
  position:relative;
  width:160px;height:160px;
  margin:4px auto 20px;
  display:flex;align-items:center;justify-content:center;
}
.nfc-pulse-core{font-size:68px;position:relative;z-index:2;transition:opacity .25s ease,filter .25s ease;}
.nfc-pulse-ring{
  position:absolute;inset:0;
  border-radius:50%;
  border:2.5px solid rgba(240,180,0,.55);
  opacity:0;
}
.nfc-pulse-wrap.active .nfc-pulse-ring{animation:nfcPulseRing 2.4s ease-out infinite;}
.nfc-pulse-wrap.active .r2{animation-delay:.8s;}
.nfc-pulse-wrap.active .r3{animation-delay:1.6s;}
.nfc-pulse-wrap.muted .nfc-pulse-core{opacity:.35;filter:grayscale(1);}
.nfc-pulse-wrap.muted .nfc-pulse-ring{display:none;}
@keyframes nfcPulseRing{
  0%{transform:scale(.55);opacity:.8;}
  100%{transform:scale(1.18);opacity:0;}
}

.nfc-success-check{display:none;position:absolute;inset:0;z-index:3;}
.nfc-pulse-wrap.success .nfc-pulse-core{opacity:0;}
.nfc-pulse-wrap.success .nfc-pulse-ring{border-color:rgba(34,197,94,.55);}
.nfc-pulse-wrap.success .nfc-success-check{
  display:block;
  animation:nfcCheckPop .4s cubic-bezier(.34,1.56,.64,1) both,
            nfcCheckWobble 1s ease-in-out .4s,
            nfcCheckLive 1.4s ease-in-out 1.4s infinite;
}
.nfc-success-check-circle{fill:#22c55e;stroke:#16a34a;stroke-width:2;}
.nfc-success-check-mark{
  stroke:#fff;stroke-width:6;stroke-linecap:square;stroke-linejoin:miter;
  stroke-dasharray:48;stroke-dashoffset:48;
  animation:nfcCheckDraw .35s ease-out .25s forwards;
}
@keyframes nfcCheckPop{
  0%{transform:scale(.4);opacity:0;}
  60%{transform:scale(1.14);opacity:1;}
  100%{transform:scale(1);opacity:1;}
}
@keyframes nfcCheckDraw{to{stroke-dashoffset:0;}}
@keyframes nfcCheckWobble{
  0%{transform:rotate(0deg);}
  15%{transform:rotate(-16deg);}
  32%{transform:rotate(13deg);}
  49%{transform:rotate(-9deg);}
  66%{transform:rotate(6deg);}
  83%{transform:rotate(-3deg);}
  100%{transform:rotate(0deg);}
}
@keyframes nfcCheckLive{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.07);}
}

.nfc-status-headline{font-size:17px;font-weight:800;text-align:center;color:#0f172a;line-height:1.35;margin:0 0 8px;}
.nfc-status-helper{font-size:13px;color:#64748b;text-align:center;line-height:1.5;margin:0 0 20px;}

.nfc-help-box{
  background:#f8fafc;
  border-radius:14px;
  padding:14px 16px;
  font-size:13px;
  color:#475569;
  line-height:1.55;
  margin:0 0 14px;
  text-align:left;
}
.nfc-modal-btn-row{display:flex;gap:10px;}
.nfc-modal-btn-secondary{
  flex:0 0 auto;
  padding:0 18px;
  border-radius:16px;
  border:1.5px solid #e2e8f0;
  background:#fff;
  color:#334155;
  font-weight:700;
  font-size:14.5px;
  cursor:pointer;
}
.nfc-modal-cta-flex{flex:1;margin:0;}

@media(max-width:360px){
  .nfc-pulse-wrap{width:130px;height:130px;}
  .nfc-pulse-core{font-size:54px;}
  .nfc-status-headline{font-size:15.5px;}
}

/* "Yazaki карта" — floating централен action бутон в .mp-bottom-nav, между
   "Проверка заявки" и "Програма лоялен клиент". flex:0 0 auto пази
   footprint-а му на мястото му във flex реда (хоризонталното центриране
   между съседите остава точно), а position:relative+top го издига визуално
   над лентата, без да мести съседните бутони — класически "notch" FAB
   ефект. overflow:visible на самата лента гарантира, че издаването нагоре
   не се отрязва. safe-area-inset-bottom вече се пази от самата .mp-bottom-nav
   позиция (bottom: calc(env(safe-area-inset-bottom,0px) + ...)) — бутонът е
   закачен ЗА лентата и се издига НАГОРЕ, далеч от gesture зоната. */
.mp-bottom-nav{
  overflow:visible !important;
}
.mp-bottom-nav .nfc-round-btn{
  flex:0 0 auto !important;
  position:relative !important;
  top:-14px !important;
  width:92px !important;
  height:92px !important;
  min-width:92px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#FFD400,#ffc400) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  border:4px solid #fff !important;
  box-shadow:0 14px 28px rgba(0,0,0,.28),0 4px 10px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.65) !important;
  color:#111 !important;
  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  padding:0 !important;
  margin:0 4px !important;
  z-index:2 !important;
  box-sizing:border-box !important;
}
.mp-bottom-nav .nfc-round-btn .nfc-round-line{display:block;text-align:center;}
.mp-bottom-nav .nfc-round-btn:active{transform:scale(.94) !important;}

@media(max-width:360px){
  .mp-bottom-nav .nfc-round-btn{
    width:76px !important;
    height:76px !important;
    min-width:76px !important;
    top:-10px !important;
    font-size:12.5px !important;
    border-width:3px !important;
  }
}
