.money_tip_buttons {
    margin: 1em;
}
.money_tip_buttons .money_tip_buttons_row {
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;

    & .money_tip_button {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;
        border-radius: 2em;
        border: 1px solid #aaa;
        width: 100%;
        max-width: 200px;
        transition: all 0.15s ease;
        cursor: pointer;

        &:hover, &.button_active {
            border: 1px solid #d3b307;
        }
        &.button_active {
            background-color: #fdf9e1;
        }
        &.button_disabled {
            opacity: 0.2;
            cursor: not-allowed;
            pointer-events: none;
        }

        & i {
            font-size: 3em;
            color: var(--coin-color);
        }

        & h2 {
            margin: 0;
            font-size: 2em;
        }
    }
}

.money_tip_dialog .flex_v_center {
    column-gap: 1em;
    margin: 0.5em 1em;

    & p {
        margin-bottom: 0.1em;
    }
}

grid {
    grid-template-columns: 1fr 2fr 1fr;
    gap: 0.5em;
    align-items: center;
    font-size:1em;
}

.money_tip_any {
    width: 40%;
    & .money_tip_input {
        height: 2.4em;
        width: 100%;
    }
}

.money_tip_comment {
    width: 60%;
}

/* 親側の共通スタイル */
.money_tip_sum {
    border-bottom: 1px solid #858585;
    cursor: pointer;
}

.tip_button_short {
    background-color: inherit;
    border: none;
    font-size: 1.2em;
    color: var(--coin-color);
    /* text-shadow: 0 3px 2px #d3d2a4; */
    cursor: pointer;

    &:active {
        text-shadow: none;
    }
}