/* style.css v1.5.0 (Notification Dropdown Height Fix) */
/* Přidána media query pro úpravu max-height dropdownu na menších obrazovkách. */

body {
    font-family: 'Inter', sans-serif;
}

/* Skrytí scrollbaru v těle modalu */
.modal-body::-webkit-scrollbar {
    display: none;
}
.modal-body {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Animace pro zobrazení prvků */
.fade-in {
    animation: fadeIn 0.3s ease-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

/* Třída pro skrytí prvků (řízeno JS) */
.hidden {
    display: none;
}

/* Styly pro komentáře v modalu (chat-like) */
#modal-comments-list .comment-bubble {
    max-width: 85%;
    word-wrap: break-word;
}
#modal-comments-list .comment-bubble-me {
    background-color: #DBEAFE; /* bg-blue-100 */
    color: #1E40AF; /* text-blue-800 */
    align-self: flex-end;
}
#modal-comments-list .comment-bubble-other {
    background-color: #F3F4F6; /* bg-gray-100 */
    color: #1F2937; /* text-gray-800 */
    align-self: flex-start;
}

/* Styly pro INTERNÍ komentáře */
.internal-comment-bubble {
    background-color: #FEF3C7; /* bg-amber-100 */
    color: #92400E; /* text-amber-800 */
    border-left: 3px solid #F59E0B; /* border-amber-500 */
    padding-left: 0.75rem; /* Přidá odsazení kvůli border */
}

/* Indikátor typu interního komentáře (např. ikona oka) - volitelné */
.internal-comment-indicator {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-right: 0.25rem;
    color: #B45309; /* text-amber-700 */
    vertical-align: text-bottom;
}

/* Indikátor NEPŘEČTENÝCH zpráv na kartě tiketu */
.unread-indicator {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    background-color: #2563EB; /* bg-blue-600 */
    border-radius: 9999px; /* rounded-full */
    margin-left: 0.5rem; /* ml-2 */
    vertical-align: middle; /* Zajistí zarovnání s textem */
    flex-shrink: 0; /* Zabrání zmenšení v flex kontejneru */
}

/* Odznak pro počet notifikací (u zvonečku) */
.notification-badge {
    display: inline-flex; /* Použijeme inline-flex pro lepší zarovnání */
    align-items: center;
    justify-content: center;
    min-width: 1.25rem; /* w-5 */
    height: 1.25rem; /* h-5 */
    padding-left: 0.25rem; /* px-1 */
    padding-right: 0.25rem;
    background-color: #EF4444; /* bg-red-500 */
    color: white;
    font-size: 0.75rem; /* text-xs */
    font-weight: 600; /* font-semibold */
    line-height: 1; /* Upraveno pro flex zarovnání */
    border-radius: 9999px; /* rounded-full */
    position: absolute; /* Absolutní pozice vůči rodiči */
    top: -0.25rem; /* -top-1 */
    right: -0.25rem; /* -right-1 */
}


/* Dropdown notifikací */
#notification-dropdown {
    transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}
#notification-list { /* Změněno z #notification-dropdown ul */
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 15rem; /* Výchozí max-height (cca 6 položek) */
    overflow-y: auto;
}
#notification-dropdown li a {
    display: block;
    padding: 0.75rem 1rem; /* py-3 px-4 */
    font-size: 0.875rem; /* text-sm */
    color: #374151; /* text-gray-700 */
    transition: background-color 0.15s ease-in-out;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#notification-dropdown li a:hover {
    background-color: #F3F4F6; /* hover:bg-gray-100 */
}
#notification-dropdown li a strong {
    font-weight: 600; /* font-semibold */
    color: #1F2937; /* text-gray-900 */
}

/* Aktivní stav zvonečku, pokud jsou notifikace */
#notification-bell-btn.has-notifications {
    color: #2563EB; /* text-blue-600 */
}

/* Media query pro menší výšky obrazovky */
@media (max-height: 700px) {
    #notification-list {
        max-height: 10rem; /* Snížená max-height (cca 4 položky) */
    }
}
