:root {
    --bl-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --bl-font-display: var(--bl-font-body);
    --bl-black: #020605;
    --bl-black-soft: #07100d;
    --bl-green-deep: #06261b;
    --bl-green: #087a55;
    --bl-green-bright: #00d084;
    --bl-green-muted: #123c2f;
    --bl-logo-orange: #d88900;
    --bl-logo-orange-bright: #ffad18;
    --bl-logo-orange-dark: #6f4200;
    --bl-white: #ffffff;
    --bl-offwhite: #f3f7f5;
    --bl-muted: #b6c6bf;
    --bl-border: rgba(0, 208, 132, .28);
    --bl-orange-border: rgba(255, 173, 24, .45);
    --bl-shadow: 0 24px 80px rgba(0, 0, 0, .45);
    --bl-radius: 18px;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body.beerleague-site {
    min-height: 100%;
    margin: 0;
    background:
        radial-gradient(circle at 50% -10%, rgba(0, 208, 132, .13), transparent 42rem),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(0deg, rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(145deg, #04120d 0%, #020706 48%, #06261b 100%);
    background-size: auto, 42px 42px, 42px 42px, auto;
    color: var(--bl-offwhite);
    font-family: var(--bl-font-body);
    line-height: 1.45;
    font-size: 14px;
}
a { color: var(--bl-green-bright); text-decoration: none; transition: color .18s ease, opacity .18s ease, background .18s ease, border-color .18s ease, transform .18s ease; }
a:hover, a:focus { color: var(--bl-white); }
img { max-width: 100%; height: auto; }
.skip-link { position: absolute; left: -9999px; top: 1rem; z-index: 1000; padding: .8rem 1rem; background: var(--bl-green-bright); color: #00150d; border-radius: 999px; }
.skip-link:focus { left: 1rem; }

.bl-container { width: min(1360px, calc(100% - 36px)); margin-inline: auto; }
.bl-site-header { position: relative; padding: .7rem 0 .65rem; }
.bl-header-inner { width: min(1120px, calc(100% - 32px)); margin: 0 auto; text-align: center; }
.bl-topbar { margin-bottom: .7rem; color: var(--bl-muted); font-size: .92rem; }
.bl-brand { display: inline-flex; align-items: center; justify-content: center; margin: .1rem auto .55rem; filter: drop-shadow(0 20px 34px rgba(0,0,0,.55)); }
.bl-brand img { width: min(520px, 76vw); display: block; }

/* Top Menu position: black/green/orange to match the BEERLEAGUE logo */
.bl-top-menu {
    width: min(960px, 100%);
    margin: 0 auto .55rem;
    padding: .28rem;
    border: 1px solid rgba(0, 208, 132, .28);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(0,0,0,.72), rgba(2,20,14,.76));
    box-shadow: inset 0 1px rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.32);
}
.bl-top-menu ul,
.bl-module-nav ul { list-style: none; margin: 0; padding: 0; }
.bl-top-menu ul { display: flex; gap: .45rem; justify-content: center; align-items: center; flex-wrap: wrap; }
.bl-top-menu li { margin: 0; padding: 0; }
.bl-top-menu a,
.bl-top-menu .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: .48rem .85rem;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--bl-logo-orange-bright);
    background: transparent;
    font-weight: 950;
    letter-spacing: .035em;
    line-height: 1;
    text-transform: uppercase;
    text-shadow: 2px 2px 0 rgba(0,0,0,.65);
}
.bl-top-menu a:hover,
.bl-top-menu a:focus,
.bl-top-menu .current > a,
.bl-top-menu .active > a,
.bl-top-menu .active .nav-link {
    color: #07100d;
    border-color: var(--bl-orange-border);
    background: linear-gradient(180deg, var(--bl-logo-orange-bright), var(--bl-logo-orange));
    box-shadow: inset 0 1px rgba(255,255,255,.35), 0 10px 26px rgba(216,137,0,.18);
    transform: translateY(-1px);
    text-shadow: none;
}

/* Server Status row. Assign one server module to each position: server-status-1, server-status-2, server-status-3. */
.bl-server-status-row {
    width: min(960px, 100%);
    margin: .45rem auto .55rem;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
    align-items: stretch;
}
.bl-server-status-slot {
    min-width: 0;
}
.bl-server-status-count-1 { grid-template-columns: minmax(0, 1fr); }
.bl-server-status-count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bl-server-status-count-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bl-server-status-row .moduletable,
.bl-server-status-row .card,
.bl-server-status-row .well {
    height: 100%;
    margin: 0;
    padding: .65rem;
    border: 1px solid rgba(0, 208, 132, .32);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(6, 64, 44, .88), rgba(3, 24, 17, .92));
    color: var(--bl-offwhite);
    box-shadow: 0 14px 32px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.05);
    overflow: hidden;
}
.bl-server-status-row .moduletable > h3,
.bl-server-status-row h3 {
    margin: 0 0 .45rem;
    color: var(--bl-white);
    font-size: .82rem;
    line-height: 1.1;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.bl-server-status-row a {
    color: var(--bl-green-bright);
}
.bl-server-status-row .btn,
.bl-server-status-row button,
.bl-server-status-row input[type="submit"] {
    min-height: 30px;
    padding: .38rem .65rem;
    font-size: .72rem;
    border-radius: 8px;
}
.bl-server-status-row img {
    max-width: 100%;
}

/* Shared button style */
.bl-btn, .btn, button, input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: .56rem 1rem;
    border: 1px solid rgba(0, 208, 132, .45);
    border-radius: 999px;
    background: linear-gradient(180deg, #0b8b60 0%, #064c36 100%);
    color: var(--bl-white);
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
    box-shadow: inset 0 1px rgba(255,255,255,.18), 0 12px 28px rgba(0,0,0,.28);
    cursor: pointer;
}
.bl-btn:hover, .btn:hover, button:hover, input[type="submit"]:hover { background: linear-gradient(180deg, #0faf78 0%, #076747 100%); color: var(--bl-white); }

/* Top Search position. Supports the BEERLEAGUE Stats Search module and Joomla search/finder modules. */
.bl-top-search-area {
    width: min(880px, 100%);
    margin: .45rem auto .65rem;
    padding: .55rem .7rem;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 18px;
    background: rgba(255,255,255,.045);
    box-shadow: inset 0 1px rgba(255,255,255,.04), 0 16px 44px rgba(0,0,0,.22);
}
.bl-top-search-area .bl-stats-search,
.bl-stats-search {
    width: min(820px, 100%);
    margin: 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    display: flex;
    gap: .55rem;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.bl-top-search-area .bl-stats-search form,
.bl-stats-search form,
.bl-top-search-area .mod-finder__search,
.bl-top-search-area .finder,
.bl-top-search-area form.form-search,
.bl-top-search-area form {
    flex: 1 1 205px;
    display: flex;
    gap: .55rem;
    align-items: center;
    min-width: 0;
    max-width: 100%;
}
.bl-top-search-area input[type="search"],
.bl-top-search-area input[type="text"],
.bl-stats-search input[type="search"],
.bl-stats-search input[type="text"] {
    min-width: 0;
    flex: 1 1 auto;
    height: 42px;
    border-radius: 999px;
    border: 1px solid rgba(0,208,132,.22);
    background: rgba(255,255,255,.96);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 12px 26px rgba(0,0,0,.18);
    color: #101714;
    padding: .55rem .9rem;
    font: inherit;
}
.bl-top-search-area button,
.bl-top-search-area input[type="submit"],
.bl-stats-search button {
    flex: 0 0 auto;
    min-width: 52px;
    height: 42px;
    padding: .65rem .95rem;
}

.bl-module-nav:not(:empty) { margin: 1rem auto; }
.bl-stats-nav { display: flex; gap: .55rem; justify-content: center; flex-wrap: wrap; align-items: center; margin: 1rem auto 1.5rem; }

/* Stats Navigation module position. This is separate from Top Menu and renders only once. */
.bl-beerleague-nav-area {
    width: min(1000px, 100%);
    margin: .2rem auto .75rem;
    padding: .2rem .4rem;
}
.bl-beerleague-nav-area .bl-stats-nav,
.bl-beerleague-nav-area .bl-module-stats-nav {
    margin: 0 auto;
    display: flex;
    gap: .55rem;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.bl-beerleague-nav-area .bl-btn {
    min-height: 36px;
    padding-inline: .95rem;
}

/* Featured Articles position replaces the old large hero box. */
.bl-featured-section { padding: .25rem 0 .85rem; }
.bl-featured-articles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
    align-items: stretch;
}
.bl-featured-articles > .moduletable,
.bl-featured-articles > section,
.bl-featured-articles > div,
.bl-featured-articles article,
.bl-featured-articles .newsflash-item,
.bl-featured-articles .mod-articlesnews__item {
    min-width: 0;
}
.bl-featured-articles .moduletable,
.bl-featured-articles article,
.bl-featured-articles .newsflash-item,
.bl-featured-articles .mod-articlesnews__item,
.bl-feature-card {
    border: 1px solid var(--bl-border);
    border-radius: var(--bl-radius);
    background: linear-gradient(180deg, rgba(6,38,27,.82), rgba(2,6,5,.88));
    box-shadow: var(--bl-shadow);
    padding: clamp(.75rem, 1.4vw, 1rem);
    backdrop-filter: blur(6px);
}
.bl-featured-articles h2,
.bl-featured-articles h3,
.bl-featured-articles .moduletable > h3 {
    margin: 0 0 .7rem;
    color: var(--bl-white);
    text-transform: uppercase;
    letter-spacing: .05em;
    text-shadow: 2px 2px 0 rgba(0, 208, 132, .18);
}
.bl-featured-articles p { color: var(--bl-muted); }
.bl-featured-articles .readmore a,
.bl-featured-articles .btn {
    margin-top: .8rem;
}
.bl-featured-articles .newsflash,
.bl-featured-articles .mod-articlesnews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
}

.bl-main { padding: .55rem 0 3rem; }
.bl-breadcrumbs { margin: 0 0 1rem; color: var(--bl-muted); }
.bl-above-content, .bl-below-content { margin: 0 0 1.2rem; }
.bl-below-content { margin-top: 1.2rem; }
.bl-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.bl-sidebar { min-width: 0; }
.bl-content-card,
.moduletable:not(.bl-sidebar-right .moduletable),
.card,
.well {
    border: 1px solid var(--bl-border);
    border-radius: var(--bl-radius);
    background: linear-gradient(180deg, rgba(6,38,27,.82), rgba(2,6,5,.86));
    box-shadow: var(--bl-shadow);
    backdrop-filter: blur(6px);
}
.bl-content-card { padding: clamp(.75rem, 1.4vw, 1.1rem); min-width: 0; }
.bl-content-card:empty { display: none; }
.bl-sidebar-left .moduletable { padding: .85rem; margin-bottom: 1rem; }

/* Right sidebar intentionally contrasts with the dark site. */
.bl-sidebar-right {
    color: #07100d;
}
.bl-sidebar-right .moduletable,
.bl-sidebar-right .card,
.bl-sidebar-right .well {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff, #edf4ef);
    color: #07100d;
    box-shadow: 0 18px 42px rgba(0,0,0,.32);
    padding: .85rem;
    margin-bottom: 1rem;
}
.bl-sidebar-right h1,
.bl-sidebar-right h2,
.bl-sidebar-right h3,
.bl-sidebar-right h4,
.bl-sidebar-right label,
.bl-sidebar-right .moduletable > h3 {
    color: #07100d;
    text-shadow: none;
}
.bl-sidebar-right a { color: #006a47; font-weight: 800; }
.bl-sidebar-right a:hover { color: #003a27; }
.bl-sidebar-right input,
.bl-sidebar-right select,
.bl-sidebar-right textarea {
    background: #fff;
    color: #07100d;
    border-color: rgba(0,0,0,.18);
}
.bl-sidebar-right .btn,
.bl-sidebar-right button,
.bl-sidebar-right input[type="submit"] {
    color: var(--bl-white);
    border-color: rgba(0, 208, 132, .55);
    background: linear-gradient(180deg, #0b8b60 0%, #064c36 100%);
}

.bl-footer { padding: 1.5rem 0 2.2rem; color: var(--bl-muted); text-align: center; border-top: 1px solid rgba(0,208,132,.12); }
.bl-footer-note { margin: 1rem 0 0; font-size: .9rem; letter-spacing: .04em; text-transform: uppercase; }

/* Joomla content cleanup */
.page-header h1, .page-header h2, h1, h2, h3 { color: var(--bl-white); letter-spacing: .04em; }
input, select, textarea {
    width: 100%;
    max-width: 100%;
    min-height: 38px;
    border: 1px solid rgba(0,208,132,.25);
    border-radius: 999px;
    background: rgba(255,255,255,.94);
    color: #101714;
    padding: .55rem .85rem;
    font: inherit;
}
textarea { border-radius: 18px; }
table { width: 100%; border-collapse: collapse; }
th, td { border: 1px solid rgba(255,255,255,.12); padding: .7rem; }
th { background: rgba(0, 208, 132, .18); color: var(--bl-green-bright); text-transform: uppercase; letter-spacing: .05em; font-size: .8rem; }
td { background: rgba(0,0,0,.28); }
.alert, .joomla-alert { border-radius: 16px; }

/* BEERLEAGUE stats component/module shared styling */
.bl-stats-shell { width: 100%; }
.bl-stats-header { text-align: center; margin-bottom: 1rem; }
.bl-stats-title { margin: .15rem 0 .75rem; font-size: clamp(1.45rem, 2.2vw, 2.15rem); line-height: 1; text-transform: uppercase; text-shadow: 3px 3px 0 rgba(0, 208, 132, .2); }
.bl-stat-table-wrap { width: 100%; max-width: 100%; overflow: visible; border: 1px solid var(--bl-border); border-radius: 16px; background: rgba(0,0,0,.28); padding: .55rem; }
table.bl-stat-table { table-layout: fixed; width: 100%; font-size: clamp(.64rem, .66vw, .78rem); }
table.bl-stat-table th, table.bl-stat-table td { overflow-wrap: anywhere; word-break: normal; text-align: center; vertical-align: middle; padding: clamp(.28rem, .55vw, .5rem); }
table.bl-stat-table th { background: rgba(0, 208, 132, .16); color: var(--bl-green-bright); }
table.bl-stat-table tbody tr:nth-child(even) td { background: rgba(255,255,255,.045); }
.bl-score-red { color: #ff6b7a; font-weight: 900; }
.bl-score-blue { color: #72d9ff; font-weight: 900; }
.bl-pill { display: inline-flex; align-items: center; justify-content: center; padding: .25rem .55rem; border: 1px solid var(--bl-border); border-radius: 999px; background: rgba(0,208,132,.09); color: var(--bl-white); font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.bl-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .9rem; }
.bl-stat-card { border: 1px solid var(--bl-border); border-radius: 18px; background: rgba(0,0,0,.32); padding: .85rem; }
.bl-stat-card strong { display: block; color: var(--bl-green-bright); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; }
.bl-stat-card span { display: block; color: var(--bl-white); font-size: 1.4rem; font-weight: 900; }
.bl-pagination { display: flex; justify-content: center; gap: .5rem; flex-wrap: wrap; margin: 1rem 0 0; }
.bl-pagination a, .bl-pagination span { min-width: 38px; min-height: 38px; display: inline-flex; align-items:center; justify-content:center; border-radius: 999px; border: 1px solid var(--bl-border); padding: .35rem .65rem; }
.bl-pagination .active { background: var(--bl-green); color: var(--bl-white); font-weight: 900; }

@media (min-width: 1100px) {
    .bl-layout:has(.bl-sidebar-left):has(.bl-sidebar-right) { grid-template-columns: 240px minmax(0, 1fr) 295px; }
    .bl-layout:has(.bl-sidebar-left):not(:has(.bl-sidebar-right)) { grid-template-columns: 250px minmax(0, 1fr); }
    .bl-layout:has(.bl-sidebar-right):not(:has(.bl-sidebar-left)) { grid-template-columns: minmax(0, 1fr) 295px; }
}
@media (max-width: 1100px) {
    .bl-featured-articles,
    .bl-featured-articles .newsflash,
    .bl-featured-articles .mod-articlesnews { grid-template-columns: 1fr; }
    .bl-sidebar-right { color: var(--bl-offwhite); }
}
@media (max-width: 900px) {
    .bl-server-status-row { grid-template-columns: 1fr; width: min(680px, 100%); }
    .bl-container, .bl-header-inner { width: min(100% - 24px, 100%); }
    .bl-content-card { padding: .8rem; }
    .bl-top-menu { border-radius: 16px; }
    .bl-top-menu ul { align-items: stretch; }
    .bl-top-menu li, .bl-top-menu a, .bl-top-menu .nav-link { width: 100%; }
    .bl-top-search-area .bl-stats-search form,
    .bl-stats-search form,
    .bl-top-search-area form { flex-basis: 100%; }
    table.bl-stat-table, table.bl-stat-table thead, table.bl-stat-table tbody, table.bl-stat-table th, table.bl-stat-table td, table.bl-stat-table tr { display: block; }
    table.bl-stat-table thead { display: none; }
    table.bl-stat-table tr { margin: 0 0 .9rem; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; overflow: hidden; }
    table.bl-stat-table td { display: flex; justify-content: space-between; gap: .8rem; text-align: right; border-width: 0 0 1px; }
    table.bl-stat-table td::before { content: attr(data-label); color: var(--bl-green-bright); font-weight: 900; text-transform: uppercase; text-align: left; }
}
@media (max-width: 600px) {
    .bl-brand img { width: min(420px, 88vw); }
    .bl-top-search-area { padding: .55rem; }
    .bl-top-search-area .bl-stats-search form,
    .bl-stats-search form,
    .bl-top-search-area form { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
}

/* v1.0.8 slimline tuning: make the header/logo the focus and reduce bulk elsewhere. */
.bl-site-header + .bl-featured-section,
.bl-site-header + .bl-main {
    margin-top: 0;
}
.bl-top-menu a,
.bl-top-menu .nav-link,
.bl-btn,
.btn,
button,
input[type="submit"],
.bl-beerleague-nav-area .bl-btn,
.bl-stats-nav .bl-btn {
    font-size: .82rem;
}
.bl-beerleague-nav-area .bl-stats-nav,
.bl-stats-nav {
    margin: .45rem auto .8rem;
}
.bl-stats-shell .bl-stats-header {
    margin-bottom: .55rem;
}
.bl-stats-shell .bl-stats-search {
    width: min(760px, 100%);
    margin: .55rem auto .65rem;
    padding: .45rem .55rem;
    border-radius: 16px;
    gap: .5rem;
}
.bl-stats-shell .bl-stats-search form {
    flex: 1 1 185px;
    gap: .45rem;
}
.bl-stats-shell .bl-stats-search input[type="search"],
.bl-stats-shell .bl-stats-search input[type="text"] {
    height: 40px;
    min-height: 40px;
    padding: .48rem .8rem;
    font-size: .88rem;
}
.bl-stats-shell .bl-stats-search button,
.bl-stats-shell .bl-stats-search input[type="submit"] {
    height: 40px;
    min-height: 40px;
    min-width: 40px;
    padding: .42rem .65rem;
    font-size: .76rem;
}
.bl-stats-shell .bl-stats-nav {
    gap: .55rem;
    margin: .55rem auto .9rem;
}
.bl-stats-shell .bl-stats-nav .bl-btn {
    min-height: 36px;
    padding: .5rem .9rem;
    font-size: .78rem;
}
.bl-stat-table-wrap {
    border-radius: 16px;
}
.bl-content-card table,
.bl-content-card .bl-stat-table {
    font-size: .76rem;
}
.bl-content-card th,
.bl-content-card td {
    padding: .48rem;
}
.bl-content-card .bl-pill {
    font-size: .68rem;
    padding: .18rem .45rem;
}
.bl-sidebar-right .moduletable,
.bl-sidebar-right .card,
.bl-sidebar-right .well {
    padding: .9rem;
    font-size: .9rem;
}
.bl-sidebar-right .moduletable > h3,
.bl-sidebar-right h3 {
    margin: 0 0 .7rem;
    font-size: 1.05rem;
    letter-spacing: .02em;
}
.bl-sidebar-right .bl-stat-card,
.bl-sidebar-right .moduletable .bl-stat-card {
    padding: .75rem;
    border-radius: 13px;
}
.bl-sidebar-right .bl-stat-card span {
    font-size: 1.15rem;
}

/* Joomla login module cleanup in the light right sidebar. */
.bl-sidebar-right .mod-login,
.bl-sidebar-right .login,
.bl-sidebar-right form[id*="login"] {
    display: grid;
    gap: .55rem;
}
.bl-sidebar-right .mod-login label,
.bl-sidebar-right .login label,
.bl-sidebar-right form[id*="login"] label {
    margin: 0 0 .22rem;
    color: #07100d;
    font-size: .82rem;
    font-weight: 700;
}
.bl-sidebar-right .mod-login input[type="text"],
.bl-sidebar-right .mod-login input[type="password"],
.bl-sidebar-right .mod-login input[type="email"],
.bl-sidebar-right .login input[type="text"],
.bl-sidebar-right .login input[type="password"],
.bl-sidebar-right .login input[type="email"] {
    min-height: 38px;
    height: 38px;
    padding: .48rem .8rem;
    border-radius: 999px;
    font-size: .86rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.bl-sidebar-right .input-group,
.bl-sidebar-right .controls,
.bl-sidebar-right .control-group {
    max-width: 100%;
}
.bl-sidebar-right .input-group {
    display: flex;
    gap: .4rem;
    align-items: center;
}
.bl-sidebar-right .input-group input {
    min-width: 0;
}
.bl-sidebar-right .input-group .btn,
.bl-sidebar-right .input-password-toggle,
.bl-sidebar-right button.input-password-toggle,
.bl-sidebar-right .btn-secondary {
    min-height: 34px;
    height: auto;
    width: auto;
    padding: .42rem .65rem;
    border-radius: 999px;
    font-size: .72rem;
    line-height: 1.1;
    white-space: nowrap;
    color: #fff;
}
.bl-sidebar-right .mod-login .btn,
.bl-sidebar-right .mod-login button,
.bl-sidebar-right .mod-login input[type="submit"],
.bl-sidebar-right .login .btn,
.bl-sidebar-right .login button,
.bl-sidebar-right .login input[type="submit"] {
    min-height: 34px;
    width: auto;
    max-width: 100%;
    padding: .44rem .85rem;
    border-radius: 999px;
    font-size: .76rem;
    line-height: 1.15;
    letter-spacing: .04em;
    box-shadow: 0 8px 18px rgba(0,0,0,.18);
}
.bl-sidebar-right .mod-login__submit,
.bl-sidebar-right .login .control-group:last-of-type {
    margin-top: .2rem;
}
.bl-sidebar-right .mod-login__submit .btn,
.bl-sidebar-right .login button[type="submit"],
.bl-sidebar-right .login input[type="submit"] {
    min-width: 78px;
}
.bl-sidebar-right .form-check,
.bl-sidebar-right .mod-login__remember {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: .25rem 0;
}
.bl-sidebar-right input[type="checkbox"] {
    width: 18px;
    min-width: 18px;
    height: 18px;
    min-height: 18px;
    padding: 0;
    border-radius: 4px;
}
/* Make Joomla/WebAuthn passkey buttons look like a clean secondary action instead of a huge green badge. */
.bl-sidebar-right .mod-login [class*="webauthn"],
.bl-sidebar-right .mod-login [id*="webauthn"],
.bl-sidebar-right .mod-login [class*="passkey"],
.bl-sidebar-right .mod-login [id*="passkey"],
.bl-sidebar-right .login [class*="webauthn"],
.bl-sidebar-right .login [id*="webauthn"],
.bl-sidebar-right .login [class*="passkey"],
.bl-sidebar-right .login [id*="passkey"] {
    max-width: 100%;
}
.bl-sidebar-right .mod-login [class*="webauthn"] .btn,
.bl-sidebar-right .mod-login [id*="webauthn"] .btn,
.bl-sidebar-right .mod-login [class*="passkey"] .btn,
.bl-sidebar-right .mod-login [id*="passkey"] .btn,
.bl-sidebar-right .mod-login button[class*="webauthn"],
.bl-sidebar-right .mod-login button[id*="webauthn"],
.bl-sidebar-right .mod-login button[class*="passkey"],
.bl-sidebar-right .mod-login button[id*="passkey"],
.bl-sidebar-right .login [class*="webauthn"] .btn,
.bl-sidebar-right .login [id*="webauthn"] .btn,
.bl-sidebar-right .login [class*="passkey"] .btn,
.bl-sidebar-right .login [id*="passkey"] .btn,
.bl-sidebar-right .login button[class*="webauthn"],
.bl-sidebar-right .login button[id*="webauthn"],
.bl-sidebar-right .login button[class*="passkey"],
.bl-sidebar-right .login button[id*="passkey"] {
    width: 100%;
    min-height: 38px;
    justify-content: center;
    gap: .45rem;
    padding: .5rem .7rem;
    border: 1px solid rgba(0, 122, 85, .24);
    border-radius: 12px;
    background: linear-gradient(180deg, #ffffff, #eef5f1);
    color: #064c36;
    box-shadow: inset 0 1px rgba(255,255,255,.9), 0 6px 14px rgba(0,0,0,.08);
    text-shadow: none;
}
.bl-sidebar-right .mod-login svg,
.bl-sidebar-right .login svg,
.bl-sidebar-right .mod-login [class^="icon-"],
.bl-sidebar-right .mod-login [class*=" icon-"],
.bl-sidebar-right .login [class^="icon-"],
.bl-sidebar-right .login [class*=" icon-"] {
    width: 1rem !important;
    height: 1rem !important;
    max-width: 1rem !important;
    max-height: 1rem !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    margin: 0 .35rem 0 0 !important;
    transform: none !important;
}
.bl-sidebar-right .mod-login ul,
.bl-sidebar-right .login ul {
    margin: .65rem 0 0 1rem;
    padding: 0;
    font-size: .86rem;
}
.bl-sidebar-right .mod-login li,
.bl-sidebar-right .login li {
    margin: .25rem 0;
}

@media (max-width: 900px) {
    .bl-brand img { width: min(450px, 86vw); }
    .bl-top-menu a,
    .bl-top-menu .nav-link { min-height: 34px; }
}


/* v1.0.9 Joomla login module refinement: cleaner fields and icon-only password toggle. */
.bl-sidebar-right .mod-login,
.bl-sidebar-right .login,
.bl-sidebar-right form[id*="login"] {
    display: block;
    width: 100%;
}

.bl-sidebar-right .mod-login .control-group,
.bl-sidebar-right .mod-login .form-group,
.bl-sidebar-right .mod-login__username,
.bl-sidebar-right .mod-login__password,
.bl-sidebar-right .mod-login__remember,
.bl-sidebar-right .login .control-group,
.bl-sidebar-right .login .form-group {
    display: flex;
    flex-direction: column;
    gap: .28rem;
    margin: 0 0 .68rem;
    width: 100%;
}

.bl-sidebar-right .mod-login label,
.bl-sidebar-right .login label,
.bl-sidebar-right form[id*="login"] label,
.bl-sidebar-right .control-label {
    order: -1;
    display: block;
    margin: 0;
    padding: 0;
    color: #11201a;
    font-size: .78rem;
    font-weight: 850;
    line-height: 1.2;
    letter-spacing: .01em;
}

.bl-sidebar-right .mod-login .controls,
.bl-sidebar-right .login .controls,
.bl-sidebar-right .mod-login .input-group,
.bl-sidebar-right .login .input-group,
.bl-sidebar-right .mod-login .password-group,
.bl-sidebar-right .login .password-group {
    width: 100%;
    min-width: 0;
}

.bl-sidebar-right .mod-login input[type="text"],
.bl-sidebar-right .mod-login input[type="password"],
.bl-sidebar-right .mod-login input[type="email"],
.bl-sidebar-right .mod-login input[type="username"],
.bl-sidebar-right .login input[type="text"],
.bl-sidebar-right .login input[type="password"],
.bl-sidebar-right .login input[type="email"],
.bl-sidebar-right form[id*="login"] input[type="text"],
.bl-sidebar-right form[id*="login"] input[type="password"],
.bl-sidebar-right form[id*="login"] input[type="email"] {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 40px;
    height: 40px;
    padding: .55rem .82rem;
    border: 1px solid rgba(4, 76, 54, .20);
    border-radius: 12px;
    background: #fff;
    color: #07100d;
    font-size: .88rem;
    font-weight: 650;
    line-height: 1.2;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 6px 14px rgba(0,0,0,.06);
}

.bl-sidebar-right .mod-login input::placeholder,
.bl-sidebar-right .login input::placeholder,
.bl-sidebar-right form[id*="login"] input::placeholder {
    color: rgba(7,16,13,.48);
    font-weight: 500;
}

.bl-sidebar-right .mod-login .input-group,
.bl-sidebar-right .login .input-group,
.bl-sidebar-right form[id*="login"] .input-group {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: .42rem;
    align-items: center;
}

.bl-sidebar-right .mod-login .input-group input,
.bl-sidebar-right .login .input-group input,
.bl-sidebar-right form[id*="login"] .input-group input {
    grid-column: 1;
}

/* Icon-only show password button. Text remains in the DOM for screen readers, but is visually replaced. */
.bl-sidebar-right .input-password-toggle,
.bl-sidebar-right button.input-password-toggle,
.bl-sidebar-right .input-group .input-password-toggle,
.bl-sidebar-right .input-group button[aria-label*="password" i],
.bl-sidebar-right .input-group button[title*="password" i],
.bl-sidebar-right .input-group .btn-secondary,
.bl-sidebar-right .input-group .btn[class*="password"] {
    grid-column: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 12px !important;
    border: 1px solid rgba(4, 76, 54, .24) !important;
    background: linear-gradient(180deg, #f8fbf9, #e8f1ec) !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    overflow: hidden;
    box-shadow: inset 0 1px rgba(255,255,255,.9), 0 6px 14px rgba(0,0,0,.08) !important;
    text-shadow: none !important;
}

.bl-sidebar-right .input-password-toggle::before,
.bl-sidebar-right button.input-password-toggle::before,
.bl-sidebar-right .input-group button[aria-label*="password" i]::before,
.bl-sidebar-right .input-group button[title*="password" i]::before,
.bl-sidebar-right .input-group .btn-secondary::before,
.bl-sidebar-right .input-group .btn[class*="password"]::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background: #064c36;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Zm0 12.5a5 5 0 1 1 0-10a5 5 0 0 1 0 10Zm0-2a3 3 0 1 0 0-6a3 3 0 0 0 0 6Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Zm0 12.5a5 5 0 1 1 0-10a5 5 0 0 1 0 10Zm0-2a3 3 0 1 0 0-6a3 3 0 0 0 0 6Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.bl-sidebar-right .input-password-toggle:hover,
.bl-sidebar-right button.input-password-toggle:hover,
.bl-sidebar-right .input-group button[aria-label*="password" i]:hover,
.bl-sidebar-right .input-group button[title*="password" i]:hover,
.bl-sidebar-right .input-group .btn-secondary:hover,
.bl-sidebar-right .input-group .btn[class*="password"]:hover {
    background: linear-gradient(180deg, #ffffff, #dcebe4) !important;
    border-color: rgba(0, 122, 85, .42) !important;
    transform: none !important;
}

.bl-sidebar-right .input-password-toggle span,
.bl-sidebar-right .input-password-toggle .visually-hidden,
.bl-sidebar-right button.input-password-toggle span,
.bl-sidebar-right .input-group .btn-secondary span {
    font-size: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.bl-sidebar-right .mod-login .btn,
.bl-sidebar-right .mod-login button:not(.input-password-toggle),
.bl-sidebar-right .mod-login input[type="submit"],
.bl-sidebar-right .login .btn,
.bl-sidebar-right .login button:not(.input-password-toggle),
.bl-sidebar-right .login input[type="submit"] {
    min-height: 36px;
    padding: .48rem .85rem;
    border-radius: 12px;
    font-size: .76rem;
    line-height: 1.1;
}

.bl-sidebar-right .mod-login__submit,
.bl-sidebar-right .login .mod-login__submit,
.bl-sidebar-right .login .control-group:last-of-type {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: .35rem 0 .45rem;
}

.bl-sidebar-right .form-check,
.bl-sidebar-right .mod-login__remember,
.bl-sidebar-right .login .remember {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    column-gap: .5rem;
    row-gap: .1rem;
    margin: .2rem 0 .7rem;
}

.bl-sidebar-right .form-check label,
.bl-sidebar-right .mod-login__remember label,
.bl-sidebar-right .login .remember label {
    order: 0;
    margin: 0;
    font-size: .78rem;
    font-weight: 750;
}

.bl-sidebar-right input[type="checkbox"] {
    grid-column: 1;
    margin: 0;
}

/* Keep passkey/WebAuthn as a compact secondary action, not a giant badge. */
.bl-sidebar-right .mod-login [class*="webauthn"] .btn,
.bl-sidebar-right .mod-login [id*="webauthn"] .btn,
.bl-sidebar-right .mod-login [class*="passkey"] .btn,
.bl-sidebar-right .mod-login [id*="passkey"] .btn,
.bl-sidebar-right .mod-login button[class*="webauthn"],
.bl-sidebar-right .mod-login button[id*="webauthn"],
.bl-sidebar-right .mod-login button[class*="passkey"],
.bl-sidebar-right .mod-login button[id*="passkey"],
.bl-sidebar-right .login [class*="webauthn"] .btn,
.bl-sidebar-right .login [id*="webauthn"] .btn,
.bl-sidebar-right .login [class*="passkey"] .btn,
.bl-sidebar-right .login [id*="passkey"] .btn,
.bl-sidebar-right .login button[class*="webauthn"],
.bl-sidebar-right .login button[id*="webauthn"],
.bl-sidebar-right .login button[class*="passkey"],
.bl-sidebar-right .login button[id*="passkey"] {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 38px !important;
    padding: .52rem .75rem !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffffff, #edf4ef) !important;
    color: #064c36 !important;
    border: 1px solid rgba(4, 76, 54, .22) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.9), 0 6px 14px rgba(0,0,0,.08) !important;
    text-shadow: none !important;
}

/* v1.0.10 Login remember-me alignment fix.
   Joomla can output the remember checkbox as mod-login__remember, form-check,
   or a generic control-group. Keep it as a compact horizontal row under the password field. */
.bl-sidebar-right #form-login-remember,
.bl-sidebar-right .mod-login__remember,
.bl-sidebar-right .login .remember,
.bl-sidebar-right .control-group:has(input[type="checkbox"][name="remember"]),
.bl-sidebar-right .form-group:has(input[type="checkbox"][name="remember"]) {
    display: block !important;
    width: 100% !important;
    margin: .2rem 0 .75rem !important;
    padding: 0 !important;
    text-align: left !important;
}

.bl-sidebar-right #form-login-remember .controls,
.bl-sidebar-right #form-login-remember .form-check,
.bl-sidebar-right .mod-login__remember .controls,
.bl-sidebar-right .mod-login__remember .form-check,
.bl-sidebar-right .login .remember .controls,
.bl-sidebar-right .login .remember .form-check,
.bl-sidebar-right .control-group:has(input[type="checkbox"][name="remember"]) .controls,
.bl-sidebar-right .form-group:has(input[type="checkbox"][name="remember"]) .controls {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .48rem !important;
    width: 100% !important;
    min-height: 24px !important;
    text-align: left !important;
}

.bl-sidebar-right #form-login-remember label,
.bl-sidebar-right .mod-login__remember label,
.bl-sidebar-right .login .remember label,
.bl-sidebar-right .control-group:has(input[type="checkbox"][name="remember"]) label,
.bl-sidebar-right .form-group:has(input[type="checkbox"][name="remember"]) label,
.bl-sidebar-right label[for*="remember" i] {
    order: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #11201a !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: .01em !important;
    text-align: left !important;
    white-space: nowrap !important;
}

.bl-sidebar-right #form-login-remember input[type="checkbox"],
.bl-sidebar-right .mod-login__remember input[type="checkbox"],
.bl-sidebar-right .login .remember input[type="checkbox"],
.bl-sidebar-right input[type="checkbox"][name="remember"] {
    order: 1 !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
    display: inline-block !important;
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
    accent-color: #007a55;
    box-shadow: none !important;
}

.bl-sidebar-right .mod-login__submit,
.bl-sidebar-right .login .mod-login__submit,
.bl-sidebar-right .login .control-group:last-of-type {
    justify-content: flex-start !important;
    width: 100% !important;
}

.bl-sidebar-right .mod-login__submit .btn,
.bl-sidebar-right .login button[type="submit"],
.bl-sidebar-right .login input[type="submit"] {
    margin-top: .15rem !important;
}

/* v1.0.11 Top Login position: slim horizontal login at top-right above the logo. */
.bl-top-login-area {
    position: relative;
    z-index: 30;
    padding: .35rem 0 0;
}

.bl-top-login-inner {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 36px;
}

.bl-top-login-area .moduletable,
.bl-top-login-area .card,
.bl-top-login-area .well {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.bl-top-login-area .moduletable > h3,
.bl-top-login-area .card-header,
.bl-top-login-area h1,
.bl-top-login-area h2,
.bl-top-login-area h3,
.bl-top-login-area h4 {
    display: none !important;
}

.bl-top-login-area .mod-login,
.bl-top-login-area .login,
.bl-top-login-area form[id*="login"],
.bl-top-login-area form {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: .4rem !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: .38rem .5rem !important;
    border: 1px solid rgba(255, 173, 24, .34) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.62), rgba(6,38,27,.58)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.06), 0 12px 34px rgba(0,0,0,.32) !important;
    backdrop-filter: blur(6px);
}

.bl-top-login-area .control-group,
.bl-top-login-area .form-group,
.bl-top-login-area .mod-login__username,
.bl-top-login-area .mod-login__password,
.bl-top-login-area .mod-login__submit,
.bl-top-login-area .login .control-group,
.bl-top-login-area .login .form-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .35rem !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bl-top-login-area .controls,
.bl-top-login-area .input-group,
.bl-top-login-area .password-group {
    display: flex !important;
    align-items: center !important;
    gap: .35rem !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Keep labels accessible but visually compact in the top bar. */
.bl-top-login-area label:not([for*="remember" i]),
.bl-top-login-area .control-label:not([for*="remember" i]) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
}

.bl-top-login-area input[type="text"],
.bl-top-login-area input[type="password"],
.bl-top-login-area input[type="email"],
.bl-top-login-area input[type="username"] {
    width: 150px !important;
    min-width: 130px !important;
    max-width: 170px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: .42rem .72rem !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.96) !important;
    color: #07100d !important;
    font-size: .82rem !important;
    font-weight: 650 !important;
    line-height: 1 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.9), 0 8px 18px rgba(0,0,0,.20) !important;
}

.bl-top-login-area input::placeholder {
    color: rgba(7,16,13,.50) !important;
    font-weight: 550 !important;
}

.bl-top-login-area .input-password-toggle,
.bl-top-login-area button.input-password-toggle,
.bl-top-login-area .input-group .input-password-toggle,
.bl-top-login-area .input-group button[aria-label*="password" i],
.bl-top-login-area .input-group button[title*="password" i],
.bl-top-login-area .input-group .btn-secondary,
.bl-top-login-area .input-group .btn[class*="password"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 173, 24, .32) !important;
    background: linear-gradient(180deg, rgba(255,173,24,.92), rgba(216,137,0,.96)) !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px rgba(255,255,255,.35), 0 8px 18px rgba(0,0,0,.18) !important;
    text-shadow: none !important;
}

.bl-top-login-area .input-password-toggle::before,
.bl-top-login-area button.input-password-toggle::before,
.bl-top-login-area .input-group button[aria-label*="password" i]::before,
.bl-top-login-area .input-group button[title*="password" i]::before,
.bl-top-login-area .input-group .btn-secondary::before,
.bl-top-login-area .input-group .btn[class*="password"]::before {
    content: "";
    display: block;
    width: 17px;
    height: 17px;
    background: #07100d;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Zm0 12.5a5 5 0 1 1 0-10a5 5 0 0 1 0 10Zm0-2a3 3 0 1 0 0-6a3 3 0 0 0 0 6Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Zm0 12.5a5 5 0 1 1 0-10a5 5 0 0 1 0 10Zm0-2a3 3 0 1 0 0-6a3 3 0 0 0 0 6Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.bl-top-login-area .input-password-toggle span,
.bl-top-login-area button.input-password-toggle span,
.bl-top-login-area .input-group .btn-secondary span {
    font-size: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.bl-top-login-area .mod-login button:not(.input-password-toggle),
.bl-top-login-area .mod-login input[type="submit"],
.bl-top-login-area .login button:not(.input-password-toggle),
.bl-top-login-area .login input[type="submit"],
.bl-top-login-area button[type="submit"],
.bl-top-login-area input[type="submit"] {
    width: auto !important;
    min-width: 72px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: .4rem .78rem !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 173, 24, .45) !important;
    background: linear-gradient(180deg, var(--bl-logo-orange-bright), var(--bl-logo-orange)) !important;
    color: #07100d !important;
    font-size: .74rem !important;
    font-weight: 950 !important;
    letter-spacing: .045em !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    box-shadow: inset 0 1px rgba(255,255,255,.35), 0 10px 22px rgba(0,0,0,.24) !important;
}

/* Keep the top login very slim: hide remember, forgot links, and bulky passkey/WebAuthn extras in this position. */
.bl-top-login-area #form-login-remember,
.bl-top-login-area .mod-login__remember,
.bl-top-login-area .remember,
.bl-top-login-area .form-check:has(input[type="checkbox"][name="remember"]),
.bl-top-login-area .control-group:has(input[type="checkbox"][name="remember"]),
.bl-top-login-area ul,
.bl-top-login-area .mod-login__options,
.bl-top-login-area [class*="webauthn"],
.bl-top-login-area [id*="webauthn"],
.bl-top-login-area [class*="passkey"],
.bl-top-login-area [id*="passkey"] {
    display: none !important;
}

/* Logged-in view in Top Login. */
.bl-top-login-area .mod-login__userdata,
.bl-top-login-area .userdata,
.bl-top-login-area .login-greeting,
.bl-top-login-area .mod-login__greeting {
    display: inline-flex !important;
    align-items: center !important;
    gap: .45rem !important;
    margin: 0 !important;
    color: var(--bl-logo-orange-bright) !important;
    font-size: .82rem !important;
    font-weight: 850 !important;
    text-shadow: 1px 1px 0 rgba(0,0,0,.7);
}


/* v1.0.19 Top Login logged-in profile link.
   Shows a clear My Profile action for logged-in users so they can edit their Joomla/BEERLEAGUE profile fields. */
.bl-top-login-area .bl-login-userdata {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: .45rem !important;
}

.bl-top-login-area .bl-profile-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 88px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: .4rem .78rem !important;
    border-radius: var(--bl-radius-md) !important;
    border: 1px solid rgba(255, 173, 24, .45) !important;
    background: linear-gradient(180deg, rgba(255,173,24,.96), rgba(216,137,0,.98)) !important;
    color: #07100d !important;
    font-size: .74rem !important;
    font-weight: 950 !important;
    letter-spacing: .045em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: inset 0 1px rgba(255,255,255,.35), 0 10px 22px rgba(0,0,0,.24) !important;
}

.bl-top-login-area .bl-profile-btn:hover,
.bl-top-login-area .bl-profile-btn:focus {
    color: #07100d !important;
    text-decoration: none !important;
    filter: brightness(1.06);
}

.bl-top-login-area .bl-login-logout-action {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
}

@media (max-width: 640px) {
    .bl-top-login-area .bl-login-userdata {
        width: 100% !important;
        justify-content: center !important;
    }
}

@media (max-width: 900px) {
    .bl-top-login-inner {
        justify-content: center;
    }
    .bl-top-login-area .mod-login,
    .bl-top-login-area .login,
    .bl-top-login-area form[id*="login"],
    .bl-top-login-area form {
        justify-content: center !important;
        border-radius: 18px !important;
    }
}

@media (max-width: 640px) {
    .bl-top-login-area .mod-login,
    .bl-top-login-area .login,
    .bl-top-login-area form[id*="login"],
    .bl-top-login-area form {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: .45rem !important;
    }
    .bl-top-login-area .control-group,
    .bl-top-login-area .form-group,
    .bl-top-login-area .mod-login__username,
    .bl-top-login-area .mod-login__password,
    .bl-top-login-area .mod-login__submit,
    .bl-top-login-area .controls,
    .bl-top-login-area .input-group,
    .bl-top-login-area .password-group {
        width: 100% !important;
    }
    .bl-top-login-area input[type="text"],
    .bl-top-login-area input[type="password"],
    .bl-top-login-area input[type="email"],
    .bl-top-login-area input[type="username"] {
        width: 100% !important;
        max-width: 100% !important;
    }
    .bl-top-login-area .input-group,
    .bl-top-login-area .password-group {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 34px !important;
    }
}

/* v1.0.12 squared/slimline refresh.
   Less pill-shaped UI, more Counter-Strike server-panel style with tasteful small radii. */
:root {
    --bl-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --bl-font-display: var(--bl-font-body);
    --bl-radius: 10px;
    --bl-radius-sm: 6px;
    --bl-radius-md: 8px;
    --bl-radius-lg: 12px;
}

/* General shape cleanup: keep slight rounding, remove oversized pill look. */
.bl-top-menu,
.bl-top-search-area,
.bl-beerleague-nav-area,
.bl-content-card,
.bl-featured-articles .moduletable,
.bl-featured-articles article,
.bl-featured-articles .newsflash-item,
.bl-featured-articles .mod-articlesnews__item,
.bl-feature-card,
.bl-sidebar-right .moduletable,
.bl-sidebar-right .card,
.bl-sidebar-right .well,
.bl-stat-table-wrap,
.bl-stat-card,
.card,
.well,
.alert,
.joomla-alert {
    border-radius: var(--bl-radius-lg) !important;
}

.bl-top-menu a,
.bl-top-menu .nav-link,
.bl-btn,
.btn,
button,
input[type="submit"],
.bl-pill,
.bl-pagination a,
.bl-pagination span,
.bl-stats-shell .bl-stats-nav .bl-btn,
.bl-beerleague-nav-area .bl-btn,
.bl-stats-nav .bl-btn,
.bl-featured-articles .readmore a,
.bl-featured-articles .btn {
    border-radius: var(--bl-radius-md) !important;
}

input,
select,
textarea,
.bl-top-search-area input[type="search"],
.bl-top-search-area input[type="text"],
.bl-stats-search input[type="search"],
.bl-stats-search input[type="text"] {
    border-radius: var(--bl-radius-md) !important;
}

textarea {
    border-radius: var(--bl-radius-lg) !important;
}

.bl-top-menu {
    padding: .26rem;
    border-color: rgba(255, 173, 24, .22);
}

.bl-top-menu a,
.bl-top-menu .nav-link {
    min-height: 32px;
    padding: .46rem .8rem;
}

.bl-top-search-area {
    padding: .48rem .6rem;
}

.bl-brand {
    margin-top: .05rem;
    margin-bottom: .48rem;
}

.bl-brand img {
    width: min(560px, 78vw);
}

/* Top Login: make username/password look intentional, compact, and integrated with the header. */
.bl-top-login-area {
    padding: .42rem 0 0;
}

.bl-top-login-inner {
    min-height: 34px;
}

.bl-top-login-area .mod-login,
.bl-top-login-area .login,
.bl-top-login-area form[id*="login"],
.bl-top-login-area form {
    gap: .35rem !important;
    padding: .32rem .38rem !important;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 173, 24, .30) !important;
    background:
        linear-gradient(90deg, rgba(255,173,24,.10), transparent 16%),
        linear-gradient(180deg, rgba(2, 6, 5, .92), rgba(6, 38, 27, .82)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.055), 0 10px 26px rgba(0,0,0,.30) !important;
}

.bl-top-login-area .control-group,
.bl-top-login-area .form-group,
.bl-top-login-area .mod-login__username,
.bl-top-login-area .mod-login__password,
.bl-top-login-area .mod-login__submit,
.bl-top-login-area .login .control-group,
.bl-top-login-area .login .form-group {
    gap: .28rem !important;
}

.bl-top-login-area .controls,
.bl-top-login-area .input-group,
.bl-top-login-area .password-group {
    gap: .28rem !important;
}

.bl-top-login-area input[type="text"],
.bl-top-login-area input[type="password"],
.bl-top-login-area input[type="email"],
.bl-top-login-area input[type="username"] {
    width: 136px !important;
    min-width: 122px !important;
    max-width: 150px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: .42rem .62rem !important;
    border-radius: 7px !important;
    border: 1px solid rgba(0, 208, 132, .24) !important;
    background: rgba(246, 250, 248, .98) !important;
    color: #07100d !important;
    font-size: .8rem !important;
    font-weight: 700 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.92), 0 5px 14px rgba(0,0,0,.22) !important;
}

.bl-top-login-area input[type="text"]:focus,
.bl-top-login-area input[type="password"]:focus,
.bl-top-login-area input[type="email"]:focus,
.bl-top-login-area input[type="username"]:focus {
    outline: none !important;
    border-color: rgba(255, 173, 24, .72) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.92), 0 0 0 2px rgba(255,173,24,.16), 0 5px 14px rgba(0,0,0,.22) !important;
}

.bl-top-login-area input::placeholder {
    color: rgba(7, 16, 13, .42) !important;
}

.bl-top-login-area .input-password-toggle,
.bl-top-login-area button.input-password-toggle,
.bl-top-login-area .input-group .input-password-toggle,
.bl-top-login-area .input-group button[aria-label*="password" i],
.bl-top-login-area .input-group button[title*="password" i],
.bl-top-login-area .input-group .btn-secondary,
.bl-top-login-area .input-group .btn[class*="password"] {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 7px !important;
    border-color: rgba(255, 173, 24, .40) !important;
    background: linear-gradient(180deg, #f2a915, #bd7600) !important;
}

.bl-top-login-area .input-password-toggle::before,
.bl-top-login-area button.input-password-toggle::before,
.bl-top-login-area .input-group button[aria-label*="password" i]::before,
.bl-top-login-area .input-group button[title*="password" i]::before,
.bl-top-login-area .input-group .btn-secondary::before,
.bl-top-login-area .input-group .btn[class*="password"]::before {
    width: 16px;
    height: 16px;
}

.bl-top-login-area .mod-login button:not(.input-password-toggle),
.bl-top-login-area .mod-login input[type="submit"],
.bl-top-login-area .login button:not(.input-password-toggle),
.bl-top-login-area .login input[type="submit"],
.bl-top-login-area button[type="submit"],
.bl-top-login-area input[type="submit"] {
    min-width: 66px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: .38rem .68rem !important;
    border-radius: 7px !important;
    background: linear-gradient(180deg, #ffb320, #d88900) !important;
    border-color: rgba(255, 190, 53, .55) !important;
    color: #07100d !important;
    font-size: .72rem !important;
    box-shadow: inset 0 1px rgba(255,255,255,.36), 0 6px 16px rgba(0,0,0,.22) !important;
}

.bl-top-login-area .mod-login button:not(.input-password-toggle):hover,
.bl-top-login-area .mod-login input[type="submit"]:hover,
.bl-top-login-area .login button:not(.input-password-toggle):hover,
.bl-top-login-area .login input[type="submit"]:hover,
.bl-top-login-area button[type="submit"]:hover,
.bl-top-login-area input[type="submit"]:hover {
    background: linear-gradient(180deg, #ffc04a, #e0950b) !important;
    transform: translateY(-1px);
}

/* Sidebar login should also use smaller squared controls. */
.bl-sidebar-right .mod-login input[type="text"],
.bl-sidebar-right .mod-login input[type="password"],
.bl-sidebar-right .mod-login input[type="email"],
.bl-sidebar-right .mod-login input[type="username"],
.bl-sidebar-right .login input[type="text"],
.bl-sidebar-right .login input[type="password"],
.bl-sidebar-right .login input[type="email"],
.bl-sidebar-right form[id*="login"] input[type="text"],
.bl-sidebar-right form[id*="login"] input[type="password"],
.bl-sidebar-right form[id*="login"] input[type="email"],
.bl-sidebar-right .input-password-toggle,
.bl-sidebar-right button.input-password-toggle,
.bl-sidebar-right .input-group .input-password-toggle,
.bl-sidebar-right .input-group button[aria-label*="password" i],
.bl-sidebar-right .input-group button[title*="password" i],
.bl-sidebar-right .input-group .btn-secondary,
.bl-sidebar-right .input-group .btn[class*="password"],
.bl-sidebar-right .mod-login .btn,
.bl-sidebar-right .mod-login button:not(.input-password-toggle),
.bl-sidebar-right .mod-login input[type="submit"],
.bl-sidebar-right .login .btn,
.bl-sidebar-right .login button:not(.input-password-toggle),
.bl-sidebar-right .login input[type="submit"] {
    border-radius: 8px !important;
}

.bl-sidebar-right input[type="checkbox"] {
    border-radius: 3px !important;
}

@media (max-width: 900px) {
    .bl-top-login-area .mod-login,
    .bl-top-login-area .login,
    .bl-top-login-area form[id*="login"],
    .bl-top-login-area form {
        border-radius: 10px !important;
    }
}


/* v1.0.13 sharper/slimmer pass.
   Reduce oversized rounding, tighten vertical rhythm, and add intentional breathing room around the logo. */
:root {
    --bl-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --bl-font-display: var(--bl-font-body);
    --bl-radius: 6px;
    --bl-radius-sm: 3px;
    --bl-radius-md: 4px;
    --bl-radius-lg: 6px;
}

/* Make the header logo the focus without making the whole header bulky. */
.bl-site-header {
    padding-top: .85rem !important;
    padding-bottom: .55rem !important;
}
.bl-header-inner {
    width: min(1140px, calc(100% - 32px)) !important;
}
.bl-brand {
    margin: .65rem auto .85rem !important;
    padding: .1rem 0 !important;
}
.bl-brand img {
    width: min(575px, 80vw) !important;
}

/* Much squarer global shape language. */
.bl-top-menu,
.bl-top-search-area,
.bl-beerleague-nav-area,
.bl-content-card,
.bl-featured-articles .moduletable,
.bl-featured-articles article,
.bl-featured-articles .newsflash-item,
.bl-featured-articles .mod-articlesnews__item,
.bl-feature-card,
.bl-sidebar-right .moduletable,
.bl-sidebar-right .card,
.bl-sidebar-right .well,
.bl-stat-table-wrap,
.bl-stat-card,
.card,
.well,
.alert,
.joomla-alert,
.bl-player-match-card,
.bl-player-hero-card,
.bl-player-list-card,
.bl-player-metric-card,
.bl-player-section-card,
.bl-sort-controls {
    border-radius: 6px !important;
}

.bl-top-menu a,
.bl-top-menu .nav-link,
.bl-btn,
.btn,
button,
input[type="submit"],
.bl-pill,
.bl-pagination a,
.bl-pagination span,
.bl-stats-shell .bl-stats-nav .bl-btn,
.bl-beerleague-nav-area .bl-btn,
.bl-stats-nav .bl-btn,
.bl-featured-articles .readmore a,
.bl-featured-articles .btn,
.bl-outcome-badge,
.bl-pm-map,
.bl-pm-meta-row span,
.bl-player-quick-pills span,
.bl-compact-record,
.bl-mini-match,
.bl-empty-records {
    border-radius: 4px !important;
}

input,
select,
textarea,
.bl-top-search-area input[type="search"],
.bl-top-search-area input[type="text"],
.bl-stats-search input[type="search"],
.bl-stats-search input[type="text"],
.bl-sort-controls select,
.bl-sidebar-right .mod-login input[type="text"],
.bl-sidebar-right .mod-login input[type="password"],
.bl-sidebar-right .mod-login input[type="email"],
.bl-sidebar-right .login input[type="text"],
.bl-sidebar-right .login input[type="password"],
.bl-sidebar-right .login input[type="email"] {
    border-radius: 4px !important;
}

/* Slimmer vertical rhythm site-wide. */
.bl-container { width: min(1380px, calc(100% - 32px)) !important; }
.bl-top-login-area { padding-top: .3rem !important; }
.bl-top-login-inner { min-height: 30px !important; }
.bl-top-login-area .mod-login,
.bl-top-login-area .login,
.bl-top-login-area form[id*="login"],
.bl-top-login-area form {
    padding: .24rem .32rem !important;
    gap: .28rem !important;
    border-radius: 5px !important;
}
.bl-top-login-area input[type="text"],
.bl-top-login-area input[type="password"],
.bl-top-login-area input[type="email"],
.bl-top-login-area input[type="username"],
.bl-top-login-area .input-password-toggle,
.bl-top-login-area button.input-password-toggle,
.bl-top-login-area .input-group .input-password-toggle,
.bl-top-login-area .input-group button[aria-label*="password" i],
.bl-top-login-area .input-group button[title*="password" i],
.bl-top-login-area .input-group .btn-secondary,
.bl-top-login-area .input-group .btn[class*="password"],
.bl-top-login-area button[type="submit"],
.bl-top-login-area input[type="submit"] {
    height: 30px !important;
    min-height: 30px !important;
    border-radius: 4px !important;
}
.bl-top-login-area input[type="text"],
.bl-top-login-area input[type="password"],
.bl-top-login-area input[type="email"],
.bl-top-login-area input[type="username"] {
    width: 132px !important;
    padding: .34rem .55rem !important;
    font-size: .78rem !important;
}
.bl-top-login-area .input-password-toggle,
.bl-top-login-area button.input-password-toggle,
.bl-top-login-area .input-group .input-password-toggle,
.bl-top-login-area .input-group button[aria-label*="password" i],
.bl-top-login-area .input-group button[title*="password" i],
.bl-top-login-area .input-group .btn-secondary,
.bl-top-login-area .input-group .btn[class*="password"] {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
}
.bl-top-login-area button[type="submit"],
.bl-top-login-area input[type="submit"] {
    min-width: 62px !important;
    padding: .32rem .6rem !important;
    font-size: .7rem !important;
}

.bl-top-menu {
    margin-bottom: .42rem !important;
    padding: .2rem !important;
    border-radius: 6px !important;
}
.bl-top-menu ul { gap: .28rem !important; }
.bl-top-menu a,
.bl-top-menu .nav-link {
    min-height: 29px !important;
    padding: .38rem .72rem !important;
    font-size: .78rem !important;
}
.bl-top-search-area {
    margin: .35rem auto .48rem !important;
    padding: .4rem .5rem !important;
    border-radius: 6px !important;
}
.bl-top-search-area .bl-stats-search,
.bl-stats-search {
    gap: .38rem !important;
}
.bl-top-search-area .bl-stats-search form,
.bl-stats-search form,
.bl-top-search-area form {
    gap: .35rem !important;
}
.bl-top-search-area input[type="search"],
.bl-top-search-area input[type="text"],
.bl-stats-search input[type="search"],
.bl-stats-search input[type="text"] {
    height: 34px !important;
    min-height: 34px !important;
    padding: .4rem .68rem !important;
    font-size: .84rem !important;
}
.bl-top-search-area button,
.bl-top-search-area input[type="submit"],
.bl-stats-search button {
    height: 34px !important;
    min-height: 34px !important;
    padding: .4rem .68rem !important;
    font-size: .74rem !important;
}
.bl-beerleague-nav-area {
    margin: .12rem auto .5rem !important;
    padding: .12rem .25rem !important;
}
.bl-beerleague-nav-area .bl-stats-nav,
.bl-beerleague-nav-area .bl-module-stats-nav,
.bl-stats-nav {
    gap: .38rem !important;
    margin: .32rem auto .55rem !important;
}
.bl-beerleague-nav-area .bl-btn,
.bl-stats-nav .bl-btn,
.bl-btn,
.btn,
button,
input[type="submit"] {
    min-height: 32px !important;
    padding: .42rem .75rem !important;
    font-size: .76rem !important;
}
.bl-main { padding-top: .35rem !important; }
.bl-layout { gap: .75rem !important; }
.bl-content-card { padding: .7rem !important; }
.bl-sidebar-right .moduletable,
.bl-sidebar-right .card,
.bl-sidebar-right .well {
    padding: .7rem !important;
    margin-bottom: .75rem !important;
    border-radius: 6px !important;
}
.bl-sidebar-right .moduletable > h3,
.bl-sidebar-right h3 {
    margin-bottom: .5rem !important;
}

/* Tighter generic content and table controls. */
.page-header h1,
.page-header h2,
h1,
h2,
h3 { margin-top: .25rem; margin-bottom: .55rem; }
th, td { padding: .42rem !important; }
.bl-card-grid { gap: .6rem !important; }
.bl-stat-card { padding: .65rem !important; }
.bl-pagination { margin-top: .65rem !important; gap: .32rem !important; }
.bl-pagination a,
.bl-pagination span {
    min-width: 30px !important;
    min-height: 30px !important;
    padding: .25rem .48rem !important;
}

@media (max-width: 900px) {
    .bl-brand { margin: .45rem auto .65rem !important; }
    .bl-brand img { width: min(470px, 88vw) !important; }
    .bl-content-card { padding: .6rem !important; }
}


/* v1.0.14 logo breathing room.
   Adds clear vertical space around the BEERLEAGUE logo so it becomes the main header focus. */
.bl-site-header {
    padding-top: 1.4rem !important;
    padding-bottom: 1.25rem !important;
}

.bl-top-login-area {
    padding-top: .45rem !important;
    margin-bottom: .9rem !important;
}

.bl-brand {
    margin-top: 2rem !important;
    margin-bottom: 2.15rem !important;
    padding-top: .45rem !important;
    padding-bottom: .45rem !important;
}

.bl-brand img {
    width: min(585px, 80vw) !important;
}

.bl-top-menu {
    margin-top: .2rem !important;
}

@media (max-width: 900px) {
    .bl-site-header {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }
    .bl-top-login-area {
        margin-bottom: .65rem !important;
    }
    .bl-brand {
        margin-top: 1.35rem !important;
        margin-bottom: 1.45rem !important;
        padding-top: .3rem !important;
        padding-bottom: .3rem !important;
    }
    .bl-brand img {
        width: min(500px, 88vw) !important;
    }
}

/* v1.0.15 - horizontal gaming/HUD style breadcrumbs. */
.bl-breadcrumbs {
    margin: 0 0 .9rem;
    color: var(--bl-muted);
    font-size: .82rem;
}

.bl-breadcrumbs ol,
.bl-breadcrumbs ul,
.bl-breadcrumbs .breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: .35rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    counter-reset: none !important;
}

.bl-breadcrumbs li,
.bl-breadcrumbs .breadcrumb-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: .35rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    color: rgba(243, 247, 245, .75);
    font-weight: 750;
    line-height: 1.2;
}

.bl-breadcrumbs li::marker,
.bl-breadcrumbs .breadcrumb-item::marker {
    content: "" !important;
}

.bl-breadcrumbs .breadcrumb-item + .breadcrumb-item::before,
.bl-breadcrumbs li + li::before {
    content: "▶" !important;
    display: inline-flex !important;
    align-items: center;
    color: var(--bl-logo-orange-bright) !important;
    font-size: .72rem;
    line-height: 1;
    opacity: .95;
    text-shadow: 0 0 10px rgba(255, 173, 24, .3);
}

.bl-breadcrumbs .divider,
.bl-breadcrumbs .breadcrumb-divider,
.bl-breadcrumbs .icon-location,
.bl-breadcrumbs .divider img {
    display: none !important;
}

.bl-breadcrumbs a {
    color: var(--bl-green-bright);
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.bl-breadcrumbs a:hover,
.bl-breadcrumbs a:focus {
    color: var(--bl-logo-orange-bright);
}

.bl-breadcrumbs .active,
.bl-breadcrumbs span[itemprop="name"] {
    color: rgba(255, 255, 255, .86);
    text-transform: uppercase;
    letter-spacing: .035em;
}

/* v1.0.17 - hide Joomla article meta/details block above article content. */
.com-content-article .article-info,
.com-content-article dl.article-info,
.com-content-article .article-info-term,
.item-page .article-info,
.item-page dl.article-info,
.item-page .article-info-term,
.view-article .article-info,
.view-article dl.article-info,
.view-article .article-info-term {
    display: none !important;
}


/* v1.0.17: remove yellow/orange outlines from the top menu shell and top login bar. */
.bl-top-menu {
    border-color: rgba(0, 208, 132, .18) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035), 0 10px 28px rgba(0,0,0,.22) !important;
}
.bl-top-menu a,
.bl-top-menu .nav-link {
    border-color: transparent !important;
}
.bl-top-menu a:hover,
.bl-top-menu a:focus,
.bl-top-menu .current > a,
.bl-top-menu .active > a,
.bl-top-menu .active .nav-link {
    border-color: transparent !important;
    box-shadow: inset 0 1px rgba(255,255,255,.24), 0 7px 16px rgba(0,0,0,.18) !important;
}
.bl-top-login-area .mod-login,
.bl-top-login-area .login,
.bl-top-login-area form[id*="login"],
.bl-top-login-area form {
    border-color: rgba(0, 208, 132, .20) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.04), 0 8px 24px rgba(0,0,0,.24) !important;
}
.bl-top-login-area .input-password-toggle,
.bl-top-login-area button.input-password-toggle,
.bl-top-login-area .input-group .input-password-toggle,
.bl-top-login-area .input-group button[aria-label*="password" i],
.bl-top-login-area .input-group button[title*="password" i],
.bl-top-login-area .input-group .btn-secondary,
.bl-top-login-area .input-group .btn[class*="password"] {
    border-color: rgba(0, 208, 132, .26) !important;
}
.bl-top-login-area .mod-login button:not(.input-password-toggle),
.bl-top-login-area .mod-login input[type="submit"],
.bl-top-login-area .login button:not(.input-password-toggle),
.bl-top-login-area .login input[type="submit"],
.bl-top-login-area button[type="submit"],
.bl-top-login-area input[type="submit"] {
    border-color: transparent !important;
    box-shadow: inset 0 1px rgba(255,255,255,.25), 0 7px 16px rgba(0,0,0,.18) !important;
}

/* v1.0.18 - Profile button in login area. */
.bl-login-logout,
.bl-login-logout * {
    box-sizing: border-box;
}

.bl-login-userdata {
    display: flex !important;
    align-items: center !important;
    gap: .45rem !important;
    margin: 0 !important;
}

.bl-profile-btn,
.bl-logout-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 30px !important;
    padding: .38rem .62rem !important;
    border-radius: 4px !important;
    font-size: .72rem !important;
    font-weight: 950 !important;
    letter-spacing: .045em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.bl-top-login-area .bl-login-logout {
    width: auto !important;
}

.bl-top-login-area .bl-login-userdata {
    flex-direction: row !important;
}

.bl-top-login-area .bl-login-greeting {
    color: rgba(255,255,255,.88) !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    letter-spacing: .01em !important;
    text-shadow: 1px 1px 0 rgba(0,0,0,.65) !important;
}

.bl-top-login-area .bl-profile-btn {
    border: 1px solid rgba(0, 208, 132, .48) !important;
    background: linear-gradient(180deg, rgba(0, 145, 94, .96), rgba(0, 96, 67, .96)) !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px rgba(255,255,255,.12), 0 6px 16px rgba(0,0,0,.22) !important;
}

.bl-top-login-area .bl-profile-btn:hover,
.bl-top-login-area .bl-profile-btn:focus-visible {
    background: linear-gradient(180deg, rgba(0, 190, 124, .98), rgba(0, 120, 82, .98)) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.bl-top-login-area .bl-logout-btn {
    min-width: 64px !important;
}

.bl-sidebar-right .bl-login-userdata {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .55rem !important;
    width: 100% !important;
}

.bl-sidebar-right .bl-login-greeting {
    color: #11201a !important;
    font-weight: 850 !important;
    line-height: 1.25 !important;
}

.bl-sidebar-right .bl-profile-btn {
    width: 100% !important;
    border: 1px solid rgba(0, 122, 85, .35) !important;
    background: linear-gradient(180deg, #ffffff, #e9f3ee) !important;
    color: #006647 !important;
}

.bl-sidebar-right .bl-profile-btn:hover,
.bl-sidebar-right .bl-profile-btn:focus-visible {
    border-color: rgba(0, 122, 85, .65) !important;
    color: #003d2b !important;
}

@media (max-width: 640px) {
    .bl-top-login-area .bl-login-userdata {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr auto auto !important;
    }
    .bl-top-login-area .bl-login-greeting {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

/* v1.0.20 - User profile / BEERLEAGUE player profile cleanup. */
.bl-top-login-area .bl-edit-profile-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 92px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: .4rem .72rem !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255, 173, 24, .35) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)) !important;
    color: var(--bl-logo-orange-bright) !important;
    font-size: .72rem !important;
    font-weight: 950 !important;
    letter-spacing: .045em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-shadow: 1px 1px 0 rgba(0,0,0,.65) !important;
    white-space: nowrap !important;
    box-shadow: inset 0 1px rgba(255,255,255,.08), 0 6px 16px rgba(0,0,0,.18) !important;
}
.bl-top-login-area .bl-edit-profile-btn:hover,
.bl-top-login-area .bl-edit-profile-btn:focus-visible {
    border-color: rgba(255, 173, 24, .68) !important;
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(216,137,0,.30), rgba(0,96,67,.22)) !important;
    transform: translateY(-1px);
}
.bl-sidebar-right .bl-edit-profile-btn {
    width: 100% !important;
    border: 1px solid rgba(216,137,0,.35) !important;
    background: linear-gradient(180deg, #fff8e7, #f1ead8) !important;
    color: #745000 !important;
    text-shadow: none !important;
}

/* Joomla user edit/profile forms are much cleaner as compact cards instead of raw fieldsets. */
.com-users-profile__edit,
.profile-edit,
#member-profile,
#users-profile-core,
#users-profile-custom {
    max-width: 1040px;
    margin-inline: auto;
}
.com-users-profile__edit > h1,
.com-users-profile__edit .page-header h1,
.profile-edit > h1,
.profile-edit .page-header h1 {
    margin: 0 0 .85rem;
    font-size: clamp(1.2rem, 1.7vw, 1.65rem);
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: .045em;
}
#member-profile {
    display: grid;
    gap: .8rem;
}
#member-profile fieldset,
.com-users-profile__edit fieldset,
.profile-edit fieldset {
    margin: 0 0 .8rem !important;
    padding: .85rem !important;
    border: 1px solid rgba(0, 208, 132, .22) !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.24), rgba(0,0,0,.14)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
}
#member-profile legend,
.com-users-profile__edit legend,
.profile-edit legend {
    width: auto !important;
    margin: 0 0 .65rem !important;
    padding: .22rem .55rem !important;
    border: 1px solid rgba(0, 208, 132, .28) !important;
    border-radius: 999px !important;
    background: rgba(0, 208, 132, .09) !important;
    color: var(--bl-green-bright) !important;
    font-size: .74rem !important;
    font-weight: 950 !important;
    line-height: 1.2 !important;
    letter-spacing: .065em !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
}
#member-profile .control-group,
.com-users-profile__edit .control-group,
.profile-edit .control-group {
    display: grid;
    grid-template-columns: minmax(140px, 190px) minmax(0, 1fr);
    gap: .45rem .75rem;
    align-items: center;
    margin: 0 !important;
    padding: .48rem .35rem !important;
    border-bottom: 1px solid rgba(255,255,255,.055);
}
#member-profile .control-group:last-child,
.com-users-profile__edit .control-group:last-child,
.profile-edit .control-group:last-child {
    border-bottom: 0;
}
#member-profile .control-label,
.com-users-profile__edit .control-label,
.profile-edit .control-label {
    margin: 0 !important;
    padding: 0 !important;
}
#member-profile .control-label label,
.com-users-profile__edit .control-label label,
.profile-edit .control-label label,
#member-profile label,
.com-users-profile__edit label,
.profile-edit label {
    margin: 0 !important;
    color: rgba(243,247,245,.88) !important;
    font-size: .82rem !important;
    font-weight: 760 !important;
    line-height: 1.25 !important;
    text-shadow: none !important;
}
#member-profile .controls,
.com-users-profile__edit .controls,
.profile-edit .controls {
    min-width: 0;
    width: 100%;
}
#member-profile input[type="text"],
#member-profile input[type="password"],
#member-profile input[type="email"],
#member-profile input[type="url"],
#member-profile input[type="tel"],
#member-profile select,
#member-profile textarea,
.com-users-profile__edit input[type="text"],
.com-users-profile__edit input[type="password"],
.com-users-profile__edit input[type="email"],
.com-users-profile__edit input[type="url"],
.com-users-profile__edit input[type="tel"],
.com-users-profile__edit select,
.com-users-profile__edit textarea,
.profile-edit input[type="text"],
.profile-edit input[type="password"],
.profile-edit input[type="email"],
.profile-edit input[type="url"],
.profile-edit input[type="tel"],
.profile-edit select,
.profile-edit textarea {
    min-height: 36px !important;
    height: auto !important;
    padding: .48rem .72rem !important;
    border-radius: 10px !important;
    border-color: rgba(0, 208, 132, .22) !important;
    background: rgba(247, 250, 248, .96) !important;
    color: #101714 !important;
    font-size: .88rem !important;
    box-shadow: inset 0 1px rgba(255,255,255,.7) !important;
}
#member-profile textarea,
.com-users-profile__edit textarea,
.profile-edit textarea {
    min-height: 90px !important;
    border-radius: 12px !important;
}
#member-profile .form-text,
#member-profile .text-muted,
#member-profile .small,
.com-users-profile__edit .form-text,
.com-users-profile__edit .text-muted,
.com-users-profile__edit .small,
.profile-edit .form-text,
.profile-edit .text-muted,
.profile-edit .small {
    display: block;
    margin-top: .18rem;
    color: rgba(243,247,245,.66) !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
}
#member-profile .input-group,
.com-users-profile__edit .input-group,
.profile-edit .input-group {
    display: flex;
    align-items: center;
    gap: .45rem;
}
#member-profile .input-group > input,
.com-users-profile__edit .input-group > input,
.profile-edit .input-group > input {
    min-width: 0;
}
#member-profile .input-password-toggle,
#member-profile .btn-secondary,
.com-users-profile__edit .input-password-toggle,
.com-users-profile__edit .btn-secondary,
.profile-edit .input-password-toggle,
.profile-edit .btn-secondary {
    width: auto !important;
    min-width: auto !important;
    min-height: 34px !important;
    padding: .42rem .7rem !important;
    border-radius: 10px !important;
    font-size: .72rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}
#member-profile input[type="checkbox"],
#member-profile input[type="radio"],
.com-users-profile__edit input[type="checkbox"],
.com-users-profile__edit input[type="radio"],
.profile-edit input[type="checkbox"],
.profile-edit input[type="radio"] {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    border-radius: 4px !important;
}
#member-profile .btn-toolbar,
.com-users-profile__edit .btn-toolbar,
.profile-edit .btn-toolbar,
#member-profile .form-actions,
.com-users-profile__edit .form-actions,
.profile-edit .form-actions {
    display: flex;
    gap: .55rem;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-top: .4rem;
    padding-top: .7rem;
    border-top: 1px solid rgba(255,255,255,.08);
}

/* Stop Joomla/Choices.js remove buttons from inheriting the large BEERLEAGUE button style. */
.choices__button,
#member-profile .choices__button,
.com-users-profile__edit .choices__button,
.profile-edit .choices__button {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    margin: 0 .15rem !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(0,0,0,.28) !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
}
.choices__button::before {
    content: "×";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
}
.choices__inner,
#member-profile .choices__inner,
.com-users-profile__edit .choices__inner,
.profile-edit .choices__inner {
    min-height: 36px !important;
    border-radius: 10px !important;
    border-color: rgba(0, 208, 132, .22) !important;
    background: rgba(247, 250, 248, .96) !important;
    color: #101714 !important;
}
.choices__list--single,
.choices__item {
    color: #101714;
}

.bl-profile-stats-link-card,
#member-profile .bl-profile-stats-link-card,
.com-users-profile__edit .bl-profile-stats-link-card,
.profile-edit .bl-profile-stats-link-card {
    display: grid;
    gap: .55rem;
    padding: .75rem;
    border: 1px solid rgba(255, 173, 24, .26);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 173, 24, .08), rgba(0, 208, 132, .06));
    color: rgba(243,247,245,.88);
}
.bl-profile-stats-link-card strong {
    color: var(--bl-logo-orange-bright);
    font-size: .86rem;
    text-transform: uppercase;
    letter-spacing: .055em;
}
.bl-profile-stats-link-card p {
    margin: 0;
    color: rgba(243,247,245,.74);
    font-size: .8rem;
}
.bl-profile-stats-link-card .bl-profile-stats-actions {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}
.bl-profile-stats-link-card .bl-profile-stats-actions a {
    width: auto !important;
    min-height: 32px !important;
    padding: .38rem .7rem !important;
    border-radius: 999px !important;
    font-size: .72rem !important;
}
.bl-player-profile-actions {
    display: grid;
    gap: .45rem;
    min-width: 160px;
}
.bl-player-profile-actions .bl-btn {
    width: 100%;
    min-height: 36px;
    padding: .48rem .75rem;
    font-size: .74rem;
}
.bl-player-profile-actions small {
    color: rgba(243,247,245,.68);
    font-size: .72rem;
    text-align: center;
}

@media (max-width: 760px) {
    #member-profile .control-group,
    .com-users-profile__edit .control-group,
    .profile-edit .control-group {
        grid-template-columns: 1fr;
        padding: .55rem 0 !important;
    }
    #member-profile fieldset,
    .com-users-profile__edit fieldset,
    .profile-edit fieldset {
        padding: .75rem !important;
    }
    .bl-player-profile-actions {
        width: 100%;
    }
}

/* v1.0.21 - tighter Joomla profile form + cleaner multi-factor cards. */
.com-users-profile__edit,
.profile-edit,
#member-profile,
#users-profile-core,
#users-profile-custom {
    max-width: 980px;
}

#member-profile {
    gap: .62rem;
}

#member-profile fieldset,
.com-users-profile__edit fieldset,
.profile-edit fieldset {
    margin-bottom: .62rem !important;
    padding: .68rem .78rem !important;
    border-radius: 14px !important;
}

#member-profile legend,
.com-users-profile__edit legend,
.profile-edit legend {
    margin-bottom: .48rem !important;
    padding: .18rem .5rem !important;
    font-size: .68rem !important;
    letter-spacing: .07em !important;
}

#member-profile .control-group,
.com-users-profile__edit .control-group,
.profile-edit .control-group {
    grid-template-columns: minmax(118px, 158px) minmax(0, 1fr) !important;
    gap: .34rem .68rem !important;
    min-height: 0 !important;
    padding: .34rem .24rem !important;
}

#member-profile .control-label label,
.com-users-profile__edit .control-label label,
.profile-edit .control-label label,
#member-profile label,
.com-users-profile__edit label,
.profile-edit label {
    font-size: .76rem !important;
    line-height: 1.2 !important;
}

#member-profile .controls,
.com-users-profile__edit .controls,
.profile-edit .controls {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
}

#member-profile input[type="text"],
#member-profile input[type="password"],
#member-profile input[type="email"],
#member-profile input[type="url"],
#member-profile input[type="tel"],
#member-profile input[type="number"],
#member-profile select,
#member-profile textarea,
.com-users-profile__edit input[type="text"],
.com-users-profile__edit input[type="password"],
.com-users-profile__edit input[type="email"],
.com-users-profile__edit input[type="url"],
.com-users-profile__edit input[type="tel"],
.com-users-profile__edit input[type="number"],
.com-users-profile__edit select,
.com-users-profile__edit textarea,
.profile-edit input[type="text"],
.profile-edit input[type="password"],
.profile-edit input[type="email"],
.profile-edit input[type="url"],
.profile-edit input[type="tel"],
.profile-edit input[type="number"],
.profile-edit select,
.profile-edit textarea {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    min-height: 32px !important;
    padding: .34rem .58rem !important;
    border-radius: 8px !important;
    font-size: .82rem !important;
    line-height: 1.2 !important;
}

#member-profile textarea,
.com-users-profile__edit textarea,
.profile-edit textarea {
    min-height: 74px !important;
}

#member-profile .form-text,
#member-profile .text-muted,
#member-profile .small,
.com-users-profile__edit .form-text,
.com-users-profile__edit .text-muted,
.com-users-profile__edit .small,
.profile-edit .form-text,
.profile-edit .text-muted,
.profile-edit .small {
    margin-top: .14rem !important;
    font-size: .66rem !important;
    line-height: 1.22 !important;
}

#member-profile .input-group,
.com-users-profile__edit .input-group,
.profile-edit .input-group {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    gap: .34rem !important;
}

#member-profile .input-group > input,
.com-users-profile__edit .input-group > input,
.profile-edit .input-group > input {
    flex: 1 1 auto !important;
    max-width: none !important;
}

#member-profile .input-password-toggle,
#member-profile .btn-secondary,
.com-users-profile__edit .input-password-toggle,
.com-users-profile__edit .btn-secondary,
.profile-edit .input-password-toggle,
.profile-edit .btn-secondary {
    min-height: 32px !important;
    padding: .34rem .62rem !important;
    border-radius: 8px !important;
    font-size: .66rem !important;
}

#member-profile .choices,
.com-users-profile__edit .choices,
.profile-edit .choices {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    margin-bottom: 0 !important;
}

#member-profile .choices__inner,
.com-users-profile__edit .choices__inner,
.profile-edit .choices__inner {
    min-height: 32px !important;
    padding: .16rem .42rem !important;
    border-radius: 8px !important;
    font-size: .8rem !important;
}

#member-profile .choices__input,
.com-users-profile__edit .choices__input,
.profile-edit .choices__input {
    min-height: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: .12rem .25rem !important;
    font-size: .76rem !important;
}

#member-profile .choices__list--multiple .choices__item,
.com-users-profile__edit .choices__list--multiple .choices__item,
.profile-edit .choices__list--multiple .choices__item {
    margin: .12rem .18rem .12rem 0 !important;
    padding: .24rem .44rem !important;
    border-radius: 999px !important;
    font-size: .68rem !important;
    line-height: 1 !important;
}

/* API token rows should wrap instead of forcing huge one-line fields. */
#member-profile input[readonly],
.com-users-profile__edit input[readonly],
.profile-edit input[readonly] {
    font-size: .74rem !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
}

#member-profile .control-group:has(input[readonly]) .controls,
.com-users-profile__edit .control-group:has(input[readonly]) .controls,
.profile-edit .control-group:has(input[readonly]) .controls {
    display: flex !important;
    align-items: center !important;
    gap: .36rem !important;
    flex-wrap: wrap !important;
    max-width: 760px !important;
    width: min(100%, 760px) !important;
}

#member-profile .control-group:has(input[readonly]) input[readonly],
.com-users-profile__edit .control-group:has(input[readonly]) input[readonly],
.profile-edit .control-group:has(input[readonly]) input[readonly] {
    flex: 1 1 430px !important;
    max-width: 600px !important;
}

/* Make Joomla's multi-factor setup look like compact BEERLEAGUE cards instead of oversized blocks. */
.com-users-methods-list,
.com-users-profile__edit .com-users-methods-list,
.profile-edit .com-users-methods-list,
#member-profile .com-users-methods-list {
    display: grid !important;
    gap: .5rem !important;
    margin: .42rem 0 0 !important;
}

.com-users-methods-list-method,
.com-users-profile__edit .com-users-methods-list-method,
.profile-edit .com-users-methods-list-method,
#member-profile .com-users-methods-list-method,
.com-users-profile__edit .mfa-method,
.profile-edit .mfa-method,
#member-profile .mfa-method {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .68rem !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: .58rem .68rem !important;
    border: 1px solid rgba(0, 208, 132, .20) !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, rgba(0, 208, 132, .055), rgba(0,0,0,.10)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035) !important;
}

.com-users-methods-list-method img,
.com-users-methods-list-method svg,
.com-users-profile__edit .mfa-method img,
.profile-edit .mfa-method img,
#member-profile .mfa-method img {
    display: block !important;
    width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    max-height: 42px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    opacity: .9 !important;
}

.com-users-methods-list-method h2,
.com-users-methods-list-method h3,
.com-users-methods-list-method h4,
.com-users-methods-list-method .com-users-methods-list-method-title,
.com-users-profile__edit .mfa-method h2,
.com-users-profile__edit .mfa-method h3,
.profile-edit .mfa-method h2,
.profile-edit .mfa-method h3,
#member-profile .mfa-method h2,
#member-profile .mfa-method h3 {
    margin: 0 0 .12rem !important;
    color: #fff !important;
    font-size: .98rem !important;
    line-height: 1.12 !important;
    letter-spacing: .015em !important;
    text-shadow: none !important;
}

.com-users-methods-list-method p,
.com-users-methods-list-method .com-users-methods-list-method-description,
.com-users-profile__edit .mfa-method p,
.profile-edit .mfa-method p,
#member-profile .mfa-method p {
    margin: 0 !important;
    color: rgba(243,247,245,.70) !important;
    font-size: .72rem !important;
    line-height: 1.28 !important;
}

.com-users-methods-list-method .btn,
.com-users-profile__edit .mfa-method .btn,
.profile-edit .mfa-method .btn,
#member-profile .mfa-method .btn {
    width: auto !important;
    min-width: 0 !important;
    min-height: 30px !important;
    padding: .34rem .58rem !important;
    border-radius: 8px !important;
    font-size: .66rem !important;
    white-space: nowrap !important;
}

.com-users-profile__edit .alert,
.profile-edit .alert,
#member-profile .alert {
    margin: .3rem 0 .5rem !important;
    padding: .52rem .68rem !important;
    border-radius: 10px !important;
    border: 1px solid rgba(255, 173, 24, .25) !important;
    background: rgba(255, 173, 24, .08) !important;
    color: rgba(243,247,245,.88) !important;
    font-size: .8rem !important;
}

@media (max-width: 760px) {
    #member-profile .control-group,
    .com-users-profile__edit .control-group,
    .profile-edit .control-group {
        grid-template-columns: 1fr !important;
        gap: .24rem !important;
        padding: .42rem 0 !important;
    }
    #member-profile .controls,
    .com-users-profile__edit .controls,
    .profile-edit .controls,
    #member-profile input[type="text"],
    #member-profile input[type="password"],
    #member-profile input[type="email"],
    #member-profile select,
    .com-users-profile__edit input[type="text"],
    .com-users-profile__edit input[type="password"],
    .com-users-profile__edit input[type="email"],
    .com-users-profile__edit select,
    .profile-edit input[type="text"],
    .profile-edit input[type="password"],
    .profile-edit input[type="email"],
    .profile-edit select,
    #member-profile .choices,
    .com-users-profile__edit .choices,
    .profile-edit .choices {
        width: 100% !important;
        max-width: 100% !important;
    }
    .com-users-methods-list-method,
    .com-users-profile__edit .com-users-methods-list-method,
    .profile-edit .com-users-methods-list-method,
    #member-profile .com-users-methods-list-method,
    .com-users-profile__edit .mfa-method,
    .profile-edit .mfa-method,
    #member-profile .mfa-method {
        grid-template-columns: 42px minmax(0, 1fr) !important;
    }
    .com-users-methods-list-method .btn,
    .com-users-profile__edit .mfa-method .btn,
    .profile-edit .mfa-method .btn,
    #member-profile .mfa-method .btn {
        grid-column: 2;
        justify-self: start;
        margin-top: .18rem !important;
    }
}

/* v1.0.22 - compact / sleek profile edit form pass.
   This intentionally overrides earlier profile form sizing with smaller fields and narrower controls. */
.com-users-profile__edit,
.profile-edit,
#member-profile {
    max-width: 820px !important;
}

#member-profile {
    gap: .5rem !important;
}

#member-profile fieldset,
.com-users-profile__edit fieldset,
.profile-edit fieldset {
    max-width: 820px !important;
    margin-bottom: .5rem !important;
    padding: .58rem .68rem !important;
    border-radius: 12px !important;
}

#member-profile legend,
.com-users-profile__edit legend,
.profile-edit legend {
    margin-bottom: .36rem !important;
    padding: .15rem .46rem !important;
    font-size: .64rem !important;
    line-height: 1.1 !important;
}

#member-profile .control-group,
.com-users-profile__edit .control-group,
.profile-edit .control-group {
    grid-template-columns: 145px minmax(0, 460px) !important;
    gap: .28rem .58rem !important;
    align-items: center !important;
    min-height: 0 !important;
    padding: .28rem .12rem !important;
}

#member-profile .control-label,
.com-users-profile__edit .control-label,
.profile-edit .control-label {
    align-self: center !important;
}

#member-profile .control-label label,
.com-users-profile__edit .control-label label,
.profile-edit .control-label label,
#member-profile label,
.com-users-profile__edit label,
.profile-edit label {
    font-size: .72rem !important;
    line-height: 1.15 !important;
    letter-spacing: .01em !important;
}

#member-profile .controls,
.com-users-profile__edit .controls,
.profile-edit .controls {
    width: min(100%, 460px) !important;
    max-width: 460px !important;
}

#member-profile input[type="text"],
#member-profile input[type="password"],
#member-profile input[type="email"],
#member-profile input[type="url"],
#member-profile input[type="tel"],
#member-profile input[type="number"],
#member-profile input.form-control,
#member-profile select,
#member-profile select.form-select,
#member-profile select.custom-select,
#member-profile .inputbox,
.com-users-profile__edit input[type="text"],
.com-users-profile__edit input[type="password"],
.com-users-profile__edit input[type="email"],
.com-users-profile__edit input[type="url"],
.com-users-profile__edit input[type="tel"],
.com-users-profile__edit input[type="number"],
.com-users-profile__edit input.form-control,
.com-users-profile__edit select,
.com-users-profile__edit select.form-select,
.com-users-profile__edit select.custom-select,
.com-users-profile__edit .inputbox,
.profile-edit input[type="text"],
.profile-edit input[type="password"],
.profile-edit input[type="email"],
.profile-edit input[type="url"],
.profile-edit input[type="tel"],
.profile-edit input[type="number"],
.profile-edit input.form-control,
.profile-edit select,
.profile-edit select.form-select,
.profile-edit select.custom-select,
.profile-edit .inputbox {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 460px !important;
    min-height: 28px !important;
    height: 28px !important;
    padding: .22rem .48rem !important;
    border-radius: 7px !important;
    font-size: .76rem !important;
    line-height: 1.12 !important;
}

#member-profile textarea,
.com-users-profile__edit textarea,
.profile-edit textarea {
    width: 100% !important;
    max-width: 460px !important;
    min-height: 62px !important;
    height: auto !important;
    padding: .34rem .48rem !important;
    border-radius: 8px !important;
    font-size: .76rem !important;
}

#member-profile .form-text,
#member-profile .text-muted,
#member-profile .small,
.com-users-profile__edit .form-text,
.com-users-profile__edit .text-muted,
.com-users-profile__edit .small,
.profile-edit .form-text,
.profile-edit .text-muted,
.profile-edit .small {
    margin-top: .1rem !important;
    font-size: .62rem !important;
    line-height: 1.18 !important;
}

#member-profile .input-group,
.com-users-profile__edit .input-group,
.profile-edit .input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: min(100%, 520px) !important;
    max-width: 520px !important;
    gap: .32rem !important;
}

#member-profile .input-group > input,
.com-users-profile__edit .input-group > input,
.profile-edit .input-group > input {
    width: 100% !important;
    max-width: none !important;
}

#member-profile .input-password-toggle,
#member-profile .btn-secondary,
.com-users-profile__edit .input-password-toggle,
.com-users-profile__edit .btn-secondary,
.profile-edit .input-password-toggle,
.profile-edit .btn-secondary {
    min-height: 28px !important;
    height: 28px !important;
    padding: .22rem .5rem !important;
    border-radius: 7px !important;
    font-size: .62rem !important;
    letter-spacing: .04em !important;
    line-height: 1 !important;
}

/* Compact the Joomla Choices.js selects, especially Basic Settings and Events to Email. */
#member-profile .choices,
.com-users-profile__edit .choices,
.profile-edit .choices {
    width: min(100%, 460px) !important;
    max-width: 460px !important;
    min-height: 28px !important;
    margin: 0 !important;
}

#member-profile .choices__inner,
.com-users-profile__edit .choices__inner,
.profile-edit .choices__inner {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 28px !important;
    height: auto !important;
    padding: .12rem .36rem !important;
    border-radius: 7px !important;
    font-size: .74rem !important;
    line-height: 1.1 !important;
}

#member-profile .choices__list,
.com-users-profile__edit .choices__list,
.profile-edit .choices__list {
    line-height: 1.1 !important;
}

#member-profile .choices__list--single,
.com-users-profile__edit .choices__list--single,
.profile-edit .choices__list--single {
    padding: 0 1.15rem 0 0 !important;
}

#member-profile .choices__item,
.com-users-profile__edit .choices__item,
.profile-edit .choices__item {
    font-size: .74rem !important;
    line-height: 1.1 !important;
}

#member-profile .choices__input,
.com-users-profile__edit .choices__input,
.profile-edit .choices__input {
    width: auto !important;
    min-height: 22px !important;
    height: 22px !important;
    padding: .08rem .22rem !important;
    font-size: .72rem !important;
}

#member-profile .choices__list--multiple .choices__item,
.com-users-profile__edit .choices__list--multiple .choices__item,
.profile-edit .choices__list--multiple .choices__item {
    min-height: 22px !important;
    margin: .08rem .12rem .08rem 0 !important;
    padding: .16rem .36rem !important;
    border-radius: 999px !important;
    font-size: .62rem !important;
    line-height: 1 !important;
}

#member-profile .choices__button,
.com-users-profile__edit .choices__button,
.profile-edit .choices__button {
    width: 14px !important;
    min-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    margin-left: .18rem !important;
}

#member-profile .choices__button::before,
.com-users-profile__edit .choices__button::before,
.profile-edit .choices__button::before {
    width: 14px !important;
    height: 14px !important;
    font-size: 10px !important;
}

/* Read-only/token rows get a little more room, but still remain compact. */
#member-profile .control-group:has(input[readonly]) .controls,
.com-users-profile__edit .control-group:has(input[readonly]) .controls,
.profile-edit .control-group:has(input[readonly]) .controls {
    width: min(100%, 600px) !important;
    max-width: 600px !important;
}

#member-profile .control-group:has(input[readonly]) input[readonly],
.com-users-profile__edit .control-group:has(input[readonly]) input[readonly],
.profile-edit .control-group:has(input[readonly]) input[readonly] {
    max-width: 500px !important;
    min-height: 28px !important;
    height: 28px !important;
    font-size: .68rem !important;
}

/* Compact MFA / passkey setup into tighter cards. */
#member-profile .com-users-methods-list,
.com-users-profile__edit .com-users-methods-list,
.profile-edit .com-users-methods-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    gap: .46rem !important;
    max-width: 720px !important;
    margin-top: .34rem !important;
}

#member-profile .com-users-methods-list > *,
.com-users-profile__edit .com-users-methods-list > *,
.profile-edit .com-users-methods-list > *,
#member-profile .com-users-methods-list-method,
.com-users-profile__edit .com-users-methods-list-method,
.profile-edit .com-users-methods-list-method,
#member-profile .mfa-method,
.com-users-profile__edit .mfa-method,
.profile-edit .mfa-method {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .38rem .52rem !important;
    min-height: 0 !important;
    padding: .46rem .5rem !important;
    border-radius: 10px !important;
}

#member-profile .com-users-methods-list img,
#member-profile .com-users-methods-list svg,
.com-users-profile__edit .com-users-methods-list img,
.com-users-profile__edit .com-users-methods-list svg,
.profile-edit .com-users-methods-list img,
.profile-edit .com-users-methods-list svg {
    width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    max-height: 30px !important;
}

#member-profile .com-users-methods-list h2,
#member-profile .com-users-methods-list h3,
#member-profile .com-users-methods-list h4,
.com-users-profile__edit .com-users-methods-list h2,
.com-users-profile__edit .com-users-methods-list h3,
.com-users-profile__edit .com-users-methods-list h4,
.profile-edit .com-users-methods-list h2,
.profile-edit .com-users-methods-list h3,
.profile-edit .com-users-methods-list h4 {
    margin: 0 0 .08rem !important;
    font-size: .86rem !important;
    line-height: 1.08 !important;
}

#member-profile .com-users-methods-list p,
.com-users-profile__edit .com-users-methods-list p,
.profile-edit .com-users-methods-list p {
    margin: 0 !important;
    font-size: .65rem !important;
    line-height: 1.18 !important;
}

#member-profile .com-users-methods-list .btn,
.com-users-profile__edit .com-users-methods-list .btn,
.profile-edit .com-users-methods-list .btn,
#member-profile .mfa-method .btn,
.com-users-profile__edit .mfa-method .btn,
.profile-edit .mfa-method .btn {
    grid-column: 2 !important;
    justify-self: start !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: .2rem .44rem !important;
    border-radius: 7px !important;
    font-size: .6rem !important;
}

#member-profile .btn-toolbar,
.com-users-profile__edit .btn-toolbar,
.profile-edit .btn-toolbar,
#member-profile .form-actions,
.com-users-profile__edit .form-actions,
.profile-edit .form-actions {
    max-width: 820px !important;
    padding-top: .5rem !important;
}

@media (max-width: 760px) {
    #member-profile,
    .com-users-profile__edit,
    .profile-edit {
        max-width: 100% !important;
    }

    #member-profile .control-group,
    .com-users-profile__edit .control-group,
    .profile-edit .control-group {
        grid-template-columns: 1fr !important;
        padding: .36rem 0 !important;
    }

    #member-profile .controls,
    .com-users-profile__edit .controls,
    .profile-edit .controls,
    #member-profile input[type="text"],
    #member-profile input[type="password"],
    #member-profile input[type="email"],
    #member-profile input.form-control,
    #member-profile select,
    #member-profile .choices,
    .com-users-profile__edit input[type="text"],
    .com-users-profile__edit input[type="password"],
    .com-users-profile__edit input[type="email"],
    .com-users-profile__edit input.form-control,
    .com-users-profile__edit select,
    .com-users-profile__edit .choices,
    .profile-edit input[type="text"],
    .profile-edit input[type="password"],
    .profile-edit input[type="email"],
    .profile-edit input.form-control,
    .profile-edit select,
    .profile-edit .choices {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* v1.0.23 - profile edit dashboard layout: two-column cards, smaller sleek controls, Steam identity strip. */
.bl-user-profile-edit,
.com-users-profile__edit.bl-user-profile-edit,
.profile-edit.bl-user-profile-edit {
    max-width: 1160px !important;
    width: 100% !important;
    margin-inline: auto !important;
}

#member-profile.bl-user-profile-form {
    display: block !important;
    max-width: 1160px !important;
    width: 100% !important;
    margin: 0 auto !important;
}

#member-profile.bl-user-profile-form .bl-profile-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(330px, 1fr)) !important;
    align-items: start !important;
    gap: .72rem !important;
    width: 100% !important;
}

#member-profile.bl-user-profile-form .bl-profile-card {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: .62rem .72rem .68rem !important;
    border: 1px solid rgba(0, 208, 132, .24) !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, rgba(0, 38, 25, .78), rgba(0, 18, 13, .70)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035), 0 10px 22px rgba(0,0,0,.14) !important;
}

#member-profile.bl-user-profile-form .bl-profile-card legend {
    width: auto !important;
    margin: -.18rem 0 .52rem !important;
    padding: .18rem .52rem !important;
    border: 1px solid rgba(0, 208, 132, .36) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(0, 150, 99, .32), rgba(0, 95, 66, .28)) !important;
    color: var(--bl-green-bright) !important;
    font-size: .62rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: .065em !important;
    text-transform: uppercase !important;
}

#member-profile.bl-user-profile-form .bl-profile-fieldset-desc {
    margin: -.14rem 0 .44rem !important;
    color: rgba(243,247,245,.72) !important;
    font-size: .72rem !important;
    line-height: 1.32 !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-strip {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .55rem !important;
    margin: -.12rem 0 .5rem !important;
    padding: .5rem !important;
    border: 1px solid rgba(255, 173, 24, .22) !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(255, 173, 24, .095), rgba(0, 208, 132, .075)) !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-avatar {
    display: grid !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 173, 24, .48) !important;
    border-radius: 10px !important;
    background: rgba(0,0,0,.28) !important;
    color: var(--bl-logo-orange-bright) !important;
    font-size: 1.15rem !important;
    font-weight: 950 !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.22) !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-copy {
    display: grid !important;
    min-width: 0 !important;
    gap: .08rem !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-copy strong {
    overflow: hidden !important;
    color: #fff !important;
    font-size: .82rem !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-copy span {
    overflow: hidden !important;
    color: rgba(243,247,245,.66) !important;
    font-size: .64rem !important;
    line-height: 1.15 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#member-profile.bl-user-profile-form .bl-profile-steam-actions {
    display: flex !important;
    align-items: center !important;
    gap: .32rem !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
}

#member-profile.bl-user-profile-form .bl-profile-mini-btn,
#member-profile.bl-user-profile-form .bl-profile-steam-actions .btn {
    width: auto !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: .2rem .43rem !important;
    border-radius: 999px !important;
    font-size: .58rem !important;
    line-height: 1 !important;
    letter-spacing: .045em !important;
}

#member-profile.bl-user-profile-form .bl-field-row,
#member-profile.bl-user-profile-form .control-group {
    display: grid !important;
    grid-template-columns: 116px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .22rem .5rem !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: .25rem 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.045) !important;
}

#member-profile.bl-user-profile-form .bl-field-row:last-child,
#member-profile.bl-user-profile-form .control-group:last-child {
    border-bottom: 0 !important;
}

#member-profile.bl-user-profile-form .bl-field-full {
    grid-template-columns: 1fr !important;
}

#member-profile.bl-user-profile-form .control-label,
#member-profile.bl-user-profile-form .control-label label,
#member-profile.bl-user-profile-form label {
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(243,247,245,.86) !important;
    font-size: .66rem !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: .005em !important;
    text-shadow: none !important;
}

#member-profile.bl-user-profile-form .controls {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

#member-profile.bl-user-profile-form input[type="text"],
#member-profile.bl-user-profile-form input[type="password"],
#member-profile.bl-user-profile-form input[type="email"],
#member-profile.bl-user-profile-form input[type="url"],
#member-profile.bl-user-profile-form input[type="tel"],
#member-profile.bl-user-profile-form input[type="number"],
#member-profile.bl-user-profile-form input.form-control,
#member-profile.bl-user-profile-form select,
#member-profile.bl-user-profile-form select.form-select,
#member-profile.bl-user-profile-form select.custom-select,
#member-profile.bl-user-profile-form .inputbox,
#member-profile.bl-user-profile-form textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: .16rem .42rem !important;
    border: 1px solid rgba(0, 208, 132, .20) !important;
    border-radius: 6px !important;
    background: rgba(248, 251, 249, .96) !important;
    color: #101714 !important;
    font-size: .7rem !important;
    line-height: 1.08 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.7) !important;
}

#member-profile.bl-user-profile-form textarea {
    min-height: 56px !important;
    height: auto !important;
    padding: .32rem .42rem !important;
}

#member-profile.bl-user-profile-form .input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    gap: .28rem !important;
}

#member-profile.bl-user-profile-form .input-group > input {
    width: 100% !important;
    max-width: none !important;
}

#member-profile.bl-user-profile-form .input-password-toggle,
#member-profile.bl-user-profile-form .btn-secondary,
#member-profile.bl-user-profile-form button.btn,
#member-profile.bl-user-profile-form .btn:not(.bl-profile-mini-btn) {
    width: auto !important;
    min-width: 0 !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: .18rem .44rem !important;
    border-radius: 6px !important;
    font-size: .58rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#member-profile.bl-user-profile-form .form-text,
#member-profile.bl-user-profile-form .text-muted,
#member-profile.bl-user-profile-form .small,
#member-profile.bl-user-profile-form .form-control-feedback,
#member-profile.bl-user-profile-form .form-text span {
    display: block !important;
    margin-top: .08rem !important;
    color: rgba(243,247,245,.60) !important;
    font-size: .56rem !important;
    line-height: 1.15 !important;
}

#member-profile.bl-user-profile-form .choices {
    width: 100% !important;
    max-width: none !important;
    min-height: 24px !important;
    margin: 0 !important;
}

#member-profile.bl-user-profile-form .choices__inner {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 24px !important;
    height: auto !important;
    padding: .09rem .32rem !important;
    border: 1px solid rgba(0, 208, 132, .20) !important;
    border-radius: 6px !important;
    background: rgba(248, 251, 249, .96) !important;
    color: #101714 !important;
    font-size: .68rem !important;
    line-height: 1.05 !important;
}

#member-profile.bl-user-profile-form .choices__list--single {
    padding: 0 1rem 0 0 !important;
}

#member-profile.bl-user-profile-form .choices__item,
#member-profile.bl-user-profile-form .choices__input {
    font-size: .68rem !important;
    line-height: 1.05 !important;
}

#member-profile.bl-user-profile-form .choices__input {
    min-height: 19px !important;
    height: 19px !important;
    padding: .05rem .18rem !important;
}

#member-profile.bl-user-profile-form .choices__list--multiple .choices__item {
    min-height: 19px !important;
    margin: .05rem .1rem .05rem 0 !important;
    padding: .12rem .28rem !important;
    border-radius: 999px !important;
    font-size: .56rem !important;
    line-height: 1 !important;
}

#member-profile.bl-user-profile-form .choices__button,
#member-profile.bl-user-profile-form .choices__button::before {
    width: 13px !important;
    min-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    font-size: 9px !important;
}

#member-profile.bl-user-profile-form input[type="checkbox"],
#member-profile.bl-user-profile-form input[type="radio"] {
    width: 16px !important;
    min-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    padding: 0 !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-beerleague-stats .bl-profile-stats-link-card {
    padding: .52rem !important;
    border-radius: 11px !important;
    gap: .32rem !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-beerleague-stats .bl-profile-stats-link-card strong {
    font-size: .68rem !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-beerleague-stats .bl-profile-stats-link-card p {
    font-size: .64rem !important;
    line-height: 1.25 !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-beerleague-stats .bl-profile-stats-actions a {
    min-height: 23px !important;
    height: 23px !important;
    padding: .18rem .42rem !important;
    font-size: .56rem !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-joomla-api-token .bl-field-row,
#member-profile.bl-user-profile-form .bl-profile-card-multi-factor-authentication .bl-field-row,
#member-profile.bl-user-profile-form .bl-profile-card-multifactorauth .bl-field-row,
#member-profile.bl-user-profile-form .bl-profile-card-com-users-methods .bl-field-row {
    grid-template-columns: 1fr !important;
    align-items: start !important;
}

#member-profile.bl-user-profile-form .bl-profile-card-joomla-api-token .control-label,
#member-profile.bl-user-profile-form .bl-profile-card-multi-factor-authentication .control-label,
#member-profile.bl-user-profile-form .bl-profile-card-multifactorauth .control-label,
#member-profile.bl-user-profile-form .bl-profile-card-com-users-methods .control-label {
    margin-bottom: .16rem !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list,
#member-profile.bl-user-profile-form .mfa-methods-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)) !important;
    gap: .4rem !important;
    width: 100% !important;
    max-width: none !important;
    margin-top: .28rem !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list > *,
#member-profile.bl-user-profile-form .com-users-methods-list-method,
#member-profile.bl-user-profile-form .mfa-method {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .28rem .42rem !important;
    min-height: 0 !important;
    padding: .38rem .42rem !important;
    border-radius: 10px !important;
    background: rgba(0, 208, 132, .055) !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list img,
#member-profile.bl-user-profile-form .com-users-methods-list svg,
#member-profile.bl-user-profile-form .mfa-method img,
#member-profile.bl-user-profile-form .mfa-method svg {
    width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    max-height: 28px !important;
    object-fit: contain !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list h2,
#member-profile.bl-user-profile-form .com-users-methods-list h3,
#member-profile.bl-user-profile-form .com-users-methods-list h4,
#member-profile.bl-user-profile-form .mfa-method h2,
#member-profile.bl-user-profile-form .mfa-method h3,
#member-profile.bl-user-profile-form .mfa-method h4 {
    margin: 0 0 .05rem !important;
    color: #fff !important;
    font-size: .78rem !important;
    line-height: 1.08 !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list p,
#member-profile.bl-user-profile-form .mfa-method p {
    margin: 0 !important;
    color: rgba(243,247,245,.66) !important;
    font-size: .58rem !important;
    line-height: 1.16 !important;
}

#member-profile.bl-user-profile-form .com-users-methods-list .btn,
#member-profile.bl-user-profile-form .mfa-method .btn {
    grid-column: 2 !important;
    justify-self: start !important;
    min-height: 22px !important;
    height: 22px !important;
    padding: .15rem .36rem !important;
    border-radius: 6px !important;
    font-size: .52rem !important;
}

#member-profile.bl-user-profile-form .bl-profile-actions-bar {
    display: flex !important;
    justify-content: flex-end !important;
    gap: .45rem !important;
    margin-top: .72rem !important;
    padding-top: .62rem !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
}

#member-profile.bl-user-profile-form .bl-profile-actions-bar .btn {
    min-height: 28px !important;
    height: 28px !important;
    padding: .22rem .62rem !important;
    border-radius: 7px !important;
    font-size: .64rem !important;
}

@media (max-width: 980px) {
    #member-profile.bl-user-profile-form .bl-profile-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 620px) {
    #member-profile.bl-user-profile-form .bl-profile-card {
        padding: .58rem !important;
    }
    #member-profile.bl-user-profile-form .bl-field-row,
    #member-profile.bl-user-profile-form .control-group {
        grid-template-columns: 1fr !important;
        gap: .12rem !important;
        padding: .3rem 0 !important;
    }
    #member-profile.bl-user-profile-form .bl-profile-steam-strip {
        grid-template-columns: 40px minmax(0, 1fr) !important;
    }
    #member-profile.bl-user-profile-form .bl-profile-steam-actions {
        grid-column: 1 / -1 !important;
        justify-content: flex-start !important;
    }
}


/* v1.0.24 - polish Joomla profile toggles and Choices.js remove buttons.
   Keeps checkboxes/switches small and prevents Choices remove controls from inheriting big button styles. */
#member-profile.bl-user-profile-form .choices,
.com-users-profile__edit .choices,
.profile-edit .choices {
    overflow: visible !important;
}

#member-profile.bl-user-profile-form .choices__inner,
.com-users-profile__edit .choices__inner,
.profile-edit .choices__inner {
    align-items: center !important;
    min-height: 26px !important;
    padding: .1rem .32rem !important;
    overflow: hidden !important;
}

#member-profile.bl-user-profile-form .choices__list--multiple,
.com-users-profile__edit .choices__list--multiple,
.profile-edit .choices__list--multiple {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: .12rem !important;
    width: 100% !important;
    min-height: 20px !important;
    padding: 0 !important;
}

#member-profile.bl-user-profile-form .choices__list--multiple .choices__item,
.com-users-profile__edit .choices__list--multiple .choices__item,
.profile-edit .choices__list--multiple .choices__item,
#member-profile.bl-user-profile-form .choices__item--selectable,
.com-users-profile__edit .choices__item--selectable,
.profile-edit .choices__item--selectable {
    display: inline-flex !important;
    align-items: center !important;
    gap: .16rem !important;
    max-width: 100% !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: .12rem .22rem !important;
    border-radius: 999px !important;
    font-size: .58rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#member-profile.bl-user-profile-form .choices__input,
.com-users-profile__edit .choices__input,
.profile-edit .choices__input {
    flex: 1 1 120px !important;
    width: auto !important;
    min-width: 118px !important;
    max-width: 100% !important;
    min-height: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: .04rem .18rem !important;
    font-size: .64rem !important;
    line-height: 1 !important;
}

/* Joomla names this button choices__button_joomla, so match by substring and data-button too. */
#member-profile.bl-user-profile-form .choices [data-button],
#member-profile.bl-user-profile-form [class*="choices__button"],
.com-users-profile__edit .choices [data-button],
.com-users-profile__edit [class*="choices__button"],
.profile-edit .choices [data-button],
.profile-edit [class*="choices__button"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 13px !important;
    width: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;
    margin: 0 0 0 .12rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(0, 25, 18, .50) !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-indent: -9999px !important;
    text-shadow: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px rgba(255,255,255,.16) !important;
}

#member-profile.bl-user-profile-form .choices [data-button]::after,
#member-profile.bl-user-profile-form [class*="choices__button"]::after,
.com-users-profile__edit .choices [data-button]::after,
.com-users-profile__edit [class*="choices__button"]::after,
.profile-edit .choices [data-button]::after,
.profile-edit [class*="choices__button"]::after {
    content: "×" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 13px !important;
    height: 13px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
}

#member-profile.bl-user-profile-form .choices [data-button]:hover,
#member-profile.bl-user-profile-form [class*="choices__button"]:hover,
.com-users-profile__edit .choices [data-button]:hover,
.com-users-profile__edit [class*="choices__button"]:hover,
.profile-edit .choices [data-button]:hover,
.profile-edit [class*="choices__button"]:hover {
    background: rgba(194, 42, 42, .78) !important;
}

/* Sleek boolean controls: checkboxes, radios, Joomla Yes/No button groups, and switchers. */
#member-profile.bl-user-profile-form input[type="checkbox"],
#member-profile.bl-user-profile-form input[type="radio"],
.com-users-profile__edit input[type="checkbox"],
.com-users-profile__edit input[type="radio"],
.profile-edit input[type="checkbox"],
.profile-edit input[type="radio"] {
    appearance: auto !important;
    accent-color: #008e61 !important;
    width: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;
    margin: 0 .28rem 0 0 !important;
    padding: 0 !important;
    border-radius: 3px !important;
    vertical-align: middle !important;
    box-shadow: none !important;
}

#member-profile.bl-user-profile-form .switcher,
#member-profile.bl-user-profile-form fieldset.radio,
#member-profile.bl-user-profile-form .radio.btn-group,
#member-profile.bl-user-profile-form .btn-group-yesno,
#member-profile.bl-user-profile-form .joomla-form-switcher,
.com-users-profile__edit .switcher,
.com-users-profile__edit fieldset.radio,
.com-users-profile__edit .radio.btn-group,
.com-users-profile__edit .btn-group-yesno,
.profile-edit .switcher,
.profile-edit fieldset.radio,
.profile-edit .radio.btn-group,
.profile-edit .btn-group-yesno {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 2px !important;
    border: 1px solid rgba(0, 208, 132, .18) !important;
    border-radius: 999px !important;
    background: rgba(0, 16, 12, .42) !important;
    box-shadow: inset 0 1px 5px rgba(0,0,0,.28) !important;
}

#member-profile.bl-user-profile-form .switcher input[type="radio"],
#member-profile.bl-user-profile-form .switcher input[type="checkbox"],
#member-profile.bl-user-profile-form fieldset.radio input[type="radio"],
#member-profile.bl-user-profile-form .radio.btn-group input[type="radio"],
#member-profile.bl-user-profile-form .btn-group-yesno input[type="radio"],
.com-users-profile__edit .switcher input[type="radio"],
.com-users-profile__edit .switcher input[type="checkbox"],
.com-users-profile__edit fieldset.radio input[type="radio"],
.com-users-profile__edit .radio.btn-group input[type="radio"],
.com-users-profile__edit .btn-group-yesno input[type="radio"],
.profile-edit .switcher input[type="radio"],
.profile-edit .switcher input[type="checkbox"],
.profile-edit fieldset.radio input[type="radio"],
.profile-edit .radio.btn-group input[type="radio"],
.profile-edit .btn-group-yesno input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 1px !important;
    min-height: 1px !important;
    margin: 0 !important;
}

#member-profile.bl-user-profile-form .switcher label,
#member-profile.bl-user-profile-form fieldset.radio label,
#member-profile.bl-user-profile-form .radio.btn-group label,
#member-profile.bl-user-profile-form .btn-group-yesno label,
#member-profile.bl-user-profile-form .btn-group-yesno .btn,
.com-users-profile__edit .switcher label,
.com-users-profile__edit fieldset.radio label,
.com-users-profile__edit .radio.btn-group label,
.com-users-profile__edit .btn-group-yesno label,
.com-users-profile__edit .btn-group-yesno .btn,
.profile-edit .switcher label,
.profile-edit fieldset.radio label,
.profile-edit .radio.btn-group label,
.profile-edit .btn-group-yesno label,
.profile-edit .btn-group-yesno .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 26px !important;
    height: 18px !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: 0 .34rem !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: rgba(243,247,245,.62) !important;
    font-size: .54rem !important;
    font-weight: 900 !important;
    letter-spacing: .035em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
}

#member-profile.bl-user-profile-form .switcher input:checked + label,
#member-profile.bl-user-profile-form fieldset.radio input:checked + label,
#member-profile.bl-user-profile-form .radio.btn-group input:checked + label,
#member-profile.bl-user-profile-form .btn-group-yesno input:checked + label,
#member-profile.bl-user-profile-form .btn-group-yesno .active,
.com-users-profile__edit .switcher input:checked + label,
.com-users-profile__edit fieldset.radio input:checked + label,
.com-users-profile__edit .radio.btn-group input:checked + label,
.com-users-profile__edit .btn-group-yesno input:checked + label,
.com-users-profile__edit .btn-group-yesno .active,
.profile-edit .switcher input:checked + label,
.profile-edit fieldset.radio input:checked + label,
.profile-edit .radio.btn-group input:checked + label,
.profile-edit .btn-group-yesno input:checked + label,
.profile-edit .btn-group-yesno .active {
    background: linear-gradient(180deg, rgba(0, 158, 104, .96), rgba(0, 100, 70, .96)) !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px rgba(255,255,255,.16), 0 2px 8px rgba(0,0,0,.22) !important;
}

#member-profile.bl-user-profile-form .control-group:has(input[type="checkbox"]),
#member-profile.bl-user-profile-form .control-group:has(input[type="radio"]),
#member-profile.bl-user-profile-form .bl-field-row:has(input[type="checkbox"]),
#member-profile.bl-user-profile-form .bl-field-row:has(input[type="radio"]) {
    align-items: center !important;
}

#member-profile.bl-user-profile-form .control-group:has(.choices__list--multiple) .controls,
#member-profile.bl-user-profile-form .bl-field-row:has(.choices__list--multiple) .controls {
    overflow: visible !important;
}

/* v1.0.25 - Register link beside Login in the top login module. */
.bl-login-actions {
    display: inline-flex !important;
    align-items: center !important;
    gap: .32rem !important;
    margin: 0 !important;
}

.bl-register-btn,
.bl-top-login-area .bl-register-btn,
.bl-sidebar-right .bl-register-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 70px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: .32rem .6rem !important;
    border-radius: 4px !important;
    border: 1px solid rgba(0, 208, 132, .36) !important;
    background: linear-gradient(180deg, #0b8b60, #064c36) !important;
    color: #ffffff !important;
    font-size: .7rem !important;
    font-weight: 950 !important;
    letter-spacing: .045em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: inset 0 1px rgba(255,255,255,.22), 0 7px 16px rgba(0,0,0,.18) !important;
}

.bl-register-btn:hover,
.bl-register-btn:focus,
.bl-top-login-area .bl-register-btn:hover,
.bl-top-login-area .bl-register-btn:focus {
    background: linear-gradient(180deg, #0faf78, #076747) !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-1px);
}

.bl-top-login-area .bl-login-actions {
    flex-wrap: nowrap !important;
}

.bl-top-login-area .bl-login-options {
    display: none !important;
}

@media (max-width: 640px) {
    .bl-top-login-area .bl-login-actions {
        width: 100% !important;
        justify-content: center !important;
    }
}


/* BEERLEAGUE registration form hotfix - v1.0.1 */
.bl-registration-page {
  max-width: 760px;
  margin: 0 auto;
}

.bl-registration-header h1 {
  margin: 0 0 10px;
  color: #f5a400;
  font-size: 20px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.bl-registration-intro {
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid rgba(0, 180, 132, 0.45);
  border-radius: 10px;
  background: rgba(0, 30, 22, 0.72);
  color: #d9fff2;
  font-size: 12px;
  line-height: 1.45;
}

.bl-registration-form {
  display: grid;
  gap: 14px;
}

.bl-registration-card {
  margin: 0;
}

.bl-registration-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.bl-registration-field {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 4px 0;
  border-bottom: 1px solid rgba(185, 255, 225, 0.09);
}

.bl-registration-field:last-child {
  border-bottom: 0;
}

.bl-registration-field label,
.bl-registration-field .control-label {
  margin: 0;
  font-size: 11px;
  color: #f3fff9;
  font-weight: 800;
}

.bl-registration-field input[type="text"],
.bl-registration-field input[type="email"],
.bl-registration-field input[type="password"],
.bl-registration-field input[type="url"],
.bl-registration-field select {
  min-height: 26px;
  height: 26px;
  max-width: 430px;
  width: 100%;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 12px;
}

.bl-registration-field .form-text,
.bl-registration-note {
  margin-top: 3px;
  color: rgba(235, 255, 248, 0.72);
  font-size: 10px;
  line-height: 1.35;
}

.bl-registration-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding-top: 6px;
}

.bl-registration-actions .btn {
  min-height: 26px;
  padding: 5px 12px;
  border-radius: 7px;
  font-size: 11px;
}

@media (max-width: 720px) {
  .bl-registration-field {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 4px;
  }

  .bl-registration-field input[type="text"],
  .bl-registration-field input[type="email"],
  .bl-registration-field input[type="password"],
  .bl-registration-field input[type="url"],
  .bl-registration-field select {
    max-width: 100%;
  }
}

/* v1.0.2 - Registration page matches compact Edit Profile card layout. */
.bl-registration-page.bl-user-profile-edit,
.com-users-registration.bl-registration-page {
    max-width: 1160px !important;
    width: 100% !important;
    margin-inline: auto !important;
}

#member-registration.bl-user-registration-form {
    display: block !important;
    max-width: 1160px !important;
    width: 100% !important;
    margin: 0 auto !important;
}

#member-registration.bl-user-registration-form .bl-profile-grid,
#member-registration.bl-user-registration-form .bl-registration-profile-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(330px, 1fr)) !important;
    align-items: start !important;
    gap: .72rem !important;
    width: 100% !important;
}

#member-registration.bl-user-registration-form .bl-profile-card,
#member-registration.bl-user-registration-form .bl-registration-card {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: .62rem .72rem .68rem !important;
    border: 1px solid rgba(0, 208, 132, .24) !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, rgba(0, 38, 25, .78), rgba(0, 18, 13, .70)) !important;
    box-shadow: inset 0 1px rgba(255,255,255,.035), 0 10px 22px rgba(0,0,0,.14) !important;
}

#member-registration.bl-user-registration-form .bl-profile-card legend,
#member-registration.bl-user-registration-form .bl-registration-card legend {
    width: auto !important;
    margin: -.18rem 0 .52rem !important;
    padding: .18rem .52rem !important;
    border: 1px solid rgba(0, 208, 132, .36) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(0, 150, 99, .32), rgba(0, 95, 66, .28)) !important;
    color: var(--bl-green-bright) !important;
    font-size: .62rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: .065em !important;
    text-transform: uppercase !important;
}

#member-registration.bl-user-registration-form .bl-registration-steam-strip {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .55rem !important;
    margin: -.12rem 0 .55rem !important;
    padding: .5rem !important;
    border: 1px solid rgba(255, 173, 24, .22) !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, rgba(255, 173, 24, .095), rgba(0, 208, 132, .075)) !important;
}

#member-registration.bl-user-registration-form .bl-registration-icon {
    display: grid !important;
    place-items: center !important;
    width: 46px !important;
    height: 46px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 173, 24, .48) !important;
    border-radius: 10px !important;
    background: rgba(0,0,0,.28) !important;
    color: var(--bl-logo-orange-bright) !important;
    font-size: .82rem !important;
    font-weight: 950 !important;
    letter-spacing: .05em !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.22) !important;
}

#member-registration.bl-user-registration-form .bl-registration-copy {
    display: grid !important;
    gap: .08rem !important;
    min-width: 0 !important;
}

#member-registration.bl-user-registration-form .bl-registration-copy strong {
    overflow: hidden !important;
    color: #fff !important;
    font-size: .82rem !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#member-registration.bl-user-registration-form .bl-registration-copy span,
#member-registration.bl-user-registration-form .bl-registration-mini-notes span,
#member-registration.bl-user-registration-form .bl-profile-fieldset-desc,
#member-registration.bl-user-registration-form .bl-registration-note {
    color: rgba(243,247,245,.66) !important;
    font-size: .64rem !important;
    line-height: 1.2 !important;
}

#member-registration.bl-user-registration-form .bl-registration-mini-notes {
    display: grid !important;
    gap: .42rem !important;
}

#member-registration.bl-user-registration-form .bl-registration-mini-notes > div {
    padding: .44rem .5rem !important;
    border: 1px solid rgba(0, 208, 132, .16) !important;
    border-radius: 10px !important;
    background: rgba(0,0,0,.12) !important;
}

#member-registration.bl-user-registration-form .bl-registration-mini-notes strong {
    display: block !important;
    margin: 0 0 .12rem !important;
    color: var(--bl-logo-orange-bright) !important;
    font-size: .64rem !important;
    line-height: 1.1 !important;
    letter-spacing: .045em !important;
    text-transform: uppercase !important;
}

#member-registration.bl-user-registration-form .bl-field-row,
#member-registration.bl-user-registration-form .control-group,
#member-registration.bl-user-registration-form .bl-registration-field {
    display: grid !important;
    grid-template-columns: 116px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .22rem .5rem !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: .25rem 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.045) !important;
}

#member-registration.bl-user-registration-form .bl-field-row:last-child,
#member-registration.bl-user-registration-form .control-group:last-child,
#member-registration.bl-user-registration-form .bl-registration-field:last-child {
    border-bottom: 0 !important;
}

#member-registration.bl-user-registration-form .bl-field-full {
    grid-template-columns: 1fr !important;
}

#member-registration.bl-user-registration-form .control-label,
#member-registration.bl-user-registration-form .control-label label,
#member-registration.bl-user-registration-form label {
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(243,247,245,.86) !important;
    font-size: .66rem !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: .005em !important;
    text-shadow: none !important;
}

#member-registration.bl-user-registration-form .controls {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

#member-registration.bl-user-registration-form input[type="text"],
#member-registration.bl-user-registration-form input[type="password"],
#member-registration.bl-user-registration-form input[type="email"],
#member-registration.bl-user-registration-form input[type="url"],
#member-registration.bl-user-registration-form input[type="tel"],
#member-registration.bl-user-registration-form input[type="number"],
#member-registration.bl-user-registration-form input.form-control,
#member-registration.bl-user-registration-form select,
#member-registration.bl-user-registration-form select.form-select,
#member-registration.bl-user-registration-form select.custom-select,
#member-registration.bl-user-registration-form .inputbox,
#member-registration.bl-user-registration-form textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: .16rem .42rem !important;
    border: 1px solid rgba(0, 208, 132, .20) !important;
    border-radius: 6px !important;
    background: rgba(248, 251, 249, .96) !important;
    color: #101714 !important;
    font-size: .7rem !important;
    line-height: 1.08 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.7) !important;
}

#member-registration.bl-user-registration-form textarea {
    min-height: 56px !important;
    height: auto !important;
    padding: .32rem .42rem !important;
}

#member-registration.bl-user-registration-form .input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    gap: .28rem !important;
}

#member-registration.bl-user-registration-form .input-password-toggle,
#member-registration.bl-user-registration-form .btn-secondary,
#member-registration.bl-user-registration-form button.btn,
#member-registration.bl-user-registration-form .btn:not(.bl-register-submit):not(.bl-register-cancel) {
    width: auto !important;
    min-width: 0 !important;
    min-height: 24px !important;
    height: 24px !important;
    padding: .18rem .44rem !important;
    border-radius: 6px !important;
    font-size: .58rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#member-registration.bl-user-registration-form .form-text,
#member-registration.bl-user-registration-form .text-muted,
#member-registration.bl-user-registration-form .small,
#member-registration.bl-user-registration-form .form-control-feedback {
    display: block !important;
    margin-top: .08rem !important;
    color: rgba(243,247,245,.60) !important;
    font-size: .56rem !important;
    line-height: 1.15 !important;
}

#member-registration.bl-user-registration-form .choices {
    width: 100% !important;
    max-width: none !important;
    min-height: 24px !important;
    margin: 0 !important;
    overflow: visible !important;
}

#member-registration.bl-user-registration-form .choices__inner {
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 26px !important;
    height: auto !important;
    padding: .1rem .32rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(0, 208, 132, .20) !important;
    border-radius: 6px !important;
    background: rgba(248, 251, 249, .96) !important;
    color: #101714 !important;
    font-size: .68rem !important;
    line-height: 1.05 !important;
}

#member-registration.bl-user-registration-form .choices__list--multiple {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: .12rem !important;
    width: 100% !important;
    min-height: 20px !important;
    padding: 0 !important;
}

#member-registration.bl-user-registration-form .choices__item,
#member-registration.bl-user-registration-form .choices__input {
    font-size: .68rem !important;
    line-height: 1.05 !important;
}

#member-registration.bl-user-registration-form .choices__input {
    flex: 1 1 120px !important;
    width: auto !important;
    min-width: 118px !important;
    max-width: 100% !important;
    min-height: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    padding: .04rem .18rem !important;
    font-size: .64rem !important;
    line-height: 1 !important;
}

#member-registration.bl-user-registration-form .choices__list--multiple .choices__item,
#member-registration.bl-user-registration-form .choices__item--selectable {
    display: inline-flex !important;
    align-items: center !important;
    gap: .16rem !important;
    max-width: 100% !important;
    min-height: 18px !important;
    margin: 0 !important;
    padding: .12rem .22rem !important;
    border-radius: 999px !important;
    font-size: .58rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

#member-registration.bl-user-registration-form .choices [data-button],
#member-registration.bl-user-registration-form [class*="choices__button"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 13px !important;
    width: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;
    margin: 0 0 0 .12rem !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(0, 25, 18, .50) !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-indent: -9999px !important;
    text-shadow: none !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px rgba(255,255,255,.16) !important;
}

#member-registration.bl-user-registration-form .choices [data-button]::after,
#member-registration.bl-user-registration-form [class*="choices__button"]::after {
    content: "×" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 13px !important;
    height: 13px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
}

#member-registration.bl-user-registration-form input[type="checkbox"],
#member-registration.bl-user-registration-form input[type="radio"] {
    appearance: auto !important;
    accent-color: #008e61 !important;
    width: 13px !important;
    min-width: 13px !important;
    max-width: 13px !important;
    height: 13px !important;
    min-height: 13px !important;
    max-height: 13px !important;
    margin: 0 .28rem 0 0 !important;
    padding: 0 !important;
    border-radius: 3px !important;
    vertical-align: middle !important;
    box-shadow: none !important;
}

#member-registration.bl-user-registration-form .bl-profile-actions-bar,
#member-registration.bl-user-registration-form .bl-registration-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .45rem !important;
    margin-top: .72rem !important;
    padding-top: .62rem !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
}

#member-registration.bl-user-registration-form .bl-profile-actions-bar .btn,
#member-registration.bl-user-registration-form .bl-registration-actions .btn,
#member-registration.bl-user-registration-form .bl-register-submit,
#member-registration.bl-user-registration-form .bl-register-cancel {
    width: auto !important;
    min-width: 0 !important;
    min-height: 28px !important;
    height: 28px !important;
    padding: .22rem .62rem !important;
    border-radius: 7px !important;
    font-size: .64rem !important;
    line-height: 1 !important;
}

@media (max-width: 980px) {
    #member-registration.bl-user-registration-form .bl-profile-grid,
    #member-registration.bl-user-registration-form .bl-registration-profile-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 620px) {
    #member-registration.bl-user-registration-form .bl-profile-card,
    #member-registration.bl-user-registration-form .bl-registration-card {
        padding: .58rem !important;
    }

    #member-registration.bl-user-registration-form .bl-field-row,
    #member-registration.bl-user-registration-form .control-group,
    #member-registration.bl-user-registration-form .bl-registration-field {
        grid-template-columns: 1fr !important;
        gap: .12rem !important;
        padding: .3rem 0 !important;
    }

    #member-registration.bl-user-registration-form .bl-registration-steam-strip {
        grid-template-columns: 40px minmax(0, 1fr) !important;
    }

    #member-registration.bl-user-registration-form .bl-registration-icon {
        width: 40px !important;
        height: 40px !important;
    }
}


/* v1.0.3 - Registration Steam ID required polish. */
.bl-registration-card-beerleague-stats .control-label label,
.bl-registration-card-beerleague-stats .control-label {
    color: var(--bl-text, #f2fff8);
}
.bl-registration-page .bl-field-steamid input[required],
.bl-registration-page .bl-field-steamid input.required {
    border-color: rgba(255, 184, 0, 0.68);
    box-shadow: 0 0 0 1px rgba(255, 184, 0, 0.16);
}

/* Template font controls */
h1, h2, h3, h4, h5, h6,
.bl-top-menu a,
.bl-top-menu .nav-link,
.bl-btn, .btn, button, input[type="submit"],
.bl-footer-note,
legend,
fieldset legend,
.page-header,
.componentheading,
.contentheading {
    font-family: var(--bl-font-display);
}


/* v1.0.6 - Full-width server status strip under menu. */
.bl-header-inner {
    width: min(1380px, calc(100% - 32px)) !important;
}
.bl-server-status-row {
    width: 100% !important;
    max-width: 100% !important;
    margin: .45rem auto .55rem !important;
    gap: .72rem !important;
    align-items: stretch !important;
}
.bl-server-status-slot,
.bl-server-status-row > * {
    min-width: 0 !important;
    width: 100% !important;
}
.bl-server-status-row .moduletable,
.bl-server-status-row .card,
.bl-server-status-row .well {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    padding: .55rem !important;
    border-radius: 6px !important;
}
.bl-server-status-row .blsrv-status-module {
    height: 100% !important;
}
.bl-server-status-row .blsrv-status-slider,
.bl-server-status-row .blsrv-status-slide,
.bl-server-status-row .blsrv-status-card {
    height: 100% !important;
}
@media (max-width: 1140px) {
    .bl-server-status-count-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 760px) {
    .bl-server-status-row,
    .bl-server-status-count-2,
    .bl-server-status-count-3 {
        grid-template-columns: 1fr !important;
    }
}


/* v1.0.7 - make top server status positions use the whole header width and do not let module helper row max-width shrink them. */
.bl-server-status-row.blsrv-status-row { width: 100% !important; max-width: 100% !important; grid-template-columns: repeat(var(--bl-server-status-columns, 3), minmax(0, 1fr)) !important; }
.bl-server-status-count-1 { --bl-server-status-columns: 1; }
.bl-server-status-count-2 { --bl-server-status-columns: 2; }
.bl-server-status-count-3 { --bl-server-status-columns: 3; }
.bl-server-status-row .blsrv-status-module-shell > h3,
.bl-server-status-row .moduletable > h3 { display: none !important; }


/* v1.0.8 - repaired server-status strip spacing after module tile cleanup. */
.bl-server-status-row {
    gap: .8rem !important;
    margin-top: .5rem !important;
    margin-bottom: .65rem !important;
}
.bl-server-status-row .moduletable,
.bl-server-status-row .card,
.bl-server-status-row .well {
    padding: .5rem !important;
    border-radius: 8px !important;
}
.bl-server-status-row .blsrv-status-module-head .blsrv-status-heading {
    color: #e9f5ee !important;
}