@import url("../tokens/bauwerk-tokens.css");

/* BauWERK Actions 0.2 — visual reference: PrüfWERK. App-neutral by contract. */
.bw-action-button { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:29px; padding:5px 10px; border:1px solid var(--bw-color-line); border-radius:6px; background:var(--bw-color-surface); color:var(--bw-color-text); font:400 var(--bw-type-meta)/1 var(--bw-font-ui); white-space:nowrap; transition:background var(--bw-motion-fast),border-color var(--bw-motion-fast),color var(--bw-motion-fast); }
.bw-action-button:hover:not(:disabled) { background:var(--bw-color-surface-subtle); border-color:var(--bw-color-line-strong); }.bw-action-button:disabled { opacity:.4; cursor:default; }
.bw-action-button--primary { border-color:var(--bw-color-accent); background:var(--bw-color-accent); color:#fff; }.bw-action-button--primary:hover:not(:disabled) { border-color:var(--bw-color-accent-hover); background:var(--bw-color-accent-hover); color:#fff; }
.bw-action-button--selected { border-color:#b9d3ee; background:var(--bw-color-accent-surface); color:var(--bw-color-accent); }
.bw-action-button--icon { width:33px; min-width:33px; min-height:29px; height:29px; padding:0; border-color:transparent; background:transparent; color:var(--bw-color-text-muted); }.bw-action-button--icon:hover:not(:disabled) { background:var(--bw-color-surface-subtle); border-color:transparent; color:var(--bw-color-text); }.bw-action-button--icon.bw-action-button--selected { border-color:#b9d3ee; background:var(--bw-color-accent-surface); color:var(--bw-color-accent); }
.bw-action-button--mini { min-width:28px; min-height:26px; height:26px; padding:0; border-radius:5px; color:var(--bw-color-text-muted); }.bw-action-button--mini:not(.bw-action-button--icon) { padding:0 8px; }.bw-action-button--primary.bw-action-button--mini { color:#fff; }
.bw-action-button svg { width:var(--bw-icon-size-default,20px); height:var(--bw-icon-size-default,20px); flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:var(--bw-icon-stroke-default,1.75); stroke-linecap:round; stroke-linejoin:round; }.bw-action-button--mini svg { width:var(--bw-icon-size-compact,16px); height:var(--bw-icon-size-compact,16px); stroke-width:var(--bw-icon-stroke-compact,2); }
.bw-action-toolbar { display:flex; align-items:center; gap:3px; min-height:46px; padding:6px 10px; border:1px solid var(--bw-color-line); border-radius:var(--bw-radius-md); background:var(--bw-color-surface); }.bw-action-toolbar__group { display:inline-flex; align-items:center; gap:3px; }.bw-action-toolbar__separator { width:1px; height:24px; margin:0 3px; background:var(--bw-color-line); }.bw-action-toolbar__spacer { flex:1; min-width:6px; }
.bw-action-button[data-bw-tooltip] { position:relative; }.bw-action-button[data-bw-tooltip]::after { position:absolute; z-index:60; left:50%; top:calc(100% + 7px); width:max-content; max-width:220px; padding:5px 8px; border-radius:6px; background:#172331; color:#fff; box-shadow:0 3px 10px rgb(10 18 27 / 22%); content:attr(data-bw-tooltip); font:400 12px/1.35 var(--bw-font-ui); opacity:0; pointer-events:none; transform:translateX(-50%); visibility:hidden; }.bw-action-button[data-bw-tooltip]:hover::after,.bw-action-button[data-bw-tooltip]:focus-visible::after { opacity:1; visibility:visible; }
.bw-action-area { padding:8px 10px; border-bottom:1px solid var(--bw-color-line); background:var(--bw-color-surface-subtle); }
.bw-action-rail { display:flex; flex-direction:column; align-items:center; gap:5px; width:43px; min-width:43px; padding:6px 5px; border-right:1px solid #e1e7eb; background:var(--bw-color-surface); }.bw-action-rail__separator { width:25px; height:1px; margin:4px 0; background:#e1e7eb; }

/* Fingermaß (21.10.2026, BauleitWERK-Fahrplan Phase 2): Der Mausknopf (29 px) ist unter dem Finger zu klein.
   Nur wo mit dem Finger gezeigt wird (pointer:coarse) gilt 44 px; die Hauptaktion am Rand 48 px
   (`bw-action-button--prominent`). Am PC mit Maus bleibt alles beim Alten. */
@media (pointer:coarse) {
  .bw-action-button { min-height:44px; padding-inline:14px; }
  .bw-action-button--icon, .bw-action-button--mini { width:44px; min-width:44px; height:44px; min-height:44px; padding:0; }
  .bw-action-button--prominent { min-height:48px; }
}