.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.loading-progress {
    position: absolute;
    display: block;
    width: 8rem;
    height: 8rem;
    inset: 20vh 0 auto 0;
    margin: 0 auto 0 auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e0e0e0;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #1b6ec2;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

code {
    color: #c02d76;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ==================== */
/* モーダルダイアログ    */
/* ==================== */
.kc-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.kc-modal-dialog {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.24);
    width: 420px;
    max-width: 90vw;
    max-height: 85vh;
    overflow-y: auto;
    animation: kc-modal-in 0.15s ease-out;
}

@keyframes kc-modal-in {
    from { opacity: 0; transform: scale(0.95) translateY(-10px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.kc-modal-title {
    margin: 0;
    padding: 1.25rem 1.5rem 0.75rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
    border-bottom: 1px solid #e2e8f0;
}

.kc-modal-body {
    padding: 1rem 1.5rem;
}

.kc-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem 1.25rem;
}

.kc-form-group {
    margin-bottom: 1rem;
}

.kc-form-group > label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
    color: #334155;
}

.kc-input,
.kc-select {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.9rem;
    box-sizing: border-box;
}

.kc-input:focus,
.kc-select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
}

.kc-radio-group {
    display: flex;
    gap: 1rem;
}

.kc-radio-label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.9rem;
    color: #1e293b;
    cursor: pointer;
}

.kc-btn-primary {
    padding: 0.5rem 1.25rem;
    background: #3b82f6;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.kc-btn-primary:hover {
    background: #2563eb;
}

.kc-btn-secondary {
    padding: 0.5rem 1.25rem;
    background: transparent;
    color: #475569;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.15s;
}

.kc-btn-secondary:hover {
    background: #f1f5f9;
}

.kc-btn-danger {
    padding: 0.5rem 1.25rem;
    background: #ef4444;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
}

.kc-btn-danger:hover {
    background: #dc2626;
}

.kc-btn-small {
    padding: 0.25rem 0.75rem;
    background: transparent;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.8rem;
    cursor: pointer;
    color: #1e293b;
    transition: background 0.15s;
}

.kc-btn-small:hover {
    background: #f1f5f9;
}

.kc-btn-small.kc-btn-danger {
    padding: 0.25rem 0.75rem;
    font-size: 0.8rem;
    font-weight: normal;
}

/* ==================== */
/* 支店タグ管理         */
/* ==================== */
.kc-branch-tag-manager {
    padding: 1.5rem 2rem;
    max-width: 700px;
}

.kc-branch-tag-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.kc-branch-tag-header h3 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #1e293b;
}

.kc-branch-tag-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.kc-branch-tag-table th {
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid #e2e8f0;
    font-weight: 600;
    color: #475569;
    font-size: 0.85rem;
}

.kc-branch-tag-table td {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
}

.kc-branch-tag-table tr:hover td {
    background: #f8fafc;
}

.kc-branch-tag-actions {
    display: flex;
    gap: 0.5rem;
}

.kc-branch-tag-loading,
.kc-branch-tag-empty {
    padding: 2rem;
    text-align: center;
    color: #64748b;
}

.kc-branch-tag-error {
    margin-top: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #fef2f2;
    color: #dc2626;
    border-radius: 4px;
    font-size: 0.85rem;
}

.kc-delete-warning {
    padding: 0.75rem;
    background: #fffbeb;
    border: 1px solid #fbbf24;
    border-radius: 4px;
    color: #92400e;
    font-size: 0.9rem;
    margin-top: 0.5rem;
}

/* ======================================== */
/* グローバル                                */
/* ======================================== */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 15px; color: #1d1c1d; -webkit-font-smoothing: antialiased; }

/* ======================================== */
/* サイドバー: チャンネル一覧 (Slack風)       */
/* ======================================== */
.kc-channel-list { padding: 0.25rem 0; }
.kc-channel-list-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 16px;
    font-size: 15px; font-weight: 700; color: rgba(255,255,255,.7);
    text-transform: uppercase; letter-spacing: 0.02em;
}
.kc-create-channel-btn {
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    color: rgba(255,255,255,.5); font-size: 18px; cursor: pointer;
    transition: all .12s;
}
.kc-create-channel-btn:hover { background: rgba(255,255,255,.1); color: #fff; }
.kc-branch-filter { padding: 2px 12px 6px; }
.kc-branch-filter select {
    width: 100%; padding: 4px 8px;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
    border-radius: 4px; color: rgba(255,255,255,.8); font-size: 13px;
}
.kc-channel-items { list-style: none; margin: 0; padding: 0; }
.kc-channel-item {
    display: flex; align-items: center; gap: 6px;
    padding: 4px 16px 4px 20px;
    cursor: pointer; font-size: 15px; color: rgba(255,255,255,.7);
    border-radius: 6px; margin: 0 8px;
    transition: background .1s;
}
.kc-channel-item:hover { background: rgba(255,255,255,.06); color: #fff; }
.kc-channel-item.active { background: #1164a3; color: #fff; }
.kc-channel-icon { font-size: 14px; opacity: .6; flex-shrink: 0; width: 18px; text-align: center; }
.kc-channel-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.kc-unread-badge {
    background: #e01e5a; color: #fff; font-size: 11px; font-weight: 700;
    padding: 1px 6px; border-radius: 10px; min-width: 18px; text-align: center;
}
.kc-channel-list-loading, .kc-channel-list-empty {
    padding: 12px 20px; color: rgba(255,255,255,.4); font-size: 13px;
}
.channel-archived { opacity: .45; }
.channel-private .kc-channel-icon { font-size: 12px; }
.kc-leave-channel-btn {
    display: none; background: none; border: none; color: rgba(255,255,255,.4);
    font-size: 16px; line-height: 1; cursor: pointer; padding: 0 2px; flex-shrink: 0;
}
.kc-leave-channel-btn:hover { color: #e01e5a; }
.kc-channel-item:hover .kc-leave-channel-btn { display: block; }

/* チャンネル作成/参加ダイアログ */
.kc-channel-dialog { min-width: 440px; }
.kc-dialog-tabs {
    display: flex; border-bottom: 2px solid #e2e8f0; margin-bottom: 0.5rem;
}
.kc-dialog-tab {
    flex: 1; padding: 0.6rem 1rem; background: none; border: none;
    font-size: 0.95rem; color: #64748b; cursor: pointer;
    border-bottom: 2px solid transparent; margin-bottom: -2px; transition: color .15s;
}
.kc-dialog-tab:hover { color: #1e293b; }
.kc-dialog-tab.active { color: #1164a3; border-bottom-color: #1164a3; font-weight: 600; }

.kc-joinable-channel-list { list-style: none; margin: 0; padding: 0; max-height: 320px; overflow-y: auto; }
.kc-joinable-channel-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.5rem 0.25rem; border-bottom: 1px solid #f1f5f9;
}
.kc-joinable-channel-item:last-child { border-bottom: none; }
.kc-joinable-channel-info { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1; }
.kc-joinable-channel-name { font-weight: 500; color: #1e293b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-joinable-channel-desc { color: #64748b; font-size: 0.8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ======================================== */
/* サイドバー: DM一覧 (Slack風)              */
/* ======================================== */
.kc-dm-list { padding: 0.25rem 0; }
.kc-dm-list-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 16px; margin-top: 8px;
    font-size: 15px; font-weight: 700; color: rgba(255,255,255,.7);
    text-transform: uppercase; letter-spacing: 0.02em;
}
.kc-new-dm-btn {
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    color: rgba(255,255,255,.5); font-size: 18px; cursor: pointer;
}
.kc-new-dm-btn:hover { background: rgba(255,255,255,.1); color: #fff; }
.kc-dm-items { list-style: none; margin: 0; padding: 0; }
.kc-dm-item {
    display: flex; align-items: center; gap: 8px;
    padding: 4px 16px 4px 20px;
    cursor: pointer; font-size: 15px; color: rgba(255,255,255,.7);
    border-radius: 6px; margin: 0 8px;
    transition: background .1s;
}
.kc-dm-item:hover { background: rgba(255,255,255,.06); color: #fff; }
.kc-dm-item.active { background: #1164a3; color: #fff; }
.kc-dm-icon { font-size: 14px; opacity: .7; flex-shrink: 0; }
.kc-dm-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.kc-dm-unread-badge {
    background: #e01e5a; color: #fff; font-size: 11px; font-weight: 700;
    padding: 1px 6px; border-radius: 10px; min-width: 18px; text-align: center;
}
.kc-dm-list-loading, .kc-dm-list-empty {
    padding: 12px 20px; color: rgba(255,255,255,.4); font-size: 13px;
}
.kc-new-dm-dialog {
    margin: 8px 12px; padding: 12px;
    background: rgba(255,255,255,.06); border-radius: 8px;
}
.kc-new-dm-dialog h3 { margin: 0 0 8px; font-size: 14px; color: rgba(255,255,255,.9); }
.kc-user-search-input {
    width: 100%; padding: 6px 10px;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
    border-radius: 4px; color: #fff; font-size: 14px;
}
.kc-user-search-input::placeholder { color: rgba(255,255,255,.4); }
.kc-user-search-results { list-style: none; margin: 4px 0 0; padding: 0; }
.kc-user-search-result {
    display: flex; gap: 8px; align-items: center;
    padding: 6px 8px; cursor: pointer; border-radius: 4px; color: rgba(255,255,255,.8);
}
.kc-user-search-result:hover { background: rgba(255,255,255,.1); }
.kc-user-email { font-size: 12px; opacity: .5; }
.kc-dialog-actions { margin-top: 8px; display: flex; justify-content: flex-end; }

/* ======================================== */
/* チャットエリア                            */
/* ======================================== */
.kc-chat-area {
    display: flex; flex-direction: column; height: 100%; overflow: hidden;
}
.kc-chat-header {
    flex-shrink: 0;
    padding: 10px 20px;
    border-bottom: 1px solid #e0e0e0;
    background: #fff;
}
.kc-chat-header-title {
    margin: 0;
    font-size: 16px;
    font-weight: 900;
    color: #1d1c1d;
}

/* ======================================== */
/* メッセージ一覧 (Slack風)                  */
/* ======================================== */
.kc-message-list {
    flex: 1; overflow-y: auto; overflow-x: hidden;
    padding: 16px 20px 8px;
    display: flex; flex-direction: column-reverse;
    position: relative; z-index: 1;
}
.kc-message-list-loading, .kc-message-list-empty {
    display: flex; align-items: center; justify-content: center;
    height: 100%; color: #616061; font-size: 14px;
}
.kc-load-more-btn {
    display: block; margin: 0 auto 16px; padding: 6px 16px;
    background: transparent; border: 1px solid #ddd; border-radius: 20px;
    color: #1264a3; font-size: 13px; cursor: pointer;
    transition: all .12s;
}
.kc-load-more-btn:hover { background: #f8f8f8; border-color: #1264a3; }
.kc-loading-more { text-align: center; padding: 8px; color: #888; font-size: 13px; }
.kc-scroll-sentinel { min-height: 1px; }

/* メッセージアイテム */
.kc-message-item {
    position: relative;
    display: flex; flex-wrap: wrap; gap: 0;
    padding: 4px 20px 4px 44px;
    margin: 0 -20px; border-radius: 0;
    transition: background .08s;
}
.kc-message-item:hover { background: #f8f8f8; }
.kc-message-highlight {
    background: #fff8dc !important;
    animation: kc-highlight-fade 3s ease-out;
}
@keyframes kc-highlight-fade {
    0% { background: #ffe78f; }
    70% { background: #fff3b8; }
    100% { background: transparent; }
}
.kc-message-deleted {
    padding: 3px 20px 3px 44px;
    color: #999; font-style: italic;
}
.kc-deleted-text { font-size: 13px; }

/* システムメッセージ（参加/退出通知） */
.kc-system-message {
    display: flex; align-items: center; justify-content: center;
    padding: 4px 20px; gap: 8px;
}
.kc-system-message-text {
    font-size: 12px; color: #616061; font-style: italic;
}

/* メッセージヘッダー（アバター＋名前＋時刻） */
.kc-message-header {
    display: flex; align-items: baseline; gap: 6px;
    width: 100%;
}
.kc-message-avatar {
    position: absolute; left: 0; top: 4px;
    width: 28px; height: 28px; border-radius: 4px;
    object-fit: cover; flex-shrink: 0;
}
.kc-avatar-default {
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: #fff; font-weight: 700; font-size: 12px;
}
.kc-sender-name { font-weight: 900; font-size: 14px; color: #1d1c1d; }
.kc-sender-name:hover { text-decoration: underline; cursor: pointer; }
.kc-timestamp { font-size: 11px; color: #999; font-weight: 400; }

/* メッセージ本文 */
.kc-message-content {
    width: 100%; margin-top: 1px;
    font-size: 14px; line-height: 1.46; color: #1d1c1d;
    word-break: break-word;
}
.kc-message-content p { margin: 0; }
.kc-message-content br { line-height: 1.46; }
.kc-edited-indicator { font-size: 11px; color: #999; margin-left: 4px; }

/* URLプレビュー */
.kc-url-preview {
    margin-top: 4px; width: 100%;
}
.kc-preview-link {
    display: flex; gap: 12px; padding: 10px 12px;
    border: 1px solid #e8e8e8; border-left: 4px solid #1264a3;
    border-radius: 4px; background: #f9f9f9;
    text-decoration: none; color: inherit;
    transition: background .1s;
}
.kc-preview-link:hover { background: #f0f0f0; }
.kc-preview-thumbnail { width: 48px; height: 48px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.kc-preview-title { font-weight: 700; font-size: 14px; color: #1264a3; }
.kc-preview-description { font-size: 13px; color: #616061; margin-top: 2px; }

/* リアクション */
.kc-reactions { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 2px; width: 100%; }
.kc-reaction-badge {
    display: inline-flex; align-items: center; gap: 3px;
    padding: 1px 6px; border: 1px solid #e0e0e0; border-radius: 12px;
    background: #fff; font-size: 11px; color: #1d1c1d;
}
.kc-reaction-clickable { cursor: pointer; transition: all .1s; }
.kc-reaction-clickable:hover { background: #e8f5fe; border-color: #1264a3; }

/* スレッド返信カウント */
.kc-reply-count {
    width: 100%; margin-top: 2px;
    font-size: 12px; color: #1264a3; font-weight: 700; cursor: pointer;
}
.kc-reply-count:hover { text-decoration: underline; }

/* メッセージアクションバー（ホバーで表示） */
.kc-message-action-bar {
    display: none; position: absolute; top: 4px; right: 20px;
    background: #fff; border: 1px solid #e0e0e0; border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
    padding: 2px; z-index: 10;
}
.kc-message-item:hover .kc-message-action-bar { display: flex; }
.kc-action-btn {
    width: 32px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 16px; cursor: pointer; color: #616061;
    transition: background .1s;
}
.kc-action-btn:hover { background: #f0f0f0; color: #1d1c1d; }

/* ======================================== */
/* メッセージ入力 (Slack風)                  */
/* ======================================== */
.kc-message-input {
    flex-shrink: 0; padding: 0 20px 20px;
}
.kc-file-drop-zone {
    position: relative;
    border: 1px solid #d0d0d0; border-radius: 8px;
    background: #fff; transition: all .12s;
}
.kc-file-drop-zone.kc-drag-over {
    border-color: #1264a3; background: #e8f5fe;
    box-shadow: 0 0 0 2px rgba(18,100,163,.2);
}
.kc-markdown-toolbar {
    display: flex; gap: 2px; padding: 6px 10px;
    border-bottom: 1px solid #eee;
}
.kc-md-btn {
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 14px; color: #616061; cursor: pointer;
    transition: background .1s;
}
.kc-md-btn:hover { background: #f0f0f0; color: #1d1c1d; }
.kc-input-row { display: flex; align-items: flex-end; gap: 0; }
.kc-textarea {
    flex: 1; resize: none;
    padding: 8px 12px; min-height: 22px; max-height: 200px;
    border: none; outline: none; background: transparent;
    font-family: inherit; font-size: 14px; line-height: 1.46; color: #1d1c1d;
    overflow-y: auto;
}
.kc-textarea::placeholder { color: #999; }
.kc-send-btn {
    flex-shrink: 0; margin: 4px 6px;
    padding: 6px 16px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    background: #007a5a; border: none; border-radius: 4px;
    color: #fff; font-size: 14px; font-weight: 700; cursor: pointer;
    white-space: nowrap;
    transition: background .12s;
}
.kc-send-btn:hover { background: #148567; }
.kc-send-btn:disabled { background: #ccc; cursor: default; }

/* 添付ファイル表示 */
.kc-attached-files {
    display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px;
    border-bottom: 1px solid #eee;
}
.kc-attached-file-item {
    display: flex; align-items: center; gap: 6px;
    padding: 4px 10px; background: #f0f0f0; border-radius: 4px; font-size: 13px;
}
.kc-file-name { font-weight: 600; color: #1d1c1d; }
.kc-file-size { color: #999; }
.kc-remove-file-btn {
    background: transparent; border: none; color: #999;
    cursor: pointer; font-size: 16px; padding: 0 2px;
}
.kc-remove-file-btn:hover { color: #e01e5a; }

/* アップロードプログレス */
.kc-upload-progress { padding: 6px 12px; display: flex; align-items: center; gap: 8px; }
.kc-progress-bar { flex: 1; height: 4px; background: #eee; border-radius: 2px; overflow: hidden; }
.kc-progress-fill { height: 100%; background: #1264a3; border-radius: 2px; transition: width .2s; }
.kc-progress-text { font-size: 12px; color: #999; }

/* メンションオートコンプリート */
.kc-mention-dropdown {
    position: absolute; bottom: 100%; left: 12px; right: 12px;
    max-height: 240px; overflow-y: auto;
    background: #fff; border: 1px solid #ddd; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    z-index: 50;
}
.kc-mention-candidate {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; cursor: pointer; font-size: 14px;
    transition: background .08s;
}
.kc-mention-candidate:hover { background: #1264a3; color: #fff; }
.kc-mention-candidate:hover .kc-mention-type-badge { background: rgba(255,255,255,.2); color: #fff; }
.kc-mention-display { font-weight: 600; }
.kc-mention-type-badge {
    font-size: 11px; padding: 1px 6px; background: #e8e8e8;
    border-radius: 4px; color: #666;
}
.kc-mention-selected {
    background: #1264a3; color: #fff;
}
.kc-mention-selected .kc-mention-type-badge { background: rgba(255,255,255,.2); color: #fff; }
.kc-mention-avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 4px;
    background: #1264a3; color: #fff; font-size: 13px; font-weight: 700;
    flex-shrink: 0;
}
.kc-mention-selected .kc-mention-avatar { background: rgba(255,255,255,.25); }
.kc-mention-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; font-size: 16px; flex-shrink: 0;
}
.kc-mention-info {
    display: flex; align-items: center; gap: 6px; min-width: 0;
}

/* メッセージ内メンションハイライト (Slack風) */
.kc-mention {
    display: inline;
    padding: 1px 4px; margin: 0 1px;
    background: #d6ecff; color: #1264a3;
    border-radius: 4px; font-weight: 600;
    cursor: pointer;
}
.kc-mention:hover {
    background: #1264a3; color: #fff;
}
.kc-mention-special {
    background: #fff3cd; color: #856404;
}
.kc-mention-special:hover {
    background: #856404; color: #fff;
}

/* 非表示ファイルInput */
.kc-file-input-hidden { display: none; }

/* ======================================== */
/* FileUploadコンポーネント (Task 27)        */
/* ======================================== */
.kc-file-upload {
    border: 1px solid #e0e0e0; border-radius: 8px;
    background: #fff; padding: 12px;
}
.kc-file-upload-drop-zone {
    border: 2px dashed #ccc; border-radius: 8px;
    padding: 20px; text-align: center;
    background: #fafafa; transition: all .15s;
    cursor: pointer;
}
.kc-file-upload-drop-zone.kc-drag-over {
    border-color: #1264a3; background: #e8f0fe;
}
.kc-file-upload-prompt {
    display: flex; align-items: center; justify-content: center;
    gap: 8px; color: #666; font-size: 14px;
}
.kc-upload-icon { font-size: 20px; }
.kc-upload-select-btn {
    background: #1264a3; color: #fff; border: none;
    border-radius: 4px; padding: 4px 12px;
    font-size: 13px; cursor: pointer;
}
.kc-upload-select-btn:hover { background: #0d5292; }
.kc-file-size-limit {
    margin-top: 8px; font-size: 12px; color: #999;
}
.kc-file-size-error {
    margin-top: 8px; padding: 8px 12px;
    background: #fef2f2; border: 1px solid #fca5a5;
    border-radius: 6px; color: #dc2626;
    font-size: 13px;
}
.kc-file-upload-list {
    margin-top: 8px; display: flex; flex-direction: column; gap: 4px;
}
.kc-file-upload-item {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 10px; background: #f7f7f7;
    border-radius: 6px; font-size: 13px;
}
.kc-file-upload-item-name { font-weight: 600; color: #1d1c1d; flex: 1; }
.kc-file-upload-item-size { color: #999; }
.kc-file-upload-remove-btn {
    background: none; border: none; color: #999;
    font-size: 16px; cursor: pointer; padding: 0 4px;
}
.kc-file-upload-remove-btn:hover { color: #e01e5a; }
.kc-file-upload-progress {
    margin-top: 8px; display: flex; align-items: center; gap: 8px;
}
.kc-file-upload-submit-btn {
    margin-top: 8px; width: 100%;
    background: #1264a3; color: #fff; border: none;
    border-radius: 6px; padding: 8px 16px;
    font-size: 14px; cursor: pointer;
}
.kc-file-upload-submit-btn:hover { background: #0d5292; }

/* ======================================== */
/* FilePreviewコンポーネント (Task 27)       */
/* ======================================== */
.kc-file-preview {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 12px; background: #f7f7f7;
    border: 1px solid #e0e0e0; border-radius: 8px;
    margin: 4px 0; max-width: 400px;
}
.kc-file-preview-image-type {
    flex-direction: column; align-items: flex-start;
}
.kc-file-preview-image-container {
    width: 100%; max-height: 300px; overflow: hidden;
    border-radius: 6px;
}
.kc-file-preview-img {
    width: 100%; max-height: 300px; object-fit: contain;
    border-radius: 6px; cursor: pointer;
}
.kc-file-type-icon {
    font-size: 28px; flex-shrink: 0;
    width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    background: #e8e8e8; border-radius: 6px;
}
.kc-file-preview-info {
    display: flex; flex-direction: column; gap: 2px;
    flex: 1; min-width: 0;
}
.kc-file-preview-name {
    font-weight: 600; color: #1264a3; font-size: 14px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kc-file-preview-size {
    font-size: 12px; color: #999;
}
.kc-file-download-link {
    font-size: 13px; color: #1264a3;
    text-decoration: none; white-space: nowrap;
    flex-shrink: 0;
}
.kc-file-download-link:hover { text-decoration: underline; }

/* ======================================== */
/* コンテキストメニュー (Slack風)             */
/* ======================================== */
.kc-context-menu {
    position: absolute; right: 20px; top: 0;
    min-width: 200px;
    background: #fff; border: 1px solid #e0e0e0; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    z-index: 100; overflow: hidden;
}
.kc-context-menu-item {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 16px; width: 100%;
    background: transparent; border: none;
    font-size: 14px; color: #1d1c1d; cursor: pointer;
    text-align: left; transition: background .08s;
}
.kc-context-menu-item:hover { background: #1264a3; color: #fff; }
.kc-context-menu-icon { width: 18px; text-align: center; font-size: 15px; }
.kc-context-menu-divider { height: 1px; background: #eee; margin: 4px 0; }
.kc-context-menu-item.kc-menu-danger { color: #e01e5a; }
.kc-context-menu-item.kc-menu-danger:hover { background: #e01e5a; color: #fff; }

/* ======================================== */
/* インライン編集 (Slack風)                  */
/* ======================================== */
.kc-inline-editor {
    width: 100%; margin-top: 2px;
    background: #fff;
    border: 1px solid #1264a3;
    border-radius: 8px;
    box-shadow: 0 0 0 1px #1264a3;
    overflow: hidden;
}
.kc-edit-textarea {
    display: block;
    width: 100%; padding: 8px 12px;
    border: none; outline: none;
    font-family: inherit; font-size: 14px; line-height: 1.46;
    resize: none; min-height: 38px;
    background: transparent; color: #1d1c1d;
    box-sizing: border-box;
}
.kc-edit-textarea:focus { outline: none; }
.kc-edit-actions {
    display: flex; justify-content: flex-end;
    gap: 8px; padding: 4px 8px 6px;
    background: #f8f8f8; border-top: 1px solid #e8e8e8;
}
.kc-edit-cancel-btn {
    padding: 4px 12px; border-radius: 4px;
    font-size: 13px; font-weight: 700; cursor: pointer;
    background: #fff; color: #1d1c1d;
    border: 1px solid #d0d0d0;
    transition: background .1s;
}
.kc-edit-cancel-btn:hover { background: #f0f0f0; }
.kc-edit-save-btn {
    padding: 4px 12px; border-radius: 4px;
    font-size: 13px; font-weight: 700; cursor: pointer;
    background: #007a5a; color: #fff; border: none;
    transition: background .1s;
}
.kc-edit-save-btn:hover { background: #005e45; }
.kc-edit-save-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ======================================== */
/* 絵文字ピッカー (Slack風)                  */
/* ======================================== */
.kc-emoji-picker {
    position: fixed; right: 40px; top: 50%;
    transform: translateY(-50%);
    width: 320px; max-height: 350px;
    background: #fff; border: 1px solid #ddd; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.15);
    z-index: 200; overflow: hidden;
    display: flex; flex-direction: column;
}
.kc-emoji-search {
    padding: 8px; border-bottom: 1px solid #eee;
}
.kc-emoji-search input {
    width: 100%; padding: 6px 10px;
    border: 1px solid #ddd; border-radius: 6px;
    font-size: 14px;
}
.kc-emoji-categories { display: flex; gap: 2px; padding: 4px 8px; border-bottom: 1px solid #eee; overflow-x: auto; }
.kc-emoji-category-tab {
    padding: 4px 8px; background: transparent; border: none; border-radius: 4px;
    font-size: 13px; color: #666; cursor: pointer; white-space: nowrap;
}
.kc-emoji-category-tab:hover { background: #f0f0f0; }
.kc-emoji-category-tab.active { background: #1264a3; color: #fff; }
.kc-emoji-grid {
    flex: 1; overflow-y: auto; padding: 8px;
    display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px;
}
.kc-emoji-item {
    width: 100%; aspect-ratio: 1;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 22px; cursor: pointer;
    transition: background .08s;
}
.kc-emoji-item:hover { background: #f0f0f0; }
.kc-emoji-section-title {
    grid-column: 1 / -1;
    font-size: 13px; font-weight: 700; color: #616061;
    padding: 8px 4px 4px; text-transform: uppercase;
}

/* ======================================== */
/* チャンネルヘッダー                        */
/* ======================================== */
.kc-channel-header { padding: 0; }
.kc-channel-header-main {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0;
}
.kc-channel-header-name {
    margin: 0; font-size: 16px; font-weight: 900; color: #1d1c1d;
}
.kc-channel-header-actions {
    display: flex; gap: 4px;
}
.kc-header-action-btn {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 4px 10px; background: transparent; border: 1px solid #d0d0d0;
    border-radius: 6px; font-size: 13px; color: #1d1c1d;
    cursor: pointer; transition: all .12s; white-space: nowrap;
}
.kc-header-action-btn:hover {
    background: #f0f0f0; border-color: #bbb;
}

/* トピック表示・編集 */
.kc-channel-topic-row {
    display: flex; align-items: center; gap: 6px;
    padding: 2px 0 0;
}
.kc-channel-topic {
    font-size: 13px; color: #616061; line-height: 1.3;
}
.kc-edit-topic-btn {
    flex-shrink: 0; width: 24px; height: 24px;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 14px; color: #999; cursor: pointer; transition: all .12s;
}
.kc-edit-topic-btn:hover { background: #f0f0f0; color: #1d1c1d; }
.kc-topic-edit-form {
    display: flex; align-items: center; gap: 6px; flex: 1;
}
.kc-topic-input {
    flex: 1; padding: 5px 10px;
    border: 1px solid #d0d0d0; border-radius: 6px;
    font-size: 13px; color: #1d1c1d; outline: none;
    transition: border-color .12s;
}
.kc-topic-input:focus { border-color: #1264a3; }
.kc-topic-save-btn {
    padding: 5px 14px; background: #007a5a; border: none; border-radius: 6px;
    font-size: 13px; font-weight: 700; color: #fff;
    cursor: pointer; transition: background .12s; white-space: nowrap;
}
.kc-topic-save-btn:hover { background: #006a4e; }
.kc-topic-cancel-btn {
    padding: 5px 14px; background: transparent; border: 1px solid #d0d0d0;
    border-radius: 6px; font-size: 13px; color: #616061;
    cursor: pointer; transition: all .12s; white-space: nowrap;
}
.kc-topic-cancel-btn:hover { background: #f0f0f0; }

/* ピン留めメッセージパネル */
.kc-pinned-messages-panel {
    margin-top: 8px; background: #fff;
    border: 1px solid #e0e0e0; border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08); overflow: hidden;
}
.kc-pinned-messages-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px; border-bottom: 1px solid #eee;
    font-size: 14px; font-weight: 700; color: #1d1c1d;
}
.kc-pinned-close-btn {
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 18px; color: #616061; cursor: pointer;
}
.kc-pinned-close-btn:hover { background: #f0f0f0; }
.kc-pinned-empty {
    padding: 20px; text-align: center;
    font-size: 13px; color: #999;
}
.kc-pinned-message-item {
    padding: 10px 14px;
    border-bottom: 1px solid #f5f5f5;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.kc-pinned-message-item:last-child { border-bottom: none; }
.kc-pinned-message-content {
    flex: 1;
    cursor: pointer;
    border-radius: 4px;
    padding: 4px 6px;
    transition: background .12s;
}
.kc-pinned-message-content:hover { background: #f0f0f0; }
.kc-pinned-unpin-btn {
    background: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    color: #999;
    cursor: pointer;
    font-size: 14px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all .12s;
}
.kc-pinned-unpin-btn:hover { background: #fee; color: #c00; border-color: #c00; }
.kc-pinned-message-sender {
    font-size: 13px; font-weight: 700; color: #1d1c1d;
}
.kc-pinned-message-preview {
    font-size: 13px; color: #1d1c1d; margin: 2px 0;
    line-height: 1.4;
}
.kc-pinned-message-meta {
    font-size: 11px; color: #999;
}

/* メンバー一覧パネル */
.kc-members-panel {
    margin-top: 8px; background: #fff;
    border: 1px solid #e0e0e0; border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08); overflow: hidden;
}
.kc-members-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px; border-bottom: 1px solid #eee;
    font-size: 14px; font-weight: 700; color: #1d1c1d;
}
.kc-members-close-btn {
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 4px;
    font-size: 18px; color: #616061; cursor: pointer;
}
.kc-members-close-btn:hover { background: #f0f0f0; }
.kc-member-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 8px 14px;
    border-bottom: 1px solid #f5f5f5;
}
.kc-member-item:last-child { border-bottom: none; }
.kc-member-user-id {
    font-size: 13px; font-weight: 700; color: #1d1c1d;
}
.kc-member-role {
    font-size: 11px; color: #616061; flex: 1;
}
.kc-remove-member-btn {
    display: none; background: none; border: none; color: #999;
    font-size: 16px; cursor: pointer; padding: 0 4px; flex-shrink: 0;
}
.kc-remove-member-btn:hover { color: #e01e5a; }
.kc-member-item:hover .kc-remove-member-btn { display: block; }

/* メンバー追加セクション */
.kc-add-member-section {
    border-top: 2px solid #e8e8e8; margin-top: 8px; padding-top: 8px;
}
.kc-add-member-header { font-size: 12px; font-weight: 700; color: #616061; padding: 4px 14px; }
.kc-add-member-candidates { list-style: none; margin: 0; padding: 0; max-height: 200px; overflow-y: auto; }
.kc-add-member-candidate {
    display: flex; align-items: center; gap: 8px; padding: 6px 14px;
    border-bottom: 1px solid #f5f5f5;
}
.kc-add-member-candidate:last-child { border-bottom: none; }
.kc-candidate-name { font-size: 13px; font-weight: 600; color: #1d1c1d; }
.kc-candidate-email { font-size: 12px; color: #616061; flex: 1; }
.kc-add-member-empty { font-size: 13px; color: #616061; padding: 8px 14px;
    padding: 2px 8px; background: #f0f0f0; border-radius: 10px;
}

/* ======================================== */
/* スレッドパネル                            */
/* ======================================== */
.kc-thread-panel {
    display: flex; flex-direction: column; height: 100%;
    background: #fff;
}
.kc-thread-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #e0e0e0;
}
.kc-thread-header-title {
    font-size: 15px; font-weight: 900; color: #1d1c1d;
}
.kc-thread-close-btn {
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 6px;
    font-size: 20px; color: #616061; cursor: pointer;
    transition: background .12s;
}
.kc-thread-close-btn:hover { background: #f0f0f0; color: #1d1c1d; }

/* スレッド元メッセージ */
.kc-thread-parent {
    padding: 12px 16px;
    border-bottom: 1px solid #eee; background: #fafafa;
}
.kc-thread-parent-header {
    display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px;
}
.kc-thread-parent-sender {
    font-size: 14px; font-weight: 700; color: #1d1c1d;
}
.kc-thread-parent-time {
    font-size: 11px; color: #999;
}
.kc-thread-parent-content {
    font-size: 14px; color: #1d1c1d; line-height: 1.5;
}
.kc-thread-parent-content p { margin: 0; }

/* 返信数 */
.kc-thread-reply-count {
    padding: 8px 16px; font-size: 13px; color: #1264a3; font-weight: 700;
}
.kc-thread-divider {
    margin: 0; border: none; border-top: 1px solid #eee;
}

/* 返信一覧 */
.kc-thread-replies {
    flex: 1; overflow-y: auto; padding: 0;
}
.kc-thread-loading, .kc-thread-no-replies {
    padding: 24px 16px; text-align: center;
    font-size: 13px; color: #999;
}
.kc-thread-reply-item {
    padding: 8px 16px;
    border-bottom: 1px solid #f5f5f5;
}
.kc-thread-reply-item:last-child { border-bottom: none; }
.kc-thread-reply-header {
    display: flex; align-items: baseline; gap: 8px; margin-bottom: 2px;
}
.kc-thread-reply-sender {
    font-size: 13px; font-weight: 700; color: #1d1c1d;
}
.kc-thread-reply-time {
    font-size: 11px; color: #999;
}
.kc-thread-reply-content {
    font-size: 14px; color: #1d1c1d; line-height: 1.5;
}
.kc-thread-reply-content p { margin: 0; }

/* スレッド返信入力エリア */
.kc-thread-input-area {
    flex-shrink: 0; padding: 10px 16px 14px;
    border-top: 1px solid #e0e0e0; background: #fff;
}
.kc-thread-input-options {
    margin-bottom: 6px;
}
.kc-thread-checkbox-label {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; color: #616061; cursor: pointer;
}
.kc-thread-input-row {
    display: flex; gap: 8px;
}
.kc-thread-reply-input {
    flex: 1; padding: 8px 12px;
    border: 1px solid #d0d0d0; border-radius: 8px;
    font-size: 14px; color: #1d1c1d; outline: none;
    transition: border-color .15s;
}
.kc-thread-reply-input:focus {
    border-color: #1264a3; box-shadow: 0 0 0 1px #1264a3;
}
.kc-thread-reply-input::placeholder { color: #aaa; }
.kc-thread-reply-send {
    flex-shrink: 0; padding: 8px 18px;
    background: #007a5a; border: none; border-radius: 8px;
    font-size: 14px; font-weight: 700; color: #fff;
    cursor: pointer; transition: background .12s;
}
.kc-thread-reply-send:hover { background: #006a4e; }
.kc-thread-reply-send:disabled {
    background: #ccc; color: #999; cursor: not-allowed;
}

/* --- Search Panel --- */
.kc-search-toggle-btn {
    background: none; border: 1px solid rgba(255,255,255,0.3);
    border-radius: 6px; color: #e0e0e0; padding: 4px 12px;
    cursor: pointer; font-size: 13px; margin-left: 8px;
    transition: background .12s, border-color .12s;
}
.kc-search-toggle-btn:hover { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.5); }

.kc-search-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5); z-index: 1000;
    display: flex; justify-content: center; align-items: flex-start;
    padding-top: 60px;
}

.kc-search-panel {
    background: #fff; border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,0.25);
    width: 640px; max-width: 90vw; max-height: 80vh;
    display: flex; flex-direction: column; overflow: hidden;
}

.kc-search-header { padding: 16px; border-bottom: 1px solid #e8e8e8; }

.kc-search-input-row { display: flex; gap: 8px; align-items: center; }

.kc-search-input {
    flex: 1; padding: 10px 14px; border: 1px solid #ddd; border-radius: 8px;
    font-size: 15px; outline: none; transition: border-color .12s;
}
.kc-search-input:focus { border-color: #007a5a; }
.kc-search-input::placeholder { color: #aaa; }

.kc-search-btn {
    padding: 10px 20px; background: #007a5a; border: none; border-radius: 8px;
    color: #fff; font-size: 14px; font-weight: 600; cursor: pointer;
    transition: background .12s;
}
.kc-search-btn:hover { background: #006a4e; }

.kc-search-filter-toggle {
    padding: 10px 14px; background: #f0f0f0; border: 1px solid #ddd;
    border-radius: 8px; font-size: 13px; cursor: pointer;
    transition: background .12s;
}
.kc-search-filter-toggle:hover { background: #e0e0e0; }

.kc-search-close-btn {
    padding: 6px 10px; background: none; border: none;
    font-size: 22px; color: #999; cursor: pointer;
    transition: color .12s;
}
.kc-search-close-btn:hover { color: #333; }

/* Filter panel */
.kc-search-filter-panel {
    margin-top: 12px; padding: 12px; background: #f9f9f9;
    border-radius: 8px; display: flex; flex-direction: column; gap: 8px;
}
.kc-search-filter-row { display: flex; align-items: center; gap: 8px; }
.kc-search-filter-label {
    min-width: 80px; font-size: 13px; color: #666; font-weight: 500;
}
.kc-search-filter-input {
    flex: 1; padding: 6px 10px; border: 1px solid #ddd;
    border-radius: 6px; font-size: 13px;
}
.kc-search-filter-input:focus { border-color: #007a5a; outline: none; }
.kc-search-filter-actions { display: flex; justify-content: flex-end; margin-top: 4px; }
.kc-search-filter-clear-btn {
    padding: 6px 14px; background: #e0e0e0; border: none;
    border-radius: 6px; font-size: 13px; cursor: pointer;
}
.kc-search-filter-clear-btn:hover { background: #d0d0d0; }

/* Sender autocomplete */
.kc-search-sender-autocomplete { position: relative; flex: 1; }
.kc-search-sender-clear {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
    background: none; border: none; font-size: 16px; color: #999;
    cursor: pointer; padding: 0 4px; line-height: 1;
}
.kc-search-sender-clear:hover { color: #333; }
.kc-search-sender-dropdown {
    position: absolute; top: 100%; left: 0; right: 0;
    max-height: 200px; overflow-y: auto;
    background: #fff; border: 1px solid #ddd; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12); z-index: 60;
}
.kc-search-sender-candidate {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; cursor: pointer; font-size: 14px;
    transition: background .08s;
}
.kc-search-sender-candidate:hover,
.kc-search-sender-selected { background: #1264a3; color: #fff; }
.kc-search-sender-selected .kc-mention-avatar { background: rgba(255,255,255,.25); }
.kc-search-sender-name { font-weight: 500; }

/* Results area */
.kc-search-results-area { flex: 1; overflow-y: auto; padding: 8px 16px 16px; }

.kc-search-results-count {
    font-size: 13px; color: #666; padding: 8px 0; border-bottom: 1px solid #eee;
}

.kc-search-results { display: flex; flex-direction: column; }

.kc-search-result-item {
    padding: 12px; border-bottom: 1px solid #f0f0f0;
    cursor: pointer; border-radius: 6px; transition: background .12s;
}
.kc-search-result-item:hover { background: #f5f5f5; }

.kc-search-result-header {
    display: flex; gap: 8px; align-items: center; margin-bottom: 4px;
    font-size: 12px; color: #888;
}

.kc-search-result-type {
    background: #e8f5e9; color: #2e7d32; padding: 2px 8px;
    border-radius: 4px; font-size: 11px; font-weight: 600;
}

.kc-search-result-channel { color: #007a5a; font-weight: 500; }
.kc-search-result-sender { color: #555; }
.kc-search-result-timestamp { margin-left: auto; color: #aaa; }

.kc-search-result-content {
    font-size: 14px; color: #333; line-height: 1.4;
    overflow: hidden; text-overflow: ellipsis;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

.kc-search-result-filename {
    display: inline-block; margin-right: 6px; color: #1565c0;
    font-weight: 500;
}

.kc-search-results-empty {
    text-align: center; padding: 32px; color: #999; font-size: 14px;
}

.kc-search-error {
    text-align: center; padding: 16px; color: #d32f2f;
    background: #ffebee; border-radius: 8px; font-size: 14px;
}

/* ======================== */
/* Notification Panel       */
/* ======================== */
.kc-notification-panel {
    display: flex; flex-direction: column; height: 100%;
}
.kc-notification-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px; border-bottom: 1px solid #e0e0e0;
}
.kc-notification-tabs {
    display: flex; gap: 4px;
}
.kc-notification-tab {
    padding: 6px 14px; border: none; background: #f0f0f0;
    border-radius: 6px; cursor: pointer; font-size: 13px; color: #555;
    transition: background .12s, color .12s;
}
.kc-notification-tab:hover { background: #e0e0e0; }
.kc-notification-tab-active {
    background: #007a5a; color: #fff;
}
.kc-notification-tab-active:hover { background: #006a4e; }
.kc-notification-close-btn {
    background: none; border: none; font-size: 22px; color: #999;
    cursor: pointer; padding: 4px 8px; border-radius: 4px;
}
.kc-notification-close-btn:hover { color: #333; background: #f0f0f0; }

.kc-notification-content {
    flex: 1; overflow-y: auto; padding: 0;
}

/* Activity feed */
.kc-notification-activity-list {
    display: flex; flex-direction: column;
}
.kc-notification-item {
    padding: 10px 16px; border-bottom: 1px solid #f0f0f0;
    cursor: pointer; transition: background .12s;
}
.kc-notification-item:hover { background: #f5f5f5; }
.kc-notification-unread {
    background: #f0f8ff; border-left: 3px solid #007a5a;
}
.kc-notification-item-header {
    display: flex; align-items: center; gap: 8px; font-size: 12px; color: #888;
    margin-bottom: 4px;
}
.kc-notification-type {
    font-weight: 600; color: #007a5a;
}
.kc-notification-channel { color: #666; }
.kc-notification-timestamp { margin-left: auto; }
.kc-notification-item-body { font-size: 13px; color: #333; }
.kc-notification-sender { font-weight: 600; margin-right: 6px; }
.kc-notification-preview { color: #555; }

.kc-notification-empty {
    text-align: center; padding: 32px; color: #999; font-size: 14px;
}

/* Settings tab */
.kc-notification-settings {
    padding: 16px;
}
.kc-notification-dnd-section {
    margin-bottom: 20px; padding-bottom: 16px;
    border-bottom: 1px solid #e0e0e0;
}
.kc-notification-dnd-row {
    display: flex; align-items: center; gap: 12px;
}
.kc-notification-dnd-label {
    font-size: 14px; font-weight: 600; color: #333;
}
.kc-notification-dnd-status {
    font-size: 13px; color: #666;
}
.kc-notification-dnd-toggle {
    margin-left: auto; padding: 6px 14px; border: none;
    border-radius: 6px; cursor: pointer; font-size: 13px;
    transition: background .12s;
}
.kc-dnd-off { background: #007a5a; color: #fff; }
.kc-dnd-off:hover { background: #006a4e; }
.kc-dnd-on { background: #d32f2f; color: #fff; }
.kc-dnd-on:hover { background: #b71c1c; }

.kc-notification-section-title {
    font-size: 14px; font-weight: 600; color: #333;
    margin-bottom: 12px;
}
.kc-notification-channel-settings {
    display: flex; flex-direction: column; gap: 0;
}
.kc-notification-channel-item {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 0; border-bottom: 1px solid #f0f0f0;
    flex-wrap: wrap;
}
.kc-notification-channel-name {
    font-size: 13px; font-weight: 500; min-width: 120px; color: #333;
}
.kc-notification-level-select {
    padding: 4px 8px; border: 1px solid #ddd; border-radius: 6px;
    font-size: 13px; background: #fff;
}
.kc-notification-level-select:focus { border-color: #007a5a; outline: none; }

.kc-notification-mute-schedule {
    display: flex; align-items: center; gap: 6px;
    width: 100%; margin-top: 6px; padding-left: 130px;
}
.kc-notification-mute-label {
    font-size: 12px; color: #888; min-width: 70px;
}
.kc-notification-mute-input {
    padding: 4px 8px; border: 1px solid #ddd; border-radius: 6px;
    font-size: 13px; width: 100px;
}
.kc-notification-mute-input:focus { border-color: #007a5a; outline: none; }

/* Auto-schedule DND */
.kc-notification-auto-schedule {
    margin-top: 12px; padding-top: 12px;
    border-top: 1px solid #eee;
}
.kc-notification-auto-row {
    padding: 6px 0;
}
.kc-notification-auto-label {
    display: flex; align-items: center; gap: 8px;
    font-size: 13px; color: #333; cursor: pointer;
}
.kc-notification-auto-label input[type="checkbox"] {
    width: 16px; height: 16px; accent-color: #007a5a;
}
.kc-notification-auto-details {
    padding-left: 24px; margin-top: 4px;
}
.kc-notification-auto-time-row {
    display: flex; align-items: center; gap: 6px;
    padding: 6px 0;
}
.kc-notification-auto-time-label {
    font-size: 13px; color: #666; min-width: 120px;
}

/* ==================== */
/* プレゼンスインジケーター */
/* ==================== */
.kc-presence-indicator {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.kc-presence-dot {
    display: inline-block;
    border-radius: 50%;
    background: #999;
}
.presence-size-sm .kc-presence-dot { width: 8px; height: 8px; }
.presence-size-md .kc-presence-dot { width: 10px; height: 10px; }
.presence-size-lg .kc-presence-dot { width: 14px; height: 14px; }
.presence-online .kc-presence-dot { background: #2bac76; }
.presence-away .kc-presence-dot { background: #e8a230; }
.presence-busy .kc-presence-dot { background: #e01e5a; }
.presence-offline .kc-presence-dot { background: #999; }
.kc-presence-custom-emoji { font-size: 14px; }

/* ==================== */
/* プロフィールカード */
/* ==================== */
.kc-profile-overlay {
    position: fixed;
    bottom: 60px;
    left: 12px;
    z-index: 120;
    width: 320px;
    max-width: calc(100vw - 24px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 24px rgba(0,0,0,.18);
    overflow: hidden;
}
.kc-profile-card {
    display: flex;
    flex-direction: column;
}
.kc-profile-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px 10px;
    border-bottom: 1px solid #e8e8e8;
}
.kc-profile-card-header h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #1d1c1d;
}
.kc-profile-close-btn {
    background: none;
    border: none;
    font-size: 20px;
    color: #666;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1;
}
.kc-profile-close-btn:hover {
    background: #f0f0f0;
    color: #333;
}
.kc-profile-card-body {
    padding: 16px;
}
.kc-profile-avatar-section {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}
.kc-profile-avatar {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    object-fit: cover;
}
.kc-profile-avatar-default {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    background: #4a154b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
}
.kc-profile-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.kc-profile-display-name {
    font-size: 18px;
    font-weight: 700;
    color: #1d1c1d;
}
.kc-profile-branch {
    font-size: 13px;
    color: #616061;
}
.kc-profile-status-message {
    font-size: 13px;
    color: #616061;
    font-style: italic;
}
.kc-profile-custom-status {
    font-size: 13px;
    color: #1d1c1d;
    padding: 4px 8px;
    background: #f8f8f8;
    border-radius: 6px;
    display: inline-block;
}
.kc-profile-actions {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e8e8e8;
}
.kc-profile-edit-btn {
    width: 100%;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    color: #1d1c1d;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s;
}
.kc-profile-edit-btn:hover {
    background: #f5f5f5;
}

/* プロフィールボタン（サイドバーフッター） */
.kc-profile-btn {
    width: 100%;
    padding: 6px 12px;
    margin-bottom: 6px;
    background: transparent;
    border: 1px solid rgba(255,255,255,.15);
    color: rgba(255,255,255,.9);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background 0.12s;
}
.kc-profile-btn:hover {
    background: rgba(255,255,255,.08);
    color: #fff;
}

/* ==================== */
/* プロフィール編集ダイアログ */
/* ==================== */
.kc-profile-edit-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 130;
    background: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
}
.kc-profile-edit-dialog {
    background: #fff;
    border-radius: 10px;
    width: 440px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    box-shadow: 0 8px 32px rgba(0,0,0,.24);
}
.kc-profile-edit-header {
    padding: 18px 20px 12px;
    border-bottom: 1px solid #e8e8e8;
}
.kc-profile-edit-header h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #1d1c1d;
}
.kc-profile-edit-body {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.kc-profile-edit-error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #dc2626;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
}
.kc-profile-edit-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.kc-profile-edit-field label {
    font-size: 13px;
    font-weight: 600;
    color: #1d1c1d;
}
.kc-profile-edit-input {
    padding: 8px 10px;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    font-size: 14px;
    color: #1d1c1d;
    outline: none;
    transition: border-color 0.15s;
}
.kc-profile-edit-input:focus {
    border-color: #1264a3;
    box-shadow: 0 0 0 1px #1264a3;
}
.kc-profile-edit-select {
    padding: 8px 10px;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    font-size: 14px;
    color: #1d1c1d;
    background: #fff;
    outline: none;
    cursor: pointer;
}
.kc-profile-edit-select:focus {
    border-color: #1264a3;
    box-shadow: 0 0 0 1px #1264a3;
}
.kc-profile-edit-custom-status-row {
    display: flex;
    gap: 8px;
}
.kc-profile-edit-emoji-input {
    max-width: 64px;
    text-align: center;
}
.kc-profile-edit-footer {
    padding: 12px 20px 16px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.kc-profile-edit-btn-cancel {
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 6px;
    color: #1d1c1d;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.kc-profile-edit-btn-cancel:hover {
    background: #f5f5f5;
}
.kc-profile-edit-btn-save {
    padding: 8px 16px;
    background: #007a5a;
    border: 1px solid #007a5a;
    border-radius: 6px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s;
}
.kc-profile-edit-btn-save:hover {
    background: #006a4e;
}

/* ==================== */
/* メッセージ内プロフィールポップアップ */
/* ==================== */
.kc-clickable {
    cursor: pointer;
}
.kc-sender-name.kc-clickable:hover {
    text-decoration: underline;
    color: #1264a3;
}
.kc-message-avatar.kc-clickable:hover {
    opacity: 0.8;
}
.kc-message-profile-popup {
    position: fixed;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    z-index: 140;
    width: 320px;
    max-width: calc(100vw - 48px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 24px rgba(0,0,0,.22);
    overflow: hidden;
}

/* 検索トグルボタン */
.kc-search-toggle-btn {
    display: inline-block;
    background: transparent;
    border: 1px solid rgba(255,255,255,.15);
    color: rgba(255,255,255,.7);
    border-radius: 6px;
    padding: 4px 10px;
    margin-top: 6px;
    cursor: pointer;
    font-size: 13px;
    transition: background 0.12s;
}
.kc-search-toggle-btn:hover {
    background: rgba(255,255,255,.08);
    color: #fff;
}

/* ======================================== */
/* ワークスペース管理画面                      */
/* ======================================== */
.kc-workspace-manager {
    padding: 1.5rem 2rem;
    max-width: 800px;
    height: 100%;
    overflow-y: auto;
}

.kc-workspace-manager-title {
    margin: 0 0 1.5rem;
    font-size: 1.4rem;
    font-weight: 700;
    color: #1e293b;
}

.kc-workspace-settings-section,
.kc-invite-section,
.kc-member-section,
.kc-provisioning-section,
.kc-feature-toggle-section {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.kc-workspace-settings-section h3,
.kc-invite-section h3,
.kc-member-section h3,
.kc-provisioning-section h3,
.kc-feature-toggle-section h3 {
    margin: 0 0 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: #334155;
}

.kc-workspace-loading {
    padding: 3rem;
    text-align: center;
    color: #64748b;
    font-size: 1rem;
}

.kc-invite-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
}

.kc-invite-form .kc-form-group {
    flex: 1;
    min-width: 200px;
}

.kc-invitation-result {
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 6px;
    color: #166534;
    font-size: 0.9rem;
    word-break: break-all;
}

.kc-member-table-wrapper {
    max-height: 480px;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.kc-member-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.kc-member-table thead {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
}

.kc-member-table th {
    text-align: left;
    padding: 0.6rem 0.75rem;
    border-bottom: 2px solid #e2e8f0;
    font-weight: 600;
    color: #475569;
    font-size: 0.85rem;
}

.kc-member-table td {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
}

.kc-member-table tr:hover td {
    background: #f8fafc;
}

.kc-role-select {
    min-width: 100px;
    padding: 0.3rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.85rem;
    background: #fff;
}

.kc-status-active {
    color: #16a34a;
    font-weight: 500;
}

.kc-status-inactive {
    color: #dc2626;
    font-weight: 500;
}

.kc-provisioning-info {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.kc-provisioning-item {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.kc-provisioning-label {
    font-weight: 600;
    color: #475569;
    font-size: 0.9rem;
}

.kc-provisioning-value {
    color: #1e293b;
    font-size: 0.9rem;
}

.kc-success-message {
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #f0fdf4;
    color: #16a34a;
    border-radius: 4px;
    font-size: 0.85rem;
}

.kc-error-message {
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #fef2f2;
    color: #dc2626;
    border-radius: 4px;
    font-size: 0.85rem;
}

/* ユーザープロフィール設定 */
.kc-user-profile-settings {
    padding: 1.5rem 2rem; max-width: 600px; height: 100%; overflow-y: auto;
}
.kc-user-profile-title { font-size: 1.3rem; font-weight: 700; margin-bottom: 1.5rem; }
.kc-profile-section { display: flex; flex-direction: column; gap: 1rem; }
.kc-profile-avatar-section { display: flex; align-items: center; gap: 1.5rem; }
.kc-profile-avatar { width: 80px; height: 80px; flex-shrink: 0; }
.kc-avatar-img { width: 80px; height: 80px; border-radius: 8px; object-fit: cover; }
.kc-avatar-placeholder {
    width: 80px; height: 80px; border-radius: 8px; background: #1164a3;
    color: #fff; font-size: 32px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
}
.kc-avatar-upload { display: flex; flex-direction: column; gap: 4px; }
.kc-upload-status { font-size: 12px; color: #616061; }
.kc-custom-status-row { display: flex; gap: 8px; }
.kc-emoji-input { max-width: 80px; }

.kc-readonly-value {
    display: inline-block;
    padding: 0.4rem 0;
    color: #1e293b;
    font-size: 0.95rem;
}

.kc-member-empty {
    padding: 2rem;
    text-align: center;
    color: #64748b;
}

/* ============================
   案件管理（Projects）
   ============================ */

/* 案件チャンネル作成ウィザード */
.kc-project-wizard {
    padding: 1.5rem;
    max-width: 600px;
}

.kc-wizard-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #1e293b;
}

.kc-wizard-step {
    margin-bottom: 1rem;
}

.kc-wizard-step label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
    color: #475569;
}

.kc-wizard-step select {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.kc-template-item {
    padding: 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s;
}

.kc-template-item:hover {
    background-color: #f1f5f9;
}

.kc-template-selected {
    border-color: #3b82f6;
    background-color: #eff6ff;
}

.kc-template-name {
    font-weight: 600;
    display: block;
}

.kc-template-description {
    font-size: 0.8rem;
    color: #64748b;
}

.kc-wizard-actions {
    margin-top: 1rem;
}

.kc-wizard-success {
    padding: 1rem;
    background-color: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 0.375rem;
    color: #166534;
}

.kc-wizard-error {
    padding: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 0.375rem;
    color: #991b1b;
    margin-bottom: 1rem;
}

/* 配送スケジュールカレンダー */
.kc-delivery-calendar {
    padding: 1rem;
}

.kc-calendar-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.kc-schedule-list {
    margin-bottom: 1rem;
}

.kc-schedule-entry {
    display: flex;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    align-items: center;
}

.kc-schedule-date {
    font-weight: 600;
    color: #3b82f6;
    white-space: nowrap;
}

.kc-schedule-description {
    color: #475569;
}

.kc-calendar-empty {
    padding: 1.5rem;
    text-align: center;
    color: #94a3b8;
}

.kc-schedule-form {
    padding: 1rem;
    background: #f8fafc;
    border-radius: 0.375rem;
    margin-top: 0.5rem;
}

.kc-calendar-error {
    padding: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 0.375rem;
    color: #991b1b;
    margin-bottom: 0.75rem;
}

/* ステータス報告フォーム */
.kc-status-report-form {
    padding: 1.5rem;
    max-width: 600px;
}

.kc-form-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.kc-form-field {
    margin-bottom: 0.75rem;
}

.kc-form-field label {
    display: block;
    font-size: 0.8rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
    color: #475569;
}

.kc-form-field input,
.kc-form-field select,
.kc-form-field textarea {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.kc-form-field textarea {
    min-height: 80px;
    resize: vertical;
}

.kc-form-actions {
    margin-top: 1rem;
    display: flex;
    gap: 0.5rem;
}

.kc-report-success {
    padding: 0.75rem;
    background-color: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 0.375rem;
    color: #166534;
    margin-bottom: 1rem;
}

.kc-report-error {
    padding: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 0.375rem;
    color: #991b1b;
    margin-bottom: 1rem;
}

/* 優先度ラベル */
.kc-priority-label {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
}

.kc-priority-urgent {
    background-color: #dc2626;
    color: #ffffff;
}

.kc-priority-high {
    background-color: #f97316;
    color: #ffffff;
}

.kc-priority-normal {
    background-color: #3b82f6;
    color: #ffffff;
}

.kc-priority-low {
    background-color: #94a3b8;
    color: #ffffff;
}

/* エスカレーションパネル */
.kc-escalation-panel {
    padding: 1rem;
    border: 1px solid #fde68a;
    border-radius: 0.375rem;
    background: #fffbeb;
}

.kc-escalation-title {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
    color: #92400e;
}

.kc-escalation-success {
    padding: 0.75rem;
    background-color: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 0.375rem;
    color: #166534;
    margin-bottom: 0.75rem;
}

.kc-escalation-error {
    padding: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 0.375rem;
    color: #991b1b;
    margin-bottom: 0.75rem;
}

/* ステータス集計サマリー */
.kc-status-summary {
    padding: 1.5rem;
}

.kc-summary-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.kc-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.kc-summary-card {
    padding: 0.75rem;
    border-radius: 0.375rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    text-align: center;
}

.kc-summary-label {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.kc-summary-value {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
}

.kc-summary-success .kc-summary-value {
    color: #16a34a;
}

.kc-summary-warning .kc-summary-value {
    color: #f59e0b;
}

.kc-summary-danger .kc-summary-value {
    color: #dc2626;
}

.kc-summary-urgent {
    background: #fef2f2;
    border-color: #fca5a5;
}

.kc-summary-urgent .kc-summary-value {
    color: #dc2626;
}

.kc-summary-escalation {
    background: #fffbeb;
    border-color: #fde68a;
}

.kc-summary-escalation .kc-summary-value {
    color: #d97706;
}

.kc-summary-error {
    padding: 0.75rem;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 0.375rem;
    color: #991b1b;
}

.kc-upcoming-schedules {
    margin-top: 1rem;
    border-top: 1px solid #e2e8f0;
    padding-top: 1rem;
}

.kc-upcoming-schedules h4 {
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.kc-upcoming-entry {
    display: flex;
    gap: 0.75rem;
    padding: 0.375rem 0;
}

.kc-upcoming-date {
    font-weight: 500;
    color: #3b82f6;
}

.kc-upcoming-description {
    color: #475569;
}

/* ボタン共通 */
.kc-btn-warning {
    background-color: #f59e0b;
    color: #ffffff;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
}

.kc-btn-warning:hover {
    background-color: #d97706;
}

.kc-btn-warning:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ======================================== */
/* フィーチャートグル管理                   */
/* ======================================== */
.kc-feature-toggle-manager {
    padding: 0;
}

.kc-feature-toggle-title {
    margin: 0 0 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: #334155;
}

.kc-feature-toggle-error {
    margin-bottom: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 6px;
    color: #991b1b;
    font-size: 0.875rem;
}

.kc-preset-plan-section {
    margin-bottom: 1rem;
}

.kc-preset-plan-section h4 {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #475569;
}

.kc-preset-plan-buttons {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.kc-preset-plan-btn {
    padding: 0.4rem 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #f8fafc;
    color: #334155;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.kc-preset-plan-btn:hover {
    background: #e2e8f0;
    border-color: #94a3b8;
}

.kc-feature-toggle-list {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.kc-feature-toggle-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: background 0.15s;
}

.kc-feature-toggle-row:hover {
    background: #f1f5f9;
}

.kc-feature-toggle-name {
    font-size: 0.9rem;
    color: #334155;
}

.kc-feature-toggle-switch {
    min-width: 48px;
    padding: 0.25rem 0.75rem;
    border: none;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.kc-feature-toggle-switch.kc-enabled {
    background: #22c55e;
    color: #fff;
}

.kc-feature-toggle-switch.kc-disabled {
    background: #cbd5e1;
    color: #64748b;
}

.kc-feature-toggle-switch:hover {
    opacity: 0.85;
}

/* ======================================== */
/* 案件管理パネル（チャンネルヘッダー内）   */
/* ======================================== */
.kc-project-panel {
    padding: 1rem;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
    max-height: 400px;
    overflow-y: auto;
}

.kc-header-action-btn.active {
    background: #e0e7ff;
    color: #3730a3;
}

/* 配送スケジュールカレンダー */
.kc-delivery-calendar {
    padding: 0;
}

.kc-calendar-title {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 600;
    color: #334155;
}

.kc-calendar-error {
    margin-bottom: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 6px;
    color: #991b1b;
    font-size: 0.875rem;
}

.kc-calendar-empty {
    padding: 1rem 0;
    color: #64748b;
    font-size: 0.9rem;
}

.kc-schedule-list {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.kc-schedule-entry {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 0.4rem 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    font-size: 0.875rem;
}

.kc-schedule-date {
    font-weight: 600;
    color: #1e40af;
    white-space: nowrap;
}

.kc-schedule-description {
    color: #334155;
}

.kc-schedule-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-end;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.kc-schedule-form .kc-form-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.kc-schedule-form .kc-form-field label {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
}

.kc-schedule-form .kc-form-field input {
    padding: 0.35rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.875rem;
}

.kc-form-actions {
    display: flex;
    gap: 0.5rem;
}

/* ステータスレポートフォーム */
.kc-status-report-form {
    padding: 0;
}

/* サマリービュー */
.kc-status-summary {
    padding: 0;
}

/* ======================================== */
/* 施設商品管理・一括スケジュール            */
/* ======================================== */
.kc-facility-products-section,
.kc-bulk-schedule-section,
.kc-schedule-section {
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.kc-section-subtitle {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #475569;
}

.kc-product-list {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.kc-product-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.35rem 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    font-size: 0.875rem;
}

.kc-product-name {
    font-weight: 500;
    color: #1e293b;
}

.kc-product-qty {
    color: #1e40af;
    font-weight: 600;
    font-size: 0.8rem;
}

.kc-product-notes {
    color: #64748b;
    font-size: 0.8rem;
}

.kc-product-delete-btn {
    margin-left: auto;
    background: none;
    border: none;
    color: #94a3b8;
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0 0.25rem;
}

.kc-product-delete-btn:hover {
    color: #ef4444;
}

.kc-product-empty {
    padding: 0.5rem 0;
    color: #64748b;
    font-size: 0.875rem;
}

.kc-add-product-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: flex-end;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    margin-top: 0.5rem;
}

.kc-add-product-form .kc-form-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.kc-add-product-form .kc-form-field label {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
}

.kc-add-product-form .kc-form-field input {
    padding: 0.35rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.875rem;
}

.kc-add-product-form .kc-form-field input[type="number"] {
    width: 80px;
}

/* 一括スケジュール */
.kc-bulk-schedule-form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.kc-bulk-schedule-form .kc-form-field label {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
}

.kc-bulk-schedule-form .kc-form-field input[type="date"] {
    padding: 0.35rem 0.5rem;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.875rem;
}

.kc-bulk-product-select {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.kc-bulk-product-select > label:first-child {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 0.25rem;
}

.kc-checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    color: #334155;
    cursor: pointer;
    border-radius: 4px;
}

.kc-checkbox-label:hover {
    background: #f1f5f9;
}

.kc-checkbox-label input[type="checkbox"] {
    accent-color: #3b82f6;
}

/* ==================== */
/* モバイル最適化（タップターゲット・スクロール） */
/* ==================== */
@media (max-width: 768px) {
    /* チャンネル・DM 項目のタップ領域を拡大（iOS HIG 44px 基準） */
    .kc-channel-item,
    .kc-dm-item {
        min-height: 44px;
        padding-top: 10px;
        padding-bottom: 10px;
        touch-action: manipulation;
    }

    /* 退出・×ボタンは常時表示（hover で現れる仕様はタッチでは使えない） */
    .kc-channel-item .kc-leave-channel-btn {
        display: block;
        opacity: 0.5;
        min-width: 32px;
        min-height: 32px;
    }

    /* メッセージ入力エリアを安全領域対応 */
    .kc-message-input {
        padding-bottom: env(safe-area-inset-bottom, 0);
    }

    /* モバイルでの iOS タップハイライト抑制 */
    button,
    .kc-channel-item,
    .kc-dm-item {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
    }

    /* サイドバー内の全ボタンを最低 40px 確保 */
    .kc-sidebar button {
        min-height: 40px;
    }

    /* モバイルでは Radzen のデフォルトフォントサイズを少し縮小 */
    body {
        font-size: 15px;
    }
}
