@carbon/ibmdotcom-styles 2.23.0 → 2.25.0

package/dist/ibm-dotcom-styles.css

@@ -12653,11 +12653,6 @@ screen and (prefers-contrast) {
   padding-block-start: 0;
   padding-inline: 1px
 }
-@media (max-width:41.98rem) {
-  :host(c4d-card-group[with-card-in-card][grid-mode]) {
-    padding-inline: 1rem
-  }
-}
 :host(c4d-card-group[with-card-in-card][grid-mode=default]) {
   -webkit-padding-before: 2rem;
   padding-block-start: 2rem
@@ -12784,6 +12779,22 @@ screen and (prefers-contrast) {
   -webkit-padding-before: .5rem;
   padding-block-start: .5rem
 }
+@media (min-width:42rem) {
+  :host(c4d-card-group)[grid-mode=narrow] {
+    gap: 0 1rem;
+    -webkit-padding-before: 1rem;
+    padding-block-start: 1rem
+  }
+  :host(c4d-card-group)[grid-mode=default] {
+    gap: 0 2rem;
+    -webkit-padding-before: 1rem;
+    padding-block-start: 1rem
+  }
+  :host(c4d-card-group)[grid-mode=condensed] {
+    -webkit-padding-before: 1rem;
+    padding-block-start: 1rem
+  }
+}
 :host(c4d-card-group-item)[cta-type=video]:focus-within .cds--tile {
   position: relative;
   outline: 0
@@ -12797,6 +12808,55 @@ screen and (prefers-contrast) {
   inset: 0;
   pointer-events: none
 }
+@media (max-width:41.98rem) {
+  :host(c4d-card-group[with-card-in-card][grid-mode]) {
+    padding-inline: 1rem
+  }
+  :host(c4d-card-group).inside-block-cards:not(.media-type-block-cards__logo) {
+    overflow: scroll hidden;
+    inline-size: 100%;
+    max-inline-size: 100vw;
+    overscroll-behavior-x: contain;
+    padding-block: 4px 1rem;
+    -ms-scroll-snap-type: x mandatory;
+    scroll-snap-type: x mandatory;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    gap: 1rem;
+    padding-inline: 1rem
+  }
+  :host(c4d-card-group).inside-block-cards:not(.media-type-block-cards__logo) > ::slotted(a) {
+    display: grid!important;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    -ms-flex-preferred-size: clamp(220px,65vw,400px);
+    flex-basis: clamp(220px,65vw,400px);
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    -ms-flex-line-pack: start;
+    align-content: start;
+    block-size: auto;
+    padding-inline: 0;
+    scroll-margin: 1rem;
+    scroll-snap-align: start
+  }
+  :host(c4d-card-group).inside-block-cards:not(.media-type-block-cards__logo) > ::slotted(c4d-card-group-item) {
+    display: grid;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    -ms-flex-preferred-size: clamp(220px,65vw,400px);
+    flex-basis: clamp(220px,65vw,400px);
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    -ms-flex-line-pack: start;
+    align-content: start;
+    block-size: auto;
+    padding-inline: 0;
+    scroll-margin: 1rem;
+    scroll-snap-align: start
+  }
+}
 @media print and (min-width:42rem) {
   :host(c4d-card-group-card-link-item)[empty],
   :host(c4d-card-group-item)[empty] {
@@ -12894,20 +12954,6 @@ screen and (prefers-contrast) {
   max-inline-size: 40rem
 }
 @media (min-width:42rem) {
-  :host(c4d-card-group)[grid-mode=narrow] {
-    gap: 0 1rem;
-    -webkit-padding-before: 1rem;
-    padding-block-start: 1rem
-  }
-  :host(c4d-card-group)[grid-mode=default] {
-    gap: 0 2rem;
-    -webkit-padding-before: 1rem;
-    padding-block-start: 1rem
-  }
-  :host(c4d-card-group)[grid-mode=condensed] {
-    -webkit-padding-before: 1rem;
-    padding-block-start: 1rem
-  }
   :host(c4d-card-section-offset) ::slotted(c4d-background-media) {
     position: absolute;
     aspect-ratio: auto;
@@ -12957,6 +13003,13 @@ screen and (prefers-contrast) {
     padding-block-start: 2rem
   }
 }
+:host(:dir(rtl)) ::slotted([slot=heading]) {
+  margin-right: 1rem
+}
+:host(:dir(rtl)) ::slotted([slot=action]) {
+  display: block!important;
+  margin-right: 1rem!important
+}
 @media print {
   .cds--card-section-offset__content,
   :host(c4d-card-section-offset) {