/* Shared layout guardrails for phone and laptop screens. */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

body {
    min-width: 320px;
}

img,
video,
iframe,
canvas,
svg {
    max-width: 100%;
}

img,
video {
    height: auto;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

pre,
code {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

table {
    max-width: 100%;
}

@media (max-width: 767.98px) {
    .container,
    .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .row > * {
        min-width: 0;
    }

    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .mega-menu {
        width: calc(100vw - 2rem);
        min-width: 0 !important;
        max-width: calc(100vw - 2rem);
    }

    .navbar-brand {
        white-space: normal;
        min-width: 0;
    }

    .card {
        padding-left: clamp(1rem, 4vw, 1.5rem);
        padding-right: clamp(1rem, 4vw, 1.5rem);
    }

    .btn,
    .form-control,
    .form-select {
        min-height: 2.75rem;
    }
}

/* Staff layouts stack on tablets/phones and reserve content width on laptops. */
.dashboard-layout > main { min-width: 0; flex: 1 1 0; }
.table-responsive { max-width: 100%; overflow-x: auto; }
.industry-card {
    display: flex;
    height: 100%;
    min-height: 7rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow-wrap: anywhere;
    text-align: center;
}
.industry-card > span { line-height: 1.25; white-space: normal; }
@media (max-width: 991.98px) {
    .dashboard-layout { flex-direction: column; }
    .dashboard-layout > .sidebar { width: 100%; min-height: auto; }
    .dashboard-layout > .sidebar .nav { flex-direction: row !important; flex-wrap: wrap; gap: .25rem; }
    .dashboard-layout > .sidebar .nav-item { flex: 1 1 12rem; }
    .dashboard-layout > main { width: 100%; }
    #sidebarMenu { width: 100%; min-height: auto; }
}
@media (min-width: 992px) and (max-width: 1399.98px) {
    .dashboard-layout > .sidebar { width: 230px; }
    .dashboard-layout > main { padding-left: 1rem !important; padding-right: 1rem !important; }
}
@media (max-width: 575.98px) {
    .industry-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-left: 0;
        margin-right: 0;
    }
    .industry-grid > .col {
        width: auto;
        min-width: 0;
        padding: 0;
    }
    .industry-grid .industry-card { padding: .9rem .6rem !important; }
    .dashboard-layout > main { padding: 1rem !important; }
    .navbar > .container, .navbar > .container-fluid { flex-wrap: wrap; gap: .5rem; }
    .navbar-brand { font-size: 1rem; overflow-wrap: anywhere; }
    .card .d-flex.justify-content-between { flex-wrap: wrap; gap: .75rem; }
    .form-control, .form-select { font-size: 1rem; }
    .modal-dialog { margin: .5rem; }
    .input-group > .form-control { min-width: 0; }
    h1, h2, h3, h4, .card-title { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
/* Preserve compact branding despite intrinsic logo dimensions. */
.navbar-brand { max-width: 100%; }
.navbar-brand img { width: auto; height: 64px; max-width: 80px; object-fit: contain; flex-shrink: 0; }
@media (max-width: 575.98px) {
    .navbar-brand img { height: 40px; max-width: 48px; margin-right: .5rem !important; }
    .navbar-brand .fs-3 { font-size: 1.15rem !important; }
    .navbar-brand { margin-right: 0; }
    .login-navbar > .container { justify-content: center; }
    .login-navbar .navbar-brand { flex: 1 1 100%; justify-content: center; }
    .login-navbar .navbar-brand > img { width: 48px !important; height: 48px !important; max-width: 48px !important; object-fit: contain; }
    .login-navbar .navbar-brand .fs-3 { display: none; }
    .login-navbar .ms-auto { width: 100%; justify-content: center; }
    .login-navbar .ms-auto .btn { flex: 1 1 auto; white-space: nowrap; }
    .home-navbar > .container-fluid { display: flex; flex-wrap: wrap; gap: .5rem; }
    .home-navbar .navbar-brand { flex: 1 1 auto; }
    .home-navbar .home-search { order: 3; flex: 1 1 100%; width: 100%; max-width: none; padding: 0 !important; }
    .home-navbar .home-search .input-group { width: 100%; }
    .home-navbar .home-search .form-control { padding-right: 3rem; }
    .home-navbar > .container-fluid > .d-flex { margin-left: auto; gap: .25rem !important; }
}

.home-search { max-width: 550px; min-width: 0; }
.home-search .form-control { padding-right: 3.5rem !important; }
.home-search button { top: 0; bottom: 0; margin-top: 0 !important; min-width: 44px; }
@media (max-width: 575.98px) { .directory-search { flex-wrap: wrap; } .directory-search > .input-group { flex-basis: 100%; } .directory-search > button { flex: 1; } .home-navbar .home-search { max-width: none; } }