/* codex-20260728: msgBox — глобалният диалог за съобщения/грешки на сайта (jQuery.msgBox).
   Пренаписан дизайн по токените на темата (Onest/Commissioner, ink #0B0D12, акцент #2557FF).

   Какво поправя спрямо стария:
   • НЕПРОЗРАЧЕН панел — старият имаше полупрозрачен PNG фон (текстът отдолу прозираше)
     и бял backdrop с opacity:.7 (избелваше страницата вместо да я затъмни).
   • z-index НАД всички модали (старият 1003 стоеше ПОД картата за куриерски точки — 100000).
   • Адаптивен — старият беше фиксиран 430px с .msgBoxContent 319×90px → на телефон
     съдържанието излизаше извън екрана и текстът се отрязваше.
   • Центриране през flex (без JS-смятани top/left, които се чупеха при скрол/resize).
   Класовете са запазени 1:1 за съвместимост. */

/* ---------- backdrop ---------- */
div.msgBoxBackGround{
  position:fixed; inset:0; margin:0; padding:0;
  width:100%; height:100%;
  background:rgba(11,13,18,.55);
  -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  z-index:100010;
  opacity:0; transition:opacity .18s ease;
}
div.msgBoxBackGround.msgIn{opacity:1}

/* ---------- панел ---------- */
div.msgBox{
  position:fixed; left:0; right:0; top:0; bottom:0;
  z-index:100011;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  padding:20px;
  width:auto; height:auto; min-height:0;
  background:none; border:0; box-shadow:none;   /* самият wrapper е прозрачен; картата е .msgBoxCard */
  font-family:"Onest",Arial,Helvetica,sans-serif;
  color:#0B0D12;
  pointer-events:none;                           /* кликът минава към backdrop-а извън картата */
  opacity:0; transition:opacity .18s ease;
}
div.msgBox.msgIn{opacity:1}

/* картата — НЕПРОЗРАЧНА */
div.msgBox > .msgBoxCard{
  pointer-events:auto;
  width:100%; max-width:430px;
  background:#fff;
  border-radius:16px;
  box-shadow:0 24px 60px rgba(11,13,18,.35), 0 2px 6px rgba(11,13,18,.10);
  padding:26px 26px 20px;
  text-align:center;
  transform:translateY(8px) scale(.98);
  transition:transform .2s cubic-bezier(.2,.8,.3,1);
  max-height:calc(100vh - 40px); max-height:calc(100dvh - 40px);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
div.msgBox.msgIn > .msgBoxCard{transform:none}

/* ---------- икона (по тип) ---------- */
div.msgBoxImage{
  margin:0 auto 14px; float:none; display:flex;
  width:56px; height:56px; border-radius:50%;
  align-items:center; justify-content:center;
  background:#FFF6E8; color:#B54708;             /* alert (по подразбиране) */
}
div.msgBoxImage svg{width:28px; height:28px; display:block}
div.msgBoxImage img{width:28px; height:28px}     /* съвместимост, ако някой подаде <img> */
.msgBox-error   div.msgBoxImage{background:#FEF3F2; color:#B42318}
.msgBox-info    div.msgBoxImage{background:#E8EDFF; color:#2557FF}
.msgBox-confirm div.msgBoxImage{background:#F4F6FA; color:#0B0D12}
.msgBox-success div.msgBoxImage{background:#EAF6EF; color:#0F7A44}

/* ---------- заглавие + текст ---------- */
div.msgBoxTitle{
  font:700 19px/1.3 "Commissioner","Onest",Arial,sans-serif;
  color:#0B0D12; letter-spacing:-.01em;
  width:auto; padding:0; margin:0 0 6px; font-variant:normal;
}
div.msgBoxTitle:empty{display:none}

div.msgBoxContainer{display:block}
div.msgBoxContent{
  float:none; display:block;
  width:auto; height:auto;                        /* без фиксирани размери → текстът не се реже */
  margin:0; font-size:15px;
}
div.msgBoxContent p{display:block; width:auto; height:auto; margin:0; padding:0}
div.msgBoxContent span{
  display:block; vertical-align:baseline;
  color:#475467; font-size:15px; line-height:1.55;
  overflow-wrap:anywhere; word-break:break-word;
}

/* ---------- бутони ---------- */
div.msgBoxButtons{
  display:flex; gap:9px; justify-content:center; flex-wrap:wrap;
  width:100%; margin-top:20px; text-align:center;
}
div.msgBoxButtons input[type='button']{
  -webkit-appearance:none; appearance:none;
  font:600 14.5px "Onest",Arial,sans-serif;
  min-width:118px; height:46px; padding:0 20px; margin:0;
  border-radius:10px; cursor:pointer;
  border:1px solid #D9DEE8; background:#fff; color:#0B0D12;
  transition:background .15s, border-color .15s, color .15s;
}
div.msgBoxButtons input[type='button']:hover{background:#F4F6FA; border-color:#667085}
/* първият бутон = основното действие (Ok / Yes / Login) */
div.msgBoxButtons input[type='button']:first-child{
  background:#2557FF; border-color:#2557FF; color:#fff;
}
div.msgBoxButtons input[type='button']:first-child:hover{background:#1F49D6; border-color:#1F49D6}
div.msgBoxButtons input[type='button']:active{transform:translateY(1px)}
/* фокус-пръстен с бяла „междина" → чете се и върху синия основен бутон (вместо UA outline) */
div.msgBoxButtons input[type='button']:focus{outline:none}
div.msgBoxButtons input[type='button']:focus-visible{
  outline:none; box-shadow:0 0 0 3px #fff, 0 0 0 6px rgba(37,87,255,.45);
}
.msgBox-error div.msgBoxButtons input[type='button']:focus-visible{box-shadow:0 0 0 3px #fff, 0 0 0 6px rgba(180,35,24,.40)}
/* при грешка основният бутон е в danger тона */
.msgBox-error div.msgBoxButtons input[type='button']:first-child{background:#B42318; border-color:#B42318}
.msgBox-error div.msgBoxButtons input[type='button']:first-child:hover{background:#9A1D14; border-color:#9A1D14}

/* ---------- prompt полета ---------- */
div.msgBoxInputs{width:100%; margin:14px auto 0; padding:0; text-align:left}
div.msgInput{margin-bottom:11px}
div.msgInput span.msgInputHeader{
  display:block; margin-bottom:5px;
  font:600 12.5px "Onest",Arial,sans-serif; color:#667085;
}
div.msgInput input[type='text'],div.msgInput input[type='password']{
  width:100%; height:46px; padding:0 13px;
  font:16px/1 "Onest",Arial,sans-serif;         /* 16px → без iOS auto-zoom */
  color:#0B0D12; background:#fff;
  border:1px solid #D9DEE8; border-radius:10px; outline:none;
}
div.msgInput input[type='text']:focus,div.msgInput input[type='password']:focus{
  border-color:#2557FF; box-shadow:0 0 0 4px rgba(37,87,255,.18);
}
div.msgInput input[type='checkbox'],div.msgInput input[type='radiobutton'],div.msgInput input[type='radio']{
  margin-right:8px; accent-color:#2557FF;
}
div.msgInput text{color:#475467; font-size:14px}

/* ---------- „привлечи вниманието" при клик извън ---------- */
@keyframes msgBoxNudge{0%,100%{transform:none}25%,75%{transform:translateX(-5px)}50%{transform:translateX(5px)}}
div.msgBox.msgNudge > .msgBoxCard{animation:msgBoxNudge .3s}

/* ---------- мобилно ---------- */
@media(max-width:520px){
  div.msgBox{padding:16px; padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  div.msgBox > .msgBoxCard{padding:22px 18px 18px; border-radius:14px}
  div.msgBoxTitle{font-size:17.5px}
  div.msgBoxContent span{font-size:14.5px}
  div.msgBoxImage{width:52px; height:52px; margin-bottom:12px}
  div.msgBoxButtons{flex-direction:column-reverse; gap:8px}   /* основният бутон най-долу = под палеца */
  div.msgBoxButtons input[type='button']{width:100%; min-width:0}
}

@media(prefers-reduced-motion:reduce){
  div.msgBox,div.msgBoxBackGround,div.msgBox > .msgBoxCard{transition:none}
  div.msgBox.msgNudge > .msgBoxCard{animation:none}
}