/* The admin app's own blocks, which the design system has no component for. Role tokens only, like components.css. */

body { margin: 0; background: var(--background-app); }

/* ---------- Sign-in ---------- */
.admin-sign-in { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: var(--space-2xl) var(--space-md); }
.admin-sign-in__panel { width: 100%; max-width: 24rem; display: flex; flex-direction: column; gap: var(--space-lg); }
.admin-sign-in__brand { display: flex; align-items: center; gap: var(--space-xs); padding: 0 var(--space-2xs); }
.admin-sign-in__mark { width: 1.75rem; height: 1.75rem; flex: none; background: var(--background-brand-mark); color: var(--ink-on-dark); display: flex; align-items: center; justify-content: center; font-family: var(--font-mark); font-size: 1rem; }
.admin-sign-in__brand-text { display: flex; flex-direction: column; line-height: 1.2; }
.admin-sign-in__brand-name { font-size: .875rem; font-weight: 600; }
.admin-sign-in__brand-area { font-size: .75rem; color: var(--ink-hint); }
.admin-sign-in__error { margin: 0; color: var(--ink-danger); font-weight: 600; }


/* ---------- Alert ---------- */
/* an error that belongs to no field, such as a failed sign-out */
.admin-alert { margin: 0; color: var(--ink-danger); font-weight: 600; }


/* ---------- List panel ---------- */
/* the filter row and the messages of a list card (SelectableList), which the design system shows without a block */
.admin-list-panel__filters { padding: var(--space-sm); border-bottom: 1px solid var(--border-divider); }
.admin-list-panel__message { margin: 0; padding: var(--space-md); color: var(--ink-hint); }


/* ---------- Reorder ---------- */
/* sorting by hand (Reorder.kt): the handle like the CastEditor's, the drop target marked while dragging */
.admin-reorder__item { display: flex; align-items: center; position: relative; }
.admin-reorder__item[data-dragging="true"] { opacity: .5; }
.admin-reorder__item[data-over="true"]::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: var(--marker-selected); z-index: 2; }
.admin-reorder__handle { width: 1.75rem; height: var(--icon-button-size); flex: none; border: 0; background: transparent; font: inherit; color: var(--ink-drag-handle); cursor: grab; user-select: none; padding: 0; }
.admin-reorder__handle--on-image { position: absolute; top: var(--space-2xs); left: var(--space-2xs); width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--background-card); z-index: 1; }
.admin-image-uploader__image[data-over="true"] { box-shadow: inset 0 0 0 2px var(--marker-selected); }
.admin-image-uploader__image[data-dragging="true"] { opacity: .5; }
.admin-image-uploader__image[aria-busy="true"] .admin-image-uploader__img { opacity: .6; }
.admin-selectable-list__item.admin-reorder__item .admin-selectable-list__row { flex: 1; min-width: 0; padding-left: var(--space-2xs); }


/* ---------- Markdown preview ---------- */
/* the preview of AdminMarkdownField, in place of the text area */
.admin-markdown { min-height: 12rem; padding: var(--space-xs) var(--space-sm); border: 1px solid var(--border-input); border-radius: var(--radius-control); background: var(--background-input); line-height: 1.5; overflow-wrap: anywhere; }
.admin-markdown > :first-child { margin-top: 0; }
.admin-markdown > :last-child { margin-bottom: 0; }
.admin-markdown p, .admin-markdown ul, .admin-markdown ol { margin: 0 0 var(--space-xs); }
.admin-markdown h1, .admin-markdown h2, .admin-markdown h3 { margin: var(--space-sm) 0 var(--space-xs); font-size: 1rem; }
.admin-markdown a { color: var(--ink-link); }


/* ---------- Dialog ---------- */
/* a question in the page (AdminConfirmDialog), as a modal <dialog> */
.admin-dialog { max-width: min(28rem, calc(100vw - 2 * var(--space-md))); padding: var(--space-lg); border: 1px solid var(--border-card); border-radius: var(--radius-card); background: var(--background-card); color: var(--ink-default); }
.admin-dialog::backdrop { background: rgb(0 0 0 / .35); }
.admin-dialog__title { margin: 0 0 var(--space-xs); font-size: 1rem; font-weight: 650; }
.admin-dialog__message { margin: 0 0 var(--space-lg); line-height: 1.5; }
.admin-dialog__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-xs); }


/* ---------- Fieldset ---------- */
/* groups an editor's fields so they can be disabled together while saving; lays them out like admin-card__body */
.admin-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; display: flex; flex-direction: column; gap: var(--space-md); }