/* OmniTools shared menu and list-row system — 2026-10-25
   Improves navigation, search results, breadcrumbs, FAQs, file rows and footer
   without changing URLs, content order or tool behavior. */

:root {
    --omni-row-surface: rgba(255, 255, 255, .96);
    --omni-row-soft: color-mix(in srgb, var(--omni-accent, #2563eb) 7%, #fff);
    --omni-row-hover: color-mix(in srgb, var(--omni-accent, #2563eb) 11%, #fff);
    --omni-row-active: color-mix(in srgb, var(--omni-accent, #2563eb) 15%, #fff);
    --omni-row-border: color-mix(in srgb, var(--omni-accent, #2563eb) 16%, #dbe3ef);
    --omni-row-ink: #172033;
    --omni-row-muted: #667085;
    --omni-row-accent: var(--omni-accent-hover, #1d4ed8);
    --omni-row-radius: .85rem;
    --omni-row-shadow: 0 .75rem 2.1rem rgba(15, 23, 42, .09);
}

body[data-theme-style="dark"] {
    --omni-row-surface: #151c28;
    --omni-row-soft: color-mix(in srgb, var(--omni-accent, #60a5fa) 13%, #151c28);
    --omni-row-hover: color-mix(in srgb, var(--omni-accent, #60a5fa) 19%, #151c28);
    --omni-row-active: color-mix(in srgb, var(--omni-accent, #60a5fa) 27%, #151c28);
    --omni-row-border: rgba(255, 255, 255, .13);
    --omni-row-ink: #f4f7fb;
    --omni-row-muted: #b5bfd0;
    --omni-row-accent: #bfdbfe;
    --omni-row-shadow: 0 .9rem 2.5rem rgba(0, 0, 0, .34);
}

/* Primary navigation rows. */
.navbar-main .navbar-nav {
    gap: .18rem;
}

.navbar-main .nav-item {
    min-width: 0;
}

.navbar-main .nav-link {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: .42rem;
    padding: .65rem .78rem;
    color: var(--omni-row-ink) !important;
    border: 1px solid transparent;
    border-radius: .72rem;
    line-height: 1.25;
    white-space: nowrap;
    text-decoration: none !important;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease;
}

.navbar-main .nav-link:hover,
.navbar-main .nav-link:focus-visible {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-soft);
    border-color: var(--omni-row-border);
}

.navbar-main .nav-link.active,
.navbar-main .nav-link[aria-current="page"],
.navbar-main .nav-link.omni-nav-highlight {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-active);
    border-color: var(--omni-row-border);
    font-weight: 700;
}

.navbar-main .nav-link i,
.navbar-main .nav-link svg {
    flex: 0 0 auto;
    width: 1.15rem;
    text-align: center;
}

/* Dropdown rows: language, account and category menus. */
.dropdown-menu {
    min-width: 13rem;
    padding: .45rem;
    color: var(--omni-row-ink) !important;
    background: var(--omni-row-surface);
    border: 1px solid var(--omni-row-border);
    border-radius: 1rem;
    box-shadow: var(--omni-row-shadow);
}

.dropdown-menu .dropdown-item,
.omni-category-menu-item {
    display: flex;
    min-height: 2.75rem;
    align-items: center;
    gap: .65rem;
    margin: .08rem 0;
    padding: .65rem .78rem;
    color: var(--omni-row-ink) !important;
    background: transparent;
    border: 1px solid transparent;
    border-radius: .7rem;
    line-height: 1.3;
    white-space: normal;
    text-decoration: none !important;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.omni-category-menu-item:hover,
.omni-category-menu-item:focus-visible {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-hover);
    border-color: var(--omni-row-border);
}

.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item[aria-current="true"] {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-active);
    border-color: var(--omni-row-border);
    font-weight: 700;
}

.dropdown-menu .dropdown-divider {
    margin: .4rem .3rem;
    border-color: var(--omni-row-border);
}

/* Search result rows. */
.omnitools-search-results.list-group {
    gap: .35rem;
    padding: .45rem;
    background: var(--omni-row-surface);
    border: 1px solid var(--omni-row-border);
    border-radius: 1rem;
    box-shadow: var(--omni-row-shadow);
}

.omnitools-search-results .list-group-item {
    min-height: 3.55rem;
    margin: 0;
    padding: .7rem .78rem;
    color: var(--omni-row-ink) !important;
    background: transparent;
    border: 1px solid transparent !important;
    border-radius: .72rem !important;
}

.omnitools-search-results .list-group-item-action:hover,
.omnitools-search-results .list-group-item-action:focus,
.omnitools-search-results .list-group-item-action.active,
.omnitools-search-results .list-group-item-action[aria-selected="true"] {
    color: var(--omni-row-ink) !important;
    background: var(--omni-row-hover);
    border-color: var(--omni-row-border) !important;
    text-decoration: none;
}

.omnitools-search-result {
    display: grid !important;
    grid-template-columns: 2.45rem minmax(0, 1fr) auto;
    align-items: center;
    gap: .7rem;
}

.omnitools-search-result-icon {
    width: 2.35rem;
    height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--omni-row-accent);
    background: var(--omni-row-soft);
    border: 1px solid var(--omni-row-border);
    border-radius: .7rem;
}

.omnitools-search-result-content {
    min-width: 0;
}

.omnitools-search-result-title,
.omnitools-search-result-name {
    display: block;
    overflow: hidden;
    color: var(--omni-row-ink);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.omnitools-search-result-description,
.omnitools-search-result-category {
    color: var(--omni-row-muted) !important;
    font-size: .78rem;
}

/* General interactive list groups and workspace/file rows. */
.list-group:not(.omnitools-search-results) {
    overflow: hidden;
    background: var(--omni-row-surface);
    border: 1px solid var(--omni-row-border);
    border-radius: 1rem;
}

.list-group:not(.omnitools-search-results) > .list-group-item {
    min-height: 3.1rem;
    padding: .72rem .85rem;
    color: var(--omni-row-ink) !important;
    background: var(--omni-row-surface);
    border-color: var(--omni-row-border);
    line-height: 1.45;
}

.list-group:not(.omnitools-search-results) > .list-group-item-action:hover,
.list-group:not(.omnitools-search-results) > .list-group-item-action:focus,
.list-group:not(.omnitools-search-results) > .list-group-item.active {
    color: var(--omni-row-ink) !important;
    background: var(--omni-row-hover);
}

.document-file-list,
.omni-file-list,
[data-file-list] {
    overflow: hidden;
    color: var(--omni-row-ink) !important;
    background: var(--omni-row-surface);
    border: 1px solid var(--omni-row-border);
    border-radius: 1rem;
}

.document-file-list > *,
.omni-file-list > *,
[data-file-list] > * {
    min-height: 3.25rem;
    margin: 0 !important;
    padding: .75rem .85rem !important;
    border-bottom: 1px solid var(--omni-row-border);
}

.document-file-list > *:last-child,
.omni-file-list > *:last-child,
[data-file-list] > *:last-child {
    border-bottom: 0;
}

/* Breadcrumb rows are compact, readable and direction-aware. */
.custom-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    margin: 0;
    padding: .45rem .6rem;
    list-style: none;
    color: var(--omni-row-muted);
    background: var(--omni-row-soft);
    border: 1px solid var(--omni-row-border);
    border-radius: .8rem;
}

.custom-breadcrumbs li {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    gap: .3rem;
    line-height: 1.3;
}

.custom-breadcrumbs a {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    padding-inline: .35rem;
    color: var(--omni-row-ink) !important;
    border-radius: .48rem;
    text-decoration: none !important;
}

.custom-breadcrumbs a:hover,
.custom-breadcrumbs a:focus-visible {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-hover);
}

.custom-breadcrumbs .active {
    color: var(--omni-row-muted);
    font-weight: 650;
}

[dir="rtl"] .custom-breadcrumbs .fa-angle-right {
    transform: rotate(180deg);
}

/* FAQ and accordion rows. */
.index-faq .card,
#faq_accordion .card,
.accordion > .card {
    overflow: hidden;
    margin-bottom: .65rem;
    background: var(--omni-row-surface);
    border: 1px solid var(--omni-row-border) !important;
    border-radius: .9rem !important;
    box-shadow: none !important;
}

.index-faq .card-header,
#faq_accordion .card-header,
.accordion > .card > .card-header {
    padding: 0;
    background: transparent;
    border-bottom: 0;
}

.index-faq .card-header .btn,
#faq_accordion .card-header .btn,
.accordion > .card > .card-header .btn,
#faq_accordion h3 > .btn {
    display: flex;
    width: 100%;
    min-height: 3.4rem;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .8rem .9rem;
    color: var(--omni-row-ink) !important;
    text-align: start;
    border: 0;
    border-radius: 0;
    text-decoration: none !important;
}

.index-faq .card-header .btn:hover,
.index-faq .card-header .btn:focus-visible,
#faq_accordion .card-header .btn:hover,
#faq_accordion .card-header .btn:focus-visible,
.accordion > .card > .card-header .btn:hover,
.accordion > .card > .card-header .btn:focus-visible,
#faq_accordion h3 > .btn:hover,
#faq_accordion h3 > .btn:focus-visible {
    background: var(--omni-row-hover);
}

.index-faq .card-body,
#faq_accordion .card-body,
.accordion > .card .card-body {
    color: var(--omni-row-muted);
    border-top: 1px solid var(--omni-row-border);
    line-height: 1.75;
}

/* Footer link rows. */
.app-footer .list-style-none,
.app-footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.app-footer li + li {
    margin-top: .08rem;
}

.app-footer li > a {
    display: inline-flex;
    min-height: 2.35rem;
    align-items: center;
    gap: .45rem;
    padding: .38rem .5rem;
    margin-inline: -.5rem;
    color: var(--omni-row-muted) !important;
    border-radius: .58rem;
    line-height: 1.35;
    text-decoration: none !important;
}

.app-footer li > a:hover,
.app-footer li > a:focus-visible {
    color: var(--omni-row-accent) !important;
    background: var(--omni-row-soft);
}

/* Dense catalog rows keep a predictable reading rhythm. */
.omni-tool-card.d-flex.flex-row {
    min-height: 7.3rem;
}

.omni-tool-card.d-flex.flex-row .omni-tool-card-body {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    gap: .2rem;
}

.omni-tool-card.d-flex.flex-row .omni-tool-name {
    color: var(--omni-row-ink);
    font-weight: 700;
    line-height: 1.35;
}

.omni-tool-card.d-flex.flex-row .omni-tool-description {
    color: var(--omni-row-muted) !important;
    line-height: 1.55;
}

@media (max-width: 991.98px) {
    .navbar-main .navbar-nav {
        gap: .3rem;
    }

    .navbar-main .nav-link {
        width: 100%;
        min-height: 3rem;
        padding: .72rem .8rem;
        white-space: normal;
    }

    .navbar-main .navbar-collapse {
        max-height: min(70vh, 34rem);
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
    }

    .navbar-main .dropdown-menu {
        width: 100%;
        min-width: 0;
        margin-top: .3rem;
        box-shadow: none;
    }
}

@media (max-width: 575.98px) {
    .dropdown-menu .dropdown-item,
    .omni-category-menu-item,
    .omnitools-search-results .list-group-item,
    .list-group:not(.omnitools-search-results) > .list-group-item {
        min-height: 3rem;
    }

    .omnitools-search-results.list-group {
        max-height: min(56vh, 27rem);
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .omnitools-search-result {
        grid-template-columns: 2.35rem minmax(0, 1fr);
    }

    .omnitools-search-result-category {
        display: none;
    }

    .custom-breadcrumbs {
        flex-wrap: nowrap;
        overflow-x: auto;
        white-space: nowrap;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    .app-footer li > a {
        width: 100%;
        min-height: 2.65rem;
    }

    .omni-tool-card.d-flex.flex-row {
        min-height: 6.8rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .navbar-main .nav-link,
    .dropdown-menu .dropdown-item,
    .omni-category-menu-item {
        transition: none;
    }
}

@media print {
    .dropdown-menu,
    .omnitools-search-results,
    .navbar-collapse {
        box-shadow: none !important;
    }
}
