.uifc-wrapper {
max-width: 800px;
margin: 20px auto;
padding: 20px;
background: #f9f9f9;
border: 1px solid #ddd;
border-radius: 5px;
font-family: sans-serif;
}

.uifc-controls {
display: flex;
gap: 15px;
margin-bottom: 20px;
flex-wrap: wrap;
}

.uifc-controls select {
padding: 8px;
border-radius: 4px;
border: 1px solid #ccc;
min-width: 200px;
}

.uifc-editor {
display: flex;
gap: 20px;
margin-bottom: 20px;
}

@media (max-width: 768px) {
.uifc-editor {
flex-direction: column;
}
}

.uifc-box {
flex: 1;
}

.uifc-box textarea {
width: 100%;
height: 200px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

.uifc-actions {
display: flex;
flex-direction: column;
justify-content: center;
gap: 10px;
}

.uifc-file-upload {
background: #fff;
padding: 15px;
border: 1px dashed #ccc;
text-align: center;
}

#uifc-loader {
margin-top: 10px;
color: #0073aa;
font-weight: bold;
}
/* Radio Button Styling */
.uifc-radio-container {
display: flex;
gap: 15px;
flex-wrap: wrap;
}

.uifc-radio-box {
display: flex;
flex-direction: column;
background: #fff;
border: 1px solid #ccc;
padding: 10px 15px;
border-radius: 5px;
cursor: pointer;
transition: all 0.2s ease;
flex: 1;
min-width: 150px;
position: relative;
}

.uifc-radio-box:hover {
border-color: #0073aa;
background: #f0f6fc;
}

/* Hide default radio circle slightly but keep it accessible OR keep it visible */
.uifc-radio-box input[type="radio"] {
margin-bottom: 5px;
}

/* Highlight selected box */
.uifc-radio-box:has(input:checked) {
border-color: #0073aa;
background: #eef5fa;
box-shadow: 0 0 5px rgba(0,115,170,0.2);
}

.uifc-radio-label {
font-weight: bold;
color: #333;
}

.uifc-radio-desc {
font-size: 11px;
color: #666;
margin-top: 2px;
}