/* ==========================================================================
   OIKOS MR - CSS Personalizzato
   Override sul template HUD ASP Studio (assets/css/app.min.css)
   Il template base NON va mai modificato.
   ========================================================================== */


/* ==========================================================================
   DASHBOARD
   ========================================================================== */

.dashboard-section {
    margin-bottom: 1.5rem;
}

/* --- Stat Cards --- */
.stat-card {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}

.stat-icon.primary { background: #e8f0fe; color: #1f6bff; }
.stat-icon.success { background: #e6f4ea; color: #198754; }
.stat-icon.warning { background: #fff3cd; color: #cc8a00; }
.stat-icon.info    { background: #e0f2fe; color: #0891b2; }

.stat-info {
    min-width: 0;
}

.stat-value {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
    color: #212529;
}

.stat-label {
    font-size: 0.8rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* --- Section Titles --- */
.dashboard-page .section-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e9ecef;
}

/* --- Dashboard Alerts --- */
.dashboard-alert {
    border: 1px solid #dee2e6;
    border-left: 4px solid #dee2e6;
    border-radius: 6px;
    padding: 0.875rem 1rem;
    margin-bottom: 0.75rem;
    background: #fff;
}

.dashboard-alert.alert-danger  { border-left-color: #dc3545; }
.dashboard-alert.alert-warning { border-left-color: #ffc107; }
.dashboard-alert.alert-info    { border-left-color: #0dcaf0; }
.dashboard-alert.alert-success { border-left-color: #198754; }

.alert-title {
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
}

.alert-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 700;
    margin-right: 0.5rem;
    padding: 0 4px;
}

.alert-message {
    font-size: 0.85rem;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.dashboard-alert .btn {
    font-size: 0.8rem;
}

/* --- Quick Actions --- */
.quick-action-btn {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    margin-bottom: 0.5rem;
    color: #212529;
    text-decoration: none;
    font-size: 0.9rem;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.quick-action-btn:hover {
    background-color: #f8f9fa;
    color: #1f6bff;
    border-color: #b6d4fe;
}

.quick-action-btn i {
    font-size: 1rem;
    width: 20px;
    text-align: center;
    color: #1f6bff;
}

/* --- Recent Activities Table --- */
.recent-activities-table {
    font-size: 0.875rem;
    margin-bottom: 0;
}

.recent-activities-table thead th {
    background-color: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
    padding: 0.75rem;
}

.recent-activities-table tbody td {
    padding: 0.75rem;
    vertical-align: middle;
    border-bottom: 1px solid #e9ecef;
}

.recent-activities-table tbody tr:last-child td {
    border-bottom: none;
}

.activity-badge {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    background: #e8f0fe;
    color: #1f6bff;
}


/* --------------------------------------------------------------------------
   1. SFONDO BIANCO OVUNQUE
   -------------------------------------------------------------------------- */
:root {
    --bs-body-bg: #ffffff;
    --bs-table-bg: #d2e1ff;
    --bs-btn-color: #FFFFFF;
    --bs-btn-bg: #1f6bff;
    --bs-btn-border-color: #1f6bff;
    --bs-btn-hover-color: #FFFFFF;
    --bs-btn-hover-bg: #1750bf;
    --bs-btn-border-color: #1750bf;
    --bs-link-color: #1f6bff;
    --bs-link-hover-color: #1750bf;
}

body {
    background-color: #ffffff;
}

.app-header {
    background-color: #ffffff;
}

.app-sidebar {
    background-color: #ffffff;
}

.app-content {
    background-color: #ffffff;
}

/* --------------------------------------------------------------------------
   2. NESSUNA OMBRA
   -------------------------------------------------------------------------- */
.card,
.app-header,
.app-sidebar,
.modal-content,
.dropdown-menu,
.toast {
    box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   3. LAYOUT STRUCTURE
   -------------------------------------------------------------------------- */

.app-header {
    border-bottom: 1px solid var(--bs-border-color);
}

    .app-header .brand .brand-logo {
        padding: 0.3rem 0;
    }

    .app-header .menu .menu-search .menu-search-input .form-control {
        background: white;
        border: 1px solid var(--bs-border-color);
    }



/* --------------------------------------------------------------------------
   LAYOUT STRUCTURE - FIXED PAGE TITLE BAR
   -------------------------------------------------------------------------- */
/*
 * Stili per la barra del titolo fissa
 */
#page-title-bar {
    position: fixed;
    /* Altezza dell'header principale */
    top: 3.75rem;
    /* Larghezza della sidebar */
    left: 15rem;
    right: 0;
    z-index: 1010; /* Inferiore all'header (1030) ma superiore al contenuto */
    /* background: var(--bs-body-bg);*/
    background: #fff;
    padding: 1rem 3.125rem;
    border-bottom: 1px solid var(--bs-border-color);
}

    #page-title-bar .page-header {
        margin-bottom: 0;
    }


/*
 * Gestione per la sidebar minimizzata
 */
.app-sidebar-minified #page-title-bar {
    /* Larghezza della sidebar minimizzata */
    left: 4.0625rem;
}

/*
 * Gestione per la visualizzazione su dispositivi mobili
 */
@media (max-width: 991.98px) {
    #page-title-bar {
        left: 0;
        padding: 1rem 1.25rem;
    }
}



#page-title-bar.with-tabs {
    padding-bottom: 0;
}



.with-tabs .nav-tabs-page-title {
    margin-top: 0.6rem;
    border-bottom: none;
}

.with-tabs .nav-tabs .nav-link {
    font-weight: bold;
}


    .with-tabs .nav-tabs .nav-link.active {
        background: var(--bs-body-bg);
    }






/* --------------------------------------------------------------------------
   DEVEXTREME GRID CUSTOMIZATION
   -------------------------------------------------------------------------- */
.dx-header-row {
    background-color: var(--bs-table-bg);
    color: var(--bs-body-color);
    font-weight: 600;
}

.dx-button-mode-contained {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg);
    border-color: var(--bs-btn-bg);
}
.dx-button-mode-contained:hover {
    color: var(--bs-btn-hover-color);
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-bg);
}

    .dx-button-mode-contained .dx-icon {
        color: var(--bs-btn-color);
    }


.dx-datagrid .dx-link {
    color: var(--bs-link-color);
}
.dx-datagrid td.dx-command-edit:hover .dx-link,
.dx-datagrid td.dx-command-edit:hover .dx-link::before {
    color: var(--bs-link-hover-color);
}



/* --------------------------------------------------------------------------
   FORM
   -------------------------------------------------------------------------- */

.card-form {
    border-color: #f5f7fa;
}

    .card-form .card-header {
        background-color: #f5f7fa;
        border-color: #f5f7fa;
    }
    .card-form .card-body {
        background-color: #f5f7fa;
    }
    .card-form .card-footer {
        background-color: #f5f7fa;
        border-color: #f5f7fa;
    }



/* --------------------------------------------------------------------------
   PATIENT DETAILS
   -------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
   PATIENT DETAILS - ANAMNESIS
   -------------------------------------------------------------------------- */

/* Note e Annotazioni: altezza uniforme in tutte le sezioni dell'anamnesi.
   Sostituisce la dipendenza dall'attributo rows="28" del markup. */
/* height (non min-height): rows="28" rende le textarea ~680px, e un min-height
   inferiore non le accorcerebbe. height fissa l'altezza uniforme a 400px.
   textarea.<classe> pareggia la specificità di Bootstrap (textarea.form-control). */
textarea.anamnesi-notes-textarea {
    height: 400px;
}

/* Eccezione: il "Riepilogo Generale" resta compatto (altezza da rows="8"). */
#generalNotes.anamnesi-notes-textarea {
    height: auto;
}

/* Version history dropdown */
.version-history-dropdown {
    min-width: 320px;
}
.version-history-dropdown .dropdown-item {
    padding: 0.5rem 1rem;
    white-space: normal;
}
.version-history-dropdown .dropdown-item.active small {
    color: rgba(255, 255, 255, 0.85) !important;
}
.version-history-dropdown .dropdown-item.active .text-muted {
    color: rgba(255, 255, 255, 0.75) !important;
}

.allergia-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.allergia-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .allergia-header:hover {
        /* background-color: #f8f9fa; */
        background-color: #dee9ff;
    }

.allergia-chevron {
    transition: transform 0.3s ease;
    font-size: 0.75rem;
    color: #6c757d;
    width: 1rem;
    text-align: center;
}

.allergia-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

.allergia-body {
    padding: 0 1rem 1rem 1rem;
    border-top: 1px solid #eee;
}

.add-allergy-btn {
    border: 1px dashed #ccc;
    border-radius: 8px;
    cursor: pointer;
}

/* APR (Anamnesi Patologica Remota) - same pattern as allergies */
.apr-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.apr-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .apr-header:hover {
        background-color: #dee9ff;
    }

.apr-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

/* --- Malattie Croniche items --- */
.chronic-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.chronic-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .chronic-header:hover {
        background-color: #dee9ff;
    }

.chronic-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

/* --- Interventi Chirurgici items --- */
.surgical-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.surgical-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .surgical-header:hover {
        background-color: #dee9ff;
    }

.surgical-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

/* --- Terapia Cronica items --- */
.therapy-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.therapy-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .therapy-header:hover {
        background-color: #dee9ff;
    }

.therapy-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

/* --- Problemi in Atto items --- */
.current-problem-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.current-problem-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .current-problem-header:hover {
        background-color: #dee9ff;
    }

.current-problem-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}

/* --- Problemi Risolti items --- */
.resolved-problem-item {
    padding: 0;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
}

.resolved-problem-header {
    padding: 0.75rem 1rem;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease;
}

    .resolved-problem-header:hover {
        background-color: #dee9ff;
    }

.resolved-problem-header[aria-expanded="true"] .allergia-chevron {
    transform: rotate(90deg);
}


/* ==========================================================================
   DIARIO CLINICO
   ========================================================================== */

.diary-entry {
    transition: opacity 0.3s ease;
}

.diary-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.diary-entry-text {
    white-space: pre-wrap;
    word-wrap: break-word;
    line-height: 1.6;
}

.diary-entry-deleted .diary-entry-text {
    text-decoration: line-through;
    color: #6c757d;
}

/* --- Sidebar Anamnesi nel Diario --- */
.diary-sidebar {
    position: sticky;
    top: 1rem;
}

.diary-sidebar .card {
    font-size: 0.875rem;
}

.diary-sidebar .card-header {
    padding: 0.4rem 0.75rem;
}

.diary-sidebar .card-body {
    max-height: 200px;
    overflow-y: auto;
}

/* ==========================================================================
   PRESCRIZIONI
   ========================================================================== */

.prescription-entry {
    transition: opacity 0.3s ease;
}

.prescription-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.prescription-entry-deleted .prescription-description {
    text-decoration: line-through;
    color: #6c757d;
}

.prescription-entry-deleted .prescription-indication {
    text-decoration: line-through;
    color: #6c757d;
}

.prescription-indication {
    line-height: 1.5;
}

.prescription-notes {
    line-height: 1.4;
    font-style: italic;
}

.prescription-report-link {
    font-size: 0.875rem;
    line-height: 1.5;
}

.prescription-report-link a {
    text-decoration: none;
}

.prescription-report-link a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   FARMACI
   ========================================================================== */

.medication-entry {
    transition: opacity 0.3s ease;
}

.medication-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.medication-entry-deleted .medication-description {
    text-decoration: line-through;
    color: #6c757d;
}

.medication-entry-deleted .medication-posology {
    text-decoration: line-through;
    color: #6c757d;
}

.medication-posology {
    line-height: 1.5;
}

.medication-notes {
    line-height: 1.4;
    font-style: italic;
}

/* ==========================================================================
   REFERTI
   ========================================================================== */

.report-entry {
    transition: opacity 0.3s ease;
}

.report-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.report-entry-deleted .report-title {
    text-decoration: line-through;
    color: #6c757d;
}

.report-entry-deleted .report-info {
    text-decoration: line-through;
    color: #6c757d;
}

.report-info {
    line-height: 1.5;
}

.report-notes {
    line-height: 1.4;
    font-style: italic;
}

/* ==========================================================================
   DOCUMENTI
   ========================================================================== */

.document-entry {
    transition: opacity 0.3s ease;
}

.document-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.document-entry-deleted .document-title {
    text-decoration: line-through;
    color: #6c757d;
}

.document-entry-deleted .document-info {
    text-decoration: line-through;
    color: #6c757d;
}

.document-info {
    line-height: 1.5;
}

.document-notes {
    line-height: 1.4;
    font-style: italic;
}


/* ==========================================================================
   VALIDATION — ASP.NET Unobtrusive → Bootstrap 5 bridge
   ========================================================================== */

.field-validation-error {
    display: block;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875em;
    color: var(--bs-danger);
}

.field-validation-valid {
    display: none;
}

.validation-summary-errors {
    color: var(--bs-danger);
}

.input-group .is-invalid {
    z-index: 3;
}


/* ==========================================================================
   APPUNTAMENTI / SCHEDULER
   ========================================================================== */

.appointments-page {
    padding: 0;
}

/* View switcher (Giorno/Settimana/Mese/Agenda): selected button */
.appointments-page .dx-buttongroup-item.dx-item-selected {
    background-color: #fff !important;
    color: var(--dx-color-primary) !important;
}

.appointments-page .dx-buttongroup-item.dx-item-selected .dx-button-text {
    color: var(--dx-color-primary) !important;
}

/* Custom appointment template */
.appt-template {
    padding: 2px 4px;
    font-size: 12px;
    line-height: 1.3;
    overflow: hidden;
}

.appt-time {
    font-weight: 600;
    font-size: 11px;
    opacity: 0.9;
}

.appt-patient {
    font-weight: 500;
}

.appt-type {
    font-size: 11px;
    opacity: 0.8;
}

/* Tooltip actions */
.appt-tooltip .btn {
    font-size: 11px;
    padding: 2px 8px;
}

/* Popup tooltip appuntamenti: di default ha un'altezza fissa che taglia il
   contenuto con una scrollbar verticale. Lasciamo adattare l'altezza al
   contenuto (solo per il nostro tooltip, via :has(.appt-tooltip)). */
.dx-popup-inherit-height:has(.appt-tooltip),
.dx-popup-inherit-height:has(.appt-tooltip) .dx-popup-content {
    height: auto !important;
    max-height: none !important;
}

/* Patient search results dropdown */
#patientSearchResults {
    max-height: 200px;
    overflow-y: auto;
    width: calc(100% - 2rem);
}

#patientSearchResults .list-group-item {
    font-size: 13px;
}

/* Patient tab appointment entries */
.appointment-entry {
    transition: opacity 0.3s ease;
}

.appointment-entry-deleted {
    opacity: 0.6;
    background-color: #f8f9fa;
}

.appointment-entry-deleted .appointment-description {
    text-decoration: line-through;
    color: #6c757d;
}

.appointment-notes {
    line-height: 1.4;
    font-style: italic;
}


/* ============================================================
   REQUIRED FIELD ASTERISKS
   ============================================================ */
.required-field::after {
    content: " *";
    color: #dc3545;
    font-weight: bold;
}


/* ==========================================================================
   RIEPILOGO TAB
   ========================================================================== */

/* --- Sidebar Navigation Index --- */
.riepilogo-index {
    position: sticky;
    top: 1rem;
}

.riepilogo-nav .nav-link {
    padding: 0.35rem 0.75rem;
    font-size: 0.85rem;
    color: #495057;
    border-radius: 4px;
    transition: background-color 0.15s ease;
}

.riepilogo-nav .nav-link:hover {
    background-color: #e8f0fe;
    color: #1f6bff;
}

.riepilogo-nav .nav-link.active {
    background-color: #1f6bff;
    color: #fff;
}

.riepilogo-nav .nav-link i {
    font-size: 0.75rem;
    opacity: 0.7;
}

/* --- Sections --- */
.riepilogo-section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

.riepilogo-section:last-child {
    border-bottom: none;
}

.riepilogo-section-title {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
}

/* --- Diary entries in riepilogo --- */
.riepilogo-scroll-container {
    max-height: 600px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.5rem;
}

.riepilogo-diary-entry {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f0f0f0;
}

.riepilogo-diary-entry:last-child {
    border-bottom: none;
}

/* --- Tables in riepilogo --- */
.riepilogo-section .table {
    font-size: 0.85rem;
}

.riepilogo-section .table th {
    font-size: 0.8rem;
    white-space: nowrap;
}


/* ==========================================================================
   PRINT STYLES
   ========================================================================== */
@media print {
    /* Hide non-content elements */
    .app-header,
    .app-sidebar,
    .app-sidebar-bg,
    #page-title-bar,
    .riepilogo-index,
    .d-lg-none .btn,
    .nav-pills,
    .toast-container,
    .btn {
        display: none !important;
    }

    /* Make content full width */
    .app-content {
        margin-left: 0 !important;
        padding: 0 !important;
    }

    .tab-content > .tab-pane {
        display: none !important;
    }

    #riepilogo {
        display: block !important;
        opacity: 1 !important;
    }

    #riepilogo .col-lg-9 {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    #riepilogo .col-lg-3 {
        display: none !important;
    }

    /* Print header */
    #riepilogo::before {
        content: "Riepilogo Cartella Clinica — OikosMR";
        display: block;
        font-size: 14pt;
        font-weight: bold;
        text-align: center;
        margin-bottom: 1rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #000;
    }

    /* Print footer */
    #riepilogo::after {
        content: "Stampato il: " attr(data-print-date) " — OikosMR";
        display: block;
        text-align: center;
        font-size: 9pt;
        color: #666;
        margin-top: 1rem;
        padding-top: 0.5rem;
        border-top: 1px solid #ccc;
    }

    /* Section page breaks */
    .riepilogo-section {
        page-break-inside: avoid;
    }

    /* Remove scroll container in print */
    .riepilogo-scroll-container {
        max-height: none !important;
        overflow: visible !important;
        border: none !important;
    }

    /* Ensure tables print well */
    .table-responsive {
        overflow: visible !important;
    }

    /* Badges readable in B/W */
    .badge {
        border: 1px solid #999 !important;
    }
}