.ui-dialog.scenario-upload .ui-dialog-titlebar { background: #e0e0a0 ; }
#scenario-upload-dialog { display: flex ; flex-direction: column ; padding: 1em !important ; overflow-y: hidden ; }

#scenario-upload-dialog label { display: inline-block ; width: 5.75em ; font-weight: bold ; }
#scenario-upload-dialog .row { margin-bottom: 2px ; }
#scenario-upload-dialog .hint { font-style: italic ; color: #888 ; }
#scenario-upload-dialog .row .hint { margin-left: 0.5em ; font-size: 80% ; font-style: italic ; color: #666 ; }
#scenario-upload-dialog .row .hint a { color: #666 ; }

#scenario-upload-dialog .scenario-id { font-size: 80% ; font-style: italic ; color: #666 ; }
#scenario-upload-dialog .asa-id { font-size: 70% ; font-style: italic ; color: #666 ; }
#scenario-upload-dialog .auth { margin: 0.25em 0 1em 0 ; }
#scenario-upload-dialog .disclaimer { margin-top: 1em ; font-size: 80% ; font-style: italic ; color: #444 ; }

#scenario-upload-dialog img.remove { height: 12px ; position: absolute ; top: 5px ; right: 5px ; z-index: 5 ; cursor: pointer ; }

#scenario-upload-dialog .grid { flex: 1 ; display: flex ; }
#scenario-upload-dialog .grid .left { flex: 4 ; margin-right: 1em ; }
#scenario-upload-dialog .grid .right { flex: 6 ; }

#scenario-upload-dialog .vsav-container {
    position: relative ;
    padding: 1em ;
    border: 1px solid #888 ; border-radius: 5px ;
    background: #f8f8f8 ;
}
#scenario-upload-dialog .vsav-container .hint { display: flex ; }
#scenario-upload-dialog .vsav-container .hint img {
    margin-right: 0.5em ; height: 2em ; opacity: 0.7 ;
}
#scenario-upload-dialog .vsav-container .file-info { display: flex ; }
#scenario-upload-dialog .vsav-container .file-info img {
    margin-right: 0.5em ; height: 2em ; opacity: 0.8 ;
}
#scenario-upload-dialog .vsav-container .file-info .name { font-size: 80% ; font-family: monospace ; color: #444 ; }

#scenario-upload-dialog .screenshot-container {
    display: flex ; flex-direction: column ; justify-content: center ;
    height: 100% ;
    border: 1px solid #888 ; border-radius: 5px ;
    background: #f8f8f8 ;
    position: relative ;
}
#scenario-upload-dialog .screenshot-container .hint { display: flex ; justify-content: center ; align-items: center ; }
#scenario-upload-dialog .screenshot-container .hint img {
    float: left ; margin-right: 0.5em ; height: 2.5em ; opacity: 0.6 ;
}
#scenario-upload-dialog .screenshot-container .preview {
    display: flex ; flex-direction: column ; align-items: center ; justify-content: center ;
    height: calc( 100% - 10px ) ;
    margin: 5px ;
}
#scenario-upload-dialog .screenshot-container .preview img {
    object-fit: scale-down ; max-width: 100% ; max-height: 100% ;
    border: 1px dotted #aaa ;
}
