.mainPanel {
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;

   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;

   -ms-flex-grow: 1;
   -webkit-flex-grow: 1;
   flex-grow: 1;

   min-width: 300px;
}
.optionsLabel {
   margin-top: 14px;

   margin-left: 5px;
   margin-right: 5px;

   margin-bottom: 2px;
}
.optionsBlock {
   border: 1px solid #999;
   background-color: #F7F8F9;
   padding-top: 12px;
   padding-left: 16px;
   padding-bottom: 3px;
   padding-right: 6px;

   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;

   -webkit-flex-direction: column;
   -ms-flex-direction: column;
   flex-direction: column;

   -ms-flex-grow: 1;
   -webkit-flex-grow: 1;
   flex-grow: 1;

   margin-top: 3px;
   margin-right: 5px;
   margin-left: 5px;
}
.optionsDirectionRow {
   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;
}
.optionsRow {
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;

   -webkit-flex-direction: row;
   -ms-flex-direction: row;
   flex-direction: row;

   -ms-flex-grow: 1;
   -webkit-flex-grow: 1;
   flex-grow: 1;

   height: 24px;
   margin-right: 10px;
}
.optionLabel {
   width: 54px;
}
.nameLabel {
   margin-top: 3px;
}
.nameTextBox {
   height: 22px;

   -ms-flex-grow: 1;
   -webkit-flex-grow: 1;
   flex-grow: 1;

   padding-left: 5px;
   padding-right: 5px;
}

@external rstudio-themes-dark;
@external rstudio-theme-aware-dialog;
@eval THEME_DARKGREY_INACTIVE org.rstudio.core.client.theme.ThemeColors.darkGreyInactiveBackground;
@eval THEME_DARKGREY_BORDER org.rstudio.core.client.theme.ThemeColors.darkGreyBorder;

.rstudio-themes-dark.rstudio-theme-aware-dialog .optionsBlock {
   border-color: THEME_DARKGREY_BORDER;
   background-color: THEME_DARKGREY_INACTIVE;
}
