/* "Más" (/more), measured on Fresha's phone web: grey page, 20px gutters, the wallet card
   (radius 12, padding 24, a lavender-to-pink gradient), 2-column tiles 88px tall (radius 20,
   1px ring, label 17/24 500), then cards with 48px rows (icon, label, chevron). */
.more-page { background: var(--db-f5f5f5, rgb(245, 245, 245)); }
.mo { max-width: 560px; margin: 0 auto; padding: 32px 20px 120px; display: flex; flex-direction: column; gap: 24px; font-family: var(--font); color: var(--ink); }
.mo-wallet { min-height: 166px; box-sizing: border-box; padding: 24px; border-radius: 12px; color: #fff; display: flex; flex-direction: column; align-items: flex-start;
  background: radial-gradient(120% 140% at 100% 0%, rgb(240, 120, 240) 0%, rgba(240, 120, 240, 0) 55%), linear-gradient(110deg, rgb(105, 80, 243) 0%, rgb(105, 80, 243) 45%, rgb(150, 110, 255) 100%); }
.mo-wallet p { margin: 0; font: 400 15px/20px var(--font); }
.mo-wallet b { margin: 8px 0 24px; font: 700 32px/40px var(--font); }
.mo-wbtn { height: 40px; padding: 0 16px; border: 1px solid var(--de-ffffff, #fff); border-radius: 999px; background: none; color: #fff; font: 500 15px/20px var(--font); cursor: pointer; }
.mo-wbtn:hover { background: rgba(255, 255, 255, .12); }
.mo-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mo-tile { min-height: 88px; padding: 16px; border-radius: 20px; background: var(--db-ffffff, #fff); box-shadow: 0 0 0 1px rgba(19, 19, 19, .1); display: flex; flex-direction: column; justify-content: space-between; gap: 8px; color: var(--ink); text-decoration: none; }
.mo-tile:hover { background: var(--db-fafafa-h, rgb(250, 250, 250)); }
.mo-tile svg { width: 24px; height: 24px; }
.mo-tile b { font: 500 17px/24px var(--font); }
.mo-card { padding: 8px; border-radius: 20px; background: var(--db-ffffff, #fff); box-shadow: 0 0 0 1px rgba(19, 19, 19, .1); display: flex; flex-direction: column; }
.mo-row { min-height: 48px; padding: 12px; border: 0; border-radius: 15px; background: none; display: flex; align-items: center; gap: 16px; cursor: pointer; text-align: left; color: var(--ink); }
.mo-row:hover { background: var(--db-f7f7f7-h, rgb(247, 247, 247)); }
.mo-row svg { width: 24px; height: 24px; flex: none; }
.mo-row b { flex: 1; font: 500 17px/24px var(--font); }
.mo-flag { width: 24px; text-align: center; font-size: 18px; }
.mo { padding-top: 24px; }
.mo-tile b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -0.2px; }
/* Fresha's /more top bar on phones: the search on the left, messages, bell and account on the right. */
@media (max-width: 767px) {
  .more-app .topbar .brand { display: none; }
  .more-app .topbar .topbar-actions { flex: 1; }
  .more-app .topbar #search-btn { display: flex !important; margin-right: auto; }
  .more-app .topbar .icon-btn[aria-label="Mensajes"] { display: flex !important; }
}
@media (max-width: 767px) {
  .more-app .topbar .icon-btn[aria-label="Mensajes"] { order: 1; }
  .more-app .topbar .icon-btn[aria-label="Notificaciones"] { order: 2; }
  .more-app .topbar #account-btn { order: 3; }
}