import { css } from 'styled-components';
import {CAP_SPACE_24, CAP_SPACE_16} from '@capillarytech/cap-ui-library/styled/variables';

export default css`
  .cap-tab-v2-wrapper{
    .ant-tabs-tabpane {
        border: none;
    }
  }

  .component-wrapper {
    ${(props) => props.isFullMode ? `
      max-width: 1140px;
      margin: 0 auto;
      width: 100%;
      padding: 0.714rem 0;
      /* Only main channel tabs content, not HTML Editor validation panel tabs */
      > .cap-tab-v2 > .ant-tabs-content-holder > .ant-tabs-content,
      > .cap-tab-v2 > .ant-tabs-content {
        margin-top: ${CAP_SPACE_16};
      }
    ` : `.cap-tab-v2 {
      height: calc(100vh - 11.25rem);
    } `}
  }
`;

export const CapTabStyle = css`
  ${(props) => props.isFullMode ? `margin-top: ${CAP_SPACE_24}` : ``
  }
`;
