/* La pagina Prodotti: due card, stessa misura di campi e titoli dappertutto. */
.pr-page { padding: 0 32px 44px; }
.pr-grid { display: grid; grid-template-columns: 320px 1fr; gap: 24px; align-items: start; }
@media (max-width: 990px) { .pr-grid { grid-template-columns: 1fr; } }
.pr-card .card-block { padding: 24px 28px 28px; }

.pr-items { list-style: none; padding: 0; margin: 16px 0 0; }
.pr-items li[data-id] { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 6px; cursor: pointer; }
.pr-items li[data-id]:hover { background: #f5f5f5; }
.pr-items li.active { background: #fde6f2; }
.pr-id { color: #9B9B9B; font-size: 12px; min-width: 30px; }
.pr-name { flex: 1; font-weight: 600; }
.pr-badge { color: #9B9B9B; font-size: 12px; white-space: nowrap; }

.pr-section { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #373a3c;
  margin: 28px 0 14px; padding-bottom: 6px; border-bottom: 1px solid #eee; }
.pr-hint { color: #9B9B9B; font-size: 12px; margin: -6px 0 16px; }

/* .lsForm del pannello e' flex in riga: qui il form va dall'alto in basso. */
#pr-form.lsForm { display: block; }

/* i campi: stessa altezza (52px, come le select del pannello) e stessa etichetta sopra */
.pr-input { width: 100%; height: 52px; border: 1px solid #ddd; border-radius: 8px; padding: 0 16px; font-size: 16px; color: #373a3c; background: #fff; }
.pr-input:focus { outline: none; border-color: #e2007e; }
select.pr-input { appearance: none; -webkit-appearance: none; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23e2007e' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center; padding-right: 40px; }

/* la ricerca delle app: select2 col suo tema, portato alla misura dei campi */
.pr-pick .select2-container .select2-selection--single { height: 52px; border: 1px solid #ddd; border-radius: 8px; }
.pr-pick .select2-container .select2-selection--single .select2-selection__rendered { line-height: 50px; padding-left: 16px; color: #373a3c; font-size: 16px; }
.pr-pick .select2-container .select2-selection__placeholder { color: #9b9b9b; }
.pr-pick .select2-container .select2-selection--single .select2-selection__arrow { height: 50px; right: 10px; }
.pr-pick .select2-dropdown { border-color: #ddd; border-radius: 8px; overflow: hidden; }
.pr-pick .select2-results__option { font-size: 14px; }
.pr-pick .select2-results__option--highlighted { background: #e2007e !important; }
.pr-row, .pr-apps { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
@media (max-width: 700px) { .pr-row, .pr-apps { grid-template-columns: 1fr; } }
.pr-label { display: block; font-size: 14px; color: #9b9b9b; margin: 0 0 6px 8px; }
.pr-field { margin: 0; }

/* limiti 3 x 3: etichetta corta sopra, sempre leggibile */
.pr-limits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px 20px; }
@media (max-width: 700px) { .pr-limits { grid-template-columns: repeat(2, 1fr); } }

/* app selezionate */
.pr-app-sel { list-style: none; margin: 0; padding: 4px; border: 1px solid #ddd; border-radius: 4px; min-height: 44px; max-height: 300px; overflow-y: auto; }
.pr-app-sel li { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 4px; }
.pr-app-sel li:hover { background: #f5f5f5; }
.pr-app-name { flex: 1; }
.pr-app-code { color: #9B9B9B; font-size: 12px; }
.pr-app-del { border: 0; background: none; color: #9B9B9B; padding: 0; line-height: 1; cursor: pointer; }
.pr-app-del:hover { color: #D0021b; }
.pr-app-del .material-icons { font-size: 18px; }
.pr-app-empty { color: #9B9B9B; font-size: 13px; }

.pr-actions { display: flex; justify-content: space-between; margin-top: 28px; }
.pr-actions #pr-save { margin-left: auto; }
.pr-del-uses { margin: 8px 0 0; padding-left: 20px; }
