/* WooPlay Admin — refined UI */
.wooplay-admin { --bg:#0f0f10; --panel:#161617; --muted:#a9a9b3; --text:#e6e6e7; --accent:#10a37f; --border: #2a2a2b; }
.wooplay-admin .wrap h1 { color: var(--text); letter-spacing:.2px; }
.wooplay-admin .wooplay-settings-grid { display:grid; grid-template-columns: 1.4fr .9fr; gap:24px; align-items:start; }
@media (max-width: 1200px){ .wooplay-admin .wooplay-settings-grid{ grid-template-columns: 1fr; } }

/* Card */
.wooplay-admin .wooplay-settings-left, .wooplay-admin .wooplay-settings-right {
  background: var(--panel);
  border:1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.02) inset, 0 10px 30px rgba(0,0,0,0.25);
}

/* Form layout */
.wooplay-admin .form-table { width:100%; color:var(--text); border-collapse:separate; border-spacing:0 14px; }
.wooplay-admin .form-table th { width: 280px; color: var(--muted); font-weight: 600; text-transform: none; padding: 10px 12px 10px 0; vertical-align: top; }
.wooplay-admin .form-table td { padding: 10px 0; }
.wooplay-admin .form-table input[type="text"],
.wooplay-admin .form-table input[type="number"],
.wooplay-admin .form-table .wp-color-picker,
.wooplay-admin .form-table select,
.wooplay-admin .form-table textarea {
  width: clamp(240px, 60%, 480px);
  background: #0f0f10;
  border:1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  padding: 10px 12px;
  outline:none;
  box-shadow:none;
}
.wooplay-admin .form-table input[type="checkbox"],
.wooplay-admin .form-table input[type="radio"]{ transform: scale(1.05); margin-right: 6px; }

/* Section titles (as WP Settings API often prints h2) */
.wooplay-admin h2, .wooplay-admin .title { margin-top: 18px; padding-top: 6px; color: var(--text); border-top: 1px solid var(--border); }
.wooplay-admin .description { color: var(--muted); font-size: 12.5px; }

/* Save indicator */
#wooplay-save-indicator {
  position: sticky; top: 12px; margin-left: auto; width: fit-content;
  background: linear-gradient(180deg, rgba(16,163,127,0.18), rgba(16,163,127,0.08));
  color: var(--text); border:1px solid rgba(16,163,127,.25);
  border-radius: 999px; padding: 6px 12px; font-weight:600; opacity:0; transform: translateY(-8px);
  transition: all .25s ease;
}
#wooplay-save-indicator.show { opacity: 1; transform: translateY(0); }

/* Buttons */
.wooplay-admin .button, .wooplay-admin button, .wooplay-admin .button-primary {
  background: linear-gradient(180deg, #1d1e20, #151517);
  color: var(--text);
  border:1px solid var(--border);
  border-radius:10px; padding:8px 12px; line-height:1.2;
}
.wooplay-admin .button:hover { border-color:#3a3a3c; }
.wooplay-admin .button-primary { background: linear-gradient(180deg, rgba(16,163,127,.85), rgba(16,163,127,.65)); border-color: rgba(16,163,127,.5); }

/* Preview box */
/* Product meta box (side) */
#wooplay_pick_media, #wooplay_remove_media { margin-top:8px; }

/* Ensure modal hidden until open */
.wooplay-modal{display:none;}