@import "../../themes/native/native.globals.md";

// Material Design Searchbar
// --------------------------------------------------

/// @prop - Padding top of the searchbar
$searchbar-md-padding-top: 8px;

/// @prop - Padding end of the searchbar
$searchbar-md-padding-end: $searchbar-md-padding-top;

/// @prop - Padding bottom of the searchbar
$searchbar-md-padding-bottom: $searchbar-md-padding-top;

/// @prop - Padding start of the searchbar
$searchbar-md-padding-start: $searchbar-md-padding-end;

/// @prop - Background of the searchbar
$searchbar-md-background: inherit;

/// @prop - Color of the searchbar cancel button
$searchbar-md-cancel-button-color: $text-color-step-100;

/// @prop - Background color of the searchbar cancel button
$searchbar-md-cancel-button-background-color: transparent;

/// @prop - Font size of the searchbar cancel button
$searchbar-md-cancel-button-font-size: 1.5em;

/// @prop - Color of the searchbar input search icon
$searchbar-md-input-search-icon-color: $text-color-step-400;

/// @prop - Size of the searchbar input search icon
$searchbar-md-input-search-icon-size: dynamic-font(21px);

/// @prop - Height of the searchbar input
$searchbar-md-input-height: auto;

/// @prop - Line height of the searchbar input
$searchbar-md-input-line-height: 30px;

/// @prop - Box shadow of the searchbar input
$searchbar-md-input-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2),
  0 1px 5px 0 rgba(0, 0, 0, 0.12);

/// @prop - Color of the searchbar input text
$searchbar-md-input-text-color: $text-color-step-150;

/// @prop - Background of the searchbar input
$searchbar-md-input-background-color: $background-color;

/// @prop - Border radius of the searchbar input
$searchbar-md-input-border-radius: 2px;

/// @prop - Size of the searchbar input clear icon
$searchbar-md-input-clear-icon-size: dynamic-font(22px);