// iOS Toolbar
// --------------------------------------------------

$toolbar-order-ios: (
  back-button: 10,
  menu-toggle: 20,
  primary: 30,
  title: 40,
  secondary: 50
);

$toolbar-ios-height:                        4.4rem !default;
$toolbar-ios-border-color:                  $toolbar-border-color !default;
$toolbar-ios-button-font-size:              1.7rem !default;
$toolbar-ios-title-font-size:               1.7rem !default;


.toolbar {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  min-height: $toolbar-ios-height;

  .toolbar-title {
    order: map-get($toolbar-order-ios, title);
  }

  .toolbar-primary-item {
    order: map-get($toolbar-order-ios, primary);
  }

  .toolbar-secondary-item {
    order: map-get($toolbar-order-ios, secondary);
  }

  [menu-toggle] {
    order: map-get($toolbar-order-ios, 'menu-toggle');
    margin-left: 10px;
  }

  ion-title {
    font-size: $toolbar-ios-title-font-size;
    font-weight: 500;
    text-align: center;
    margin-top: -2px;
  }

  .back-button {
    margin: 0 4px;
    min-height: 3.2rem;
    line-height: 1;
    order: map-get($toolbar-order-ios, 'back-button');
    overflow: inherit;
  }

  .back-button-icon {
    display: inherit;
    min-width: 20px;
    font-size: 3.2rem;
  }

  button,
  [button] {
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 5px;
    min-height: 32px;
  }

  button.icon-only,
  [button].icon-only {
    padding-right: 0;
    padding-left: 0;
  }

  button icon,
  [button] icon {
    padding: 0;
    min-width: 28px;
  }

}

&.hairlines .toolbar {
  border-bottom-width: 0.55px;
}