/* Reusable actions bar above tables (buttons on the left, filters on the right). */
.table-actions-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 10px;
}

.table-actions-bar-left,
.table-actions-bar-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

/* File Manager — allow context menu dropdown to overflow panel container */
.panel-content,
.panel-container.show {
    overflow: visible !important;
}

/* Bootstrap Validation Summary Override */
.validation-summary-valid {
    display: none;
}

.validation-summary-errors ul {
    margin-bottom: 0;
    padding-left: 1rem;
}

.alert.validation-summary-errors {
    margin-bottom: 1rem;
}

.col-0 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 4.166665%;
    flex: 0 0 4.166665%;
    max-width: 4.166665%;
    width: 4.166665%;
}

.col-1 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
    width: 8.33333%;
}

.col-2 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 16.66666%;
    flex: 0 0 16.66666%;
    max-width: 16.66666%;
    width: 16.66666%;
}

.dataTables_empty {
    font-size: 1.5rem !important;
}

/* Small word wrap correction */
section > ol > li {
    word-break: break-all;
}

code {
    border: 1px solid silver;
    padding: 0.03rem 0.2rem !important;
}

pre.prettyprint {
    border-radius: 0.2rem;
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important;
}

.documentation h2 {
    color: var(--primary);
}

.documentation th:first-child,
.documentation th:nth-child(3) {
    width: 16%;
}

.documentation blockquote {
    margin-left: 1rem;
    padding: 1rem 1rem 0.01rem 1rem;
    font-weight: 400;
    border-radius: 0 4px 4px 0;
    background: #edf2f9;
    border-left: 3px solid var(--primary);
}

    .documentation blockquote.info {
        background: #edf2f9;
        border-left: 3px solid var(--info);
    }

    .documentation blockquote.warning {
        background: #fff4db;
        border-left: 3px solid var(--warning);
    }

    .documentation blockquote.danger {
        background: #fadeeb;
        border-left: 3px solid var(--danger);
    }

/* Enter custom CSS rules for your application here */
img.small-image {
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 5px;
}
span.small-image {
    width: 18px;
    height: 18px;
    display: inline-block;
    margin-right: 5px;
}

.form-control.invalid {
    border-color: #fd3995;
    padding-right: calc(1.47em + 1rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fd3995' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fd3995' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.3675em + 0.25rem) center;
    background-size: calc(0.735em + 0.5rem) calc(0.735em + 0.5rem);
}

/* buttons used in the header section of the page */
.header-btn[data-class='mobile-nav-on'] {
    border-color: var(--theme-primary);
    background-color: var(--theme-primary);
    background-image: none;
    color: var(--theme-light);
}

.min-w-100px {
    min-width: 100px;
}

.min-w-200px {
    min-width: 200px;
}

.min-w-300px {
    min-width: 300px;
}

.min-w-400px {
    min-width: 400px;
}

.nav-function-fixed:not(.nav-function-top) .page-sidebar .primary-nav {
    height: unset !important;
}

.footer-function-fixed .page-content {
    padding-bottom: 0.5rem !important;
}

.swal2-container {
    z-index: 3050 !important;
}

/* SweetAlert2 — styled to match doc-creation-modal design */
.swal2-popup {
    border-radius: 14px !important;
    border: 1px solid #e0e0e0;
    box-shadow: 0px 8px 10px 4px rgba(0, 0, 0, 0.05);
    padding: 30px !important;
}

.swal2-title {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    letter-spacing: 0.024px;
    text-transform: uppercase;
    color: #72768b !important;
    padding: 0 0 18px !important;
}

.swal2-html-container {
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    color: #333 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.swal2-actions {
    margin-top: 30px !important;
    gap: 10px;
}

.swal2-styled.swal2-confirm {
    background-color: var(--theme-primary) !important;
    border: 1px solid var(--theme-primary) !important;
    border-radius: 14px !important;
    height: 44px;
    padding: 0 24px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    min-width: 68px;
}

.swal2-styled.swal2-confirm:hover,
.swal2-styled.swal2-confirm:focus {
    background-color: var(--theme-primary-600) !important;
    border-color: var(--theme-primary-600) !important;
    box-shadow: none !important;
}

.swal2-styled.swal2-cancel {
    background: transparent !important;
    border: 1px solid #a6aac1 !important;
    border-radius: 14px !important;
    color: #333 !important;
    height: 44px;
    padding: 0 24px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    min-width: 94px;
}

.swal2-styled.swal2-cancel:hover,
.swal2-styled.swal2-cancel:focus {
    background: rgba(0, 0, 0, 0.05) !important;
    box-shadow: none !important;
}

body.mod-skin-dark .swal2-popup {
    background: #191c22 !important;
    border-color: #393b43;
}

body.mod-skin-dark .swal2-title {
    color: #a6aac1 !important;
}

body.mod-skin-dark .swal2-html-container {
    color: #dee1f9 !important;
}

body.mod-skin-dark .swal2-styled.swal2-cancel {
    color: #dee1f9 !important;
}

body.mod-skin-dark .swal2-styled.swal2-cancel:hover,
body.mod-skin-dark .swal2-styled.swal2-cancel:focus {
    background: rgba(166, 170, 193, 0.15) !important;
}

.dropdown-toggle::after {
    margin-left: 1.255em;
}

.form-group .form-group-editor {
    display: contents;
}

/* doc-area editor theme vars */
body.mod-vw {
    --border: #E1E2EC;
    --form-control: #495057;
    --de-border: #E1E2EC;
    --de-form-label: #a6aac1;
    --de-form-control: #495057;
    --de-card-title: #414659;
    --de-btn-border: #C4C7D6;
    --de-btn-hover-bg: rgba(65, 70, 89, 0.05);
    --de-table-header-color: var(--color-secondary, #6c757d);
    --de-table-border: #E1E2EC;
}

body.mod-skin-dark {
    --border: #393B43;
    --form-control: #DEE1F9;
    --de-border: #393B43;
    --de-form-label: #a6aac1;
    --de-form-control: #DEE1F9;
    --de-card-title: #DEE1F9;
    --de-btn-border: #A6AAC1;
    --de-btn-hover-bg: rgba(166, 170, 193, 0.1);
    --de-table-header-color: var(--color-dark-secondary, #a6aac1);
    --de-table-border: #393B43;
}

/* ─── Tooltip (Bootstrap) — match AsyncTooltip look ──────────────── */
.tooltip.mspc-tooltip {
    --tip-bg: #ffffff;
    --tip-fg: #1c2333;
    --tip-border: rgba(21, 31, 46, 0.10);
    --tip-shadow: 0 4px 16px rgba(15, 18, 32, 0.10), 0 1px 3px rgba(15, 18, 32, 0.06);
    opacity: 1 !important;
}

body.mod-skin-dark .tooltip.mspc-tooltip {
    --tip-bg: #1c2333;
    --tip-fg: #e8ecf2;
    --tip-border: rgba(255, 255, 255, 0.08);
    --tip-shadow: 0 4px 24px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.3);
}

.tooltip.mspc-tooltip .tooltip-inner {
    background: var(--tip-bg);
    color: var(--tip-fg);
    border: 1px solid var(--tip-border);
    border-radius: 6px;
    padding: 7px 11px;
    min-width: 100px;
    max-width: 240px;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.45;
    text-align: center;
    box-shadow: var(--tip-shadow);
}

.tooltip.mspc-tooltip.bs-tooltip-top .arrow::before,
.tooltip.mspc-tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
    border-top-color: var(--tip-bg);
}
.tooltip.mspc-tooltip.bs-tooltip-bottom .arrow::before,
.tooltip.mspc-tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
    border-bottom-color: var(--tip-bg);
}
.tooltip.mspc-tooltip.bs-tooltip-left .arrow::before,
.tooltip.mspc-tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: var(--tip-bg);
}
.tooltip.mspc-tooltip.bs-tooltip-right .arrow::before,
.tooltip.mspc-tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
    border-right-color: var(--tip-bg);
}

/* ─── Popover (Bootstrap) — match AsyncTooltip look ──────────────── */
.popover.mspc-popover {
    --tip-bg: #ffffff;
    --tip-fg: #1c2333;
    --tip-border: rgba(21, 31, 46, 0.10);
    --tip-shadow: 0 4px 16px rgba(15, 18, 32, 0.10), 0 1px 3px rgba(15, 18, 32, 0.06);
    background: var(--tip-bg) !important;
    color: var(--tip-fg) !important;
    border: 1px solid var(--tip-border) !important;
    border-radius: 6px !important;
    box-shadow: var(--tip-shadow) !important;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.45;
    max-width: 320px;
}

body.mod-skin-dark .popover.mspc-popover {
    --tip-bg: #1c2333;
    --tip-fg: #e8ecf2;
    --tip-border: rgba(255, 255, 255, 0.08);
    --tip-shadow: 0 4px 24px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.3);
}

.popover.mspc-popover .popover-header {
    background: transparent;
    color: var(--tip-fg);
    border-bottom: 1px solid var(--tip-border);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 7px 11px;
}

.popover.mspc-popover .popover-body {
    color: var(--tip-fg);
    padding: 7px 11px;
}

.popover.mspc-popover.bs-popover-top .arrow::after,
.popover.mspc-popover.bs-popover-auto[x-placement^="top"] .arrow::after {
    border-top-color: var(--tip-bg);
}
.popover.mspc-popover.bs-popover-bottom .arrow::after,
.popover.mspc-popover.bs-popover-auto[x-placement^="bottom"] .arrow::after {
    border-bottom-color: var(--tip-bg);
}
.popover.mspc-popover.bs-popover-left .arrow::after,
.popover.mspc-popover.bs-popover-auto[x-placement^="left"] .arrow::after {
    border-left-color: var(--tip-bg);
}
.popover.mspc-popover.bs-popover-right .arrow::after,
.popover.mspc-popover.bs-popover-auto[x-placement^="right"] .arrow::after {
    border-right-color: var(--tip-bg);
}