/* Shared Cashout shell;
application routes and handlers remain in Python. */
:root {
    --cashout-sidebar-width:240px;
    --cashout-ink:#f1f2ec;
    --cashout-secondary:#b6c0b8;
    --cashout-muted:#98a79d;
    --cashout-line:#354039;
    --cashout-accent:#c5ebd2;
    --cashout-ground:#101412;
    --cashout-surface:#1b231f;
    color-scheme:dark
}
body {
    background:var(--cashout-ground)!important;
    color:var(--cashout-ink);
    -webkit-font-smoothing:antialiased
}
::selection {
    background:#c5ebd2;
    color:#12251a
}
input,textarea {
    caret-color:var(--cashout-accent)
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex="0"]:focus-visible {
    outline:2px solid var(--cashout-accent)!important;
    outline-offset:3px
}
a {
    text-underline-offset:3px
}
.nicegui-content {
    max-width:100%;
    min-width:0
}
.nicegui-content:has(>.main-content) {
    padding:0!important;
    gap:0!important
}
.cashout-sidebar {
    width:var(--cashout-sidebar-width)!important;
    min-width:var(--cashout-sidebar-width)!important;
    box-sizing:border-box;
    padding:34px 18px 0!important;
    background:#141a17!important;
    border-right:1px solid #2a342e!important;
    z-index:60!important;
    display:flex!important;
    flex-direction:column!important;
    gap:0!important;
    overflow-y:auto;
    overscroll-behavior:contain
}
.cashout-sidebar .sidebar-logo {
    display:flex!important;
    align-items:center;
    gap:11px!important;
    height:auto!important;
    padding:0 10px!important;
    margin:0 0 54px!important;
    border:0!important
}
.cashout-brand-mark {
    width:32px;
    height:32px;
    fill:none;
    stroke:var(--cashout-accent);
    stroke-width:2.1;
    stroke-linecap:round;
    stroke-linejoin:round;
    flex-shrink:0
}
.cashout-wordmark {
    font-family:Inter,system-ui,sans-serif;
    font-weight:600;
    font-size:25px!important;
    line-height:1!important;
    letter-spacing:-.035em;
    color:var(--cashout-ink)!important;
    text-decoration:none!important;
    display:block!important
}
.cashout-wordmark>span {
    display:block;
    font-size:10px;
    font-weight:500;
    letter-spacing:.25em;
    color:var(--cashout-secondary);
    margin-top:7px
}
.cashout-nav-label {
    font-size:10px;
    letter-spacing:.12em;
    font-weight:500;
    color:var(--cashout-muted);
    padding:0 12px;
    margin-bottom:17px
}
.cashout-sidebar .sidebar-nav {
    display:flex!important;
    flex-direction:column;
    gap:6px!important;
    padding:0!important;
    margin:0!important
}
.cashout-sidebar .sidebar-nav a {
    display:flex!important;
    align-items:center;
    gap:13px!important;
    border-radius:10px!important;
    min-height:46px;
    padding:12px!important;
    margin:0!important;
    color:var(--cashout-secondary)!important;
    font-size:14px!important;
    font-weight:400;
    border:0!important;
    transition:background .15s,color .15s
}
.cashout-sidebar .sidebar-nav a:hover {
    background:#25312a!important;
    color:var(--cashout-ink)!important
}
.cashout-sidebar .sidebar-nav a.active {
    background:#293c2f!important;
    color:var(--cashout-accent)!important;
    font-weight:500
}
.cashout-sidebar .sidebar-nav a .icon {
    font-size:21px!important;
    opacity:1!important;
    color:inherit!important
}
.cashout-sidebar .sidebar-bottom {
    margin-top:auto!important;
    padding:32px 0 0!important;
    border:0!important;
    display:flex;
    flex-direction:column;
    gap:3px
}
.cashout-sidebar .sidebar-bottom>a {
    display:flex!important;
    align-items:center;
    gap:8px;
    min-height:42px;
    padding:10px 12px!important;
    margin:0!important;
    border-radius:10px;
    color:var(--cashout-secondary)!important;
    font-size:13px!important;
    text-decoration:none
}
.cashout-sidebar .sidebar-bottom>a:hover {
    background:#25312a;
    color:var(--cashout-ink)!important
}
.cashout-sidebar .sidebar-bottom>a .material-symbols-rounded {
    font-size:19px!important
}
.cashout-user {
    display:flex;
    align-items:center;
    gap:11px;
    border-top:1px solid var(--cashout-line);
    padding:24px 9px;
    margin-top:18px
}
.cashout-avatar {
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    flex-shrink:0;
    border-radius:50%;
    background:#c5ebd2;
    color:#12251a;
    font-size:14px;
    font-weight:600
}
.cashout-sidebar .cashout-user .user-name {
    margin:0!important;
    padding:0!important;
    font-size:14px!important;
    color:var(--cashout-ink)!important;
    font-weight:500
}
.cashout-user .user-name>span {
    display:block;
    margin-top:4px;
    font-size:12px;
    font-weight:400;
    color:var(--cashout-muted)
}
.cashout-topbar {
    position:fixed;
    inset:0 0 auto var(--cashout-sidebar-width);
    height:72px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 36px;
    background:var(--cashout-ground);
    z-index:45;
    border-bottom:1px solid #2a342e
}
.cashout-breadcrumb {
    display:flex;
    align-items:center;
    gap:16px;
    font-size:13px;
    color:var(--cashout-muted);
    min-width:0
}
.cashout-breadcrumb strong {
    font-weight:500;
    color:var(--cashout-ink)
}
.cashout-menu-toggle {
    display:none;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:8px;
    background:transparent;
    color:var(--cashout-accent);
    width:44px;
    height:44px;
    cursor:pointer
}
.cashout-menu-toggle .material-symbols-rounded {
    font-size:23px
}
.cashout-menu-toggle:hover {
    background:#25312a
}
.profile-filter {
    position:fixed!important;
    top:15px!important;
    right:36px!important;
    z-index:46!important;
    display:flex;
    align-items:center;
    gap:3px;
    padding:4px!important;
    background:#1b231f!important;
    border:1px solid var(--cashout-line)!important;
    border-radius:10px!important;
    box-shadow:none!important
}
.profile-filter-label {
    font-size:12px;
    color:var(--cashout-muted);
    padding:0 10px
}
.profile-filter .q-btn {
    font-size:12px!important;
    min-height:32px!important;
    padding:6px 12px!important;
    border-radius:7px!important;
    line-height:1.3
}
.main-content {
    margin-left:var(--cashout-sidebar-width)!important;
    margin-top:72px!important;
    width:calc(100% - var(--cashout-sidebar-width))!important;
    max-width:1600px!important;
    min-width:0;
    padding:36px!important;
    box-sizing:border-box
}
.main-content .main-content {
    margin:0!important;
    width:100%!important;
    padding:0!important;
    min-height:0
}
.cashout-nav-backdrop {
    display:none
}
.q-dialog__inner>.q-card {
    max-width:calc(100vw - 32px)!important;
    max-height:calc(100dvh - 32px)!important
}
.q-btn {
    transition:background .15s,color .15s;
    touch-action:manipulation
}
.q-field__native::placeholder {
    color:var(--cashout-muted)!important;
    opacity:1!important
}
.q-notification {
    border-radius:12px!important
}
@media(min-width:1850px) {
    .main-content {
        margin-left:calc(var(--cashout-sidebar-width) + (100vw - var(--cashout-sidebar-width) - 1600px)/2)!important
    }
}
@media(max-width:1150px) {
    :root {
        --cashout-sidebar-width:220px
    }
    .cashout-sidebar {
        padding:30px 14px 0!important
    }
    .cashout-topbar {
        padding:0 24px
    }
    .profile-filter {
        right:24px!important
    }
    .profile-filter-label {
        display:none
    }
    .main-content {
        padding:30px 24px!important
    }
}
@media(max-width:800px) {
    :root {
        --cashout-sidebar-width:240px
    }
    .cashout-sidebar {
        transform:translateX(-100%);
        visibility:hidden;
        transition:transform .18s ease-out,visibility .18s;
        width:240px!important;
        padding:30px 18px 0!important
    }
    .cashout-sidebar.is-open {
        transform:none;
        visibility:visible
    }
    .cashout-topbar {
        left:0;
        height:68px;
        padding:0 15px;
        gap:8px
    }
    .cashout-menu-toggle {
        display:inline-flex
    }
    .cashout-breadcrumb {
        font-size:13px;
        gap:8px
    }
    .cashout-breadcrumb>span {
        display:none
    }
    .profile-filter {
        top:12px!important;
        right:16px!important;
        padding:3px!important
    }
    .profile-filter .q-btn {
        font-size:12px!important;
        padding:6px 10px!important;
        min-height:36px!important
    }
    .main-content {
        margin-left:0!important;
        margin-top:68px!important;
        width:100%!important;
        padding:30px 24px!important
    }
    .cashout-nav-backdrop:not([hidden]) {
        display:block;
        position:fixed;
        inset:0;
        z-index:59;
        border:0;
        background:#060d09b3;
        cursor:pointer
    }
    .q-dialog__inner {
        padding:12px!important
    }
    .q-dialog__inner>.q-card {
        max-width:calc(100vw - 24px)!important
    }
}
@media(max-width:480px) {
    .main-content {
        padding:28px 18px!important
    }
    .cashout-topbar {
        padding:0 8px;
        gap:3px
    }
    .cashout-breadcrumb {
        font-size:12px;
        max-width:94px;
        line-height:1.3
    }
    .profile-filter {
        right:12px!important
    }
    .profile-filter .q-btn {
        font-size:11px!important;
        padding:6px 8px!important
    }
    .q-dialog__inner>.q-card {
        max-width:calc(100vw - 20px)!important
    }
    .q-dialog__inner {
        padding:10px!important
    }
}
@media(max-width:359px) {
    .cashout-breadcrumb {
        max-width:64px;
        font-size:11px
    }
    .profile-filter .q-btn {
        padding-inline:6px!important
    }
}
@media(prefers-reduced-motion:reduce) {
    .cashout-sidebar,.cashout-sidebar .sidebar-nav a,.q-btn {
        transition:none!important
    }
}
