/* Styles specifiques a admin/randoms/form.blade.php */

.upload-zone { min-height: 200px; border: 2px dashed var(--border); border-radius: calc(20px * var(--radius-scale)); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; transition: all 0.2s; background: var(--card-bg); text-align: center; gap: 8px; padding: 2rem; }
.upload-zone:hover { border-color: var(--primary); background: rgba(var(--primary-rgb), 0.05); color: var(--primary); }
.preview-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.preview-card { border-radius: calc(12px * var(--radius-scale)); border: 1px solid var(--border); background: var(--card-bg); display: flex; flex-direction: column; overflow: visible; position: relative; }
.preview-img-wrapper { aspect-ratio: 1; width: 100%; overflow: hidden; border-top-left-radius: calc(11px * var(--radius-scale)); border-top-right-radius: calc(11px * var(--radius-scale)); }
.preview-img-wrapper img { width: 100%; height: 100%; object-fit: cover; }
.preview-details { padding: 0.5rem; position: relative; text-align: left; overflow: visible; }

.upload-panel-body { text-align: center; padding: 3rem; overflow: visible; }
.upload-intro-text { color: var(--text-muted); margin-bottom: 2rem; font-size: 1.1rem; }
.upload-zone-icon { font-size: 4rem; color: var(--primary); margin-bottom: 1.5rem; display: block; }
.upload-zone-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 0.5rem; color: var(--text-main); }

.default-char-container { margin-bottom: 2rem; text-align: left; max-width: 400px; margin-left: auto; margin-right: auto; }
.global-tags-container { text-align: left; margin-bottom: 2rem; width: 100%; }

.btn-save-wrap { margin-top: 3rem; }
.btn-upload-save { padding: 1rem 3rem; font-size: 1.1rem; }

.preview-card-single { max-width: 200px; margin: 0 auto; }

.card-field-label { font-size: 0.7rem; font-weight: 700; margin-bottom: 2px; display: block; text-align: left; }
.card-char-select { font-size: 0.8rem; padding: 0.4rem; margin: 0 0 8px 0; height: auto; }
.card-tags-select { font-size: 0.75rem; padding: 0.2rem; margin: 0; height: 75px; }
