/* /Components/Chat/ChatClient.razor.rz.scp.css */
:root[b-cyyxigh68i] {
  /* inherit theme variables */
  --chat-advanced-shadow: 0 8px 24px rgba(0,0,0,.35);
}

.chat-root[b-cyyxigh68i] {
  display: flex;
  flex-direction: column;
  align-content: stretch;
  min-height: 0;  /* allow inner scroll area to shrink */
  height: 100%;   /* fill parent so the middle pane can compute remaining height */
  flex: 1 1 0%;   /* as a flex item inside article.content, occupy remaining height */
  gap: .75rem;    /* spacing between header/status/messages/input */
}

/* Keep header/status/input fixed (non-flexing) so only messages scroll */
.chat-root > *:not(.chat-messages)[b-cyyxigh68i] { flex: 0 0 auto; }

.chat-input-container textarea.form-control[b-cyyxigh68i] {
  resize: none;
  max-height: 40vh; /* prevent input from growing too tall */
  overflow-y: auto;   /* allow textarea to scroll when large */
  overflow-x: hidden; /* prevent horizontal scroll */
  min-height: 2.75rem;
  padding: .625rem .75rem; /* vertically center placeholder text */
  line-height: 1.5;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
  field-sizing: content; /* Modern browsers: auto-grow to fit content */
}

 .chat-composer[b-cyyxigh68i] {
   align-items: flex-end;
 }

 .chat-composer-bubble[b-cyyxigh68i] {
   display: flex;
   flex-direction: column;
   width: 100%;
   background-color: var(--panel);
   border: 1px solid var(--border);
   border-radius: 1rem;
   padding: .5rem .75rem;
   gap: .25rem;
 }

 .chat-composer-bubble:focus-within[b-cyyxigh68i] {
   border-color: var(--accent);
   box-shadow: 0 0 0 .15rem rgba(14, 165, 233, 0.15);
 }

 .chat-composer-bubble.busy[b-cyyxigh68i] {
   border-color: rgba(220, 53, 69, 0.5);
   box-shadow: 0 0 0 .15rem rgba(220, 53, 69, 0.1);
 }

 .composer-textarea-row[b-cyyxigh68i] {
   width: 100%;
 }

 .composer-textarea-row textarea.form-control[b-cyyxigh68i] {
   border: 0 !important;
   outline: none !important;
   box-shadow: none !important;
   background: transparent !important;
   background-color: transparent !important;
   padding: .5rem 0;
   min-height: 1.75rem;
   font-size: .95rem;
   line-height: 1.4;
 }

 .composer-textarea-row .textarea-shadow[b-cyyxigh68i] {
   padding: .5rem 0;
 }

 .chat-composer-bubble.drag-over[b-cyyxigh68i] {
   background: rgba(14, 165, 233, 0.1);
   border-color: var(--accent);
   border-style: dashed;
 }

 .composer-toolbar-row[b-cyyxigh68i] {
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
 }

 .composer-toolbar-left[b-cyyxigh68i] {
   display: flex;
   align-items: center;
   gap: .25rem;
 }

 .composer-toolbar-right[b-cyyxigh68i] {
   display: flex;
   align-items: center;
 }

 .composer-icon-btn[b-cyyxigh68i] {
   width: 1.75rem;
   height: 1.75rem;
   border: 0;
   border-radius: 9999px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background: transparent;
   color: var(--muted);
   cursor: pointer;
   transition: color 0.15s ease;
 }

 .composer-icon-btn:hover[b-cyyxigh68i] {
   color: var(--text);
 }

 .composer-icon-btn i[b-cyyxigh68i] { font-size: .95rem; }

 .composer-send-btn[b-cyyxigh68i] {
   width: 1.75rem;
   height: 1.75rem;
   border: 0;
   border-radius: 9999px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background: var(--accent);
   color: #fff;
   cursor: pointer;
   transition: filter 0.15s ease;
 }

 .composer-send-btn:hover[b-cyyxigh68i] {
   filter: brightness(1.15);
 }

 .composer-send-btn.cancel[b-cyyxigh68i] {
   background: #dc3545;
 }

 .composer-send-btn i[b-cyyxigh68i] { font-size: .85rem; }

.chat-input-container textarea.form-control[b-cyyxigh68i]::-webkit-scrollbar {
  display: none; /* Chrome/Safari/Opera */
}

.chat-send-btn[b-cyyxigh68i] {
  width: 2.75rem;
  height: 2.75rem;
  flex-shrink: 0; /* prevent button from shrinking */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: .375rem; /* subtle rounded corners to match Bootstrap */
  padding: 0;
  transition: all 0.15s ease-in-out;
}

.chat-send-btn:hover[b-cyyxigh68i] {
  filter: brightness(1.1);
}

.chat-send-btn:active[b-cyyxigh68i] {
  transform: scale(0.97);
}

/* Make icon appropriately sized */
.chat-send-btn i[b-cyyxigh68i] { font-size: 1.125rem; }

/* Advanced dropdown overlay */
.advanced-dropdown[b-cyyxigh68i] {
  position: relative;
  padding-bottom: .25rem; /* hover buffer to prevent flicker between trigger and panel */
}

.advanced-dropdown > summary[b-cyyxigh68i] {
  list-style: none; /* hide default marker */
}
.advanced-dropdown > summary[b-cyyxigh68i]::-webkit-details-marker { display: none; }
.advanced-dropdown > summary[b-cyyxigh68i]::marker { content: none; }

.advanced-dropdown .dropdown-panel[b-cyyxigh68i] {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 3000; /* ensure above other UI like tooltips */
  box-shadow: var(--chat-advanced-shadow);
  pointer-events: auto; /* make sure inner controls are clickable */
  max-height: 80vh; /* allow a taller panel while respecting viewport */
  overflow: auto;   /* scroll within the panel if content exceeds max-height */
}

/* When pinned, force the panel to remain visible */
.advanced-dropdown.pinned .dropdown-panel[b-cyyxigh68i] {
  display: block;
}

/* Show on hover or when any child is focused (keyboard accessibility) */
.advanced-dropdown:hover .dropdown-panel[b-cyyxigh68i],
.advanced-dropdown:focus-within .dropdown-panel[b-cyyxigh68i] {
  display: block;
}

/* Ensure the panel remains open when hovered even if outside parent's box */
.advanced-dropdown .dropdown-panel:hover[b-cyyxigh68i] {
  display: block;
}

/* Inner layout for advanced panel */
.advanced-dropdown .card[b-cyyxigh68i] {
  border-color: var(--bs-border-color);
}

.advanced-list[b-cyyxigh68i] {
  display: grid;
  gap: .5rem;
}

.advanced-item + .advanced-item[b-cyyxigh68i] {
  border-top: 1px solid var(--bs-border-color);
  padding-top: .5rem;
}

.advanced-item .form-label.small[b-cyyxigh68i] {
  color: var(--bs-secondary-color, #adb5bd);
}

.advanced-dropdown .dropdown-panel input.form-control[readonly][b-cyyxigh68i] {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
}

/* Tools list inside Advanced -> Think & Web row */
.tools-grid[b-cyyxigh68i] {
  display: grid;
  grid-template-columns: minmax(0, 1fr); /* robust full-width single column */
  gap: .5rem; /* vertical spacing between groups */
  max-height: 50vh; /* show a larger list before scrolling; still within panel */
  overflow: auto;
  padding: .25rem 0;
}
.tools-grid > div[b-cyyxigh68i] { /* each group block */
  width: 100%;
}
.tools-grid .form-check-input[b-cyyxigh68i] {
  transform: scale(0.9);
}
.tools-grid .form-check[b-cyyxigh68i] { /* per-tool row */
  width: 100%;
}
.tools-grid .form-check-label[b-cyyxigh68i] {
  white-space: normal;
  overflow: visible;
  text-overflow: initial;
  flex: 1 1 auto; /* take remaining space by default */
  min-width: 0;   /* allow to shrink/wrap within row */
  overflow-wrap: anywhere; /* break long tokens */
  word-break: break-word;
}

/* Group row: left-aligned, checkbox left, label right */
.tools-grid .group-row[b-cyyxigh68i] {
  padding-left: 0; /* cancel bootstrap form-check left padding */
  gap: .5rem;
}
.tools-grid .group-row .form-check-input[b-cyyxigh68i] { margin-left: 0 !important; }
.tools-grid .group-row .form-check-label[b-cyyxigh68i] { margin-left: 0 !important; }

/* Child tool rows: indent and show a child arrow; checkbox on the left */
.tools-grid .tool-row[b-cyyxigh68i] {
  padding-left: 0; /* cancel bootstrap form-check left padding */
  margin-left: 1rem; /* indent under group */
  gap: .5rem;
  position: relative;
}
.tools-grid .tool-row[b-cyyxigh68i]::before {
  content: '↳';
  color: var(--bs-secondary-color, #adb5bd);
  opacity: .9;
  margin-right: .25rem;
}
.tools-grid .tool-row .form-check-input[b-cyyxigh68i] {
  margin-left: 0 !important;    /* keep switch flush */
}
.tools-grid .tool-row .form-check-label[b-cyyxigh68i] {
  margin-left: 0 !important;    /* rely on ms-2 in markup */
}

/* Messages area flexes to fill remaining height and scrolls */
.chat-messages[b-cyyxigh68i] {
  flex: 1 1 0%;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior-y: none; /* completely disable bounce/rubber-band effect at scroll edges */
  -webkit-overscroll-behavior-y: none; /* WebKit-specific prefix for better browser support */
  margin: 0 !important; /* override bootstrap mb-3 so margin doesn't affect layout measurements */
  position: relative; /* allow inner overlays if needed */
}

/* Scroll buttons overlay inside messages container */
.chat-scroll-bar[b-cyyxigh68i] {
  position: sticky;
  z-index: 10;
  display: flex;
  justify-content: center;
  pointer-events: none; /* allow clicks through except on the button */
}
.chat-scroll-bar.top[b-cyyxigh68i] { top: .25rem; }
/* Some environments are inconsistent with sticky+bottom; emulate with top: 100% - button size */
.chat-scroll-bar.bottom[b-cyyxigh68i] { top: calc(100% - 3rem); }

.chat-scroll-btn[b-cyyxigh68i] {
  pointer-events: auto;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.chat-scroll-btn i[b-cyyxigh68i] { font-size: 1.2rem; }

/* Scrollable area for the Raw last request card */
.raw-request-body[b-cyyxigh68i] {
  max-height: 40vh; /* keep it visible without overtaking the page */
  overflow: auto;   /* enable scrolling when the JSON is large */
}

/* Tool-calls expansion styling */
.tool-calls-wrapper[b-cyyxigh68i] {
  border-left: 3px solid var(--bs-border-color);
  padding-left: .5rem;
}
.tool-calls-list[b-cyyxigh68i] {
  margin-left: .5rem;
}
.tool-call-item[b-cyyxigh68i] {
  margin-left: .5rem;
}
.tool-call-item > summary[b-cyyxigh68i] {
  padding-left: .25rem;
}

/* Message row styling */
.message-row[b-cyyxigh68i] {
  padding: .35rem .75rem;
  border-radius: .375rem;
  transition: background-color 0.15s ease-in-out;
}

/* User messages - distinct background */
.message-user[b-cyyxigh68i] {
  background-color: rgba(13, 110, 253, 0.1); /* subtle blue tint */
  border-left: 3px solid rgba(13, 110, 253, 0.5); /* accent border */
}

/* Assistant messages - default/neutral */
.message-assistant[b-cyyxigh68i] {
  background-color: transparent;
}

/* System messages - if any */
.message-system[b-cyyxigh68i] {
  background-color: rgba(108, 117, 125, 0.08); /* subtle gray */
}

.thinking-block[b-cyyxigh68i],
.status-block[b-cyyxigh68i] {
  border-left: 3px solid var(--bs-border-color);
  padding-left: .5rem;
}

/* Remove bottom margin from the last element in markdown content to avoid double spacing with container padding */
.markdown-content > :last-child[b-cyyxigh68i] {
  margin-bottom: 0 !important;
}

/* Pulse bar at bottom of chat while thinking */
.chat-pulse-bar[b-cyyxigh68i] {
    height: 4px;
    width: 100%;
    background: linear-gradient(90deg, var(--bs-primary) 0%, var(--bs-secondary) 50%, var(--bs-primary) 100%);
    background-size: 200% 100%;
    animation: pulse-gradient-b-cyyxigh68i 2s ease infinite;
    border-radius: 2px;
    margin-top: 0.5rem;
    opacity: 0.8;
}

@keyframes pulse-gradient-b-cyyxigh68i {
    0% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Command autocomplete popup */
.command-autocomplete-wrapper[b-cyyxigh68i] {
    position: relative;
}

.command-autocomplete-popup[b-cyyxigh68i] {
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.25);
    margin-bottom: .25rem;
    z-index: 1000;
    animation: popup-slide-up-b-cyyxigh68i 0.15s ease-out;
    overflow: hidden;
}

@keyframes popup-slide-up-b-cyyxigh68i {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.command-item[b-cyyxigh68i] {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .5rem .75rem;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.command-item:hover[b-cyyxigh68i],
.command-item.selected[b-cyyxigh68i] {
    background-color: var(--bs-primary);
    color: white;
}

.command-item.selected .command-desc[b-cyyxigh68i] {
    color: rgba(255, 255, 255, 0.8);
}

.command-name[b-cyyxigh68i] {
    font-family: var(--bs-font-monospace);
    font-weight: 600;
    min-width: 5rem;
}

.command-desc[b-cyyxigh68i] {
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
}

.command-item:hover .command-desc[b-cyyxigh68i],
.command-item.selected .command-desc[b-cyyxigh68i] {
    color: rgba(255, 255, 255, 0.8);
}

/* Shadow text overlay for autocomplete hint */
.textarea-shadow-wrapper[b-cyyxigh68i] {
    position: relative;
    width: 100%;
}

.textarea-shadow[b-cyyxigh68i] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: .625rem .75rem;
    font-family: inherit;
    font-size: inherit;
    line-height: 1.5;
    color: var(--bs-secondary-color);
    opacity: 0.5;
    pointer-events: none;
    white-space: pre-wrap;
    overflow: hidden;
}

.textarea-shadow-wrapper textarea[b-cyyxigh68i] {
    background: transparent;
    position: relative;
    z-index: 1;
}

/* Model selector dropdown */
.model-selector-wrapper[b-cyyxigh68i] {
    position: relative;
}

.model-selector-trigger[b-cyyxigh68i] {
    display: flex;
    align-items: center;
    gap: .25rem;
    padding: .15rem .5rem;
    border: none;
    border-radius: .35rem;
    background: transparent;
    color: var(--muted);
    font-size: .8rem;
    cursor: pointer;
    transition: color 0.15s ease;
    white-space: nowrap;
}

.model-selector-trigger:hover[b-cyyxigh68i] {
    color: var(--text);
}

.model-selector-name[b-cyyxigh68i] {
    max-width: 9rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.model-selector-chevron[b-cyyxigh68i] {
    font-size: .55rem;
    opacity: 0.7;
}

.model-selector-dropdown[b-cyyxigh68i] {
    position: absolute;
    bottom: calc(100% + .5rem);
    left: 0;
    min-width: 11rem;
    max-height: 18rem;
    overflow-y: auto;
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: .5rem;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.35);
    z-index: 1100;
    animation: model-dropdown-slide-up-b-cyyxigh68i 0.1s ease-out;
}

@keyframes model-dropdown-slide-up-b-cyyxigh68i {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.model-option[b-cyyxigh68i] {
    display: block;
    width: 100%;
    padding: .45rem .65rem;
    border: none;
    background: transparent;
    color: var(--text);
    font-size: .8rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.1s ease;
}

.model-option:hover[b-cyyxigh68i] {
    background: rgba(14, 165, 233, 0.15);
}

.model-option.selected[b-cyyxigh68i] {
    background: var(--accent);
    color: white;
}

/* Agent selector dropdown */
.agent-selector-wrapper[b-cyyxigh68i] {
    position: relative;
}

.agent-selector-trigger[b-cyyxigh68i] {
    display: flex;
    align-items: center;
    gap: .25rem;
    padding: .15rem .5rem;
    border: none;
    border-radius: .35rem;
    background: transparent;
    color: var(--muted);
    font-size: .8rem;
    cursor: pointer;
    transition: color 0.15s ease;
    white-space: nowrap;
}

.agent-selector-trigger:hover[b-cyyxigh68i] {
    color: var(--text);
}

.agent-selector-name[b-cyyxigh68i] {
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.agent-selector-chevron[b-cyyxigh68i] {
    font-size: .55rem;
    opacity: 0.7;
}

.agent-selector-dropdown[b-cyyxigh68i] {
    position: absolute;
    bottom: calc(100% + .5rem);
    left: 0;
    min-width: 10rem;
    max-height: 18rem;
    overflow-y: auto;
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: .5rem;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.35);
    z-index: 1100;
    animation: agent-dropdown-slide-up-b-cyyxigh68i 0.1s ease-out;
}

@keyframes agent-dropdown-slide-up-b-cyyxigh68i {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.agent-option[b-cyyxigh68i] {
    display: block;
    width: 100%;
    padding: .45rem .65rem;
    border: none;
    background: transparent;
    color: var(--text);
    font-size: .8rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.1s ease;
}

.agent-option:hover[b-cyyxigh68i] {
    background: rgba(14, 165, 233, 0.15);
}

.agent-option.selected[b-cyyxigh68i] {
    background: var(--accent);
    color: white;
}

/* Tools group and tile styling */
.tools-group[b-cyyxigh68i] {
    border-left: 3px solid var(--bs-border-color);
    padding-left: .75rem;
}

.tools-group-header[b-cyyxigh68i] {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--muted) !important;
}

.tools-tiles[b-cyyxigh68i] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.tool-tile[b-cyyxigh68i] {
    background: var(--panel, rgba(30, 30, 30, 0.6));
    border: 1px solid var(--border, rgba(255, 255, 255, 0.1));
    border-radius: .5rem;
    overflow: hidden;
}

.tool-tile[open][b-cyyxigh68i] {
    border-color: var(--bs-border-color);
}

.tool-tile > summary[b-cyyxigh68i] {
    list-style: none;
}

.tool-tile > summary[b-cyyxigh68i]::-webkit-details-marker {
    display: none;
}

.tool-tile > summary[b-cyyxigh68i]::marker {
    content: none;
}

.tool-tile-header[b-cyyxigh68i] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .6rem .75rem;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease;
}

.tool-tile-header:hover[b-cyyxigh68i] {
    background: rgba(255, 255, 255, 0.03);
}

.tool-tile-icon[b-cyyxigh68i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    color: var(--muted);
    flex-shrink: 0;
}

.tool-tile-icon i[b-cyyxigh68i] {
    font-size: 1rem;
}

.tool-tile-name[b-cyyxigh68i] {
    flex: 1;
    font-weight: 500;
    font-size: .9rem;
    color: var(--text);
}

.ado-tool-link[b-cyyxigh68i] {
    color: #0078d4;
    padding: 0.125rem 0.25rem;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.75rem;
}

.ado-tool-link:hover[b-cyyxigh68i] {
    background: rgba(0, 120, 212, 0.15);
    color: #0078d4;
}

.tool-tile-chevron[b-cyyxigh68i] {
    font-size: .65rem;
    color: var(--muted);
    transition: transform 0.2s ease;
}

.tool-tile[open] .tool-tile-chevron[b-cyyxigh68i] {
    transform: rotate(180deg);
}

.tool-tile-body[b-cyyxigh68i] {
    border-top: 1px solid var(--border, rgba(255, 255, 255, 0.1));
    padding: .5rem .75rem;
    background: rgba(0, 0, 0, 0.15);
}

.tool-section[b-cyyxigh68i] {
    margin-bottom: .75rem;
}

.tool-section:last-child[b-cyyxigh68i] {
    margin-bottom: 0;
}

.tool-section-label[b-cyyxigh68i] {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--muted);
    margin-bottom: .35rem;
    padding-bottom: .25rem;
    border-bottom: 1px solid var(--border, rgba(255, 255, 255, 0.05));
}

.tool-section-content[b-cyyxigh68i] {
    font-size: .85rem;
    max-height: 300px;
    overflow: auto;
}

.tool-section-content pre[b-cyyxigh68i] {
    margin: 0;
    padding: .5rem;
    background: rgba(0, 0, 0, 0.2);
    border-radius: .35rem;
    font-size: .8rem;
    white-space: pre-wrap;
    word-break: break-word;
}
/* /Components/Chat/PendingApprovalBar.razor.rz.scp.css */
.pending-approvals-container[b-rrdi3j0viy] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0.75rem 0;
}

.approval-bar[b-rrdi3j0viy] {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.1) 0%, rgba(245, 158, 11, 0.08) 100%);
    border: 1px solid rgba(251, 191, 36, 0.3);
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.approval-bar:hover[b-rrdi3j0viy] {
    border-color: rgba(251, 191, 36, 0.5);
    box-shadow: 0 2px 8px rgba(251, 191, 36, 0.15);
}

.approval-bar.expanded[b-rrdi3j0viy] {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.15) 0%, rgba(245, 158, 11, 0.1) 100%);
}

.approval-header[b-rrdi3j0viy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    cursor: pointer;
    gap: 1rem;
}

.approval-info[b-rrdi3j0viy] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.approval-icon[b-rrdi3j0viy] {
    font-size: 1rem;
    flex-shrink: 0;
}

.approval-title[b-rrdi3j0viy] {
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    flex-shrink: 0;
}

.approval-summary[b-rrdi3j0viy] {
    color: var(--muted);
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.approval-timer[b-rrdi3j0viy] {
    font-size: 0.75rem;
    color: rgba(251, 191, 36, 0.9);
    background: rgba(251, 191, 36, 0.15);
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    flex-shrink: 0;
}

.approval-actions[b-rrdi3j0viy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.btn-approve[b-rrdi3j0viy],
.btn-reject[b-rrdi3j0viy],
.btn-expand[b-rrdi3j0viy] {
    border: none;
    border-radius: 6px;
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-approve[b-rrdi3j0viy] {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.btn-approve:hover[b-rrdi3j0viy] {
    background: rgba(34, 197, 94, 0.35);
    border-color: rgba(34, 197, 94, 0.5);
}

.btn-reject[b-rrdi3j0viy] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.btn-reject:hover[b-rrdi3j0viy] {
    background: rgba(239, 68, 68, 0.35);
    border-color: rgba(239, 68, 68, 0.5);
}

.btn-expand[b-rrdi3j0viy] {
    background: rgba(148, 163, 184, 0.15);
    color: var(--muted);
    border: 1px solid rgba(148, 163, 184, 0.2);
    padding: 0.375rem 0.5rem;
    min-width: 2rem;
}

.btn-expand:hover[b-rrdi3j0viy] {
    background: rgba(148, 163, 184, 0.25);
}

.approval-details[b-rrdi3j0viy] {
    padding: 0.75rem 0.875rem;
    border-top: 1px solid rgba(251, 191, 36, 0.2);
    background: rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.details-header[b-rrdi3j0viy] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.details-label[b-rrdi3j0viy] {
    font-size: 0.75rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    flex-shrink: 0;
}

.details-value[b-rrdi3j0viy] {
    font-size: 0.875rem;
    color: var(--text);
}

.details-value.monospace[b-rrdi3j0viy] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    background: rgba(0, 0, 0, 0.2);
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
}

.details-params[b-rrdi3j0viy] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.params-content[b-rrdi3j0viy] {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    padding: 0.75rem;
    overflow-x: auto;
    max-height: 300px;
    overflow-y: auto;
}

.params-content[b-rrdi3j0viy]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.params-content[b-rrdi3j0viy]::-webkit-scrollbar-track {
    background: transparent;
}

.params-content[b-rrdi3j0viy]::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.3);
    border-radius: 3px;
}

.params-content[b-rrdi3j0viy]::-webkit-scrollbar-thumb:hover {
    background: rgba(148, 163, 184, 0.5);
}

.ado-link[b-rrdi3j0viy] {
    font-size: 0.75rem;
    color: #0078d4;
    text-decoration: none;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    background: rgba(0, 120, 212, 0.1);
    border: 1px solid rgba(0, 120, 212, 0.2);
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.ado-link:hover[b-rrdi3j0viy] {
    background: rgba(0, 120, 212, 0.2);
    border-color: rgba(0, 120, 212, 0.4);
    color: #0078d4;
}
/* /Components/Chat/StrReplaceDiffBar.razor.rz.scp.css */
.str-replace-diff-overlay[b-zslxp5ottf] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.str-replace-diff-container[b-zslxp5ottf] {
    background: var(--bg-secondary, #1e1e1e);
    border-radius: 8px;
    border: 1px solid var(--border-color, #333);
    max-width: 900px;
    width: 100%;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.diff-header[b-zslxp5ottf] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border-color, #333);
    background: var(--bg-tertiary, #252525);
}

.diff-header-info[b-zslxp5ottf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.diff-icon[b-zslxp5ottf] {
    font-size: 1.25rem;
}

.diff-title[b-zslxp5ottf] {
    font-weight: 600;
    color: var(--text-primary, #fff);
}

.diff-path[b-zslxp5ottf] {
    font-family: monospace;
    font-size: 0.875rem;
    color: var(--text-secondary, #aaa);
    background: var(--bg-code, #2d2d2d);
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.diff-timer[b-zslxp5ottf] {
    margin-left: auto;
    font-size: 0.875rem;
    color: var(--warning, #ffc107);
    font-weight: 500;
}

.diff-commit-message[b-zslxp5ottf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    font-size: 0.875rem;
}

.commit-label[b-zslxp5ottf] {
    color: var(--text-secondary, #aaa);
}

.commit-text[b-zslxp5ottf] {
    color: var(--text-primary, #fff);
    font-style: italic;
}

.diff-body[b-zslxp5ottf] {
    flex: 1;
    overflow: auto;
    padding: 1rem;
    min-height: 200px;
    max-height: 60vh;
}

.diff-footer[b-zslxp5ottf] {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color, #333);
    background: var(--bg-tertiary, #252525);
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}
/* /Components/Chat/TileLayoutComponent.razor.rz.scp.css */
.tile-layout[b-a07k07kfu6] {
    margin: 1rem 0;
}

.tile-layout-title[b-a07k07kfu6] {
    margin-bottom: 0.75rem;
}

.tile-layout-title h5[b-a07k07kfu6] {
    color: var(--text);
    font-weight: 600;
    margin: 0;
}

.tile-grid[b-a07k07kfu6] {
    display: grid;
    gap: 1rem;
    width: 100%;
}

/* Grid layouts */
.grid-auto[b-a07k07kfu6] {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.grid-2col[b-a07k07kfu6] {
    grid-template-columns: repeat(2, 1fr);
}

.grid-3col[b-a07k07kfu6] {
    grid-template-columns: repeat(3, 1fr);
}

.grid-stacked[b-a07k07kfu6] {
    grid-template-columns: 1fr;
}

.grid-custom[b-a07k07kfu6] {
    grid-template-columns: repeat(12, 1fr);
}

/* Responsive breakpoints */
@media (max-width: 768px) {
    .grid-2col[b-a07k07kfu6],
    .grid-3col[b-a07k07kfu6],
    .grid-custom[b-a07k07kfu6] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 992px) {
    .grid-3col[b-a07k07kfu6] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Panel styling */
.tile-panel[b-a07k07kfu6] {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 0.375rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s ease-in-out;
}

.tile-panel:hover[b-a07k07kfu6] {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.tile-panel-header[b-a07k07kfu6] {
    padding: 0.75rem 1rem;
    background: var(--callout-bg);
    border-bottom: 1px solid var(--border);
}

.tile-panel-title[b-a07k07kfu6] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text);
}

.tile-panel-content[b-a07k07kfu6] {
    padding: 1rem;
    flex: 1;
    overflow: auto;
}

/* Size hints for auto layout */
.size-hint-2[b-a07k07kfu6] {
    grid-column: span 2;
}

.size-hint-3[b-a07k07kfu6] {
    grid-column: span 3;
}

/* Panel type-specific styling */
.panel-type-chart[b-a07k07kfu6] {
    min-height: 250px;
}

.panel-type-chart .tile-panel-content[b-a07k07kfu6] {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
    overflow: hidden;
}

 .panel-type-chart .tile-panel-content pre[b-a07k07kfu6] {
     width: 100%;
     height: 100%;
     margin: 0;
     padding: 0;
     flex: 1;
 }

 .panel-type-chart .tile-panel-content canvas[b-a07k07kfu6] {
     width: 100% !important;
     height: 100% !important;
     max-width: none !important;
     max-height: none !important;
     display: block;
 }

.panel-type-code .tile-panel-content[b-a07k07kfu6] {
    padding: 0;
}

.panel-type-code .tile-panel-content pre[b-a07k07kfu6] {
    margin: 0;
    border-radius: 0;
}

.panel-type-table .tile-panel-content[b-a07k07kfu6] {
    padding: 0;
}

.panel-type-table table[b-a07k07kfu6] {
    margin: 0;
}

.panel-type-alert[b-a07k07kfu6] {
    border-left: 4px solid #ffc107;
}

.panel-type-alert .tile-panel-header[b-a07k07kfu6] {
    background: rgba(255, 193, 7, 0.1);
}

.panel-type-metric[b-a07k07kfu6] {
    text-align: center;
}

.panel-type-metric .tile-panel-content[b-a07k07kfu6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.panel-type-metric .tile-panel-content h1[b-a07k07kfu6],
.panel-type-metric .tile-panel-content h2[b-a07k07kfu6],
.panel-type-metric .tile-panel-content h3[b-a07k07kfu6] {
    margin: 0.25rem 0;
    font-weight: 700;
    color: var(--accent);
}

/* Content type styling */
.content-default[b-a07k07kfu6] {
    font-size: 0.9rem;
}

.content-chart canvas[b-a07k07kfu6],
.content-chart svg[b-a07k07kfu6] {
    max-width: 100%;
}

 .content-chart svg[b-a07k07kfu6] {
     height: auto;
 }

.content-metric[b-a07k07kfu6] {
    font-size: 1rem;
}

.content-alert[b-a07k07kfu6] {
    background: rgba(255, 193, 7, 0.05);
}

/* /Components/DocumentDiffEditor.razor.rz.scp.css */
/* Document diff editor */
:host[b-5lj160ln0p] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    
    /* Diff specific variables */
    --diff-font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
    --diff-font-size: 12px;
    --diff-line-height: 1.5;
    
    /* Light theme defaults (will be overridden by dark theme in global context if needed, 
       but here we use the global --panel/--text vars plus some specific opacity-based colors) */
    --diff-added-bg: rgba(46, 160, 67, 0.15);
    --diff-added-text: inherit;
    --diff-removed-bg: rgba(248, 81, 73, 0.15);
    --diff-removed-text: inherit;
    
    --diff-gutter-bg: rgba(128, 128, 128, 0.05);
    --diff-gutter-text: var(--muted);
    --diff-border: var(--border);
}

.diff-editor[b-5lj160ln0p] {
    display: flex;
    flex-direction: column;
    background: var(--panel);
    border: 1px solid var(--diff-border);
    border-radius: 0.5rem;
    overflow: hidden;
    flex: 1 1 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.diff-editor:focus-within[b-5lj160ln0p] {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px var(--accent);
}

.diff-empty[b-5lj160ln0p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--muted);
    height: 100%;
}

/* Header / Summary */
.diff-summary[b-5lj160ln0p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--diff-border);
    background-color: var(--panel);
    gap: 1rem;
    flex-shrink: 0;
}

.diff-title[b-5lj160ln0p] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.diff-stats[b-5lj160ln0p] {
    font-size: 0.85rem;
    color: var(--muted);
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.diff-nav[b-5lj160ln0p] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Breadcrumb / Group Select */
.diff-group-breadcrumb[b-5lj160ln0p] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.diff-group-select[b-5lj160ln0p] {
    max-width: 200px;
    font-size: 0.85rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

/* Main Content Area */
.diff-document[b-5lj160ln0p] {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: auto;
    background: var(--panel);
    position: relative;
}

/* Group Styling (Change Sets) */
.diff-group[b-5lj160ln0p] {
    border-bottom: 1px solid var(--diff-border);
    transition: background-color 0.2s ease;
}

.diff-group.active[b-5lj160ln0p] {
    background-color: rgba(14, 165, 233, 0.03);
    box-shadow: inset 3px 0 0 var(--accent);
}

.diff-group:last-child[b-5lj160ln0p] {
    border-bottom: none;
}

.diff-group-header[b-5lj160ln0p] {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--panel);
    border-bottom: 1px solid var(--diff-border);
    padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.85rem;
    backdrop-filter: blur(8px);
    background: rgba(var(--panel-rgb), 0.95); /* needs explicit rgb var usually, falling back to panel */
}

/* Darken header slightly to distinguish from code */
.diff-group-header[b-5lj160ln0p] {
    background: var(--callout-bg);
}

.diff-group-title[b-5lj160ln0p] {
    font-weight: 600;
    margin-left: 0.5rem;
}

.diff-group-status[b-5lj160ln0p] {
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
    text-transform: uppercase;
    font-weight: 600;
    background: var(--muted);
    color: #fff;
    opacity: 0.7;
}

.diff-group-approved .diff-group-status[b-5lj160ln0p] { background: #22c55e; opacity: 1; }
.diff-group-rejected .diff-group-status[b-5lj160ln0p] { background: #ef4444; opacity: 1; }
.diff-group-pending .diff-group-status[b-5lj160ln0p] { background: #eab308; opacity: 1; }

/* Lines Container */
.diff-lines[b-5lj160ln0p] {
    display: flex;
    flex-direction: column;
    font-family: var(--diff-font-family);
    font-size: var(--diff-font-size);
    line-height: var(--diff-line-height);
}

/* Individual Line */
.diff-line[b-5lj160ln0p] {
    display: flex;
    width: 100%;
    background-color: transparent;
}

.diff-line:hover[b-5lj160ln0p] {
    background-color: rgba(0,0,0,0.02);
}

.diff-line-added[b-5lj160ln0p] {
    background-color: var(--diff-added-bg);
}

.diff-line-removed[b-5lj160ln0p] {
    background-color: var(--diff-removed-bg);
}

.diff-line-highlighted[b-5lj160ln0p] {
    box-shadow: inset 2px 0 0 var(--accent);
    background-color: rgba(14, 165, 233, 0.1) !important; /* Override add/remove bg for focus */
}

.diff-line-group-hover[b-5lj160ln0p] {
    background-color: rgba(14, 165, 233, 0.15) !important;
    box-shadow: inset 4px 0 0 var(--accent) !important;
}

/* Gutter (Line Numbers) */
.diff-line-gutter[b-5lj160ln0p] {
    display: flex;
    flex-shrink: 0;
    width: 80px; /* Sufficient for 2 columns of numbers */
    background-color: var(--diff-gutter-bg);
    border-right: 1px solid var(--diff-gutter-border);
    user-select: none;
    padding: 0 0.5rem;
    color: var(--diff-gutter-text);
    justify-content: center; /* Center the two numbers */
    gap: 0.5rem;
    cursor: default;
}

.diff-line-number[b-5lj160ln0p] {
    min-width: 2rem;
    text-align: right;
    opacity: 0.7;
}

.diff-line-number:empty[b-5lj160ln0p]::before {
    content: " ";
}

/* Content Body */
.diff-line-body[b-5lj160ln0p] {
    flex: 1;
    padding: 0 1rem;
    white-space: pre-wrap;
    word-break: break-all;
    position: relative;
    display: flex;
    align-items: baseline;
}

.diff-line-prefix[b-5lj160ln0p] {
    user-select: none;
    margin-right: 0.5rem;
    color: var(--muted);
    width: 1em;
    display: inline-block;
    text-align: center;
}

.diff-line-added .diff-line-prefix[b-5lj160ln0p] { color: #22c55e; }
.diff-line-removed .diff-line-prefix[b-5lj160ln0p] { color: #ef4444; }

.diff-line-text[b-5lj160ln0p] {
    color: var(--text);
}

/* Actions (Hover Buttons) */
.diff-line-actions[b-5lj160ln0p] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding-right: 0.5rem;
    opacity: 0;
    transition: opacity 0.1s;
}

.diff-line:hover .diff-line-actions[b-5lj160ln0p],
.diff-line:focus-within .diff-line-actions[b-5lj160ln0p],
.diff-line-highlighted .diff-line-actions[b-5lj160ln0p] {
    opacity: 1;
}

.diff-line-actions .btn[b-5lj160ln0p] {
    padding: 0.1rem 0.4rem;
    font-size: 0.7rem;
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 600;
    border-radius: 3px;
    white-space: nowrap; /* Prevent wrapping in flex container */
}

.btn-xs[b-5lj160ln0p] {
    padding: 0.05rem 0.3rem;
    font-size: 0.65rem;
}

/* Context Lines (Unchanged) */
.diff-line-context[b-5lj160ln0p] {
    color: var(--muted);
}
.diff-line-context .diff-line-text[b-5lj160ln0p] {
    color: var(--muted);
}

/* Footer */
.diff-footer[b-5lj160ln0p] {
    padding: 1rem;
    border-top: 1px solid var(--diff-border);
    background: var(--panel);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Responsive */
@media (max-width: 768px) {
    .diff-line-gutter[b-5lj160ln0p] {
        width: 50px;
        font-size: 0.7rem;
        gap: 0.25rem;
    }
    .diff-line-number[b-5lj160ln0p] {
        min-width: 1.5rem;
    }
}

/* Status States */
.diff-line-accepted[b-5lj160ln0p] {
    background-color: rgba(34, 197, 94, 0.1);
}
.diff-line-accepted .diff-line-gutter[b-5lj160ln0p] {
    border-left: 3px solid #22c55e;
    padding-left: calc(0.5rem - 3px); /* Adjust padding to account for border */
    background-color: rgba(34, 197, 94, 0.2);
}

.diff-line-rejected[b-5lj160ln0p] {
    opacity: 0.6;
}
.diff-line-rejected .diff-line-text[b-5lj160ln0p] {
    text-decoration: line-through;
}
.diff-line-rejected .diff-line-gutter[b-5lj160ln0p] {
    border-left: 3px solid #ef4444;
    padding-left: calc(0.5rem - 3px);
    background-color: rgba(239, 68, 68, 0.1);
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-8s6c175gr8] {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100vh; /* Fallback */
    height: 100dvh; /* Mobile viewport fix */
}

main[b-8s6c175gr8] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0; /* allow inner flex children to define scroll areas */
    overflow: hidden; /* prevent the whole content panel from scrolling */
}

.sidebar[b-8s6c175gr8] {
    background-color: var(--panel);
    border-right: 1px solid var(--border);
    position: relative; /* anchor mobile hamburger inside sidebar */
}

.top-row[b-8s6c175gr8] {
    background-color: var(--panel);
    border-bottom: 1px solid var(--border);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-8s6c175gr8]  a, .top-row[b-8s6c175gr8]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
        color: var(--muted);
    }

    .top-row[b-8s6c175gr8]  a:hover, .top-row[b-8s6c175gr8]  .btn-link:hover {
        text-decoration: underline;
        color: var(--text);
    }

    .top-row[b-8s6c175gr8]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Make the main article fill available height and host flex children */
    article.content[b-8s6c175gr8] {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0; /* allow flex child to shrink for inner scroll areas */
        overflow: hidden; /* inner components manage their own scrolling */
    }

    .page[b-8s6c175gr8] {
        flex-direction: row;
    }

    .sidebar[b-8s6c175gr8] {
        /* base width and smooth expansion */
        --sidebar-width: 275px;
        flex: 0 0 var(--sidebar-width); /* use flex-basis for reliable flex resizing */
        width: auto; /* width derived from flex-basis */
        height: 100vh; /* Fallback */
        height: 100dvh;
        position: sticky;
        top: 0;
        box-sizing: border-box;
        overflow: hidden; /* avoid scrollbars influencing width during content changes */
        transition: flex-basis 220ms ease;
        will-change: flex-basis;
    }

    .top-row[b-8s6c175gr8] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-8s6c175gr8]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-8s6c175gr8], article[b-8s6c175gr8] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }

/* Force mobile mode layout even on desktop screens */
.page.mobile-mode[b-8s6c175gr8] {
    flex-direction: column !important;
}

.page.mobile-mode .sidebar[b-8s6c175gr8] {
    width: 100% !important;
    height: auto !important;
    min-height: 3.5rem;
    flex: none !important;
    position: relative !important;
    top: auto !important;
    transition: none !important;
}

.page.mobile-mode .top-row[b-8s6c175gr8] {
    justify-content: space-between !important;
    padding-left: initial !important;
}

.page.mobile-mode .top-row[b-8s6c175gr8]  a,
.page.mobile-mode .top-row[b-8s6c175gr8]  .btn-link {
    margin-left: 0 !important;
}

.page.mobile-mode .top-row[b-8s6c175gr8],
.page.mobile-mode article[b-8s6c175gr8] {
    padding-left: initial;
    padding-right: initial;
}

#blazor-error-ui[b-8s6c175gr8] {
    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[b-8s6c175gr8] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Visually hide the checkbox but keep it accessible and toggleable via label */
.navbar-toggler[b-8ggefdx16g] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Hide chat-date by default; reveal when expanded on desktop */
.chat-date[b-8ggefdx16g] {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 160ms ease, max-height 160ms ease, margin-top 160ms ease;
    margin-top: 0;
}

@media (min-width: 641px) {
    /* Desktop: collapse badge by default */
    .chat-list .badge-slot[b-8ggefdx16g] {
        width: 0;
        flex: 0 0 0;
        opacity: 0;
        overflow: hidden;
        transition: width 200ms ease, opacity 140ms ease;
    }
}

/* Reserve space to keep counts and spinner aligned and prevent reflow */
.badge-slot[b-8ggefdx16g] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: 2.25rem; /* fits two-digit counts comfortably */
    flex: 0 0 2.25rem;
}
.run-indicator[b-8ggefdx16g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem; /* matches spinner-border-sm visual width */
    flex: 0 0 1rem;
}
.fixed-spinner[b-8ggefdx16g] {
    width: 1rem;
    height: 1rem;
    border-width: .15em;
}

/* Fixed-width slot for left icon/spinner so rows align and don't jitter */
.left-icon-slot[b-8ggefdx16g] {
    display: inline-flex;
    align-items: flex-start; /* top-align like multi-line icon */
    justify-content: center;
    width: 1.25rem;
    flex: 0 0 1.25rem;
    padding-top: .1rem; /* match icon nudge */
}
.left-icon-slot .bi[b-8ggefdx16g] { margin-right: 0; }

/* Unread indicator: compact dot that fits in left icon slot */
.unread-dot[b-8ggefdx16g] {
    display: inline-block;
    width: .6rem;
    height: .6rem;
    border-radius: 50%;
    background-color: #ffc107; /* bootstrap warning-like amber */
    box-shadow: 0 0 0 2px rgba(0,0,0,0.15) inset;
}

.top-row[b-8ggefdx16g] {
    min-height: 3.5rem;
    background-color: var(--panel);
    border-bottom: 1px solid var(--border);
}

.navbar-brand[b-8ggefdx16g] {
    font-size: 1.1rem;
}

/* Avoid overriding Bootstrap Icons globally to prevent baseline drift */

.bi-house-door-fill-nav-menu[b-8ggefdx16g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-8ggefdx16g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-8ggefdx16g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-8ggefdx16g] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-8ggefdx16g] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-8ggefdx16g] {
        padding-bottom: 0.5rem;
    }

/* Remove extra padding from chat list items */
.chat-list .nav-item:last-of-type[b-8ggefdx16g] {
    padding-bottom: 0;
    margin-bottom: 0;
}

    .nav-item[b-8ggefdx16g]  .nav-link {
        color: var(--muted);
        background: transparent;
        border: 1px solid transparent;
        border-radius: 6px;
        height: 2.5rem;
        display: flex;
        align-items: center;
        line-height: 1; /* rely on flex centering for consistent icon/text alignment */
        gap: .5rem; /* consistent spacing between icon and text */
        width: 100%;
        transition: background-color 120ms ease, border-color 120ms ease;
    }

    /* Minimal, safe alignment for icons inside nav links */
    .nav-item[b-8ggefdx16g]  .nav-link .bi {
        position: static;
        top: 0;
        vertical-align: -.125em; /* match bootstrap-icons */
        margin-right: .5rem;
    }

.nav-item[b-8ggefdx16g]  a.active {
    background-color: rgba(255,255,255,0.08); /* softer active highlight (dark) */
    color: var(--text);
    border-color: var(--border);
}
/* Light theme active state (darker overlay for contrast) */
:global(body[data-bs-theme="light"]) .nav-item[b-8ggefdx16g]  a.active {
    background-color: rgba(0,0,0,0.06); /* softer active highlight (light) */
    color: var(--text);
    border-color: var(--border);
}

.nav-item[b-8ggefdx16g]  .nav-link:hover {
    background-color: rgba(255,255,255,0.10); /* hover a touch stronger than active */
    color: var(--text);
    border-color: var(--border);
}
/* Light theme hover state */
:global(body[data-bs-theme="light"]) .nav-item[b-8ggefdx16g]  .nav-link:hover {
    background-color: rgba(0,0,0,0.08); /* hover > active */
    color: var(--text);
    border-color: var(--border);
}

/* Section header + icon buttons */
.section-header[b-8ggefdx16g] {
    height: 2.25rem;
    padding: 0 .25rem;
}

.section-title[b-8ggefdx16g] {
    font-weight: 600;
    font-size: .9rem;
}

.icon-btn[b-8ggefdx16g] {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--muted);
    padding: .25rem;
    border-radius: 6px;
}

.icon-btn:hover[b-8ggefdx16g] {
    background-color: rgba(255,255,255,0.08);
    color: var(--text);
}
/* Light theme icon button hover */
:global(body[data-bs-theme="light"]) .icon-btn:hover[b-8ggefdx16g] {
    background-color: rgba(0,0,0,0.06);
}

/* Toggle group for History | Options */
.toggle-group[b-8ggefdx16g] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: 0 .25rem;
    margin-left: .25rem;
    border-radius: 6px;
    background-color: rgba(255,255,255,0.06);
}
/* Light theme toggle background */
:global(body[data-bs-theme="light"]) .toggle-group[b-8ggefdx16g] {
    background-color: rgba(0,0,0,0.06);
}

.toggle-btn[b-8ggefdx16g] {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--muted);
    padding: .15rem .5rem;
    border-radius: 6px;
    font-size: .75rem;
}

.toggle-btn:hover[b-8ggefdx16g] {
    background-color: rgba(255,255,255,0.10);
    color: var(--text);
}
/* Light theme toggle hover */
:global(body[data-bs-theme="light"]) .toggle-btn:hover[b-8ggefdx16g] {
    background-color: rgba(0,0,0,0.06);
}

.toggle-btn.active[b-8ggefdx16g] {
    background-color: rgba(255,255,255,0.16);
    color: var(--text);
}
/* Light theme toggle active */
:global(body[data-bs-theme="light"]) .toggle-btn.active[b-8ggefdx16g] {
    background-color: rgba(0,0,0,0.10);
}

/* Hamburger button theme adjustments */
:global(body[data-bs-theme="light"]) .navbar-toggle-button[b-8ggefdx16g] {
    border: 1px solid rgba(0,0,0,0.15);
    background: rgba(0,0,0,0.05);
    color: var(--text);
}

/* Chats list */
.chat-list .chat-item[b-8ggefdx16g] {
    height: auto;
    line-height: 1.2;
    padding: .4rem .35rem;
    align-items: flex-start;
}

.chat-text[b-8ggefdx16g] {
    min-width: 0; /* allow truncation to work */
}

.chat-title[b-8ggefdx16g] {
    /* Allow long titles to wrap; remove artificial max-width */
    font-size: .95rem;
    font-weight: 600;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.time[b-8ggefdx16g] {
    font-size: .75rem;
    display: block;
    line-height: 1.1;
    margin-bottom: 2px;
}

.badge-count[b-8ggefdx16g] {
    display: inline-block;
    min-width: 1.25rem;
    text-align: center;
    font-size: .7rem;
    padding: 0 .4rem;
    border-radius: .5rem;
    background-color: #2b2f36;
    color: #bfc3ca;
}

/* Chat item hover tooltip bubble */
.chat-list .chat-item[b-8ggefdx16g] {
    position: relative; /* anchor tooltip */
}

.chat-list .chat-item[data-tooltip][b-8ggefdx16g]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
    display: none;
    white-space: pre-wrap; /* honor newlines */
    padding: .5rem .6rem;
    border-radius: .5rem;
    background: #1f232a;
    color: #fff;
    border: 1px solid #343a40;
    box-shadow: 0 8px 24px rgba(0,0,0,.35);
    max-width: 320px;
    z-index: 2000;
    pointer-events: none; /* avoid stealing hover */
}

.chat-list .chat-item[data-tooltip][b-8ggefdx16g]::before {
    content: "";
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent transparent #1f232a; /* arrow */
    display: none;
    z-index: 2001;
    pointer-events: none;
}

.chat-list .chat-item:hover[b-8ggefdx16g]::after,
.chat-list .chat-item:hover[b-8ggefdx16g]::before {
    display: block;
}

/* Icon align for two-line layout */
.chat-item .bi[b-8ggefdx16g] {
    align-self: flex-start;
    margin-top: .1rem; /* slight nudge for two-line items */
}

.chat-list .bi-pin-angle-fill[b-8ggefdx16g] {
    color: #ffc107; /* Gold color for pinned items */
}

/* Rely on global .bi baseline; minimize per-context overrides */

/* Ensure icon + label align in header title */
.section-title[b-8ggefdx16g] {
    display: inline-flex;
    align-items: center;
}

/* Center-align message count badge in multi-line chat link */
.chat-list .badge-count[b-8ggefdx16g] {
    align-self: center;
}

.nav-scrollable[b-8ggefdx16g] {
    display: block; /* Always visible by default now that hamburger is gone */
    position: absolute; /* Overlay on mobile */
    top: 3.5rem;
    left: 0;
    right: 0;
    background-color: var(--panel);
    z-index: 2000;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
    max-height: calc(100dvh - 3.5rem); /* Use dynamic viewport height */
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}

/* Ensure nested containers don't introduce horizontal overflow */
.nav-scrollable nav[b-8ggefdx16g] {
    overflow-x: hidden;
    flex: 1 1 auto;
    min-height: 0;
}
.chat-list[b-8ggefdx16g] {
    overflow-x: hidden;
    margin-bottom: 0;
    padding-bottom: 0;
}

.navbar-toggler:checked ~ .nav-scrollable[b-8ggefdx16g] {
    display: block;
}

/* Chat list wrapper with infinite scroll */
.chat-list-wrapper[b-8ggefdx16g] {
    position: relative;
    max-height: none;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 0;
    padding-bottom: 0;
    
    /* Minimal scrollbar styling - Firefox */
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

/* Minimal scrollbar styling - Webkit (Chrome, Edge, Safari) */
.chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar {
    width: 6px;
}

.chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar-track {
    background: transparent;
}

.chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 3px;
}

.chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* Light theme scrollbar */
:global(body[data-bs-theme="light"]) .chat-list-wrapper[b-8ggefdx16g] {
    scrollbar-color: rgba(0, 0, 0, 0.15) transparent;
}

:global(body[data-bs-theme="light"]) .chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
}

:global(body[data-bs-theme="light"]) .chat-list-wrapper[b-8ggefdx16g]::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

.nav-item.px-3.mt-2[b-8ggefdx16g] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* Scroll to top button */
.chat-scroll-bar[b-8ggefdx16g] {
    position: sticky;
    z-index: 10;
    display: flex;
    justify-content: center;
    padding: 0.5rem 0;
    pointer-events: none;
}

.chat-scroll-bar.top[b-8ggefdx16g] {
    top: 0;
    background: linear-gradient(to bottom, var(--panel) 0%, var(--panel) 50%, transparent 100%);
}

.chat-scroll-btn[b-8ggefdx16g] {
    pointer-events: all;
    border-radius: 50%;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.chat-scroll-btn:hover[b-8ggefdx16g] {
    transform: scale(1.05);
}

/* Default Desktop-like behavior (applied when NOT in mobile mode) */

:global(.page:not(.mobile-mode)) .nav-scrollable[b-8ggefdx16g] {
    /* Never collapse the sidebar for wide screens */
    display: block !important;
    position: static !important;
    box-shadow: none;
    border-bottom: none;
    max-height: none;

    /* Allow sidebar to scroll for tall menus */
    height: calc(100vh - 3.5rem);
    height: calc(100dvh - 3.5rem);
    overflow-y: auto;
    overflow-x: hidden; /* prevent horizontal scrollbar */
}

/* Mobile Mode: sidebar is completely hidden */
:global(.page.mobile-mode) .nav-scrollable[b-8ggefdx16g] {
    display: none !important;
}

/* Options dropdown container */
.options-dropdown-container[b-8ggefdx16g] {
    position: relative;
}

/* Options dropdown menu */
.options-dropdown-menu[b-8ggefdx16g] {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 3000;
    min-width: 220px;
    padding: .5rem 0;
    margin-top: .25rem;
    background-color: var(--panel);
    border: 1px solid var(--border);
    border-radius: .5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}

.options-dropdown-menu .dropdown-item[b-8ggefdx16g] {
    display: flex;
    align-items: center;
    padding: .5rem 1rem;
    color: var(--text);
    text-decoration: none;
    font-size: .875rem;
    transition: background-color 120ms ease;
}

.options-dropdown-menu .dropdown-item:hover[b-8ggefdx16g] {
    background-color: rgba(255,255,255,0.08);
}

:global(body[data-bs-theme="light"]) .options-dropdown-menu .dropdown-item:hover[b-8ggefdx16g] {
    background-color: rgba(0,0,0,0.06);
}

.options-dropdown-menu .dropdown-divider[b-8ggefdx16g] {
    height: 0;
    margin: .5rem 0;
    border-top: 1px solid var(--border);
}
/* /Components/Pages/RsvpReader.razor.rz.scp.css */
.rsvp-container[b-9q366wv0gu] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1rem;
    gap: 1rem;
}

.rsvp-controls-top[b-9q366wv0gu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rsvp-controls-top h4[b-9q366wv0gu] {
    margin: 0;
}

.rsvp-text-input[b-9q366wv0gu] {
    display: flex;
    flex-direction: column;
}

.rsvp-full-text-display[b-9q366wv0gu] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.375rem;
    padding: 1rem;
    background: var(--bs-body-bg, #fff);
    min-height: 200px;
    max-height: 300px;
    scroll-behavior: smooth;
}

.rsvp-line[b-9q366wv0gu] {
    white-space: pre-wrap;
    word-wrap: break-word;
    line-height: 1.8;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    transition: background 0.2s ease;
}

.rsvp-line.current-line[b-9q366wv0gu] {
    background: rgba(13, 110, 253, 0.15);
}

.rsvp-word[b-9q366wv0gu] {
    display: inline;
    transition: all 0.15s ease;
}

.rsvp-word.current-word[b-9q366wv0gu] {
    background: rgba(255, 193, 7, 0.5);
    border-radius: 0.2rem;
    padding: 0.1rem 0.2rem;
    font-weight: 600;
}

.rsvp-display-area[b-9q366wv0gu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: var(--bs-dark, #212529);
    border-radius: 0.5rem;
    position: relative;
    min-height: 120px;
}

.rsvp-word-display[b-9q366wv0gu] {
    font-size: 3rem;
    font-family: 'Consolas', 'Monaco', monospace;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--bs-light, #f8f9fa);
    text-align: center;
    min-height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rsvp-before[b-9q366wv0gu],
.rsvp-after[b-9q366wv0gu] {
    color: var(--bs-light, #f8f9fa);
}

.rsvp-anchor[b-9q366wv0gu] {
    color: #ff3333;
    font-weight: 700;
}

.rsvp-anchor-line[b-9q366wv0gu] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 60%;
    background: linear-gradient(to bottom, transparent, #ff3333 30%, #ff3333 70%, transparent);
    pointer-events: none;
    opacity: 0.5;
}

.rsvp-done[b-9q366wv0gu] {
    color: #28a745;
    font-style: italic;
}

.rsvp-placeholder[b-9q366wv0gu] {
    color: var(--bs-secondary, #6c757d);
    opacity: 0.5;
}

.rsvp-wpm-selector[b-9q366wv0gu] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.5rem 0;
}

.wpm-label[b-9q366wv0gu] {
    font-weight: 500;
    margin-right: 0.5rem;
    color: var(--bs-body-color, #212529);
}

.rsvp-wpm-selector .btn[b-9q366wv0gu] {
    min-width: 50px;
}