:root {
    --bs-primary: #4f46e5;
    --bs-primary-rgb: 79, 70, 229;
    --bs-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --bs-body-bg: #fafafa;
    --bs-border-radius: 8px;
}

body { font-family: var(--bs-body-font-family); font-size: 0.925rem; }

.app-nav {
    background: #fff;
    border-bottom: 1px solid var(--bs-border-color);
    padding: 0.5rem 0;
}
.app-nav .navbar-brand {
    font-weight: 700; letter-spacing: -0.01em;
    display: inline-flex; align-items: center;
}

/* The mark is a tile, so it needs no extra chrome — just a size. */
.brand-mark { width: 24px; height: 24px; display: block; }
.brand-mark-lg { width: 30px; height: 30px; }
.app-nav .nav-link { font-weight: 500; padding: 0.35rem 0.75rem; border-radius: 6px; color: #52525b; }
.app-nav .nav-link.active { background: #eef2ff; color: var(--bs-primary); }

/* --- Account menu --------------------------------------------------------- */
.avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; border-radius: 50%;
    background: var(--bs-primary); color: #fff;
    font-size: 0.775rem; font-weight: 600; letter-spacing: 0.02em;
    user-select: none;
}
.dropdown-toggle-no-caret::after { display: none; }
.dropdown-toggle-no-caret:focus-visible .avatar {
    outline: 2px solid var(--bs-primary); outline-offset: 2px;
}
.app-nav .dropdown-menu { min-width: 15rem; }

.card { border-color: #e4e4e7; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.card-header { background: #fff; font-weight: 600; }

.table > :not(caption) > * > * { padding: 0.65rem 0.75rem; }
.table thead th { font-size: 0.75rem; text-transform: uppercase; letter-spacing: .04em; color: #71717a; font-weight: 600; }

code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.82em; }

/* Chat */
.chat-log { height: 460px; overflow-y: auto; background: #fff; padding: 1rem; }
.chat-msg { margin-bottom: 0.85rem; display: flex; gap: 0.6rem; }
.chat-msg .who {
    flex: 0 0 auto; width: 26px; height: 26px; border-radius: 6px;
    display: grid; place-items: center; font-size: 0.7rem; font-weight: 700; color: #fff;
}
.chat-msg.user .who { background: #71717a; }
.chat-msg.bot .who { background: var(--bs-primary); }
.chat-msg .bubble { white-space: pre-wrap; line-height: 1.5; padding-top: 2px; }
.chat-calls { font-size: 0.75rem; color: #71717a; margin-top: 0.35rem; }
.chat-calls .badge { font-weight: 500; }

/* --- Dropdowns inside cards ---------------------------------------------- */

/* Two separate things bury an open menu, and a card grid hits both. Bootstrap
   gives every .card position:relative with z-index auto, so cards later in the
   grid paint over the ones before them; and the floating chat button is fixed
   at 1050, well above a menu's own 1000. A menu is only open for a moment, so
   while it is, it wins against both. The z-2 wrappers in the markup are a
   different job — they lift the buttons above the card's stretched-link. */
.dropdown-menu.show { z-index: 1060; }
.card:has(.dropdown-menu.show) { z-index: 1060; }

/* --- Schedules ----------------------------------------------------------- */

/* The whole tile is the target here, so it needs a hover of its own. The Stack
   rows get theirs from the link inside; a card that big needs the edge to move. */
.schedule-card { transition: border-color .12s ease, box-shadow .12s ease; }
.schedule-card:hover {
    border-color: #d4d4d8;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .07);
}

/* A grid goes ragged when one prompt is a sentence and the next is a
   paragraph, so the prompt is clamped rather than truncated — three lines
   still show the shape of the question. */
.schedule-prompt {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #52525b;
    line-height: 1.45;
}

.capability-row td { vertical-align: middle; }
.capability-scroll { max-height: 620px; overflow-y: auto; }
.secret-hint { font-family: ui-monospace, monospace; letter-spacing: 1px; }

/* --- Floating chat widget ------------------------------------------------ */
.chewie-chat { position: fixed; right: 22px; bottom: 22px; z-index: 1050; }

.chewie-chat-toggle {
    width: 52px; height: 52px; border-radius: 50%; border: 0;
    background: var(--bs-primary); color: #fff; font-size: 1.25rem;
    box-shadow: 0 6px 20px rgba(79, 70, 229, .35);
    display: grid; place-items: center; position: relative;
    transition: transform .12s ease, box-shadow .12s ease;
}
.chewie-chat-toggle:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(79,70,229,.45); }
.chewie-chat.open .chewie-chat-toggle { transform: scale(.9); opacity: .85; }

.chewie-chat-badge {
    position: absolute; top: -3px; right: -3px;
    background: #18181b; color: #fff; font-size: .65rem; font-weight: 600;
    min-width: 19px; height: 19px; border-radius: 10px; padding: 0 5px;
    display: grid; place-items: center; border: 2px solid #fafafa;
}

.chewie-chat-panel {
    position: absolute; right: 0; bottom: 66px;
    width: min(400px, calc(100vw - 44px));
    background: #fff; border: 1px solid #e4e4e7; border-radius: 12px;
    box-shadow: 0 16px 48px rgba(0,0,0,.18);
    display: flex; flex-direction: column; overflow: hidden;
}

.chewie-chat-header {
    display: flex; align-items: center; justify-content: space-between;
    gap: .5rem; padding: .7rem .9rem; border-bottom: 1px solid #f0f0f1;
}
.chewie-chat-sub { font-size: .72rem; color: #71717a; }

.chewie-chat-log { height: 380px; overflow-y: auto; padding: .9rem; }
.chewie-chat-empty { font-size: .82rem; color: #71717a; line-height: 1.5; }

.chewie-msg { display: flex; gap: .55rem; margin-bottom: .8rem; }
.chewie-msg .who {
    flex: 0 0 auto; width: 26px; height: 26px; border-radius: 6px;
    display: grid; place-items: center; font-size: .6rem; font-weight: 700; color: #fff;
}
.chewie-msg.user .who { background: #a1a1aa; }
.chewie-msg.bot .who { background: var(--bs-primary); }
.chewie-msg .bubble { white-space: pre-wrap; line-height: 1.5; font-size: .87rem; padding-top: 3px; }
.chewie-msg.thinking .bubble { color: #a1a1aa; font-style: italic; }

.chewie-calls { margin-top: .4rem; display: flex; flex-wrap: wrap; gap: .25rem; }
.chewie-calls .badge { font-weight: 500; font-size: .66rem; }

.chewie-chat-footer { padding: .65rem .75rem; border-top: 1px solid #f0f0f1; }
.chewie-chat-footer .form-control { font-size: .87rem; }

.chewie-chat-header .chewie-scope {
    border: 0; box-shadow: none; padding-left: 0; font-weight: 600;
    font-size: .85rem; background-position: right .1rem center;
}
.chewie-chat-header .chewie-scope:focus { box-shadow: none; }

/* --- Toasts --------------------------------------------------------------
   Bottom-left, opposite the chat widget so the two never collide. Dark, so a
   message reads as a notification rather than as part of the page.          */
.toasts {
    position: fixed; left: 22px; bottom: 22px; z-index: 1080;
    display: flex; flex-direction: column-reverse; gap: .5rem;
    width: min(380px, calc(100vw - 44px));
}

.toast-msg {
    display: flex; align-items: flex-start; gap: .6rem;
    background: #18181b; color: #fafafa;
    border-radius: 10px; padding: .7rem .8rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
    font-size: .85rem; line-height: 1.45;
    border-left: 3px solid #52525b;
    animation: toast-in .22s cubic-bezier(.16, 1, .3, 1);
}
.toast-msg.leaving { animation: toast-out .18s ease forwards; }

@keyframes toast-in  { from { opacity: 0; transform: translateX(-14px) scale(.98); } }
@keyframes toast-out { to   { opacity: 0; transform: translateX(-14px); } }

@media (prefers-reduced-motion: reduce) {
    .toast-msg, .toast-msg.leaving { animation: none; }
}

.toast-icon { flex: 0 0 auto; margin-top: .1rem; font-size: .95rem; color: #a1a1aa; }
.toast-body-text { flex: 1 1 auto; overflow-wrap: anywhere; }
.toast-body-text code { color: #e4e4e7; background: rgba(255, 255, 255, .1);
    padding: .05rem .3rem; border-radius: 4px; }

.toast-success { border-left-color: #22c55e; }
.toast-success .toast-icon { color: #22c55e; }
.toast-warning { border-left-color: #f59e0b; }
.toast-warning .toast-icon { color: #f59e0b; }
.toast-error   { border-left-color: #ef4444; }
.toast-error .toast-icon { color: #ef4444; }
.toast-info    { border-left-color: var(--bs-primary); }
.toast-info .toast-icon { color: #818cf8; }

.toast-close {
    flex: 0 0 auto; background: none; border: 0; color: #71717a;
    padding: 0 0 0 .25rem; line-height: 1; font-size: 1rem;
}
.toast-close:hover { color: #fafafa; }