added filter and grafics

src/components/reporteGraficas/Reporte.module.css

@@ -1,76 +1,92 @@
-.container{
+.container {
     width: 100%;
     margin: 0 auto;
-    padding:20px;
-    background:white;
-    border-radius:10px;
-    box-shadow:0 2px 8px rgba(0,0,0,0.08);
-    font-family:Arial, Helvetica, sans-serif;
-    font-size:14px;
+    padding: 20px;
+    background: white;
+    border-radius: 10px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 14px;
 }
 
-.title{
-    font-size:18px;
-    margin-bottom:15px;
+.title {
+    font-size: 18px;
+    margin-bottom: 15px;
 }
 
-.label{
-    font-size:13px;
-    color:#444;
+.label {
+    font-size: 13px;
+    color: #444;
 }
 
-.listaContainer{
-    margin-top:20px;
+.listaContainer {
+    margin-top: 20px;
 }
 
-.subtitle{
-    font-size:14px;
-    margin-bottom:10px;
+.subtitle {
+    font-size: 14px;
+    margin-bottom: 10px;
 }
 
-.empty{
-    font-size:13px;
-    color:#777;
+.empty {
+    font-size: 13px;
+    color: #777;
 }
 
-.lista{
-    display:flex;
-    flex-wrap:wrap;
-    gap:8px;
+.lista {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
 }
 
-.chip{
-    display:flex;
-    align-items:center;
-    background:#f1f3f5;
-    border-radius:20px;
-    padding:5px 10px;
-    font-size:13px;
+.chip {
+    display: flex;
+    align-items: center;
+    background: #f1f3f5;
+    border-radius: 6px;
+    padding: 5px 10px;
+    font-size: 13px;
+    text-align: start;
 }
 
-.remove{
-    border:none;
-    background:none;
-    margin-left:6px;
-    cursor:pointer;
-    color:#777;
+.remove {
+    border: none;
+    background: none;
+    margin-left: 6px;
+    cursor: pointer;
+    color: #777;
 }
 
-.remove:hover{
-    color:#c0392b;
+.remove:hover {
+    color: #c0392b;
 }
 
-.button{
-    margin-top:20px;
-    padding:8px 14px;
-    border:none;
-    border-radius:6px;
-    background:#2563eb;
-    color:white;
-    font-size:13px;
-    cursor:pointer;
+.button {
+    margin-top: 20px;
+    padding: 8px 14px;
+    border: none;
+    border-radius: 6px;
+    background: #2563eb;
+    color: white;
+    font-size: 13px;
+    cursor: pointer;
 }
 
-.button:hover{
-    background:#1d4ed8;
+.button:hover {
+    background: #1d4ed8;
+}
+
+.graficas {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.filtro {
+    display: flex;
+    gap: 10px;
+}
+
+.containerSelection {
+    width: 100%;
+    min-width: 200px
 }