/* ===== Cadastro de Empresa – identidade do Home (versão otimizada) ===== */

/* viewport/background (mesmo gradiente) */
.cadastro-theme {
    margin: 0;
    min-height: 100dvh;
    background:
        radial-gradient(1200px 600px at 10% -10%, #14397233, transparent),
        linear-gradient(180deg, var(--bg-0), var(--bg-1) 80%);
    color: var(--ink);
    font-family: Inter, system-ui, Segoe UI, Arial, sans-serif;
    display: grid;
    place-items: center;
    overflow-x: hidden;
}

.cadastro-bg {
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        conic-gradient(from 0deg at 60% 40%, #1e76bd11 0deg, transparent 40deg, transparent 70deg, #42dca311 100deg);
    mix-blend-mode: screen;
    filter: blur(1px);
    animation: cadastro-spin 60s linear infinite;
}

@keyframes cadastro-spin {
    to {
        transform: rotate(360deg)
    }
}

/* Largura do container: remove max-width do Bootstrap e expande com segurança */
.container.cadastro-container {
    max-width: unset;
    width: clamp(320px, 96vw, 1480px);
    margin-inline: auto;
}

/* Ultra-wide: um pouco mais de folga */
@media (min-width:1800px) {
    .container.cadastro-container {
        width: min(1680px, 92vw);
    }
}

/* Marca */
.cadastro-brand {
    display: grid;
    place-items: center;
    margin-bottom: 16px;
}

.cadastro-brand img {
    height: 80px;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35));
}

/* Card “glass” */
.cadastro-card {
    border: 1px solid var(--stroke);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .03));
    box-shadow: var(--shadow);
    backdrop-filter: blur(10px) saturate(120%);
}

/* Título */
.cadastro-title {
    margin: 0 0 .8rem;
    font-size: clamp(1.4rem, 2.6vw, 1.9rem);
    text-align: center;
    color: #fff;
}

/* Seções */
.form-section {
    margin: 16px 0 8px;
}

.form-section-title {
    margin: 0 0 .6rem;
    font-weight: 800;
    color: #fff;
}

/* GRID DE CAMPOS — mobile-first, sem overflow */
.form-grid {
    display: grid;
    grid-template-columns: 1fr;
    /* 1 coluna no mobile */
    gap: 14px 16px;
    /* espaçamento mais justo no mobile */
    max-width: 100%;
}

.form-grid>* {
    min-width: 0;
}

/* evita “alargamento” dos filhos */

@media (min-width:768px) {
    .form-grid {
        grid-template-columns: repeat(2, minmax(300px, 1fr));
        /* 2 colunas quando couber */
        gap: 18px 28px;
    }
}

@media (min-width:1400px) {
    .form-grid {
        grid-template-columns: repeat(2, minmax(560px, 1fr));
        /* conforto em telas largas */
        gap: 20px 32px;
    }
}

/* Campos/labels no tema escuro */
.form-grid label,
.form-section label {
    color: #eaf2ff;
    font-weight: 600;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.form-section input,
.form-section select,
.form-section textarea {
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--stroke);
    color: #fff;
}

.form-grid input::placeholder,
.form-section input::placeholder,
.form-grid textarea::placeholder {
    color: #b8c6dd;
    opacity: .9;
}

/* Inputs ocupam 100% da célula */
.form-grid .form-control,
.form-section .form-control,
.form-grid select,
.form-grid textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Campos que precisam ocupar 2 colunas */
.form-grid .span-2 {
    grid-column: 1 / -1;
}

/* Upload de logo */
.logo-upload {
    display: grid;
    place-items: center;
}

.logo-box {
    position: relative;
    width: 160px;
    height: 160px;
    border: 1px solid var(--stroke);
    border-radius: 16px;
    background: #fff;
    overflow: hidden;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}

.logo-box:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .25);
}

.logo-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.logo-overlay {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgba(0, 0, 0, .35);
    opacity: 0;
    transition: .25s;
}

.logo-box:hover .logo-overlay {
    opacity: 1;
}

.logo-overlay i {
    color: #fff;
    font-size: 22px;
}

.logo-remove {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    background: #b33939;
    border: none;
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 18px;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: var(--shadow);
}

/* Botão principal */
.btn--full {
    width: 100%;
}

/* Footer */
.cadastro-footer {
    text-align: center;
    margin-top: 14px;
    color: #fff;
    font-size: .92rem;
}

.cadastro-footer a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.cadastro-footer a:hover {
    text-decoration: underline;
}

/* Espaçamento do card — unificado com logical properties */
.card__body {
    padding-block: clamp(20px, 3vw, 36px);
    padding-inline: clamp(20px, 4vw, 56px);
}

/* Selects (Bootstrap .form-select) no tema escuro */
.form-grid select.form-select,
.form-section select.form-select {
    background-color: rgba(255, 255, 255, .05) !important;
    border: 1px solid var(--stroke) !important;
    color: #fff !important;
}

.form-grid select.form-select option,
.form-section select.form-select option {
    background-color: #1a1d29;
    color:
        #fff;
}

/* Sobrescreve o Bootstrap para o helptext dos forms */
.cadastro-theme .form-text {
    color: #fff !important;
    /* texto branco */
    opacity: 0.85;
    /* levemente suavizado */
}
