/**

 * ViewShield — canonical field styling (viewshield/example/index.html .field-value)

 * Every embedded page must link this file. Host overflow rules prevent watermark clipping.

 */

.viewshield-field,

[data-protected] {

  box-sizing: border-box;

  display: inline-block !important;

  width: fit-content !important;

  max-width: 100%;

  position: relative !important;

  vertical-align: baseline;

  overflow: visible !important;

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;

  font-size: 16.8px !important;

  font-weight: 600 !important;

  font-style: normal !important;

  line-height: 1.6 !important;

  letter-spacing: normal !important;

  text-transform: none !important;

  color: #1e293b !important;

  background: transparent;

}



/* Do not clip the ProSol / date-time watermark under protected values */

.sc-id:has([data-protected]),

.sc-id:has(.viewshield-field),

td:has([data-protected]),

th:has([data-protected]),

.viewshield-host {

  overflow: visible !important;

  text-overflow: clip !important;

}



[data-protected] > canvas.viewshield-v5-overlay,
.viewshield-field > canvas.viewshield-v5-overlay {
  overflow: visible !important;
}

/* Dark UI — set data-viewshield-theme="dark" on <html> (Cloud System default) */
html[data-viewshield-theme="dark"] .viewshield-field,
html[data-viewshield-theme="dark"] [data-protected] {
  color: #e4e7eb !important;
  background: transparent !important;
}

html[data-viewshield-theme="dark"] canvas.viewshield-v5-overlay {
  background: transparent !important;
}

.viewshield-field[data-viewshield-peek],
[data-protected][data-viewshield-peek] {
  cursor: help !important;
  -webkit-user-select: text !important;
  user-select: text !important;
}
