@import '_content/GoodGame.Ui/GoodGame.Ui.4ucaenqvpx.bundle.scp.css';

/* _content/GoodGame.Crm/Components/Layout/MainLayout.razor.rz.scp.css */
/* Layoutstilar ligger globalt i wwwroot/app.css (Good Game-designsystemet). */
/* _content/GoodGame.Crm/Components/Layout/NavMenu.razor.rz.scp.css */
/* Navstilar ligger globalt i wwwroot/app.css (Good Game-designsystemet). */
/* _content/GoodGame.Crm/Components/Pages/Demo.razor.rz.scp.css */
/* Admin-demo: en telefon-ram centrerad på en lugn scen, så det delade spelar-UI:t ser ut som
   i mobilen när du visar/skärminspelar. De delade komponenterna sköter sin egen inre layout. */
.demo-stage[b-mse4qoxjjm] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 24px;
    background: radial-gradient(1200px 600px at 50% -10%, #16281b, #0f1b12);
}

.demo-phone[b-mse4qoxjjm] {
    width: 390px;
    max-width: 100%;
    height: 780px;
    max-height: 86vh;
    background: #0b1410;
    border-radius: 36px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 0 10px rgba(5, 8, 6, .6), 0 0 0 12px #1c2a20;
}

/* De delade vyerna (ScooterList/RentalView) renderar sin egen fullhöjds-layout inuti ramen. */
.demo-phone[b-mse4qoxjjm]  > * {
    height: 100%;
    overflow-y: auto;
}

.demo-hint[b-mse4qoxjjm] {
    color: #7f9a86;
    font: 500 13px/1.4 "Segoe UI", sans-serif;
    letter-spacing: .02em;
}

.demo-receipt[b-mse4qoxjjm] {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 32px;
    text-align: center;
    color: #eaf3ec;
}

.demo-receipt-check[b-mse4qoxjjm] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #277a43;
    color: #fff;
    font-size: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.demo-again[b-mse4qoxjjm] {
    margin-top: 10px;
    background: #38b000;
    color: #04140a;
    border: none;
    border-radius: 10px;
    padding: 12px 20px;
    font-weight: 600;
    cursor: pointer;
}