/* СтройМенеджер — Modal oynalar, forma elementlari, confirm, toast */
/* ═══════════════════════════════════════════════════════════════════
   MODAL
═══════════════════════════════════════════════════════════════════ */
.modal-backdrop {
  position:fixed; inset:0;
  background:rgba(0,0,0,.72);
  z-index:999;
  display:none;
  align-items:center; justify-content:center;
  padding:20px;
}
.modal-backdrop.open { display:flex; }
.modal {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:14px;
  width:780px;
  max-width:none;
  height:auto;
  max-height:90vh;
  display:flex; flex-direction:column;
  overflow:hidden;
  box-shadow:0 30px 60px rgba(0,0,0,.6);
  min-width:320px;
  min-height:200px;
  position:relative;
}
.modal.wide { width:1100px; }
.modal.xwide { width:96vw; }
/* Modal backdrop'da pad'ing yo'q qilamiz va flexni alibni resize uchun moslaymiz */
.modal-backdrop.open { padding:20px; }
/* Custom 8 ta resize handle */
.mr-handle {
  position:absolute;
  z-index:5;
  user-select:none;
  background:transparent;
}
.mr-handle.t  { top:-4px;    left:14px;   right:14px;  height:8px;  cursor:ns-resize; }
.mr-handle.b  { bottom:-4px; left:14px;   right:14px;  height:8px;  cursor:ns-resize; }
.mr-handle.l  { top:14px;    bottom:14px; left:-4px;   width:8px;   cursor:ew-resize; }
.mr-handle.r  { top:14px;    bottom:14px; right:-4px;  width:8px;   cursor:ew-resize; }
.mr-handle.tl { top:-4px;    left:-4px;   width:14px;  height:14px; cursor:nwse-resize; }
.mr-handle.tr { top:-4px;    right:-4px;  width:14px;  height:14px; cursor:nesw-resize; }
.mr-handle.bl { bottom:-4px; left:-4px;   width:14px;  height:14px; cursor:nesw-resize; }
.mr-handle.br { bottom:-4px; right:-4px;  width:16px;  height:16px; cursor:nwse-resize; }
.mr-handle:hover { background:rgba(232,103,26,.18); border-radius:4px; }
/* Pastki o'ng burchakda kichik vizual belgi */
.modal::after {
  content:'';
  position:absolute;
  right:3px; bottom:3px;
  width:12px; height:12px;
  pointer-events:none;
  opacity:.5;
  background:
    linear-gradient(135deg, transparent 50%, var(--text-muted) 55%, var(--text-muted) 60%, transparent 60%, transparent 75%, var(--text-muted) 75%, var(--text-muted) 80%, transparent 80%);
}
.modal-header {
  padding:18px 22px;
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  gap:12px;
  flex-shrink:0;
}
.modal-title {
  font-family:'Bebas Neue', sans-serif;
  font-size:20px; letter-spacing:1px;
}
.modal-close {
  background:transparent;
  color:var(--text-muted);
  font-size:20px; padding:4px 10px; line-height:1;
  border-radius:6px;
  cursor:pointer;
}
.modal-close:hover { color:var(--red); background:var(--red-bg); }
.modal-body {
  padding:20px 22px;
  overflow-y:auto;
  overflow-x:auto;
  flex:1;
  min-height:0;
}
.modal-footer {
  padding:14px 22px;
  border-top:1px solid var(--border);
  display:flex; justify-content:flex-end; gap:10px;
  flex-shrink:0;
}
.modal-input, .modal-select, .modal-textarea {
  width:100%;
  background:var(--bg); border:1px solid var(--border);
  border-radius:8px; color:var(--text);
  padding:10px 13px; font-size:13px;
  margin-top:6px;
  appearance:none;
  transition:border-color .12s;
}
.modal-textarea { resize:vertical; min-height:70px; font-family:inherit; }
.modal-input:focus, .modal-select:focus, .modal-textarea:focus { border-color:var(--orange); }

/* Brauzer standart :invalid/required qizil auraylari va autofill pushti fonni olib tashlash */
.modal-input:invalid, .modal-select:invalid, .modal-textarea:invalid,
.form-input:invalid, .mat-input:invalid, .tr3-input:invalid,
.filter-input:invalid, .filter-select:invalid, .material-note-input:invalid,
.imp-qty-input:invalid {
  box-shadow: none !important;
  outline: none !important;
}
.modal-input:-moz-ui-invalid, .modal-select:-moz-ui-invalid,
.form-input:-moz-ui-invalid, .mat-input:-moz-ui-invalid {
  box-shadow: none !important;
}
/* Autofill fonini olib tashlash (Chrome/Safari) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
select:-webkit-autofill,
textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--bg) inset !important;
  -webkit-text-fill-color: var(--text) !important;
  caret-color: var(--text) !important;
  transition: background-color 5000s ease-in-out 0s;
}
body.light input:-webkit-autofill,
body.light select:-webkit-autofill,
body.light textarea:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-card) inset !important;
  -webkit-text-fill-color: var(--text) !important;
}
.modal-select {
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%237A8099' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:32px;
}
.modal-label {
  display:block;
  font-size:11px; font-weight:700;
  color:var(--text-muted);
  text-transform:uppercase; letter-spacing:.7px;
  margin-top:14px;
}
.modal-label:first-child { margin-top:0; }
.row-2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.row-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }

/* ═══════════════════════════════════════════════════════════════════
   CONFIRM
═══════════════════════════════════════════════════════════════════ */
.confirm-overlay {
  position:fixed; inset:0;
  background:rgba(0,0,0,.7);
  z-index:1000;
  display:none;
  align-items:center; justify-content:center;
  padding:20px;
}
.confirm-overlay.open { display:flex; }
.confirm-box {
  background:var(--bg-card);
  border:1px solid var(--red);
  border-radius:12px;
  padding:28px;
  max-width:380px; width:100%;
  text-align:center;
}
.confirm-icon { font-size:36px; margin-bottom:10px; }
.confirm-title { font-size:16px; font-weight:700; margin-bottom:6px; }
.confirm-msg { font-size:13px; color:var(--text-muted); margin-bottom:20px; white-space:pre-line; } /* FIX #14: \n yangi qator */
.confirm-btns { display:flex; gap:10px; justify-content:center; }

/* ═══════════════════════════════════════════════════════════════════
   TOAST
═══════════════════════════════════════════════════════════════════ */
#toast {
  position:fixed; bottom:22px; right:22px;
  background:var(--bg-card2);
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px 18px;
  font-size:13px; font-weight:600;
  display:flex; align-items:center; gap:10px;
  max-width:340px;
  box-shadow:0 10px 30px rgba(0,0,0,.4);
  z-index:9999;
  transform:translateY(90px);
  opacity:0;
  transition:all .3s cubic-bezier(.2,.8,.4,1);
  pointer-events:none;
}
#toast.show { transform:translateY(0); opacity:1; }
#toast.success { border-color:var(--green); color:var(--green); }
#toast.error   { border-color:var(--red);   color:var(--red); }
#toast.info    { border-color:var(--blue);  color:var(--blue); }
#toast.warning { border-color:var(--amber); color:var(--amber); }

/* ═══════════════════════════════════════════════════════════════════
   QAYTA KIRISH (sessiya tugaganda) — modal va confirm ustida; ostidagi forma saqlanib qoladi
═══════════════════════════════════════════════════════════════════ */
.reauth-overlay {
  position:fixed; inset:0;
  background:rgba(0,0,0,.78);
  z-index:2000;
  display:none;
  align-items:center; justify-content:center;
  padding:20px;
}
.reauth-overlay.open { display:flex; }
.reauth-box {
  background:var(--bg-card);
  border:1px solid var(--amber);
  border-radius:14px;
  padding:26px 24px 22px;
  max-width:400px; width:100%;
  text-align:center;
  box-shadow:0 30px 60px rgba(0,0,0,.6);
  position:relative;
}
.reauth-icon  { font-size:34px; margin-bottom:8px; }
.reauth-title { font-size:17px; font-weight:800; margin-bottom:8px; color:var(--text); }
.reauth-msg   { font-size:13px; color:var(--text-muted); line-height:1.5; margin-bottom:14px; }
.reauth-user  { font-size:13px; font-weight:700; color:var(--orange); margin-bottom:10px; word-break:break-word; }
/* Parol menejerlari uchun login maydoni (ko'rinmaydi) */
.reauth-login { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; left:0; top:0; border:0; padding:0; }
.reauth-box .form-input { text-align:center; }
.reauth-error { color:var(--red); font-size:12px; font-weight:600; min-height:18px; margin:8px 0 4px; }
.reauth-btns  { display:flex; gap:10px; justify-content:center; margin-top:8px; }
.reauth-btns .btn { flex:1; }

/* ═══════════════════════════════════════════════════════════════════
   BANNER — yangi versiya chiqdi / server va sahifa versiyalari mos emas
   (modal ochiq bo'lsa uning orqasida qoladi — forma tugmalarini to'smaydi)
═══════════════════════════════════════════════════════════════════ */
.app-banner {
  position:fixed; left:50%; bottom:16px;
  transform:translateX(-50%);
  width:calc(100% - 24px); max-width:620px;
  background:var(--bg-card2);
  border:1px solid var(--blue);
  border-radius:10px;
  padding:10px 14px;
  display:none;
  align-items:center; gap:12px;
  font-size:12.5px; font-weight:600; line-height:1.45;
  color:var(--text);
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  z-index:900;
}
.app-banner.show { display:flex; }
.app-banner.warn { border-color:var(--amber); color:var(--amber); }
.app-banner-text { flex:1; }
.app-banner .btn { flex-shrink:0; }

/* Dastur versiyasi (kirish oynasi va menyu pastida) */
.app-version { text-align:center; font-size:10px; color:var(--text-dim); margin-top:10px; letter-spacing:.5px; }