/* 必须先于 admin.css 声明层级，否则后加载的 Bootstrap 工具类会压过原工具类。 */
@layer tabler, theme, base, components, utilities;
@import url("./vendor/tabler-1.6.0/tabler.min.css") layer(tabler);
@layer tabler {
  /* Tabler 的工具类使用 important，密度修正在同层限域生效，不影响业务 DOM。 */
  .vben-content > .grid:not(.vben-metric-grid) { gap: 14px !important; }
  .vben-content form.grid,
  .vben-content form .grid { gap: 12px !important; }
  .vben-card > .flex:first-child:has(h2) { margin-bottom: 10px !important; }
  .vben-metric-card > .flex { gap: 12px !important; }
  .vben-metric-card .vben-metric-value { margin-top: 8px !important; }
  .vben-content form label:has(> input[type="checkbox"]) {
    padding: 4px 0 !important;
    border-width: 0 !important;
    background: transparent !important;
  }
  .vben-content input[type="checkbox"], .vben-content input[type="radio"] {
    width: 17px !important;
    height: 17px !important;
  }
  #home-layout-form > .grid:has(input[type="checkbox"]) {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px !important;
  }
  @media (min-width: 1100px) {
    /* Bootstrap 的 gap 工具类带 important，在同层内限域覆盖以对齐既有表单。 */
    #home-layout-form > label:has(> select) { column-gap: 16px !important; }
  }
}

@layer base {
  /* Tabler 的 .grid 默认十二列；现有 DOM 的 .grid 没有这一含义。 */
  .grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    gap: 0;
  }
}