/* GENERATO — non si modifica a mano.
   Sorgente: v2, frontend/src/assets/tokens.css
   Comando:  python -m pricing.ui.genera
   Solo i CONTROLLI di v2: campo, input, select, casella. In v1 quelle
   classi non esistono, quindi questo foglio non scavalca niente.
   L'impaginazione della scheda resta quella di v1, che funziona. */

/* da frontend/src/assets/tokens.css */
:root {
  --pdt-brand: #0176d3;
  --pdt-brand-dark: #014486;
  --pdt-brand-focus: #1b96ff;
  --pdt-boot-deep: #0f172a;
  --pdt-boot-soft: #1e293b;
  --pdt-text: #080707;
  --pdt-text-weak: #3e3e3c;
  --pdt-text-weakest: #706e6b;
  --pdt-border: #c9c7c5;
  --pdt-border-separator: #e5e5e5;
  --pdt-surface: #ffffff;
  --pdt-surface-alt: #f3f2f2;
  --pdt-error: #ba0517;
  --pdt-warning: #fe9339;
  --pdt-success: #2e844a;

  --pdt-error-bg: #fef1ee;
  --pdt-warning-bg: #fef5e7;
  --pdt-success-bg: #ebf7ee;
  --pdt-brand-bg: #eef4ff;

  --pdt-text-sm: 0.6875rem;
  --pdt-text-md: 0.75rem;
  --pdt-text-lg: 1rem;

  --pdt-weight-normal: 400;
  --pdt-weight-bold: 700;

  --pdt-space-1: 4px;
  --pdt-space-2: 8px;
  --pdt-space-3: 12px;
  --pdt-space-4: 16px;

  --pdt-control-height: 28px;
  --pdt-control-compact: 24px;
  --pdt-radius: 0.25rem;

  --pdt-motion-fast: 100ms;
  --pdt-motion-view: 150ms;
  --pdt-motion-overlay: 180ms;
  --pdt-motion-slow: 300ms;
  --pdt-motion-spin: 700ms;
  --pdt-motion-loop: 1s;
  --pdt-motion-pulse: 1.5s;
  --pdt-motion-shimmer: 1.4s;
  --pdt-motion-attention: 2s;
  --pdt-motion-ease: cubic-bezier(0.2, 0, 0.13, 1);
  --pdt-motion-meter: cubic-bezier(0.4, 0, 0.2, 1);
  --pdt-motion-breathe: ease-in-out;
  --pdt-motion-linear: linear;

  --pdt-spinner-sm: 10px;
  --pdt-spinner-lg: 36px;

  --pdt-shell-sidebar: 220px;
  --pdt-shell-rail: 48px;
  --pdt-shell-topbar: 48px;
  --pdt-list-rail: 400px;
  --pdt-shell-logo: 24px;
  --pdt-avatar: 28px;
  --pdt-avatar-lg: 44px;
  --pdt-menu: 280px;
  --pdt-menu-lg: 320px;
  --pdt-z-flyout: 100;
  --pdt-z-loading: 90;
  --pdt-shadow-overlay: 0 8px 24px rgba(0, 0, 0, 0.18);
  --pdt-shadow-none: 0 8px 24px rgba(0, 0, 0, 0);
  --pdt-shadow-focus: 0 0 3px var(--pdt-brand);
}
.pdt-field {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
}
.panel-field--span1 { grid-column: span 1; }
.panel-field--span2 { grid-column: span 2; }
.panel-field--span3 { grid-column: span 3; }
.panel-field--span4 { grid-column: span 4; }
.panel-field--span5 { grid-column: span 5; }
.panel-field--span6 { grid-column: span 6; }
.panel-field--span7 { grid-column: span 7; }
.panel-field--span8 { grid-column: span 8; }
.panel-field--span9 { grid-column: span 9; }
.panel-field--span10 { grid-column: span 10; }
.panel-field--span11 { grid-column: span 11; }
.panel-field--span12 { grid-column: span 12; }
.pdt-field__label {
  
  font-size: var(--pdt-text-sm);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: var(--pdt-weight-normal);
  color: var(--pdt-text-weak);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pdt-field__control {
  display: flex;
  align-items: center;
  gap: var(--pdt-space-1);
  min-height: var(--pdt-control-height);
  min-width: 0;
}
.pdt-field__hint {
  display: flex;
  align-items: center;
  gap: var(--pdt-space-1);
  font-size: var(--pdt-text-sm);
  color: var(--pdt-text-weakest);
  line-height: var(--pdt-control-height);
  padding-bottom: var(--pdt-space-1);
}
.pdt-field__hint .mdi {
  font-size: var(--pdt-text-sm);
  color: var(--pdt-brand);
}
.pdt-input {
  flex: 1;
  min-width: 0;
  height: var(--pdt-control-height);
  padding: 0 var(--pdt-space-3);
  margin: 0;
  font-family: inherit;
  font-size: var(--pdt-text-md);
  color: var(--pdt-text);
  background: var(--pdt-surface);
  border: 1px solid var(--pdt-border);
  border-radius: var(--pdt-radius);
  box-sizing: border-box;
  transition: border-color var(--pdt-motion-fast) var(--pdt-motion-ease),
    box-shadow var(--pdt-motion-fast) var(--pdt-motion-ease);
}
.pdt-input::placeholder {
  color: var(--pdt-text-weakest);
}
.pdt-input:hover:not(:disabled):not([readonly]):not(:focus) {
  border-color: var(--pdt-text-weakest);
}
.pdt-input:focus {
  outline: none;
  border-color: var(--pdt-brand-focus);
  background: var(--pdt-surface);
  box-shadow: var(--pdt-shadow-focus);
}
.pdt-input[readonly] {
  
  border-color: var(--pdt-border-separator);
  background: var(--pdt-surface-alt);
  cursor: default;
}
.pdt-input--dirty:not(:focus) {
  border-color: var(--pdt-brand);
}
textarea.pdt-input {
  height: auto;
  min-height: calc(var(--pdt-control-height) * 2);
  padding: var(--pdt-space-1) var(--pdt-space-3);
  resize: vertical;
  line-height: 1.5;
}
.pdt-field__action {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--pdt-control-height);
  height: var(--pdt-control-height);
  border: 1px solid transparent;
  border-radius: var(--pdt-radius);
  background: transparent;
  color: var(--pdt-text-weakest);
  cursor: pointer;
  opacity: 0;
  transition: opacity var(--pdt-motion-fast) var(--pdt-motion-ease),
    border-color var(--pdt-motion-fast) var(--pdt-motion-ease);
}
.pdt-field:focus-within .pdt-field__action {
  opacity: 1;
}
.pdt-field__action:hover {
  border-color: var(--pdt-border);
  color: var(--pdt-brand-dark);
}
.pdt-field__action:focus-visible {
  opacity: 1;
  outline: none;
  border-color: var(--pdt-brand-focus);
  box-shadow: var(--pdt-shadow-focus);
}
.pdt-checkbox {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--pdt-brand);
  cursor: pointer;
}

/* ricucitura fra la marcatura di v1 e i controlli di v2 */

.detail-field-value:has(.pdt-input) {
  border-bottom: none;
  padding: 0;
  overflow: visible;
}