/* Small empty messages (study started 8 October 2026). Loaded by the shop since 8 October 2026, and by compare/small-empty-messages-live.html.
   Every rule starts from .sm-box, the class smallempty-studies.js puts on the shop's own message box once it has redrawn it.
   The words' sizes, the picture and the button come from the empty screens' rules (.es-on in empty-studies.css). */
.sm-box{display:block;max-width:none;border:1px dashed var(--line-strong);border-radius:16px;padding:36px 19px 30px;text-align:center}
.sm-box.sm-words{padding-top:30px}
.sm-box .es-h{font:600 26px/1.2 var(--serif);letter-spacing:-.03em;color:var(--ink);margin:0;overflow-wrap:anywhere}
.sm-box .es-p{max-width:none;margin:8px 0 0;font-size:16px;line-height:1.5;color:var(--muted)}
/* The search: what was typed is part of the line, so the line is a step smaller and the box sits under the field */
.sm-box[data-sm="search"]{margin-top:28px;padding-bottom:32px}
.sm-box[data-sm="search"] .es-h{font-size:22px;line-height:1.25;letter-spacing:-.02em}
.sm-box[data-sm="search"] .es-pic{width:104px;margin-bottom:18px}
@media(max-width:340px){.sm-box .es-h{font-size:24px}.sm-box[data-sm="search"] .es-h{font-size:20px}}

/* ---------- The laptop (round one) ---------- */
.sm-pc .es-p{font-size:17px}
/* One row: the laptop's empty My sheets, wishlist and orders. Small picture, words, the button at the end. */
/* Narrower than 820px there is no room for a row, so the box stays the phone's centred column (as the empty screens do). */
@media(min-width:820px){
.sm-box.sm-pc-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:30px;align-items:center;padding:26px 34px;text-align:left}
.sm-pc-row .es-pic{width:88px;margin:0}
.sm-pc-row .es-p{margin-top:4px}
.sm-pc-row .es-actions{width:300px;max-width:none;margin:0}
.sm-pc-row .es-actions:has(.es-link){margin-bottom:-6px}
.sm-box.sm-pc-row[data-sm="search"]{grid-template-columns:auto minmax(0,1fr);column-gap:24px;margin-top:20px;padding:22px 28px}
.sm-pc-row[data-sm="search"] .es-pic{width:72px;margin:0}
}
/* Centred box: the phone's pick in the middle of the page */
.sm-box.sm-pc-centred{max-width:560px;margin-left:auto;margin-right:auto;padding:40px 32px 34px}
.sm-box.sm-pc-centred[data-sm="search"]{margin-top:20px;padding:30px 28px}