fix(accordion): items inside of the content now correct display borders (#24618)

resolves #24613

core/src/components/accordion/test/standalone/e2e.ts

@@ -9,3 +9,12 @@ test('accordion: axe', async () => {
   const results = await new AxePuppeteer(page).analyze();
   expect(results.violations.length).toEqual(0);
 });
+
+test('accordion: standalone', async () => {
+  const page = await newE2EPage({
+    url: '/src/components/accordion/test/standalone?ionic:_testing=true'
+  });
+
+  const compare = await page.compareScreenshot();
+  expect(compare).toMatchScreenshot();
+});

core/src/components/accordion/test/standalone/index.html

@@ -85,6 +85,21 @@
             </ion-accordion>
           </ion-accordion-group>
         </div>
+
+        <div class="grid-item">
+          <h2>Item In Content</h2>
+
+          <ion-accordion-group value="first">
+            <ion-accordion value="first">
+              <ion-item slot="header">
+                Accordion
+              </ion-item>
+              <div slot="content">
+                <ion-item lines="full">Some Item</ion-item>
+              </div>
+            </ion-accordion>
+          </ion-accordion-group>
+        </div>
       </div>
     </main>
   </body>

core/src/css/core.scss

@@ -282,7 +282,7 @@ ion-accordion-group.accordion-group-expand-inset > ion-accordion:last-of-type {
   border-bottom-left-radius: 8px;
   border-bottom-right-radius: 8px;
 }
-ion-accordion-group > ion-accordion:last-of-type ion-item {
+ion-accordion-group > ion-accordion:last-of-type ion-item[slot="header"] {
   --border-width: 0px;
 }