/* styles.css */
.centered-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f0f0f0;
}

.rotate {
    animation: spin 5s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.mud-nav-item.hover-rounded-pill .mud-nav-link {
    transition: border-radius 0.25s ease, background-color 0.25s ease;
}

    .mud-nav-item.hover-rounded-pill .mud-nav-link:hover {
        border-radius: 50rem !important;
        background-color: var(--mud-palette-primary-hover);
    }

/* Hide ALL scrollbars globally - including MudBlazor components */
* {
    /* Firefox */
    scrollbar-width: none !important;
    -ms-overflow-style: none !important; /* Internet Explorer 10+ */
}

/* WebKit browsers (Chrome, Safari, Edge) */
*::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

*::-webkit-scrollbar-track {
    display: none !important;
}

*::-webkit-scrollbar-thumb {
    display: none !important;
}

*::-webkit-scrollbar-corner {
    display: none !important;
}

/* Specific MudBlazor components */
.mud-scrollbar,
.mud-scrollbar-horizontal,
.mud-scrollbar-vertical,
.mud-dialog-content,
.mud-drawer-content,
.mud-main-content,
.mud-container,
.mud-paper,
.mud-card,
.mud-list,
.mud-table-container,
.mud-data-table,
.mud-select-menu,
.mud-autocomplete-menu,
.mud-menu,
.mud-popover,
.mud-tooltip,
.mud-snackbar,
.mud-dialog,
.mud-drawer,
.mud-navigation-menu,
.mud-nav-menu,
.mud-tabs,
.mud-tab-panels,
.mud-stepper,
.mud-expansion-panels,
.mud-treeview,
.mud-timeline,
.mud-grid,
.mud-layout,
.mud-app-bar,
.mud-toolbar,
.mud-footer,
.mud-bottom-nav,
.mud-carousel,
.mud-chart,
.mud-progress,
.mud-linear-progress,
.mud-circular-progress,
.mud-rating,
.mud-slider,
.mud-range-slider,
.mud-switch,
.mud-checkbox,
.mud-radio,
.mud-select,
.mud-autocomplete,
.mud-combobox,
.mud-text-field,
.mud-textarea,
.mud-form,
.mud-form-control,
.mud-input-control,
.mud-input,
.mud-input-adornment,
.mud-input-label,
.mud-input-helper-text,
.mud-input-error,
.mud-button,
.mud-icon-button,
.mud-fab,
.mud-extended-fab,
.mud-toggle-button,
.mud-chip,
.mud-badge,
.mud-avatar,
.mud-avatar-group,
.mud-divider,
.mud-spacer,
.mud-separator,
.mud-image,
.mud-typography,
.mud-link,
.mud-breadcrumbs,
.mud-pagination,
.mud-table-pagination,
.mud-data-table-pagination,
.mud-data-table-toolbar,
.mud-data-table-head,
.mud-data-table-body,
.mud-data-table-row,
.mud-data-table-cell,
.mud-data-table-header-cell,
.mud-data-table-footer-cell,
.mud-data-table-group-header,
.mud-data-table-group-footer,
.mud-data-table-group-row,
.mud-data-table-group-cell,
.mud-data-table-group-header-cell,
.mud-data-table-group-footer-cell,
.mud-data-table-group-row-cell,
.mud-data-table-group-row-header-cell,
.mud-data-table-group-row-footer-cell,
.mud-data-table-group-row-group-cell,
.mud-data-table-group-row-group-header-cell,
.mud-data-table-group-row-group-footer-cell,
.mud-data-table-group-row-group-row-cell,
.mud-data-table-group-row-group-row-header-cell,
.mud-data-table-group-row-group-row-footer-cell {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

.mud-scrollbar::-webkit-scrollbar,
.mud-scrollbar-horizontal::-webkit-scrollbar,
.mud-scrollbar-vertical::-webkit-scrollbar,
.mud-dialog-content::-webkit-scrollbar,
.mud-drawer-content::-webkit-scrollbar,
.mud-main-content::-webkit-scrollbar,
.mud-container::-webkit-scrollbar,
.mud-paper::-webkit-scrollbar,
.mud-card::-webkit-scrollbar,
.mud-list::-webkit-scrollbar,
.mud-table-container::-webkit-scrollbar,
.mud-data-table::-webkit-scrollbar,
.mud-select-menu::-webkit-scrollbar,
.mud-autocomplete-menu::-webkit-scrollbar,
.mud-menu::-webkit-scrollbar,
.mud-popover::-webkit-scrollbar,
.mud-tooltip::-webkit-scrollbar,
.mud-dialog::-webkit-scrollbar,
.mud-drawer::-webkit-scrollbar,
.mud-navigation-menu::-webkit-scrollbar,
.mud-nav-menu::-webkit-scrollbar,
.mud-tabs::-webkit-scrollbar,
.mud-tab-panels::-webkit-scrollbar,
.mud-stepper::-webkit-scrollbar,
.mud-expansion-panels::-webkit-scrollbar,
.mud-treeview::-webkit-scrollbar,
.mud-timeline::-webkit-scrollbar,
.mud-grid::-webkit-scrollbar,
.mud-layout::-webkit-scrollbar,
.mud-app-bar::-webkit-scrollbar,
.mud-toolbar::-webkit-scrollbar,
.mud-footer::-webkit-scrollbar,
.mud-bottom-nav::-webkit-scrollbar,
.mud-carousel::-webkit-scrollbar,
.mud-chart::-webkit-scrollbar,
.mud-progress::-webkit-scrollbar,
.mud-linear-progress::-webkit-scrollbar,
.mud-circular-progress::-webkit-scrollbar,
.mud-rating::-webkit-scrollbar,
.mud-slider::-webkit-scrollbar,
.mud-range-slider::-webkit-scrollbar,
.mud-switch::-webkit-scrollbar,
.mud-checkbox::-webkit-scrollbar,
.mud-radio::-webkit-scrollbar,
.mud-select::-webkit-scrollbar,
.mud-autocomplete::-webkit-scrollbar,
.mud-combobox::-webkit-scrollbar,
.mud-text-field::-webkit-scrollbar,
.mud-textarea::-webkit-scrollbar,
.mud-form::-webkit-scrollbar,
.mud-form-control::-webkit-scrollbar,
.mud-input-control::-webkit-scrollbar,
.mud-input::-webkit-scrollbar,
.mud-input-adornment::-webkit-scrollbar,
.mud-input-label::-webkit-scrollbar,
.mud-input-helper-text::-webkit-scrollbar,
.mud-input-error::-webkit-scrollbar,
.mud-button::-webkit-scrollbar,
.mud-icon-button::-webkit-scrollbar,
.mud-fab::-webkit-scrollbar,
.mud-extended-fab::-webkit-scrollbar,
.mud-toggle-button::-webkit-scrollbar,
.mud-chip::-webkit-scrollbar,
.mud-badge::-webkit-scrollbar,
.mud-avatar::-webkit-scrollbar,
.mud-avatar-group::-webkit-scrollbar,
.mud-divider::-webkit-scrollbar,
.mud-spacer::-webkit-scrollbar,
.mud-separator::-webkit-scrollbar,
.mud-image::-webkit-scrollbar,
.mud-typography::-webkit-scrollbar,
.mud-link::-webkit-scrollbar,
.mud-breadcrumbs::-webkit-scrollbar,
.mud-pagination::-webkit-scrollbar,
.mud-table-pagination::-webkit-scrollbar,
.mud-data-table-pagination::-webkit-scrollbar,
.mud-data-table-toolbar::-webkit-scrollbar,
.mud-data-table-head::-webkit-scrollbar,
.mud-data-table-body::-webkit-scrollbar,
.mud-data-table-row::-webkit-scrollbar,
.mud-data-table-cell::-webkit-scrollbar,
.mud-data-table-header-cell::-webkit-scrollbar,
.mud-data-table-footer-cell::-webkit-scrollbar,
.mud-data-table-group-header::-webkit-scrollbar,
.mud-data-table-group-footer::-webkit-scrollbar,
.mud-data-table-group-row::-webkit-scrollbar,
.mud-data-table-group-cell::-webkit-scrollbar,
.mud-data-table-group-header-cell::-webkit-scrollbar,
.mud-data-table-group-footer-cell::-webkit-scrollbar,
.mud-data-table-group-row-cell::-webkit-scrollbar,
.mud-data-table-group-row-header-cell::-webkit-scrollbar,
.mud-data-table-group-row-footer-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-header-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-footer-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-row-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-row-header-cell::-webkit-scrollbar,
.mud-data-table-group-row-group-row-footer-cell::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Ensure scrolling still works */
html, body {
    overflow: auto !important;
}

/* Additional global rules */
* {
    scrollbar-gutter: stable !important;
}

/* Drawer Back Button Styles */
.drawer-back-button {
    border-radius: 50% !important;
    background-color: var(--mud-palette-primary) !important;
    color: var(--mud-palette-primary-text) !important;
    margin-right: 8px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s ease !important;
}

.drawer-back-button:hover {
    background-color: var(--mud-palette-primary-darken) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

.drawer-back-button:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

/* Standardized Drawer Headers */
.drawer-header {
    background: var(--mud-palette-primary) !important;
    color: var(--mud-palette-primary-text) !important;
    padding: 16px !important;
    border-radius: 0 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.drawer-header h2,
.drawer-header .mud-text,
.drawer-header .mud-typography {
    font-size: 18px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: white !important;
}

.drawer-header .mud-stack {
    width: 100% !important;
}

.drawer-header .mud-avatar,
.drawer-header .mud-icon,
.drawer-header .mud-icon-button {
    color: white !important;
}

.drawer-header .mud-avatar .mud-icon {
    color: var(--mud-palette-primary) !important;
}

/* Drawer Content Cards */
.drawer-content-card {
    background: white !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: 100% !important;
    overflow-y: auto !important;
    padding: 20px !important;
}

/* Specific drawer classes for backward compatibility */
.patient-drawer-header,
.medical-drawer-header,
.usage-drawer-header,
.clean-chat-header,
.document-menu-drawer .mud-drawer-header {
    background: var(--mud-palette-primary) !important;
    color: var(--mud-palette-primary-text) !important;
    padding: 16px !important;
    border-radius: 0 !important;
}

.patient-drawer-header h2,
.medical-drawer-header h2,
.usage-drawer-header h2,
.clean-chat-header h2,
.clean-chat-header .mud-text,
.clean-chat-header .mud-typography,
.document-menu-drawer .mud-drawer-header h2,
.document-menu-drawer .mud-drawer-header .mud-text,
.document-menu-drawer .mud-drawer-header .mud-typography {
    font-size: 18px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: white !important;
}

        .patient-form-card,
        .medical-form-card,
        .usage-form-card {
            background: white !important;
            border-radius: 0 !important;
            box-shadow: none !important;
            height: 100% !important;
            overflow-y: auto !important;
            padding: 20px !important;
        }

        /* Document Sections List Styles */
        .document-sections-list {
            list-style: none !important;
            padding: 0 !important;
            margin: 0 0 16px 0 !important;
        }

        .document-section-item {
            display: flex !important;
            align-items: center !important;
            padding: 6px 0 !important;
            font-size: 0.875rem !important;
            color: var(--mud-palette-text-primary) !important;
            border-bottom: 1px solid var(--mud-palette-divider) !important;
        }

        .document-section-item:last-child {
            border-bottom: none !important;
        }

        .document-section-item .mud-icon {
            flex-shrink: 0 !important;
        }

        /* Premium Document Card Styles */
        .premium-document-card {
            background: linear-gradient(135deg, #FFF8E1 0%, #FFFFFF 100%) !important;
            position: relative !important;
        }



        .premium-header {
            background: linear-gradient(135deg, rgba(255, 152, 0, 0.05) 0%, rgba(255, 193, 7, 0.05) 100%) !important;
            border-bottom: 1px solid rgba(255, 152, 0, 0.2) !important;
        }

        .premium-sections .document-section-item {
            color: var(--mud-palette-warning-darken) !important;
            font-weight: 500 !important;
        }

        .premium-sections .document-section-item:hover {
            background-color: rgba(255, 152, 0, 0.05) !important;
            border-radius: 4px !important;
            padding: 6px 8px !important;
            margin: 0 -8px !important;
            transition: all 0.2s ease !important;
        }

        .premium-item .mud-icon {
            animation: premium-icon-pulse 2s ease-in-out infinite !important;
        }

        @keyframes premium-icon-pulse {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.1); opacity: 0.8; }
        }

        /* Templates Scroll Container */
        .templates-scroll-container {
            max-height: 300px !important;
            overflow-y: auto !important;
            padding-right: 8px !important;
            margin-bottom: 16px !important;
        }

        .templates-scroll-container::-webkit-scrollbar {
            width: 6px !important;
        }

        .templates-scroll-container::-webkit-scrollbar-track {
            background: var(--mud-palette-background-grey) !important;
            border-radius: 3px !important;
        }

        .templates-scroll-container::-webkit-scrollbar-thumb {
            background: var(--mud-palette-primary) !important;
            border-radius: 3px !important;
        }

        .templates-scroll-container::-webkit-scrollbar-thumb:hover {
            background: var(--mud-palette-primary-darken) !important;
        }

        /* Template Cards */
        .template-card {
            transition: all 0.2s ease !important;
        }

        .template-card:hover {
            transform: translateY(-2px) !important;
            box-shadow: 0 6px 20px rgba(0,0,0,0.15) !important;
        }

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .templates-scroll-container {
                max-height: 250px !important;
            }
            
            .template-card:hover {
                transform: none !important;
            }
        }

        /* Recording Link Style for Template Button */
        .recording-link-style {
            width: 100% !important;
        }

        .recording-link-button {
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            width: 100% !important;
            padding: 16px 20px !important;
            background: linear-gradient(135deg, rgba(255, 152, 0, 0.1) 0%, rgba(255, 193, 7, 0.1) 100%) !important;
            border: 2px solid transparent !important;
            border-radius: 12px !important;
            text-decoration: none !important;
            transition: all 0.3s ease !important;
            position: relative !important;
            overflow: hidden !important;
        }

        .recording-link-button::before {
            content: '' !important;
            position: absolute !important;
            top: 0 !important;
            left: -100% !important;
            width: 100% !important;
            height: 100% !important;
            background: linear-gradient(90deg, transparent, rgba(255, 152, 0, 0.1), transparent) !important;
            transition: left 0.5s ease !important;
        }

        .recording-link-button:hover::before {
            left: 100% !important;
        }

        .recording-link-button:hover {
            background: linear-gradient(135deg, rgba(255, 152, 0, 0.15) 0%, rgba(255, 193, 7, 0.15) 100%) !important;
            border-color: rgba(255, 152, 0, 0.3) !important;
            transform: translateY(-2px) !important;
            box-shadow: 0 4px 12px rgba(255, 152, 0, 0.2) !important;
        }

        .recording-link-button .mud-icon,
        .recording-link-button .mud-text {
            position: relative !important;
            z-index: 1 !important;
        }