/*-----------------------------------------------------------------------------
--
--  _|      _|    _|_|      _|_|
--  _|      _|  _|    _|  _|    _|
--  _|      _|      _|        _|
--    _|  _|      _|        _|
--      _|      _|_|_|_|  _|_|_|_|
--
--  @file      content.css
--  @copyright See authors list below and v22.copyrights file
--  @licence   LGPL v3
--  @encoding  UTF-8
-------------------------------------------------------------------------------
--  @summary
--  V22 framework - Gnoga User Interface
--
--  @description
--
--
--  @authors
--  Arthur Le Floch - alf - developpement@soweb.io
--  Stéphane Rivière - sr - sriviere@soweb.io
--
--  @versions
--  See git log
-----------------------------------------------------------------------------*/

/* Content styling */

.content-container {
    width: 100%;
    height: calc(100% - 80px);
    overflow-y: auto;
    top: 40px;
    position: relative;
    box-sizing: border-box;
    padding: 8px;
    background-color: var(--content-color);
}

.content-text {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
}

.content-html {

 font-style: oblique 0deg;
 font-variation-settings: 'slnt' 0;
    text-align: left;
    text-align-last: left;
    font-size: 1.1em;
}

.content-header {
    font-size: 20px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;

    margin-bottom: 16px;
}

.content-group {
    background-color: var(--content-group-color);
    width: calc(50% - 16px);
    border-radius: 8px;
    margin: 8px;
    padding: 8px;
    box-sizing: border-box;
}

.content-group-header {
    font-weight: bold;
    text-align: center;
    background-color: var(--content-group-header-color);
    border-radius: 8px;
    /*display: table;*/
    margin-bottom: 16px;
    padding-top: 4px;
}

.content-group-title {
    /*font-weight: bold;*/
    text-align: center;
    display: inline-block;
    min-width: 50%;
    background-color: var(--content-group-title-color);
    border-radius: 8px;
    padding: 0 8px;
    padding-top: 3px;
    margin-bottom: 8px;
}

.content-group-warning {
   color: var(--content-group-warning-color);
   font-weight: bold;
   text-align: center;
   display: inline-block;
   font-size: 14px;
}

.content-list {
    background-color: var(--content-list-color);
    width: 100%;
    border-radius: 8px;
    margin: 8px;
    padding: 8px;
    box-sizing: border-box;
    overflow-x: auto;
}

.content-list-header {
    font-weight: bold;
    text-align: center;
    color: var(--content-list-header-color);
    background-color: var(--content-list-header-color-background);
}


.content-list-item {
    text-align: center;
}

.content-list-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 4px 0;
}

.content-list-table > tbody > tr:not(:first-child):nth-child(odd) {
    background-color: var(--content-list-secondary-color);
}

.content-list-item-selected {
    background-color: var(--content-list-selected-color-background) !important;
    color: var(--content-list-selected-color) !important;
}

/*------------------------------------------------------------
  --  EOF
  ------------------------------------------------------------*/