@charset "UTF-8";

/* ==========================================================================
   cp_table_NO_Borders.css

   PURPOSE
   Removes ALL borders (outer frame, borders between cells, header underline)
   from a table, by forcing every border to 0px.
   Removes cell background colors, including alternating rows and hover.

   HOW TO ACTIVATE
   In the DITA source, set outputclass="NO_Borders" on the <table> element.
   DITA-OT copies the outputclass value into the HTML class attribute, so the
   output looks like:
       <table class="- topic/table table frame-all NO_Borders" ...>
   Only tables that carry the class "NO_Borders" are affected.
   (Class names are case-sensitive: write it exactly as NO_Borders.)

   HOW TO LOAD
   Add this file as an additional CSS in the publishing template (.opt) for
   WebHelp Responsive and for PDF (Chemistry). It never needs to coexist
   with other table styles.

   WHY THE RULES LOOK THE WAY THEY DO
   1) !important is used on every declaration, as required, so that this file
      wins over the default CSS regardless of load order or specificity:
        - topic.css:     .frame-all, .frame-top, .frame-bottom, .frame-topbot,
                         .frame-sides, .colsep-1, .rowsep-1, .stentry,
                         .cellrowborder, .table thead th (2px bottom line)
        - bootstrap.css: .table > :not(caption) > * > * (1px bottom border
                         on every cell)
   2) Child combinators (>) are used so that only the table's OWN parts are
      changed. A table nested inside a cell, or other bordered content inside
      a cell (for example a note or a code block), keeps its own styling.
   3) Every rule sets the border in three redundant ways (shorthand,
      per-side shorthand, width + style longhands). This is deliberate: it is
      the syntax that every renderer understands (browsers and PDF Chemistry),
      and it also overrides any per-side border set by the default CSS.
   ========================================================================== */


/* --------------------------------------------------------------------------
   RULE 1 - The <table> element itself.
   Removes the outer frame that DITA-OT creates with the .frame-all /
   .frame-top / .frame-bottom / .frame-topbot / .frame-sides classes.
   -------------------------------------------------------------------------- */
table.NO_Borders {
  /* Shorthand: no width, no style on all four sides. */
  border: 0px none !important;
  /* Explicit per-side shorthands: override any per-side border from the default CSS. */
  border-top: 0px none !important;
  border-right: 0px none !important;
  border-bottom: 0px none !important;
  border-left: 0px none !important;
  /* Longhands: width 0px and style none on all sides, for renderers that read these first. */
  border-width: 0px !important;
  border-style: none !important;
}


/* --------------------------------------------------------------------------
   RULE 2 - The table caption and the column definitions.
   Removes any border that could be attached to the caption, colgroup, or col.
   -------------------------------------------------------------------------- */
table.NO_Borders > caption,
table.NO_Borders > colgroup,
table.NO_Borders > colgroup > col,
table.NO_Borders > col {
  /* Shorthand: no width, no style on all four sides. */
  border: 0px none !important;
  /* Explicit per-side shorthands. */
  border-top: 0px none !important;
  border-right: 0px none !important;
  border-bottom: 0px none !important;
  border-left: 0px none !important;
  /* Longhands: width 0px and style none. */
  border-width: 0px !important;
  border-style: none !important;
}


/* --------------------------------------------------------------------------
   RULE 3 - The row groups: <thead>, <tbody>, <tfoot>.
   In the collapsed-border model, borders set on row groups take part in the
   border conflict resolution, so they must be zeroed too.
   Both the direct-child form and the form without a group are covered.
   -------------------------------------------------------------------------- */
table.NO_Borders > thead,
table.NO_Borders > tbody,
table.NO_Borders > tfoot {
  /* Shorthand: no width, no style on all four sides. */
  border: 0px none !important;
  /* Explicit per-side shorthands. */
  border-top: 0px none !important;
  border-right: 0px none !important;
  border-bottom: 0px none !important;
  border-left: 0px none !important;
  /* Longhands: width 0px and style none. */
  border-width: 0px !important;
  border-style: none !important;
}


/* --------------------------------------------------------------------------
   RULE 4 - The rows: <tr>.
   Covers rows inside thead/tbody/tfoot, and rows that are direct children of
   the table (when no row group is present).
   -------------------------------------------------------------------------- */
table.NO_Borders > tr,
table.NO_Borders > thead > tr,
table.NO_Borders > tbody > tr,
table.NO_Borders > tfoot > tr {
  /* Shorthand: no width, no style on all four sides. */
  border: 0px none !important;
  /* Explicit per-side shorthands. */
  border-top: 0px none !important;
  border-right: 0px none !important;
  border-bottom: 0px none !important;
  border-left: 0px none !important;
  /* Longhands: width 0px and style none. */
  border-width: 0px !important;
  border-style: none !important;
}


/* --------------------------------------------------------------------------
   RULE 5 - The cells: <td> and <th>.
   Removes the borders between all cells, including:
     - .colsep-1 (right border) and .rowsep-1 (bottom border) set by DITA-OT,
     - the 1px bottom border that Bootstrap adds to every cell,
     - the 2px line under header cells (.table thead th),
     - the border-top that topic.css inherits onto cells,
     - the cell borders of simpletables (.stentry).
   Rows are matched both inside row groups and as direct children of the table.
   Transparent cell backgrounds override alternating-row and hover colors.
   -------------------------------------------------------------------------- */
table.NO_Borders > tr > td,
table.NO_Borders > tr > th,
table.NO_Borders > thead > tr > td,
table.NO_Borders > thead > tr > th,
table.NO_Borders > tbody > tr > td,
table.NO_Borders > tbody > tr > th,
table.NO_Borders > tfoot > tr > td,
table.NO_Borders > tfoot > tr > th {
  /* Shorthand: no width, no style on all four sides. */
  border: 0px none !important;
  /* Explicit per-side shorthands: these beat .colsep-1 (right) and .rowsep-1 (bottom). */
  border-top: 0px none !important;
  border-right: 0px none !important;
  border-bottom: 0px none !important;
  border-left: 0px none !important;
  /* Longhands: width 0px and style none (beats Bootstrap's border-bottom-width). */
  border-width: 0px !important;
  border-style: none !important;
  background-color: transparent !important;
}