/* ===============================================
   Radzen Component Enhancements — Material Design
   Colors: Blue #1976D2  Green #43A047  Text #212121
   =============================================== */

/* ---- Material Icons base ---- */
.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

/* ---- Material Color Palette Icon colors ---- */
.rz-icon.rz-icon-primary   { color: #1976D2; }
.rz-icon.rz-icon-info      { color: #1976D2; }
.rz-icon.rz-icon-warning   { color: #FFA000; }
.rz-icon.rz-icon-danger    { color: #D32F2F; }
.rz-icon.rz-icon-success   { color: #43A047; }
.rz-icon.rz-icon-secondary { color: #757575; }

/* ---- Blue Primary Color Overrides ---- */
.rz-primary-color      { color: #1976D2 !important; }
.rz-primary-background { background-color: #1976D2 !important; }

/* ---- Button colors (all blue) ---- */
.rz-button {
    background-color: #1976D2 !important;
    border-color: #1976D2 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
}
.rz-button:hover {
    background-color: #1565C0 !important;
    border-color: #1565C0 !important;
    color: #ffffff !important;
}
.rz-button:focus {
    box-shadow: 0 0 0 0.25rem rgba(25, 118, 210, 0.25) !important;
}
.rz-button-primary {
    background-color: #1976D2 !important;
    border-color: #1976D2 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
}
.rz-button-primary:hover {
    background-color: #1565C0 !important;
    border-color: #1565C0 !important;
    color: #ffffff !important;
}
.rz-button-primary:focus {
    box-shadow: 0 0 0 0.25rem rgba(25, 118, 210, 0.25) !important;
}

/* ---- Badges ---- */
.rz-badge-primary { background-color: #1976D2 !important; color: #ffffff !important; }
.rz-badge-success { background-color: #43A047 !important; }
.rz-badge-info    { background-color: #1976D2 !important; }
.rz-badge-warning { background-color: #FFA000 !important; }
.rz-badge-danger  { background-color: #D32F2F !important; }

/* ---- Links ---- */
.rz-link       { color: #1565C0 !important; }
.rz-link:hover { color: #0D47A1 !important; }

/* ---- Progress bar ---- */
.rz-progressbar-value { background-color: #1976D2 !important; border-radius: 8px !important; }

/* ---- Selection and highlight ---- */
.rz-state-highlight {
    background-color: rgba(25, 118, 210, 0.08) !important;
    border-color: #1976D2 !important;
}

/* ---- Focus states ---- */
.rz-inputtext:focus,
.rz-autocomplete:focus {
    border-color: #1976D2 !important;
    box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.18) !important;
}
/* Dropdown — handled by :focus-within on outer wrapper; inner label has no border */
.rz-dropdown .rz-inputtext:focus,
.rz-dropdown .rz-dropdown-label:focus {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* RadzenIcon styling fixes */
.rz-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.rz-icon i {
    font-size: inherit;
    line-height: inherit;
}

/* Popup and tooltip styling */
.rz-popup, .rz-tooltip {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
    z-index: 9999;
}

.rz-popup .rz-icon,
.rz-tooltip .rz-icon {
    color: inherit;
    opacity: 0.87;
}

/* DataGrid popup styling */
.rz-datatable-data .rz-icon {
    margin-right: 0.25rem;
    vertical-align: middle;
}

/* Badge styling enhancements */
.rz-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

/* Alert component icon alignment */
.rz-alert .rz-icon {
    margin-right: 0.5rem;
    flex-shrink: 0;
}

/* Button icon alignment */
.rz-button .rz-icon {
    margin-right: 0.25rem;
    vertical-align: middle;
}

.rz-button .rz-icon:only-child {
    margin-right: 0;
}

/* Stack component */
.rz-stack { display: flex; }
.rz-stack.rz-orientation-horizontal { flex-direction: row; }
.rz-stack.rz-orientation-vertical   { flex-direction: column; }
.rz-stack.rz-align-items-start      { align-items: flex-start; }
.rz-stack.rz-align-items-center     { align-items: center; }
.rz-stack.rz-align-items-end        { align-items: flex-end; }

/* Sidebar menu improvements */
.rz-panel-menu .rz-panel-menu-item {
    transition: background-color 0.2s ease;
}
.rz-panel-menu .rz-panel-menu-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}
.rz-panel-menu .rz-panel-menu-item.rz-state-active {
    background-color: rgba(25, 118, 210, 0.10);
    color: #1565C0;
}
.rz-panel-menu .rz-panel-menu-item.rz-state-active .rz-icon {
    color: #1565C0;
}

/* Card component padding */
.rz-card { padding: 1.5rem; }

/* Progress bar centering */
.rz-progressbar-circular { margin: 1rem auto; }

/* Text styling */
.rz-text { margin: 0; line-height: 1.5; }

/* Fix for overlay issues */
.rz-overlaypanel, .rz-dialog { z-index: 10000; }

/* Ensure proper icon rendering */
.rz-icon.material-icons {
    font-size: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
}

/* ---- Notification (Material style) ---- */
.rz-notification .rz-notification-message { border-radius: 8px !important; }
.rz-notification .rz-notification-message.rz-notification-success { border-left: 4px solid #43A047 !important; }
.rz-notification .rz-notification-message.rz-notification-warning { border-left: 4px solid #1976D2 !important; }
.rz-notification .rz-notification-message.rz-notification-error   { border-left: 4px solid #D32F2F !important; }
.rz-notification .rz-notification-message.rz-notification-info    { border-left: 4px solid #1976D2 !important; }

/* ---- Slider ---- */
.rz-slider .rz-slider-range  { background: #1976D2 !important; }
.rz-slider .rz-slider-handle { border-color: #1976D2 !important; box-shadow: 0 0 0 3px rgba(25,118,210,0.25) !important; }

/* ---- Popup tooltip (Material rounded) ---- */
.rz-popup, .rz-tooltip {
    box-shadow: 0 8px 24px rgba(0,0,0,0.14) !important;
    border: 1px solid #E0E0E0 !important;
    border-radius: 8px !important;
}