/*
 * Boil Storage Panel — 面板专属布局
 *
 * 按 panel-ui 的消费规范，这个文件刻意不进 @layer panel-ui.*，
 * 这样它天然覆盖库样式，不需要 !important。
 * 颜色 / 间距 / 圆角 / 阴影 / 时长 / 缓动一律只用 var(--pui-*)。
 */

/* ── 登录 ─────────────────────────────────────────────── */
.sp-login {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

.sp-login-box {
  width: 100%;
  max-width: var(--pui-measure);
}

.sp-login-title {
  margin-bottom: var(--pui-space-1);
}

.sp-login-sub {
  margin-bottom: var(--pui-space-5);
}

/* ── 表单栅格 ─────────────────────────────────────────── */
.sp-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--pui-tile-min), 1fr));
  gap: var(--pui-space-4);
  align-items: end;
}

.sp-token-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pui-space-4);
  align-items: end;
}

.sp-grow {
  flex: 1 1 var(--pui-tile-min);
}

.sp-form-actions {
  display: flex;
  gap: var(--pui-space-2);
  align-items: end;
}

/* ── 间距工具 ─────────────────────────────────────────── */
.sp-mb { margin-bottom: var(--pui-space-4); }
.sp-mt { margin-top: var(--pui-space-4); }

/* ── 代码块 ───────────────────────────────────────────── */
.sp-code {
  margin: 0;
  padding: var(--pui-space-3);
  border: var(--pui-border-width) solid var(--pui-color-border-subtle);
  border-radius: var(--pui-radius-sm);
  background: var(--pui-color-bg-accent);
  color: var(--pui-color-text);
  font-family: var(--pui-font-mono);
  font-size: var(--pui-font-size-sm);
  line-height: var(--pui-line-normal);
  white-space: pre-wrap;
  word-break: break-all;
  overflow-x: auto;
}

/* ── 表格内的等宽字段 ─────────────────────────────────── */
.sp-mono {
  font-family: var(--pui-font-mono);
  font-size: var(--pui-font-size-sm);
}

/* 表格操作列按钮不换行 */
.sp-row-actions {
  display: flex;
  gap: var(--pui-space-2);
  justify-content: flex-end;
  white-space: nowrap;
}

/* 弹窗内容较长时允许滚动，避免小屏溢出 */
#overlay-creds .pui-dialog,
#overlay-token .pui-dialog {
  max-height: 85vh;
  overflow-y: auto;
}