/* Reference-style desktop sidebar collapse/expand control.
   The control sits on the boundary between the sidebar and content and toggles
   the existing icon-only / icon-with-text sidebar states. */
.sidebar-collapse-slot {
    position: fixed;
    z-index: 60;
    top: 112px;
    left: calc(228px - 18px);
    width: 36px;
    height: 36px;
    transition: left 180ms ease;
}

.sidebar-collapse-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    color: #667085;
    background: #fff;
    box-shadow: 0 4px 12px rgba(16, 24, 40, 0.12);
    cursor: pointer;
    transition: color 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.sidebar-collapse-button:hover,
.sidebar-collapse-button:focus-visible {
    color: #101828;
    border-color: #98a2b3;
    background: #f9fafb;
    box-shadow: 0 6px 16px rgba(16, 24, 40, 0.16);
    outline: none;
}

.sidebar-collapse-button svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sidebar-collapse-button .sidebar-collapse-arrow {
    transform-origin: 12px 12px;
    transition: transform 180ms ease;
}

.app-shell.sidebar-collapsed .sidebar-collapse-slot {
    left: calc(68px - 18px);
}

@media (max-width: 980px) {
    .sidebar-collapse-slot {
        display: none;
    }
}