/*
 * Modernize <- Minia compatibility shim.
 *
 * The application views were written against the Minia theme. This file
 * re-implements the Minia-only utility classes on top of Modernize's
 * styles.css so existing page markup renders correctly without editing
 * every view. Remove a block once the corresponding views are migrated.
 */

/* ------------------------------------------------------------------ */
/* page-title-box — Minia page header, used by ~51 views              */
/* ------------------------------------------------------------------ */
.page-title-box {
    padding-bottom: 1.5rem;
}

.page-title-box .breadcrumb {
    background-color: transparent;
    padding: 0;
    margin-bottom: 0;
}

.page-title-box h4,
.page-title-box .page-title {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 0;
    text-transform: none;
}

/* ------------------------------------------------------------------ */
/* font-size-* — Minia used px-suffixed helpers, Bootstrap 5 has fs-*  */
/* ------------------------------------------------------------------ */
.font-size-10 { font-size: 10px !important; }
.font-size-11 { font-size: 11px !important; }
.font-size-12 { font-size: 12px !important; }
.font-size-13 { font-size: 13px !important; }
.font-size-14 { font-size: 14px !important; }
.font-size-15 { font-size: 15px !important; }
.font-size-16 { font-size: 16px !important; }
.font-size-17 { font-size: 17px !important; }
.font-size-18 { font-size: 18px !important; }
.font-size-20 { font-size: 20px !important; }
.font-size-22 { font-size: 22px !important; }
.font-size-24 { font-size: 24px !important; }

/* ------------------------------------------------------------------ */
/* bg-soft-* — Modernize ships bg-*-subtle, alias the Minia names      */
/* ------------------------------------------------------------------ */
.bg-soft-primary   { background-color: var(--bs-primary-bg-subtle) !important; }
.bg-soft-secondary { background-color: var(--bs-secondary-bg-subtle) !important; }
.bg-soft-success   { background-color: var(--bs-success-bg-subtle) !important; }
.bg-soft-info      { background-color: var(--bs-info-bg-subtle) !important; }
.bg-soft-warning   { background-color: var(--bs-warning-bg-subtle) !important; }
.bg-soft-danger    { background-color: var(--bs-danger-bg-subtle) !important; }
.bg-soft-light     { background-color: var(--bs-light-bg-subtle) !important; }
.bg-soft-dark      { background-color: var(--bs-dark-bg-subtle) !important; }

/* ------------------------------------------------------------------ */
/* avatar-* — Minia fixed-size media helpers                           */
/* ------------------------------------------------------------------ */
.avatar-xs { height: 2rem;   width: 2rem; }
.avatar-sm { height: 3rem;   width: 3rem; }
.avatar-md { height: 4.5rem; width: 4.5rem; }
.avatar-lg { height: 6rem;   width: 6rem; }
.avatar-xl { height: 7.5rem; width: 7.5rem; }

.avatar-title {
    align-items: center;
    background-color: var(--bs-primary);
    color: #fff;
    display: flex;
    font-weight: 500;
    height: 100%;
    justify-content: center;
    width: 100%;
}

/* ------------------------------------------------------------------ */
/* Misc Minia helpers still referenced by views                        */
/* ------------------------------------------------------------------ */
.fw-medium { font-weight: 500 !important; }

.table-nowrap th,
.table-nowrap td { white-space: nowrap; }

/* Minia's card-title-desc sub-heading */
.card-title-desc {
    color: var(--bs-secondary-color);
    margin-bottom: 1.5rem;
}

/* ------------------------------------------------------------------ */
/* Application-level tweaks carried over from the old style.blade.php  */
/* ------------------------------------------------------------------ */
th {
    position: relative;
    padding-right: 20px;
    white-space: nowrap;
}

th.sorting,
th.sorting_asc,
th.sorting_desc {
    padding-right: 25px;
}

td {
    vertical-align: middle;
}

.ck-editor__editable {
    min-height: 100px !important;
}

.input-group > .form-control,
.input-group > .form-select {
    min-width: 90px !important;
}

/* ------------------------------------------------------------------ */
/* DataTables length control                                           */
/* ------------------------------------------------------------------ */
div.dataTables_wrapper div.dataTables_length label {
    align-items: center;
    display: inline-flex;
    gap: 0.5rem;
    margin-bottom: 0;
}

/* Keep the native select usable if select2 is unavailable or delayed. */
div.dataTables_wrapper div.dataTables_length select.form-select {
    background-position: right 0.75rem center;
    min-width: 78px;
    padding-left: 0.75rem;
    padding-right: 2.25rem;
}

div.dataTables_wrapper div.dataTables_length .select2-container {
    display: inline-block;
    flex: 0 0 78px;
    width: 78px !important;
}

div.dataTables_wrapper div.dataTables_length .select2-container .select2-selection--single,
div.dataTables_wrapper div.dataTables_length .select2-container .select2-selection--single .select2-selection__rendered {
    height: 34px;
    line-height: 32px;
}

div.dataTables_wrapper div.dataTables_length .select2-container .select2-selection--single {
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
}

div.dataTables_wrapper div.dataTables_length .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0.75rem;
    padding-right: 2rem;
}

body .select2-dropdown.dataTables-length-dropdown {
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-box-shadow);
    color: var(--bs-body-color);
    overflow: hidden;
}

body .select2-dropdown.dataTables-length-dropdown .select2-results__option {
    padding: 0.375rem 0.75rem;
}

/* ------------------------------------------------------------------ */
/* select2 — Modernize's styles.css themes select2, but it also sets    */
/* `body .select2-container{display:inline}`, which breaks the          */
/* absolutely positioned dropdown arrow (it escapes above the field).   */
/* Every select in this app is initialised full width, so make the      */
/* container a block box and give the arrow a real width again.         */
/* ------------------------------------------------------------------ */
body .select2-container {
    display: block;
}

body .select2-container--default .select2-selection--single .select2-selection__arrow,
body .select2-container--classic .select2-selection--single .select2-selection__arrow {
    top: 50%;
    right: 8px;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
}

/* select2 inside a Bootstrap modal must out-rank the modal backdrop */
.select2-container--open {
    z-index: 1060;
}

/* Small selects keep their compact height once select2 takes over. */
body select.form-select-sm + .select2-container .select2-selection--single,
body select.form-control-sm + .select2-container .select2-selection--single {
    height: 33px;
}

body select.form-select-sm + .select2-container .select2-selection--single .select2-selection__rendered,
body select.form-control-sm + .select2-container .select2-selection--single .select2-selection__rendered {
    font-size: 0.8125rem;
    line-height: 31px;
}

/* Line-item selects sit inside table cells with no spare room. */
body select.no-padding + .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0.5rem;
    padding-right: 1.75rem;
}

/* Validation errors are set on the hidden <select>; show them on the widget. */
/* The validation JS targets `.prev()` of the message span, which is the      */
/* select2 container once the widget is in place — cover both landing spots.  */
body select.is-invalid + .select2-container .select2-selection--single,
body select.is-invalid + .select2-container .select2-selection--multiple,
body .select2-container.is-invalid .select2-selection--single,
body .select2-container.is-invalid .select2-selection--multiple {
    border-color: var(--bs-form-invalid-border-color, var(--bs-danger));
}

/* ------------------------------------------------------------------ */
/* Sidebar                                                            */
/* ------------------------------------------------------------------ */
/* Give the icon a fixed square box and center the glyph inside it, so */
/* rows sit on one optical axis instead of drifting with font metrics. */
/* Submenu rows carry no icon, so the label span is skipped here.      */
.sidebar-nav ul .sidebar-item .sidebar-link > span:first-child:not(.hide-menu) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 21px;
    height: 21px;
    line-height: 1;
}

.sidebar-nav ul .sidebar-item .sidebar-link .ti {
    line-height: 1;
}

/* Submenus drop the bullet glyph and hang off a single guide line, so */
/* the eye follows one rail instead of a column of identical circles.  */
.sidebar-nav ul .sidebar-item .first-level {
    position: relative;
    margin-left: 30px;
    border-left: 1px solid var(--bs-border-color);
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item > .sidebar-link {
    padding-left: 16px;
    gap: 0;
}

/* The active child needs to sit on the rail, not float beside it. */
.sidebar-nav ul .sidebar-item .first-level .sidebar-item > .sidebar-link.active::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    border-radius: 2px;
    background-color: var(--bs-primary);
}

.sidebar-nav ul .sidebar-item .first-level .sidebar-item > .sidebar-link {
    position: relative;
}

/* Section labels read as dividers rather than as clickable rows. */
.sidebar-nav ul .nav-small-cap {
    margin-top: 18px;
    font-size: 11px;
    letter-spacing: 0.06em;
    opacity: 0.75;
}

/* ---- Menu search -------------------------------------------------- */
.sidebar-search .sidebar-search-icon {
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    font-size: 16px;
    line-height: 1;
    color: var(--bs-secondary-color);
    pointer-events: none;
}

.sidebar-search .form-control {
    padding-left: 34px;
    border-radius: 8px;
}

/* Clear button ships with the browser and collides with the icon padding. */
.sidebar-search input[type="search"]::-webkit-search-cancel-button {
    cursor: pointer;
}

.sidebar-empty {
    padding: 10px 24px;
    font-size: 12px;
    color: var(--bs-secondary-color);
}

/* The search hides rows with [hidden]; theme rules set `display` on those */
/* elements and would otherwise win over the UA default.                   */
#sidebarnav [hidden] {
    display: none !important;
}

/* The collapsed rail is too narrow for a search field; it returns on hover, */
/* matching how the wordmark behaves. */
[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .sidebar-search {
    display: none;
}

[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .left-sidebar:hover .sidebar-search {
    display: block;
}

/* Collapsed sidebar clips .logo-img to 40px, which cuts the wordmark in half. */
/* Swap in the favicon instead, and restore the wordmark while the collapsed   */
/* sidebar is hovered open.                                                    */
.brand-logo .logo-img .app-logo-compact {
    display: none;
}

[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .brand-logo .logo-img .app-logo-full {
    display: none;
}

[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .brand-logo .logo-img .app-logo-compact {
    display: inline-block;
}

[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .left-sidebar:hover .brand-logo .logo-img .app-logo-full {
    display: inline-block;
}

[data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .left-sidebar:hover .brand-logo .logo-img .app-logo-compact {
    display: none;
}
