/* =========================================================================
   ServiceHub - Re-Design - Positionen-Toolbar (Detail-Veredelung)
   Block: pte-toolbar2  ·  REIN OPTISCH, additiv, KEINE Funktionsaenderung.

   Geltungsbereich: NUR die Aktionsleiste oberhalb des Positions-Grids
   im Beleg-Editor (Angebot/Auftrag/Rechnung/Lieferschein/Gutschrift):
     .pte-wrap .pte-toolbar  +  ihre Buttons / Trenner / Modus-Pille.
   Die Tabelle selbst (.pte-row/.pte-th/.pte-cell ...) gehoert
   sh-redesign-pte.css - die fasse ich NICHT an.

   Leitbild: das neue Design (sh/app.css .pe-toolbar + .pe-tbtn) -
   warme surf-2-Leiste, pill-artige Ghost-Buttons auf Surface,
   Primaer-Knopf accent, dezente Hover-Anhebung, klare Gruppierung.

   Regeln, die hier eingehalten werden:
     - Genau diese eine Datei. Kein Markup, kein JS.
     - Nichts wird versteckt (kein display:none auf Buttons/Feldern).
     - Nur Farbe/Rahmen/Radius/Schatten/Abstand/Fokus.
     - Eigene Tokens, lokal auf den Editor-Container gescoped, damit das
       Styling von der CSS-Ladereihenfolge unabhaengig ist.
     - Globale Basis (.btn/.badge/.data-table/:root) bleibt unberuehrt.

   Kommentar-Hygiene: in diesem File kommt die Kommentar-Schliess-Sequenz
   bewusst NUR an den echten Kommentar-Enden vor. Token-Namen werden im
   Klartext ohne Sonderzeichen-Paare genannt.
   ========================================================================= */

/* ---------- lokale, warme Tokens (Light) - gescoped auf das Wrap ---------- */
.pte-wrap{
  --sex-accent:#E73D25; --sex-accent-700:#C5331E; --sex-accent-600:#D6371F;
  --sex-accent-soft:#FCEDE7; --sex-accent-line:rgba(231,61,37,.22);
  --sex-honey:#D99A2B; --sex-honey-soft:#FBF0DA;
  --sex-info:#2F6BD6; --sex-info-soft:#EAF1FC;
  --sex-surface:#FFFFFF; --sex-surf-2:#F6F1EB; --sex-surf-3:#EFE8E0;
  --sex-ink:#231C17; --sex-text:#463D35; --sex-text-2:#6B6157; --sex-muted:#9A8F84;
  --sex-border:#EEE5DC; --sex-border-2:#E3D9CE;
  --sex-font-body:'Figtree',system-ui,sans-serif;
  --sex-r-xs:7px; --sex-r-sm:9px; --sex-r-pill:999px;
  --sex-sh-btn:0 1px 2px rgba(120,80,50,.07);
  --sex-sh-hov:0 4px 12px rgba(120,80,50,.12),0 1px 2px rgba(120,80,50,.06);
  --sex-sh-pri:0 4px 12px rgba(231,61,37,.26);
  --sex-tr:.16s cubic-bezier(.2,.7,.3,1);
}
[data-theme="dark"] .pte-wrap{
  --sex-accent:#F2543B; --sex-accent-700:#E0432B; --sex-accent-600:#EC4A30;
  --sex-accent-soft:rgba(242,84,59,.16); --sex-accent-line:rgba(242,84,59,.30);
  --sex-honey:#E6AE4A; --sex-honey-soft:rgba(230,174,74,.16);
  --sex-info:#5C8FE8; --sex-info-soft:rgba(92,143,232,.16);
  --sex-surface:#1E1A16; --sex-surf-2:#241F1A; --sex-surf-3:#2C2620;
  --sex-ink:#F6F1EC; --sex-text:#E2D8CE; --sex-text-2:#B3A99E; --sex-muted:#8C8175;
  --sex-border:#2E2822; --sex-border-2:#3A332B;
  --sex-sh-btn:0 1px 2px rgba(0,0,0,.4);
  --sex-sh-hov:0 4px 12px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.45);
  --sex-sh-pri:0 4px 14px rgba(242,84,59,.32);
}

/* ---------- die Leiste selbst ---------- */
.pte-wrap .pte-toolbar{
  gap:7px;
  padding:9px 12px;
  background:linear-gradient(180deg,
    color-mix(in srgb,var(--sex-surf-2) 70%,var(--sex-surface)) 0%,
    var(--sex-surf-2) 100%);
  border-bottom:1px solid var(--sex-border);
  border-radius:inherit;
  align-items:center;
}
.pte-wrap .pte-toolbar--loading{
  background:var(--sex-surf-2);
}

/* Modus-Pille (z.B. ANGEBOT) - klare, ruhige Akzentkapsel ---------------- */
.pte-wrap .pte-mode-badge{
  background:var(--sex-accent);
  color:#fff;
  padding:4px 12px;
  border-radius:var(--sex-r-pill);
  font-weight:700;
  letter-spacing:.05em;
  box-shadow:var(--sex-sh-pri);
}

/* Trenner zwischen Button-Gruppen - zarter, mittig --------------------- */
.pte-wrap .pte-toolbar-sep{
  width:1px;
  height:20px;
  background:var(--sex-border-2);
  margin:0 3px;
  border-radius:1px;
  flex-shrink:0;
}
.pte-wrap .pte-toolbar-spacer{ background:transparent; }

/* ---------- Pill-Buttons (Basis = Ghost auf Surface) ---------- */
.pte-wrap .pte-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 11px;
  border:1px solid var(--sex-border-2);
  background:var(--sex-surface);
  color:var(--sex-text-2);
  border-radius:var(--sex-r-xs);
  font-family:var(--sex-font-body);
  font-weight:600;
  box-shadow:var(--sex-sh-btn);
  transition:var(--sex-tr);
}
.pte-wrap .pte-btn:hover{
  background:var(--sex-accent-soft);
  border-color:var(--sex-accent);
  color:var(--sex-accent);
  box-shadow:var(--sex-sh-hov);
  transform:translateY(-1px);
}
.pte-wrap .pte-btn:active{
  transform:translateY(0);
  box-shadow:var(--sex-sh-btn);
}
.pte-wrap .pte-btn:focus-visible{
  outline:none;
  border-color:var(--sex-accent);
  box-shadow:0 0 0 3px var(--sex-accent-soft);
}
.pte-wrap .pte-btn--sm{ padding:6px 11px; }

/* Primaer "+ Position" - voller Akzent, gefuellt -------------------- */
.pte-wrap .pte-btn--primary{
  background:var(--sex-accent);
  color:#fff;
  border-color:var(--sex-accent);
  box-shadow:var(--sex-sh-pri);
}
.pte-wrap .pte-btn--primary:hover{
  background:var(--sex-accent-700);
  border-color:var(--sex-accent-700);
  color:#fff;
  box-shadow:var(--sex-sh-pri);
  transform:translateY(-1px);
}

/* Ghost (+ Gruppe / Spalten / Reset / Excel / CSV) = wie Basis ------- */
.pte-wrap .pte-btn--ghost{
  background:var(--sex-surface);
  border-color:var(--sex-border-2);
  color:var(--sex-text-2);
}
.pte-wrap .pte-btn--ghost:hover{
  background:var(--sex-accent-soft);
  border-color:var(--sex-accent);
  color:var(--sex-accent);
}

/* Spezial-Einfuege-Knoepfe - warm getoent, eigener Sinn sichtbar ----- */
.pte-wrap .pte-btn--text{ color:var(--sex-honey); }
.pte-wrap .pte-btn--text:hover{
  background:var(--sex-honey-soft);
  border-color:var(--sex-honey);
  color:var(--sex-honey);
}
.pte-wrap .pte-btn--heading{ color:var(--sex-info); }
.pte-wrap .pte-btn--heading:hover{
  background:var(--sex-info-soft);
  border-color:var(--sex-info);
  color:var(--sex-info);
}
.pte-wrap .pte-btn--sep{ color:var(--sex-text-2); }
.pte-wrap .pte-btn--sep:hover{
  background:var(--sex-surf-3);
  border-color:var(--sex-muted);
  color:var(--sex-ink);
}

/* Icon-Knoepfe in der Leiste bleiben dezent (nur falls vorhanden) ---- */
.pte-wrap .pte-toolbar .pte-btn--icon{
  border-color:transparent;
  background:transparent;
  color:var(--sex-muted);
  box-shadow:none;
}
.pte-wrap .pte-toolbar .pte-btn--icon:hover{
  background:var(--sex-surf-3);
  border-color:var(--sex-border-2);
  color:var(--sex-ink);
  transform:none;
}

/* Loading-Hinweis in der Leiste ------------------------------------- */
.pte-wrap .pte-toolbar--loading .pte-loading-indicator{
  color:var(--sex-muted);
  font-style:italic;
}
