/* Account entry pages: login, 2FA, registration, password reset and
   maintenance (templates/entry_base.html). They have no site header: one
   400px column sits in the middle of the screen. Built from the shared ui-*
   parts in style.css (docs/DESIGN.md); only what these pages alone have
   lives here. */

.entry {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 2rem 1rem;
}

.entry-main {
    width: 100%;
    max-width: 400px;
    margin: auto;
}

/* ---------- Logo above the title ---------- */

.entry-brand { margin-bottom: 1.75rem; }
.entry-brand img { display: block; width: auto; height: 36px; }
.entry-brand .ui-cap { margin: 0.4rem 0 0; }

/* ---------- The box and what is inside it ---------- */

.entry-panel { padding: 1.25rem; }
.entry-panel > .ui-text { margin-bottom: 1rem; }

.entry-panel .ui-btn--primary { margin-top: 0.25rem; }

/* "Prisiminti mane" on the left, "Pamiršau slaptažodį" on the right */
.entry-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
}

.entry-quiet {
    font-size: 0.82rem;
    color: var(--muted);
    text-decoration: none;
}

.entry-quiet:hover { color: var(--text-primary); }

/* The line under the box: "Dar neturite paskyros? Registruotis" */
.entry-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1rem;
    font-size: 0.84rem;
    color: var(--muted);
}

.entry-foot .ui-link { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.84rem; }
.entry-foot .material-symbols-outlined { font-size: 1rem; }

/* ---------- 2FA: the code field ---------- */

.entry-code {
    min-height: 48px;
    font-family: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;
    font-size: 1.35rem;
    letter-spacing: 0.4em;
    text-align: center;
}

.entry-code--recovery { font-size: 1.05rem; letter-spacing: 0.15em; }

/* ---------- Registration closed: how to get in ---------- */

.entry-list {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.entry-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: 0.86rem;
    line-height: 1.5;
    color: var(--text-secondary);
}

.entry-list strong { color: var(--text-primary); }
.entry-list .material-symbols-outlined { flex-shrink: 0; margin-top: 1px; font-size: 1.1rem; color: var(--primary-color); }

/* The Telegram link is the contact page's (.contact-tg in info.css) */
.entry .contact-tg { margin: var(--gap) 0 0; }

/* ---------- Maintenance ---------- */

.entry-art {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 1rem;
    border-radius: var(--radius);
}

.entry-body { white-space: pre-wrap; }

/* ---------- Phone: start at the top, where the keyboard leaves room ---------- */

@media (max-width: 640px) {
    .entry { padding: 1.5rem 1rem; }
    .entry-main { margin: 0 auto; }
    .entry-brand { margin-bottom: 1.25rem; }
}