/*===================================================================================== SEGUROS */
/* Es un input que en la parte inicial de 90px se coloca su label */
input {
    pointer-events: auto;
}
.boxLabelInput {
    display: grid;
    width:100%;
    height:38px;
	grid-template-columns:  90px   1fr;
    grid-template-areas: "  labelEdit  inputEdit";
    margin-top:7px;
    margin-bottom:7px;
}
.boxLabelInput100 {
    display: grid;
    width:100%;
    height:38px;
	grid-template-columns:  100px   1fr;
    grid-template-areas: "  labelEdit  inputEdit";
    margin-top:7px;
    margin-bottom:7px;
}
.boxLabelInput120 {
    display: grid;
    width:100%;
    height:38px;
	grid-template-columns:  120px   1fr;
    grid-template-areas: "  labelEdit  inputEdit";
    margin-top:7px;
    margin-bottom:7px;
}
.inputEdit {
    grid-area: inputEdit;
    display: grid; 
    width:100%;
    font-size:19px; 
    background-color: #EEE;
    border: 1px solid #BBB;
    border-radius: 5px;
    padding-left: 8px;
    place-items: center start;
}
.textEdit {
    grid-area: inputEdit;
    cursor: pointer;
    display: grid; 
    width:100%;
    font-size:15px; 
    place-items: start start;
}
.selectEdit {
    grid-area: inputEdit;
    cursor: pointer;
    display: grid; 
    width:100%;
    font-size:15px; 
    place-items: start start;
    margin-left:20px;
}
.lineaModal {
    display: none;
    border: 1px solid #ccc;
    width:100%;
}

/* Es un AreaTexto que en la parte inicial de 90px se coloca su label */
.boxLabelArea {
    display: grid;
    width:100%;
    height:63px;
	grid-template-columns:  90px   1fr;
    grid-template-areas: "  labelEdit  areaEdit";
    margin-top:7px;
    margin-bottom:7px;
}
.boxLabelArea100 {
    display: grid;
    width:100%;
    height:63px;
	grid-template-columns:  100px      1fr;
    grid-template-areas: "  labelEdit  areaEdit";
    margin-top:7px;
    margin-bottom:7px;
}
.labelEdit {
    grid-area: labelEdit;
    display:grid;
    width: 100%;
    height: 100%;           /* Asigna el espacio requerido */
    padding-right: 10px;    /* Espacio entre el texto y el input */
    color: #AAA;            /* Color claro */
    font-size: 17px;        /* Ajusta el tamaño de fuente si es necesario */
    place-items: center end;
}
.areaEdit {
    grid-area: areaEdit;
    display: grid; 
    font-size:19px; 
    width:100%;
    background-color: #EEE;
    border: 1px solid #BBB;
    border-radius: 5px;
    padding-left: 8px;
    place-items: center start;
}
#newUso {   cursor: pointer; }
#oldUso {   cursor: pointer; }
#newClase {   cursor: pointer; }
#oldClase {   cursor: pointer; }
#newMarca {   cursor: pointer; }
#oldMarca {   cursor: pointer; }
#newModelo {   cursor: pointer; }
#oldModelo {   cursor: pointer; }
/*------------------------------------------------------------------- Formato en Modales */
.boxText {
    display: grid;
    width:100%;
    height:40px;
	grid-template-columns:  120px    1fr;
    grid-template-areas: "  subtext  text";
}
.subtext20 {
    grid-area: subtext;
    display:grid;
    width:100%;
    place-items: center end;
    font-size:20px;
    color:#AAA;
    padding-right:12px;
}
.subtext20P {
    grid-area: subtext;
    display:grid;
    width:100%;
    place-items: start end;
    font-size:20px;
    color:#AAA;
    padding-right:12px;
}
.text20 {
    grid-area: text;
    display: grid;
    font-size: 20px;
    width: 100%;
    height: 100%;
    line-height: 1.2;
    align-items: center;
    justify-items: start;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border: none;
    outline: none;
    background: transparent;
}
.text20N {
    grid-area: text;
    display:grid;
    font-size:20px;
    width:100%;
    place-items: center start;
}
textarea.text20 {
    display: block;      /* quita el grid */
    width: 100%;         /* ocupa el ancho disponible */
    min-height: 60px;    /* asegura varias líneas */
    line-height: 1.1;    /* altura de línea */
    resize: vertical;    /* permite agrandar */
    white-space: normal; /* que el texto se ajuste */
    margin-bottom: 0px;  /* separación con el siguiente input */
    box-sizing: border-box;
}
.multilinea {
    height: auto;
    min-height: 60px;  /* ajusta el tamaño mínimo */
    resize: vertical;  /* permite que el usuario lo agrande si quiere */
    white-space: normal;
}
.text16 {
    grid-area: text;
    display:grid;
    font-size:16px;
    width:100%;
    place-items: center start;
}
/*--------------------------------------------------------------------- Formato 100 Modales */
.boxText120,.boxText100,.boxText90, .boxText80, .boxText70, .boxText60, .boxText50 {
    display: grid;
    width:100%;
    height:40px;
    grid-template-areas: "  label  .";   
}
.boxText120 {  grid-template-columns:  120px    1fr; }
.boxText100 {  grid-template-columns:  100px    1fr; } 
.boxText90  {  grid-template-columns:   90px    1fr; }
.boxText80  {  grid-template-columns:   80px    1fr; }
.boxText70  {  grid-template-columns:   70px    1fr; }
.boxText60  {  grid-template-columns:   60px    1fr; }
.boxText50  {  grid-template-columns:   50px    1fr; }

.label14,.label15, .label16, .label17 {
    grid-area: label;
    display:grid;
    width:100%;
    color:#AAA;
    padding-right:12px;
    place-items: center end;
}
.label14 { font-size:14px; }
.label15 { font-size:15px; }
.label16 { font-size:16px; }
.label17 { font-size:17px; }
/*-------------------------------------------------------------------- POLIZAS EN PLANILLA */
.box3Columns {
    display: grid;
    width:100%;
    height:36px;
	grid-template-columns:  110px    1fr      80px;
    grid-template-areas: "  column1  column2  column3";
    text-decoration: none;
    color: inherit; /* Mantener el color original */
    cursor: pointer; /* Cambiar el cursor al pasar */
    box-sizing: border-box; /* Evitar que los bordes/padding alteren el tamaño */
}
.box3Columns:hover {
    color: inherit; /* Mantener el color al pasar */
    text-decoration: none; /* Sin subrayado al pasar */
}
.column1_20 {
    grid-area: column1;
    display:grid;
    width:100%;
    place-items: center start;
    font-size:19px;
    color:#444;
}
.column2_20 {
    grid-area: column2;
    display:grid;
    width:100%;
    place-items: center start;
    font-size:18px;
    color:#444;
}
.column3_20 {
    grid-area: column3;
    display:grid;
    width:100%;
    place-items: center end;
    font-size:19px;
    color:#444;
}
/*------------------------------------------------------------------ POLIZAS FUERA PLANILLA */
.box3ColumnsOut {
    display: grid;
    width:100%;
    height:36px;
	grid-template-columns:  110px       1fr        80px;
    grid-template-areas: "  outColumn1  outColumn2  outColumn3";
    text-decoration: none;
    color: inherit; /* Mantener el color original */
    cursor: pointer; /* Cambiar el cursor al pasar */
    box-sizing: border-box; /* Evitar que los bordes/padding alteren el tamaño */
}
.box3ColumnsOut:hover {
    color: inherit; /* Mantener el color al pasar */
    text-decoration: none; /* Sin subrayado al pasar */
}
.column1_18 {
    grid-area: outColumn1;
    display:grid;
    width:100%;
    place-items: center start;
    font-size:18px;
    color:#999;
}
.column2_18 {
    grid-area: outColumn2;
    display:grid;
    width:100%;
    place-items: center start;
    font-size:17px;
    color:#999;
}
.column3_18 {
    grid-area: outColumn3;
    display:grid;
    width:100%;
    place-items: center end;
    font-size:18px;
    color:#999;
}
/*-------------------------------------------------------------------Texto delante INPUT*/
.text-label {
    display:grid;
    width: 120px;
    height: 40px;           /* Asigna el espacio requerido */
    padding-right: 10px;    /* Espacio entre el texto y el input */
    color: #AAA;            /* Color claro */
    font-size: 17px;        /* Ajusta el tamaño de fuente si es necesario */
    place-items: center end;
    background:#CCC;
}

.mb-3 {
    display: flex;          /* Alinea el label y el input en una misma fila */
    align-items: center;    /* Centra verticalmente */
}




/*=========================================================================================== ANTERIORES */
        .bienvenido { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 400; 
            font-size:20px; 
            text-align:center; 
            padding:30px 0 30px 0; 
            letter-spacing:3px; 
            color:#7D6E38;
        }
        .titulo { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 400; 
            font-size:20px; 
            text-align:center; 
            padding:30px 0 8px 0; 
            letter-spacing:2px; 
            color:#7D6E38;
        }
        .area { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 700; 
            font-size:21px; 
            text-align:center; 
            padding:25px 0 25px 0; 
            letter-spacing:2px; 
            color:#999;
        }
        a.area_link, a.area_link:visited, a.area_link:hover { 
            display: grid;
            width: 100%;
            font-family:'Nanum Gothic', sans-serif; 
            font-weight: 700; 
            font-size:27px; 
            text-align:center; 
            letter-spacing:2px; 
            color:#070;
        }
        a.area_link:hover { font-size:28px; color:#060; }
        .nombre { 
            display: grid;
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 400; 
            font-size:16px; 
            justify-items: center; 
            align-items: center;
            letter-spacing:1px; 
            color:#AAA;
        }
        .fono { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 400; 
            font-size:16px; 
            text-align:center;
            letter-spacing:1px; 
            color:#AAA;
        }
        .texto { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 400; 
            font-size:20px; 
            text-align:center; 
            letter-spacing:1px; 
        }
        .ask { 
            font-family: 'Nanum Gothic', sans-serif; 
            font-weight: 700; 
            font-size:20px; 
            text-align:center; 
            padding:20px 10px 20px 10px; 
            letter-spacing:1px;
        }
        .answer_box {
	        height:auto; 
	        width:100%;
	        display: grid;
	        grid-template-columns:  1fr  40px  80px  40px  1fr;
            grid-template-areas: "  .    si    .    no    .";
            padding-top:8px;
            padding-bottom:8px;
        }
        .si, .no { display: grid; justify-items: center; align-items: center; font-size:30px; font-weight: bold; letter-spacing: 1px; color:#86B826; }
        .si { grid-area: si; }
        .no { grid-area: no; }
        a.si:hover, a.si:visited, a.no:hover, a.no:visited {   
            display: grid; justify-items: center; align-items: center; font-size:30px; font-weight: bold; letter-spacing: 1px; color:#86B826; 
        }
        .box {   
            display: flex; 
            width: 100%; 
            justify-content: center; 
            align-items: center; 
            margin: 10px 0;
        }
        .in_box {   
            font-size: 20px; 
            letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
            border-radius: 8px;
            padding: 10px;
            text-align: center;
            width: 80%;
            max-width: 400px;
            box-sizing: border-box;
        }
        .in_box18 {   
            display: grid;
            width:450px;
            justify-items: center; 
            align-items: center;
            font-size:18px;
            background-color: #EEE;
            border: 2px solid #999;
		    border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
		.in_box::placeholder {  color: #CCC; }
        .in_end {   display: grid; 
                    justify-items: center; align-items: center;
                    font-size:16px; letter-spacing: 1px; 
                    background-color: #06C;
                    color: #FFF;
                    border: 0px;
					border-radius: 8px;
                    margin-top: 20px;
                    margin-bottom: 8px;
                    padding-top: 6px;
					padding-bottom: 6px;
					padding-left: 10px;
					padding-right: 10px;
                    text-align: center;
                }
        /*------------------------------------------------------- TELEFONO */
        .box_fono { 
            display: grid; width:100%; justify-items: center; align-items: center;
            grid-template-columns:  1fr  20%    10px  55%    1fr;
            grid-template-areas: "  .    in_cod  .     in_fono  ."; 
        }
        .in_cod {
            grid-area: in_cod;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        .in_fono {
            grid-area: in_fono;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        .in_cod::placeholder {  color: #CCC; }
        .in_fono::placeholder {  color: #CCC; }
        /*-------------------------------------------------- SERIE - NUMERO */
        .box_numero { 
            display: grid; width:100%; justify-items: center; align-items: center;
            grid-template-columns:  1fr  20%       10px  45%     1fr;
            grid-template-areas: "  .    in_serie  .     in_num  ."; 
        }
        .in_serie {
            grid-area: in_serie;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        .in_num {
            grid-area: in_num;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        .in_serie::placeholder {  color: #CCC; }
        .in_num::placeholder {  color: #CCC; }
        /*---------------------------------------------------------------- FECHA */
        .box_date {   
            display: grid; width:300px; 
            justify-items: center; align-items: center;
            grid-template-columns:  1fr  350px    1fr;
            grid-template-areas: "  .    in_date  ."; 
        }
        .in_date {   
            grid-area: in_date;
            display: grid; 
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        /*-------------------------------------------------- TOTAL - EXONERADO */
        .box_total { 
            display: grid; width:100%; justify-items: center; align-items: center;
            grid-template-columns:  20px  20px  20px  20px;
            grid-template-columns:  1fr  180px     15px  35px       auto       1fr;
            grid-template-areas: "  .    .         .     in_icono   in_label   ."
                                 "  .    in_total  .     in_icono   in_label   ."
                                 "  .    in_total  .     in_icono2  in_label2  ."
                                 "  .    .         .     in_icono2  in_label2  ."; 
        }
        .in_total {
            grid-area: in_total;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
			border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            text-align: center;
        }
        .in_icono2 {
            grid-area: in_icono2;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
        }
        .in_label2 {
            grid-area: in_label2;
            display: grid;
            width: 100%;
            font-size:20px; letter-spacing: 1px; 
            color: #777;
        }
        .in_total::placeholder {  color: #CCC; }
        /*-------------------------------------------------- INPUT - CHECKBOX */
        .box_check { 
            display: grid; width:100%; justify-items: center; align-items: center;
            grid-template-columns:  1fr  40px      auto      1fr;
            grid-template-areas: "  .    in_icono  in_label  ."; 
        }
        .in_icono {
            grid-area: in_icono;
            display: grid;
            width: 100%;
            justify-items: center; align-items: center;
        }
        .in_label {
            grid-area: in_label;
            display: grid;
            width: 100%;
            font-size:20px; letter-spacing: 1px; 
            color: #777;
        }
        /*---------------------------------------------------- INPUT - DATE */
        .box_date { 
            display: grid; 
            width: 100%;
            justify-items:center; 
            align-items: center;
        }
        .in_date {
            background-color: #EEE;
            border: 2px solid #999;
    		border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
            width:20px; 
            font-size:20px; letter-spacing: 1px;
        }
        /*------------------------------------------------------- UBICACION */
        .ubicacion {   display: grid; 
                    justify-items: center; align-items: center;
                    font-size:25px; letter-spacing: 1px;
                    color: #009;
                    margin-top: 8px;
                    margin-bottom: 8px;
                    text-align: center;
                }
        a.ubicacion:hover, a.ubicacion:visited {   
            display: grid; justify-items: center; align-items: center; font-size:25px; letter-spacing: 1px;
            color: #009; margin-top: 8px; margin-bottom: 8px; text-align: center; font-weight:bold;
        }
        .opcion {   display: grid; 
            justify-items: center; align-items: center;
            font-size:25px; letter-spacing: 1px;
            color: #009;
            margin-top: 8px;
            margin-bottom: 8px;
            text-align: center;
        }
        a.opcion:hover, a.opcion:visited {   
            display: grid; justify-items: center; align-items: center; font-size:25px; letter-spacing: 1px;
            color: #009; margin-top: 8px; margin-bottom: 8px; text-align: center; font-weight:bold;
        }
        
        .in_select {   
            display: grid; 
            justify-items: center; align-items: center;
            font-size:20px; letter-spacing: 1px; 
            background-color: #EEE;
            border: 2px solid #999;
            border-radius: 8px;
            margin-top: 8px;
            margin-bottom: 8px;
            padding: 5px;
        }
        .leyenda {
            height:auto;
	        width:100%;
	        display: grid;
	        grid-template-columns:  10px  auto  1fr  auto  10px;
            grid-template-areas: "  .     izq   .    der   .";
        }
        .izq { 
            grid-area: izq;
            display: grid; 
            justify-items: center; align-items: center;
            font-size:13px;
            color: #222;
            padding:0px; margin:0px
        }
        .der { 
            grid-area: der;
            display: grid; 
            justify-items: center; align-items: center;
            font-size:13px;
            color: #222;
            padding:0px; margin:0px
        }
        @media screen and (max-width: 790px) {
            .in_box18 {   
                width:345px;
            }
        }
/*============================================================================================  */