/**
 * Medaid UI: componenti condivisi della semplificazione 2026-11.
 * - conferme (MedaidUI.confirm e MedaidApp.confirmDialog), avvisi, pulsante "pericolo"
 * - movimento: una sola durata breve per pannelli e finestre, niente animazioni con reduced-motion
 * - "Da compilare": sottolineatura arancione leggera sui campi e sulle sezioni ancora vuote
 */

:root {
    --medaid-motion-fast: 140ms;
    --medaid-motion: 200ms;
    --medaid-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
    --medaid-to-fill: #e8590c;
    --medaid-to-fill-soft: rgba(232, 89, 12, 0.08);
    --medaid-danger-strong: #b91c1c;
}

/* ---------- Conferme ---------- */

.medaid-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 10200;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 12vh 16px 16px;
    background: rgba(33, 37, 41, 0.38);
    opacity: 0;
    transition: opacity var(--medaid-motion-fast) ease;
}

.medaid-dialog-overlay.active {
    opacity: 1;
}

.medaid-dialog {
    width: 100%;
    max-width: 440px;
    background: var(--medaid-bg-elevated, #fff);
    color: var(--medaid-text, #212529);
    border-radius: var(--medaid-radius-lg, 12px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2), 0 10px 10px -5px rgba(0, 0, 0, 0.06);
    transform: translateY(-8px) scale(0.98);
    transition: transform var(--medaid-motion) var(--medaid-ease-out);
}

.medaid-dialog-overlay.active .medaid-dialog {
    transform: none;
}

.medaid-dialog-body {
    padding: 20px 22px 4px;
}

.medaid-dialog-title {
    margin: 0 0 8px;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.35;
}

.medaid-dialog-body p,
.medaid-dialog-message {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--medaid-text-secondary, #495057);
    white-space: pre-line;
}

.medaid-dialog-title + .medaid-dialog-message {
    color: var(--medaid-text-secondary, #495057);
}

.medaid-dialog-body > p:only-child {
    color: var(--medaid-text, #212529);
}

.medaid-dialog--with-content {
    max-width: 520px;
}

/* Documenti collegati nella finestra di eliminazione della visita */
.medaid-linked-docs {
    margin-top: 14px;
}

.medaid-linked-docs-warning {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 10px 12px;
    border-radius: var(--medaid-radius, 8px);
    background: rgba(185, 28, 28, 0.07);
    color: var(--medaid-danger-strong);
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.4;
}

.medaid-linked-docs-hint {
    margin: 10px 0 6px !important;
    font-size: 0.875rem !important;
}

.medaid-linked-docs-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 38vh;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid var(--medaid-border, #dee2e6);
    border-radius: var(--medaid-radius, 8px);
}

.medaid-linked-docs-list li + li {
    border-top: 1px solid var(--medaid-border, #dee2e6);
}

.medaid-linked-docs-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin: 0;
    padding: 10px 12px;
    cursor: pointer;
}

.medaid-linked-docs-item.is-locked {
    cursor: default;
}

.medaid-linked-docs-item input {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
}

.medaid-linked-docs-text {
    min-width: 0;
    flex: 1 1 auto;
}

.medaid-linked-docs-title {
    display: block;
    font-weight: 600;
    color: var(--medaid-text, #212529);
    overflow-wrap: anywhere;
}

.medaid-linked-docs-meta,
.medaid-linked-docs-note {
    display: block;
    font-size: 0.8125rem;
    color: var(--medaid-text-muted, #6c757d);
}

.medaid-linked-docs-state {
    flex: 0 0 auto;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(185, 28, 28, 0.08);
    color: var(--medaid-danger-strong);
    white-space: nowrap;
}

.medaid-linked-docs-item.is-kept .medaid-linked-docs-state {
    background: rgba(25, 135, 84, 0.1);
    color: #146c43;
}

.medaid-linked-docs-loading {
    margin-top: 12px !important;
    font-size: 0.875rem !important;
}

.medaid-dialog-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    padding: 18px 22px 20px;
}

.medaid-dialog-footer .medaid-btn {
    min-height: 44px;
}

.medaid-btn-danger,
.medaid-btn.medaid-btn-danger {
    background: var(--medaid-danger-strong);
    color: #fff;
}

.medaid-btn-danger:hover,
.medaid-btn.medaid-btn-danger:hover {
    background: #991b1b;
    color: #fff;
}

/* ---------- Avvisi ---------- */

/* app.js storico usa medaid-toast-hiding: stessa uscita di medaid-toast-exit. */
.medaid-toast-hiding {
    animation: medaidToastOut 0.2s ease forwards;
}

.medaid-toast {
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--medaid-text, #212529);
}

.medaid-toast-icon {
    color: #16a34a;
}

.medaid-toast--error .medaid-toast-icon { color: #dc2626; }
.medaid-toast--warning .medaid-toast-icon { color: #d97706; }
.medaid-toast--info .medaid-toast-icon { color: var(--medaid-primary, #3A6A6A); }

.medaid-toast-message {
    flex: 1;
    min-width: 0;
}

.medaid-toast-action {
    flex-shrink: 0;
    min-height: 32px;
    padding: 0 8px;
    border: 0;
    background: none;
    color: var(--medaid-primary, #3A6A6A);
    font: inherit;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

.medaid-toast-close {
    width: 32px;
    height: 32px;
}

@media (max-width: 575px) {
    .medaid-toast-container {
        left: 12px;
        right: 12px;
        bottom: 12px;
        max-width: none;
    }
}

/* ---------- "Da compilare" ---------- */

.medaid-to-fill {
    border-bottom: 2px solid var(--medaid-to-fill) !important;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.medaid-to-fill-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: #9a3412;
    background: var(--medaid-to-fill-soft);
    border-radius: 999px;
    padding: 1px 8px;
}

.medaid-from-source-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--medaid-primary-dark, #1f3d3d);
    background: var(--medaid-primary-light, rgba(58, 106, 106, 0.1));
    border-radius: 999px;
    padding: 1px 8px;
}

/* ---------- Finestre (.medaid-modal) ---------- */

/* Intestazione e piede sempre visibili, scorre solo il corpo. Il corpo aveva
   max-height: calc(90vh - 140px): con il piede in colonna (calendario.css sotto i
   768px) intestazione + piede superavano 140px e la finestra, con overflow nascosto,
   tagliava i pulsanti (es. "Conferma e genera PDF" della firma su tablet). */
.medaid-modal-container,
.medaid-modal-content {
    display: flex;
    flex-direction: column;
}

.medaid-modal-container > .medaid-modal-header,
.medaid-modal-container > .medaid-modal-footer,
.medaid-modal-content > .medaid-modal-header,
.medaid-modal-content > .medaid-modal-footer {
    flex-shrink: 0;
}

.medaid-modal-container > form,
.medaid-modal-content > form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.medaid-modal-container > .medaid-modal-body,
.medaid-modal-content > .medaid-modal-body,
.medaid-modal-container > form > .medaid-modal-body,
.medaid-modal-content > form > .medaid-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
}

/* Con una finestra aperta l'assistente e i pulsanti flottanti non le stanno sopra. */
body:has(.medaid-modal.show) .mai-launcher,
body:has(.medaid-modal.show) .qa-visit-circle-btn-floating,
body:has(.medaid-modal.show) .medaid-visit-folder-fab,
body:has(.medaid-modal.show) .medaid-booking-fab,
html.medaid-vd-modal-open .mai-launcher,
html.medaid-vd-modal-open .qa-visit-circle-btn-floating,
html.medaid-vd-modal-open .medaid-visit-folder-fab,
html.medaid-vd-modal-open .medaid-booking-fab {
    visibility: hidden;
}

/* ---------- Pagine incorporate in una finestra (?embed=1) ---------- */

/* Dentro la finestra servono solo il modulo e i suoi avvisi: niente assistente, promemoria o guida. */
body.medaid-embed .mai-launcher,
body.medaid-embed .mai-panel,
body.medaid-embed .medaid-setup-reminder,
body.medaid-embed .medaid-guida-hint,
body.medaid-embed .medaid-booking-fab {
    display: none !important;
}

/* Con una finestra di compilazione aperta (sezione della visita) i pulsanti flottanti
   non devono stare sopra la finestra. */
html.medaid-vsheet-open .mai-launcher,
html.medaid-vsheet-open .qa-visit-circle-btn-floating,
html.medaid-vsheet-open .medaid-visit-folder-fab,
html.medaid-vsheet-open .medaid-setup-reminder {
    visibility: hidden;
}

/* ---------- Tema scuro ---------- */

[data-theme="dark"] .medaid-dialog {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .medaid-linked-docs-warning,
[data-theme="dark"] .medaid-linked-docs-state {
    color: #fca5a5;
    background: rgba(248, 113, 113, 0.14);
}

[data-theme="dark"] .medaid-linked-docs-item.is-kept .medaid-linked-docs-state {
    color: #86efac;
    background: rgba(74, 222, 128, 0.14);
}

[data-theme="dark"] .medaid-to-fill-badge {
    color: #fdba74;
    background: rgba(232, 89, 12, 0.18);
}

[data-theme="dark"] .medaid-toast {
    color: var(--medaid-text, #e9ecef);
}

/* ---------- Movimento ridotto ---------- */

@media (prefers-reduced-motion: reduce) {
    .medaid-dialog-overlay,
    .medaid-dialog,
    .medaid-toast,
    .medaid-toast-exit,
    .medaid-toast-hiding {
        transition: none !important;
        animation: none !important;
    }
}
