/* Dashboard and admin layout. Page-specific designs load after this file. */
body.dark-version { background:var(--rf-bg); color:#ccc; }
.dark-version h1,.dark-version h2,.dark-version h3,.dark-version h4,.dark-version h5,.dark-version h6 { color:#eee; }
.dark-version .card { background:#2f2f2f; border-color:#444; }.dark-version .card-header,.dark-version .card-footer { border-color:#414141; }
.dark-version .form-control,.dark-version .form-select { background:#222; border-color:#555; color:#eee; }.dark-version .input-group-text { background:#333; border-color:#555; color:#ddd; }.dark-version .table th,.dark-version .table td { border-color:#444; }
.dark-version .text-dark { color:#eee!important; }.dark-version a:not(.btn):not(.nav-link) { color:#edb47f; }
#top-nav { display:none; }.main-content { min-width:0; position:relative; }.main-content>.container-fluid { padding:24px; }.footer { color:#aaa; font-size:13px; }.footer p { color:inherit; }
.sidenav { position:fixed; inset:16px auto 16px 24px; z-index:100; display:flex; flex-direction:column; flex-wrap:nowrap; align-items:stretch; width:250px; height:calc(100vh - 32px); padding:0; border-radius:16px; background:#2f2f2f; overflow:hidden; }
.sidenav-header { flex-shrink:0; height:76px; width:100%; }.sidenav .navbar-brand { height:76px; padding:20px 35px; justify-content:flex-start!important; white-space:nowrap; overflow:hidden; }.sidenav #brand-logo { width:30px; height:auto; flex-shrink:0; }.sidenav #brand-text { width:140px; max-width:none; height:auto; flex:0 0 140px; transition:opacity .2s; }.sidenav>hr { width:100%; margin:0 0 12px; }
.sidenav .navbar-collapse { display:block!important; flex:1 1 auto; min-height:0; width:100%!important; overflow-y:auto; overflow-x:hidden; scrollbar-width:none; }.sidenav .navbar-collapse::-webkit-scrollbar { display:none; }.sidenav .navbar-nav { width:100%; }.sidenav .nav-link { display:flex; align-items:center; gap:8px; margin:4px 16px; padding:12px 20px; border-radius:8px; overflow:hidden; min-width:0; color:#eee; font-size:14px; }.sidenav .nav-link:hover { background:#3c3c3c; }.sidenav .icon { display:flex; flex-shrink:0; align-items:center; justify-content:center; width:28px; height:28px; }.sidebar-img { width:28px; height:28px; object-fit:contain; }.sidenav .nav-link-text { white-space:nowrap; transition:opacity .2s; }.sidenav-footer { position:static!important; flex-shrink:0; padding:10px 0; }.sidenav.collapsed .nav-link-text,.sidenav.collapsed #brand-text { opacity:0; pointer-events:none; }
@media(min-width:1200px) { .sidenav { width:250px; transition:width .2s; }.sidenav.collapsed { width:100px; }.sidenav+.main-content { margin-left:290px; transition:margin-left .2s; }.sidenav.collapsed+.main-content { margin-left:128px; } }

/* Existing project-specific responsive layout rules. */
.card,
.row > * {
    min-width: 0;
}

.table-responsive {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.table-responsive > .table {
    min-width: 720px;
}

.admin-dashboard {
    width: 100%;
}

.admin-dashboard .table-responsive > .table {
    min-width: 920px;
}

.credits-header {
    flex-wrap: wrap;
    gap: 12px;
    align-items: center !important;
}

.credits-summary {
    flex: 1 1 auto;
    gap: 32px;
    min-width: 0;
}

.credits-actions {
    flex: 0 1 auto;
    flex-wrap: wrap;
    align-items: center !important;
    justify-content: flex-end;
}

.credits-actions form {
    margin: 0;
}

.credits-actions .btn {
    margin-bottom: 0;
    white-space: normal;
}

.payout-notice {
    margin-bottom: 24px;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
}

.payout-notice strong {
    color: #fff;
    font-weight: 700;
}

.api-token-generate-button,
.api-token-copy-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    border: 1px solid #ff8000 !important;
    background-color: #cc6600 !important;
    color: #fff !important;
    text-align: center;
}

.api-token-generate-button:hover,
.api-token-generate-button:active,
.api-token-generate-button:focus,
.api-token-copy-button:hover,
.api-token-copy-button:active,
.api-token-copy-button:focus {
    border-color: #ffbf7f !important;
    background-color: #ff8000 !important;
    color: #fff !important;
}

.api-token-value {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 61px;
    margin-bottom: 1rem;
    text-align: center;
    white-space: pre-wrap;
    word-break: break-all;
}

@media (max-width: 767.98px) {
    .credits-header {
        align-items: stretch !important;
    }

    .credits-summary {
        flex: 1 1 100%;
        flex-wrap: wrap;
        gap: 12px 24px;
    }

    .credits-actions {
        flex: 1 1 100%;
        justify-content: stretch;
    }

    .credits-actions form,
    .credits-actions .btn {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (max-width: 1199.98px) {
    .admin-dashboard .max-width-700 {
        max-width: 100% !important;
    }

    .admin-dashboard .row {
        --rf-gutter-x: 0;
    }
}

@media (max-width: 767.98px) {
    .admin-dashboard .card-header > .d-flex,
    .admin-dashboard .card-header form.d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }

    .admin-dashboard .card-header .ms-auto {
        width: 100%;
        margin-left: 0 !important;
    }

    .admin-dashboard .card-header form.d-flex {
        width: 100%;
    }

    .admin-dashboard .card-header .form-select,
    .admin-dashboard .card-header .btn {
        width: 100%;
    }
}

.dashboard-nav-toggle {
    display: none;
}

.dashboard-nav-backdrop {
    display: none;
}

@media (min-width: 1200px) {
    #sidenav-main.sidenav {
        width: 15.625rem;
        max-width: 15.625rem;
        overflow-x: hidden;
        transition: width 0.3s ease, max-width 0.3s ease !important;
    }

    #sidenav-main.sidenav.collapsed {
        width: 100px;
        max-width: 100px;
    }

    #sidenav-main.sidenav.fixed-start + .main-content {
        margin-left: 17.125rem;
        transition: margin-left 0.3s ease !important;
    }

    #sidenav-main.sidenav.collapsed.fixed-start + .main-content,
    #sidenav-main.sidenav.collapsed.fixed-start:hover + .main-content {
        margin-left: 8rem;
    }
}

@media (max-width: 1199.98px) {
    .dashboard-nav-toggle {
        position: fixed;
        top: 16px;
        left: 16px;
        z-index: 1101;
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 8px;
        background: #2f2f2f;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
    }

    .dashboard-nav-toggle span {
        display: block;
        width: 20px;
        height: 2px;
        margin: 3px 0;
        border-radius: 999px;
        background: #fff;
    }

    .dashboard-nav-open .dashboard-nav-toggle {
        left: min(284px, calc(100vw - 62px));
    }

    .dashboard-nav-open .dashboard-nav-toggle span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .dashboard-nav-open .dashboard-nav-toggle span:nth-child(2) {
        opacity: 0;
    }

    .dashboard-nav-open .dashboard-nav-toggle span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .dashboard-nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1098;
        display: block;
        visibility: hidden;
        background: rgba(0, 0, 0, 0.55);
        opacity: 0;
        transition: opacity 0.2s ease, visibility 0.2s ease;
    }

    .dashboard-nav-open .dashboard-nav-backdrop {
        visibility: visible;
        opacity: 1;
    }

    body.dashboard-nav-open {
        overflow: hidden;
    }

    #sidenav-main.sidenav {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 1099 !important;
        width: min(272px, calc(100vw - 24px)) !important;
        height: 100vh !important;
        max-height: none !important;
        margin: 0 !important;
        border-radius: 0 8px 8px 0 !important;
        transform: translateX(-105%) !important;
        transition: transform 0.22s ease !important;
    }

    #sidenav-main.sidenav.mobile-open {
        transform: translateX(0) !important;
    }

    #sidenav-main.sidenav.collapsed {
        width: min(272px, calc(100vw - 24px)) !important;
    }

    #sidenav-main .navbar-brand {
        justify-content: flex-start !important;
        padding-left: 16px;
    }

    #sidenav-main .nav-link { padding-left:1px; }

    #sidenav-main .nav-link-text,
    #sidenav-main #brand-text {
        opacity: 1 !important;
    }

    #sidenav-main .sidenav-footer {
        padding-bottom: 16px;
    }

    .main-content {
        margin-left: 0 !important;
    }
}
/* Layout classes must not override the dashboard surface or fixed rail. */
body.dark-version { background:var(--rf-bg)!important; }
#sidenav-main.sidenav { margin:0!important; }
@media(max-width:1199.98px) {
    .dark-version .main-content > .container-fluid { padding-top:80px!important; }
}
@media(max-width:991.98px) {
    .card-carousel .carousel,.card-carousel .carousel-inner,.card-carousel .carousel-item { min-height:260px; }
}

/* Keep the balance label and action centred with equal space above and below. */
.rf-dashboard-balance { flex-direction:row; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:16px; }
.rf-dashboard-balance .header-text,.rf-dashboard-balance .btn { margin:0; }

/* Keep marketing copy visible and readable on narrow screens. */
@media (max-width:767.98px) {
    .card-carousel .carousel-item.active { display:flex; align-items:flex-end; min-height:300px; }
    .card-carousel .carousel-item::before {
        content:""; position:absolute; inset:0; pointer-events:none;
        background:linear-gradient(180deg,rgba(0,0,0,.05) 15%,rgba(0,0,0,.82) 100%);
    }
    .card-carousel .carousel-caption {
        position:relative; inset:auto!important; margin:0!important;
        width:100%; padding:24px 36px; z-index:1; overflow-wrap:anywhere;
    }
    .card-carousel .carousel-caption h5 { font-size:18px; line-height:1.35; margin:0 0 10px; }
    .card-carousel .carousel-caption p { font-size:14px; line-height:1.5; margin:0; }
    .card-carousel .carousel-control-prev,.card-carousel .carousel-control-next { width:32px!important; margin:0!important; }
}
