body {
}

.table > :not(caption) > * > * {
    padding: 0.25rem 0.25rem !important;
}

table.last-py-0 td:last-child {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

table.last-py-0 .list-inline-item:not(:last-child) {
    margin-right: 0.0rem !important;
}

.min-width-150 {
    min-width: 150px !important;
}

.input-group-text {
    padding: 0.5rem 1.1rem !important;
}

.form-icon i {
    left: 13px !important;
}

label.required::after {
    content: '*';
    color: red;
}

.col-form-label {
    padding-top: calc(0.25rem + 1px);
    padding-bottom: calc(0.25rem + 1px);
    font-weight: 500 !important;
}

.col-form-label-light {
    padding-top: calc(0.25rem + 1px);
    padding-bottom: calc(0.25rem + 1px);
}

.card-header {
    border-top: 1px solid var(--vz-border-color);
}

.badge {
    font-size: 0.825rem;
}

.choices[data-type*=select-one] {
    cursor: pointer;
}

.choices {
     margin-bottom: unset !important; 
}

td .choices {
    margin-top: -4px !important;
}

.choices__item choices__placeholder choices__item--selectable {
    overflow: hidden !important;
    max-height: 15px;
}

.form-control:not(input[type='password'],.ccnormal) {
    padding: 0.35rem 0.55rem !important;
    text-transform: uppercase;
}

tr.height-override td .form-control:not(input[type='password'],.ccnormal,textarea) {
    padding: 20% 0.55rem !important;
}

.search-form .form-control {
    text-transform: unset !important;
}

.search-form .form-icon i {
    left: 20px !important;
}

.search-box .form-control {
    padding-left: 40px !important;
}

.choices__inner {
    min-height: auto !important;
    padding-right: 2.6rem !important;
}

.choices__list.choices__list--dropdown {
    min-width: max-content !important;
}

tr.height-override td .choices__inner {
    padding: 7% 0px !important;
}

td .choices__inner {
    border: none !important;
    background-color: transparent !important;
}

.choices__list--single {
    padding: 2px 16px 1px 1px !important;
}

tr.height-override td .choices__list--single {
    padding: 0px 16px 0px 0px !important;
}

tr.height-override td .choices[data-type*=select-one]:after {
    top: 55% !important;
}

td .choices[data-type*=select-one]:after {
    right: 3.5px !important;
}

td .form-control {
    border: none !important;
}

.force-validation-off {
    border: none !important;
}

/* Hides validation messages until their field is invalid. Was written as a bare
   ".text-danger", which also hid every other red element on the site — badges,
   icons, links — so it is scoped to the spans ASP.NET actually emits. */
.text-danger[data-valmsg-for], .text-danger.field-validation-valid, .text-danger.validation-summary-valid {
    display: none;
}

.is-invalid ~ .text-danger, .is-invalid ~ .invalid-tooltip, .was-validated :invalid ~ .text-danger, .was-validated :invalid ~ .invalid-tooltip {
    display: block;
}

td .form-control.is-valid, .was-validated td .form-control:valid {
    border: none !important;
}

.form-control.is-valid, .was-validated .form-control:valid {
    border: 1px solid var(--vz-input-border) !important;
    background-image: none !important;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
    background-image: none;
}

.btn {
    padding: 0.32rem 0.9rem !important;
}

tfoot .btn {
    padding: 0rem 0.9rem !important;
}

.gridjs-head{
    padding-left: 0px !important;
}

.only-currency, .only-number, .only-price {
    text-align: right !important;
}

.company_caption .choices__inner {
    background-color: transparent !important;
    padding: 0px 10px !important;
    border: none !important;
}

/* The company name stays on one line. It is a real company name, so it can be
   anything from "RBSSL" to "THE CORPORATE ADVISORY & CONSULTANCY LIMITED" —
   fit_company_caption() in ihishab.js shrinks the size from 2rem until it fits
   the space the topbar has left. Ellipsis is the floor, past which shrinking
   would stop being readable. */
.company_caption {
    flex: 1 1 auto;
    min-width: 0;
}

.company_caption .choices,
.company_caption .choices__inner {
    width: 100%;
}

.company_caption .choices__inner .choices__list.choices__list--single {
    color: rgba(255,255,255,.85) !important;
    font-size: 2rem !important;
    font-weight: bolder !important;
    white-space: nowrap;
}

.company_caption .choices__list--single .choices__item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* The company name is centred in the space the topbar gives it. company_caption is
   flex:1 1 auto between the logo and the toolbar icons, and the name was sitting at
   the left of that band. Set on the item as well as the container because the widget
   fills the width, so centring the flex box alone would not move the text.

   Choices' own padding is asymmetric (16px left against 4px right, for the dropdown
   arrow). Left as-is that offsets the text; equalising both sides keeps the name
   optically centred while leaving room for the arrow. Scoped to company_caption
   throughout, so no other dropdown in the app is affected. */
.company_caption .choices__inner .choices__list.choices__list--single,
.company_caption .choices__list--single .choices__item {
    text-align: center !important;
}

/* The open dropdown keeps its list left-aligned. text-align inherits, so setting it
   on the widget root would centre the options too -- only the selected name is
   centred, which is why the rule above names choices__list--single and nothing
   higher. This is belt and braces in case a parent picks it up some other way. */
.company_caption .choices__list--dropdown,
.company_caption .choices__list--dropdown .choices__item {
    text-align: left !important;
}

.company_caption .choices__list--single {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.company_caption .choices[data-type*=select-one]:after {
    color: rgba(255,255,255,.85) !important;
    top: 35% !important;
}

.company_caption .choices[data-type*=select-one]:after {
    right: 12.5px !important;
}

.was-validated :invalid ~ .choices > .choices__inner {
    border-color: #ed5e5e;
}

.was-validated :invalid ~ .choices div.choices__item.choices__placeholder.choices__item--selectable {
    color: #ed5e5e;
}

.ri-folders-fill {
    color: lightcoral;
}

a.jstree-anchor:has(.ri-folders-fill) {
    font-weight: bold !important;
}

a.jstree-anchor.jstree-clicked {
    font-style: italic !important;
}

.ri-sim-card-2-fill {
    color: cornflowerblue !important;
}

.footer {
    position: fixed !important;
    box-shadow: 0 2px 24px rgb(15 34 58 / 12%) !important;
    padding: 15px calc(1.5rem / 2) !important;
    height: 50px !important;
}

.form-control[readonly].only-datetime:not(.no-openClick) {
    background-color: transparent !important;
    opacity: 1;
}
/* Submenus open to the right by default. Near the right edge of the window that
   puts them off-screen, so fit_menu_dropdowns() in ihishab.js flips the ones
   that would overflow. Top level opens back from the item's right edge, nested
   levels open to the left of their parent. */
[data-layout="horizontal"] .menu-dropdown.menu-dropdown-left {
    left: auto;
    right: 0;
}

[data-layout="horizontal"] .menu-dropdown .menu-dropdown.menu-dropdown-left {
    left: auto;
    right: 100%;
}

/* Top-level menu items scale as a unit: the padding is in em so it follows the
   font size, which lets fit_menu_bar() in ihishab.js shrink one variable until
   the whole bar fits. With the theme's rem padding, shrinking the text alone
   reclaimed almost nothing — the gaps between items are most of the width. */
[data-layout="horizontal"] .navbar-menu .navbar-nav > .nav-item > .nav-link {
    font-size: var(--ih-menu-font, .925rem);
    white-space: nowrap;
    padding-left: 1.62em;
    padding-right: 1.62em;
}

/* The assistant launcher sits above the theme customizer's, using the same fixed corner. Its own
   offset rather than a shared stack: the two are independent partials and either may be absent. */
.assistant-launcher {
    position: fixed;
    bottom: 100px;
    right: 20px;
    z-index: 1000;
}