/* ======================================================================
   ECLIPSE FEEDBACK — Radzen toast (NotificationService) + confirm (DialogService)
   Eclipse-brand override. TISZTA CSS (a C# Notify/Confirm hívások változatlanok,
   egyetlen kivétel: a confirm ConfirmOptions.CssClass = "ec-confirm ec-confirm--danger").

   Szelektorok a TÉNYLEGES Radzen.Blazor 10.3.1 DOM-hoz igazítva (material-base.css):
     - toast-kártya:  .rz-notification-item     (NEM .rz-notification)
     - summary:       .rz-notification-title
     - detail:        .rz-notification-message
     - warning súly.: .rz-notification-warn      (NEM -warning)
     - dialog X:      .rz-dialog-titlebar-close
     - confirm üzenet:.rz-dialog-confirm-message
   Material-base.css és tokens.diff.css UTÁN linkelve (App.razor) → felülír.
   ====================================================================== */

/* ====================================================================== */
/* TOASTOK                                                                 */
/* ====================================================================== */

/* súlyosság → tónus-változók (a Radzen severity-osztályaira; a kártya örökli) */
.rz-notification-success{--ec-tone:var(--success); --ec-tone-soft:var(--success-soft)}
.rz-notification-error  {--ec-tone:var(--danger);  --ec-tone-soft:var(--danger-soft)}
.rz-notification-warn   {--ec-tone:var(--warning); --ec-tone-soft:var(--warning-soft)}
.rz-notification-info   {--ec-tone:var(--signal);  --ec-tone-soft:var(--signal-soft)}

/* kártya */
/* a wrapper adja a toast szélességét + a toastok közti térközt (az item ezt tölti ki, nem lóg túl) */
.rz-notification-item-wrapper{min-width:0!important; width:360px!important; max-width:calc(100vw - 2rem)!important; margin:0 0 12px!important}
.rz-notification-item{
  background:var(--bg-elev)!important; color:var(--ink)!important;
  border:1px solid var(--line)!important;
  border-left:3px solid var(--ec-tone,var(--corona))!important;
  border-radius:var(--radius-md)!important;
  box-shadow:var(--shadow-pop)!important;
  padding:14px 15px!important;
  min-width:0!important; max-width:none!important; overflow:hidden;
  animation:ec-toast-in .42s cubic-bezier(.16,1,.3,1) both;
}

/* Duration-visszaszámláló sáv a kártya ALJÁN, keretként (nem a tartalomban): a Radzen alapból border-radius-nyit
   beljebb húzza — mi az alsó ÉLRE tesszük (inset:0), teljes szélességben, a kártya alsó sarkaihoz illő kerekítéssel. */
.rz-notification-item-wrapper > .rz-progressbar{
  inset-block-end:0!important;
  inset-inline-start:4px!important; inset-inline-end:0!important;   /* balról 4px beljebb (a zöld bal-keret mellől), jobb él élen */
  --rz-progressbar-height:3px; height:3px!important;                /* kicsit vékonyabb */
  background:var(--ec-tone-soft,rgba(0,0,0,.06))!important; overflow:hidden;
  border-radius:0 0 var(--radius-md) var(--radius-md)!important;
}
.rz-notification-item-wrapper > .rz-progressbar .rz-progressbar-value{
  background:var(--ec-tone,var(--corona))!important;
}

/* ikon + szöveg flex-elrendezés — a VALÓDI konténer a .rz-notification-message-wrapper (nem a -content!) */
.rz-notification-message-wrapper{display:flex!important; align-items:center!important; gap:13px!important}

/* ikon → tónusos „chip” (a Radzen material-glyph megmarad, csak átstílozzuk) */
.rz-notification-icon{
  flex:0 0 auto; width:30px; height:30px; border-radius:8px;
  display:grid!important; place-items:center;
  background:var(--ec-tone-soft)!important; color:var(--ec-tone)!important;
  font-size:17px!important; margin:0!important;
}

/* szöveg-oszlop: .rz-notification-message = title (Summary) + content (Detail) */
.rz-notification-message{min-width:0!important; justify-content:center}
.rz-notification-title{
  font-family:var(--sans)!important; font-weight:600!important; font-size:13.5px!important;
  color:var(--ink)!important; letter-spacing:-.01em; line-height:1.3!important}
/* Detail = .rz-notification-content. A Radzen alsó margóját NULLÁZZUK: a sáv az alsó élen, keretként van
   (nem a tartalomban), így a szöveg a normál paddinggel zár, a sáv pedig vékony alsó keretként fut. */
.rz-notification-content{
  margin-block-end:0!important;
  font-family:var(--sans)!important; font-size:12.5px!important; color:var(--ink-muted)!important;
  line-height:1.45; margin-top:3px;
  white-space:pre-line}   /* a több soros detail (pl. az 1871-es kondíció-figyelmeztetés) sortörései megmaradjanak */
.rz-notification-close{color:var(--ink-faint)!important; opacity:1!important; transition:.12s}
.rz-notification-close:hover{color:var(--ink-muted)!important}

@keyframes ec-toast-in{from{opacity:0; transform:translateX(28px) scale(.98)} to{opacity:1; transform:none}}

@media (prefers-reduced-motion:reduce){
  .rz-notification-item{animation-duration:.01ms!important}
}

/* ====================================================================== */
/* CONFIRM-DIALOG (scope: .ec-confirm — csak az így jelölt párbeszédre hat) */
/* ====================================================================== */
/* maszk: eklipsz-sötét scrim + blur (a busy-overlay-jal egységes) */
.rz-dialog-mask{background:rgba(10,14,26,.42)!important; backdrop-filter:blur(3px)}

.ec-confirm.rz-dialog{
  background:var(--bg-elev)!important; border:1px solid var(--line)!important;
  border-radius:var(--radius-lg)!important; box-shadow:var(--shadow-pop)!important;
  overflow:hidden; width:430px!important; max-width:calc(100vw - 40px)!important;   /* a Radzen inline width:600px-ét felülírjuk */
  animation:ec-dialog-in .28s cubic-bezier(.16,1,.3,1) both;
}
@keyframes ec-dialog-in{from{opacity:0; transform:translateY(12px) scale(.97)} to{opacity:1; transform:none}}

/* fejléc: ikon-chip + Instrument Serif cím */
.ec-confirm .rz-dialog-titlebar{
  border-bottom:none!important; padding:22px 24px 4px!important;
  display:flex!important; align-items:flex-start; gap:14px;
}
.ec-confirm--danger .rz-dialog-titlebar::before{
  content:""; flex:0 0 auto; width:42px; height:42px; border-radius:11px;
  background:var(--danger-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9l-6 6M9 9l6 6'/%3E%3C/svg%3E") center / 22px no-repeat;
}
.ec-confirm .rz-dialog-title{
  font-family:var(--serif)!important; font-weight:400!important; font-size:25px!important;
  color:var(--ink)!important; line-height:1.12; letter-spacing:.005em; align-self:center;
}
/* a beépített záró-X a jobb felső sarokban marad — halványítva */
.ec-confirm .rz-dialog-titlebar-close{color:var(--ink-faint)!important}

/* tartalom (üzenet) */
.ec-confirm .rz-dialog-content{padding:8px 24px 20px!important}
.ec-confirm .rz-dialog-confirm-message{
  font-family:var(--sans)!important; font-size:13.5px!important; line-height:1.55; color:var(--ink-muted)!important;
}

/* gombsor: EGYFORMA SZÉLESSÉGŰ gombok */
.ec-confirm .rz-dialog-confirm-buttons{
  display:flex!important; gap:10px; margin-top:18px; padding-top:16px;
  border-top:1px solid var(--line);
}
.ec-confirm .rz-dialog-confirm-buttons .rz-button{
  flex:1 1 0!important; min-width:0; height:42px!important; border-radius:9px!important;
  font-family:var(--sans)!important; font-weight:600!important; font-size:13.5px!important;
}
/* megerősítő (OK = Primary) → destruktív danger; Mégse → ghost */
.ec-confirm--danger .rz-dialog-confirm-buttons .rz-button.rz-primary{
  background:var(--danger)!important; border:1px solid var(--danger)!important; color:#fff!important;
}
/* kör-X ikon a gomb szövege elé — a .rz-button-box-ba (az igazoltan inline-flex; az inline ::before-on a méret nem hatna) */
.ec-confirm--danger .rz-dialog-confirm-buttons .rz-button.rz-primary .rz-button-box::before{
  content:""; flex:0 0 auto; display:inline-block; width:16px; height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15 9l-6 6M9 9l6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ec-confirm--danger .rz-dialog-confirm-buttons .rz-button.rz-primary:hover{filter:brightness(.93)}
.ec-confirm .rz-dialog-confirm-buttons .rz-button:not(.rz-primary){
  background:#fff!important; border:1px solid var(--line-bright)!important; color:var(--ink-muted)!important;
}
.ec-confirm .rz-dialog-confirm-buttons .rz-button:not(.rz-primary):hover{
  border-color:var(--line-strong)!important; color:var(--ink)!important;
}

@media (prefers-reduced-motion:reduce){
  .ec-confirm.rz-dialog{animation-duration:.01ms!important}
}