@import '../styles/theme.scss';

.root {
  // display: flex;
  // background: #{$paletteBackgroundPaper};
  // padding: #{$spacingUnit * 2}px;

  .header {
    display: flex;

    .left {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      flex: 1;

      .name,
      .note {
        width: 100%;
      }
    }
    .right {
      display: flex;
      justify-content: flex-end;
      align-items: center;

      .extra {
        margin: 0px #{$spacingUnit}px;
      }
    }
  }
  .body {
    margin: #{$spacingUnit * 3}px 0;
  }
  .footer {
    display: flex;
    justify-content: flex-end;
    .action {
      margin: 0 #{$spacingUnit}px;
      .button {
        font-size: #{0.875 * $typographyFontSize}px;
        text-transform: uppercase;
        font-weight: $typographyFontWeightMedium;
        font-family: 'Roboto', 'NotoSansCJKsc', 'Helvetica', 'Arial', sans-serif;
        // color: rgba(0, 0, 0, 0.87);
      }
    }
  }
}