/* ======================================================================
   DevExpress BlazingBerry → EF Blue palette overrides
   All purple/violet accent colors from BlazingBerry are replaced here.
   rgba() shadow colors use --ef-primary-rgb (104, 139, 177) — defined in easyfirma-theme.css.
   ====================================================================== */

/* ── Bootstrap root tokens ─────────────────────────────────────────── */
:root {
    --bs-primary:          var(--ef-primary);
    --bs-link-color:       var(--ef-primary);
    --bs-link-hover-color: var(--ef-primary-dark);
}

/* ── Focus ring (used by Bootstrap + DX inputs) ─────────────────────── */
:root {
    --bs-focus-ring-color: transparent;
}

/* ── Generic DX focus / selection shadow ────────────────────────────── */
:root {
    --dxbl-focus-shadow-color: transparent;
    --dxbl-selection-color:    var(--ef-primary-medium);
}

/* ── Input fields always white (panel-bg is blueish, inputs must be white) */
.dxbl-text-edit,
.dxbl-spin-edit,
.dxbl-date-edit,
.dxbl-combobox,
.dxbl-tag-box,
.dxbl-masked-input,
.dxbl-memo {
    --dxbl-text-edit-bg: var(--ef-bg-primary);
    background-color: var(--ef-bg-primary);
}

.dxbl-text-edit .dxbl-text-edit-input-area,
.dxbl-text-edit .dxbl-input-group-container,
.dxbl-memo .dxbl-text-edit-input-area {
    background-color: var(--ef-bg-primary) !important;
}

/* ── Text inputs (DxTextBox, DxMemo, DxMaskedInput, DxSpinEdit) ─────── */
:root {
    --dxbl-text-edit-focused-border-color:    var(--ef-primary);
    --dxbl-text-edit-focused-shadow:          none;
    --dxbl-text-edit-placeholder-color:       var(--ef-text-secondary);
    --dxbl-text-edit-highlight-bg:            var(--ef-primary-medium);
    --dxbl-text-edit-clear-btn-hover-bg:      var(--ef-bg-tertiary);
}

/* ── Combobox / Select / TagBox / ListBox ───────────────────────────── */
:root {
    --dxbl-listbox-item-selected-bg:           var(--ef-primary);
    --dxbl-listbox-item-selected-color:        var(--ef-text-light);
    --dxbl-listbox-item-selected-hover-bg:     var(--ef-primary-dark);
    --dxbl-listbox-item-active-bg:             var(--ef-bg-secondary);
    --dxbl-listbox-item-active-color:          var(--ef-text-primary);
    --dxbl-listbox-item-hover-bg:              var(--ef-bg-secondary);
    --dxbl-listbox-item-hover-color:           var(--ef-text-primary);
    --dxbl-listbox-item-focused-bg:            var(--ef-bg-secondary);
    --dxbl-combobox-item-selected-bg:          var(--ef-primary);
    --dxbl-combobox-item-selected-color:       var(--ef-text-light);
    --dxbl-combobox-item-hovered-bg:           var(--ef-bg-secondary);
    --dxbl-tag-box-tag-bg:                     var(--ef-primary-medium);
    --dxbl-tag-box-tag-color:                  var(--ef-primary-darker);
    --dxbl-tag-box-tag-remove-btn-color:       var(--ef-primary-dark);
    --dxbl-tag-box-tag-remove-btn-hover-color: var(--ef-primary-darker);
}

/* Fallback !important — DX portal dropdowns can escape :root tokens */
.dxbl-listbox-item.dxbl-listbox-item-selected,
.dxbl-listbox div.dxbl-listbox-item-selected,
.dxbl-listbox tr.dxbl-listbox-item-selected > td {
    background-color: var(--ef-primary) !important;
    color:            var(--ef-text-light) !important;
}

/* blazing-berry hardcodes #5f368d (purple) on ::before — override it */
.dxbl-listbox div.dxbl-listbox-item-selected::before,
.dxbl-listbox tr.dxbl-listbox-item-selected > td::before {
    background-color: var(--ef-primary) !important;
    opacity: 1 !important;
}

.dxbl-listbox-item-active:not(.dxbl-listbox-item-selected),
.dxbl-listbox-item:hover:not(.dxbl-listbox-item-selected):not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item),
.dxbl-listbox-item:hover:not(.dxbl-listbox-item-selected):not(.dxbl-listbox-item-disabled):not(.dxbl-listbox-empty-data-item) > td {
    background-color: var(--ef-bg-secondary) !important;
    color:            var(--ef-text-primary) !important;
}

/* ── Calendar / Date Edit ───────────────────────────────────────────── */
:root {
    --dxbl-calendar-today-border-color:        var(--ef-primary);
    --dxbl-calendar-selected-cell-bg:          var(--ef-primary);
    --dxbl-calendar-selected-cell-color:       var(--ef-text-light);
    --dxbl-calendar-focused-cell-bg:           var(--ef-bg-secondary);
    --dxbl-calendar-focused-cell-border-color: var(--ef-primary);
    --dxbl-calendar-hovered-cell-bg:           var(--ef-bg-tertiary);
    --dxbl-calendar-hovered-cell-color:        var(--ef-text-primary);
    --dxbl-calendar-range-bg:                  var(--ef-primary-medium);
    --dxbl-calendar-range-color:               var(--ef-primary-darker);
    --dxbl-calendar-nav-btn-hover-bg:          var(--ef-bg-tertiary);
    --dxbl-calendar-nav-btn-hover-color:       var(--ef-primary-dark);
    --dxbl-date-edit-focused-border-color:     var(--ef-primary);
}

/* ── Checkbox / Radio / Switch ──────────────────────────────────────── */
.dxbl-checkbox {
    --dxbl-checkbox-check-element-checked-bg:          var(--ef-primary);
    --dxbl-checkbox-check-element-checked-hover-bg:    var(--ef-primary-dark);
    --dxbl-checkbox-checked-focus-shadow-color:        transparent;
    --dxbl-checkbox-unchecked-focus-shadow-color:      transparent;
    --dxbl-checkbox-radio-check-bg:                    var(--ef-primary);
    --dxbl-checkbox-radio-checked-border-color:        var(--ef-primary);
    --dxbl-checkbox-radio-checked-hover-bg:            var(--ef-primary-dark);
    --dxbl-checkbox-radio-checked-hover-border-color:  var(--ef-primary-dark);
    --dxbl-checkbox-switch-checked-bg:                 var(--ef-primary);
    --dxbl-checkbox-switch-checked-hover-bg:           var(--ef-primary-dark);
}

/* ── Tabs ───────────────────────────────────────────────────────────── */
.dxbl-tabs {
    --dxbl-tabs-tab-selected-color:       var(--ef-primary);
    --dxbl-tabs-tab-focus-outline-color:  var(--ef-primary);
    --dxbl-tabs-tab-drop-indicator-color: var(--ef-primary);
    --dxbl-tabs-tab-hovered-color:        var(--ef-primary-dark);
}

.dxbl-tabs .dxbl-tabs-item.dxbl-active::after {
    background-color: var(--ef-primary) !important;
}

/* ── Primary standalone button ──────────────────────────────────────── */
.dxbl-btn-standalone.dxbl-btn-primary {
    --dxbl-btn-bg:                  var(--ef-primary);
    --dxbl-btn-border-color:        var(--ef-primary);
    --dxbl-btn-hover-bg:            var(--ef-primary-dark);
    --dxbl-btn-hover-border-color:  var(--ef-primary-dark);
    --dxbl-btn-active-bg:           var(--ef-primary-dark);
    --dxbl-btn-active-border-color: var(--ef-primary-dark);
    --dxbl-btn-disabled-bg:         var(--ef-primary-disabled);
    --dxbl-btn-disabled-border-color: var(--ef-primary-disabled);
    --dxbl-btn-focus-shadow-color:  transparent;
}

/* ── Accordion ──────────────────────────────────────────────────────── */
:root {
    --dxbl-accordion-item-selected-bg:    var(--ef-bg-secondary);
    --dxbl-accordion-item-selected-color: var(--ef-primary);
    --dxbl-accordion-item-hovered-bg:     var(--ef-bg-tertiary);
}

/* ── Pager ──────────────────────────────────────────────────────────── */
:root {
    --dxbl-pager-active-page-btn-bg:           var(--ef-primary-medium);
    --dxbl-pager-active-page-btn-border-color: var(--ef-primary-medium);
    --dxbl-pager-active-page-btn-color:        var(--ef-text-light);
}

/* ── Bootstrap form-check / form-switch ─────────────────────────────── */
.form-check-input:checked {
    background-color: var(--ef-primary) !important;
    border-color:     var(--ef-primary) !important;
}

.form-check-input:focus {
    outline: 2px solid var(--ef-primary);
    outline-offset: 2px;
    box-shadow: none;
    border-color: inherit;
}

/* ── Bootstrap form-control focus (login, register, any plain input) ── */
.form-control:focus {
    border-color: var(--ef-primary);
    box-shadow: 0 0 0 1px var(--ef-primary);
    outline: none;
}

/* ── Placeholder text (all DX inputs) ───────────────────────────────── */
.dxbl-text-edit input::placeholder,
.dxbl-text-edit textarea::placeholder,
.dxbl-memo textarea::placeholder {
    color: var(--ef-text-secondary) !important;
    opacity: 1;
}

/* ── Input focus border (all DX text-style inputs) ──────────────────── */
.dxbl-text-edit:focus-within,
.dxbl-spin-edit:focus-within,
.dxbl-date-edit:focus-within,
.dxbl-combobox:focus-within,
.dxbl-tag-box:focus-within,
.dxbl-masked-input:focus-within {
    border-color: var(--ef-primary) !important;
    box-shadow: 0 0 0 1px var(--ef-primary) !important;
    outline: none !important;
}

/* ── Calendar today / selected cell (fallback !important for hardcoded theme values) */
.dxbl-calendar .dxbl-calendar-cell.dxbl-calendar-today {
    border-color: var(--ef-primary) !important;
    color: var(--ef-primary) !important;
}

.dxbl-calendar .dxbl-calendar-cell.dxbl-calendar-selected,
.dxbl-calendar .dxbl-calendar-cell.dxbl-selected {
    background-color: var(--ef-primary) !important;
    color: var(--ef-text-light) !important;
}

.dxbl-calendar .dxbl-calendar-cell:hover:not(.dxbl-calendar-selected):not(.dxbl-calendar-today) {
    background-color: var(--ef-bg-tertiary) !important;
    color: var(--ef-text-primary) !important;
}

/* ======================================================================
   MOBILE / TOUCH
   ====================================================================== */
@media (max-width: 575.98px) {
    .dxbl-text-edit,
    .dxbl-spin-edit,
    .dxbl-combobox,
    .dxbl-date-edit,
    .dxbl-memo,
    .dxbl-tag-box,
    .dxbl-masked-input {
        --dxbl-text-edit-min-height:       var(--ef-touch-input-height-mobile);
        --dxbl-text-edit-input-font-size:  var(--ef-mobile-input-font-size);
        min-height: var(--ef-touch-input-height-mobile);
        font-size:  var(--ef-mobile-input-font-size);
    }

    .dxbl-text-edit input,
    .dxbl-spin-edit input,
    .dxbl-combobox input,
    .dxbl-date-edit input,
    .dxbl-masked-input input,
    .dxbl-tag-box input {
        font-size: var(--ef-mobile-input-font-size);
    }

    .dxbl-btn {
        min-height: var(--ef-touch-button-height-mobile);
    }
}

/* ── Mobile DxPopup full-screen ────────────────────────────────────── */
@media (max-width: 575.98px) {
    .dxbl-popup:not(.ef-popup--keep-shape) > .dxbl-popup-window {
        width:      100vw !important;
        max-width:  100vw !important;
        min-width:  0    !important;
        height:     100vh !important;
        max-height: 100vh !important;
        margin:     0    !important;
        border-radius: 0 !important;
        inset:      0    !important;
    }
}

/* ── Toolbar dropdown popup (Export / Download) — matches Status dropdown style ── */

/* Hide the chevron arrow on toolbar dropdown buttons */
.dxbl-grid-toolbar-container .dxbl-toolbar-dropdown-toggle {
    display: none !important;
}

/* Export / Download toolbar dropdown — all values from --ef-dropdown-* in easyfirma-theme.css */
.dxbl-toolbar-dropdown .dxbl-dropdown {
    --dxbl-dropdown-min-width: var(--ef-dropdown-min-width);
    background:    var(--ef-dropdown-bg);
    border:        var(--ef-dropdown-border);
    border-radius: var(--ef-dropdown-radius);
    box-shadow:    var(--ef-dropdown-shadow);
    padding:       var(--ef-dropdown-padding-y) 0;
}

.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item-list {
    padding:    0;
    margin:     0;
    list-style: none;
}

.dxbl-toolbar-dropdown .dxbl-toolbar-menu-item,
.dxbl-toolbar-dropdown li button,
.dxbl-toolbar-dropdown li a,
.dxbl-toolbar-dropdown .dxbl-btn,
.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item > .dxbl-toolbar-menu-item > .dxbl-dropdown-item.dxbl-btn,
.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item > .dxbl-toolbar-menu-item > .dxbl-btn {
    /* DX internal token overrides */
    --dxbl-toolbar-dropdown-btn-color:       var(--ef-dropdown-item-color);
    --dxbl-toolbar-dropdown-btn-hover-color: var(--ef-dropdown-item-color);
    --dxbl-toolbar-dropdown-btn-hover-bg:    var(--ef-dropdown-item-hover-bg);
    --dxbl-toolbar-font-size:                var(--ef-dropdown-item-fs);
    --dxbl-toolbar-font-family:              inherit;

    display:     flex;
    align-items: center;
    gap:         var(--ef-dropdown-item-gap);
    width:       100%;
    padding:     var(--ef-dropdown-item-py) var(--ef-dropdown-item-px);
    border:      none;
    background:  transparent;
    font-size:   var(--ef-dropdown-item-fs) !important;
    font-weight: var(--ef-dropdown-item-fw-dx) !important;
    color:       var(--ef-dropdown-item-color) !important;
    cursor:      pointer;
    transition:  background-color 0.12s ease;
    text-align:  left;
    font-family: inherit !important;
    white-space: nowrap;
    line-height: 1.4 !important;
}

.dxbl-toolbar-dropdown .dxbl-toolbar-menu-item:hover,
.dxbl-toolbar-dropdown .dxbl-toolbar-menu-item:focus,
.dxbl-toolbar-dropdown .dxbl-toolbar-menu-item:active,
.dxbl-toolbar-dropdown li button:hover,
.dxbl-toolbar-dropdown li button:focus,
.dxbl-toolbar-dropdown li a:hover,
.dxbl-toolbar-dropdown .dxbl-btn:hover,
.dxbl-toolbar-dropdown .dxbl-btn:focus,
.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item > .dxbl-toolbar-menu-item > .dxbl-dropdown-item.dxbl-btn:hover,
.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item > .dxbl-toolbar-menu-item > .dxbl-dropdown-item.dxbl-btn:focus {
    background-color: var(--ef-dropdown-item-hover-bg) !important;
    color:            var(--ef-dropdown-item-color) !important;
    outline:          none;
}

.dxbl-toolbar-dropdown .dxbl-toolbar-menu-item .dxbl-image,
.dxbl-toolbar-dropdown li button .dxbl-image,
.dxbl-toolbar-dropdown .dxbl-btn .dxbl-image,
.dxbl-toolbar-dropdown .dxbl-toolbar-dropdown-item > .dxbl-toolbar-menu-item > .dxbl-dropdown-item.dxbl-btn .dxbl-image {
    font-size:   var(--ef-dropdown-icon-fs);
    flex-shrink: 0;
    color:       var(--ef-dropdown-icon-color);
}

/* ── Profile context menu — all values from --ef-dropdown-* in easyfirma-theme.css ── */

.user-context-menu.dxbl-context-menu {
    min-width:     var(--ef-dropdown-min-width);
    background:    var(--ef-dropdown-bg);
    border:        var(--ef-dropdown-border);
    border-radius: var(--ef-dropdown-radius);
    box-shadow:    var(--ef-dropdown-shadow);
    overflow:      hidden;
    padding:       var(--ef-dropdown-padding-y) 0;
}

/* Header row (Profil) — non-interactive label */
.user-context-menu .user-context-menu-header {
    pointer-events: none;
}

.user-context-menu .user-context-menu-header .dxbl-menu-item-text-container {
    padding: 0.6rem var(--ef-dropdown-item-px) 0.4rem;
}

.user-context-menu-header-text {
    font-family:  inherit;
    font-size:    var(--ef-dropdown-item-fs);
    font-weight:  700;
    color:        var(--ef-text-primary);
    margin-right: 0.5rem;
}

.user-context-menu-header-dot {
    display:          inline-block;
    width:            0.625rem;
    height:           0.625rem;
    border-radius:    50%;
    background-color: var(--ef-avatar-status);
    vertical-align:   middle;
}

/* Menu items */
.user-context-menu .dxbl-context-menu-item {
    display:     flex;
    align-items: center;
    gap:         var(--ef-dropdown-item-gap);
    width:       100%;
    padding:     var(--ef-dropdown-item-py) var(--ef-dropdown-item-px);
    border:      none;
    background:  transparent;

    --dxbl-menu-item-color:       var(--ef-dropdown-item-color);
    --dxbl-menu-item-hover-color: var(--ef-dropdown-item-color);

    font-size:   var(--ef-dropdown-item-fs) !important;
    font-weight: var(--ef-dropdown-item-fw-dx) !important;
    color:       var(--ef-dropdown-item-color) !important;
    cursor:      pointer;
    transition:  background-color 0.12s ease;
    font-family: inherit !important;
    white-space: nowrap;
    line-height: 1.4 !important;
}

.user-context-menu .dxbl-context-menu-item:hover,
.user-context-menu .dxbl-context-menu-item:focus,
.user-context-menu .dxbl-context-menu-item:active {
    background-color: var(--ef-dropdown-item-hover-bg) !important;
    outline:          none;
}

.user-context-menu .dxbl-context-menu-item .dxbl-menu-item-text,
.user-context-menu .dxbl-context-menu-item .dxbl-menu-item-text-container,
.user-context-menu .dxbl-context-menu-item .dxbl-image {
    color: var(--ef-dropdown-item-color) !important;
}

.user-context-menu .dxbl-context-menu-item .dxbl-image {
    font-size:   var(--ef-dropdown-icon-fs);
    flex-shrink: 0;
    color:       var(--ef-dropdown-icon-color) !important;
}