// Basic
$base-color                 : #cbcbcb;
$active-color               : #688AD2;
$base-gradient              : 'matte';
$include-default-icons      : false;
$include-default-uis        : false;

// Toolbar
$toolbar-icon-size          : 1.0em;

// Image default icons
$icons-default-size         : 24px;
$icons-default-image-width  : 72px;
$icons-default-image-height : 144px;

@import 'sencha-touch/default';

@import 'sencha-touch/default/src/Class';
@import 'sencha-touch/default/src/Button';
//@import 'sencha-touch/default/src/Panel';
@import 'sencha-touch/default/src/Sheet';
@import 'sencha-touch/default/src/MessageBox';
@import 'sencha-touch/default/src/Toolbar';
//@import 'sencha-touch/default/src/Toast';
//@import 'sencha-touch/default/src/Menu';
//@import 'sencha-touch/default/src/carousel/Carousel';
@import 'sencha-touch/default/src/form/Panel';
//@import 'sencha-touch/default/src/form/FieldSet';
//@import 'sencha-touch/default/src/field/Field';
//@import 'sencha-touch/default/src/field/Checkbox';
//@import 'sencha-touch/default/src/field/Radio';
//@import 'sencha-touch/default/src/field/Search';
//@import 'sencha-touch/default/src/field/Select';
//@import 'sencha-touch/default/src/field/Slider';
//@import 'sencha-touch/default/src/field/Spinner';
//@import 'sencha-touch/default/src/field/TextArea';
//@import 'sencha-touch/default/src/dataview/IndexBar';
//@import 'sencha-touch/default/src/dataview/List';
//@import 'sencha-touch/default/src/picker/Picker';
//@import 'sencha-touch/default/src/plugin/ListPaging';
//@import 'sencha-touch/default/src/plugin/PullRefresh';
//@import 'sencha-touch/default/src/slider/Slider';
//@import 'sencha-touch/default/src/slider/Toggle';
//@import 'sencha-touch/default/src/tab/Panel';
//@import 'sencha-touch/default/src/grid/Grid';

@import 'common-buttons';
@import 'common-toolbar';

@import 'application-mixins';

@include common-toolbar-ui('edit', $base-color);
@include common-toolbar-ui('search', $base-color);

@include application-icon-normal('share',         0);
@include application-icon-normal('search',        1);
@include application-icon-normal('fullscreen',    1);
@include application-icon-normal('right',         2);
@include application-icon-normal('left',          3);
@include application-icon-normal('play',          4);
@include application-icon-normal('pause',         5);

@include common-button-ui('base',       $base-color);
@include common-button-ui('light',      lighten($base-color, 100%));
@include common-button-ui('base-blue',  $active-color, 'dark');
@include common-button-ui('back',       $base-color);

/*
 *  unsupport
 */

//TODO: need retina resolution
.unsuported-view {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: url(../img/ios-only.png) no-repeat center #efefef;
    background-attachment: fixed;
    z-index: 90000;
}

/*
 * Additional styles
 */

.x-button.text-offset-12 {
  padding-left: 12px;
  padding-right: 12px;
}

.x-button.text-offset-30 {
  padding-left: 30px;
  padding-right: 30px;
}