/*  Copyright (C) Bitstem GmbH
 *  All rights reserved.
 *
 *  This source code is proprietary and confidential.
 *  Unauthorized copying, distribution, or disclosure of this file,
 *  in whole or in part, is strictly prohibited unless explicitly
 *  permitted in writing by Bitstem GmbH.
 *
 *  Author: Klaus Kuehnhammer <klaus@bitstem.com>
 */

/*
 * Helper-Klassen für Padding & Margin
 *
 * Skala: 0–6 → 0, var(--space-1)…var(--space-6)
 *
 * Padding:  p-*   px-*  py-*  pt-*  pr-*  pb-*  pl-*
 * Margin:   m-*   mx-*  my-*  mt-*  mr-*  mb-*  ml-*
 *
 * Zusätzlich: m-auto, mx-auto, my-auto, mt-auto, mr-auto, mb-auto, ml-auto
 *
 * Logische Eigenschaften (block/inline) werden intern verwendet,
 * die Klassennamen folgen der gewohnten Tailwind/Bootstrap-Konvention.
 */

@layer utilities {
  /* ===== Padding – alle Seiten ===== */
  .p-0 { padding: 0; }
  .p-1 { padding: var(--space-1); }
  .p-2 { padding: var(--space-2); }
  .p-3 { padding: var(--space-3); }
  .p-4 { padding: var(--space-4); }
  .p-5 { padding: var(--space-5); }
  .p-6 { padding: var(--space-6); }

  /* ===== Padding – horizontal (inline) ===== */
  .px-0 { padding-inline: 0; }
  .px-1 { padding-inline: var(--space-1); }
  .px-2 { padding-inline: var(--space-2); }
  .px-3 { padding-inline: var(--space-3); }
  .px-4 { padding-inline: var(--space-4); }
  .px-5 { padding-inline: var(--space-5); }
  .px-6 { padding-inline: var(--space-6); }

  /* ===== Padding – vertikal (block) ===== */
  .py-0 { padding-block: 0; }
  .py-1 { padding-block: var(--space-1); }
  .py-2 { padding-block: var(--space-2); }
  .py-3 { padding-block: var(--space-3); }
  .py-4 { padding-block: var(--space-4); }
  .py-5 { padding-block: var(--space-5); }
  .py-6 { padding-block: var(--space-6); }

  /* ===== Padding – oben (block-start) ===== */
  .pt-0 { padding-block-start: 0; }
  .pt-1 { padding-block-start: var(--space-1); }
  .pt-2 { padding-block-start: var(--space-2); }
  .pt-3 { padding-block-start: var(--space-3); }
  .pt-4 { padding-block-start: var(--space-4); }
  .pt-5 { padding-block-start: var(--space-5); }
  .pt-6 { padding-block-start: var(--space-6); }

  /* ===== Padding – rechts (inline-end) ===== */
  .pr-0 { padding-inline-end: 0; }
  .pr-1 { padding-inline-end: var(--space-1); }
  .pr-2 { padding-inline-end: var(--space-2); }
  .pr-3 { padding-inline-end: var(--space-3); }
  .pr-4 { padding-inline-end: var(--space-4); }
  .pr-5 { padding-inline-end: var(--space-5); }
  .pr-6 { padding-inline-end: var(--space-6); }

  /* ===== Padding – unten (block-end) ===== */
  .pb-0 { padding-block-end: 0; }
  .pb-1 { padding-block-end: var(--space-1); }
  .pb-2 { padding-block-end: var(--space-2); }
  .pb-3 { padding-block-end: var(--space-3); }
  .pb-4 { padding-block-end: var(--space-4); }
  .pb-5 { padding-block-end: var(--space-5); }
  .pb-6 { padding-block-end: var(--space-6); }

  /* ===== Padding – links (inline-start) ===== */
  .pl-0 { padding-inline-start: 0; }
  .pl-1 { padding-inline-start: var(--space-1); }
  .pl-2 { padding-inline-start: var(--space-2); }
  .pl-3 { padding-inline-start: var(--space-3); }
  .pl-4 { padding-inline-start: var(--space-4); }
  .pl-5 { padding-inline-start: var(--space-5); }
  .pl-6 { padding-inline-start: var(--space-6); }

  /* ===== Margin – alle Seiten ===== */
  .m-0 { margin: 0; }
  .m-1 { margin: var(--space-1); }
  .m-2 { margin: var(--space-2); }
  .m-3 { margin: var(--space-3); }
  .m-4 { margin: var(--space-4); }
  .m-5 { margin: var(--space-5); }
  .m-6 { margin: var(--space-6); }
  .m-auto { margin: auto; }

  /* ===== Margin – horizontal (inline) ===== */
  .mx-0 { margin-inline: 0; }
  .mx-1 { margin-inline: var(--space-1); }
  .mx-2 { margin-inline: var(--space-2); }
  .mx-3 { margin-inline: var(--space-3); }
  .mx-4 { margin-inline: var(--space-4); }
  .mx-5 { margin-inline: var(--space-5); }
  .mx-6 { margin-inline: var(--space-6); }
  .mx-auto { margin-inline: auto; }

  /* ===== Margin – vertikal (block) ===== */
  .my-0 { margin-block: 0; }
  .my-1 { margin-block: var(--space-1); }
  .my-2 { margin-block: var(--space-2); }
  .my-3 { margin-block: var(--space-3); }
  .my-4 { margin-block: var(--space-4); }
  .my-5 { margin-block: var(--space-5); }
  .my-6 { margin-block: var(--space-6); }
  .my-auto { margin-block: auto; }

  /* ===== Margin – oben (block-start) ===== */
  .mt-0 { margin-block-start: 0; }
  .mt-1 { margin-block-start: var(--space-1); }
  .mt-2 { margin-block-start: var(--space-2); }
  .mt-3 { margin-block-start: var(--space-3); }
  .mt-4 { margin-block-start: var(--space-4); }
  .mt-5 { margin-block-start: var(--space-5); }
  .mt-6 { margin-block-start: var(--space-6); }
  .mt-auto { margin-block-start: auto; }

  /* ===== Margin – rechts (inline-end) ===== */
  .mr-0 { margin-inline-end: 0; }
  .mr-1 { margin-inline-end: var(--space-1); }
  .mr-2 { margin-inline-end: var(--space-2); }
  .mr-3 { margin-inline-end: var(--space-3); }
  .mr-4 { margin-inline-end: var(--space-4); }
  .mr-5 { margin-inline-end: var(--space-5); }
  .mr-6 { margin-inline-end: var(--space-6); }
  .mr-auto { margin-inline-end: auto; }

  /* ===== Margin – unten (block-end) ===== */
  .mb-0 { margin-block-end: 0; }
  .mb-1 { margin-block-end: var(--space-1); }
  .mb-2 { margin-block-end: var(--space-2); }
  .mb-3 { margin-block-end: var(--space-3); }
  .mb-4 { margin-block-end: var(--space-4); }
  .mb-5 { margin-block-end: var(--space-5); }
  .mb-6 { margin-block-end: var(--space-6); }
  .mb-auto { margin-block-end: auto; }

  /* ===== Margin – links (inline-start) ===== */
  .ml-0 { margin-inline-start: 0; }
  .ml-1 { margin-inline-start: var(--space-1); }
  .ml-2 { margin-inline-start: var(--space-2); }
  .ml-3 { margin-inline-start: var(--space-3); }
  .ml-4 { margin-inline-start: var(--space-4); }
  .ml-5 { margin-inline-start: var(--space-5); }
  .ml-6 { margin-inline-start: var(--space-6); }
  .ml-auto { margin-inline-start: auto; }
}