/******************************************************************************\

                  This file is part of the Buildbotics firmware.

         Copyright (c) 2015 - 2023, Buildbotics LLC, All rights reserved.

          This Source describes Open Hardware and is licensed under the
                                  CERN-OHL-S v2.

          You may redistribute and modify this Source and make products
     using it under the terms of the CERN-OHL-S v2 (https:/cern.ch/cern-ohl).
            This Source is distributed WITHOUT ANY EXPRESS OR IMPLIED
     WARRANTY, INCLUDING OF MERCHANTABILITY, SATISFACTORY QUALITY AND FITNESS
      FOR A PARTICULAR PURPOSE. Please see the CERN-OHL-S v2 for applicable
                                   conditions.

                 Source location: https://github.com/buildbotics

       As per CERN-OHL-S v2 section 4, should You produce hardware based on
     these sources, You must maintain the Source Location clearly visible on
     the external case of the CNC Controller or other product you make using
                                   this Source.

                 For more information, email info@buildbotics.com

\******************************************************************************/

.tabs
  clear both

  > input
    display none

  > label
    display block
    float left
    width 6em
    font-weight bold
    cursor pointer
    text-decoration none
    text-align center
    background #eee
    border-top-left-radius 5px
    border-top-right-radius 5px
    border-top 2px solid #f6f6f6
    border-left 1px solid #f6f6f6
    border-right 1px solid #f6f6f6
    margin-right 2px
    padding 0.5em

    &:hover
      background-image button-hover

  > section
    display none
    clear both

  > #tab1:checked ~ #content1,
  > #tab2:checked ~ #content2,
  > #tab3:checked ~ #content3,
  > #tab4:checked ~ #content4,
  > #tab5:checked ~ #content5,
  > #tab6:checked ~ #content6,
  > #tab7:checked ~ #content7,
  > #tab8:checked ~ #content8,
  > #tab9:checked ~ #content9
    display block

  [id^="tab"]:checked + label
    background #fff
    border-top 2px solid #ddd
    border-left 1px solid #ddd
    border-right 1px solid #ddd
    border-bottom 1px solid #fff
    margin-bottom -1px

  .tab-content
    border 1px solid #ddd
    padding 0.5em
