/* Event Description in Sidebar */
        .event-description-text {
            font-family: var(--font-family);
            font-size: var(--font-size-xs);
            color: var(--text-secondary);
            line-height: 1.5;
            display: -webkit-box;
            -webkit-line-clamp: 5;
            -webkit-box-orient: vertical;
            overflow: hidden;
            word-break: break-word;
            cursor: pointer;
            transition: all var(--transition-fast);
        }

        .event-description-text:hover {
            color: var(--text-primary);
        }

        /* Non-organisers can still click to expand, but the hover colour-
           shift implied edit-ability. Suppress just the colour change; the
           pointer cursor stays because expand-to-read is still a real
           interaction. */
        .event-description-text.is-readonly:hover {
            color: var(--text-secondary);
        }

        /* Inline edit shows the raw plain text — keep its line breaks visible */
        .event-description-text.editing {
            white-space: pre-wrap;
        }

        .event-description-text.expanded {
            display: block;
            -webkit-line-clamp: unset;
            max-height: 300px;
            overflow-y: auto;
        }

        .event-description-text.editing {
            display: block;
            -webkit-line-clamp: unset;
            max-height: 300px;
            overflow-y: auto;
            background: var(--bg-secondary);
            border-radius: var(--radius-sm);
            padding: 8px;
            margin: 4px -8px -8px -8px;
            outline: none;
            cursor: text;
            white-space: pre-wrap;
        }

        .event-description-text.editing:focus {
            background: var(--bg-primary);
            box-shadow: 0 0 0 2px var(--accent-blue);
        }

        .event-description-text ul,
        .event-description-text ol {
            margin: 4px 0;
            padding-left: 20px;
        }

        /* Bullet lists need this as much as numbered ones: the global reset
           leaves ul at list-style: none, and only ol was ever restored — so a
           bulleted Google description showed as indented, markerless lines. */
        .event-description-text ul {
            list-style-type: disc;
        }

        .event-description-text ul ul {
            list-style-type: circle;
        }

        .event-description-text ul ul ul {
            list-style-type: square;
        }

        .event-description-text ol {
            list-style-type: decimal;
        }

        .event-description-text ol ol,
        .event-description-text ol li ol,
        .event-description-text ol li > ol {
            list-style-type: lower-alpha !important;
        }

        .event-description-text ol ol ol,
        .event-description-text ol li ol li ol,
        .event-description-text ol li > ol li > ol {
            list-style-type: lower-roman !important;
        }

        .event-description-text li {
            margin: 2px 0;
        }

        .event-description-text li > ul,
        .event-description-text li > ol {
            margin-top: 2px;
            margin-bottom: 0;
        }

        .event-description-text .description-bullet-line {
            display: flex;
            gap: 6px;
            padding: 2px 0;
        }

        .event-description-text .description-bullet,
        .event-description-text .description-number {
            color: var(--accent-blue);
            font-weight: 600;
            flex-shrink: 0;
        }

        /* Event Location in Sidebar */
        .event-location-item {
            display: flex;
            align-items: center;
            gap: 6px;
            padding: 4px 0;
            background: transparent;
            border: none;
            color: var(--text-secondary);
            font-size: var(--font-size-xs);
            transition: all var(--transition-fast);
        }

        .event-location-item:hover {
            color: var(--accent-blue);
        }

        .event-location-item svg {
            width: 14px;
            height: 14px;
            flex-shrink: 0;
            opacity: 0.6;
        }

        .event-location-text {
            flex: 1;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        /* Action Items in Event Modal */
        .action-items-list {
            display: flex;
            flex-direction: column;
            gap: 0;
            max-height: 130px;
            overflow-y: auto;
        }

        /* More compact action items in centered modal */
        .event-modal:not(.fullscreen) .action-items-list {
            max-height: 100px;
        }

        .event-modal:not(.fullscreen) .event-action-items {
            padding: var(--space-2) 28px;
        }

        .action-items-empty {
            font-size: var(--font-size-sm);
            color: var(--text-tertiary);
            font-style: italic;
            padding: var(--space-1) 0;
        }

        .action-item-row {
            display: flex;
            align-items: center;
            gap: var(--space-2);
            padding: var(--space-1) 0;
            cursor: pointer;
            border-bottom: 1px solid var(--border-light);
        }

        .action-item-row:last-child {
            border-bottom: none;
        }

        .action-item-checkbox {
            width: 16px;
            height: 16px;
            border: 2px solid var(--border-medium);
            border-radius: var(--radius-sm);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            transition: all var(--transition-fast);
            background: transparent;
        }

        .action-item-checkbox:hover {
            border-color: var(--accent-blue);
        }

        .action-item-checkbox.completed {
            background: var(--accent-blue);
            border-color: var(--accent-blue);
        }

        .action-item-checkbox.completed svg {
            color: white;
            width: 10px;
            height: 10px;
        }

        .action-item-title {
            flex: 1;
            font-size: var(--font-size-sm);
            color: var(--text-primary);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .action-item-row.completed .action-item-title {
            color: var(--text-tertiary);
            text-decoration: line-through;
        }


        .add-action-item {
            margin-top: var(--space-2);
        }

        .action-item-input {
            width: 100%;
            padding: 8px 12px;
            border: 1px solid var(--border-light);
            border-radius: var(--radius-sm);
            font-family: var(--font-family);
            font-size: var(--font-size-sm);
            outline: none;
            transition: border-color var(--transition-fast);
            background: var(--bg-card);
            color: var(--text-primary);
        }

        .action-item-input:focus {
            border-color: var(--accent-blue);
        }

        .action-item-input::placeholder {
            color: var(--text-tertiary);
        }

        /* Action Items Section pinned to bottom of modal */
        .event-action-items {
            flex: 0 0 auto;
            padding: var(--space-2) 28px var(--space-3);
            border-top: 1px solid var(--border-light);
        }

        .action-items-header {
            display: flex;
            align-items: center;
            gap: var(--space-2);
            margin-bottom: var(--space-2);
            font-size: var(--font-size-xs);
            font-weight: 600;
            color: var(--text-tertiary);
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .action-items-count {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 16px;
            height: 16px;
            padding: 0 4px;
            background: rgba(91, 159, 227, 0.15);
            color: #5B9FE3;
            border-radius: var(--radius-md);
            font-size: var(--font-size-2xs);
            font-weight: 600;
        }

        /* Inline Task Input in Notes Editor */
        .task-inline-wrapper {
            display: inline-flex;
            align-items: center;
            gap: var(--space-2);
            padding: 6px 10px;
            background: rgba(91, 159, 227, 0.08);
            border: 1px solid #5B9FE3;
            border-radius: var(--radius-sm);
            margin: 4px 0;
        }

        .task-inline-icon {
            display: flex;
            align-items: center;
            justify-content: center;
            color: #5B9FE3;
        }

        .task-inline-icon svg {
            width: 16px;
            height: 16px;
        }

        .task-inline-input {
            flex: 1;
            min-width: 200px;
            padding: var(--space-1) var(--space-2);
            border: none;
            background: transparent;
            font-family: var(--font-family);
            font-size: var(--font-size-sm);
            color: var(--text-primary);
            outline: none;
        }

        .task-inline-input::placeholder {
            color: var(--text-tertiary);
        }

        .event-previous-section {
            margin-top: auto;
        }

        .previous-meetings-header {
            font-family: var(--font-family);
            font-size: var(--font-size-xs);
            font-weight: 600;
            color: var(--text-tertiary);
            letter-spacing: 0.5px;
            margin-bottom: 8px;
        }

        .previous-meeting-item {
            padding: 6px 0;
            border-bottom: 1px solid var(--border-light);
            cursor: pointer;
            transition: all var(--transition-fast);
        }

        .previous-meeting-item:last-child {
            border-bottom: none;
        }

        .previous-meeting-item:hover {
            color: var(--accent-blue);
        }

        .previous-meeting-title {
            font-family: var(--font-family);
            font-size: var(--font-size-xs);
            font-weight: 500;
            color: var(--text-primary);
            margin-bottom: 2px;
            display: flex;
            align-items: center;
        }

        .previous-meeting-item:hover .previous-meeting-title {
            color: var(--accent-blue);
        }

        .previous-meeting-date {
            font-family: var(--font-family);
            font-size: var(--font-size-xs);
            color: var(--text-tertiary);
        }

        .load-more-btn {
            width: 100%;
            padding: var(--space-2);
            background: transparent;
            border: none;
            font-family: var(--font-family);
            font-size: var(--font-size-12);
            color: var(--text-tertiary);
            cursor: pointer;
            transition: all var(--transition-fast);
            margin-top: 4px;
        }

        .load-more-btn:hover {
            color: var(--accent-blue);
        }

        .no-previous-meetings {
            font-family: var(--font-family);
            font-size: var(--font-size-12);
            color: var(--text-tertiary);
            padding: 8px 0;
        }

        .previous-meeting-notes-icon {
            display: inline-block;
            vertical-align: middle;
            color: var(--accent-blue);
            margin-left: 5px;
            flex-shrink: 0;
        }

        /* Future Feature Buttons (Disabled) */
        .event-future-features {
            margin-top: var(--space-4);
        }

        .future-feature-btn {
            display: flex;
            align-items: center;
            gap: var(--space-2);
            width: 100%;
            padding: var(--space-2) var(--space-3);
            border: none;
            background: transparent;
            border-radius: var(--radius-md);
            font-family: var(--font-family);
            font-size: var(--font-size-sm);
            color: var(--text-secondary);
            cursor: pointer;
            transition: all var(--transition-fast);
        }

        .future-feature-btn svg {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
        }

        .future-feature-btn:hover:not(.disabled) {
            background: var(--bg-hover);
            color: var(--text-primary);
        }

        .future-feature-btn.disabled {
            opacity: 0.4;
            cursor: not-allowed;
        }