/* apps/msn/theme.css */

/* --- 1. MSN Contact List (The App) --- */
.msn-app .window-content {
    background: #fff;
    display: flex; flex-direction: column;
}

.msn-cl-wrapper { display: flex; flex-direction: column; height: 100%; }

.msn-cl-header {
    height: 60px;
    background: linear-gradient(to bottom, #EBF3FA 0%, #D4E6F7 100%);
    border-bottom: 1px solid #A0C2E4;
    padding: 10px;
    display: flex; align-items: center;
}

.msn-avatar {
    width: 45px; height: 45px;
    background: #fff;
    border: 1px solid #99BBEE;
    border-radius: 4px;
    margin-right: 8px;
    box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}

.msn-name-block { display: flex; flex-direction: column; }
.msn-display-name { font-weight: bold; color: #224466; font-size: 13px; }
.msn-status-text { color: #6688AA; font-style: italic; font-size: 11px; margin-top: 2px; }

.msn-cl-toolbar {
    background: #F0F6FB;
    border-bottom: 1px solid #CDDDEE;
    padding: 4px;
}
.msn-cl-toolbar button { font-size: 11px; cursor: pointer; }

.msn-cl-body {
    flex: 1; overflow-y: auto;
    background: #ffffff; padding: 5px;
}

.msn-cl-footer {
    height: 25px;
    background: #EBF3FA;
    border-top: 1px solid #A0C2E4;
    display: flex; align-items: center; justify-content: center;
}

/* Buddy Items */
.msn-buddy {
    display: flex; align-items: center;
    padding: 4px; border: 1px solid transparent;
    cursor: pointer; margin-bottom: 2px;
}
.msn-buddy:hover { background-color: #FDFCDC; border-color: #E2D996; }

.msn-buddy-icon {
    width: 14px; height: 14px;
    background: #00D000; /* Green Man */
    border-radius: 2px; margin-right: 6px;
    box-shadow: inset 1px 1px 0 rgba(255,255,255,0.4);
}
.msn-buddy-name { color: #000; font-size: 11px; }
.msn-buddy-status { color: #888; font-size: 10px; margin-left: auto; }


/* --- 2. MSN Chat Window (Optimized) --- */
.msn-window .window-content {
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 11px;
    height: 100%;
    display: flex; 
    flex-direction: column;
}

.msn-chat-container {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;  /* Prevent horizontal scroll */
    padding: 10px;
    background: #fff;
    box-sizing: border-box;  /* Include padding in width calculation */
}

.msn-message-block {
    margin-bottom: 5px;
    word-wrap: break-word;  /* Break long words */
    overflow-wrap: break-word;  /* Modern browsers */
    max-width: 100%;  /* Don't exceed container */
}

.msn-message-header {
    color: #0b5e98;
    font-size: 11px;
    margin-bottom: 2px;
}

.msn-sender { 
    font-weight: normal; 
}

.msn-time { 
    color: #888; 
    font-size: 0.9em; 
    margin-left: 5px; 
}

.msn-message-body {
    padding-left: 5px;
    word-wrap: break-word;
    overflow-wrap: break-word;
    font-size: 12px;
    color: #000;
}

/* Links */
.msn-message-body a { color: #0000ff; text-decoration: underline; cursor: pointer; }
.msn-message-body a:hover { color: #0000aa; }