/*
 * Application-wide layout fixes, loaded after the theme in every layout.
 *
 * 1. Text overflow: the base theme sets `.table tbody tr td { white-space: nowrap }`
 *    for every table, so long values in detail tables (label / value cards) spill
 *    over neighbouring elements. Only data grids inside a horizontal scroller
 *    (.table-responsive) should stay on one line; everything else wraps.
 * 2. Buttons: the theme's .btn-submit / .btn-added / .btn-cancel force their own
 *    padding with !important, so they ignore .btn-sm and stand taller than
 *    Bootstrap buttons beside them. One height scale for every button:
 *    regular 38px, small 31px, large 46px.
 */

/* ── 1. Text overflow ─────────────────────────────────────────────────────── */

/* Tables that are not in a horizontal scroller wrap their content. */
:not(.table-responsive) > .table > tbody > tr > td,
:not(.table-responsive) > .table > tbody > tr > th,
:not(.table-responsive) > table.table > tbody > tr > td {
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Keep figures, dates and controls in one piece even when the row wraps. */
.table td.text-end, .table td.num, .table td.text-nowrap,
.table td .btn, .table td .badge, .table td .badges {
    overflow-wrap: normal;
}
.table td .badge, .table td .badges { white-space: nowrap; }

/* Cards and grid/flex children may shrink instead of pushing out of their column. */
.row > [class*="col"], .card, .card-body, .card-header, .modal-body { min-width: 0; }
.card-body, .card-header, .modal-body, .page-title, .alert, .dropdown-item, .list-group-item {
    overflow-wrap: anywhere;
}
.card-header .card-title, .card-header h5, .card-header h6 { min-width: 0; }

/* Page headers: title and actions wrap instead of overlapping on narrow screens. */
.page-header { flex-wrap: wrap; gap: 12px; }
.page-header .page-title { min-width: 0; flex: 1 1 260px; }
.page-header .page-btn { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.page-header .page-btn > form { margin: 0; }

/* Long codes / slugs / references never stretch their container. */
code, kbd, .font-monospace { overflow-wrap: anywhere; word-break: break-word; }

/* ── 2. Buttons: one size scale ──────────────────────────────────────────── */

.btn:not(.btn-link):not(.p-0):not(.btn-close) {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1.2;
    vertical-align: middle;
}
/* A button label never breaks over two lines (that is what made some taller). */
.btn:not(.text-wrap) { white-space: nowrap; }
/* Icons inside buttons follow the text size instead of stretching the button. */
.btn > img, .btn > svg, .btn > i[data-feather] { height: 16px !important; width: auto !important; margin: 0 !important; flex-shrink: 0; }
.btn-sm > img, .btn-sm > svg { height: 14px !important; }
/* Buttons meant to fill their row keep doing so. */
.btn.w-100, .btn.btn-block, .d-grid > .btn { display: flex; width: 100%; }

/* Theme buttons: same padding and border as Bootstrap buttons. */
.btn-submit, .btn-added, .btn-cancel {
    padding: 8px 18px !important;
    border-width: 1px !important;
    border-style: solid !important;
    min-width: 0 !important;
}
.btn-submit, .btn-added { border-color: transparent; }

/* Small and large variants now apply to every button, theme ones included. */
.btn.btn-sm:not(.btn-link):not(.p-0) {
    min-height: 31px;
    padding: 4px 12px !important;
    font-size: 0.8125rem !important;
    gap: 5px;
}
.btn.btn-lg:not(.btn-link) {
    min-height: 46px;
    padding: 10px 24px !important;
    font-size: 1rem !important;
}

/* Icon-only buttons stay square. */
.btn.btn-icon, .btn.btn-sm.btn-icon { padding-left: 0 !important; padding-right: 0 !important; width: 38px; }
.btn.btn-sm.btn-icon { width: 31px; }

/* Buttons side by side in forms and footers line up. */
.card-footer .btn, .modal-footer .btn, form .btn + .btn, .page-btn .btn { margin-top: 0; margin-bottom: 0; }

/* Keyboard focus is always visible. */
.btn:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* ── 3. Sidebar ──────────────────────────────────────────────────────────── */

/* Long menu labels ("Platform Finance", "Identity & Assets") ran under the arrow. */
.sidebar .sidebar-menu li.submenu > a,
#sidebar-menu li.submenu > a { position: relative; padding-right: 30px !important; }
.sidebar .sidebar-menu li > a > span:not(.menu-arrow):not(.badge),
#sidebar-menu li > a > span:not(.menu-arrow):not(.badge) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sidebar .sidebar-menu li.submenu > a > .menu-arrow,
#sidebar-menu li.submenu > a > .menu-arrow { right: 10px !important; left: auto !important; }

/* ── 4. Detail tables (label / value) ────────────────────────────────────── */

/* Labels take at most 40% and wrap only when the card is narrow; values take the rest. */
.card .table:not(.datanew) > tbody > tr > th[class*="ps-"] { width: 40%; padding-right: 12px !important; overflow-wrap: normal; }