/**
 * Nexuse Theme Override - Ensures Nexuse styling shows through
 */

/* Force Nexuse page structure styling */
#page {
    width: 100% !important;
    position: relative !important;
    margin: 0 auto !important;
}

/* Header styling */
#header {
    width: 100% !important;
    position: relative !important;
    z-index: 1000 !important;
    background: #f8f8f8 !important;
    border-bottom: 1px solid #ddd !important;
}

#header .wrap {
    position: relative !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 20px !important;
}

.site-logo h1 {
    margin: 0 !important;
    float: left !important;
}

.header-sidebar {
    float: right !important;
}

/* Navigation bar styling */
#header-bar {
    position: relative !important;
    z-index: 4 !important;
    background: #333 !important;
    color: white !important;
}

#header-bar .wrap {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 10px 20px !important;
}

/* Olivero's region.css adds margin-block-end: var(--sp) (54px) to blocks inside
   a region. In the nav bar this left a tall empty gap below the menu (previously
   occupied by the embedded Twitter feed). Remove it so the bar hugs the menu. */
#header-bar .region--main-menu > * {
    margin-block-end: 0 !important;
}

/* Vertically center the menu links and social icons within the nav bar.
   The original markup uses floats, which top-align items of differing heights
   (menu links are 34px, the social block 40px). Flexbox centers them cleanly. */
#header-bar .wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

#header-bar .wrap > .cleared {
    display: none !important;
}

#header-bar .header-social {
    display: flex !important;
    align-items: center !important;
    padding-top: 0 !important;
}

/* Front page: the main content region renders an empty "home page" node, which
   left a large empty band between the nav bar and the intro text. The real
   homepage content lives in the content_section region, so hide the empty one.
   Scoped to the front page so inner pages keep their main content. */
#body.is-front > .region--content {
    display: none !important;
}

.main-menu ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.main-menu li {
    display: inline-block !important;
    margin-right: 20px !important;
}

.main-menu a {
    color: white !important;
    text-decoration: none !important;
    padding: 10px 0 !important;
}

.main-menu a:hover {
    color: #ccc !important;
}

/* Clear floats */
.cleared {
    clear: both !important;
}

/* Override Drupal's default styles */
.dialog-off-canvas-main-canvas {
    /* Remove Olivero wrapper effects */
}

/* Make textwidget visible */
.textwidget {
    color: #333 !important;
    font-size: 14px !important;
}

/* Footer styling */
#footer {
    background: #f8f8f8 !important;
    margin-top: 40px !important;
    padding: 40px 0 !important;
    border-top: 1px solid #ddd !important;
}

#footer-bottom {
    background: #333 !important;
    color: white !important;
    padding: 20px 0 !important;
}

#footer-bottom .wrap {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

#footer-copyright {
    float: left !important;
}

#footer-right {
    float: right !important;
}

#footer-right a {
    color: white !important;
    text-decoration: none !important;
}

#footer-right a:hover {
    color: #ccc !important;
}