/*
 * logs-copy.css — Feature "Log-Copy & Freigabe"
 * Siehe docs/logs-copy-and-confirmation.md
 *
 * Gemeinsame Datei fuer index.php UND index-dark.php: Struktur-Regeln gelten
 * fuer beide Themes, Dark-spezifische Farb-Overrides stehen unter
 * [data-theme="dark"] und greifen nur auf der Dark-Variante (html[data-theme="dark"]).
 *
 * Nutzt die bereits vorhandene Variable --day-col (definiert in
 * bootstrap_overwritten.css bzw. dark.css), damit sich alles nahtlos in das
 * bestehende .col-day-Raster einfuegt.
 */

/* Positionierungs-Kontext fuer das "Entwurf"-Badge in der Zellen-Hauptschleife */
div[id^="cell"] {
  position: relative;
}

/* === Favoriten-Joblines: Layout des Such-Dropdown-Eintrags ===
   Siehe docs/ideas-for-improvement.md. Steht bewusst hier (nicht in
   bootstrap_overwritten[-dark].css), da diese Datei als letztes CSS laedt
   (siehe header.php/header_dark.php).
   .freshrow-item-row ist ein von uns selbst gebauter Wrapper (siehe
   freshrow.php/freshrow_dark.php _renderItem) -- bewusst NICHT auf
   jQuery UIs automatisches .ui-menu-item-wrapper-Wrapping verlassen, das
   bei eigenem _renderItem-Markup ohne <a>-Tag nicht zuverlaessig greift
   und ohne Flex dazu fuehrte, dass der Stern (nach dem block-level
   .freshrow-item-label-Div) in eine zweite Zeile rutschte. Als Flex-Row
   gestylt sitzt das Label (flex:1) links, der Stern (letztes Kind im
   Markup) rechts, vertikal mittig zur Zeile. */
.freshrow-item-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.freshrow-item-label-wrap {
  flex: 1 1 auto;
  min-width: 0;
}
.freshrow-item-label {
  min-width: 0;
}
/* Zeigt, warum ein Treffer erscheint, wenn der Suchbegriff nur im
   PM-/Kundennamen steckt (nicht im sichtbaren Label) -- siehe
   _renderItem in freshrow.php/freshrow_dark.php und die pm_name/
   kunde_name-Felder in _inc/joblist.php. */
.freshrow-item-match-reason {
  font-size: 0.85em;
  opacity: 0.7;
}
[data-theme="dark"] .freshrow-item-match-reason {
  opacity: 0.6;
}
/* Falls jQuery UI zusaetzlich einen .ui-menu-item-wrapper um unseren
   .freshrow-item-row legt: ebenfalls Flex, damit kein Block-Layout
   dazwischenfunkt (dark.css definiert dort display:block mit hoeherer
   Selektor-Spezifitaet, siehe dark.css:1672 -- !important noetig). */
.ui-autocomplete .ui-menu-item > .ui-menu-item-wrapper {
  display: flex !important;
  align-items: center;
}

/* === Copy-Buttons: eigene Zeile unterhalb von Datum/"Stunden"-Label ===
   .day-header-row enthaelt nur noch das Datums-Label (+ "Stunden"-Text);
   .day-copy-row ist eine komplett unabhaengige Zeile mit denselben
   Spaltenbreiten (ueber die generischen .col-day/.sum-col-Regeln in
   bootstrap_overwritten.css) -- analog zu .day-release-row weiter unten. */
.day-copy-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.day-copy-row .col-day,
.day-copy-row .sum-col {
  display: flex;
  justify-content: center;
  align-items: center;
}

.day-copy-actions {
  display: flex;
  justify-content: center;
}

.day-copy-btn {
  width: 20px;
  height: 20px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #666;
  cursor: pointer;
  line-height: 0;
  margin:2px;
}

.day-copy-btn:hover {
  border-color: #00cccc;
  color: #00cccc;
  background: #f0fdfd;
}

.day-copy-btn svg {
  width: 11px;
  height: 11px;
}

/* === Freigeben-Buttons: eigene Zeile unterhalb der Tagesstunden/Wochensumme ===
   .day-sum-row enthaelt nur noch die Zahlen (Tagesstunden + #totalsum);
   .day-release-row ist eine komplett unabhaengige Zeile mit denselben
   Spaltenbreiten (ueber die generischen .col-day/.sum-col-Regeln in
   bootstrap_overwritten.css). Dadurch bleibt die Zahlen-Zeile unveraendert,
   auch wenn ein einzelner Freigeben-Button (z.B. "Wochen freigeben") per
   Feature-Flag ausgeblendet wird. */
.day-release-row {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.day-release-row .col-day,
.day-release-row .sum-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2px;
}

.day-release-btn {
  width: 100%;
  max-width: 62px;
  font-size: 10px;
  padding: 1px 2px;
  background: transparent;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #666;
  cursor: pointer;
  line-height: 1.4;
}

.day-release-btn:hover {
  border-color: #00cccc;
  color: #00cccc;
  background: #f0fdfd;
}

/* === "Akzeptieren"-Button fuer einen Problem-Weeks-Fehlalarm (siehe
   docs/problem-weeks-severity-and-acceptance.md) -- gleiche Groesse/Zeile
   wie .day-release-btn, warnfarben statt neutral, da er auf denselben Tag
   verweist wie der orange Ampel-Chip. === */
.day-accept-problem-btn {
  width: 100%;
  max-width: 62px;
  font-size: 10px;
  padding: 1px 2px;
  background: transparent;
  border: 1px solid #fbbc04;
  border-radius: 3px;
  color: #a67c00;
  cursor: pointer;
  line-height: 1.4;
}

.day-accept-problem-btn:hover {
  background: #fbbc04;
  color: #fff;
}

/* === Wochen-Freigeben-Button (Sum-Col der Day-Release-Row) ===
   Eigene Zeile unterhalb der Zahlen (siehe .day-release-row oben) -- nicht
   mehr Geschwister von #totalsum. Optisch etwas betonter als
   .day-release-btn (feste Akzentfarbe statt nur bei Hover), da er auf die
   ganze Woche wirkt. */
.week-release-btn {
  width: 100%;
  max-width: 72px;
  font-size: 10px;
  font-weight: bold;
  padding: 1px 2px;
  background: transparent;
  border: 1px solid #00cccc;
  border-radius: 3px;
  color: #00cccc;
  cursor: pointer;
  line-height: 1.4;
}

.week-release-btn:hover {
  background: #00cccc;
  color: #fff;
}

/* === Entwurf-Badge (noch nicht promoteter Draft, siehe fill_row.php) === */
.badge-draft {
  background-image: url('data:image/svg+xml;utf8,<svg width="16px" height="16px" viewBox="-51.2 -51.2 614.40 614.40" xmlns="http://www.w3.org/2000/svg" fill="%23000000"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><title>ionicons-v5-s</title><path d="M93.72,183.25C49.49,198.05,16,233.1,16,288c0,66,54,112,120,112H320.37" style="fill:none;stroke:%23000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></path><path d="M467.82,377.74C485.24,363.3,496,341.61,496,312c0-59.82-53-85.76-96-88-8.89-89.54-71-144-144-144-26.16,0-48.79,6.93-67.6,18.14" style="fill:none;stroke:%23000000;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></path><line x1="448" y1="448" x2="64" y2="64" style="fill:none;stroke:%23000000;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"></line></g></svg>');
  background-repeat: no-repeat;
	background-position: 0 0;
  width:16px;
  height:16px;
  position: absolute;
  top: 0px;
  right: 6px;
  z-index: 0;
  display: inline-block;
  font-size: 7px;
  font-weight: bold;
  padding: 0px 5px;
  border-radius: 0px;
  cursor: default;

}

/* === Draft-Stundenfeld (noch nicht promoteter Wert, siehe checkhours() in
   index.php/index-dark.php) -- gleicher Amber-Ton wie .badge-draft, damit
   eine Draft-Zelle nicht wie ein bereits an FileMaker uebertragener
   ("greenborder") Eintrag aussieht. === */
.draftborder {
  outline: 2px solid #ffc107;
  outline-offset: -2px;
}
[data-theme="dark"] .draftborder {
  outline: 1px solid #ffc107;
  outline-offset: -1px;
}


/* ==========================================================================
   DARK-THEME OVERRIDES — greifen nur wenn <html data-theme="dark"> gesetzt ist
   ========================================================================== */

[data-theme="dark"] .day-copy-btn,
[data-theme="dark"] .day-release-btn {
  border-color: var(--color-border);
  color: var(--color-text-secondary);
  background-color: var(--color-surface-raised);
}

[data-theme="dark"] .day-copy-btn:hover,
[data-theme="dark"] .day-release-btn:hover {
  border-color: var(--color-accent-border);
  color: var(--color-accent);
  background-color: var(--color-accent-muted);
}

/* Light mode (Nutzerfeedback 2026-09-25, Option B des Artifact-Mockups):
   Akzent-Toenung dauerhaft statt nur beim Hover -- bewusst nicht der
   volle Fond wie bei .week-today-btn/den Pfeilen (dark.css), da hier
   zwei Icons pro Tagesspalte x 7 Spalten sonst zu unruhig wirken.
   .day-release-btn folgt seit 2026-09-25 (Nutzerwunsch) demselben
   Look. */
[data-theme="dark"][data-color-mode="light"] .day-copy-btn,
[data-theme="dark"][data-color-mode="light"] .day-release-btn {
  border-color: var(--color-accent-border);
  color: var(--color-accent);
  background-color: var(--color-accent-muted);
}

[data-theme="dark"][data-color-mode="light"] .day-copy-btn:hover,
[data-theme="dark"][data-color-mode="light"] .day-release-btn:hover {
  border-color: var(--color-accent);
  color: var(--color-accent-hover);
  background-color: rgba(68, 92, 224, 0.2);
}

[data-theme="dark"] .day-accept-problem-btn {
  border-color: rgba(251, 188, 4, 0.4);
  color: var(--color-warning);
  background-color: rgba(251, 188, 4, 0.12);
}

[data-theme="dark"] .day-accept-problem-btn:hover {
  border-color: var(--color-warning);
  background-color: rgba(251, 188, 4, 0.24);
  color: var(--color-warning);
}

[data-theme="dark"] .week-release-btn {
  border-color: var(--color-accent);
  color: var(--color-accent);
  background-color: transparent;
  text-wrap-mode: nowrap;
    min-width: 100px;
}

[data-theme="dark"] .week-release-btn:hover {
  background-color: var(--color-accent);
  color: var(--color-bg);
}

/* Light mode (Nutzerfeedback 2026-09-25): derselbe Look wie .day-copy-btn/
   .day-release-btn oben, statt des zuvor transparenten Ruhezustands und
   des vollen Akzent-Fonds beim Hover. */
[data-theme="dark"][data-color-mode="light"] .week-release-btn {
  border-color: var(--color-accent-border);
  color: var(--color-accent);
  background-color: var(--color-accent-muted);
}

[data-theme="dark"][data-color-mode="light"] .week-release-btn:hover {
  border-color: var(--color-accent);
  color: var(--color-accent-hover);
  background-color: rgba(68, 92, 224, 0.2);
}

[data-theme="dark"] .badge-draft {
  filter: invert(1);
}

/* Light-Farbmodus (Nutzerfeedback 2026-09-15): die Basisregel oben ist an
   [data-theme="dark"] gebunden, das im Light-Modus weiterhin gesetzt bleibt
   (siehe dark.css-Kommentar zu data-color-mode) -- filter:invert(1) macht
   also aus dem urspruenglich schwarzen Icon (fill="%23000000" oben) weiterhin
   Weiss, unsichtbar auf hellem Grund. Filter zuruecksetzen und stattdessen
   dieselbe SVG mit grauem statt schwarzem fill/stroke (%235b6178, entspricht
   --color-text-secondary; Custom Properties werden in Daten-URIs nicht
   aufgeloest, daher als Literal). */
[data-theme="dark"][data-color-mode="light"] .badge-draft {
  filter: none;
  background-image: url('data:image/svg+xml;utf8,<svg width="16px" height="16px" viewBox="-51.2 -51.2 614.40 614.40" xmlns="http://www.w3.org/2000/svg" fill="%235b6178"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><title>ionicons-v5-s</title><path d="M93.72,183.25C49.49,198.05,16,233.1,16,288c0,66,54,112,120,112H320.37" style="fill:none;stroke:%235b6178;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></path><path d="M467.82,377.74C485.24,363.3,496,341.61,496,312c0-59.82-53-85.76-96-88-8.89-89.54-71-144-144-144-26.16,0-48.79,6.93-67.6,18.14" style="fill:none;stroke:%235b6178;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px"></path><line x1="448" y1="448" x2="64" y2="64" style="fill:none;stroke:%235b6178;stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"></line></g></svg>');
}

[data-theme="dark"] .col-day input.draftborder {
  border-color: rgba(251, 188, 4,0.4) !important;
  background-color: rgba(251, 188, 4, 0.12) !important;
}

/* === Mobile: Copy-/Freigeben-Buttons folgen dem bestehenden .col-day-Verhalten === */
@media (max-width: 992px) {
  .day-copy-btn,
  .day-release-btn,
  .day-accept-problem-btn {
    width: 22px;
    height: 22px;
  }
}