modificados los colores segun telegram

src/main/resources/static/assets/css/presupuestador.css

@@ -25,7 +25,7 @@
 
 /* === Borde visible cuando está seleccionada === */
 .image-container.selected {
-  border-color: #687cfe;
+  border-color: #92b2a7;
 }
 
 /* === Imagen interna === */
@@ -157,16 +157,16 @@
   min-height: 180px;
   padding: 1rem 0.75rem;
   border-radius: 0.5rem;
-  color: #4b7bec;
-  border: 1px solid #4b7bec;
+  color: #92b2a7;
+  border: 1px solid #92b2a7;
   transition: all 0.3s ease-in-out;
 }
 
 /* ESTILO CUANDO ESTÁ MARCADO */
 .btn-check-service:checked+.btn {
-  background-color: #4b7bec;
+  background-color: #92b2a7;
   color: #ffffff !important;
-  border-color: #4b7bec;
+  border-color: #92b2a7;
 }
 
 /* Forzamos el color blanco en los subelementos */
@@ -180,7 +180,7 @@
 .btn-check-service+.btn .service-title,
 .btn-check-service+.btn .service-desc,
 .btn-check-service+.btn .service-price {
-  color: #4b7bec;
+  color: #92b2a7;
 }
 
 /* ribbon-service */
@@ -199,7 +199,7 @@
   display: block;
   width: 120px;
   padding: 5px 0;
-  background: #f25c5c;
+  background: #e5745b;
   color: white;
   font-size: 12px;
   text-align: center;
@@ -213,7 +213,7 @@
 
 /* ===== Tiradas (pricing cards) ===== */
 .tirada-card {
-  --il-accent: #4b7bec;
+  --il-accent: #92b2a7; /* verde grisáceo */
   --radius: 18px;
   --sel-scale-y: 1.12;
   /* cuánto más alta la seleccionada (crece arriba y abajo) */
@@ -223,24 +223,22 @@
   --arc-h: 190px;
   --arc-y: -23px;
   /* tu valor */
-  --arc-stop: 74%;
+  --arc-stop: 65%;
 
   border: 1px solid #e9ecef;
   border-radius: var(--radius);
   background-color: #fff;
   background-image: radial-gradient(var(--arc-w) var(--arc-h) at 50% var(--arc-y),
-      rgba(75, 126, 236, .24) 0 var(--arc-stop),
+      rgba(146, 178, 167, .24) 0 var(--arc-stop),
       transparent calc(var(--arc-stop) + 1%));
 
   padding: 1.25rem 1.25rem 1rem;
   text-align: center;
   position: relative;
   height: 100%;
-  box-shadow: 0 4px 14px rgba(17, 24, 39, .06);
+  box-shadow: 0 4px 14px rgba(146, 178, 167, .12);
   overflow: hidden;
-  /* integra la línea inferior */
   transform-origin: center center;
-  /* ⟵ crecer hacia arriba y hacia abajo */
   will-change: transform;
   transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
 }
@@ -255,16 +253,21 @@
   font-weight: 700;
   letter-spacing: .04em;
   font-size: .9rem;
-  color: #4b7bec;
+  color: var(--il-accent);
   text-transform: uppercase;
 }
 
 .tirada-card .price-big {
-  font-size: 2rem;
+  font-size: 1.15rem;
   font-weight: 800;
   line-height: 1.1;
   margin: .35rem 0 .15rem;
-  color: #4b7bec;
+  color: var(--il-accent);
+}
+
+.tirada-card .price-total {
+  font-size: 1.8rem;
+  color: #92b2a7;
 }
 
 .tirada-card .per {
@@ -294,22 +297,20 @@
   transition: background .2s ease, color .2s ease;
 }
 
-/* ===== Seleccionada (más alta en Y, sin elevar; crece arriba y abajo) ===== */
+/* ===== Seleccionada ===== */
 .tirada-card.selected {
   transform: scaleY(var(--sel-scale-y));
-  /* ⟵ crecimiento simétrico vertical */
   z-index: 2;
-  box-shadow: 0 18px 48px rgba(75, 126, 236, .32);
+  box-shadow: 0 18px 48px rgba(146, 178, 167, .32);
   border-color: var(--il-accent);
 
   /* círculo sólido */
   background-image: radial-gradient(var(--arc-w) var(--arc-h) at 50% var(--arc-y),
-      #4b7bec 0 var(--arc-stop),
+      #92b2a7 0 var(--arc-stop),
       transparent calc(var(--arc-stop) + 1%));
 }
 
 .tirada-card.selected:hover {
-  /* evita que :hover base anule la escala */
   transform: scaleY(var(--sel-scale-y));
 }
 
@@ -325,14 +326,13 @@
   color: #fff;
 }
 
-/* ===== Línea inferior integrada (siempre visible en NO seleccionadas) ===== */
+/* Línea inferior integrada (solo en no seleccionadas) */
 .tirada-card:not(.selected)::after {
   content: "";
   position: absolute;
   left: 1px;
   right: 1px;
   bottom: 1px;
-  /* dentro del borde */
   height: 8px;
   background: var(--il-accent);
   border-bottom-left-radius: calc(var(--radius) - 1px);
@@ -347,4 +347,64 @@
 /* Oculta el radio */
 .tirada-card input[type="radio"] {
   display: none;
+}
+
+
+
+.nav-link.active .bg-soft-primary {
+  background-color: #ffffff33 !important; /* #4c5c63 al 20% */
+}
+
+.nav-link.active .text-primary {
+  color: #ffffff !important; /* #4c5c63 al 20% */
+}
+
+.nav-link:not(.active) .bg-soft-primary {
+  background-color: #4c5c6366  !important; /* #4c5c63 al 20% */
+}
+
+.nav-link:not(.active) .text-primary {
+  color: #000000 !important; /* #4c5c63 al 20% */
+}
+
+/* base */
+.btn-service-option {
+  background-color: rgba(146, 178, 167, 0.2);
+  color: #92b2a7;
+  border: 1px solid #92b2a7;
+  transition: all .3s ease-in-out;
+}
+
+/* hover no seleccionado */
+.btn-check-service + .btn-service-option:hover {
+  background-color: rgba(146, 178, 167, 0.3);
+  color: #92b2a7;
+}
+
+/* seleccionado */
+.btn-check-service:checked + .btn-service-option {
+  background-color: #92b2a7;
+  color: #fff;
+  border-color: #92b2a7;
+}
+
+/* hover estando seleccionado (que no se aclare) */
+.btn-check-service:checked + .btn-service-option:hover {
+  background-color: #92b2a7;
+  color: #fff;
+}
+
+/* heredan color para textos internos */
+.btn-service-option .service-title,
+.btn-service-option .service-desc,
+.btn-service-option .service-price {
+  color: inherit;
+}
+
+.form-switch-presupuesto .form-check-input:checked {
+  border-color: #92b2a7;
+}
+
+.form-switch-custom.form-switch-presupuesto .form-check-input:checked::before {
+  color: #92b2a7;
 }