:root {
    --green: #6d4aff;
    --green-dark: #4b2bc6;
    --soft: #f1edff;
    --nav: #18102d;
    --line: #e4e0ee;
    --page: #f7f6fa;
}

/* Stable dashboard form foundation */
.main form { min-width: 0; }
.main fieldset { min-width: 0; }
.main label { min-width: 0; }
.main input:not([type="checkbox"]):not([type="radio"]),
.main select,
.main textarea {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    border: 1px solid #d7d1e3;
    border-radius: 10px;
    background: #fff;
    color: #201a2e;
    padding: 11px 13px;
    font: inherit;
    line-height: 1.35;
    box-shadow: 0 1px 2px rgba(34, 20, 58, .02);
}
.main textarea { min-height: 92px; }
.main input::placeholder,
.main textarea::placeholder { color: #9991a8; opacity: 1; }
.main input:focus,
.main select:focus,
.main textarea:focus {
    border-color: #7958ec;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(109, 74, 255, .12);
}
.main input[type="checkbox"],
.main input[type="radio"] {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    min-height: 0;
    margin: 1px 0 0;
    accent-color: #6d4aff;
}
.main label > small { color: #776f84; font-weight: 500; line-height: 1.45; }
.check { display: flex; align-items: flex-start; line-height: 1.45; }
.button { min-height: 42px; white-space: nowrap; }
.button-secondary { background: #eee9ff; color: #4b2bc6; }
.button-secondary:hover { background: #e4dcff; }
.badge { background: #eee9ff; color: #4b2bc6 !important; }
.notice, .license { border-color: #d7cdfd; background: #f5f2ff; }
.error-panel { display: grid; gap: 4px; }
.page-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.page-actions form { margin: 0; }

.project-page-head { align-items: center; }
.project-head-actions { flex-wrap: wrap; justify-content: flex-end; }
.project-stats strong small { margin-left: 4px; color: #8b8399; font-size: 14px; }
.project-stats article > small { display: block; margin-top: 8px; color: #776f84; }
.control-centre { overflow: visible; scroll-margin-top: 100px; }
.control-centre > .card-head {
    background: linear-gradient(135deg, #20133c, #4f2cb9);
    border: 0;
    padding: 28px;
}
.control-centre > .card-head h2,
.control-centre > .card-head p,
.control-centre > .card-head .eyebrow { color: #fff; }
.control-centre > .card-head p { opacity: .76; }
.control-centre > .card-head .badge { background: rgba(255,255,255,.14); color: #fff !important; }
.project-control-form { background: #fbfafd; }
.control-section {
    margin: 0;
    padding: 26px 28px 30px;
    border: 0;
    border-bottom: 1px solid var(--line);
}
.control-section legend {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 0 20px;
}
.control-section legend > span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: #eee9ff;
    color: #4b2bc6;
    font-weight: 800;
}
.control-section legend strong,
.control-section legend small { display: block; }
.control-section legend strong { color: #251b38; font-size: 15px; }
.control-section legend small { color: #776f84; margin-top: 3px; font-weight: 500; }
.form-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.span-two { grid-column: span 2; }
.toggle-panel {
    display: grid;
    align-content: center;
    gap: 11px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid #e1dceb;
    border-radius: 11px;
    background: #fff;
}
.option-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.feature-option {
    min-height: 80px;
    border-color: #e1dceb;
    background: #fff;
}
.feature-option:has(input:checked) { border-color: #9176ec; background: #f4f1ff; }
.language-counter {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    color: #776f84;
    font-size: 12px;
}
.language-counter strong { color: #4b2bc6; }
.project-language-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.project-language-card {
    min-width: 0;
    border: 1px solid #e1dceb;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}
.project-language-card.is-selected { border-color: #8d70ec; box-shadow: 0 0 0 1px #8d70ec; }
.project-language-card.is-disabled { opacity: .52; }
.project-language-card summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 15px;
    cursor: pointer;
    list-style: none;
}
.project-language-card summary::-webkit-details-marker { display: none; }
.language-selector { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.language-selector span,
.language-selector strong,
.language-selector small { display: block; }
.language-selector small { color: #7b7485; margin-top: 3px; }
.language-card-state {
    flex: 0 0 auto;
    border-radius: 20px;
    background: #f0edf5;
    color: #736b7f;
    padding: 5px 9px;
    font-size: 10px;
    font-weight: 800;
}
.is-selected .language-card-state { background: #e9e2ff; color: #4b2bc6; }
.language-card-body { border-top: 1px solid #ece8f1; padding: 16px; background: #fcfbfe; }
.language-checks { margin-top: 15px; }
.sticky-form-actions {
    position: sticky;
    bottom: 0;
    z-index: 6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 15px 28px;
    border-top: 1px solid #ddd6ec;
    background: rgba(255,255,255,.96);
    box-shadow: 0 -12px 30px rgba(34, 20, 58, .08);
    backdrop-filter: blur(12px);
}
.sticky-form-actions span { color: #776f84; font-size: 12px; }
.provider-health-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.provider-health-grid article {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 17px 18px;
    border-right: 1px solid var(--line);
}
.provider-health-grid article:last-child { border-right: 0; }
.provider-health-grid strong,
.provider-health-grid small { display: block; }
.provider-health-grid small { margin-top: 3px; color: #776f84; overflow-wrap: anywhere; }
.provider-health-grid b { grid-column: 2; color: #4b2bc6; font-size: 11px; }
.status-passed { background: #19a974; }
.status-failed { background: #c2352a; }

@media (max-width: 1250px) {
    .option-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .provider-health-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1050px) {
    .form-grid-three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .span-two { grid-column: auto; }
    .project-language-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .project-page-head, .project-head-actions { align-items: stretch; }
    .project-head-actions { display: grid; width: 100%; }
    .control-section { padding: 22px 18px; }
    .form-grid-three, .option-grid, .provider-health-grid { grid-template-columns: 1fr; }
    .provider-health-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
    .sticky-form-actions { position: static; display: grid; padding: 16px 18px; }
    .sticky-form-actions .button { width: 100%; }
    .language-counter { display: grid; }
}
