.app {
     max-width: 420px;
     margin: 0 auto;
     margin-top: 70px;
     margin-left: 200px;
 }

 .header {
     padding: 10px 0 0;
 }

 .time {
     font-size: var(--taille-titre-pc);
     text-align: center;
     margin-bottom: 8px;
 }

 .top-bar {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .content {
     padding: 16px 0;
 }

 h2 {
     font-size: var(--taille-titre-pc);
     font-weight: bold;
     margin-bottom: 4px;
 }

 .subtitle {
     color: var(--navrigt-primary-bg);
     font-size: var(--taille-text-pc);
     margin-bottom: 12px;
 }

 .search {
     width: 100%;
     padding: 10px;
     font-size: var(--taille-text-pc);
     border-radius: 8px;
     border: 1px solid var(--border-color);
     margin-bottom: 16px;
 }

 .account-list {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .account {
     display: flex;
     align-items: center;
     margin-bottom: 16px;
 }

 .account img {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     margin-right: 12px;
     object-fit: cover;
 }

 .account-info {
     align-items: center;
     display: flex;
     flex-direction: center;
 }

 .account-info strong {
     display: block;
     font-size: var(--taille-text-pc);
 }

 .account-info span {
     color: var(--text-color);
     font-size: var(--taille-text-pc);
 }

 

 /* Responsive : empile les colonnes sur mobile */
 @media (max-width: 768px) {
    .time {
            font-size: var(--taille-titre-mo);
        
        }

     .app {

         padding: 10px;
         margin-left: 0 !important;
     }
    h2 {
        font-size: var(--taille-titre-mo);
    
    }
        .subtitle {
            font-size: var(--taille-text-mo);
        }
.search {
   
    font-size: var(--taille-text-pc);
   
}
 .account-info strong {
     font-size: var(--taille-text-mo);
 }
 .account-info span {
     font-size: var(--taille-text-mo);
 }
 }