Chat and CSS player aula

assets/css/stylesheet.css

@@ -89,6 +89,8 @@ h1, h2, h3, h4, h5, h6 {
     border-radius: 30px;
 
     box-shadow: -10px 5px 15px var(--primary-color);
+
+    width: 30vw;
 }
 
 /* ================================================================================================================================== */
@@ -568,7 +570,8 @@ h1, h2, h3, h4, h5, h6 {
    margin: 15px;
 }
 
-
+/* ================================================================================================================================== */
+/* CSS da pagina Player localizada em _includes/layouts/dashboard.php  */
 
 .player-off{
     height: 80vh;
@@ -639,7 +642,7 @@ display: flex;
 flex-direction: column;
 flex-grow: 1;
 margin: 15px;
-background-color: #0b1a33;
+background-color: var(--background-color);
 border-radius: 10px;
 color: #fff;
 }
@@ -666,7 +669,7 @@ color: #fff;
     flex-grow: 1;
     overflow-y: auto;
     padding: 10px;
-    background-color: #0b1a33;
+    background-color: var(--primary-color);
 }
 
 .chat-line {
@@ -707,3 +710,71 @@ color: #fff;
     outline: none;
     background-color: #243b65;
 }
+
+.page-aula{
+    font-family: var(--font-family);
+}
+
+.detals-aula{
+    display: flex;
+    flex-direction: row;
+    margin: 15px;
+    justify-content: space-between;
+
+}
+
+.info-aula{
+    display: flex;
+    flex-direction: column;
+}
+
+.info-aula h1, h2, h3{
+    font-family: var(--font-family);
+}
+
+.download .button {
+    display: inline-block;
+    font-weight: 600;
+    padding: 0.5em 1em;
+    border-radius: 4px;
+    border: 2px solid transparent;
+    background-color: #48c774; /* Cor verde */
+    color: #fff; /* Texto branco */
+    text-align: center;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: background-color 0.2s ease, border-color 0.2s ease;
+}
+
+.download  .button:hover {
+    background-color: #3ec46d; /* Cor verde mais escura no hover */
+}
+
+.download  .button:active {
+    background-color: #36a65b; /* Cor ainda mais escura ao clicar */
+}
+
+.download  .button:focus {
+    border-color: #32a852; /* Borda verde ao focar */
+    outline: none; /* Remove o outline padrão do navegador */
+    box-shadow: 0 0 0 0.125em rgba(72, 199, 116, 0.25); /* Sombra ao focar */
+}
+
+.content-aula{
+    margin: 25px;
+    font-family: var(--font-family);
+}
+.content-aula li{
+    margin: 15px;
+}
+.content-aula a{
+    color: #007bff; /* Cor do link, você pode escolher outra cor que combine com o design */
+    text-decoration: none; /* Remove o sublinhado do link */
+    font-weight: bold; /* Deixa o texto mais destacado */
+    border-bottom: 2px solid transparent; /* Adiciona uma borda inferior invisível */
+    transition: border-color 0.3s ease; /* Transição suave para o hover */
+
+}
+.content-aula a:hover {
+    border-bottom-color: #007bff; /* Mostra a borda inferior ao passar o mouse */
+}