body {
font-family: sans-serif;
margin: 1em;
color: #333;
}
h1, h2, h4, h5 {
margin-bottom: 0.5em;
}
button {
padding: 8px 15px;
margin: 5px;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
background-color: #f8f8f8;
transition: background-color 0.2s ease;
}
button:hover:not(:disabled) {
background-color: #eee;
}
button:disabled {
cursor: not-allowed;
opacity: 0.6;
}
input[type="text"], input[type="file"] {
padding: 8px;
margin: 5px 0;
border: 1px solid #ccc;
border-radius: 4px;
}
label {
margin-right: 0.5em;
}
.status {
padding: 10px;
border-radius: 4px;
margin: 1em 0;
border: 1px solid transparent;
}
.status-loading {
background-color: #eef;
border-color: #cce;
color: #339;
}
.status-info {
background-color: #eef;
border-color: #cce;
color: #339;
}
.status-ready {
background-color: #efe;
border-color: #cec;
color: #393;
}
.status-success {
background-color: #efe;
border-color: #cec;
color: #393;
}
.status-error {
background-color: #fee;
border-color: #ecc;
color: #933;
}
.status-warning {
background-color: #ffe;
border-color: #eec;
color: #993;
}
.config-section, #setup-phase-content > div, .log-section {
margin-top: 1.5em;
padding-top: 1em;
border-top: 1px solid #eee;
}
#setup-phase-content h5 {
margin-top: 0;
margin-bottom: 1em;
}
ul {
list-style: none;
padding: 0;
}
li {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0.5em;
padding: 8px 5px;
border-bottom: 1px dotted #eee;
}
li .config-name {
flex-grow: 1;
margin-right: 1em;
}
li .config-actions button {
margin-left: 0.5em;
}
li strong {
font-weight: bold;
color: #007bff; /* Blue for default indicator */
}
li button {
padding: 4px 8px;
font-size: 0.9em;
margin-left: 0.5em;
}
/* Simple Icon Mimics */
.icon::before {
display: inline-block;
margin-right: 0.5em;
font-weight: bold;
}
.icon-grant::before { content: '✅'; }
.icon-connect::before { content: '🔗'; }
.icon-delete::before { content: '🗑️'; }
.icon-default::before { content: '⭐'; }
.icon-abort::before { content: '❌'; }
.icon-done::before { content: '👍'; }
.load-options > div {
margin-bottom: 1em;
}
.separator {
text-align: center;
margin: 1.5em 0;
color: #999;
font-style: italic;
}
.setup-actions {
margin-top: 2em;
padding-top: 1em;
border-top: 1px solid #eee;
display: flex;
justify-content: flex-end;
}