/**
 * idf-app-footer — App-Footer für apps-v2
 *
 * Markup: `_shared/blocks/app-footer/idf-app-footer.php`
 * Voraussetzung: `_shared/tokens/design-tokens/idf-tokens.css` ist vorher geladen.
 *
 * Schlanker Footer mit optionalem Shortcuts-Block und einer Meta-Zeile
 * (Modul-Name, Version, zuletzt-gespeichert-Zeit).
 */

.idf-app-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4, 16px);
  padding: var(--space-3, 12px) var(--space-8, 32px);
  background: var(--white, #fff);
  border-top: 1px solid var(--line, #e5e5e5);
  font-size: var(--font-md, 0.875rem);
  color: var(--mid, #555);
}

.idf-app-footer-shortcuts {
  /* Tastatur-Shortcuts: kompakt, einzeilig. */
  border-top: 1px solid var(--line, #e5e5e5);
  border-bottom: 0;
}

.idf-app-footer-meta {
  /* Meta-Zeile (immer da). */
  font-size: var(--font-sm, 0.8125rem);
}

.idf-app-footer-meta-attached {
  /* Wenn ein Shortcut-Block davor steht: Border zwischen beiden Footer-
     Bereichen weg, sonst gibt's eine doppelte Linie. */
  border-top: 0;
}

.idf-app-footer-saved {
  margin-left: var(--space-2, 8px);
  color: var(--confirm, #0c998e);
}

.idf-app-footer-fc {
  /* Reserviert für weitere Footer-Indikatoren in einzelnen Modulen. */
  color: var(--mid, #555);
}

@media (max-width: 720px) {
  .idf-app-footer {
    padding: var(--space-3, 12px) var(--space-4, 16px);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2, 8px);
  }
}