/* ============================================================
   Fråga Rajdar — Redesign (handoff: design_handoff_fraga_rajdar)
   Public Sans + lugn palett + compact density som default.
   Laddas EFTER befintlig inline-CSS i vector-chat.html och
   skriver över via :where() + body[data-redesign="v1"].
   Designens layoutmått: sidebar 288px, topbar 56px,
   conversation 760px max, welcome 680px max.
   ============================================================ */

/* ── Designtokens ── */
body[data-redesign="v1"] {
    --rd-accent: #2f6fb0;
    --rd-accent-ink: #27598e;
    --rd-ink: #1a2231;
    --rd-ink-2: #48536a;
    --rd-ink-3: #7b8699;
    --rd-line: #e4e8f0;
    --rd-line-soft: #eef1f6;
    --rd-surface: #fff;
    --rd-sb-bg: #f4f6fa;
    --rd-canvas: #fbfcfe;
    --rd-good: #1f8a5b;
    --rd-bad: #bd6a3a;
    --rd-destructive: #c0533a;
    --rd-shadow-sm: 0 1px 2px rgba(20, 30, 55, .06);
    --rd-shadow: 0 1px 2px rgba(20, 30, 55, .05), 0 10px 30px rgba(20, 30, 55, .09);
}

body[data-redesign="v1"] {
    font-family: "Public Sans", system-ui, -apple-system, sans-serif;
    color: var(--rd-ink);
    background: var(--rd-canvas);
    font-size: 14px;
    line-height: 1.5;
}

/* ── Layout grund ── */
body[data-redesign="v1"] .app {
    grid-template-columns: 288px 1fr;
    background: var(--rd-canvas);
}

/* ── Sidebar ── */
body[data-redesign="v1"] aside {
    background: var(--rd-sb-bg);
    border-right: 1px solid var(--rd-line);
}

body[data-redesign="v1"] .aside-h {
    padding: 14px 16px 10px;
    border-bottom: 0;
    gap: 10px;
}
body[data-redesign="v1"] .aside-h .back {
    width: 30px; height: 30px;
    border-radius: 8px;
    border: 1px solid var(--rd-line);
    background: #fff;
    color: var(--rd-ink-2);
    font-size: 16px;
}
body[data-redesign="v1"] .aside-h .back:hover {
    color: var(--rd-ink);
    border-color: #cfd6e2;
    background: #fff;
}
body[data-redesign="v1"] .aside-h h1 {
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--rd-ink);
    display: flex;
    align-items: center;
    gap: 9px;
}
body[data-redesign="v1"] .aside-h h1::before {
    content: "";
    width: 26px;
    height: 26px;
    border-radius: 7px;
    background: var(--rd-accent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.6 5.4L19 10l-5.4 1.6L12 17l-1.6-5.4L5 10l5.4-1.6Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    flex: none;
}

/* Ny chatt-knapp */
body[data-redesign="v1"] .new-chat-btn {
    margin: 6px 16px 12px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 11px;
    background: var(--rd-accent);
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    box-shadow: var(--rd-shadow-sm);
    gap: 8px;
}
body[data-redesign="v1"] .new-chat-btn:hover { background: var(--rd-accent-ink); }

/* Sökfält i sidebar (nytt element) */
body[data-redesign="v1"] .sb-search {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 16px 8px;
    height: 38px;
    padding: 0 12px;
    background: #fff;
    border: 1px solid var(--rd-line);
    border-radius: 10px;
    color: var(--rd-ink-3);
}
body[data-redesign="v1"] .sb-search:focus-within {
    border-color: var(--rd-accent);
    outline: 2px solid color-mix(in srgb, var(--rd-accent) 28%, transparent);
}
body[data-redesign="v1"] .sb-search svg { flex: none; }
body[data-redesign="v1"] .sb-search input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    font: inherit;
    font-size: 13.5px;
    color: var(--rd-ink);
}

/* Sessionslista */
body[data-redesign="v1"] .sessions {
    padding: 4px 8px 10px;
}
body[data-redesign="v1"] .sb-group { margin-bottom: 8px; }
body[data-redesign="v1"] .sb-group-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--rd-ink-3);
    padding: 8px 10px 5px;
}

body[data-redesign="v1"] .session {
    position: relative;
    padding: 6px 8px 6px 10px;
    border-radius: 9px;
    color: var(--rd-ink-2);
    font-size: 13.5px;
    margin-bottom: 0;
    background: transparent;
    font-weight: normal;
}
body[data-redesign="v1"] .session:hover { background: #e8edf5; }
body[data-redesign="v1"] .session.active {
    background: #fff;
    box-shadow: var(--rd-shadow-sm);
    color: var(--rd-ink-2);
    font-weight: normal;
}
body[data-redesign="v1"] .session.active .session-title {
    color: var(--rd-accent-ink);
    font-weight: 600;
}
body[data-redesign="v1"] .session-title {
    font-size: 13.5px;
    color: var(--rd-ink-2);
}

/* Befintliga ✕-knappen ersätts av en row-menu (⋯) */
body[data-redesign="v1"] .session-del { display: none; }
body[data-redesign="v1"] .session-more {
    flex: none;
    width: 26px;
    height: 26px;
    border-radius: 7px;
    border: 0;
    background: transparent;
    color: var(--rd-ink-3);
    display: grid;
    place-items: center;
    opacity: 0;
    cursor: pointer;
}
body[data-redesign="v1"] .session:hover .session-more,
body[data-redesign="v1"] .session.active .session-more { opacity: 1; }
body[data-redesign="v1"] .session-more:hover {
    background: #dde4ee;
    color: var(--rd-ink);
}

/* Row-menu (dropdown) */
body[data-redesign="v1"] .rowmenu-scrim {
    position: fixed;
    inset: 0;
    z-index: 30;
}
body[data-redesign="v1"] .rowmenu {
    position: absolute;
    right: 6px;
    top: 36px;
    z-index: 31;
    width: 168px;
    background: #fff;
    border: 1px solid var(--rd-line);
    border-radius: 10px;
    box-shadow: var(--rd-shadow);
    padding: 5px;
}
body[data-redesign="v1"] .rowmenu button {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    padding: 8px 9px;
    border-radius: 7px;
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--rd-ink-2);
    cursor: pointer;
}
body[data-redesign="v1"] .rowmenu button:hover {
    background: var(--rd-line-soft);
    color: var(--rd-ink);
}
body[data-redesign="v1"] .rowmenu .rowmenu-del { color: var(--rd-destructive); }
body[data-redesign="v1"] .rowmenu .rowmenu-del:hover {
    background: #fbece8;
    color: var(--rd-destructive);
}

/* Användarkort i botten av sidebar (nytt) */
body[data-redesign="v1"] .sb-foot {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid var(--rd-line);
    background: var(--rd-sb-bg);
    margin-top: auto;
}
body[data-redesign="v1"] .sb-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--rd-accent);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    display: grid;
    place-items: center;
    flex: none;
}
body[data-redesign="v1"] .sb-user {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}
body[data-redesign="v1"] .sb-user b {
    font-size: 13px;
    font-weight: 600;
    color: var(--rd-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body[data-redesign="v1"] .sb-user span {
    font-size: 11.5px;
    color: var(--rd-ink-3);
}

/* ── Main ── */
body[data-redesign="v1"] main {
    background: var(--rd-canvas);
}

/* Topbar (chat-header) */
body[data-redesign="v1"] .chat-header {
    height: 56px;
    padding: 0 20px;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--rd-line);
    gap: 16px;
    flex-wrap: nowrap;
}
body[data-redesign="v1"] .chat-title {
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -.01em;
    color: var(--rd-ink);
    flex: 1;
    min-width: 0;
}
body[data-redesign="v1"] .chat-header-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Befintliga små text-knapparna ersätts: vi visar bara Dela chatt + ⋯ */
body[data-redesign="v1"] .chat-title-edit {
    display: none;
}
body[data-redesign="v1"] .chat-title-edit#shareChatBtn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 14px;
    border-radius: 9px;
    border: 1px solid var(--rd-line);
    background: #fff;
    color: var(--rd-ink);
    font-weight: 600;
    font-size: 13px;
}
body[data-redesign="v1"] .chat-title-edit#shareChatBtn:hover:not(:disabled) {
    border-color: #cfd6e2;
    background: #fff;
    color: var(--rd-ink);
}
body[data-redesign="v1"] .chat-title-edit#shareChatBtn:disabled,
body[data-redesign="v1"] .chat-title-edit#shareChatBtn.disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* Overflow ⋯-menyn visas alltid (på alla skärmar) i redesignen */
body[data-redesign="v1"] .chat-header-overflow {
    display: block;
    position: relative;
}
body[data-redesign="v1"] .chat-header-overflow-btn {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    border: 1px solid var(--rd-line);
    background: #fff;
    color: var(--rd-ink-2);
    display: grid;
    place-items: center;
    padding: 0;
    font-size: 18px;
    font-weight: 700;
}
body[data-redesign="v1"] .chat-header-overflow-btn:hover {
    color: var(--rd-ink);
    border-color: #cfd6e2;
}
body[data-redesign="v1"] .chat-header-overflow-menu {
    top: calc(100% + 8px);
    width: 200px;
    border-radius: 11px;
    box-shadow: var(--rd-shadow);
    padding: 6px;
}
body[data-redesign="v1"] .chat-header-overflow-menu button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    border-radius: 8px;
    background: transparent;
    border: 0;
    text-align: left;
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--rd-ink-2);
    cursor: pointer;
}
body[data-redesign="v1"] .chat-header-overflow-menu button:hover:not(:disabled) {
    background: var(--rd-line-soft);
    color: var(--rd-ink);
}
body[data-redesign="v1"] .chat-header-overflow-menu button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Dölj "Tidigare chattar" och "Ny chatt" i overflow på desktop (vi har sidebar) */
@media (min-width: 769px) {
    body[data-redesign="v1"] .chat-header-overflow-menu button[onclick*="openSessionsDrawer"],
    body[data-redesign="v1"] .chat-header-overflow-menu button[onclick*="newSession"] {
        display: none;
    }
}

/* ── Welcome (empty state) ── */
body[data-redesign="v1"] .empty-chat {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 24px 24px 16px;
    max-width: none;
    flex: 1;
    min-height: 100%;
}
body[data-redesign="v1"] .empty-chat .welcome-inner {
    width: 100%;
    max-width: 680px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
body[data-redesign="v1"] .welcome-logo {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: transparent;
    display: grid;
    place-items: center;
    filter: drop-shadow(0 2px 6px rgba(30, 64, 175, 0.18));
    margin-bottom: 18px;
}
body[data-redesign="v1"] .empty-chat h2 {
    margin: 0 0 8px;
    font-size: 27px;
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--rd-ink);
    background: transparent;
}
body[data-redesign="v1"] .welcome-lede {
    margin: 0 0 20px;
    font-size: 14.5px;
    color: var(--rd-ink-2);
    line-height: 1.6;
    max-width: 520px;
    text-wrap: pretty;
}
body[data-redesign="v1"] .welcome-lede b { color: var(--rd-ink); font-weight: 600; }

/* 2×2 exempelkort */
body[data-redesign="v1"] .welcome-examples {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    text-align: left;
}
body[data-redesign="v1"] .welcome-examples .exq {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid var(--rd-line);
    border-radius: 13px;
    box-shadow: var(--rd-shadow-sm);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    color: var(--rd-ink);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
}
body[data-redesign="v1"] .welcome-examples .exq:hover {
    transform: translateY(-2px);
    box-shadow: var(--rd-shadow);
    border-color: #cdd7e6;
    background: #fff;
    color: var(--rd-ink);
}
body[data-redesign="v1"] .exq-ico {
    width: 34px;
    height: 34px;
    flex: none;
    border-radius: 9px;
    background: color-mix(in srgb, var(--rd-accent) 12%, #fff);
    color: var(--rd-accent);
    display: grid;
    place-items: center;
}
body[data-redesign="v1"] .exq-text { flex: 1; }
body[data-redesign="v1"] .exq-arr {
    flex: none;
    color: var(--rd-ink-3);
    opacity: 0;
    transform: translateX(-4px);
    transition: .14s;
}
body[data-redesign="v1"] .welcome-examples .exq:hover .exq-arr {
    opacity: 1;
    transform: none;
    color: var(--rd-accent);
}

/* Tips-panel */
body[data-redesign="v1"] .tips {
    width: 100%;
    margin-top: 16px;
    background: #fff;
    border: 1px solid var(--rd-line);
    border-radius: 13px;
    overflow: hidden;
}
body[data-redesign="v1"] .tips summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 600;
    color: var(--rd-ink-2);
    cursor: pointer;
    list-style: none;
}
body[data-redesign="v1"] .tips summary::-webkit-details-marker { display: none; }
body[data-redesign="v1"] .tips summary:hover { color: var(--rd-ink); }
body[data-redesign="v1"] .tips-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--rd-line-soft);
    border-top: 1px solid var(--rd-line-soft);
}
body[data-redesign="v1"] .tips-col {
    background: #fff;
    padding: 13px 16px;
}
body[data-redesign="v1"] .tips-cap {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 2px 8px;
    border-radius: 20px;
    margin-bottom: 7px;
}
body[data-redesign="v1"] .tips-col--good .tips-cap { background: #e7f3ec; color: var(--rd-good); }
body[data-redesign="v1"] .tips-col--bad .tips-cap { background: #fbeee8; color: var(--rd-bad); }
body[data-redesign="v1"] .tips-col p {
    margin: 0;
    font-size: 13px;
    color: var(--rd-ink-2);
    line-height: 1.5;
}
body[data-redesign="v1"] .tips-col a {
    color: var(--rd-accent);
    font-weight: 600;
}

/* Dölj de gamla example-chips eftersom vi har nya .welcome-examples */
body[data-redesign="v1"] .empty-chat .example-chips,
body[data-redesign="v1"] .empty-chat > p:not(.welcome-lede) {
    display: none;
}

/* ── Conversation thread ── */
body[data-redesign="v1"] .messages {
    background: var(--rd-canvas);
    padding: 26px 24px;
    max-width: none;
}
body[data-redesign="v1"] .messages > * {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
body[data-redesign="v1"] .messages .empty-chat {
    max-width: none;
}
/* Grid-layout istället för flex så bubble/sources/copy stackar vertikalt
   i kolumn 2 medan avatar tar kolumn 1 (rad 1). Tidigare flex-layout
   gjorde att alla children blev rader på samma flex-rad → bubblan
   trycktes ihop till ett smalt streck. */
body[data-redesign="v1"] .messages .msg {
    margin-bottom: 18px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    column-gap: 13px;
    align-items: start;
}
body[data-redesign="v1"] .messages .msg > * {
    grid-column: 2;
    min-width: 0;
}
body[data-redesign="v1"] .messages .msg.user {
    grid-template-columns: minmax(0, 1fr) 32px;
    justify-items: end;
}
body[data-redesign="v1"] .messages .msg.user > * {
    grid-column: 1;
}

/* AI-avatar (rad 1, kol 1) */
body[data-redesign="v1"] .msg::before {
    content: "";
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--rd-accent);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.6 5.4L19 10l-5.4 1.6L12 17l-1.6-5.4L5 10l5.4-1.6Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    grid-column: 1;
    grid-row: 1;
}
body[data-redesign="v1"] .msg.user::before {
    background: #e4e8f0;
    background-image: none;
    color: var(--rd-ink-2);
    font-size: 12px;
    font-weight: 700;
    display: grid;
    place-items: center;
    content: var(--user-init, "JAG");
    grid-column: 2;
}

/* User-bubbla (accent right-aligned) */
body[data-redesign="v1"] .messages .msg.user .msg-bubble {
    max-width: 78%;
    background: var(--rd-accent);
    color: #fff;
    padding: 11px 15px;
    border-radius: 16px 16px 4px 16px;
    font-size: 14.5px;
    line-height: 1.5;
    box-shadow: none;
    border: 0;
}
/* AI-svar (ren brödtext, ingen bubbla) */
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble {
    background: transparent;
    border: 0;
    padding: 0;
    box-shadow: none;
    max-width: 100%;
    color: var(--rd-ink);
    font-size: 14px;
    line-height: 1.55;
    flex: 1;
    min-width: 0;
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble p {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--rd-ink);
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble p:last-child { margin-bottom: 0; }
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble strong {
    color: var(--rd-ink);
    font-weight: 700;
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble ul {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 9px;
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble li {
    font-size: 14px;
    line-height: 1.6;
    color: var(--rd-ink);
    padding-left: 2px;
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble a {
    color: var(--rd-accent);
    font-weight: 600;
    text-decoration: none;
}
body[data-redesign="v1"] .messages .msg.assistant .msg-bubble a:hover { text-decoration: underline; }

/* Copy-knapp per meddelande — flyttas till botten av AI-svar via msg-tools-pattern */
body[data-redesign="v1"] .msg-copy {
    position: static !important;
    background: #fff !important;
    border: 1px solid var(--rd-line) !important;
    color: var(--rd-ink-2) !important;
    padding: 0 11px !important;
    height: 32px !important;
    border-radius: 8px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    margin-top: 14px;
    margin-right: 6px;
    box-shadow: none !important;
    opacity: 1 !important;
    align-self: flex-start;
}
body[data-redesign="v1"] .msg-copy:hover {
    border-color: #cfd6e2 !important;
    color: var(--rd-ink) !important;
    background: #fff !important;
}

/* Källor-block */
body[data-redesign="v1"] .sources-block {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--rd-line-soft);
    background: transparent;
    border-radius: 0;
}
body[data-redesign="v1"] .sources-h {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--rd-ink-3);
    margin-bottom: 10px;
    background: transparent;
    padding: 0;
}
body[data-redesign="v1"] .sources-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}
body[data-redesign="v1"] .source-card {
    display: flex;
    flex-direction: column;
    padding: 11px 12px;
    background: #fff;
    border: 1px solid var(--rd-line);
    border-radius: 11px;
    text-decoration: none;
    transition: .12s;
    color: var(--rd-ink);
}
body[data-redesign="v1"] .source-card:hover {
    border-color: #cdd7e6;
    box-shadow: var(--rd-shadow-sm);
    background: #fff;
}
body[data-redesign="v1"] .source-card-title {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--rd-ink);
    line-height: 1.35;
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
body[data-redesign="v1"] .source-card-meta {
    font-size: 11px;
    color: var(--rd-ink-3);
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
body[data-redesign="v1"] .source-card-snippet {
    font-size: 11.5px;
    color: var(--rd-ink-2);
    margin-top: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Funnel-stats */
body[data-redesign="v1"] .funnel-stats {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 11px;
    color: var(--rd-ink-3);
    padding: 8px 12px;
    background: var(--rd-line-soft);
    border-radius: 8px;
    margin-bottom: 10px;
}
body[data-redesign="v1"] .funnel-arrow { color: var(--rd-ink-3); }

/* Toggle-more (visa fler källor) */
body[data-redesign="v1"] .toggle-more {
    background: transparent;
    border: 0;
    color: var(--rd-accent);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 0;
    margin-top: 10px;
}
body[data-redesign="v1"] .toggle-more:hover { color: var(--rd-accent-ink); text-decoration: underline; }

body[data-redesign="v1"] .sources-tip {
    margin-top: 12px;
    padding: 10px 14px;
    background: var(--rd-line-soft);
    border-radius: 10px;
    font-size: 12.5px;
    color: var(--rd-ink-2);
    line-height: 1.5;
}
body[data-redesign="v1"] .sources-tip a {
    color: var(--rd-accent);
    font-weight: 600;
}

/* Progress (Tänker / Söker) */
body[data-redesign="v1"] .progress {
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--rd-ink-3);
    font-size: 13px;
}
body[data-redesign="v1"] .progress-line {
    padding: 6px 0;
}

/* ── Composer (input-bar) ── */
body[data-redesign="v1"] .input-bar {
    padding: 10px 24px 12px;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-top: 1px solid var(--rd-line);
}
body[data-redesign="v1"] .input-form {
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    align-items: flex-end;
    gap: 8px;
    background: #fff;
    border: 1.5px solid var(--rd-line);
    border-radius: 16px;
    padding: 7px 7px 7px 14px;
    box-shadow: var(--rd-shadow-sm);
    transition: border-color .15s, box-shadow .15s;
}
body[data-redesign="v1"] .input-form:focus-within {
    border-color: var(--rd-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rd-accent) 18%, transparent);
}
body[data-redesign="v1"] .input-form textarea {
    flex: 1;
    border: 0;
    outline: 0;
    resize: none;
    background: transparent;
    font: inherit;
    font-size: 15px;
    line-height: 1.5;
    color: var(--rd-ink);
    padding: 9px 4px;
    max-height: 200px;
    min-height: 24px;
    border-radius: 0;
}
body[data-redesign="v1"] .input-form textarea::placeholder { color: var(--rd-ink-3); }
body[data-redesign="v1"] .input-form #sendBtn {
    width: 40px;
    height: 40px;
    flex: none;
    border-radius: 11px;
    border: 0;
    background: var(--rd-accent);
    color: #fff;
    display: grid;
    place-items: center;
    padding: 0;
    font-size: 0;
    transition: .12s;
}
body[data-redesign="v1"] .input-form #sendBtn::before {
    content: "";
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}
body[data-redesign="v1"] .input-form #sendBtn:hover:not(:disabled) { background: var(--rd-accent-ink); }
body[data-redesign="v1"] .input-form #sendBtn:disabled {
    background: #c3cdda;
    cursor: not-allowed;
}
body[data-redesign="v1"] .input-hint {
    max-width: 760px;
    margin: 9px auto 0;
    text-align: center;
    font-size: 11.5px;
    color: var(--rd-ink-3);
}

/* ── Share-modaler: bara mjuka palettjusteringar, layout orörd ── */
body[data-redesign="v1"] .share-modal {
    font-family: "Public Sans", system-ui, sans-serif;
    border-radius: 18px;
}
body[data-redesign="v1"] .share-modal h2 {
    color: var(--rd-ink);
    font-weight: 700;
}
body[data-redesign="v1"] .share-modal .modal-sub {
    color: var(--rd-ink-2);
}

/* Empty-sessions (när inga chattar finns) */
body[data-redesign="v1"] .empty-sessions {
    padding: 24px 12px;
    color: var(--rd-ink-3);
    font-size: 13px;
}

/* Responsive: dölj sidebar på mobil — befintlig drawer-logik hanterar resten */
@media (max-width: 860px) {
    body[data-redesign="v1"] .welcome-examples,
    body[data-redesign="v1"] .tips-body,
    body[data-redesign="v1"] .sources-grid {
        grid-template-columns: 1fr;
    }
}