/* Frontend bridge for shared form-control styling */

.bf-shell,
.tenant-shell {
    --frontend-control-bg: #fff;
    --frontend-control-fg: #344767;
    --frontend-control-muted: #667085;
    --frontend-control-border: #d7dee7;
    --frontend-control-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
    --frontend-control-radius: 0.9rem;
}

.bf-shell .btn-primary,
.tenant-shell .btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: color-mix(in srgb, var(--bs-primary) 88%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-primary) 88%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--bs-primary) 82%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--bs-primary) 82%, #000);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.bf-shell .btn-secondary,
.tenant-shell .btn-secondary {
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-bg: color-mix(in srgb, var(--bs-secondary) 88%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--bs-secondary) 88%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--bs-secondary) 82%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--bs-secondary) 82%, #000);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}

.bf-shell .btn-outline-primary,
.tenant-shell .btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
    --bs-btn-disabled-color: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.bf-shell .btn-outline-secondary,
.tenant-shell .btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary);
    --bs-btn-active-border-color: var(--bs-secondary);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}

.bf-shell label,
.tenant-shell label {
    font-weight: 700;
    color: var(--frontend-control-fg);
}

.bf-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input),
.bf-shell select:not(.mds-search-select),
.bf-shell textarea:not(.mut-textarea),
.tenant-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input),
.tenant-shell select:not(.mds-search-select),
.tenant-shell textarea:not(.mut-textarea) {
    width: 100%;
    border-radius: var(--frontend-control-radius);
    border: 1px solid var(--frontend-control-border);
    background: var(--frontend-control-bg);
    color: var(--frontend-control-fg);
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.35;
    box-shadow: var(--frontend-control-shadow);
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        background-color 0.18s ease;
}

.bf-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input),
.bf-shell select:not(.mds-search-select),
.tenant-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input),
.tenant-shell select:not(.mds-search-select) {
    min-height: 50px;
    padding: 0.75rem 1rem;
}

.bf-shell textarea:not(.mut-textarea),
.tenant-shell textarea:not(.mut-textarea) {
    min-height: 116px;
    padding: 0.9rem 1rem;
    resize: vertical;
}

.bf-shell select:not(.mds-search-select),
.tenant-shell select:not(.mds-search-select) {
    padding-right: 2.6rem;
}

.bf-shell input:not(.mui-input)::placeholder,
.bf-shell textarea:not(.mut-textarea)::placeholder,
.tenant-shell input:not(.mui-input)::placeholder,
.tenant-shell textarea:not(.mut-textarea)::placeholder {
    color: #9aa4b2;
    font-weight: 500;
}

.bf-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input):hover,
.bf-shell select:not(.mds-search-select):hover,
.bf-shell textarea:not(.mut-textarea):hover,
.tenant-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input):hover,
.tenant-shell select:not(.mds-search-select):hover,
.tenant-shell textarea:not(.mut-textarea):hover {
    border-color: var(--bs-secondary);
}

.bf-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input):focus,
.bf-shell select:not(.mds-search-select):focus,
.bf-shell textarea:not(.mut-textarea):focus,
.tenant-shell input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not(.mui-input):focus,
.tenant-shell select:not(.mds-search-select):focus,
.tenant-shell textarea:not(.mut-textarea):focus {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.22rem rgba(var(--app-primary-rgb), 0.12);
    outline: none;
}

.bf-shell input[readonly]:not(.mui-input),
.bf-shell input:disabled:not(.mui-input),
.bf-shell select:disabled,
.bf-shell textarea:disabled:not(.mut-textarea),
.tenant-shell input[readonly]:not(.mui-input),
.tenant-shell input:disabled:not(.mui-input),
.tenant-shell select:disabled,
.tenant-shell textarea:disabled:not(.mut-textarea) {
    background: #f8f9fa;
    color: var(--frontend-control-muted);
    box-shadow: none;
    cursor: not-allowed;
}

[data-bs-theme="dark"] .bf-shell,
[data-bs-theme="dark"] .tenant-shell {
    --frontend-control-bg: rgba(15, 23, 42, 0.78);
    --frontend-control-fg: #f8fafc;
    --frontend-control-muted: #98a2b3;
    --frontend-control-border: rgba(148, 163, 184, 0.24);
    --frontend-control-shadow: none;
}

[data-bs-theme="dark"] .bf-shell input:not(.mui-input)::placeholder,
[data-bs-theme="dark"] .bf-shell textarea:not(.mut-textarea)::placeholder,
[data-bs-theme="dark"] .tenant-shell input:not(.mui-input)::placeholder,
[data-bs-theme="dark"] .tenant-shell textarea:not(.mut-textarea)::placeholder {
    color: rgba(203, 213, 225, 0.58);
}

[data-bs-theme="dark"] .bf-shell input[readonly]:not(.mui-input),
[data-bs-theme="dark"] .bf-shell input:disabled:not(.mui-input),
[data-bs-theme="dark"] .bf-shell select:disabled,
[data-bs-theme="dark"] .bf-shell textarea:disabled:not(.mut-textarea),
[data-bs-theme="dark"] .tenant-shell input[readonly]:not(.mui-input),
[data-bs-theme="dark"] .tenant-shell input:disabled:not(.mui-input),
[data-bs-theme="dark"] .tenant-shell select:disabled,
[data-bs-theme="dark"] .tenant-shell textarea:disabled:not(.mut-textarea) {
    background: rgba(15, 23, 42, 0.52);
    color: #98a2b3;
}