/**
 * AzuCore26.css
 * Version 1.0.0 - July 2026
 *
 * Generic CSS rules shared across Azuleon websites.
 *
 * This stylesheet should be loaded *after* UIkit 3, allowing selected
 * framework defaults to be overridden with the Azuleon house style while
 * preserving full UIkit functionality.
 *
 * Site-, event-, or project-specific stylesheets should be loaded *after*
 * this file so that they may extend or override these generic rules as
 * required.
 *
 * For ease of maintenance and long-term consistency, this stylesheet is
 * organised into the following sections:
 *
 *   0. Design tokens and colour palette
 *   1. Base styles, resets and framework overrides
 *   2. General typography
 *   3. General layout and reusable components
 *   4. Header and hero
 *   5. Navigation
 *   6. Footer
 *   7. Buttons and form elements
 *   8. Utilities and miscellaneous
 *   9. Responsive adjustments
 *
 * New generic rules should be added to the appropriate section rather than
 * appended to the end of the file, preserving the overall organisation.
 */
 
/* ========================================================================
   0. DESIGN TOKENS AND COLOUR PALETTE
   ======================================================================== */
:root {
    --az-orange: #f26522;
    --az-blue: #0452a7;
    --az-red: #d70303;
    --az-green:#3c800f;
    --az-dark-grey: #6b7280;

    --az-color-mix-1: 85%;

}

/* ========================================================================
   1. BASE STYLES, RESETS AND FRAMEWORK OVERRIDES
   ======================================================================== */

/* ========================================================================
   2. GENERAL TYPOGRAPHY
   ======================================================================== */

/* ========================================================================
   3. GENERAL LAYOUT AND REUSABLE COMPONENTS
   ======================================================================== */
.az-padding-left-10 { padding-left: 10px; }
.az-padding-left-15 { padding-left: 15px; }
.az-padding-left-20 { padding-left: 20px; }

/* ========================================================================
   4. HEADER AND HERO
   ======================================================================== */

/* ========================================================================
   5. NAVIGATION
   ======================================================================== */
/*
 * Generic primary action button
 */
.az-actionButton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-family: var(--font-body);
    font-weight: 600;
    letter-spacing: .015em;
    text-decoration: none;
}

.az-actionButton:hover,
.az-actionButton:focus {
    text-decoration: none;
}

/*
 * Navbar action group
 */
.az-navbar-actions {
    display: flex;
    align-items: center;
    gap: .65rem;
}

/*
 * myArea button
 */
.az-myButton {
    text-transform: none;
    display: inline-flex;
    align-items: center;
    gap: .45em;
}

.az-myButton .fa-solid {
    font-size: .9em;
}

.az-myButton:hover,
.az-myButton:focus {
    color: #fff;
    text-decoration: none;
    /*transform: translateY(-1px);*/
}

.az-myButton:focus-visible {
    outline: 3px solid rgba(23, 59, 109, .22);
    outline-offset: 3px;
}

/*
 * Authentication states
 */
.az-myButton--guest {
    background-color: var(--az-orange);
    color: #fff;
}

.az-myButton--guest:hover,
.az-myButton--guest:focus {
    background-color: color-mix(in srgb, var(--az-orange) var(--az-color-mix-1), black);
    color: #fff;
}

.az-myButton--logged {
    background-color: var(--az-blue);
    color: #fff;
}

.az-myButton--logged:hover,
.az-myButton--logged:focus {
    background-color: color-mix(in srgb, var(--az-blue) var(--az-color-mix-1), white);
    color: #fff;
}

/*
 * Label and icon
 */
.az-myButton__label {
    display: inline-block;
}

.az-myButton__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 1em;
    margin: 0;

    font-size: .92em;
    line-height: 1;
}


.az-logout {
    color: var(--az-dark-grey);
    font-size: 1.5rem;
}

.az-logout:hover,
.az-logout:focus {
    color: var(--az-orange);
}

.az-mobileNav {
    margin-top: 4.5rem;
}

.az-mobileNav > li > a {
    padding: .4rem 0;
    font-family: var(--font-body);
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.35;
    color: rgba(255, 255, 255, .58);
    text-transform: none;
}

.az-mobileNav > li > a:hover,
.az-mobileNav > li > a:focus {
    color: #fff;
}

.az-mobileNav__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.az-mobileNav__button {
    min-width: 10rem;
    justify-content: center;
}

.az-mobileNav__logout {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin-top: .35rem;
    padding: .35rem .15rem;
    font-family: var(--font-body);
    font-size: 1rem;
    font-weight: 500;
    color: rgba(255, 255, 255, .58);
    text-decoration: none;
}

.uk-offcanvas-bar .az-mobileNav__logout:hover,
.uk-offcanvas-bar .az-mobileNav__logout:focus {
    color: var(--az-orange);
    text-decoration: none;
}

/* ========================================================================
   6. FOOTER
   ======================================================================== */

.az-footer {
    background: #fff;
    color: var(--az-ink, #1f2a38);
    border-top: 2px solid var(--az-primary, #173b6d);
}

.az-footer__layout {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 4rem;
}

.az-footer__event {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 1 auto;
    min-width: 0;
}

/*
 * Generic container for the event-specific identity.
 * The event-specific stylesheet controls the internal contents of this block.
 */
.az-footer__event-identity {
    display: flex;
    justify-content: center;
    max-width: 100%;
}

.az-footer__contact {
    margin-top: 1.75rem;
    text-align: center;
}

.az-footer__contact .uk-button {
    white-space: nowrap;

    display: inline-flex;
    align-items: center;
    gap: .55rem;

    padding: .05rem 0.75rem;

    border: 1px solid var(--event-blue);
    border: 1px solid var(--az-orange);
    border-radius: 999px;

    background: #fff;
    color: var(--event-blue);

    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: .02em;
    text-transform: uppercase;

    transition:
        background-color .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}
.az-footer__contact .uk-button:hover,
.az-footer__contact .uk-button:focus {
    background: color-mix(in srgb, white var(--az-color-mix-1), var(--event-blue) );
    color: var(--event-blue);

    border-color: var(--event-blue);

    /*box-shadow: 0 6px 16px rgba(23, 59, 109, .12);*/

    text-decoration: none;
}
.az-footer__contact .uk-button .fa-envelope {
    font-size: .95em;
}


/*
 * Azuleon "Powered by" identity
 */
.az-powered-by {
    flex: 0 0 auto;
    margin-left: auto;
}

.az-powered-by__inner {
    display: inline-grid;
    grid-template-columns: minmax(0, auto) max-content;
    grid-template-areas:
        "caption ."
        "brand   logo"
        "privacy .";
    align-items: center;
    column-gap: 1rem;
    text-align: left;
}

.az-powered-by__caption {
    grid-area: caption;
    margin-bottom: .35rem;
    color: rgba(31, 42, 56, .62);
    font-family: var(--font-body);
    font-size: .75rem;
    line-height: 1.3;
}

.az-powered-by__brand {
    grid-area: brand;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.az-wordmark {
    display: inline-block;
    color: var(--az-ink, #1f2a38);
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.az-wordmark:hover,
.az-wordmark:focus {
    color: var(--az-primary, #173b6d);
    text-decoration: none;
}

.az-wordmark__o {
    color: var(--az-orange);
}

.az-powered-by__descriptor {
    color: rgba(31, 42, 56, .82);
    font-family: var(--font-body);
    font-size: .85rem;
    line-height: 1.25;
    white-space: nowrap;
}

.az-powered-by__logo {
    grid-area: logo;
    display: block;
    width: auto;
    height: 2.3em;
    max-width: none;
}

.az-powered-by__privacy {
    grid-area: privacy;
    margin-top: .35rem;
    font-family: var(--font-body);
    font-size: .60rem;
    letter-spacing: .06em;
    line-height: 1.3;
    text-transform: uppercase;
}

.az-powered-by__privacy a {
    color: rgba(31, 42, 56, .62);
    text-decoration: none;
}

.az-powered-by__privacy a:hover,
.az-powered-by__privacy a:focus {
    color: var(--az-primary, #173b6d);
    text-decoration: underline;
}

/* ========================================================================
   7. BUTTONS AND FORM ELEMENTS
   ======================================================================== */

/* ========================================================================
   8. UTILITIES AND MISCELLANEOUS
   ======================================================================== */

/* ========================================================================
   9. RESPONSIVE ADJUSTMENTS
   ======================================================================== */

/* Footer: intermediate layout */
@media (max-width: 1050px) {

    .az-footer__layout {
        flex-direction: column;
        align-items: center;
        gap: 3rem;
    }

    .az-footer__event {
        align-items: center;
    }

    .az-powered-by {
        margin-left: 0;
        text-align: center;
    }

    .az-powered-by__inner {
        text-align: left;
    }

}

/* Footer: narrow layout */
@media (max-width: 639px) {

    .az-footer__layout {
        gap: 2.5rem;
    }

    .az-footer__event,
    .az-footer__event-identity {
        width: 100%;
    }

    .az-footer__contact {
        margin-top: 1.25rem;
    }

    .az-powered-by {
        width: 100%;
        text-align: center;
    }

    .az-powered-by__inner {
        display: inline-grid;
        text-align: left;
    }

}