/*
 * FMX custom overrides.
 * Keep Velonic base files untouched; this file only adjusts project-specific UI.
 */

.logo.fmx-versioned-logo {
    line-height: 1;
    padding-top: 12px;
    padding-bottom: 12px;
}

.fmx-logo-version {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    color: var(--fmx-muted-readable, #6c757d);
}

.leftside-menu .logo-light .fmx-logo-version {
    color: #c5ced8;
}

:root,
[data-bs-theme="light"] {
    --fmx-muted-readable: #3f4b57;
    --fmx-muted-readable-subtle: #4b5563;
}

[data-bs-theme="dark"] {
    --fmx-muted-readable: #c5ced8;
    --fmx-muted-readable-subtle: #b8c3cf;
}

.text-muted,
.text-body-secondary,
.fmx-muted-small,
.form-text,
.small.text-muted,
small.text-muted {
    color: var(--fmx-muted-readable) !important;
}

.text-muted.small,
.small .text-muted,
.card .text-muted,
.alert .text-muted,
.modal .text-muted,
.table .text-muted {
    color: var(--fmx-muted-readable-subtle) !important;
}

.fmx-guida-action-box {
    background-color: #fff8e1 !important;
    border-color: #d39e00 !important;
    color: #2b2f32 !important;
}

.fmx-guida-action-label {
    background-color: #198754 !important;
    color: #fff !important;
    border: 1px solid #198754;
    letter-spacing: 0;
}

.fmx-guida-action-text {
    color: #212529 !important;
    font-weight: 400;
    line-height: 1.35;
}

[data-bs-theme="dark"] .fmx-guida-action-box {
    background-color: #3b3215 !important;
    border-color: #b98900 !important;
    color: #f8f9fa !important;
}

[data-bs-theme="dark"] .fmx-guida-action-label {
    background-color: #47ad77 !important;
    color: #fff !important;
    border-color: #47ad77;
}

[data-bs-theme="dark"] .fmx-guida-action-text {
    color: #f8f9fa !important;
}

.leftside-menu .side-nav {
    padding-top: .25rem;
}

.leftside-menu .side-nav .side-nav-link {
    display: flex;
    align-items: center;
    min-height: 32px;
    margin: 1px 0;
    padding-top: .36rem;
    padding-bottom: .36rem;
    line-height: 1.15;
}

.leftside-menu .side-nav .side-nav-link > i {
    line-height: 1;
}

.leftside-menu .side-nav .side-nav-link > span:not(.menu-arrow):not(.badge) {
    min-width: 0;
}

.leftside-menu .side-nav-second-level,
.leftside-menu .side-nav-third-level,
.leftside-menu .side-nav-forth-level {
    padding-top: .1rem;
    padding-bottom: .15rem;
}

.leftside-menu .side-nav-second-level li a,
.leftside-menu .side-nav-second-level li .side-nav-link,
.leftside-menu .side-nav-third-level li a,
.leftside-menu .side-nav-third-level li .side-nav-link,
.leftside-menu .side-nav-forth-level li a,
.leftside-menu .side-nav-forth-level li .side-nav-link {
    min-height: 27px;
    margin: 0;
    padding-top: .24rem;
    padding-bottom: .24rem;
    line-height: 1.15;
}

.side-nav .side-nav-second-level .side-nav-link .menu-text {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    min-width: 0;
    line-height: 1.25;
}

.side-nav .side-nav-second-level .side-nav-link .menu-glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    min-width: 1.15rem !important;
    font-size: 1rem !important;
    line-height: 1;
    text-align: center;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) {
    --fmx-condensed-flyout-width: 270px;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .side-nav-link {
    width: calc(var(--ct-leftbar-width-sm) + var(--fmx-condensed-flyout-width));
    display: flex;
    align-items: center;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .side-nav-link > span:not(.menu-arrow) {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapse > ul,
html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapsing > ul {
    width: var(--fmx-condensed-flyout-width) !important;
    min-width: var(--fmx-condensed-flyout-width);
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapse > ul .side-nav-link,
html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapsing > ul .side-nav-link {
    width: var(--fmx-condensed-flyout-width) !important;
    display: flex;
    align-items: center;
    padding: .55rem 1rem;
    white-space: normal;
    overflow: visible;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapse > ul .menu-text,
html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-item:hover > .collapsing > ul .menu-text {
    width: 100%;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}

html[data-sidenav-size="compact"]:not([data-layout="topnav"]) .side-nav-second-level .side-nav-link {
    white-space: normal;
    line-height: 1.25;
}

.fmx-table-container {
    position: relative;
    background: var(--tz-secondary-bg);
    border-radius: 8px;
    overflow-x: auto;
}

.fmx-table-wrapper {
    border: 1px solid var(--tz-border-color);
}

.fmx-table-scroll {
    overflow: auto;
}

.fmx-table {
    --tz-table-bg: transparent;
}

.fmx-table-compact > :not(caption) > * > * {
    padding-top: .42rem;
    padding-bottom: .42rem;
}

.fmx-table-header th,
.fmx-table thead th {
    background: var(--tz-tertiary-bg) !important;
    color: var(--tz-body-color) !important;
    font-weight: 700;
    white-space: nowrap;
    border-bottom: 1px solid var(--tz-border-color);
}

.fmx-table-sticky thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    box-shadow: inset 0 -1px 0 var(--tz-border-color);
}

.fmx-sort-header {
    vertical-align: middle;
}

.fmx-sort-header.is-active {
    color: var(--tz-emphasis-color) !important;
}

.fmx-sort-button {
    width: 100%;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-align: inherit;
    cursor: pointer;
}

.fmx-sort-button:hover,
.fmx-sort-button:focus-visible {
    color: var(--tz-primary);
}

.fmx-sort-button:focus-visible {
    outline: 2px solid rgba(var(--tz-primary-rgb), .35);
    outline-offset: 2px;
    border-radius: 4px;
}

.fmx-sort-icon {
    font-size: .95rem;
    line-height: 1;
    opacity: .9;
}

.fmx-clickable-row {
    cursor: pointer;
}

.fmx-clickable-row:hover {
    background: #f8f9fb !important;
}

.fmx-clickable-row:hover td:first-child {
    box-shadow: inset 4px 0 0 #0d6efd;
}

.table-hover > tbody > tr:hover input[type="checkbox"],
.table-hover > tbody > tr:hover input[type="radio"],
.table-hover > tbody > tr:hover .form-check-input {
    background-color: var(--distinta-check-bg, var(--tz-input-bg, #fff)) !important;
    border-color: var(--distinta-check-border, var(--tz-border-color, #adb5bd)) !important;
    color: #fff !important;
}

.table-hover > tbody > tr:hover input[type="checkbox"]:checked,
.table-hover > tbody > tr:hover input[type="checkbox"]:indeterminate,
.table-hover > tbody > tr:hover input[type="radio"]:checked,
.table-hover > tbody > tr:hover .form-check-input:checked,
.table-hover > tbody > tr:hover .form-check-input:indeterminate {
    background-color: var(--distinta-check-checked-bg, var(--tz-primary, #0d6efd)) !important;
    border-color: var(--distinta-check-checked-border, var(--tz-primary, #0d6efd)) !important;
}

.table-hover > tbody > tr:hover input[type="checkbox"]:disabled,
.table-hover > tbody > tr:hover input[type="radio"]:disabled,
.table-hover > tbody > tr:hover .form-check-input:disabled {
    background-color: var(--tz-secondary-bg, #e9ecef) !important;
    border-color: var(--tz-border-color, #adb5bd) !important;
}

.table-hover > tbody > tr:hover input[type="checkbox"]:disabled:checked,
.table-hover > tbody > tr:hover input[type="radio"]:disabled:checked,
.table-hover > tbody > tr:hover .form-check-input:disabled:checked {
    background-color: var(--tz-secondary-color, #6c757d) !important;
    border-color: var(--tz-secondary-color, #6c757d) !important;
}

/* FMX keeps the Velonic topbar visible while page content scrolls. */
.fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
    background: #fff !important;
    background-color: #fff !important;
    opacity: 1;
    isolation: isolate;
}

html:not([data-layout="topnav"]) .fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
    position: fixed !important;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1005;
}

html:not([data-layout="topnav"]) .fmx-shell-layout > .content-page {
    box-sizing: border-box;
    min-height: 100vh;
    padding-top: var(--tz-topbar-height);
    padding-bottom: .75rem;
}

@media (min-width: 992px) {
    html:not([data-layout="topnav"]) .fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
        left: var(--tz-leftbar-width);
        margin-left: 0;
    }

    html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
        left: var(--tz-leftbar-width-sm);
    }

    html[data-sidenav-size="compact"]:not([data-layout="topnav"]) .fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
        left: var(--tz-leftbar-width-md);
    }

    html[data-sidenav-size="full"]:not([data-layout="topnav"]) .fmx-shell-layout > .navbar-custom:not(.operaio-topbar-app) {
        left: 0;
    }
}

/* In condensed mode Velonic gives content-page a large demo min-height;
   FMX keeps the shell inside the visible browser viewport. */
html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .fmx-shell-layout > .content-page {
    min-height: calc(100vh - var(--tz-topbar-height) - 2px) !important;
    min-height: calc(100dvh - var(--tz-topbar-height) - 2px) !important;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .fmx-shell-layout > .leftside-menu {
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    padding-bottom: 0 !important;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .fmx-shell-layout > .leftside-menu #leftside-menu-container {
    height: 100% !important;
    max-height: 100% !important;
}
html:not([data-layout="topnav"]) .fmx-shell-layout.fmx-no-leftbar > .content-page {
    margin-left: 0 !important;
}

html:not([data-layout="topnav"]) .fmx-shell-layout.fmx-no-leftbar > .navbar-custom:not(.operaio-topbar-app) {
    left: 0 !important;
    margin-left: 0 !important;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .fmx-shell-layout.fmx-no-leftbar > .content-page,
html[data-sidenav-size="compact"]:not([data-layout="topnav"]) .fmx-shell-layout.fmx-no-leftbar > .content-page,
html[data-sidenav-size="full"]:not([data-layout="topnav"]) .fmx-shell-layout.fmx-no-leftbar > .content-page {
    margin-left: 0 !important;
}
html[data-menu-color="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link,
html[data-bs-theme="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link {
    color: #e7edf6;
}

html[data-menu-color="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link > i,
html[data-bs-theme="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link > i,
html[data-menu-color="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link .menu-glyph,
html[data-bs-theme="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link .menu-glyph {
    color: #f5f8fc;
}

html[data-menu-color="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link:hover,
html[data-menu-color="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link:focus,
html[data-menu-color="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link.active,
html[data-bs-theme="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link:hover,
html[data-bs-theme="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link:focus,
html[data-bs-theme="dark"]:not([data-sidenav-size="condensed"]):not([data-layout="topnav"]) .leftside-menu .side-nav .side-nav-link.active {
    color: var(--tz-menu-item-hover-color);
    background: rgba(59, 192, 195, .10);
}

html[data-menu-color="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav-title,
html[data-bs-theme="dark"]:not([data-layout="topnav"]) .leftside-menu .side-nav-title,
html[data-menu-color="dark"]:not([data-layout="topnav"]) .leftside-menu .menu-title,
html[data-bs-theme="dark"]:not([data-layout="topnav"]) .leftside-menu .menu-title {
    color: rgba(231, 237, 246, .72);
}