/* お客さまの入口の見た目。MudBlazor の上に、静的なログイン画面と吹き出しのぶんだけ足す */

body { font-family: "Roboto", "Segoe UI", "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI", sans-serif; }

.見出しのリンク { color: inherit; text-decoration: none; }

.ログインの箱 { max-width: 480px; margin-top: 48px; }

.入力 {
    width: 100%;
    font-size: 1.1rem;
    padding: 12px 14px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    box-sizing: border-box;
}
.入力:focus { outline: 2px solid var(--mud-palette-primary); border-color: transparent; }
.コードの入力 { font-size: 1.8rem; letter-spacing: 0.25em; text-align: center; font-variant-numeric: tabular-nums; }

.送るボタン { width: 100%; cursor: pointer; }

.本文 { white-space: pre-wrap; word-break: break-word; }
.お客さまの発言 { background: var(--mud-palette-background-gray); border-left: 4px solid var(--mud-palette-secondary); }
.こちらの発言 { background: var(--mud-palette-surface); border-left: 4px solid var(--mud-palette-primary); border: 1px solid var(--mud-palette-lines-default); border-left-width: 4px; }