.awsbreadcrumb {
    display: none !important;
}

/* Ensure logo container allows full height */
.navbar-brand,
.navbar-brand .logo {
    display: flex !important;
    align-items: center !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0.5rem !important; /* space between logo and text */
}

/* Force both logos to follow size */
.logo-light,
.logo-dark {
    height: 30px !important; /* adjusted for better layout */
    width: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block;
}

/* Logo title next to the image */
.logo-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--pst-color-text);
    margin-left: 0.5rem;
    line-height: 1.2;
    white-space: nowrap;
}

/* Default: dark logo hidden */
.logo-dark {
    display: none !important;
}

/* In dark mode: switch logos */
@media (prefers-color-scheme: dark) {
    .logo-light {
        display: none !important;
    }

    .logo-dark {
        display: inline-block !important;
    }
}

/* Fallback override for single <img alt="Logo"> setup */
img[alt="Logo"] {
    height: 30px !important;
    width: auto !important;
}

/* Make sure parent is positioned relative */
.container {
    position: relative;
}


/* Centered title inside the awesome header */
.centered-title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--pst-color-text);
    white-space: nowrap;
    z-index: 50;
    pointer-events: none; /* So it doesn't block interactions */
}

/* Make sure the header is relatively positioned */
.awesome-header {
    position: relative;
}