*                                       {opacity: 1; }
body                                    {font-family: sans-serif; }
h3                                      {font-weight: normal; margin: 1em 0 0 0; padding: 0; }
h4                                      {font-weight: normal; margin: 0; padding: 0; }
.hidden,
.read-snapshot.hidden,
.read-message.hidden,
#cconv-form.hidden
                                        {display: none !important; }
.invisible                              {visibility: hidden; }
.overflow-hidden                        {overflow:hidden; overflow-wrap: unset !important; text-overflow: ellipsis;}
label                                   {display: block; }
form                                    {display: block; margin: 0; }
textarea                                {min-height: 2em; vertical-align: top; padding: 0; }

#forget-messages,
#forget-snapshots,
#forget-all                             {margin: 1em;}

/*#ctext-form, #rconv-form              {display: none; }*/

#cconv-form h3                          {margin: -0.5em 0 0 0;}

#message-checkbox-popup,
#snapshot-checkbox-popup,
#cconv-form                             {display: flex; justify-content: center; height: 100%; width: 100%; position: fixed; z-index: 1; top: 0; left: 0; overflow: auto;
                                         padding-top: 3em; background: white; background: rgba(255, 255, 255, 0.5); }

#message-checkbox-popup div,
#snapshot-checkbox-popup div,
#cconv-form div                         {list-style: none; margin: 0 1em; padding: 1em 1.2em 0.5em 0.5em; text-align: center; position: absolute;
                                         z-index: 1; background: white; border: thin solid black; opacity: 1;}

#message-checkbox-popup button,
#snapshot-checkbox-popup button
                                        {cursor: pointer; display: /*list-item*/ inline-block; margin: 0.2em 0.1em; padding: 0.1em; /*border: solid thin gray;*/ width: fit-content;}

#message-checkbox-popup button#uncheck-checked,
#snapshot-checkbox-popup button#uncheck-checked,
.close                                  {position: absolute; top: 0; right: 0; padding: 0 0.3em;}

#read-messages,
#read-snapshots                         {/*border: solid gray thin; */ display: table; table-layout:auto; border-collapse: collapse; width: 100%; }

.read-message,
.read-snapshot                          {display: table-row; height:1em; background: white;}

.read-element.first-of-conv             {}
.read-element:not(.first-of-conv)       {}
.read-element.last-of-conv              {height: 2em;}
.read-element.odd                       {background: rgba(128,0,128,0.1)}
.read-element.even                      {background: rgba(128,128,0,0.1)}

.read-message.head,
.read-snapshot.head                     {display: table-header-group; }

.read-message .full,
.read-snapshot .full                    {box-shadow: rgba(0,0,0,0.1) 0.1em 0.1em 0.1em; border: solid gray thin; width: 100%; padding: 0.1em; text-align: left; float: left; /*display: table-row; */ }

.read-message .full div,
.read-snapshot .full div                {display: table-cell; }

.read-message .full .contents,
.read-snapshot .full .contents          {padding: 1em; width: 100%; }

.read-message .control,
.read-snapshot .control                 {box-shadow: rgba(0,0,0,0.1) 0.1em 0.1em 0.1em; border: solid gray thin; padding: 0.1em; overflow: hidden; /*display: table-row;*/ max-height: 4em; width: calc(100% - 0.4em);
                                        display: inline-block; vertical-align: top; }

.read-message .control .checkbox,
.read-snapshot .control .checkbox       {padding: 0; max-width: 2em; min-width: 2em; /*float: left; */}

.read-message .control .summary,
.read-snapshot .control .summary       {cursor: pointer; min-width: fit-content; max-width: 100% !important; float: inline-start; }

.read-message .control .conv,
.read-snapshot .control .conv           {cursor: pointer; /*float: right; */}

.read-message .control .url,
.read-snapshot .control .url            {cursor: pointer; /*float: right; */}

.read-message .control .date,
.read-snapshot .control .date           {color: rgb(128,128,128);   min-width: 12em; text-align: right !important; /*float: right; */}

.read-message .control div,
.read-snapshot .control div             {display: table-cell; max-width: 7em; min-width: 7em; padding: 0.1em 0 0.1em 0.5em; vertical-align: top; /*overflow:hidden;
                                         text-overflow: ellipsis;*/ overflow-wrap: anywhere; hyphens: none; text-align: left; float: inline-end}

.read-message .control div:first-child.
.read-snapshot .control div:first-child {padding-left: 0; }