|
/* ======================================================= */
/* 7. MOBILE AI LAYOUT: MOVE CLOSE BUTTON INTO FOOTER ROW */
/* Layout: [Close] [Text Area] [Send] */
/* ======================================================= */
@media screen and (max-width: 768px) {
/* 1. MAKEPull SPACEthe INminimize FOOTERbutton (Pushout Inputof Right)the header and pin to footer */
.ext-aiassistant-panel .ext-aiassistant-header-actions > button:last-child { ▼
/* We add a left margin to the text area container so the button fits */
position: absolutefixed !important; ▼ .ext-aiassistant-footer .ext-aiassistant-input { ▼ margin-left: 46px !important; /* 36px button + 10px gap */ ▼
/* 2. MOVE HEADER BUTTON TO FOOTER (Absolute Positioning) */
/* Target the LAST button in the header (The Close/Minimize button) */
▲ .ext-aiassistant-panel .ext-aiassistant-header-actions button:last-child {
▲ position: absolute !important;
/* Pin to Bottombottom-left Leftof the panel */
bottom: 0 !important;
left: 0 !important;
/* Dimensions:Size Matchit to match the "Send"footer buttonrow (36px)height */
width: 36px44px !important;
height: 36px44px !important;
min-width: 36px44px !important; /* Override defaults */
border-radius: 50% !important; /* Make it a circle */ ▼
/* AlignmentStack Adjustments (Matches standardabove footer padding) */
displayz-index: none2002 !important; ▼
/* Assuming the footer has ~10px padding, we lift this to match */
margin-bottom: 10px !important;
margin-left: 8px !important; ▼
/* Visuals:Center Whitethe circle with dark bordericon */
background-color: #ffffff !important; ▼ border: 1px solid #202122 !important; ▼ z-index: 2005 !important; /* Ensure it sits on top */
/* Flex to center the X icon */
display: flex !important;
align-items: center !important;
justify-content: center !important;
/* Visual: blend with footer */
▲ background -color: #fffffftransparent !important;
font-sizeborder: 16pxnone !important; ▼
▲ border -top: 1px solid #202122 !important;
▲ border-radius: 50%0 !important; /* Make it a circle */
padding: 0 !important;
▲ margin -left: 46px0 !important; /* 36px button + 10px gap */
}
/* 32. CHANGEMake ICONroom TOin "X"the footer for the close button on the left */
▲ .ext-aiassistant-footer .ext-aiassistant-input {
/* Hide the original SVG (Dash icon) */
▲ marginpadding-left: 8px44px !important;
.ext-aiassistant-panel .ext-aiassistant-header-actions button:last-child svg {
▲ display: none !important;
}
/* Insert a clean "X" character */
.ext-aiassistant-panel .ext-aiassistant-header-actions button:last-child::after {
content: "✕" !important; /* Standard Close Cross */
▲ font-size: 16px !important;
color: #202122 !important;
font-weight: bold !important;
line-height: 1 !important;
margin-top: -1px !important; /* Optical centering */
}
}
|