* { margin: 0; padding: 0; box-sizing: border-box; } :root { --body-color-fondo: "#fff"; --body-color-letra: "#000"; --color-bordes: "#000"; --transparente: "transparent"; } body { /* font-size: clamp(20px, 3vw, 30px); */ font-family: Arial, Helvetica, sans-serif; margin: 0 auto; background-color: #e0e0e0; color: #000000cb; width: 100%; } h4 { text-align: center; } .ajustes { display: flex; justify-content: center; align-items: start; flex-wrap: wrap; height: auto; gap: 20px; } .segundo-cont { display: flex; flex-direction: column; justify-content: center; align-items: center; flex-wrap: wrap; gap: 20px; } .segundo-cont .salida { margin: 0 10px; } .ajustes-header { margin-top: 30px; display: flex; flex-direction: column; justify-content: center; gap: 5px; } section.seccion-botones-bottom { padding: 5px 0; display: flex; justify-content: space-evenly; } textarea { margin: 20px 0; width: 100%; padding: 5px; font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; outline: none; } .ajustes-header > button { top: 180px; right: 10px; } .ajustes-header > .guardar-presupuesto { top: 180px; right: 40px; } .ajustes-header > .imprimir-presupuesto{ top: 181px; right: 70px; } .ajustes-header > .ver-presupuestos{ top: 215px; right: 10px; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } label { display: flex; align-items: center; text-transform: capitalize; } label>button { margin: 0 5px; } input { text-align: center; width: 24px; height: 24px; background-color: transparent; border: none; } input::placeholder { color: #000; } .botones-container button { border: none; background-color: transparent; border-radius: 15px; box-shadow: 0 0 1px 1px inset rgba(0, 0, 0, 0.5); } .botones-container button:active { box-shadow: none; } button:active svg path { fill: transparent; } input { font-size: 1.2rem; cursor: pointer; } button, select, textarea { cursor: pointer; } select { margin-left: 5px; width: 100%; } #metros { width: 80px; } .botones-container { display: grid; grid-template-columns: repeat(5, 1fr); /* 5 columnas */ gap: 5px; /* Espacio entre botones */ margin-bottom: 5px; } .boton-copiar { right: 0; } .botones-container button { width: 100%; font-size: 1rem; padding: 1px 0; } .section-container { display: flex; align-items: center; gap: 5px; } #output_detalles { font-size: 1.3rem; } .precio { font-weight: bold; margin: 10px 0; } .pedido p { margin: 2px 0; } .ajustes-header, .article.pedido, article.detalles, .salida article { box-shadow: 0 0 1px 1px inset rgba(0, 0, 0, 0.5); padding: 10px; /* border-radius: 9px; */ } .borde-js { box-shadow: 0 0 1px 1px inset rgba(0, 0, 0, 0.5); padding: 10px; /* border-radius: 9px; */ } .salida button { margin-bottom: 10px; top: 5px; right: 5px; font-size: .7rem; padding: 3px; } button { display: flex; align-items: center; justify-content: center; padding: 0; border: none; background: none; } button img { width: 24px; /* Ancho deseado del SVG */ height: 24px; /* Alto deseado del SVG */ } select { background-color: transparent; border-radius: 3px; } .cliente input { text-align: left; margin: 5px; border-radius: 3px; padding: 2px; width: 100%; background-color: rgb(255, 255, 255); } .cliente input::placeholder { color: rgb(187, 187, 187); } .presupuestos-guardados { margin-top: 20px; overflow-x: auto; } .presupuestos-guardados table { border-collapse: collapse; text-align: center; } .presupuestos-guardados table tr td { padding: 5px 10px; } .presupuestos-guardados table tr td:nth-child(6) { text-align: left; } .presupuestos-guardados table tr th { padding: 5px 10px; } /* Estilos para filas pares */ .presupuestos-guardados table tr:nth-child(even) { transition: 1s; background-color: #e7e7e7; } /* Estilos para filas impares */ .presupuestos-guardados table tr:nth-child(odd) { transition: 1s; background-color: rgb(208, 208, 208); } .detalles-contenedor { width: max-content; } footer { padding: 50px 0; text-align: center; } table button { display: inline; margin: 0 5px; } svg { width: 1.2rem; } input[type='radio'] { appearance: none; border: none; background-color: #ffffff; border-radius: 50%; } input[type='radio'].galvanizado:checked{ appearance: none; background-color: #828282; border: none; border-radius: 50%; } input[type='radio'].verde:checked{ appearance: none; background-color: #2dd100; border: none; border-radius: 50%; } input[type='radio'].Pendiente:checked{ appearance: none; background-color: #f99b04; border: none; border-radius: 50%; } input[type='radio'].Confirmado:checked{ appearance: none; background-color: #2dd100; border: none; border-radius: 50%; } .contenedor-expirado { width: 100vw; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; } .pagina-de-impresion { z-index: 10; display: flex; align-items: center; justify-content: center; flex-direction: column; background-color: #fff; gap: 20px; width: 100%; height: 100%; display: none; } .pagina-de-impresion article { padding-left: 50px; width: 800px; } .ocultar { display: none; } .papelera-litle svg { width: 16px; height: 16px; } #salida-precio-calculadora { text-align: center; margin: 3px 0; font-weight: 600; } @media only screen and (min-width: 1211px) { .segundo-cont { align-items: start; flex-wrap: wrap; gap: 20px; margin-top: 30px; } }