/* Native allauth markup, using the client tokens of the restaurant's skin (data-veste on
   <html>, as the shell): ink for buttons and links, as the app. Fallbacks keep recovery
   usable even without a client build. No remote fonts, inline styling or motion. */
.account-page { margin: 0; color: var(--color-text, #1b1c1e); background: var(--color-bg, #f4f4f1);
  font: 1rem/1.5 var(--font-sans, system-ui, sans-serif); }
.account-page *, .account-page *::before, .account-page *::after { box-sizing: border-box; }
.account-page :focus-visible { outline: 3px solid var(--color-focus, #2c4a6e); outline-offset: 3px; }
.account-layout { max-width: 58rem; padding: 2rem 1rem 4rem; margin: auto; }
.account-header { margin-bottom: 1.5rem; }
.account-brand { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: .75rem;
  font-weight: 650; text-decoration: none; color: inherit; min-height: 44px; }
.account-brand span { font-size: .875rem; font-weight: 400; color: var(--color-text-muted, #55585e); }
.account-header nav { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }
.account-header nav a { display: inline-flex; align-items: center; min-height: 44px; }
.account-header form { margin: 0; }
.account-card { padding: clamp(1.25rem, 4vw, 2.5rem); border: 1px solid var(--color-border, #dcdcd6);
  border-radius: var(--radius-l, 1rem); background: var(--color-surface, white); box-shadow: var(--shadow-1, 0 1px 2px #14161a0f);
  overflow-wrap: anywhere; }
.account-page h1 { font-size: 1.75rem; line-height: 1.25; margin: 0 0 1.5rem; }
.account-page h2 { font-size: 1.375rem; margin: 1.5rem 0 .75rem; }
.account-page p { margin: .75rem 0; }
.account-page a { color: var(--color-text, #2c4a6e); text-underline-offset: .2em; }
.account-card a { display: inline-flex; align-items: center; min-height: 44px; }
.account-page label { display: block; font-weight: 550; margin: 1rem 0 .375rem; }
.account-page input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
.account-page textarea, .account-page select { display: block; width: 100%; min-height: 44px;
  font: inherit; color: inherit; padding: .625rem .75rem; background: var(--color-surface, white);
  border: 1px solid var(--color-border-strong, #8a8b85); border-radius: var(--radius-s, .375rem); }
.account-page input[type=checkbox], .account-page input[type=radio] { width: 1.25rem; height: 1.25rem; vertical-align: middle; }
.account-page input[type=checkbox] + label, .account-page input[type=radio] + label { display: inline-block; padding: .625rem .25rem; margin: 0; }
.account-page button { min-height: 44px; padding: .625rem 1rem; margin: .5rem .5rem .5rem 0; cursor: pointer;
  font: inherit; font-weight: 600; color: var(--color-bg, white); background: var(--color-text, #2c4a6e);
  border: 1px solid transparent; border-radius: var(--radius-pill, .625rem); }
.account-page button:hover { filter: brightness(0.9); }
.account-page button:disabled { opacity: .55; cursor: not-allowed; }
.account-page ul, .account-page ol { padding-left: 1.5rem; }
.account-page hr { border: 0; border-top: 1px solid var(--color-border, #dcdcd6); margin: 1.5rem 0; }
.account-page .errorlist { color: var(--color-danger, #a1271c); list-style: disc; }
.account-messages { padding: 1rem 1rem 1rem .5rem; margin-bottom: 1rem; background: var(--color-raised, #e6ecf4); border-radius: var(--radius-s, .625rem); }
.account-messages ul { margin: 0; }
.account-page form p > span { display: block; color: var(--color-text-muted, #55585e); font-size: .875rem; }
.account-page table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.account-page th, .account-page td { text-align: left; padding: .75rem; border-bottom: 1px solid var(--color-border, #dcdcd6); }
.account-page svg { max-width: 100%; height: auto; }
.account-page pre { white-space: pre-wrap; }
.account-skip { position: absolute; top: .5rem; left: .5rem; transform: translateY(-200%); padding: .75rem; background: var(--color-bg, white); }
.account-skip:focus { transform: none; }

/* Account pages in Calma: the same linen, title face and spacing as Card sezione. */
.account-page { background: var(--color-bg, #faf9f7); }
.account-layout { max-width: 46rem; padding-top: 1rem; }
.account-card { padding: 0; border: 0; background: transparent; box-shadow: none; }
.account-header { margin-bottom: 1.25rem; }
.account-header nav a { padding: .25rem .875rem; border-radius: var(--radius-pill, 2rem); background: var(--color-raised, #f0efeb); text-decoration: none; }
.account-header .account-back { gap: .5rem; }
.account-header .account-back svg { flex: none; }
.account-form-card { padding: 1.5rem 1rem; border-radius: var(--radius-floor, 1.5rem); background: var(--color-raised, #f0efeb); }
.account-form-card > a + a { margin-inline-start: .75rem; }
/* The authenticator QR is black on transparent, so it needs a light ground in both themes. */
.account-form-card img[src^="data:image/svg+xml"] { max-width: 100%; background: #fff; border-radius: var(--radius-s, .375rem); }
.account-page h1 { font: 400 clamp(2rem, 7vw, 2.75rem)/1.05 var(--font-display, Georgia, serif); margin-bottom: .75rem; }
.account-page .account-intro { color: var(--color-text-muted, #55585e); margin: 0 0 1.5rem; }
.account-section { padding: 1.5rem 1rem 1rem; margin-block: 1rem; border-radius: var(--radius-floor, 1.5rem); background: var(--color-raised, #f0efeb); }
.account-section h2 { margin: 0 0 .75rem; font: 400 1.5rem/1.15 var(--font-display, Georgia, serif); }
.account-section p { font-size: .9375rem; }
.account-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.account-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--color-border-strong, #8a8b85); border-radius: var(--radius-pill, 2rem); text-decoration: none; font-size: .875rem; }
.account-page .account-sessions { list-style: none; padding: 0; margin: 0; }
.account-sessions li { padding: 1rem 0; border-top: 1px solid var(--color-border-strong, #8a8b85); }
.account-sessions li:first-child { border: 0; padding-top: 0; }
.account-sessions li:last-child { padding-bottom: 0; }
.account-sessions h3 { margin: 0; font-size: 1rem; }
.account-sessions .account-device { color: var(--color-text-muted, #55585e); }
.account-sessions dl { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: .5rem 1rem; font-size: .875rem; }
.account-sessions dt { color: var(--color-text-muted, #55585e); }
.account-sessions dd { margin: 0; }

/* Fields of the forms (templates/allauth/elements/fields.html): label without colon, the
   help as a small hint, fields of a readable width on the computer. */
.account-field { margin: 1rem 0; }
.account-field > label { margin-top: 0; }
.account-page .account-field input:not([type=hidden]):not([type=checkbox]):not([type=radio]) { max-width: 28rem; }
.account-field > .helptext { margin-top: .375rem; color: var(--color-text-muted, #55585e); font-size: .8125rem; line-height: 1.45; }
.account-field > .helptext ul { margin: 0; padding-left: 1.125rem; }
.account-check { display: flex; align-items: center; gap: .25rem; }