/* Mistress Advisor -- Media guard: avvisi uniformi su frontend e wp-admin.
   Niente alert() del browser: bloccano la pagina, non si possono stilizzare e
   su mobile sono pessimi. Qui: messaggio inline sotto il campo (l'utente vede
   QUALE file ha fallito e perche') + un avviso flottante coerente. */

.ma-mg-msgs { margin: 10px 0 0; display: flex; flex-direction: column; gap: 8px; }

.ma-mg-msg {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 11px 14px; border-radius: 8px;
    font-size: 13.5px; line-height: 1.5;
    border: 1px solid transparent;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    animation: ma-mg-in .18s ease-out;
}
@keyframes ma-mg-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.ma-mg-msg--error   { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.ma-mg-msg--warning { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.ma-mg-msg--success { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }

.ma-mg-msg__icon { flex: 0 0 auto; font-size: 15px; line-height: 1.4; }
.ma-mg-msg__body { flex: 1 1 auto; min-width: 0; }
.ma-mg-msg__file { font-weight: 600; word-break: break-all; }
.ma-mg-msg__hint { display: block; margin-top: 3px; opacity: .85; font-size: 12.5px; }
.ma-mg-msg__close {
    flex: 0 0 auto; background: none; border: 0; cursor: pointer;
    font-size: 17px; line-height: 1; opacity: .5; color: inherit; padding: 0 2px;
}
.ma-mg-msg__close:hover { opacity: 1; }

/* Avviso flottante: usato quando il campo non e' visibile (es. libreria media) */
.ma-mg-toasts {
    position: fixed; right: 18px; bottom: 18px; z-index: 999999;
    display: flex; flex-direction: column; gap: 9px; max-width: min(420px, calc(100vw - 36px));
}
.ma-mg-toasts .ma-mg-msg { box-shadow: 0 6px 22px rgba(0,0,0,.16); }

/* Indicatore di compressione in corso */
.ma-mg-working {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 13px; color: #475569; margin-top: 8px;
}
.ma-mg-working__dot {
    width: 9px; height: 9px; border-radius: 50%; background: #2563eb;
    animation: ma-mg-pulse 1s ease-in-out infinite;
}
@keyframes ma-mg-pulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }

/* In wp-admin allineiamo un po' i margini */
.wp-admin .ma-mg-msgs { max-width: 780px; }