/* Reset e box sizing */
*, ::after, ::before {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Corpo e fontes */
body {
    background-color: #fff;
    font-family: Inter, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    font-weight: 400;
    color: #1f2937;
}

/* Container */
.container {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 20px;
    padding: 1rem;
    flex-wrap: wrap;
    gap: 1rem;
}

@media (min-width: 1700px) {
    .container {
        max-width: 1140px;
    }
}

/* Box */
.box {
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 8px rgba(65, 34, 99, 0.1);
    padding: 1.5rem;
    transition: box-shadow 0.3s;
}

.box:hover,
.box:focus-within {
    box-shadow: 0 8px 16px rgba(65, 34, 99, 0.2);
}

/* Títulos */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    margin-bottom: .5rem;
    color: #412263;
}

/* Parágrafos e formulários */
p {
    font-weight: 400;
    color: #4b5563;
    margin-bottom: 1rem;
}

form > * {
    margin-bottom: 1rem;
    width: 100%;
}

/* Inputs e elementos de formulário */
input[type=date],
input[type=datetime-local],
input[type=email],
input[type=file],
input[type=password],
input[type=text],
input[type=tel],
input[type=number],
select,
textarea {
    padding: .75rem 1rem;
    background-color: #f9fafb;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: border-color 0.3s, box-shadow 0.3s;
    width: 100%;
    font-size: 1rem;
    border-radius: 8px;
    border: 1.5px solid #d1d5db;
}

/* Focus states */
input[type=email]:focus,
input[type=password]:focus,
input[type=text]:focus,
input[type=tel]:focus,
input[type=number]:focus,
select:focus,
textarea:focus {
    border-color: #412263;
    box-shadow: 0 0 8px rgba(65, 34, 99, 0.5);
    outline: 0;
}

input[type=date]:focus,
input[type=datetime-local]:focus,
input[type=file]:focus,
input[type=file]:hover {
    border-color: #855aa5;
    box-shadow: 0 0 8px rgba(133, 90, 165, 0.5);
    outline: 0;
}

/* Estilo para input type="time" */
input[type=time] {
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 1rem;
    border: 1.5px solid #d1d5db;       /* borda clara */
    border-radius: 8px;                 /* bordas arredondadas */
    background-color: #f9fafb;          /* fundo suave */
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.05); /* sombra interna leve */
    transition: border-color 0.3s, box-shadow 0.3s;
}

/* Foco no input */
input[type=time]:focus {
    border-color: #412263;              /* cor da borda ao focar */
    box-shadow: 0 0 8px rgba(65,34,99,0.3); /* sombra leve */
    outline: none;
}

/* Desabilitado */
input[type=time]:disabled {
    background-color: #e5e7eb;
    cursor: not-allowed;
    color: #9ca3af;
}

/* Hover (opcional) */
input[type=time]:hover:not(:disabled) {
    border-color: #855aa5;
}



/* File input estilo */
input[type=file] {
    display: block;
    font-size: 1rem;
    color: #412263;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    cursor: pointer;
}

input[type=file]::-webkit-file-upload-button {
    visibility: hidden;
}

input[type=file]::before {
    content: 'Escolher arquivo';
    border-radius: 8px;
    padding: .5rem 1rem;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    background: linear-gradient(135deg, #412263, #855aa5);
    display: inline-block;
    transition: background 0.3s;
}

input[type=file]:hover::before {
    background: linear-gradient(135deg, #2f1b4c, #6e468e);
}

/* Date picker */
input[type=date],
input[type=datetime-local] {
    font-family: inherit;
    color: #412263;
    -webkit-appearance: none;
    -moz-appearance: textfield;
    appearance: none;
    position: relative;
    padding-right: 30px;
}

.date-picker-container {
    position: relative;
    display: inline-block;
}

.calendar-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg fill='%23412263' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10h2v2H7v-2zm0 4h2v2H7v-2zm4-4h2v2h-2v-2zm0 4h2v2h-2v-2zm4-4h2v2h-2v-2zm0 4h2v2h-2v-2z'/%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zm0-13H5V6h14v1z'/%3E%3C/svg%3E") center/contain no-repeat;
    cursor: pointer;
}

input[type=date]::-webkit-clear-button,
input[type=date]::-webkit-inner-spin-button {
    display: none;
}

.button {
    background: linear-gradient(135deg, #412263, #855aa5);
    display: inline-block;
}

.btn-voltar {
    background: linear-gradient(135deg, #412263, #855aa5);
    display: inline-block;
}

input[type="file"]::before {
    background: linear-gradient(135deg, #412263, #855aa5);
    display: inline-block;
}


.button,
.btn-voltar {
    padding: .75rem 1.5rem;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(133, 90, 165, 0.4);
    transition: background 0.3s, box-shadow 0.3s;
    user-select: none;
    text-align: center;
    text-decoration: none;
    border: none;
    border-radius: 8px;
    color: #fff;
}

.button:hover,
.button:focus,
.btn-voltar:hover,
.btn-voltar:focus {
    background: linear-gradient(135deg, #2f1b4c, #6e468e);
    box-shadow: 0 6px 14px rgba(94, 72, 143, 0.6);
    outline: 0;
}


/* Botão voltar */
.btn-voltar {
    display: inline-block;
    margin-top: 20px;
}

@media (max-width: 767px) {
    .btn-voltar {
        display: none;
    }
}

/* Cores utilitárias */
.accent {
    color: #94b143;
}

.border-accent {
    border-color: #94b143 !important;
}

.bg-accent {
    background-color: #94b143 !important;
    color: #fff;
}

/* Checkbox */
.checkbox-group {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.checkbox-group input[type=checkbox] {
    margin-right: 8px;
    transform: scale(1.2);
}
