/* Wrapping */

#main_workarea.collapsed .tricklet_dash_container { white-space: nowrap; }
#main_workarea.collapsed #triklet_browser         { white-space: normal; vertical-align: top; }
#main_workarea.collapsed #triklet_conversation    { white-space: normal; vertical-align: top; }

/* Headers */

#triklet_conversation_header                          { display: none; }
#main_workarea.collapsed #triklet_main_header         { display: none; }
#main_workarea.collapsed #triklet_conversation_header { display: block; }

/* Browser elements */

#main_workarea.collapsed #triklet_browser .filtering                          { display: none; }
#main_workarea.collapsed #triklet_browser .multi_record_actions               { display: none; }
#main_workarea.collapsed #triklet_browser .pagination                         { display: none; }
#main_workarea.collapsed #triklet_browser #triklet_browser_table .collapsible { display: none; }
#main_workarea.collapsed #triklet_browser_table_wrapper                       { width: calc(100% - 10px); }

#main_workarea .close_conversation_button.full        { text-align: center; padding-top: 20px; padding-right: 15px; }
#main_workarea .close_conversation_button.full button { width: calc(100% - 20px); font-size: 12pt; }

#main_workarea           .close_conversation_button   { display: none; }
#main_workarea.collapsed .close_conversation_button   { display: block; }

/* Conversation */

#triklet_conversation { display: none; min-height: 300px; border-left: 2px solid silver; }

#triklet_conversation .panel            { white-space: nowrap; border-bottom: 2px solid silver;
                                          padding: 20px 0 20px 20px; }
#triklet_conversation .title            { margin-top: 0; padding-top: 0; }

#triklet_conversation .panel:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

#triklet_conversation .panel .icon     { display: inline-block; white-space: normal; }
#triklet_conversation .panel .contents { display: inline-block; white-space: normal;
                                         margin-left: 10px; width: calc(100% - 57px) }
#triklet_conversation .panel.internal  { background-color: #fffebe; padding-left: 20px; padding-right: 20px; }

#triklet_conversation .panel .icon .user_avatar { width: 42px; }

#triklet_conversation .panel .contents .infos { font-family: arial, helvetica, sans-serif;
                                                font-size: 10pt; margin-bottom: 5px; color: grey; }

#triklet_conversation .panel .contents .infos > span            { margin-right: 10px; }
#triklet_conversation .panel .contents .infos > span:last-child { margin-right: 0; }

#triklet_conversation .panel .contents .text *:first-child { margin-top: 0; padding-top: 0; }
#triklet_conversation .panel .contents .text *:last-child  { margin-bottom: 0; padding-bottom: 0; }

#triklet_conversation .title .contents textarea { font-size: 14pt; min-height: 42px; }

#triklet_conversation .title .contents .status_options input[type="radio"] { display: none; }

#triklet_conversation .panel .contents .field            { margin-bottom: 10px; }
#triklet_conversation .panel .contents .field:last-child { margin-bottom: 0; }

#current_account_mini_profile                    { margin-top: 0; }
#current_account_mini_profile .icon              { display: inline-block; white-space: normal; }
#current_account_mini_profile .icon .user_avatar { width: 42px; }
#current_account_mini_profile .contents          { display: inline-block; white-space: normal;
                                                   margin-left: 10px; width: calc(100% - 57px) }

#current_account_mini_profile .field { font-family: Arial, Helvetica, sans-serif; font-size: 10pt;
                                       margin-top: 5px; }
#current_account_mini_profile .field .input { margin-left: 18px; }
#current_account_mini_profile .field.principal_data { font-size: 12pt; }

#triklet_conversation .panel.close_conversation_button        { border-right: 0; text-align: right; }
#triklet_conversation .panel.close_conversation_button button { font-size: 12pt; }

#triklet_conversation .panel.is_view { opacity: 0.5; }

/* Stuff disabling */

#triklet_conversation[data-ticket-status="cancelled"] #new_message_form ,
#triklet_conversation[data-ticket-status="solved"]    #new_message_form ,
#triklet_conversation[data-ticket-status="closed"]    #new_message_form { display: none; }

#triklet_conversation[data-ticket-status="cancelled"] #conversation_category_trigger .pseudo_link { display: none; }

/* Side by side */

#main_workarea.collapsed #triklet_browser      { display: inline-block; width: 30%; }
#main_workarea.collapsed #triklet_conversation { display: inline-block; width: 70%; }

/* Addition to hide the entire browser when viewing conversations */
#main_workarea[data-hide-split-browser="true"].collapsed #triklet_browser #triklet_browser_table_wrapper { display: none; }

#current_account_mini_profile                          { display: none; }
#main_workarea.collapsed #current_account_mini_profile { display: block; width: calc(100% - 10px); }

/* Mobile devices */

@media all and (max-width: 700px)
{
    #main_workarea.collapsed #triklet_browser      { display: block; width: 100%; }
    #main_workarea.collapsed #triklet_conversation { display: block; width: 100%;
                                                     border-left: none; margin-left: 0; padding-left: 0; }
    
    #main_workarea.collapsed #current_account_mini_profile { width: 100%; }
    #main_workarea.collapsed #triklet_browser #triklet_browser_table_wrapper { display: none; }
    #main_workarea .close_conversation_button.full { padding-top: 0; padding-bottom: 20px; padding-right: 0; }
}

/* Browser row colors */

#triklet_browser_table tr[data-status="open"]       td { color: green; }
#triklet_browser_table tr[data-status="waiting"]    td { color: rebeccapurple; }
#triklet_browser_table tr[data-status="solved"]     td { color: mediumblue; }
#triklet_browser_table tr[data-status="closed"]     td { color: grey; }
#triklet_browser_table tr[data-status="cancelled"]  td { color: #b97676; }
#triklet_browser_table tr[data-writing-lock="1"]    td { color: #FF0080; }

/* ETC */

.triklet_thumbnails_container .thumbnail {
    white-space: normal;
    display: inline-block;
    border: 1px solid;
    width: 192px; height: 108px;
    line-height: 106px;
    overflow: hidden;
    background: transparent center center no-repeat;
    background-size: cover;
}

.triklet_thumbnails_container .thumbnail_wrapper {
    display: inline-block;
    white-space: nowrap;
    position: relative;
}

.triklet_thumbnails_container .direct_download {
    position: absolute; top: 3px; left: 170px;
    color: white; font-size: 16px;
    text-shadow: -1px -1px  2px black,
                  1px -1px  2px black,
                  1px  1px  2px black,
                  -1px  1px  2px black,
                  2px 2px 4px black;
}

.triklet_thumbnails_container .thumbnail .info {
    display: inline-block;
    background-color: rgba(0, 0, 0, .66);
    vertical-align: bottom;
    padding: 4px 2px; width: 192px;
    color: white; text-decoration: none;
    font-family: Arial, Helvetica, sans-serif; font-weight: bold;
    font-size: 8pt; line-height: 10pt;
    text-shadow: 2px 2px 2px black;
}

.triklet_thumbnails_container .thumbnail.document {
    width: 106px;
    background-image: url('document-256.png');
}

.triklet_thumbnails_container .thumbnail.document .info {
    width: 106px;
}

body[data-page-tag="triklet_index"] #triklet_user_welcome_message { display: none; }