Atualização do calendario

calendario.css

@@ -44,13 +44,17 @@ h3 {
 }
 
 #calendario {
-    flex: 1;
     padding-top: 60px;
     display: flex;
     flex-direction: column;
     gap: 16px;
 }
 
+/* REMOVE o flex:1 se tiver */
+#calendario {
+    flex: unset;
+}   
+
 .calendariotop {
     display: flex;
     align-items: center;
@@ -58,6 +62,7 @@ h3 {
 }
 
 #mes {
+font-family: 'Inter', sans-serif;
     color: white;
     font-size: 22px;
     font-weight: 600;
@@ -130,7 +135,6 @@ h3 {
     transform: translateX(-50%);
 }
 
-/* COR DOS DIAS DE OUTRO MÊS (CORRIGIDO) */
 .calendariodia td.outromes {
     color: rgba(150, 150, 255, 1);
 }
@@ -147,3 +151,61 @@ h3 {
 .calendariodia td.empty::after {
     display: none;
 }
+.calendariodia td.outromes::after {
+    background: rgba(255, 255, 255, 0.5);
+}
+/* ===== AGENDA ===== */
+
+.agenda {
+    margin-top: 10px;
+    color: white;
+    font-family: 'Inter', sans-serif;
+}
+
+.agenda-header {
+    font-size: 13px;
+    margin-bottom: 10px;
+    border-top: 1px solid rgba(255,255,255,0.2);
+    padding-bottom: 10px;
+    border-bottom: 1px solid rgba(255,255,255,0.2);
+    padding-top: 10px;
+}
+
+.evento {
+    position: relative;
+    padding-left: 14px;
+    margin-bottom: 12px;
+}
+
+.evento::before {
+    content: "";
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+    position: absolute;
+    left: 0;
+    top: 6px;
+}
+
+.evento.azul::before {
+    background: #00c2ff;
+}
+
+.evento.rosa::before {
+    background: #ff4fa3;
+}
+
+.hora {
+    font-size: 11px;
+    opacity: 0.8;
+}
+
+.titulo {
+    font-size: 13px;
+    font-weight: 500;
+}
+
+.link {
+    font-size: 11px;
+    color: #ffb3b3;
+}