// 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/all';

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

@import 'application-mixins';

@include sencha-panel;
@include sencha-buttons;
@include sencha-toolbar;
@include sencha-toolbar-forms;
@include sencha-indexbar;
@include sencha-layout;
@include sencha-form;
@include sencha-msgbox;
@include sencha-loading-spinner;

@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;
}