/**
 * Copyright IBM Corp. 2016, 2024
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

@use '@carbon/styles/scss/breakpoint' as *;
@use '@carbon/styles/scss/config' as *;
@use '@carbon/styles/scss/spacing' as *;
@use '@carbon/styles/scss/components/accordion';
@use '@carbon/styles/scss/components/tabs';
@use '../link-list';
@use '../../globals/vars' as *;
@use '../../globals/imports' as *;

@mixin tabs-extended-media {
  :host(#{$c4d-prefix}-tabs-extended-media) {
    display: flex;
    margin: 0;
    overflow-x: hidden;

    @include breakpoint(sm) {
      padding-block: $spacing-07 $spacing-12;
    }
    @include breakpoint(lg) {
      padding-block: $spacing-10 $spacing-13;
    }

    ::slotted([slot='heading']) {
      margin-block-end: $spacing-09;
      padding-inline: $spacing-05;

      @include breakpoint(lg) {
        padding-block-start: $spacing-04;
      }
    }

    .#{$prefix}--tabs-extended-media {
      inline-size: 100%;

      @include breakpoint(lg) {
        display: flex;
      }
    }

    .#{$prefix}--heading {
      @include breakpoint(lg) {
        flex: 0 0 25%;
      }
    }

    .#{$prefix}--accordion__content {
      padding: $spacing-07 0 0;
      margin-block: -$spacing-07 $spacing-05;

      @include breakpoint(md) {
        margin-block-end: -$spacing-05;
      }
    }
  }
}

:host(#{$c4d-prefix}-tabs-extended-media[type='contained'])
  .#{$prefix}--tabs-nav-content-container {
  block-size: $spacing-09;
}