body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    margin: 20px;
    padding: 20px;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
}

h1, h2 {
    color: #444;
}

form {
    background: white;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
}

label {
    margin-top: 10px;
    display: block;
    font-weight: bold;
    padding: 0px 10px;
}

input[type="text"],
input[type="date"],
input[type="time"],
input[type="number"],
input[type="tel"],
input[type="email"],
input[type="color"],
select,
textarea {
    width: 100%;
    padding: 8px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

input[type="submit"] {
    background-color: #5c67f2;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 20px;
}

input[type="submit"]:hover {
    background-color: #4a54e1;
}

table {
    width: 100%;
    margin-top: 20px;
    border-collapse: collapse;
}

th, td {
    text-align: left;
    padding: 8px;
    border: 1px solid #ddd;
}

th {
    background-color: #f2f2f2;
}

#observaciones{
    font-family: Arial, sans-serif;
    width: 98%;
    height: 150px;
}

.row {
    display: flex;
    justify-content: space-between;

}

.column {
    flex: 1;
    padding: 1.5em;
}


input#idNumber {
    width: 70%;
    transform: translateX(18px);
    
}

#numerocconit {
    border-left: solid 1px #ccc;
    padding: 0px 8px;
}

div#identificacion {
    display: flex;
    justify-content: center;
    padding: .5em 0;
}

div#table {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

table {
    width: 50%; /* Ajusta este valor si es necesario para dar espacio entre las tablas */
    margin: 0;
    border-collapse: collapse;
}

table th, table td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}

table th {
    background-color: #f2f2f2;
}

table tr td input {
    width: 80% !important;
}

/* Resto del CSS */

/* Específico para inputs dentro de las tablas para evitar que se expandan demasiado */
table tr td input[type="checkbox"], table tr td input[type="number"] {
    width: auto; /* Esto permite que el checkbox no se estire y el input de número tome solo el espacio necesario */
    margin: 0; /* Elimina cualquier margen externo que pudiera desplazar los inputs */
}

table tr td input[type="number"] {
    width: 95%; /* Ajustar según necesidad para llenar la celda pero sin desbordarse */
}

/* Asegura que ambas tablas tengan el mismo ancho y alineación */
.column {
    width: 50%; /* Ocupa exactamente la mitad del espacio disponible */
    box-sizing: border-box; /* Incluye padding y bordes en el ancho total del elemento */
    padding: 0 15px; /* Añade padding interno para no tocar los bordes del contenedor */
}

/* Ajustes adicionales para asegurar que el layout no se rompa */
.row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; /* Alinea los elementos al principio del contenedor */
}

/* Asegúrate de que las celdas de la tabla usen todo el espacio vertical disponible */
table td, table th {
    vertical-align: middle;
}


#info {
    background-color: #fff;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border-radius: 6px;
    padding: 1em;
}


#info p {
    text-align: justify;
}

p.kilometrajep {
    padding: 0 !important;
    font-weight: 700;
    margin: 0;
    margin-bottom: 20px;
    font-size: 1.1em;
}
input#pi_input {
    width: 100%;
    text-transform: capitalize;
}

#colorplacaserie {
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    margin: 15px 0;
}
}
#colorplacaserie label {
    padding: 10px;
}

input#color {
    height: 45px;
    padding: 2px;
}
.otro-text, .otro-text:focus{
    border: none !important;
    font-size: 16px;
    margin-top: 0 !important;
    padding: 0 !important;
    text-transform: capitalize;
}

.tituloprint{
    color: #1a1616;
    text-align: left;
    
}



i{
    padding: 10px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border: solid 1px #e9e5e5;
    border-radius: 6px;
    text-align: left;
    font-size: 1em;
    color: #e20613;
    margin: 0;
    margin-right: 10px;
}


img#displayImage {
    max-height: 240px;
    object-fit: cover;
}

input#placa {
    background: #ffff00;
    color: #000;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 1.1em;
}


#fecha-hora {
    font-size: .8em;
    text-align: right;
}

input#uploadImage {
    opacity: .5;
}


.text-info{
    font-size: 14px;
}

#firma{
    padding: 0;
    margin: 20px 0;
}

input#scootercheck{
    transform: scale(1.6);
    padding: 10px 0;
}



@media (max-width:990px) {
        
.text-info{
    font-size: 7px !important;
}
  }