:root {
  --agpr-text: var(--theme-palette-color-3);
  --agpr-accent: var(--theme-palette-color-4);
  --agpr-danger: var(--theme-palette-color-2);
  --agpr-bg: var(--theme-palette-color-5);
  --agpr-card: var(--theme-palette-color-6);
  --agpr-border: var(--theme-palette-color-7);
  --agpr-chip-bg: var(--theme-palette-color-8);
  --agpr-chip-border: var(--theme-palette-color-7);
  --agpr-btn-text: #fff;
  --agpr-ok: var(--theme-palette-color-4);
}

.agpr-form { direction: rtl; max-width: 900px; margin: 20px auto; padding: 20px; background: var(--agpr-card, #fff); border-radius:16px; box-shadow:0 10px 25px rgba(0,0,0,.06); color: var(--agpr-text); }
.agpr-title { margin: 0 0 10px; font-size: 1.5rem; }
.agpr-note { margin: 0 0 20px; opacity:.8; }
.agpr-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:14px; }
.agpr-block { display:block; margin-top:14px; }
.agpr-form label { display:flex; flex-direction:column; gap:6px; font-size:.95rem; }
.agpr-form input[type="text"], .agpr-form input[type="tel"], .agpr-form input[type="number"], .agpr-form input[type="url"], .agpr-form textarea, .agpr-form select {
  padding:10px 12px;
  border:1px solid var(--agpr-danger,#ef4444); /* كل البوردارات حمراء */
  background: var(--agpr-bg,#fff);
  color: var(--agpr-text);
  border-radius:12px;
  outline: none;
}
.agpr-form input:focus, .agpr-form textarea:focus, .agpr-form select:focus {
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--agpr-danger,#ef4444) 25%, transparent);
  border-color: var(--agpr-danger,#ef4444);
}
.agpr-form textarea { resize: vertical; }

/* جميع الأزرار باللون الأحمر */
.agpr-btn {
  margin-top:16px;
  padding:12px 18px;
  border:1px solid var(--agpr-danger,#ef4444);
  border-radius:999px;
  background: var(--agpr-danger,#ef4444);
  color: var(--agpr-btn-text,#fff);
  cursor:pointer;
  font-weight:600;
}
.agpr-btn:hover { filter: brightness(0.95); }
.agpr-btn.agpr-outline { background:transparent; color: var(--agpr-danger,#ef4444); }
.agpr-status { margin-top:12px; min-height:24px; font-size:.95rem; }
.agpr-success { color: #166534; }
.agpr-error { color: #b91c1c; }
.agpr-honeypot { position:absolute; left:-9999px; opacity:0; }

/* Item block */
.agpr-item { border:1px solid var(--agpr-border,#f0f0f0); border-radius:14px; padding:14px; margin-top:16px; background:var(--agpr-bg,#fafafa); }
.agpr-item-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.agpr-item-head h4 { margin:0; font-size:1.05rem; }
.agpr-remove-item { background:rgba(185,28,28,0.06); border:1px solid var(--agpr-danger,#ef4444); color: var(--agpr-danger,#ef4444); border-radius:10px; padding:6px 10px; cursor:pointer; }

.agpr-small-btn { margin-inline-start:8px; padding:6px 10px; border-radius:10px; border:1px solid var(--agpr-danger,#ef4444); background:var(--agpr-danger,#ef4444); color:#fff; cursor:pointer; }

/* Images: tiles UI */
.agpr-images { margin-top:8px; }
.agpr-tiles { display:flex; flex-wrap:wrap; gap:12px; }
.agpr-tile { width:120px; height:120px; border-radius:14px; position:relative; overflow:hidden; }
.agpr-tile.agpr-plus { border:2px dashed var(--agpr-danger,#ef4444); background:color-mix(in oklab, var(--agpr-danger, #ef4444) 6%, transparent); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; cursor:pointer; }
.agpr-plus-icon { font-size:34px; line-height:1; color: var(--agpr-danger,#ef4444); font-weight:700; }
.agpr-plus-text { font-size:.85rem; color: var(--agpr-danger,#ef4444); }
.agpr-tile.agpr-plus:hover { background:color-mix(in oklab, var(--agpr-danger, #ef4444) 12%, transparent); }
.agpr-tile.agpr-plus:focus { outline:2px solid var(--agpr-accent,#111827); outline-offset:3px; }

.agpr-thumb-tile { border:1px solid var(--agpr-danger,#ef4444); background:var(--agpr-card,#fff); display:flex; align-items:center; justify-content:center; }
.agpr-thumb-tile img { max-width:100%; max-height:100%; object-fit:contain; display:block; }
.agpr-remove-thumb { position:absolute; top:6px; inset-inline-end:6px; width:26px; height:26px; border-radius:50%; border:1px solid var(--agpr-danger); background:color-mix(in oklab, var(--agpr-danger,#ef4444) 85%, transparent); color:#fff; cursor:pointer; line-height:1; }

/* Responsive */
@media (max-width: 640px){
  .agpr-grid { grid-template-columns: 1fr; }
  .agpr-tile { width:96px; height:96px; }
  .agpr-plus-icon { font-size:28px; }
}