﻿.e-icons {
    font-family: "e-icons" !important;
}

.e-btn {
    border-radius: 10px !important;
}

.e-multi-select-wrapper .e-chips-close {
    font-family: "e-icons" !important;
}

.e-grid .e-focused:not(.e-menu-item) {
    box-shadow: none;
}

.e-info btn btn-primary {
    border: 10px solid;
    margin-bottom: 3%;
    margin-left: 4%;
}

.e-dlg-header {
    margin-left: 16px;
}

    .e-dlg-header, .e-dlg-header * {
        font-size: 1.1em;
    }

        .e-dlg-header, .e-dlg-header * {
            color: #717685 !important;
            font-size: 18px;
            font-weight: normal;
        }

.e-dialog .e-dlg-header-content {
    padding-left: 0;
}

.e-input[disabled], .e-input-group .e-input[disabled], .e-input-group.e-control-wrapper .e-input[disabled], .e-input-group.e-disabled, .e-input-group.e-control-wrapper.e-disabled, .e-float-input input[disabled], .e-float-input.e-control-wrapper input[disabled], .e-float-input textarea[disabled], .e-float-input.e-control-wrapper textarea[disabled], .e-float-input.e-disabled, .e-float-input.e-control-wrapper.e-disabled {
    font-weight: 600 !important;
}

.e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover tr[role=row]:not(.e-disable-gridhover):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover tr[role=row]:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
    background-color: rgba(0, 0, 0, 0.05);
}

.e-grid .e-rowcell {
    border-color: #D7E9F7;
}

.e-control {
    font-family: 'Century Gothic', Helvetica, Arial, sans-serif;
}

.e-tab .e-toolbar-items .e-toolbar-item .e-tab-text {
    font-family: 'Century Gothic', Helvetica, Arial, sans-serif;
}

.e-card {
    font-family: 'Century Gothic', Helvetica, Arial, sans-serif;
}

.e-toolbar .e-tbar-btn .e-tbar-btn-text {
    font-family: 'Century Gothic', Helvetica, Arial, sans-serif;
}

.e-grid td.e-active {
    background-color: rgba(0, 0, 0, 0.1) !important;
}

.required-field .e-input-group.e-control-wrapper.e-control-container.e-float-input .e-float-text::after {
    content: "*";
    color: red !important;
    margin-left: 2px;
}

.required-field .e-control-container.e-control-wrapper.e-multi-line-input.e-float-input .e-float-text::after {
    content: "*";
    color: red !important;
    margin-left: 2px;
}

.e-card-header {
    justify-content: start !important;
}

.e-card-content {
    display: flex;
    flex-direction: row;
}

/* ================================
   ACCORDION OVERRIDES - CRITICAL
   ================================ */

/* Remove default padding from accordion content */
.e-accordion .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove padding from nested accordion content */
.e-accordion .e-acrdn-panel .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove padding from all nested levels */
.e-accordion .e-acrdn-panel.e-nested .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-nested .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Remove borders and margins from accordion items */
.e-accordion .e-acrdn-item {
    border: none !important;
    margin: 0 !important;
}

/* Accordion panel - no padding */
.e-accordion .e-acrdn-panel {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* Accordion header consistent padding */
.e-accordion .e-acrdn-header {
    padding: 6px 8px !important;
    border: none !important;
}

/* remove extra wrapper spacing added by nested accordions */
.e-acrdn-content > .e-control.e-accordion {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}

    /* make its direct children not introduce extra gaps */
    .e-acrdn-content > .e-control.e-accordion .e-acrdn-item,
    .e-acrdn-content > .e-control.e-accordion .e-acrdn-panel,
    .e-acrdn-content > .e-control.e-accordion .e-acrdn-content {
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

/* High-specificity overrides to force no padding on accordion contents (overrides Syncfusion theme) */
body .e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-content,
body .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
body .e-accordion .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-panel .e-acrdn-content {
    padding-top: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Ensure any nested wrapper inserted by Syncfusion does not add height/spacing */
.e-acrdn-content > .e-control.e-accordion,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-item,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-panel,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    background: transparent !important;
}

/* If Syncfusion injects inline styles, neutralize them via important on common attributes */
.e-accordion [style*="padding"] {
    padding: 0 !important;
}

.e-accordion [style*="height"] {
    height: auto !important;
}

/* ================================
   END ACCORDION OVERRIDES
   ================================ */

/* ================================
   DROPDOWN BUTTON & POPUP STYLING - DARK THEME
   Syncfusion renders popups at <body> level, not inside button.
   These global selectors ensure consistent dark background.
   ================================ */

/* Actions dropdown button (mobile menu, message menu, etc.) */
.actions-dropdown-btn {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 6px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #2d3748 !important;
    color: #e2e8f0 !important;
    transition: all 0.3s ease !important;
}

    .actions-dropdown-btn:hover {
        background: #3a3d45 !important;
    }

/* Mobile responsive sizing for actions dropdown */
@media (max-width: 768px) {
    .actions-dropdown-btn {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        flex-shrink: 0;
    }
}

@media (max-width: 480px) {
    .actions-dropdown-btn {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
    }
}

/* Base popup container - multiple selectors for reliability */
.e-dropdown-popup,
.e-dropdown-popup.e-popup,
.e-popup.e-dropdown-popup,
div.e-dropdown-popup,
div[id^="e-dropdown-btn-popup"],
div[id*="popup"] .e-dropdown-popup {
    background: #1f2127 !important;
    background-color: #1f2127 !important;
    border: 1px solid #2a2d35 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
    border-radius: 6px !important;
}

    /* Inner ul/list container */
    .e-dropdown-popup ul,
    .e-dropdown-popup .e-ul,
    .e-dropdown-popup.e-popup ul,
    .e-dropdown-popup .e-content {
        background: #1f2127 !important;
        background-color: #1f2127 !important;
        margin: 0 !important;
        padding: 4px 0 !important;
    }

    /* Individual menu items */
    .e-dropdown-popup .e-item,
    .e-dropdown-popup.e-popup .e-item,
    .e-dropdown-popup li.e-item {
        background: #1f2127 !important;
        background-color: #1f2127 !important;
        color: #ffffff !important;
        padding: 10px 14px !important;
        font-size: 14px !important;
        transition: background 0.2s ease !important;
    }

        /* Hover and focus states */
        .e-dropdown-popup .e-item:hover,
        .e-dropdown-popup .e-item:focus,
        .e-dropdown-popup .e-item.e-focused,
        .e-dropdown-popup .e-item.e-selected,
        .e-dropdown-popup.e-popup .e-item:hover,
        .e-dropdown-popup.e-popup .e-item:focus {
            background: #2a2d35 !important;
            background-color: #2a2d35 !important;
            color: #ffffff !important;
        }

        /* Menu icons */
        .e-dropdown-popup .e-item .e-menu-icon,
        .e-dropdown-popup .e-item .e-icons,
        .e-dropdown-popup.e-popup .e-item .e-menu-icon {
            color: #ffffff !important;
            margin-right: 10px !important;
        }

/* Message menu button styling */
.message-menu-btn {
    width: 32px !important;
    height: 24px !important;
    min-width: 32px !important;
    border-radius: 4px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

    .message-menu-btn:hover {
        background: rgba(255, 255, 255, 0.1) !important;
        color: #ffffff !important;
    }

    /* Hide the dropdown arrow indicator on message menu button */
    .message-menu-btn .e-caret,
    .message-menu-btn .e-icon-dlw-arrow,
    .message-menu-btn .e-btn-icon.e-icon-right,
    .message-menu-btn .e-icons.e-icon-right,
    .message-menu-btn > .e-caret {
        display: none !important;
    }

/* Message menu popup */
.e-dropdown-popup {
    min-width: 220px !important;
    box-sizing: border-box !important;
}

    .e-dropdown-popup .e-dropdown-menu {
        padding: 6px 0;
    }

    /* Menu items */
    .e-dropdown-popup .e-item {
        box-sizing: border-box !important;
        width: 100%;
    }

    .e-dropdown-popup .e-menu-icon {
        margin-right: 10px;
        font-size: 14px;
    }

    .e-dropdown-popup .e-item {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: max-content; /* 🔑 allows longest text */
    }

.e-dropdown-popup {
    background: #1f2127;
    border: 1px solid #2a2d35;
    border-radius: 6px;
}

    .e-dropdown-popup .e-item:hover {
        background-color: #2a2d35;
    }

/* MOBILE FIX: Ensure dropdown popups stay within viewport but don't force position */
@media (max-width: 768px) {
    .e-dropdown-popup,
    .e-dropdown-popup.e-popup,
    div[id^="e-dropdown-popup"],
    div[id^="e-dropdown-btn-popup"] {
        max-width: calc(100vw - 16px) !important;
        min-width: 150px !important;
        z-index: 10000 !important;
        background: #1f2127 !important;
    }

        /* Fix for message menu dropdown - prevent it from going off-screen to the right */
        .message-menu-btn + .e-dropdown-popup,
        .e-dropdown-popup.e-popup {
            /* Remove any forced left/right positioning - let browser handle it */
            transform: none !important;
        }
}

/* ================================
   END DROPDOWN POPUP STYLING
   ================================ */

/* Confirmation Dialog Button Styling - Make buttons visible with proper text */
.e-dialog .e-footer-content {
    padding: 15px !important;
    background: #1f2127 !important;
}

    .e-dialog .e-footer-content .e-btn {
        min-width: 100px !important;
        height: 40px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 8px 20px !important;
        margin: 0 8px !important;
        border-radius: 6px !important;
        transition: all 0.3s ease !important;
        color: #ffffff !important;
    }

        /* Primary button (OK/Yes) styling */
        .e-dialog .e-footer-content .e-btn.e-primary {
            background: #1f2127 !important;
            color: #ffffff !important;
            border: 2px solid #2a2d35 !important;
        }

            .e-dialog .e-footer-content .e-btn.e-primary:hover {
                background: #2a2d35 !important;
                border-color: #3a3d45 !important;
                transform: scale(1.05) !important;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
                color: #ffffff !important;
            }

        /* Secondary button (Cancel/No) styling */
        .e-dialog .e-footer-content .e-btn:not(.e-primary) {
            background: transparent !important;
            color: #ffffff !important;
            border: 2px solid #2a2d35 !important;
        }

            .e-dialog .e-footer-content .e-btn:not(.e-primary):hover {
                background: #2a2d35 !important;
                border-color: #3a3d45 !important;
                transform: scale(1.05) !important;
                color: #ffffff !important;
            }

        /* Ensure all button text elements are white and visible */
        .e-dialog .e-footer-content .e-btn,
        .e-dialog .e-footer-content .e-btn *,
        .e-dialog .e-footer-content .e-btn span,
        .e-dialog .e-footer-content .e-btn .e-btn-content {
            color: #ffffff !important;
            font-size: 16px !important;
        }

    /* Target ALL possible button elements in dialog footer */
    .e-dialog .e-footer-content .e-btn,
    .e-dialog .e-footer-content button,
    .e-dialog .e-dlg-footerbar .e-btn,
    .e-dialog .e-dlg-footerbar button {
        min-width: 100px !important;
        height: 40px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 8px 20px !important;
        margin: 0 8px !important;
        border-radius: 6px !important;
        transition: all 0.3s ease !important;
        color: #ffffff !important;
        background: #1f2127 !important;
        border: 2px solid #2a2d35 !important;
    }

        /* Primary button (OK/Yes) styling */
        .e-dialog .e-footer-content .e-btn.e-primary,
        .e-dialog .e-footer-content button.e-primary,
        .e-dialog .e-dlg-footerbar .e-btn.e-primary,
        .e-dialog .e-dlg-footerbar button.e-primary {
            background: #2a2d35 !important;
            color: #ffffff !important;
            border: 2px solid #3a3d45 !important;
        }

            .e-dialog .e-footer-content .e-btn.e-primary:hover,
            .e-dialog .e-dlg-footerbar .e-btn.e-primary:hover {
                background: #3a3d45 !important;
                border-color: #4a4d55 !important;
                transform: scale(1.05) !important;
                box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
            }

        /* Secondary button (Cancel/No) styling */
        .e-dialog .e-footer-content .e-btn:not(.e-primary),
        .e-dialog .e-dlg-footerbar .e-btn:not(.e-primary) {
            background: #1f2127 !important;
            color: #ffffff !important;
            border: 2px solid #2a2d35 !important;
        }

            .e-dialog .e-footer-content .e-btn:not(.e-primary):hover,
            .e-dialog .e-dlg-footerbar .e-btn:not(.e-primary):hover {
                background: #2a2d35 !important;
                border-color: #3a3d45 !important;
                transform: scale(1.05) !important;
            }

        /* FORCE all text content inside buttons to be white - AGGRESSIVE */
        .e-dialog .e-footer-content .e-btn *,
        .e-dialog .e-footer-content button *,
        .e-dialog .e-dlg-footerbar .e-btn *,
        .e-dialog .e-dlg-footerbar button *,
        .e-dialog .e-footer-content .e-btn span,
        .e-dialog .e-footer-content button span,
        .e-dialog .e-dlg-footerbar .e-btn span,
        .e_dialog .e-dlg-footerbar button span,
        .e-dialog .e-footer-content .e-btn .e-btn-content,
        .e-dialog .e-dlg-footerbar .e-btn .e-btn-content {
            color: #ffffff !important;
            font-size: 16px !important;
            font-weight: 600 !important;
            display: inline !important;
            visibility: visible !important;
            opacity: 1 !important;
        }

/* Confirmation dialog specific - most aggressive approach */
.e-dialog.e-control.e-popup .e-footer-content button,
.e-dialog.e-control.e-popup .e-dlg-footerbar button {
    color: #ffffff !important;
    font-size: 16px !important;
}

    .e-dialog.e-control.e-popup .e-footer-content button *,
    .e-dialog.e-control.e-popup .e-dlg-footerbar button * {
        color: #ffffff !important;
        font-size: 16px !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

/* Target the confirmation dialog buttons by their role */
button[role="button"] {
    color: #ffffff !important;
}

    button[role="button"] span {
        color: #ffffff !important;
    }

/* Override any Syncfusion theme that might be hiding text */
.e-control-wrapper.e-btn,
.e-css.e-btn,
.e-btn.e-lib {
    color: #ffffff !important;
}

    .e-control-wrapper.e-btn span,
    .e-css.e-btn span,
    .e-btn.e-lib span {
        color: #ffffff !important;
    }

/* target exact nested content selector used by theme */
.e-accordion.e-control .e-acrdn-panel.e-nested > .e-acrdn-content,
.e-accordion .e-acrdn-panel.e-nested .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
}
/* neutralize any inline padding/height on children */
.e-acrdn-content [style*="padding"] {
    padding: 0 !important;
}

.e-acrdn-content [style*="height"] {
    height: auto !important;
}

.nested-threads {
    padding: 0;
    margin: 0;
}

.thread-row {
    padding: 6px 8px;
    margin: 0;
}
/* Overrides for Syncfusion Accordion nested panels to reduce excessive padding
 Place strong selectors and !important to beat the theme defaults.
*/

/* Target nested accordion content and global accordion content */
.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-content,
.e-acrdn-content {
    padding: 8px12px !important; /* reduced spacing */
    box-sizing: border-box !important;
}

    /* Ensure nested accordion inside content takes full width and no extra margins */
    .e-acrdn-content > .e-accordion,
    .e-acrdn-content .e-accordion {
        width: 100% !important;
        margin: 0 !important;
    }

    /* Reduce padding of nested headers/panels if they inherit large values */
    .e-acrdn-content .e-acrdn-item .e-acrdn-header,
    .e-acrdn-content .e-acrdn-item .e-acrdn-panel {
        padding: 6px0 !important;
    }

    /* If there are extra inner wrapper divs adding vertical space, remove it */
    .e-acrdn-content > div {
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Optional: make the clickable item span full width rather than centered block */
    .e-acrdn-content .your-inner-button-class,
    .e-acrdn-content .e-btn {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
    }


/* -----------------------------
 STRONG GLOBAL FIX FOR NESTED PADDING (ADDED)
 This block forces zero padding/margin for nested accordion content
 and neutralizes any inline padding/height that the theme or JS might inject.
 ----------------------------- */

body .e-accordion .e-acrdn-panel .e-acrdn-content,
body .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-panel.e-nested .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Neutralize inline styles inserted by Syncfusion or theme that include padding/height */
.e-acrdn-content [style*="padding"],
.e-acrdn-content [style*="height"] {
    padding: 0 !important;
    height: auto !important;
}

/* If nested accordion control itself is a direct child, prevent it from adding spacing */
.e-acrdn-content > .e-control.e-accordion,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-item,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-panel,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    background: transparent !important;
}

/* End of overrides */

/* Ultra-specific selectors to override bootstrap5-dark theme rules that add left padding/margins to nested accordion content */
html body .e-accordion.e-control .e-acrdn-item .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion.e-control .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion .e-acrdn-item .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion .e-acrdn-panel.e-nested > .e-acrdn-content,
.e-accordion.e-control .e-acrdn-item .e-acrdn-panel.e-nested > .e-acrdn-content,
.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested > .e-acrdn-content {
    padding: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    background: transparent !important;
    box-shadow: none !important;
    border-top: none !important;
    border-bottom: none !important;
}

/* Remove separators/dividers that may be added between nested items */
.e-accordion .e-acrdn-item .e-acrdn-panel,
.e-accordion .e-acrdn-item,
.e-acrdn-content .e-acrdn-item {
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

    /* Additional targeted overrides to remove leftover padding/borders from bootstrap5-dark theme */
    /* Force zero padding for any nested content selectors used by theme */
    .e-accordion .e-acrdn-panel.e-nested > .e-acrdn-content,
    .e-accordion .e-acrdn-item .e-acrdn-panel > .e-acrdn-content,
    .e-accordion .e-acrdn-panel > .e-acrdn-content,
    .e-accordion .e-acrdn-item .e-acrdn-content,
    .e-accordion .e-acrdn-content {
        padding: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Remove borders/separators between nested items (including adjacent item rules) */
    .e-accordion .e-acrdn-item + .e-acrdn-item,
    .e-accordion .e-acrdn-item,
    .e-accordion .e-acrdn-panel {
        border-top: none !important;
        border-bottom: none !important;
        box-shadow: none !important;
    }

        /* Remove any pseudo-element separators added by the theme */
        .e-accordion .e-acrdn-item::before,
        .e-accordion .e-acrdn-item::after,
        .e-acrdn-content .e-acrdn-item::before,
        .e-acrdn-content .e-acrdn-item::after {
            content: none !important;
        }

/* If theme uses long selectors with multiple class repeats, add even more specificity fallback */
html body .e-accordion .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion.e-control .e-acrdn-panel.e-nested > .e-acrdn-content {
    padding-left: 0 !important;
}

/* Final catch-all: remove left padding from any element whose class contains acrdn-content */
[class*="acrdn-content"] {
    padding-left: 0 !important;
}

/* End additional overrides */

/* Focused fixes: remove border lines and padding between accordion items that come from theme */
.e-accordion .e-acrdn-item.e-select,
.e-accordion .e-acrdn-item,
.e-accordion .e-acrdn-item.e-select .e-acrdn-header,
.e-accordion .e-acrdn-item .e-acrdn-header {
    border: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

    /* Theme sometimes applies border-bottom to first/last-child - neutralize */
    .e-accordion .e-acrdn-item:first-child,
    .e-accordion .e-acrdn-item:last-child,
    .e-accordion .e-acrdn-item.e-select:first-child,
    .e-accordion .e-acrdn-item.e-select:last-child {
        border-bottom: 0 !important;
    }

    /* Some theme rules add border-left or pseudo-elements for child separators - remove them */
    .e-accordion .e-acrdn-panel .e-acrdn-content,
    .e-accordion .e-acrdn-item .e-acrdn-panel > .e-acrdn-content {
        border-left: 0 !important;
    }

/* Finally, make header container padding explicit and consistent so theme can't vary it */
.e-accordion .e-acrdn-header {
    padding: 6px8px !important;
}

/* End focused fixes */

/* FINAL FORCEFUL OVERRIDES - CSS ONLY FALLBACK
 These rules attempt to override any theme or runtime-applied padding/borders
 for Syncfusion Accordion nested panels. They are intentionally broad and use
 !important. Keep this as last block in the file. */

html body .e-accordion .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion.e-control .e-acrdn-panel.e-nested > .e-acrdn-content,
html body .e-accordion .e-acrdn-item .e-acrdn-panel > .e-acrdn-content,
html body .e-accordion .e-acrdn-panel > .e-acrdn-content,
.e-acrdn-content,
.e-acrdn-panel .e-acrdn-content,
.e-accordion .e-acrdn-panel > .e-acrdn-content[style],
.e-acrdn-content[style] {
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    box-shadow: none !important;
    min-height: 0 !important;
    height: auto !important;
    line-height: normal !Important;
    background: transparent !important;
    overflow: visible !important;
}

    /* Neutralize any inline padding-left style specifically (common culprit) */
    .e-acrdn-content[style*="padding-left"] {
        padding-left: 0 !important;
    }

/* Neutralize inline padding anywhere via attribute selector (author rules with !important win) */
[e-style-padding] {
}
/* Fallback: any element with an inline style attribute containing 'padding' or 'height' */
*[style*="padding"] {
    padding: 0 !important;
}

*[style*="height"] {
    height: auto !important;
    min-height: 0 !important;
}

/* Remove pseudo-element separators */
.e-accordion .e-acrdn-item::before,
.e-accordion .e-acrdn-item::after,
.e-acrdn-content .e-acrdn-item::before,
.e-acrdn-content .e-acrdn-item::after {
    content: none !important;
}

/* Ensure headers remain compact and consistent */
.e-accordion .e-acrdn-header,
.e-accordion .e-acrdn-header > .thread-header {
    padding: 6px8px !important;
    margin: 0 !important;
    border: 0 !important;
}

/* If Syncfusion injects wrappers, target direct child accordions */
.e-acrdn-content > .e-control.e-accordion,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-panel,
.e-acrdn-content > .e-control.e-accordion > .e-acrdn-content {
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
}

/* Extra high-specificity fallback: repeat classes to outrank unusual rules */
html body html body .e-accordion .e-acrdn-panel.e-nested > .e-acrdn-content {
    padding: 0 !important;
    padding-left: 0 !important;
}

/* End of final forceful overrides */

/* Indentation helpers for thread levels (use these instead of inline padding-left) */
.thread-header.level-0 .thread-title {
    margin-left: 0 !important;
}

.thread-header.level-1 .thread-title {
    margin-left: 6px !important;
}

.thread-header.level-2 .thread-title {
    margin-left: 12px !important;
}

.thread-header.level-3 .thread-title {
    margin-left: 18px !important;
}

.thread-header.level-4 .thread-title {
    margin-left: 24px !important;
}

.thread-header.level-5 .thread-title {
    margin-left: 30px !important;
}

.thread-header.level-6 .thread-title {
    margin-left: 36px !important;
}
/* Indentation: shift the entire header (including collapse icon) per level (halved from previous)
 previous:8,24,56,104,152,200,248
 new: approx half */
.thread-header.level-0 {
    padding-left: 4px !important;
}

.thread-header.level-1 {
    padding-left: 12px !important;
}

.thread-header.level-2 {
    padding-left: 28px !important;
}

.thread-header.level-3 {
    padding-left: 52px !important;
}

.thread-header.level-4 {
    padding-left: 76px !important;
}

.thread-header.level-5 {
    padding-left: 100px !important;
}

.thread-header.level-6 {
    padding-left: 124px !important;
}

/* Ensure the collapse icon remains aligned */
.thread-header .e-icon-collapsible,
.thread-header .e-icons {
    margin-right: 8px !important;
    flex-shrink: 0 !important;
}

.thread-header .thread-title {
    margin-left: 0 !important;
}

/* Remove horizontal divider lines between nested child items (simpler) */
/* Remove bottom borders inside panels */
.e-accordion .e-acrdn-panel .e-acrdn-item,
.e-accordion .e-acrdn-panel .e-acrdn-item .e-acrdn-header,
.e-accordion .e-acrdn-panel .e-acrdn-item .e-acrdn-panel {
    border-top: 0 !important;
    border-bottom: 0 !important;
}

/* Remove lines between sibling items in nested accordions */
.e-acrdn-content .e-acrdn-item + .e-acrdn-item {
    border-top: 0 !important;
}

/* If you prefer a subtle separator only between root-level items, you can enable:
.e-accordion > .e-acrdn-item + .e-acrdn-item { border-top:1px solid rgba(255,255,255,0.04) !important; }
*/

/* Keep headers vertically compact */
.e-accordion .e-acrdn-header {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

/* Make sure nested control wrappers don't reintroduce spacing */
.e-acrdn-content > .e-control.e-accordion {
    padding: 0 !important;
    margin: 0 !important;
}

/* ================================
   MOVE ACCORDION TOGGLE ICON TO RIGHT
   ================================ */

/* Make header a flex container with space-between to push icon to the right */
.e-accordion .e-acrdn-header {
    display: flex !important;
    flex-direction: row-reverse !important;
    justify-content: flex-end !important;
    align-items: center !important;
}

    /* Position the toggle icon on the right */
    .e-accordion .e-acrdn-header .e-toggle-icon,
    .e-accordion .e-acrdn-header .e-acrdn-header-icon {
        order: -1 !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }

    /* Ensure header content stays on the left */
    .e-accordion .e-acrdn-header .e-acrdn-header-content {
        order: 1 !important;
        flex: 1 !important;
        margin-right: auto !important;
    }

/* Alternative approach: use Syncfusion's built-in icon position classes */
.e-accordion .e-acrdn-item .e-acrdn-header {
    flex-direction: row !important;
}

    .e-accordion .e-acrdn-item .e-acrdn-header > .e-toggle-icon {
        order: 2 !important;
        margin-left: auto !important;
        margin-right: 8px !important;
    }

    .e-accordion .e-acrdn-item .e-acrdn-header > .e-acrdn-header-content {
        order: 1 !important;
    }

/* ================================
   END ACCORDION ICON POSITION
   ================================ */

/* ================================
   ACCORDION TOGGLE ICON COLOR - UNIFIED BLUE #00acdc
   ================================ */

/* Force all accordion toggle/expand icons to use the brand blue color */
/* Ultra-high specificity to override bootstrap5-dark theme */
html body .e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon .e-tgl-collapse-icon.e-icons,
html body .e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon .e-icons,
html body .e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon,
html body .e-accordion .e-acrdn-header .e-toggle-icon .e-tgl-collapse-icon.e-icons,
html body .e-accordion .e-acrdn-header .e-toggle-icon .e-icons,
html body .e-accordion .e-toggle-icon .e-tgl-collapse-icon.e-icons,
html body .e-accordion .e-toggle-icon .e-icons,
html body .e-accordion .e-tgl-collapse-icon.e-icons,
html body .e-accordion .e-tgl-collapse-icon,
html body .e-accordion .e-toggle-icon,
html body .e-accordion .e-acrdn-header .e-toggle-icon,
html body .e-accordion .e-acrdn-header-icon,
html body .e-accordion .e-icons.e-expand-icon,
html body .e-accordion .e-icons.e-collapse-icon,
.e-accordion .e-toggle-icon,
.e-accordion .e-toggle-icon .e-icons,
.e-accordion .e-acrdn-header .e-toggle-icon,
.e-accordion .e-acrdn-header .e-toggle-icon .e-icons,
.e-accordion .e-acrdn-item .e-toggle-icon,
.e-accordion .e-acrdn-item .e-toggle-icon .e-icons,
.e-accordion .e-acrdn-header-icon,
.e-accordion .e-tgl-collapse-icon,
.e-accordion .e-icons.e-tgl-collapse-icon,
.e-accordion .e-icons.e-expand-icon,
.e-accordion .e-icons.e-collapse-icon,
.e-accordion .e-acrdn-header .e-icons,
.e-tgl-collapse-icon.e-icons,
span.e-tgl-collapse-icon.e-icons {
    color: #00acdc !important;
}

/* Target the ::before pseudo-element where the icon glyph is rendered */
html body .e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon .e-tgl-collapse-icon.e-icons::before,
html body .e-accordion .e-toggle-icon .e-icons::before,
html body .e-accordion .e-tgl-collapse-icon.e-icons::before,
html body .e-accordion .e-tgl-collapse-icon::before,
.e-accordion .e-toggle-icon .e-icons::before,
.e-accordion .e-acrdn-header .e-toggle-icon .e-icons::before,
.e-accordion .e-tgl-collapse-icon.e-icons::before,
.e-accordion .e-tgl-collapse-icon::before,
.e-tgl-collapse-icon.e-icons::before,
span.e-tgl-collapse-icon.e-icons::before {
    color: #00acdc !important;
}

/* ================================
   END ACCORDION TOGGLE ICON COLOR
   ================================ */
