:root {
    --qr-accent: #15966f;
    --qr-accent-dark: #087052;
    --qr-accent-soft: #e9f8f2;
    --qr-coral: #e96b58;
    --qr-ink: #17211d;
    --qr-muted: #64716b;
    --qr-border: #dce4e0;
    --qr-surface: #ffffff;
    --qr-canvas: #f4f7f5;
    --qr-shadow: 0 12px 34px rgba(21, 39, 31, .08);
    --qr-radius: 8px;
    --qr-container: 1440px;
    color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.qr-site {
    min-height: 100vh;
    margin: 0;
    background-color: var(--qr-canvas);
    background-image: linear-gradient(rgba(21, 150, 111, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(21, 150, 111, .035) 1px, transparent 1px);
    background-size: 32px 32px;
    color: var(--qr-ink);
    font-family: Aptos, "Segoe UI Variable Text", "Trebuchet MS", sans-serif;
    font-size: 16px;
    line-height: 1.55;
}

a { color: var(--qr-accent-dark); text-underline-offset: 3px; }
a:hover { color: var(--qr-ink); }
img { max-width: 100%; height: auto; }

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    color: var(--qr-ink);
    font-family: Bahnschrift, "Arial Narrow", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.15;
}

h1 { margin-bottom: 1.25rem; font-size: 2rem; }
h2 { font-size: 1.45rem; }
h3 { font-size: 1.15rem; }

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.qr-skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 10000;
    padding: .65rem 1rem;
    transform: translateY(-140%);
    border-radius: 6px;
    background: var(--qr-ink);
    color: #fff;
}
.qr-skip-link:focus { transform: translateY(0); }

.qr-container { width: min(calc(100% - 40px), var(--qr-container)); margin-inline: auto; }

.qr-topbar { border-bottom: 1px solid #26362f; background: #12211c; color: #dce8e3; font-size: .82rem; }
.qr-topbar a { color: #fff; }
.qr-topbar-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 36px; gap: 1rem; }
.qr-topbar-grid > :last-child { text-align: right; }

.qr-header { z-index: 1000; border-bottom: 1px solid var(--qr-border); background: rgba(255, 255, 255, .97); }
.has-sticky-header .qr-header { position: sticky; top: 0; }
.qr-header-inner { display: flex; min-height: 76px; flex-wrap: wrap; align-items: center; gap: .5rem 2rem; padding-block: .65rem; }
.qr-brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .75rem; color: var(--qr-ink); font-family: Bahnschrift, sans-serif; font-size: 1.2rem; font-weight: 700; text-decoration: none; }
.qr-brand img { display: block; }
.qr-navigation { display: flex; min-width: 0; flex: 1; align-items: center; justify-content: flex-end; gap: 1.25rem; }
.qr-navigation ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .2rem; margin: 0; padding: 0; list-style: none; }
.qr-navigation li { position: relative; }
.qr-navigation a, .qr-navigation li > span { display: block; padding: .7rem .8rem; border-radius: 6px; color: #33423b; font-size: .86rem; font-weight: 650; text-decoration: none; }
.qr-navigation a:hover, .qr-navigation .active > a, .qr-navigation .current > a { background: var(--qr-accent-soft); color: var(--qr-accent-dark); }
.qr-navigation ul ul { position: absolute; top: 100%; left: 0; display: none; width: 240px; padding: .45rem; border: 1px solid var(--qr-border); border-radius: var(--qr-radius); background: var(--qr-surface); box-shadow: var(--qr-shadow); }
.qr-navigation li:hover > ul, .qr-navigation li:focus-within > ul { display: block; }
.qr-navigation ul ul a { white-space: normal; }

.qr-menu-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--qr-border); border-radius: 6px; background: #fff; color: var(--qr-ink); }
.qr-menu-icon, .qr-menu-icon::before, .qr-menu-icon::after { display: block; width: 20px; height: 2px; margin: auto; background: currentColor; content: ""; }
.qr-menu-icon::before { transform: translateY(-7px); }
.qr-menu-icon::after { transform: translateY(5px); }

.qr-banner { overflow: hidden; background: #12211c; color: #fff; }
.qr-breadcrumbs { padding-block: 1rem .25rem; color: var(--qr-muted); font-size: .88rem; }
.qr-breadcrumbs ol, .qr-breadcrumbs ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }

.qr-content-grid { display: grid; min-width: 0; padding-block: 2rem 3rem; gap: 1.5rem; }
.qr-content-grid.has-no-sidebar { grid-template-columns: minmax(0, 1fr); }
.qr-content-grid.has-left-sidebar { grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); }
.qr-content-grid.has-right-sidebar { grid-template-columns: minmax(0, 1fr) minmax(220px, 280px); }
.qr-content-grid.has-both-sidebars { grid-template-columns: minmax(200px, 250px) minmax(0, 1fr) minmax(200px, 250px); }
.qr-main { min-width: 0; }
.qr-main:focus { outline: none; }
.qr-module-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-block: 1.5rem; }
.qr-module-card { padding: 1.25rem; border: 1px solid var(--qr-border); border-radius: var(--qr-radius); background: var(--qr-surface); box-shadow: 0 5px 18px rgba(21, 39, 31, .04); }
.qr-module-title { margin-bottom: 1rem; font-size: 1.08rem; }
.qr-section { padding-block: 2.5rem; background: var(--qr-surface); }
.qr-section-muted { background: #eaf0ed; }

.qr-footer { padding-block: 2rem; border-top: 1px solid #26362f; background: #12211c; color: #b9c9c2; font-size: .88rem; }
.qr-footer a { color: #fff; }
.qr-footer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.qr-footer-grid > :nth-child(2) { text-align: center; }
.qr-footer-grid > :last-child { text-align: right; }

input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control, .form-select {
    min-height: 42px;
    max-width: 100%;
    padding: .55rem .75rem;
    border: 1px solid #cbd6d1;
    border-radius: 6px;
    background: #fff;
    color: var(--qr-ink);
    font: inherit;
}
textarea { min-height: 110px; }
input:focus, select:focus, textarea:focus, .form-control:focus, .form-select:focus {
    border-color: var(--qr-accent);
    outline: 3px solid rgba(21, 150, 111, .15);
    box-shadow: none;
}
label { color: #33423b; font-weight: 650; }
.input-group { display: flex; flex-wrap: nowrap; }
.input-group > * { border-radius: 0; }
.input-group > :first-child { border-radius: 6px 0 0 6px; }
.input-group > :last-child { border-radius: 0 6px 6px 0; }

.btn, button, input[type="submit"], input[type="button"] {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .55rem .9rem;
    border: 1px solid transparent;
    border-radius: 6px;
    background: #e7ece9;
    color: #26362f;
    font: 650 .9rem/1.2 Aptos, "Segoe UI Variable Text", sans-serif;
    text-decoration: none;
    cursor: pointer;
}
.btn:hover, button:hover { background: #dce5e1; color: #17211d; }
.btn-primary, .btn-success, button[type="submit"], input[type="submit"] { border-color: var(--qr-accent); background: var(--qr-accent); color: #fff; }
.btn-primary:hover, .btn-success:hover, button[type="submit"]:hover { border-color: var(--qr-accent-dark); background: var(--qr-accent-dark); color: #fff; }
.btn-danger { border-color: #d95846; background: #d95846; color: #fff; }
.btn-warning { border-color: #e7a632; background: #fff5df; color: #68470e; }
.btn-secondary { border-color: #c7d2cd; background: #fff; }
.btn:disabled, button:disabled { opacity: .45; cursor: not-allowed; }

.alert { margin-bottom: 1rem; padding: .85rem 1rem; border: 1px solid var(--qr-border); border-left: 4px solid var(--qr-accent); border-radius: 6px; background: #fff; }
.alert-danger { border-left-color: var(--qr-coral); background: #fff2ef; }
.alert-warning { border-left-color: #d59420; background: #fff8e9; }
.alert-success { background: var(--qr-accent-soft); }

.table-responsive { max-width: 100%; overflow-x: auto; }
.eb-container, .com-eventbooking-registrants { max-width: 100%; min-width: 0; overflow: visible; }
table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--qr-border); border-radius: var(--qr-radius); background: #fff; font-size: .88rem; }
th, td { padding: .75rem .7rem; border-right: 1px solid #e7ece9; border-bottom: 1px solid #e7ece9; text-align: left; vertical-align: middle; }
th:last-child, td:last-child { border-right: 0; }
tbody tr:last-child td { border-bottom: 0; }
thead th { position: sticky; top: 76px; z-index: 2; background: #edf3f0; color: #34433c; font-size: .78rem; font-weight: 750; }
#eb-registrants-management-page thead th { position: static; }
tbody tr:nth-child(even) { background: #f8faf9; }
tbody tr:hover { background: var(--qr-accent-soft); }
th a { color: inherit; text-decoration: none; }

.btn-toolbar, .toolbar, [role="toolbar"] { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.btn-group { display: inline-flex; }
.btn-group > .btn { border-radius: 0; }
.btn-group > .btn:first-child { border-radius: 6px 0 0 6px; }
.btn-group > .btn:last-child { border-radius: 0 6px 6px 0; }
.pagination { display: flex; flex-wrap: wrap; gap: .25rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.page-link { display: grid; min-width: 38px; min-height: 38px; place-items: center; border: 1px solid var(--qr-border); border-radius: 6px; background: #fff; text-decoration: none; }
.active > .page-link, .page-link.active { border-color: var(--qr-accent); background: var(--qr-accent); color: #fff; }

.com-users-login, .login, .registration, .remind, .reset {
    width: min(100%, 480px);
    margin: 4rem auto;
    padding: 2rem;
    border: 1px solid var(--qr-border);
    border-top: 4px solid var(--qr-accent);
    border-radius: var(--qr-radius);
    background: #fff;
    box-shadow: var(--qr-shadow);
}
.com-users-login fieldset, .login fieldset { display: grid; gap: 1rem; margin: 0; padding: 0; border: 0; }
.com-users-login .control-group, .login .control-group { display: grid; gap: .35rem; }
.com-users-login .btn, .login .btn { width: 100%; }
.com-users-login + ul, .login + ul { width: min(100%, 480px); margin: -2.5rem auto 4rem; padding: 0; list-style: none; text-align: center; }

#adminForm > .row, #adminForm .filters, .js-stools-container-bar, .js-stools-container-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: .65rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid var(--qr-border);
    border-radius: var(--qr-radius);
    background: #fff;
}
.choices { min-width: 180px; }
.choices__inner { min-height: 42px; border-color: #cbd6d1; border-radius: 6px; background: #fff; }
.choices.is-open { z-index: 100; }
.choices__list--dropdown, .choices__list[aria-expanded] { z-index: 101; }

.qr-component-only { padding: 1.5rem; }
.qr-error-page { display: grid; min-height: 100vh; place-items: center; padding: 1.25rem; }
.qr-error-panel { width: min(100%, 560px); padding: 2.5rem; border: 1px solid var(--qr-border); border-radius: var(--qr-radius); background: #fff; text-align: center; box-shadow: var(--qr-shadow); }
.qr-error-code { margin: 1.5rem 0 .25rem; color: var(--qr-accent); font: 700 3rem/1 Bahnschrift, sans-serif; }

@media (max-width: 1100px) {
    .qr-content-grid.has-both-sidebars { grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); }
    .qr-content-grid.has-both-sidebars .qr-sidebar:last-child { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
    .qr-container { width: min(calc(100% - 28px), var(--qr-container)); }
    .qr-header-inner { min-height: 68px; }
    .qr-menu-toggle { display: inline-grid; flex: 0 0 auto; place-items: center; margin-left: auto; }
    .qr-navigation { position: absolute; top: 68px; right: 14px; left: 14px; display: none; max-height: calc(100vh - 88px); padding: .75rem; overflow-y: auto; border: 1px solid var(--qr-border); border-radius: var(--qr-radius); background: #fff; box-shadow: var(--qr-shadow); }
    .qr-navigation.is-open { display: block; }
    .qr-navigation ul { display: block; }
    .qr-navigation a { padding: .8rem; }
    .qr-navigation ul ul { position: static; display: block; width: auto; margin-left: 1rem; padding: 0 0 0 .5rem; border: 0; border-left: 2px solid var(--qr-border); border-radius: 0; box-shadow: none; }
    .qr-content-grid.has-left-sidebar, .qr-content-grid.has-right-sidebar, .qr-content-grid.has-both-sidebars { grid-template-columns: minmax(0, 1fr); }
    .qr-content-grid.has-both-sidebars .qr-sidebar:last-child { grid-column: auto; }
    thead th { position: static; }
}

@media (max-width: 640px) {
    body.qr-site { font-size: 15px; }
    h1 { font-size: 1.65rem; }
    .qr-topbar-grid, .qr-module-grid, .qr-footer-grid { grid-template-columns: 1fr; }
    .qr-topbar-grid { padding-block: .4rem; }
    .qr-topbar-grid > *, .qr-footer-grid > *, .qr-footer-grid > :nth-child(2), .qr-footer-grid > :last-child { text-align: left; }
    .qr-content-grid { padding-block: 1.25rem 2rem; }
    .qr-module-card, .com-users-login, .login, .registration, .remind, .reset { padding: 1.25rem; }
    .com-users-login, .login, .registration, .remind, .reset { margin-block: 1.5rem 3rem; }
    .qr-site.com_eventbooking .qr-main nav:has([role="toolbar"]),
    .qr-site.com_eventbooking .qr-main nav:has(.btn-toolbar),
    .qr-site.com_eventbooking .qr-main [role="navigation"]:has([role="toolbar"]),
    .qr-site.com_eventbooking .eb-container > [role="navigation"],
    .qr-site.com_eventbooking .eb-taskbar {
        display: block !important;
        float: none !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;
    }
    .btn-toolbar, .toolbar, [role="toolbar"] {
        display: grid !important;
        width: calc(100vw - 28px) !important;
        max-width: calc(100vw - 28px) !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: stretch;
        gap: .65rem;
    }
    .btn-toolbar > *, .toolbar > *, [role="toolbar"] > * {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }
    .btn-toolbar .btn, .toolbar .btn, [role="toolbar"] .btn,
    .btn-toolbar button, .toolbar button, [role="toolbar"] button {
        width: 100% !important;
        min-width: 0 !important;
        height: 100%;
        padding-inline: .55rem;
        white-space: normal;
    }
    #adminForm > .row, #adminForm .filters, .js-stools-container-bar, .js-stools-container-filters {
        display: grid !important;
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch;
        overflow: visible;
    }
    #adminForm > .row > *, #adminForm .filters > *,
    .js-stools-container-bar > *, .js-stools-container-filters > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
    }
    #adminForm input:not([type="checkbox"]):not([type="radio"]),
    #adminForm select, #adminForm .choices { width: 100% !important; min-width: 0 !important; }
    .eb-manage-registrants-filters-container,
    .eb-events-management-filters-container {
        display: grid !important;
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: .65rem;
    }
    .eb-manage-registrants-filters-container > *,
    .eb-events-management-filters-container > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    .eb-manage-registrants-filters-container joomla-field-fancy-select,
    .eb-events-management-filters-container joomla-field-fancy-select,
    .eb-manage-registrants-filters-container .choices,
    .eb-events-management-filters-container .choices {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    .eb-container .row, .com-eventbooking-registrants .row {
        width: 100%;
        max-width: 100%;
        margin-inline: 0;
    }
    table { font-size: .82rem; }
    th, td { padding: .6rem .55rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}