/**
 * النوافذ المنبثقة للنماذج (UI::modal_open + js/components/modal.js)
 * (جزء من المكونات المركزية: تُحمّل كلها عبر المقبض tnt-components)
 */

.tnt .tnt-modal { padding: 0; border: 0; background: transparent; max-width: calc(100vw - 32px); width: 560px; max-height: calc(100vh - 48px); overflow: visible; color: var(--tnt-text); font-family: var(--tnt-font); }
.tnt .tnt-modal--lg { width: 820px; }
.tnt .tnt-modal::backdrop { background: rgba(var(--tnt-navy-950-rgb), .55); backdrop-filter: blur(4px); }
.tnt .tnt-modal[open] { animation: tnt-modal-in .22s var(--tnt-ease); }
.tnt .tnt-modal[open]::backdrop { animation: tnt-fade .22s ease; }
@keyframes tnt-modal-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes tnt-fade { from { opacity: 0; } to { opacity: 1; } }
.tnt .tnt-modal__box { background: var(--tnt-surface); border-radius: var(--tnt-radius-lg); box-shadow: var(--tnt-shadow-lg); display: flex; flex-direction: column; max-height: calc(100vh - 48px); overflow: hidden; }
.tnt .tnt-modal__head { display: flex; align-items: center; gap: 12px; padding: 18px 22px; border-bottom: 1px solid var(--tnt-border); background: linear-gradient(135deg, var(--tnt-navy-900), var(--tnt-navy-700)); color: #fff; }
.tnt .tnt-modal__icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .1); color: var(--tnt-gold); flex-shrink: 0; }
.tnt .tnt-modal__titles { flex: 1; min-width: 0; }
.tnt .tnt-modal__title { font-size: 17px; font-weight: 800; color: #fff; margin: 0; }
.tnt .tnt-modal__subtitle { font-size: 13px; color: rgba(255, 255, 255, .7); margin-top: 2px; }
.tnt .tnt-modal__close { background: rgba(255, 255, 255, .08); border: 0; color: #fff; width: 34px; height: 34px; border-radius: 10px; cursor: pointer; display: grid; place-items: center; }
.tnt .tnt-modal__close:hover { background: rgba(255, 255, 255, .18); }
.tnt .tnt-modal__body { padding: 22px; overflow-y: auto; }
.tnt .tnt-modal__body .tnt-form-actions { margin-top: 18px; }


/* التوسيط في منتصف الشاشة دائماً (بعض أنماط ووردبريس تلغي توسيط <dialog> الافتراضي) */
.tnt .tnt-modal[open], .tnt .tnt-popup[open] { position: fixed; inset: 0; margin: auto; height: fit-content; }