/* =============================================
     Dropdown menu
     ============================================= */
     .menu-trigger {
        position: relative;
        display: inline-block;
    }
    
    .dropdown {
        position: absolute;
        top: calc(100% + 6px);
        left: 0;
        min-width: 200px;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
        z-index: 200;
        padding: 4px;
    }
    
    .dropdown__item {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 9px 12px;
        border: none;
        border-radius: var(--radius-sm);
        background: transparent;
        font-family: var(--font);
        font-size: 13px;
        color: var(--color-text);
        cursor: pointer;
        text-align: left;
        transition: background var(--transition);
    }
    
    .dropdown__item:hover { background: rgba(0,0,0,.05); }
    .dropdown__item svg   { width: 16px; height: 16px; flex-shrink: 0; color: var(--color-text-muted); }
    
    .dropdown__divider {
        height: 1px;
        background: var(--color-border);
        margin: 4px 0;
    }
    
    /* =============================================
         Admin Panel
         ============================================= */
    .admin-panel {
        display: flex;
        flex-direction: column;
        height: 100%;
        gap: 0;
    }
    
    .admin-panel__header {
        padding: 4px 0 12px;
    }
    
    .admin-panel__title {
        font-size: 16px;
        font-weight: 700;
        color: var(--color-text);
    }
    
    .admin-panel__tabs {
        margin-bottom: 12px;
    }
    
    .admin-panel__body {
        flex: 1;
        overflow-y: auto;
    }
    
    /* =============================================
         Admin list rows
         ============================================= */
    .admin-toolbar {
        margin-bottom: 10px;
    }
    
    .admin-list {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    
    .admin-row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        border-radius: var(--radius-sm);
        background: var(--color-surface-2);
        border: 1px solid var(--color-border);
    }
    
    .admin-row--disabled { opacity: .5; }
    
    .admin-row__color {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        flex-shrink: 0;
    }
    
    .admin-row__name {
        flex: 1;
        font-size: 13px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .admin-row__meta {
        font-size: 11px;
        color: var(--color-text-muted);
        flex-shrink: 0;
    }
    
    .admin-row__action {
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        padding: 5px;
        color: var(--color-text-muted);
    }
    
    .admin-row__action svg { width: 14px; height: 14px; }
    
    /* =============================================
         Admin form
         ============================================= */
    .admin-form {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding-top: 4px;
    }
    
    .admin-form__back {
        align-self: flex-start;
        margin-bottom: 8px;
    }
    
    .admin-form__title {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 16px;
        color: var(--color-text);
    }
    
    .admin-form__actions {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 8px;
    }
    
    /* Color picker row */
    .color-row {
        display: flex;
        align-items: center;
        gap: 8px;
    }
    
    .color-picker {
        width: 40px;
        height: 36px;
        border: 1.5px solid var(--color-border);
        border-radius: var(--radius-sm);
        padding: 2px;
        cursor: pointer;
        background: none;
    }
    
    
    
    /* =============================================
         Chat Header (col2 top)
         ============================================= */
    .chat-header {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-height: 36px;
    }
    
    .chat-header__name {
        flex: 1;
        font-size: 15px;
        font-weight: 700;
        color: var(--color-text);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding-left: 18px;
    }
    
    .chat-header__menu {
        flex-shrink: 0;
    }
    
    /* =============================================
         Chat placeholder
         ============================================= */
    .chat-placeholder {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        color: var(--color-text-muted);
        font-size: 13px;
    }
    
    /* =============================================
         Group Settings
         ============================================= */
    .gs {
        display: flex;
        flex-direction: column;
        gap: 20px;
        position: relative;
    }
    
    .gs__section {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
    
    .gs__section-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    
    .gs__section-title {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        color: var(--color-text-muted);
    }
    
    .gs__field-row {
        display: flex;
        align-items: center;
        gap: 6px;
    }
    
    .gs__field-row .form-field__input {
        flex: 1;
        margin: 0;
    }
    
    /* Member list */
    .gs__member-list {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    
    .gs__member {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 8px;
        border-radius: var(--radius-sm);
        transition: background var(--transition);
        position: relative;
    }
    
    .gs__member:hover { background: rgba(0,0,0,.04); }
    
    .gs__member-name {
        flex: 1;
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .gs__manager-badge {
        color: #f59e0b;
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }
    .gs__manager-badge svg { width: 14px; height: 14px; fill: #f59e0b; stroke: #f59e0b; }
    
    .gs__member-menu-btn {
        flex-shrink: 0;
        width: 26px;
        height: 26px;
        padding: 4px;
        opacity: 0;
        transition: opacity var(--transition);
    }
    .gs__member:hover .gs__member-menu-btn { opacity: 1; }
    
    .gs__member-dropdown {
        position: absolute;
        right: 0;
        top: calc(100% + 2px);
        min-width: 180px;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
        z-index: 100;
        padding: 4px;
    }
    
    /* Selectable members (add overlay) */
    .gs__member--selectable {
        cursor: pointer;
    }
    
    .gs__check {
        flex-shrink: 0;
        width: 16px;
        height: 16px;
        accent-color: var(--color-primary);
    }
    
    .gs__dept-tag {
        font-size: 11px;
        color: var(--color-text-muted);
        white-space: nowrap;
    }
    
    /* Add overlay */
    .gs__overlay {
        position: absolute;
        inset: 0;
        background: var(--color-surface);
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 4px 0;
        z-index: 50;
        border-radius: var(--radius-md);
    }
    
    .gs__overlay-header {
        padding: 0 8px;
    }
    
    .gs__overlay-actions {
        display: flex;
        gap: 8px;
        padding: 0 8px;
        margin-top: auto;
    }
    
    /* =============================================
         Dropdown right-aligned
         ============================================= */
    .dropdown--right {
        left: auto;
        right: 0;
    }
    
    /* =============================================
         Group settings member avatar
         ============================================= */
    .gs__member-avatar {
        display: inline-flex;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: var(--color-bg);
        border: 2px solid var(--color-border);
        flex-shrink: 0;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    
    /* =============================================
         Member list (col3 default view)
         ============================================= */
    .member-list {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    
    .member-row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 8px;
        border-radius: var(--radius-sm);
    }
    
    .member-row__avatar {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: var(--color-bg);
        border: 2px solid var(--color-border);
        flex-shrink: 0;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .member-row__name {
        flex: 1;
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .member-row__manager {
        width: 14px;
        height: 14px;
        color: #f59e0b;
        flex-shrink: 0;
    }
    .member-row__manager svg { width: 14px; height: 14px; fill: #f59e0b; stroke: #f59e0b; }
    
    /* =============================================
         Add members overlay (абсолютный, поверх middle)
         ============================================= */
    .gs-overlay {
        position: absolute;
        inset: 0;
        background: var(--color-surface);
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 8px;
        z-index: 50;
    }
    
    .gs-overlay__header { padding: 0 0 4px; }
    
    .gs-overlay__actions {
        display: flex;
        gap: 8px;
        margin-top: auto;
        padding-top: 8px;
    }
    
    .gs__member-list--scroll {
        flex: 1;
        overflow-y: auto;
    }
    
    /* col__middle нужен position:relative для overlay */
    .col__middle { position: relative; }
    
    /* =============================================
         Col3 header
         ============================================= */
    .col3-header {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-height: 36px;
    }
    
    .col3-header__title {
        flex: 1;
        font-size: 14px;
        font-weight: 400;
        color: var(--color-text);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    /* Убираем жирность у названия чата в col2 */
    .chat-header__name {
        font-weight: 400;
    }
    
    /* =============================================
         Add members overlay
         ============================================= */
    .add-overlay {
        position: absolute;
        inset: 0;
        background: var(--color-surface);
        display: flex;
        flex-direction: column;
        z-index: 50;
        padding: 8px;
        gap: 8px;
    }
    
    .add-overlay__search {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 0 4px;
        border: 1.5px solid var(--color-border);
        border-radius: var(--radius-sm);
        background: var(--color-surface-2);
    }
    
    .add-overlay__search-icon {
        display: flex;
        color: var(--color-text-muted);
        flex-shrink: 0;
    }
    .add-overlay__search-icon svg { width: 15px; height: 15px; }
    
    .add-overlay__search-input {
        flex: 1;
        border: none;
        background: transparent;
        padding: 8px 0;
        font-family: var(--font);
        font-size: 13px;
        color: var(--color-text);
        outline: none;
    }
    
    .add-overlay__list {
        flex: 1;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    
    .add-overlay__row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 8px;
        border-radius: var(--radius-sm);
        cursor: pointer;
        transition: background var(--transition);
    }
    .add-overlay__row:hover { background: rgba(0,0,0,.04); }
    
    .add-overlay__check {
        flex-shrink: 0;
        width: 16px;
        height: 16px;
        accent-color: var(--color-primary);
        cursor: pointer;
    }
    
    .add-overlay__name {
        flex: 1;
        font-size: 13px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .add-overlay__dept {
        font-size: 11px;
        color: var(--color-text-muted);
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    .add-overlay__actions {
        display: flex;
        gap: 8px;
        padding-top: 4px;
    }
    
    /* =============================================
         Add member row (overlay list item)
         ============================================= */
    .add-member-row {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 8px;
        border-radius: var(--radius-sm);
        cursor: pointer;
        transition: background var(--transition);
    }
    .add-member-row:hover { background: rgba(0,0,0,.04); }
    .add-member-row--selected { background: rgba(10,23,131,.05); }
    
    .add-member-row__name {
        flex: 1;
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    /* Круглый чекбокс */
    .add-member-row__check {
        flex-shrink: 0;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        border: 1.5px solid var(--color-border);
        background: var(--color-surface);
        transition: background var(--transition), border-color var(--transition);
        position: relative;
    }
    .add-member-row__check--on {
        background: var(--color-primary);
        border-color: var(--color-primary);
    }
    .add-member-row__check--on::after {
        content: '';
        position: absolute;
        inset: 0;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 9 7.5 13 14 5'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
    }
    
    /* Секция выбранных */
    .add-overlay__selected {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .add-overlay__section-title {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        color: var(--color-text-muted);
        padding: 0 8px 4px;
    }
    .add-overlay__divider {
        height: 1px;
        background: var(--color-border);
        margin: 6px 0;
    }
    
    /* =============================================
         Member row — clickable + dropdown
         ============================================= */
    .member-row--clickable {
        cursor: pointer;
        position: relative;
    }
    .member-row--clickable:hover { background: rgba(0,0,0,.04); border-radius: var(--radius-sm); }
    
    .member-row__dropdown {
        position: absolute;
        right: 0;
        top: calc(100% + 2px);
        min-width: 180px;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
        z-index: 100;
        padding: 4px;
    }
    
    /* =============================================
         Contact item — clickable + dropdown
         ============================================= */
    .contact-item {
        position: relative;
        cursor: pointer;
    }
    
    .contact-item:hover { background: rgba(0,0,0,.04); border-radius: var(--radius-sm); }
    .contact-item.active { background: rgba(10,23,131,.08); border-radius: var(--radius-sm); }
    
    .contact-item__dropdown {
        position: absolute;
        right: 8px;
        top: calc(100% + 2px);
        min-width: 160px;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
        z-index: 100;
        padding: 4px;
    }
    
    .contact-item__dropdown .dropdown__item svg {
        width: 15px;
        height: 15px;
    }
    
    /* =============================================
         Contact floating dropdown (fixed, вне overflow)
         ============================================= */
    .contact-float-dd {
        position: fixed;
        min-width: 160px;
        background: var(--color-surface);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-md);
        z-index: 500;
        padding: 4px;
    }
    
    
    /* =============================================
       Admin Settings tab
       ============================================= */
    .admin-settings {
      display: flex;
      flex-direction: column;
      gap: 20px;
      padding: 12px 0;
    }
    
    .admin-settings__section {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    
    .admin-settings__section-title {
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .06em;
      color: var(--color-text-muted);
      padding-bottom: 6px;
    }
    
    .admin-settings__hint {
      font-size: 12px;
      color: var(--color-text-muted);
      padding-bottom: 12px;
      line-height: 1.5;
    }
    
    .admin-settings__field {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 10px 0;
      border-bottom: 1px solid var(--color-border);
    }
    
    .admin-settings__field:last-child { border-bottom: none; }
    
    .admin-settings__field--toggle {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }
    
    .admin-settings__field-info { flex: 1; min-width: 0; }
    
    .admin-settings__field-label {
      font-size: 13px;
      font-weight: 600;
      color: var(--color-text);
    }
    
    .admin-settings__field-hint {
      font-size: 12px;
      color: var(--color-text-muted);
      margin-top: 2px;
      line-height: 1.4;
    }
    
    .admin-settings__actions { padding-top: 4px; }
    
    .admin-settings__msg {
      font-size: 13px;
      padding: 8px 12px;
      border-radius: var(--radius-sm);
    }
    .admin-settings__msg--ok  { background: #f0fdf4; color: var(--color-green); border: 1px solid #bbf7d0; }
    .admin-settings__msg--err { background: #fef2f2; color: var(--color-red); border: 1px solid #fecaca; }
    
    /* Toggle switch */
    .toggle-switch {
      position: relative;
      width: 40px;
      height: 22px;
      flex-shrink: 0;
      cursor: pointer;
    }
    .toggle-switch input { opacity: 0; width: 0; height: 0; }
    .toggle-switch__track {
      position: absolute;
      inset: 0;
      border-radius: 11px;
      background: var(--color-border);
      transition: background var(--transition);
    }
    .toggle-switch__track::after {
      content: '';
      position: absolute;
      top: 3px;
      left: 3px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 1px 3px rgba(0,0,0,.2);
      transition: transform var(--transition);
    }
    .toggle-switch input:checked + .toggle-switch__track { background: var(--color-primary); }
    .toggle-switch input:checked + .toggle-switch__track::after { transform: translateX(18px); }
    
    /* =============================================
       User Settings page
       ============================================= */
    .user-settings {
      display: flex;
      flex-direction: column;
      gap: 0;
      padding: 8px 0;
    }
    
    .user-settings__section {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 16px 12px;
      border-bottom: 1px solid var(--color-border);
    }
    
    .user-settings__title {
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .06em;
      color: var(--color-text-muted);
    }
    
    .user-settings__row {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    
    .user-settings__label {
      font-size: 13px;
      color: var(--color-text);
    }
    
    .user-settings__control {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    
    .user-settings__actions {
      padding: 16px 12px;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    
    /* Range slider */
    .us-slider {
      flex: 1;
      -webkit-appearance: none;
      height: 4px;
      border-radius: 2px;
      background: var(--color-border);
      outline: none;
      cursor: pointer;
    }
    .us-slider::-webkit-slider-thumb {
      -webkit-appearance: none;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: var(--color-primary);
      cursor: pointer;
      box-shadow: 0 1px 3px rgba(0,0,0,.2);
    }
    .us-slider::-moz-range-thumb {
      width: 16px;
      height: 16px;
      border: none;
      border-radius: 50%;
      background: var(--color-primary);
      cursor: pointer;
    }
    
    .us-slider-val {
      font-size: 12px;
      color: var(--color-text-muted);
      min-width: 36px;
      text-align: right;
    }
    
    /* Mic activity indicator */
    .mic-indicator {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--color-border);
      flex-shrink: 0;
      transition: background 150ms;
    }
    .mic-indicator--active { background: var(--color-green); box-shadow: 0 0 0 3px rgba(22,163,74,.25); }
    
    /* =============================================
       Member row — voice states (speaking, mic)
       ============================================= */
    /* .member-row__avatar--speaking defined in voice avatar states section */
    
    .member-row__mic {
      display: flex;
      align-items: center;
      flex-shrink: 0;
      color: var(--color-green);
      width: 16px;
    }
    .member-row__mic svg      { width: 14px; height: 14px; }
    .member-row__mic--muted   { color: var(--color-red); }
    
    /* ── Voice avatar states ──────────────────────────────────────────── */
    
    /* В голосе — тонкий зелёный бордер */
    .member-row__avatar--in-voice  { border-color: var(--color-green) !important; }
    .contact-item__avatar--in-voice {
      border-color: var(--color-green);
    }
    
    /* Говорит — толстая полупрозрачная зелёная тень поверх бордера */
    .member-row__avatar--speaking {
      box-shadow: 0 0 2px 4px rgba(22,163,74,.25);
    }
    .contact-item__avatar--speaking {
      outline: 1px solid var(--color-green);
      outline-offset: 1px;
      box-shadow: 0 0 0 4px rgba(22,163,74,.45);
    }
    
    /* Ringing state — orange border */
    .member-row__avatar--ringing   { border-color: #f97316 !important; }
    .contact-item__avatar--ringing { outline: 1px solid #f97316; outline-offset: 1px; }
    
    /* =============================================
       Invite links
       ============================================= */
    .invite-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 0;
      border-bottom: 1px solid var(--color-border);
      font-size: 12px;
    }
    .invite-row:last-child { border-bottom: none; }
    .invite-row__token { flex: 1; color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: monospace; }
    .invite-row__uses  { color: var(--color-text-muted); white-space: nowrap; }
    
    .invite-section-wrap {
      padding: 12px 8px 4px;
      border-top: 1px solid var(--color-border);
      margin-top: 8px;
    }
    .invite-create-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 0 8px;
    }
    
    /* ── Invite section ─────────────────────────────────────────────── */
    .gs__section-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 12px;
    }
    .gs__section-title {
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .06em;
      color: var(--color-text-muted);
    }

    /* Создание ссылки */
    .invite-create-wrap {
      margin-bottom: 12px;
    }
    .invite-hours-label {
      display: block;
      font-size: 11px;
      font-weight: 600;
      color: var(--color-text-muted);
      margin-bottom: 6px;
    }
    .invite-create-row {
      display: flex;
      align-items: stretch;
      gap: 8px;
    }
    .invite-hours-field {
      display: flex;
      align-items: center;
      border: 1.5px solid var(--color-border);
      border-radius: var(--radius-md);
      background: var(--color-surface-2);
      overflow: hidden;
      flex: 1;
    }
    .invite-hours-input {
      flex: 1;
      width: 0;
      border: none !important;
      background: transparent !important;
      text-align: center;
      font-size: 15px !important;
      font-weight: 600;
      color: var(--color-text);
      padding: 0 8px !important;
      outline: none;
      height: 44px;
    }
    .invite-hours-input::-webkit-inner-spin-button,
    .invite-hours-input::-webkit-outer-spin-button { opacity: 1; }
    .invite-hours-unit {
      font-size: 13px;
      color: var(--color-text-muted);
      padding: 0 10px 0 2px;
      font-weight: 500;
    }
    .invite-create-btn {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
    }
    .invite-create-btn svg { width: 18px; height: 18px; }

    /* Список ссылок */
    .invite-row {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 8px 10px;
      background: var(--color-surface-2);
      border: 1px solid var(--color-border);
      border-radius: var(--radius-md);
      margin-bottom: 6px;
    }
    .invite-row:last-child { margin-bottom: 0; }

    .invite-row__info {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1px;
      padding: 0 4px;
    }
    .invite-row__code {
      font-family: monospace;
      font-size: 12px;
      font-weight: 600;
      color: var(--color-primary);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .invite-row__exp {
      font-size: 11px;
      color: var(--color-text-muted);
      white-space: nowrap;
    }
    .invite-row__btn {
      width: 38px;
      height: 38px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 50%;
      flex-shrink: 0;
    }
    .invite-row__btn svg { width: 13px; height: 13px; }
    .invite-row__btn--del { color: var(--color-red); }
    .invite-row__btn--del:hover {
      background: color-mix(in srgb, var(--color-red) 8%, transparent);
    }
.temp-guest-clock { display: inline-flex; align-items: center; vertical-align: middle; opacity: .5; margin-left: 3px; }
.temp-guest-clock svg { width: 12px; height: 12px; }
.dropdown__item--danger {
    color: var(--color-red);
}
.dropdown__item--danger:hover {
    background: color-mix(in srgb, var(--color-red) 8%, transparent);
}

/* ── Admin chats tab ──────────────────────────────────────────────── */
.admin-chat-list { display: flex; flex-direction: column; gap: 1px; }

.admin-chat {
  padding: 10px 12px;
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
  transition: background var(--transition);
}
.admin-chat:hover { background: var(--color-hover); }

.admin-chat__header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.admin-chat__type {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  flex-shrink: 0;
}
.admin-chat__type--group  { background: rgba(10,23,131,.12); color: #0a1783; }
.admin-chat__type--dialog { background: rgba(22,163,74,.12); color: #16a34a; }

.admin-chat__name {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-chat__date {
  font-size: 11px;
  color: var(--color-text-muted);
  flex-shrink: 0;
}

.admin-chat__members {
  font-size: 12px;
  color: var(--color-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}