/***********************************************************************
* UNITE Agenda CAG.css
************************************************************************
* Copyright (c) 2020, Paul Kimpel.
* Licensed under the MIT License, see
*       http://www.opensource.org/licenses/mit-license.php
************************************************************************
* Style sheet for CAG.html page.
************************************************************************
* 2020-08-09  P.Kimpel
*   Original version, cloned from Bent-O-Rama.
***********************************************************************/

BODY {
    position:           relative;
    height:             calc(100% - 8px)}

H3 {
    margin-top:         0}

A:hover,
A:focus {
    color:              red;
    cursor:             pointer}
A.newNotice:visited,
A.newNotice:link {
    font-weight:        bold;
    color:              yellow;
    background-color:   red;
    padding-top:        2px;
    padding-left:       1ex;
    padding-right:      1ex;
    border:             1px solid black}
A.newNotice:hover,
A.newNotice:focus {
    color:              red;
    background-color:   yellow}

.collapsed {
    display:            none}
.conflicted {
    outline:            3px solid red}
.newLink {
    color:              #060}
.blueFlag {
    font-weight:        bold;
    font-size:          smaller;
    color:              white;
    background-color:   blue;
    margin-left:        1em;
    margin-right:       1em;
    padding-left:       0.5em;
    padding-right:      0.5em;
    padding-top:        2px;
    padding-bottom:     2px;
    border-radius:      0.5em}

#HeadTable {
    visibility:         hidden}

#AuthenticatedFlag,
#NotAuthenticatedBtn {
    display:            block;
    width:              100%;
    text-align:         center;
    font-size:          inherit;
    font-weight:        bold;
    margin-top:         0.5em;
    padding:            4px}
#AuthenticatedFlag {
    display:            none;
    color:              white;
    background-color:   #090;
    border-radius:      16px}

#HeadTitle H3 {
    margin-bottom:      0}

#LinkTable {
    visibility:         hidden;
    width:              100%}
#LinkTable COLGROUP COL.fixedColWidth {
    width:              150px}
#LinkTable TR {
    vertical-align:     top}

#MainDiv{
    position:           relative;
    left:               50%;
    transform:          translate(-50%, 0);
    max-width:          max-content;
    margin-top:         4px}

#IGLegendTable {
    position:           relative;
    margin-left:        auto;
    margin-right:       auto;
    margin-top:         4px;
    background-color:   #E6E0D8}
#IGLegendBody>TR>TD {
    text-align:         center;
    vertical-align:     middle;
    border:             1px solid black;
    padding-left:       8px;
    padding-right:      8px}

#ViewSelect {
    font-weight:        bold;
    margin-bottom:      2px;
    margin-top:         2px;
    border:             2px solid blue;
    border-radius:      4px}

#SessionListTable {
    visibility:         hidden;
    border-collapse:    separate;
    margin-top:         0.5ex}
#SessionListTable THEAD TH.vertical {
    vertical-align:     middle;
    padding-left:       0;
    padding-right:      0;
    font-weight:        bold;
    white-space:        nowrap}
#SessionListTable THEAD TH.vertical > div {
    transform:          rotate(-90deg)}

#SessionListTable TBODY TR {
    vertical-align:     middle}
#SessionListTable TBODY TR.altrow {
    background-color:   #E6E0D8}        /* was #E1DAD0  neutral, light tan */

#SessionListTable TBODY TD {
    padding-top:        4px;
    padding-bottom:     4px;
    padding-left:       8px;
    padding-right:      8px}
#SessionListTable TBODY TR TD.dateHeader {
    position:           relative;
    text-align:         center;
    font-weight:        bold;
    font-size:          medium;
    color:              white;
    background-color:   #666;
    cursor:             pointer;
    padding-top:        4px;
    padding-bottom:     4px;
    border-top:         1px solid white;
    border-bottom:      1px solid white}
#SessionListTable TBODY TR TD.dateHeader .dateHeaderArrow {
    position:           absolute;
    left:               16px;
    top:                calc(50% - 0.5em);
    color:              white;
    cursor:             pointer}
#SessionListTable TBODY TR TD A:hover,
#SessionListTable TBODY TR TD A:focus {
    color:              red;
    cursor:             pointer}

#SessionListTable TBODY TR>TD.perSchedCell {
    padding-left:       0;
    padding-right:      0;
    border-left:        1px solid black;
    text-align:         center}
#SessionListTable TBODY TR>TD.timeCell {
    border-left:        1px solid black;
    white-space:        nowrap;
    text-align:         center}
#SessionListTable TBODY TR>TD.unschedCell {
    background-color:   #FFC;
    border-color:       red}
#SessionListTable TBODY TR>TD.sessionNrCell {
    font-weight:        bold;
    text-align:         center}
#SessionListTable TBODY TR>TD.hiliteAward {
    color:              white;
    background-color:   red;
    font-weight:        bold}

#NoticeAlert {
    top:                auto;
    bottom:             10%;
    z-index:            98;
    text-align:         center;
    font-weight:        bold;
    max-width:          30em;
    opacity:            1;
    background-color:   red;
    color:              yellow;
    border:             4px solid yellow}

#DelegateAuthModal .modalContent {
    top:                50%;
    left:               50%;
    height:             25em;
    width:              80%;
    max-width:          40em;
    transform:          translate(-50%, -50%)}
#DelegateAuthError {
    visibility:         hidden;
    text-align:         center;
    width:              80%;
    margin-left:        10%;
    color:              red;
    font-weight:        bold}
#DelegateAuthButtonDiv {
    width:              100%;
    text-align:         right}

#SessionLinkModal .modalContent {
    top:                50%;
    height:             10em;
    left:               50%;
    width:              80%;
    max-width:          30em;
    transform:          translate(-50%, -50%)}
#SessionLinkButtonDiv {
    width:              100%;
    text-align:         right}

#PasscodeModal .modalContent {
    top:                50%;
    height:             8em;
    left:               50%;
    width:              80%;
    max-width:          25em;
    transform:          translate(-50%, -50%)}
#PasscodeText {
    text-align:         center;
    width:              8ch;
    margin-left:        calc(50% - 4ch)}
#PasscodeTextError {
    visibility:         hidden;
    text-align:         center;
    width:              80%;
    margin-left:        10%;
    color:              red;
    font-weight:        bold}
#PasscodeModalButtonDiv {
    width:              100%;
    text-align:         right}

#SessionDetailsModal .modalContent {
    top:                5%;
    bottom:             5%;
    left:               50%;
    width:              90%;
    max-width:          40em;
    transform:          translate(-50%, 0)}

#SessionDetailsAbstractText {
    margin-top:         1ex}

#SessionDetailsButtonDiv {
    margin-top:         1ex;
    width:              100%;
    text-align:         right}

#AddToCalendarModal .modalContent {
    top:                50%;
    height:             10em;
    left:               50%;
    width:              80%;
    max-width:          25em;
    transform:          translate(-50%, -50%)}
#DownloadICalButtonDiv {
    width:              100%;
    text-align:         right}

#SubmitEvalModal .modalContent {
    top:                5%;
    bottom:             5%;
    left:               50%;
    width:              90%;
    max-width:          40em;
    transform:          translate(-50%, 0)}

#SubmitEvalUpdateDiv {
    visibility:         hidden;
    text-align:         right;
    font-size:          smaller}

#EvalImprovementText,
#EvalSuggestionText {
    width:              100%}

#OptionalInfoTable TD.c1 {
    width:              6em}
#OptionalInfoTable TD.c2 {
    width:              calc(100% - 6em)}
#OptionalInfoTable TD INPUT {
    width:              100%}

#SubmitEvalErrorText {
    display:            none;
    text-align:         center;
    color:              red}
#SubmitEvalButtonDiv {
    margin-top:         1ex;
    width:              100%;
    text-align:         right}