/*
 * Radzen Component Overrides
 * Aligns Radzen components with WISEcode Intelligence design system
 */

/* ===========================================
   RADZEN BUTTON - PRIMARY
   =========================================== */
.rz-button.rz-primary,
.rz-button.rz-button-md.rz-primary {
    background-color: var(--color-indigo-500, #3B3CE8) !important;
    border-color: var(--color-indigo-500, #3B3CE8) !important;
    color: white !important;
    font-family: 'Figtree', sans-serif;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    box-shadow: var(--elevation-sm, 0px 1px 3px 0px rgba(0, 0, 0, 0.1));
}

.rz-button.rz-primary:hover,
.rz-button.rz-button-md.rz-primary:hover {
    background-color: var(--color-indigo-600, #1B19B5) !important;
    border-color: var(--color-indigo-600, #1B19B5) !important;
    box-shadow: var(--elevation-md, 0px 4px 6px -1px rgba(0, 0, 0, 0.1));
}

.rz-button.rz-primary:focus,
.rz-button.rz-button-md.rz-primary:focus {
    box-shadow: 0 0 0 3px rgba(59, 60, 232, 0.3) !important;
}

/* ===========================================
   RADZEN BUTTON - SECONDARY/LIGHT
   =========================================== */
.rz-button.rz-secondary,
.rz-button.rz-light,
.rz-button.rz-button-md.rz-secondary,
.rz-button.rz-button-md.rz-light {
    background-color: white !important;
    border: 1px solid var(--color-oyster-300, #E0DBE7) !important;
    color: var(--color-oyster-700, #413A4D) !important;
    font-family: 'Figtree', sans-serif;
    font-weight: 500;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.rz-button.rz-secondary:hover,
.rz-button.rz-light:hover,
.rz-button.rz-button-md.rz-secondary:hover,
.rz-button.rz-button-md.rz-light:hover {
    background-color: var(--color-oyster-100, #FBF9FF) !important;
    border-color: var(--color-oyster-400, #B7B2C4) !important;
}

/* ===========================================
   RADZEN BUTTON - DANGER
   =========================================== */
.rz-button.rz-danger {
    background-color: var(--color-danger-500, #FF5E60) !important;
    border-color: var(--color-danger-500, #FF5E60) !important;
}

.rz-button.rz-danger:hover {
    background-color: var(--color-danger-600, #D84A4C) !important;
    border-color: var(--color-danger-600, #D84A4C) !important;
}

/* ===========================================
   RADZEN BUTTON - SUCCESS
   =========================================== */
.rz-button.rz-success {
    background-color: var(--color-success-500, #00C08B) !important;
    border-color: var(--color-success-500, #00C08B) !important;
}

.rz-button.rz-success:hover {
    background-color: var(--color-success-600, #00A478) !important;
    border-color: var(--color-success-600, #00A478) !important;
}

/* ===========================================
   RADZEN TEXTBOX / INPUT
   =========================================== */
.rz-textbox,
.rz-inputtext,
input.rz-textbox {
    border: 1px solid var(--color-oyster-300, #E0DBE7) !important;
    border-radius: 8px !important;
    background-color: white !important;
    color: var(--color-oyster-900, #1A102C) !important;
    font-family: 'Figtree', sans-serif;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.rz-textbox:hover,
.rz-inputtext:hover,
input.rz-textbox:hover {
    border-color: var(--color-oyster-400, #B7B2C4) !important;
}

.rz-textbox:focus,
.rz-inputtext:focus,
input.rz-textbox:focus,
.rz-textbox.rz-state-focused,
.rz-inputtext.rz-state-focused {
    border-color: var(--color-indigo-500, #3B3CE8) !important;
    box-shadow: 0 0 0 3px rgba(59, 60, 232, 0.15) !important;
    outline: none !important;
}

.rz-textbox::placeholder,
.rz-inputtext::placeholder {
    color: var(--color-oyster-400, #B7B2C4);
}

/* ===========================================
   RADZEN DROPDOWN
   =========================================== */
:root {
    --rz-dropdown-item-font-size: 0.875rem;
    --rz-dropdown-font-size: 0.875rem;
    --rz-input-font-size: 0.875rem;
}

.rz-dropdown {
    border: 1px solid var(--color-oyster-300, #E0DBE7) !important;
    border-radius: 8px !important;
    background-color: white !important;
    font-size: 0.875rem !important;
}

/* Remove inner borders from Radzen dropdown internals */
.rz-dropdown .rz-dropdown-label,
.rz-dropdown .rz-inputtext,
.rz-dropdown .rz-helper,
.rz-dropdown .rz-dropdown-trigger {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    background: transparent !important;
}

.rz-dropdown:hover {
    border-color: var(--color-oyster-400, #B7B2C4) !important;
}

.rz-dropdown.rz-state-focused,
.rz-dropdown:focus-within {
    border-color: var(--color-indigo-500, #3B3CE8) !important;
    box-shadow: 0 0 0 3px rgba(59, 60, 232, 0.15) !important;
}

.rz-dropdown-panel {
    border: 1px solid var(--color-oyster-200, #F4F2F9) !important;
    border-radius: 8px !important;
    box-shadow: var(--elevation-lg, 0px 10px 15px -3px rgba(0, 0, 0, 0.1)) !important;
    background-color: white !important;
    font-size: 0.875rem !important;
}

.rz-dropdown-item,
.rz-multiselect-item,
.rz-dropdown-panel .rz-dropdown-item,
.rz-dropdown-panel .rz-multiselect-item {
    color: var(--color-oyster-700, #413A4D) !important;
    font-family: 'Figtree', sans-serif;
    font-size: 0.875rem !important;
    padding: 8px 12px !important;
}

.rz-dropdown-item:hover {
    background-color: var(--color-oyster-100, #FBF9FF) !important;
}

.rz-dropdown-item.rz-state-highlight {
    background-color: var(--color-indigo-100, #EEEEFF) !important;
    color: var(--color-indigo-700, #0A0969) !important;
}

/* ===========================================
   RADZEN DATAGRID
   =========================================== */
.rz-datatable {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--color-oyster-200, #F4F2F9);
}

.rz-datatable .rz-datatable-thead > tr > th {
    background-color: var(--color-oyster-100, #FBF9FF) !important;
    color: var(--color-oyster-700, #413A4D) !important;
    font-weight: 600;
    font-family: 'Figtree', sans-serif;
    border-bottom: 1px solid var(--color-oyster-200, #F4F2F9);
}

.rz-datatable .rz-datatable-tbody > tr > td {
    color: var(--color-oyster-900, #1A102C) !important;
    font-family: 'Figtree', sans-serif;
    border-bottom: 1px solid var(--color-oyster-100, #FBF9FF);
}

.rz-datatable .rz-datatable-tbody > tr:hover > td {
    background-color: var(--color-oyster-50, #FDFCFF) !important;
}

.rz-datatable .rz-datatable-tbody > tr.rz-state-highlight > td {
    background-color: var(--color-indigo-100, #EEEEFF) !important;
}

/* ===========================================
   RADZEN CARD
   =========================================== */
.rz-card {
    background-color: white !important;
    border: 1px solid var(--color-oyster-200, #F4F2F9) !important;
    border-radius: 16px !important;
    box-shadow: var(--elevation-sm, 0px 1px 3px 0px rgba(0, 0, 0, 0.1)) !important;
}

/* ===========================================
   RADZEN DIALOG
   =========================================== */
.rz-dialog {
    border-radius: 16px !important;
    box-shadow: var(--elevation-2xl, 0px 25px 50px -12px rgba(0, 0, 0, 0.25)) !important;
}

.rz-dialog-titlebar {
    background-color: white !important;
    border-bottom: 1px solid var(--color-oyster-200, #F4F2F9) !important;
    padding: 20px 24px !important;
}

.rz-dialog-title {
    color: var(--color-oyster-900, #1A102C) !important;
    font-family: 'Figtree', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
}

.rz-dialog-content {
    padding: 24px !important;
}

/* ===========================================
   RADZEN TABS
   =========================================== */
.rz-tabview-nav {
    border-bottom: 1px solid var(--color-oyster-200, #F4F2F9) !important;
}

.rz-tabview-nav li .rz-tabview-nav-link {
    color: var(--color-oyster-600, #5D566A) !important;
    font-family: 'Figtree', sans-serif;
    font-weight: 500;
}

.rz-tabview-nav li.rz-tabview-selected .rz-tabview-nav-link {
    color: var(--color-indigo-500, #3B3CE8) !important;
    border-bottom-color: var(--color-indigo-500, #3B3CE8) !important;
}

.rz-tabview-nav li .rz-tabview-nav-link:hover {
    color: var(--color-indigo-600, #1B19B5) !important;
}

/* ===========================================
   RADZEN CHECKBOX
   =========================================== */
.rz-chkbox .rz-chkbox-box {
    border: 2px solid var(--color-oyster-300, #E0DBE7) !important;
    border-radius: 4px !important;
    background-color: white !important;
}

.rz-chkbox .rz-chkbox-box:hover {
    border-color: var(--color-indigo-400, #7476FF) !important;
}

.rz-chkbox .rz-chkbox-box.rz-state-active {
    background-color: var(--color-indigo-500, #3B3CE8) !important;
    border-color: var(--color-indigo-500, #3B3CE8) !important;
}

/* ===========================================
   RADZEN SWITCH
   =========================================== */
.rz-switch .rz-switch-slider {
    background-color: var(--color-oyster-300, #E0DBE7) !important;
}

.rz-switch.rz-switch-checked .rz-switch-slider {
    background-color: var(--color-indigo-500, #3B3CE8) !important;
}

/* ===========================================
   RADZEN NOTIFICATION
   =========================================== */
.rz-notification {
    border-radius: 8px !important;
    box-shadow: var(--elevation-lg, 0px 10px 15px -3px rgba(0, 0, 0, 0.1)) !important;
}

.rz-notification.rz-notification-success {
    background-color: var(--color-success-100, #E4FBF4) !important;
    border-left: 4px solid var(--color-success-500, #00C08B) !important;
}

.rz-notification.rz-notification-error {
    background-color: var(--color-danger-100, #FFEAEA) !important;
    border-left: 4px solid var(--color-danger-500, #FF5E60) !important;
}

.rz-notification.rz-notification-warning {
    background-color: var(--color-warning-100, #FFFAE5) !important;
    border-left: 4px solid var(--color-warning-500, #FFD400) !important;
}

.rz-notification.rz-notification-info {
    background-color: var(--color-indigo-100, #EEEEFF) !important;
    border-left: 4px solid var(--color-indigo-500, #3B3CE8) !important;
}

/* ===========================================
   RADZEN TOOLTIP
   =========================================== */
.rz-tooltip {
    background-color: var(--color-oyster-800, #2C2439) !important;
    color: white !important;
    border-radius: 6px !important;
    font-family: 'Figtree', sans-serif;
    font-size: 0.875rem;
    box-shadow: var(--elevation-md, 0px 4px 6px -1px rgba(0, 0, 0, 0.1)) !important;
}

/* ===========================================
   RADZEN BADGE
   =========================================== */
.rz-badge {
    font-family: 'Figtree', sans-serif;
    font-weight: 600;
    border-radius: 9999px;
}

.rz-badge.rz-badge-primary {
    background-color: var(--color-indigo-500, #3B3CE8) !important;
}

.rz-badge.rz-badge-success {
    background-color: var(--color-success-500, #00C08B) !important;
}

.rz-badge.rz-badge-danger {
    background-color: var(--color-danger-500, #FF5E60) !important;
}

.rz-badge.rz-badge-warning {
    background-color: var(--color-warning-500, #FFD400) !important;
    color: var(--color-oyster-900, #1A102C) !important;
}

/* ===========================================
   RADZEN PROGRESSBAR
   =========================================== */
.rz-progressbar {
    background-color: var(--color-oyster-200, #F4F2F9) !important;
    border-radius: 9999px !important;
}

.rz-progressbar .rz-progressbar-value {
    background-color: var(--color-indigo-500, #3B3CE8) !important;
    border-radius: 9999px !important;
}

/* ===========================================
   GENERAL TYPOGRAPHY
   =========================================== */
.rz-text-body1,
.rz-text-body2,
.rz-text-caption,
.rz-text-subtitle1,
.rz-text-subtitle2 {
    font-family: 'Figtree', sans-serif !important;
    color: var(--color-oyster-900, #1A102C);
}

.rz-text-h1,
.rz-text-h2,
.rz-text-h3,
.rz-text-h4,
.rz-text-h5,
.rz-text-h6 {
    font-family: 'Poppins', 'Figtree', sans-serif !important;
    color: var(--color-oyster-900, #1A102C);
    font-weight: 700;
}

/* ===========================================
   RADZEN MARKDOWN TABLE WRAPPING
   =========================================== */
.report-markdown .rz-datatable {
    overflow: hidden !important;
}

.report-markdown .rz-data-grid-data {
    overflow: hidden !important;
}

.report-markdown .rz-grid-table,
.report-markdown .rz-grid-table-fixed {
    width: 100% !important;
    table-layout: fixed !important;
}

.report-markdown .rz-cell-data {
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}

.report-markdown .rz-datatable th,
.report-markdown .rz-datatable td {
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    padding: 0.5rem 0.75rem !important;
}