/* ============================================================
   Villa Plumbing Field Portal — Lily Studio Doc Output styles
   Build marker: Lily Studio Doc Output May 13

   Styles the live searchable project picker (.lspp-*) that
   Lily Studio uses in place of the legacy plain <select>.
   Also styles the "Open in Customer Doc Workflow" CTA pill
   that surfaces on Lily-routed draft rows.
   ============================================================ */

.lspp-wrap {
  position: relative;
  width: 100%;
}

.lspp-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--tx-md, #4a6b65);
  margin-bottom: 4px;
}

.lspp-input {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--bd-lt, #cfd9d6);
  border-radius: 8px;
  font-size: 13px;
  background: #fff;
  color: var(--tx, #141310);
  box-sizing: border-box;
}

.lspp-input:focus {
  outline: none;
  border-color: #D95A00;
  box-shadow: 0 0 0 2px rgba(29, 122, 110, 0.18);
}

.lspp-list {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  background: #fff;
  border: 1px solid var(--bd-lt, #cfd9d6);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(13, 33, 55, 0.16);
  max-height: 240px;
  overflow-y: auto;
  z-index: 30;
  padding: 4px;
}

.lspp-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: none;
  background: transparent;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  color: var(--tx, #141310);
}

.lspp-row:hover,
.lspp-row:focus {
  background: rgba(29, 122, 110, 0.08);
  outline: none;
}

.lspp-nm {
  font-size: 13px;
  font-weight: 600;
}

.lspp-sub {
  font-size: 11px;
  color: var(--tx-md, #4a6b65);
  margin-top: 2px;
}

.lspp-empty {
  padding: 10px 12px;
  font-size: 12px;
  color: var(--tx-md, #4a6b65);
  font-style: italic;
}

/* "Open in Customer Doc Workflow" pill surfaced on routed
   Lily draft rows. Visually distinct from passive labels so
   the cohesion rule (clickable looks clickable) is upheld. */
.lspp-cdw-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: #D95A00;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  border: none;
}

.lspp-cdw-link:hover {
  background: #0f5e54;
}

/* Banner shown when the Lily action successfully routes
   into CDW — replaces the previous in-memory-only banner. */
.lspp-routed-banner {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  margin: 10px 0;
  background: rgba(29, 122, 110, 0.08);
  border: 1px solid rgba(29, 122, 110, 0.28);
  border-radius: 10px;
  font-size: 12px;
  color: var(--tx, #141310);
}

.lspp-routed-banner b {
  color: #0f5e54;
}
