/* ARTIZS.SAY v0.5.34 — Room Activity, Follow Room, Notifications */
.room-directory{padding-bottom:10px;overflow-y:auto}
.room-directory-group{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.room-directory-group:first-child{margin-top:0}
.room-directory-heading{display:flex;align-items:center;justify-content:space-between;padding:14px 9px 6px;font-size:8px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#8f97a4}
.room-directory-heading span:last-child{font-size:8px;letter-spacing:0;color:#a7adb7}
.room-directory-group.is-empty{display:none}
.room-item .room-copy strong{display:flex;align-items:center;gap:6px;min-width:0}
.room-live-indicator{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;padding:2px 6px;border-radius:999px;background:#edf8f1;color:#287a48;font-size:7px;font-weight:900;letter-spacing:0;text-transform:none}
.room-live-indicator::before{content:"";width:5px;height:5px;border-radius:50%;background:#2fb266;box-shadow:0 0 0 2px rgba(47,178,102,.12)}
.room-following-mark{font-size:9px;color:#082d58;line-height:1}
.room-item.active .room-live-indicator{background:rgba(255,255,255,.13);color:#fff}
.room-item.active .room-live-indicator::before{background:#64dc91;box-shadow:none}
.room-item.active .room-following-mark{color:#fff}
.room-search-hidden{display:none!important}

.room-header-actions .room-follow-button{height:42px;min-width:118px;padding:0 14px;margin:0;border:1px solid #dbe3ec;border-radius:14px;background:#fff;color:#082d58;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;cursor:pointer;transition:background .14s,border-color .14s,color .14s}
.room-header-actions .room-follow-button:hover{background:#f5f8fb;border-color:#cbd7e4}
.room-header-actions .room-follow-button.is-following{background:#eef4fb;border-color:#aec4dc;color:#082d58}
.room-header-actions .room-follow-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.room-header-actions .room-follow-button.is-following svg{fill:#082d58;stroke:#082d58}
.room-header-actions .room-follow-button.hidden{display:none!important}

.notification-trigger{position:relative}
.notification-trigger svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.notification-badge{position:absolute;right:-4px;top:-5px;min-width:17px;height:17px;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#e24949;color:#fff;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:900;line-height:1}
.notification-badge.hidden{display:none}
.notification-popover{position:fixed;z-index:260;top:76px;right:22px;width:min(390px,calc(100vw - 28px));max-height:min(680px,calc(100vh - 92px));display:flex;flex-direction:column;background:#fff;border:1px solid #e6e9ee;border-radius:20px;box-shadow:0 22px 70px rgba(15,23,42,.18);overflow:hidden}
.notification-popover.hidden{display:none}
.notification-head{display:flex;align-items:flex-start;justify-content:space-between;padding:18px 18px 10px}.notification-head small{display:block;font-size:8px;font-weight:900;letter-spacing:.14em;color:#98a0ab}.notification-head h3{margin:3px 0 0;font-size:19px;color:#101828}.notification-close{width:32px;height:32px;border:0;border-radius:10px;background:#f4f6f8;color:#475467;font-size:20px;cursor:pointer}
.notification-actions{display:flex;justify-content:flex-end;padding:0 18px 10px}.notification-actions button{border:0;background:transparent;color:#082d58;font-size:10px;font-weight:900;cursor:pointer;padding:5px 0}
.notification-list{overflow:auto;min-height:90px;max-height:390px;border-top:1px solid #eef1f4;border-bottom:1px solid #eef1f4}
.notification-empty{padding:34px 22px;text-align:center;color:#8b94a3;font-size:11px}
.notification-item{width:100%;border:0;border-bottom:1px solid #f0f2f5;background:#fff;padding:13px 16px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:10px;text-align:left;cursor:pointer;color:#1f2937}.notification-item:last-child{border-bottom:0}.notification-item:hover{background:#f8fafc}.notification-item.is-unread{background:#f4f8fd}.notification-item-icon{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#eaf1f9;color:#082d58;font-size:17px}.notification-item-copy{min-width:0}.notification-item-copy strong{display:block;font-size:11px;line-height:1.35;color:#142033}.notification-item-copy span{display:block;margin-top:3px;font-size:10px;line-height:1.45;color:#657080;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notification-item-copy small{display:block;margin-top:4px;font-size:8px;color:#9aa2ad}.notification-unread-dot{width:7px;height:7px;margin-top:8px;border-radius:50%;background:#2f70b7}
.notification-settings{padding:13px 16px 16px;display:grid;gap:8px;background:#fbfcfd}.notification-browser-button{width:100%;min-height:38px;border:0;border-radius:11px;background:#082d58;color:#fff;font-size:10px;font-weight:900;cursor:pointer}.notification-browser-button:hover{background:#123d6c}.notification-browser-button.is-enabled{background:#26834f}.notification-settings label{display:flex;align-items:center;gap:8px;font-size:9px;color:#5d6674;cursor:pointer}.notification-settings input{accent-color:#082d58}

html[data-theme="dark"] .room-live-indicator{background:#163522;color:#8de5ae}
html[data-theme="dark"] .room-following-mark{color:#b9d1ec}
html[data-theme="dark"] .room-header-actions .room-follow-button{background:#151b24;border-color:#344052;color:#e5edf6}
html[data-theme="dark"] .room-header-actions .room-follow-button:hover,html[data-theme="dark"] .room-header-actions .room-follow-button.is-following{background:#1d2938;border-color:#47617b;color:#fff}
html[data-theme="dark"] .room-header-actions .room-follow-button.is-following svg{fill:#e5edf6;stroke:#e5edf6}
html[data-theme="dark"] .notification-badge{border-color:#111827}
html[data-theme="dark"] .notification-popover{background:#151b24;border-color:#2a3442;box-shadow:0 22px 70px rgba(0,0,0,.45)}
html[data-theme="dark"] .notification-head h3,html[data-theme="dark"] .notification-item-copy strong{color:#f2f4f7}
html[data-theme="dark"] .notification-close{background:#222b37;color:#d0d5dd}
html[data-theme="dark"] .notification-list{border-color:#2b3542}
html[data-theme="dark"] .notification-item{background:#151b24;border-color:#252e3a;color:#eef2f6}
html[data-theme="dark"] .notification-item:hover,html[data-theme="dark"] .notification-item.is-unread{background:#1c2633}
html[data-theme="dark"] .notification-item-icon{background:#213248;color:#b8d2ee}
html[data-theme="dark"] .notification-item-copy span{color:#a9b2bf}
html[data-theme="dark"] .notification-settings{background:#111720}

@media(max-width:820px){
  .room-header-actions{gap:6px!important}
  .room-header-actions .room-follow-button{min-width:42px!important;width:42px!important;height:42px!important;padding:0!important;font-size:0!important}
  .room-header-actions .room-follow-button svg{width:18px;height:18px}
  .notification-popover{top:64px;right:10px;width:calc(100vw - 20px);max-height:calc(100vh - 76px);border-radius:17px}
}